html,

body {

    font-family: 'Sarabun', sans-serif;

    font-weight: 200;

    color: #ffffff;

}



body {

    background-color: #000000;

}



a:hover,

a:visited,

a:link,

a:active {

    color: #a8dadc;

    text-decoration: none;

}



html {

    font-size: 0.7rem;

}


.adsfooter {
    position: fixed;
    bottom: 0;
    z-index: 9;
    margin: auto;
    left: 0;
}
.adsfooter2 {
    position: fixed;
    bottom: 0;
    z-index: 9;
    margin: auto;
    right: 0;
}

.heading--decor {

    width: 6px;

    height: 30px;

    background: linear-gradient(180deg, #f80, #ea3c2a);

    left: 0;

    top: 0;

    border-radius: 20px;

    height: 40px;

    width: 8px;

}



.bg-image {

    width: 100%;

    height: 100%;

    position: fixed;

    display: block;

    z-index: -100;

    top: 0;

    left: 0;

    -webkit-filter: brightness(60%);

    filter: brightness(60%);

    background-attachment: fixed;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

}



.bg-image-overay {

    width: 100%;

    height: 100%;

    position: fixed;

    display: block;

    z-index: -99;

    top: 0;

    left: 0;

    background-attachment: fixed;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

}





/* Side Menu */



#sidebar-wrapper {

    z-index: 2000;

    position: fixed;

    right: 0;

    width: 250px;

    height: 100%;

    transform: translateX(250px);

    overflow-y: auto;

    background: rgba(24,24,24,1);

    -webkit-transition: all 0.4s ease 0s;

    -moz-transition: all 0.4s ease 0s;

    -ms-transition: all 0.4s ease 0s;

    -o-transition: all 0.4s ease 0s;

    transition: all 0.4s ease 0s;

}



.sidebar-nav {

    position: absolute;

    top: 0;

    width: 250px;

    margin: 0;

    padding: 0;

    list-style: none;

}



.sidebar-nav li {

    text-indent: 20px;

    line-height: 40px;

}



.sidebar-nav li a {

    display: block;

    text-decoration: none;

    color: #999;

}



.sidebar-nav li a:hover {

    text-decoration: none;

    color: #fff;

    background: rgba(255, 255, 255, 0.2);

}



.sidebar-nav>.sidebar-brand {

    height: 55px;

    font-size: 18px;

    line-height: 55px;

}



.sidebar-nav>.sidebar-brand a {

    color: #999;

}



.sidebar-nav>.sidebar-brand a:hover {

    color: #fff;

    background: none;

}



#menu-toggle {

    z-index: 1050;

    position: fixed;

    top: 0;

    right: 0;

}



#sidebar-wrapper.active {

    right: 250px;

    width: 250px;

    -webkit-transition: all 0.4s ease 0s;

    -moz-transition: all 0.4s ease 0s;

    -ms-transition: all 0.4s ease 0s;

    -o-transition: all 0.4s ease 0s;

    transition: all 0.4s ease 0s;

}



.toggle {

    margin: 5px 5px 0 0;

}



.square {

    padding: 8px;

    display: block;

    margin: 12px;

}



.wl a {

    color: #91a9cf;

}



h1 {

    font-size: 1.2rem;

}



h2 {

    font-size: 1.1rem;

}



@media (min-width: 768px) {

    html {

        font-size: 1.1rem;

    }

    h1 {

        font-size: 1.3rem;

    }

    h2 {

        font-size: 1.2rem;

    }

}



@media (min-width: 991px) {

    html {

        font-size: 1.2rem;

    }

    h1 {

        font-size: 1.5rem;

    }

    h2 {

        font-size: 1.4rem;

    }

}



@media (min-width: 1200px) {

    html {

        font-size: 1.2rem;

    }

    h1 {

        font-size: 1.7rem;

    }

    h2 {

        font-size: 1.6rem;

    }

}