/* 1. Sobre
-------------*/
#sobre h2 {font-size: 18px; font-style: italic; color: #666;}
#sobre p {text-align: justify;}
#sobre .image {width: 100%; height: 369px;}
#sobre .image img {width: 100%; height: 100%; border-radius: 10px; object-fit: cover;}

/* 2. Call to Action
----------------------*/
#call-to-action {background: url(../images/webp/painel/p5.webp); background-size: cover; background-position: center; background-attachment: fixed; position: relative; z-index: 0;}
#call-to-action::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .35); z-index: -1;}
#call-to-action .titulo {color: #FFF;}
#call-to-action p {color: #fff;}

/* 3. Cursos
--------------*/
#cursos .box {background: #FFF; height: 300px; box-shadow: 0px 0px 3px #CCC; border-radius: 5px;}
#cursos .box:hover {color: inherit;}
#cursos .box .box-header {color: #999; padding: 15px 20px;}
#cursos .box .box-header h2 {margin: 0; font-size: 16px;}
#cursos .box .image {height: 130px; position: relative;}
#cursos .box .image img {height: 100%; object-fit: cover;}
#cursos .box .image .overlay {position: absolute; bottom: 0; left: 0; padding: 0.25rem 0.5rem;}
#cursos .box .image .overlay.red {background: #D80000; color: #FFF;}
#cursos .box .image .overlay.green {background: #04A126; color: #FFF;}
#cursos .box .image .overlay p {font-size: 14px; font-weight: 600; text-transform: uppercase;}
#cursos .box .conteudo {padding: 0 20px;}
#cursos .box .conteudo .text {height: 45px; text-align: center;}
#cursos .box .conteudo h1 {font-size: 18px; font-weight: 600;}
/* #cursos .box .conteudo span {color: #666; font-size: 13px;} */
#cursos .box .conteudo .button {color: #666; font-size: 12px; font-weight: 600; line-height: 1.5;}
#cursos .box .conteudo .button:hover {opacity: .75;}

/* ENSINO */
#ensino {background: linear-gradient(45deg, #eaf1fc, #eef3fc); color: #000;}
#ensino .carousel img {width: 100%; height: 250px; object-fit:contain; border-radius: 10px;}
#ensino h2 {font-size: 16px; font-weight: 500; text-transform: uppercase; color: #cecece;}
#ensino .titulo {text-align: center;}
#ensino p {text-align: justify; font-size: 20px; text-align: center;}

/* 4. Call to Contact
-----------------------*/
#call-to-contact {background: url(../images/webp/painel/p6.webp); background-size: cover; background-position: 50% 0%; background-attachment: fixed; position: relative; z-index: 0;}
#call-to-contact::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .55); z-index: -1;}
#call-to-contact .titulo {color: #FFF; margin-bottom: 1.75rem;}

/* ?. Contato
---------------*/
#contato h2 {font-style: italic; text-align: center; color: #767676;}
#contato h3 {font-size: 18px; font-weight: 600; text-transform: uppercase; color: #00235C;}

/* ?. Curso
-------------*/
#curso h2 {font-size: 18px;}
#curso h2 b {text-transform: uppercase;}
#curso img {height: 385px; object-fit: contain;}
#curso .text {text-align: justify; margin: 1rem 0;}
#curso .share {margin-top: 1rem;}
#curso .share .title {margin-right: 0.5rem;}
#curso .share a {width: 35px; height: 35px; border-radius: 100%;}
#curso .share a:not(:last-child) {margin-right: 0.5rem;}
#curso .share a:hover {opacity: .75;}
#curso .share a i {font-size: 18px;}
#curso .share .face {background: #3B5998; color: #FFF;}
#curso .share .twitter {background: #00ACEE; color: #FFF;}
#curso .share .whats {background: #25D366; color: #FFF;}
#curso .share .whats i {transform: rotate(85deg);}
#curso .share .linkedin {background: #0E76A8; color: #FFF;}

/* ?. Diretor
---------------*/
#diretor img {height: 375px; object-fit: cover; object-position: top;}
#diretor h2 {font-size: 18px; text-transform: uppercase; color: #767676; margin-bottom: 0.15rem;}
#diretor p {text-align: justify;}
#diretor .titulo {text-align: left;}

/* ?. Biblioteca
------------------*/
#biblioteca h2 {font-weight: 900; text-transform: uppercase; color: #00235C;}
#biblioteca p {text-align: justify;}

/* ?. Acervo Público
----------------------*/
#acervo-publico h2 {font-weight: 900; text-transform: uppercase; color: #00235C;}
#acervo-publico p {text-align: justify;}
#acervo-publico p a {text-decoration: underline; color: #007BFF;}
#acervo-publico p a:hover {opacity: .75;}

/* ?. Normas Gerais
---------------------*/
#normas-gerais ul {margin-bottom: 0; padding-left: 0;}
#normas-gerais ul li:not(:last-child) {margin-bottom: 0.5rem;}
#normas-gerias .titulo {margin-bottom: 1rem;}

/* ?. Periódicos
------------------*/
#periodicos h2 {font-weight: 900; text-transform: uppercase; color: #00235C; margin-bottom: 1rem; margin-top: 2rem;}
#periodicos h3 {font-size: 18px; font-weight: 600;}
#periodicos p a {text-decoration: underline; color: #007BFF;}
#periodicos p a:hover {opacity: .75;}
#periodicos .titulo {margin-bottom: 1.75rem;}
#periodicos .tab-content {border: 1px solid #DEE2E6; border-top: 0; padding: 1rem;}

/* ?. Links Úteis
-------------------*/
#links-uteis .box {box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .15); padding: 1rem;}
#links-uteis .box:hover {box-shadow: 0 7px 5px 0 rgba(0, 0, 0, .15); transform: translateY(-5px);}
#links-uteis .box img {height: 90px;}

/* OUVIDORIA */
#ouvidoria .shadow-lg {border-radius: 10px;}