body, html { color: rgba(255, 255, 255, .55); font-family: Arial, Helvetica, sans-serif; margin: 0; padding: 0; height: 100%; scroll-behavior: smooth; /*FireFox*/ scrollbar-width: none; /*IE10+*/ -ms-overflow-style: -ms-autohiding-scrollbar; } body { background-color: rgb(18, 18, 18); overflow: hidden; transition: padding-top 0.3s ease-in-out; padding-top: 53px; } section { height: 100%; } a { color: rgba(255, 255, 255, .75); } a:hover { color: rgba(255, 255, 255, .75); } #content { overflow: hidden; } ::-webkit-scrollbar { /*Chrome, Safari, Edge*/ display: none; } .scrolled-up { transform: translateY(0); transition: all 0.3s ease-in-out; } .bodyScrolled-up { padding-top: 53px; } .scrolled-down { transform: translateY(-100%); transition: all 0.3s ease-in-out; } .bodyScrolled-down { padding-top: 0px; } .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl { padding-right: 0; padding-left: 0; } /* Scrollbar */ .mb-container .mb-track { border-radius: 5px; } .mb-container .mb-track-y { right: 0; height: calc(100% - 5px); width: 5px; } .mb-container .mb-track .mb-bar { background-color: rgba(51, 51, 51, 0.75); } .mb-container .mb-track { background-color: transparent; } .navbar { margin-bottom: 0; border-radius: 0; } .smart-scroll { position: fixed; height: 52px; top: 0; right: 0; left: 0; width: 100%; z-index: 1030; } .navbar-toggler:focus { box-shadow: none; } .navbar-collapse { background-color: rgb(33, 37, 41); text-align: center; } .navbar-toggler:focus-visible { outline: none; } .row.content { height: 450px } .CenterDiv { margin: 1vw 10vw 0; } .LoginButton { color: rgba(255, 255, 255, .55); } .LoginButton:hover { color: rgba(255, 255, 255, .75); } .dropdown-menu { background-color: rgba(34, 39, 43) !important; } .dropdown-menu .dropdown-item { color: rgba(255, 255, 255, .50) !important; } .dropdown-menu .dropdown-item:hover { color: rgba(255, 255, 255, .75) !important; background-color: transparent !important; } .LoginModal .modal-header { padding: 0; border-bottom: 0; background-color: rgb(18, 18, 18); color: rgba(255, 255, 255, .75); } #RulesModal .modal-header { text-align: center; display: unset; padding: 0.5rem; } #RulesModal .modal-header h1 { font-weight: bolder; color: rgba(255, 255, 255, .75); } #RulesModal .modal-dialog-scrollable .modal-content { max-height: 75%; } #ModalRulesTabContent ul { color: rgb(204, 204, 204); list-style-type: none; padding-left: 0; } #ModalRulesTabContent ul li { position: relative; font: bold italic 45px/1.5 Helvetica, Verdana, sans-serif; } #ModalRulesTabContent li p { font: 16px/1.5 Helvetica, sans-serif; padding-left: 60px; color: rgba(255, 255, 255, .55); } #ModalRulesTabContent span { position: absolute; color: rgba(255, 255, 255, .75); } #pass_info { position: absolute; top: 300px; bottom: -90px; right: 22%; width: 250px; padding: 15px; background: rgb(254, 254, 254); font-size: .875em; border-radius: 5px; box-shadow: 0 1px 3px rgb(204, 204, 204); border: 1px solid rgb(221, 221, 221); display: none; } #pass_info::before { content: "\25B2"; position: absolute; top: -12px; left: 45%; font-size: 14px; line-height: 14px; color: #ddd; text-shadow: none; display: block; } #pass_info ul, li { margin:0; padding:0; list-style-type:none; } #pass_info h5 { margin:0 0 10px 0; padding:0; font-weight:normal; } .invalid { padding-left:22px; line-height:24px; color:rgb(236, 63, 65); } .invalidInput { border-color: rgb(219, 52, 52) !important; } .invalid::before { font-family: "FontAwesome"; content: '\f00d'; } .valid { padding-left:22px; line-height:24px; color:rgb(58, 125, 52); } .validInput { border-color: rgb(80, 219, 52) !important; } .valid::before { font-family: "FontAwesome"; content: '\f00c'; } .RulesModal .modal-header { text-align: center; } .modal-body { padding: 0 0; margin: 2vh 2vw; background-color: rgb(18, 18, 18); } .modal-content { background-color: rgb(18, 18, 18); box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 2px, rgba(0, 0, 0, 0.07) 0px 2px 4px, rgba(0, 0, 0, 0.07) 0px 4px 8px, rgba(0, 0, 0, 0.07) 0px 8px 16px, rgba(0, 0, 0, 0.07) 0px 16px 32px, rgba(0, 0, 0, 0.07) 0px 32px 64px; } .modal-backdrop { z-index: 1; } .nav-tabs { border-bottom: 1px solid rgb(80, 80, 80); } .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { color: rgba(255, 255, 255, .75); background-color: rgb(37, 37, 37); border-color: rgb(80, 80, 80); } .nav-tabs .nav-link { color: rgba(255, 255, 255, .55); } .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { border-color: rgb(80, 80, 80); color: rgba(255, 255, 255, .75); } .FullWidthModalTabs { display: table; width: 100%; height: 32px; table-layout: fixed; } .FullWithModalTabsItem { float: none; display: table-cell; } .FullWithModalTabsItem button { text-align: center; } .CloseIcon { width: 16px; height: 16px; background-color: transparent; color: rgba(255, 255, 255, .55); } .CloseIcon:hover { color: rgba(255, 255, 255, .75); } .btn-close:hover { fill: rgb(255, 0, 0); } .btn-close:focus { box-shadow: none; } .navbar-brand { padding-top: 0; padding-bottom: 0; } .CustomBrand { position: relative; text-align: center; height: 32px; } .CenteredTitle { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .box { background-color: rgb(18, 18, 18); } .box input[type="text"], .box input[type="password"] { border: 0; background: none; display: block; margin: 20px auto; text-align: center; border: 2px solid rgb(52, 152, 219); padding: 10px 10px; width: 250px; outline: none; color: rgba(255, 255, 255, .55); border-radius: 24px; transition: 0.25s; } .text-muted { margin-bottom: 5vh; color: rgba(255, 255, 255, .55) !important; } .box h1 { font-size: 3.2em; text-align: center; font-weight: 500; } .box input[type="text"]:focus, .box input[type="password"]:focus { width: 300px; } .box input[type="text"]:hover, .box input[type="password"]:hover { color: rgba(255, 255, 255, .75); } .box input[type="submit"] { border: 0; background: none; display: block; margin: 20px auto; text-align: center; border: 2px solid rgb(46, 204, 113); padding: 14px 40px; outline: none; color: rgba(255, 255, 255, .55); border-radius: 24px; transition: 0.25s; cursor: pointer; } .box input[type="submit"]:hover { background: rgb(46, 204, 113); color: rgba(255, 255, 255, .75); } .carousel-item img { margin: 0 auto; } @media only screen and (min-width: 1280px) { .CustomRow { display: none } .SmallScreenDouImages { display: block; } } @media only screen and (min-width: 414px) { .carousel-item img { height: 320px; width: 320px !important; } } @media only screen and (min-width: 1366px) { .carousel-item img { height: 525px; width: 576px !important; } } @media only screen and (min-width: 1920px) { .carousel-item img { height: 576px; width: 720px !important; margin: 0 auto; } } @media screen and (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } } /*slideshow effekt*/ .image_img { display: block; width:100%; } .image_overlay{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); color: rgb(255, 255, 255); font-family: Arial; display: flex; flex-direction: column; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.25s; } .image_overlay > *{ transform: translateY(20px); transition: transform 0.25s; } .image_overlay:hover{ opacity: 1; } .image_overlay:hover > * { transform: translateY(0); } .image_title { font-size: 2em; font-weight: bold; } image_gruppenavn{ font-size: 1.25em; margin-top: 0.25em; } /* slide show effekt slut*/ /*Kategori spil*/ .Collapsible { background-color: rgb(18, 18, 18); color: rgba(255, 255, 255, .55); cursor: pointer; padding: 18px; width: 100%; border: none; text-align: left; outline: none; font-size: 15px; width: 33.333%; } .CollapsibleContent { padding: 0 18px; display: none; overflow: hidden; background-color: rgb(18, 18, 18); } .left_text{ float: left; } .center_text{ display: inline-block; margin: 0 auto; } .right_text{ float: right; } #hjem { padding-top: 0; } #header { position: fixed; height: 52px; top: 0; width: 100%; z-index: 100; transition: all .3s ease; box-shadow: 0 1px 25px rgba(0,0,0, .1); } #header.hide { top: -56px; } .GradientDivider { margin: 16px 0 16px 0; display: block; border: none; height: 3px !important; background: rgb(0, 113, 185) !important; background: linear-gradient(to right, rgb(18, 18, 18), rgb(0, 113, 185), rgb(38, 171, 255), rgb(0, 113, 185), rgb(18, 18, 18)) !important; opacity: 1; } /*Kalender*/ .container { width: 100%; height: 100vh; color: rgb(238, 238, 238); display: flex; justify-content: center; align-items: center; } .calendar { width: 45rem; height: 52rem; background-color: rgb(34, 34, 39); box-shadow: 0 0.5rem 3rem rgba(0, 0, 0, 0.4); border-radius: 20px; } .month { width: 100%; height: 12rem; background-color: #01579b; display: flex; justify-content: space-between; align-items: center; padding: 0 2rem; text-align: center; text-shadow: 0 0.3rem 0.5rem rgba(0, 0, 0, 0.5); border-top-left-radius: 20px; border-top-right-radius: 20px; } .month i { font-size: 2.5rem; cursor: pointer; } .month h1 { font-size: 3rem; font-weight: 400; text-transform: uppercase; letter-spacing: 0.2rem; margin-bottom: 1rem; } .month p { font-size: 1.6rem; } .weekdays { width: 100%; height: 5rem; padding: 0 0.4rem; display: flex; align-items: center; } .weekdays div { font-size: 1.5rem; font-weight: 400; letter-spacing: 0.1rem; width: calc(44.2rem / 7); display: flex; justify-content: center; align-items: center; text-shadow: 0 0.3rem 0.5rem rgba(0, 0, 0, 0.5); } .days { width: 100%; display: flex; flex-wrap: wrap; padding: 0.2rem; border-radius: 50%; } .days div { font-size: 1.4rem; margin: 0.3rem; width: calc(40.2rem / 7); height: 5rem; display: flex; justify-content: center; align-items: center; text-shadow: 0 0.3rem 0.5rem rgba(0, 0, 0, 0.5); transition: background-color 0.2s; border-radius: 50%; } .days div:hover{ background-color: #01579b; border: 0.2rem solid rgb(119, 119, 119); cursor: pointer; border-radius: 50%; } .prev-date, .next-date { opacity: 0.5; } .today { background-color: #01579b; border-radius: 50%; } /*Kalender slut*/ #return-to-top { position: fixed; bottom: 20px; right: 20px; background: rgba(73, 122, 255, .8); width: 50px; height: 50px; display: block; text-decoration: none; -webkit-border-radius: 35px; -moz-border-radius: 35px; border-radius: 35px; display: none; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } #return-to-top:hover { background: rgb(73, 122, 255); } #return-to-top i { color: rgba(255, 255, 255, .75);; margin: 0; position: relative; font-size: 30px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; top: 8px; } #return-to-top:hover i { color: rgba(255, 255, 255, .55);; top: 5px; }