
/* ------ Variables ------ */



/* ------ Main ------ */
html, body {background-color: #f9f9f9!important; font-family: 'Muli', sans-serif; font-size: 18px; line-height: 1.5; letter-spacing: .3px; font-weight: 400; color: #000000; overflow-x: hidden;}

/* ------ Paragraphs ------ */
h1 {color: #ffaa0a; margin-top: 20px; margin-bottom: 10px; font-weight: 700;}
h2 {color: #ffaa0a; margin-top: 20px; margin-bottom: 10px; font-weight: 700;}
h3 {color: #ffaa0a; margin-top: 20px; margin-bottom: 10px; font-weight: 700;}
h4 {color: #ffaa0a; margin-top: 20px; margin-bottom: 10px;}
h5 {color: #000000; margin-top: 10px; margin-bottom: 10px;}
h6 {color: #000000; margin-top: 10px; margin-bottom: 10px;}

a {color: #ffaa0a; text-decoration: none;}
a:hover {color: #393939; border-bottom:none; text-decoration: none;}

a img {opacity: 1; moz-transition: all .2s; -webkit-transition: all .2s; -o-transition: all .2s; -ms-transition: all .2s; transition: all .2s;}
a img:hover {opacity: .5;}

strong {font-weight: 700;}
blockquote {font-style: normal; padding: 0;}

::-moz-selection {color: #ffffff; background: #ffaa0a;}
::selection {color: #ffffff; background: #ffaa0a;}

img {box-shadow: 10px 10px rgba(0, 0, 0, 0.1)}

hr {height: 3px; background-color: #868686; color: #868686; border: 0;}

.text-primary {color:#ffaa0a!important;}
.text-secondary {color:#868686!important;}
.text-info {color:#17a2b8!important;}
.text-success {color:#28a745!important;}
.text-warning {color:#ffc107!important;}
.text-danger {color:#dc3545!important;}
.text-light {color:#ffffff!important;}
.text-dark {color:#000000!important;}
.text-muted {color:#6c757d!important;}

/* ------ Styling: Buttons etc. ------ */
.btn {border: none; letter-spacing: 2px; font-size: 0.7rem; padding: 15px 30px; text-transform: uppercase; border-radius: 30px; }

.btn-primary {background-color:#ffaa0a; color:#ffffff!important;}
.btn-primary:hover {background: #000000;}
.btn-secondary {background-color:#868686; color:#ffffff!important;}
.btn-secondary:hover {background: #000000;}
.btn-info {background-color:transparent; color:#ffffff!important; border: 1px solid #ffffff!important;}
.btn-info:hover {background-color:#ffffff!important; color:#000000!important;}
.btn-success {background-color:#28a745; color:#ffffff!important;}
.btn-success:hover {background-color:#000000;}
.btn-warning {background-color:#ffc107; color:#ffffff!important;}
.btn-warning:hover {background-color:#868686;}
.btn-danger {background-color:#dc3545; color:#ffffff!important;}
.btn-danger:hover {background-color:#000000;}
.btn-light {background-color:#ffffff; color:#000000!important;}
.btn-light:hover {background-color:#ffffff;}
.btn-dark {background-color:#000000; color:#ffffff!important;}
.btn-dark:hover {background-color:#ffffff;}

.text-light p {color: #ffffff;}
.text-light h1, .text-light h2, .text-light h3, .text-light h4, .text-light h5, .text-light a, .text-light a:hover {color: #ffffff!important;}
.text-light hr {background-color: #ffffff; color: #ffffff;}
.text-light .btn-info:hover {color:#000000!important;}

.bg-primary {background-color: #ffaa0a;}
.bg-secondary {background-color: #868686;}
.bg-dark {background-color: #000000;}
.bg-light {background-color: #ffffff;}
.bg-info {background-color: #17a2b8;}
.bg-success {background-color: #28a745;}
.bg-danger {background-color: #dc3545;}
.bg-warning {background-color: #ffc107;}
.bg-custom1 {background-color: #f9f9f9;}
.bg-custom2 {background-color: ;}
.bg-custom3 {background-color: ;}

/* ------ Grid  ------ */

.container {width: 100%; padding: 0;}
.container-fluid {padding: 0; margin-top: 100px;}
.block-section > .block-section-container {padding: 0; width: 1100px;}
.block-section .block-section-container .block-columns .block-section-container {width: auto;}
.block-section {width: 100%!important; max-width: 100%; position: relative; padding: 30px 0 30px 0;}

.block-section.bg-image {background-position: center center;}

main ul {margin: 10px 0 0 0; list-style: none; padding-left: 0!important;}
main ul li {margin: 5px 0;}
main ul li:before {content: "\f00c"; font-family: "Font Awesome 5 Free"; font-weight: 900; padding: 0 10px 0 0; color: #ffaa0a;}

footer {padding: 15px 0; background: #000000; border-top: 15px solid #ffaa0a; border-bottom: 15px solid #ffaa0a;}

/* ------ Navbar ------ */
.navbar {background-color: #000000; height: 100px}
.navbar-brand img {width: 350px; padding: 10px; box-shadow: none!important;}
.navbar a {border: none; text-transform: none;}
.navbar .navbar-toggler {color: #ffaa0a!important;}
.navbar .navbar-nav .nav-link {color: #ffffff; letter-spacing: 1px; padding: 10px 15px; margin-left: 25px;}
.navbar .navbar-nav .nav-link:hover {color: #ffffff!important; background: #ffaa0a!important; border-radius: 15px;}
.navbar .navbar-nav .nav-item.active .nav-link {color: #ffffff!important; background: #ffaa0a!important; border-radius: 15px;}
.navbar .navbar-nav .has_childs .nav-link:after {content: "\f0d7"; font-family: "Font Awesome 5 Free"; font-weight: 900; padding: 0 0 0 10px; border: none; margin: 0; vertical-align: baseline;}
.navbar .navbar-nav .has_childs.show .nav-link:after {content: "\f0d8"; transform: rotate(0);}

/* ------ Sliders ------ */
.main-slider {padding: 0;}
.main-slider .block-section-container {padding: 0;}

.main-slider .carousel-item img {padding: 0;  object-fit: cover; }
.main-slider .carousel-control {width: 150px; text-shadow: 0 0 0 rgba(0,0,0,0); }
.main-slider .carousel-indicators li {margin: 0 10px; border: 2px solid #ffffff; width: 14px; height: 14px; border-radius: 7px;}

.main-slider .block-gallery .carousel .carousel-caption {left: 0; top: auto; bottom: 0; right: auto; width: 800px; margin: 0; padding: 100px; background: rgba(0,0,0,0);}
.main-slider .block-gallery .carousel .carousel-caption > h3 {padding: 0; color: #ffffff; text-shadow: 2px 2px 20px #000000; margin-bottom: 0;}
.main-slider .block-gallery .carousel .carousel-caption > p {margin: 0; padding: 10px 0 0 0; color: #ffffff; font-size: .75rem; letter-spacing: 3px; text-transform: uppercase; text-shadow: 0 0 0 transparent;}
.main-slider .block-gallery .carousel .carousel-caption > .btn {margin: 20px 0 0 0;}

.block-gallery .carousel .carousel-caption h3 {text-shadow: 2px 2px 20px #000000;}
.block-gallery .carousel .carousel-caption p {text-shadow: 2px 2px 20px #000000;}

/* --- Utilities  --- */
.list-group {margin: 30px 0 0 0; border-top: 2px solid $gray-6;}
.list-group .list-group-item {border-radius: 0; padding: 15px 30px; border: none; border-bottom: 2px solid $gray-6; background-color: transparent;}
.list-group .list-group-item-action {font-style: normal;}
.list-group .list-group-item-action:after {content: "\f105"; font-family: "Font Awesome 5 Free"; color: #ffaa0a; font-weight: 900; float: right;}
.list-group .list-group-item-action:hover {background: $gray-6;}

/* --- Custom --- */

.block-list-group.accordion .card {box-shadow: 0 1px 1px rgba(0,0,0,.05); padding: 0; border: none; border-radius: 0; background: $custom6; margin-bottom: 5px; -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);;  moz-transition: all .2s; -webkit-transition: all .2s; -o-transition: all .2s; -ms-transition: all .2s; transition: all .2s;}
.block-list-group.accordion .card .card-header {padding: 0; border: none; background: transparent;}
.block-list-group.accordion .card .card-header h5 {margin: 0 !important;}
.block-list-group.accordion .card .card-header h5 .btn {width: 100%; text-align: left; margin: 0; font-style: normal; text-transform: none; font-weight: 700; font-size: 1rem; line-height: 1.9; color: #393939; letter-spacing: .3px; display: block; border: none; text-decoration: none;}
.block-list-group.accordion .card .card-header h5 .btn:before {content: "\f067"; font-family: "Font Awesome 5 Free"; margin-right: 10px; font-weight: 900; float: left; color: #ffaa0a;}

/* --- Responsiveness  --- */

@media (max-width: 1920px) {
    html, body {font-size: 16px;}
}

@media (max-width: 1280px) {
    .block-section > .block-section-container, .container {padding: 0; width: 1050px;}
    .navbar-brand img {width: 250px;}
}

@media (max-width: 1170px) {
    .block-section > .block-section-container, .container {padding: 0; width: 950px;}
    .block-gallery .carousel .carousel-caption > h3 {font-size: 50px; line-height: 70px;}
    .navbar-brand img {width: 200px;}
    .navbar .navbar-nav .nav-link {margin-left: 10px;}
}

@media (max-width: 992px) {
    .block-section > .block-section-container, .container {padding: 0; width: 750px;}
    .block-gallery .carousel .carousel-caption > h3 {font-size: 40px; line-height: 60px;}
    
}

@media (max-width: 767px) {
    .block-section > .block-section-container, .container {padding: 0 15px; width: 100%;}
    .navbar {padding: 0;}
    .navbar .navbar-nav {margin-top: 15px;}
    .navbar .navbar-brand img {margin-left: 15px; padding: 0px;}
    .navbar .navbar-toggler {margin-right: 15px; color: #ffaa0a;}
    .navbar .navbar-nav .nav-link {border-radius: 0!important; margin: 0; padding: 15px 20px; font-size: 1.3rem; border-bottom: 1px solid $custom6 !important; background: #ffffff; color: #000000 !important;}
    .navbar .navbar-nav .nav-item.active .nav-link {background: #ffaa0a; color: #ffffff !important;}

    .block-gallery .carousel .carousel-caption {top: 5%;}
    .block-gallery .carousel .carousel-caption > h3 {font-size: 25px; line-height: 35px;}
}

@media (max-width: 500px) {
    .block-gallery .carousel .carousel-caption .btn {display: none!important;}
}

@media (max-width: 400px) {
    .block-gallery .carousel .carousel-caption {top: 0!important;}
    .block-gallery .carousel .carousel-caption > h3 {font-size: 20px; line-height: 25px;}
}