/* Add here all your CSS customizations */

h1, h2, h3, h4, h5, h6 {
    font-family: "Open Sans", Arial, sans-serif;
}

@font-face {
    font-family: Akrobat;
    src: local('Akrobat-Black.ttf'), url('../css/fonts/akrobat/Akrobat-Black.ttf');
}


/* ========== MENU ========== */
#header .header-body {
    background-color: #000247 !important;
}
#header .header-btn-collapse-nav {
    background: #f8d100 !important;
    color: #000247;
}

@media (max-width: 991px) {
    #header .header-nav-main:not(.header-nav-main-mobile-dark) nav > ul > li > a {
        color: #f8d100;
    }
    #header .header-nav-main.header-nav-main-mobile-dark nav > ul > li > a.active {
        background: #f8d100 !important;
        color: #000247 !important;
    }
    #header .header-nav-main.header-nav-main-mobile-dark nav > ul > li > a.active:focus, #header .header-nav-main.header-nav-main-mobile-dark nav > ul > li > a.active:hover {
        background: #f8d100 !important;
        color: #000247;
    }
    html #header.header-transparent .header-body.bg-dark .header-nav-main:before, html #header.header-transparent .header-body.bg-color-dark .header-nav-main:before {
        background-color: #000247;
    }
}

@media (min-width: 992px) {
    #header .header-nav.header-nav-links nav > ul:not(:hover) > li > a.active {
        color: #f8d100 !important;
    }
    #header .header-nav.header-nav-links nav > ul li:hover > a {
		color: #f8d100 !important;
	}
}
/* ========== FIM - MENU ========== */



/* ========== A ESCOLA ========== */
.a-escola {
    background-color: #f8d100 !important;
}
.a-escola h1 {
    font-size: 3.125rem;
    color: #000247 !important;
}
.a-escola, p {
    color: #000247 !important;
}
/* ========== FIM - A ESCOLA ========== */



/* ========== CURSOS ========== */
/* style="background-image: url(imagens/bg-curso-de-guitarra.jpg);" */
.curso-guitarra {
    background-image: url(../images/bg-curso-de-guitarra.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
.curso-guitarra h1 {
    font-family: Akrobat;
    font-size: 5rem;
    line-height: 5rem;
    font-weight: 900;
    letter-spacing: normal;
    color: white;
}
.curso-violao {
    background-image: url(../images/bg-curso-de-violao.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
.curso-violao h1 {
    font-family: Akrobat;
    font-size: 5rem;
    line-height: 5rem;
    font-weight: 900;
    letter-spacing: normal;
    color: white;
}
.curso-cavaquinho {
    background-image: url(../images/bg-curso-de-cavaquinho.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
.curso-cavaquinho h1 {
    font-family: Akrobat;
    font-size: 5rem;
    line-height: 5rem;
    font-weight: 900;
    letter-spacing: normal;
    color: white;
}
.curso-bateria {
    background-image: url(../images/bg-curso-de-bateria.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
.curso-bateria h1 {
    font-family: Akrobat;
    font-size: 5rem;
    line-height: 5rem;
    font-weight: 900;
    letter-spacing: normal;
    color: white;
}
.curso-saxofone {
    background-image: url(../images/bg-curso-de-saxofone.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
.curso-saxofone h1 {
    font-family: Akrobat;
    font-size: 5rem;
    line-height: 5rem;
    font-weight: 900;
    letter-spacing: normal;
    color: white;
}
.curso-teclado {
    background-image: url(../images/bg-curso-de-teclado.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
.curso-teclado h1 {
    font-family: Akrobat;
    font-size: 5rem;
    line-height: 5rem;
    font-weight: 900;
    letter-spacing: normal;
    color: white;
}
.curso-canto {
    background-image: url(../images/bg-curso-de-canto.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
.curso-canto h1 {
    font-family: Akrobat;
    font-size: 5rem;
    line-height: 5rem;
    font-weight: 900;
    letter-spacing: normal;
    color: white;
}
.curso-harmonia-funcional {
    background-image: url(../images/bg-curso-de-harmonia-funcional.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
.curso-harmonia-funcional h1 {
    font-family: Akrobat;
    font-size: 5rem;
    line-height: 5rem;
    font-weight: 900;
    letter-spacing: normal;
    color: white;
}

@media (max-width: 991px) {
    .curso-guitarra h1 {
        font-size: 2.7rem;
        line-height: 2.7rem;
        font-weight: 900;
        letter-spacing: normal;
    }
    .curso-violao h1 {
        font-size: 2.7rem;
        line-height: 2.7rem;
        font-weight: 900;
        letter-spacing: normal;
    }
    .curso-cavaquinho h1 {
        font-size: 2.7rem;
        line-height: 2.7rem;
        font-weight: 900;
        letter-spacing: normal;
    }
    .curso-bateria h1 {
        font-size: 2.7rem;
        line-height: 2.7rem;
        font-weight: 900;
        letter-spacing: normal;
    }
    .curso-saxofone h1 {
        font-size: 2.7rem;
        line-height: 2.7rem;
        font-weight: 900;
        letter-spacing: normal;
    }
    .curso-teclado h1 {
        font-size: 2.7rem;
        line-height: 2.7rem;
        font-weight: 900;
        letter-spacing: normal;
    }
    .curso-canto h1 {
        font-size: 2.7rem;
        line-height: 2.7rem;
        font-weight: 900;
        letter-spacing: normal;
    }
    .curso-harmonia-funcional h1 {
        font-size: 2.7rem;
        line-height: 2.7rem;
        font-weight: 900;
        letter-spacing: normal;
    }
}
/* ========== CURSOS ========== */



/* ========== GALERIA ========== */
.img-thumbnail.img-thumbnail-hover-icon:before {
    background: rgba(0, 2, 71, 0.65);
}
.owl-carousel .owl-nav button[class*="owl-"] {
    background-color: #f8d100;
    border-color: #f8d100 #f8d100 #829042;
    color: #000247;
}
.owl-carousel .owl-nav button[class*="owl-"]:hover, .owl-carousel .owl-nav button[class*="owl-"].hover {
    background-color: #000247; border: none !important;
    color: #f8d100;
}
/* ========== FIM - GALERIA ========== */



/* ========== EQUIPE ========== */
.equipe {
    background-color: #f8d100 !important;
    background: url("../images/bg-equipe.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.equipe h2 {
    color: #000247;
}
.team-item .team-infos {
    position: relative;
    background: #000247;
    color: #f8d100;
    padding: 5px;
}
.team-item .team-infos .share:after {
    background: #000247;
}
.team-item .team-infos .share:hover i.fa-share-alt {
    background: #f8d100;
    color: #000247;
}
.owl-carousel.custom-dots-position .owl-dots, .owl-carousel.custom-dots-position-2 .owl-dots {
    right: auto;
}
.owl-carousel.custom-dots-style-1 button.owl-dot.active span, .owl-carousel.custom-dots-style-1 button.owl-dot:hover span {
	position: relative;
	border: 2px solid #1b1464;
	background: transparent;
}
.owl-carousel.custom-dots-style-1 button.owl-dot.active span:before, .owl-carousel.custom-dots-style-1 button.owl-dot:hover span:before {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 3px;
	height: 3px;
	border-radius: 100%;
	background: #1b1464;
	-webkit-transform: translate3d(-50%, -50%, 0);
					transform: translate3d(-50%, -50%, 0);
}

.owl-carousel.custom-arrows-style-2 .owl-nav button.owl-prev:before, .owl-carousel.custom-arrows-style-2 .owl-nav button.owl-next:before, .owl-carousel.custom-xs-arrows-style-2 .owl-nav button.owl-prev:before, .owl-carousel.custom-xs-arrows-style-2 .owl-nav button.owl-next:before {
    border-top: 4px solid #1b1464;
}

.owl-carousel.custom-arrows-style-2 .owl-nav button.owl-prev:after, .owl-carousel.custom-arrows-style-2 .owl-nav button.owl-next:after, .owl-carousel.custom-xs-arrows-style-2 .owl-nav button.owl-prev:after, .owl-carousel.custom-xs-arrows-style-2 .owl-nav button.owl-next:after {
    border-top: 4px solid #1b1464;
    border-right: 4px solid #1b1464;
}
/* ========== FIM - EQUIPE ========== */



/* ========== HORÁRIOS DE FUNCIONAMENTO ========== */
section.horarios {
    background-color: #0090ff !important;
    margin-top: -25px !important;
    border-radius: 15px;
    padding-top: 20px;
    padding-bottom: 20px;
}
section.horarios h1{
    color: #000247 !important;
}
.row-horarios {
    background-color: #000247;
}
/* ========== FIM - HORÁRIOS DE FUNCIONAMENTO ========== */



/* ========== FIM - CONTATO ========== */
#contato {
    background-color: #000247;
}
#contato h2 {
    color: #f8d100;
}
#contato i {
    color: #f8d100 !important;
    border-color: #f8d100;
}
#contato h4, li {
    color: #f8d100;
}
/* ----- FORMULÁRIO ----- */
.form-control {
    background-color: #1b1464;
}
.form-control::placeholder {
    color: white !important;
}
[type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) {
    background-color: #f8d100;
    color: #000247 !important;
}
[type=button]:not(:focus), [type=reset]:not(:focus), [type=submit]:not(:focus), button:not(:focus) {
    background-color: #f8d100;
}
/* ========== FIM - CONTATO ========== */



/* ========== FIM - FOOTER ========== */
#footer {
    background: #f8d100;
    padding: 0;
}
#footer .footer-copyright {
    background: #f8d100;
}
#footer a:not(.btn) {
    color: #000247;
}
#footer a:not(.btn):hover {
    color: #1b1464;
}
#footer a:not(.btn):focus {
    color: #000247;
}
#footer .footer-copyright p {
    text-align: center;
    line-height: normal;
}
/* ========== FIM - FOOTER ========== */



/* ========== MODAL ========== */
.modal-body li {
    color: #000247;
}
.close {
    opacity: 1;
}
html body .btn-light:hover, html body .btn-light.hover, html body .btn-outline.btn-light:hover, html body .btn-outline.btn-light.hover {
    background-color: #000247;
    color: #f8d100 !important;
}
/* ========== FIM - MODAL ========== */



/* ========== LIGHTBOX ========== */
.mfp-iframe-holder .mfp-close, .mfp-image-holder .mfp-close {
    top: -4px;
    right: 0;
}
/* ========== FIM - LIGHTBOX ========== */

z-index-1 {
    position: relative;
    z-index: 1 !important;
}