:root {
    --powder:#f4ebe5;
    --rose: #ecd4d0;
    --grey: #616161;
    --font: 'Playfair Display';
}

html{
    background: var(--bs-light);
}

body{
    min-height: 100vh;
    max-width:100vw;    
    background: var(--powder);
    background: -moz-linear-gradient(-60deg, var(--rose) 20%, var(--bs-light)  20%);
    background: -webkit-linear-gradient(-60deg, var(--rose) 20%, var(--bs-light)  20%);
    background: linear-gradient(150deg, var(--rose) 30%, var(--bs-light)  30%);
    background-repeat: no-repeat;
}
.grecaptcha-badge{
    z-index:5001;
}
.article{
    position:absolute;
    background: linear-gradient(60deg, var(--powder) 22%, transparent 22%);
    min-height: 100vh;
    /*overflow:hidden;*/
    min-width:100%;
    z-index: 1000;
}
.nofocus:focus {
    box-shadow: none;
}
.scroll-container{
    height: 78vh;
    overflow-y:auto;
}
.no-scrollbar::-webkit-scrollbar { 
    display: none;
}
.pointer{
    cursor:pointer;
}
.content h1,h2,h3,h4,h5,h6{
    color: var(--grey);
}
.card{
    border: 1px solid rgba(0,0,0,.5) !important;
}
.card-header, .card-footer {
    background-color: var(--powder);
}

.header{
    font-family: var(--font), serif;
    font-weight: 300;
    line-height: 1.2;
}
.navbar-brand{
    font-family: var(--font), serif;
    font-size:60px;
    color: var(--grey) !important;
}

#footer{
    right:70%;
}
#footer-container{
    position:static;
}
.carousel{
    z-index:1050;
}
.carousel-indicators li{
    background-color: var(--grey) !important;
    height: 5px !important;
}
.carousel-inner{
    height: 250px;
}
.carousel-caption{
    top: 50%;
}
.grey-text{
    color:#757575;
}

/* Custom for Kørebog */


#table-container{
    max-width:2000px;
}
#map{
    height:300px;
    width:100%;
}
#kb-container{
    width:100%;
    min-height:100vh;
    /*max-height:100vh;*/
    background-color: #333;
    color:#f7f7f7;
}

/* End Custom for Kørebog */

@media screen and (max-width: 1200px) {
    .carousel-inner{
        height: 350px;
    }
}

@media screen and (max-height: 768px){
     #carousel{
        width:75%;
        margin-left:25%;
    }
    #carousel h5{
        font-size:1rem;
    }    
}

@media screen and (max-width: 767px) {

    .fixed-bottom{
        position:initial;
        margin-top:25px;
    }
    .scroll-container{
        height: auto;
        overflow-y:visible;
    }
    #carousel{
        display:none;
    }
    .navbar-brand {
        font-size: 40px;
    }
    
    .ml-5{
        margin-left:15px!important;
    }
    #back-button{
        top:1rem;
    }
}