/*!
Theme Name: CIECC - Centro Infantil & Externato Cantinho do Céu
Theme URI: http://underscores.me/
Author: Yanik dos Santos
Author URI: http://underscores.me/
Description: Site Oficial do CIECC - Centro Infantil & Externato Cantinho do Céu
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: ciecc
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

CIECC - Centro Infantil & Externato Cantinho do Céu is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
 * {
  box-sizing: border-box;
}

html,
body {
  font-family: "Poppins", sans-serif !important;
    scroll-behavior: smooth;
    font-size: 1rem;
}
ul {
  list-style: none !important;
  margin-top: 0rem !important;
  margin-bottom: 0rem !important;
  padding-left: 0rem !important;
}
a {
  text-decoration: none !important;
}
.breadcrumb{
  margin-bottom: 0rem;
}
p{
    text-align: justify;
}

h1{
    font-size: 40px;
    font-family: Passion one;
}
h2, h3,
h4{
    font-family: Passion one; 
}

/* ---- Classes CIECC ---- */
.atividades-box{
  border-right: 1px solid rgb(182, 186, 189) !important;
  padding: 0 20px 0 10px;
  min-height: 200px;
}
.atividades-box:last-child{
  border-right: none;
}
.azul-primario,
.btn-azul-primario{
    color: #fff;
    background: #060E38;
}
.text-azul-primario{
    color: #060E38;
}
.text-azul-secundario{
    color:#086caa;
}
.azul-secundario,
.btn-azul-secundario{
    color: #fff;
    background: #0A84D1;
}
.btn-azul-secundario:hover{
    color: #fff;
    background: #086caa;
}

.borda-inferior{
  border-bottom: 1px dashed #ccc;
  padding: 10px 0;
}
.invisible-desktop {
  display: none;
}

.borda-inferior:last-child{
  border-bottom: none;
}

.noticias-newsletter {
  background: #f7f7f7 !important;
  padding: 20px;
  border-radius: 5px;
}
.card-generico {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card-generico:hover {
  transform: translateY(-5px);
  /* box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2); */
}

.testimonial-card .card-up {
  height: 120px;
  overflow: hidden;
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem;
}
.testimonial-card .avatar {
  margin-top: -45px;
  overflow: hidden;
  border: 3px solid #fff;
  border-radius: 50%;
}

.nav-pills .nav-link.active{
  color: #fff !important;
  background: #0A84D1 !important;
}
.nav-pills .nav-link.active:hover{
  color: #fff !important;
  background: #086caa !important;
}
.nav-link{
  color: #060E38 !important;
}
.btn-insta{
    color: #fff !important;
    background: linear-gradient(115deg, #f9ce34, #ee2a7b, #6228d7) !important;
    border: none;
}
.btn-primary{
    border: none;
}
.invisible-desktop{
    display: none;
}

.border-lateral{
    border-right: 2px solid #f4f4f4;
}

.text-right{
  text-align: right !important;
}

.alinhar-end {
  display: flex;
  justify-content: end;
}
.border-inferior{
  border-bottom: 3px solid #eee;
  width: 40px;
}
.btn-outline-ciecc{
    background: #fff !important;
    color: #086caa;
}

.btn-outline-ciecc:hover{
    background: #f2f2f2 !important;
    color: #086caa;
}
.bg-grey{
  background: #f4f4f4;
}
.bg-azul-secundario{
  background:#086caa;
  color: #fff;
}
.btn-branco-ciecc{
  background: #fff;
  color: #086caa;
  font-weight: bold;
}
.btn-branco-ciecc:hover{
  background: #e5e3e3;
  color: #086caa;
  font-weight: bold;
}
.card{
  min-height: 287px;
}
/* .card:hover{
  
  animation: ease-in;
  animation-delay: 700ms;
} */
.card-icone{
  width: 40px;
  height: 40px;
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.card-icone i{
  font-size: 24px;
}
/* ======= Preloader Style ======= */
/* ======= Preloader Style ======= */
.preloader-bg,
#preloader {
  position: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #fff;
  z-index: 999999;
  text-align: center;
}
#preloader {
  display: table;
  table-layout: fixed;
}
#preloader-status {
  display: table-cell;
  vertical-align: middle;
}
.preloader-position {
  position: relative;
  margin: 0 auto;
  text-align: center;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}
.loader {
  position: relative;
  width: 55px;
  height: 55px;
  left: 50%;
  top: auto;
  margin-left: -28px;
  margin-top: 2px;
  -webkit-animation: rotate 1s infinite linear;
  -moz-animation: rotate 1s infinite linear;
  -ms-animation: rotate 1s infinite linear;
  -o-animation: rotate 1s infinite linear;
  animation: rotate 1s infinite linear;
  border: 1px solid rgba(0, 0, 0, 0.1);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
}
.loader span {
  position: absolute;
  width: 55px;
  height: 55px;
  top: -1px;
  left: -1px;
  border: 1px solid transparent;
  border-top: 1px solid #086caa;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
}

@-webkit-keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}
@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}



/* ======= toTop Button style ======= */
.progress-wrap {
  position: fixed;
  bottom: 30px;
  right: 30px;
  height: 40px;
  width: 40px;
  cursor: pointer;
  display: block;
  border-radius: 50px;
  -webkit-box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
  z-index: 100;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateY(20px);
  -ms-transform: translateY(20px);
  transform: translateY(20px);
  -webkit-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  transition: all 400ms linear;
}
.progress-wrap.active-progress {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
}
.progress-wrap::after {
  position: absolute;
  font-family: "Font Awesome 5 Free";
  content: "\f106";
  text-align: center;
  line-height: 40px;
  font-size: 12px;
  font-weight: 700;
  color: #323232;
  left: 0;
  top: 0;
  height: 40px;
  width: 40px;
  cursor: pointer;
  display: block;
  z-index: 1;
  -webkit-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  transition: all 400ms linear;
}
.progress-wrap svg path {
  fill: none;
}
.progress-wrap svg.progress-circle path {
  stroke: rgba(0, 0, 0, 0.2);
  stroke-width: 2;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  transition: all 400ms linear;
}
.progress-wrap {
  -webkit-box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
}
.progress-wrap::after {
  color: #000;
}
.progress-wrap svg.progress-circle path {
  stroke: #000;
}

.cbp-l-filters-button .cbp-filter-item.cbp-filter-item-active {
  background-color: #0A84D1 !important;
  color: rgb(255, 255, 255);
  cursor: default;
  border-color: #0A84D1 !important;
}

/* ----  Header ---- */
.menu{
	display: flex;
	
}
.menu li a{
	margin-left: 20px;
	color: #086caa !important;
	font-weight: bold;
}
.menu li ul li a{
	margin-left: 0px;
}
#img-banner{
    position: relative;
}
#img-banner .mask{
height: 450px;
width: 100%;
position: absolute;
top: 0;
left: 0;
}
#img-banner .mask .texto{
display: flex;

}
.fixed-top {
  background: #fff;
  box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.7);
}


#img-banner video{
    width: 100%;
    object-fit: cover;
    object-position: center;
    height: 450px;
}

.menu-float{
    background: #fff;
    border-radius: 10px;
}

#img-banner-single{
  position: relative;
}
#img-banner-single .mask{
height: 200px;
width: 100%;
position: absolute;
top: 0;
left: 0;
}
#img-banner-single .mask .texto{
display: flex;

}


.numeros-header h1::after,
.numeros-header h1::before{
    content: "";
    width: 50px;
    height: 2px;
    display: inline-block;
    background: #dddd;
    margin: 10px;
}

.numeros-content h1{
  font-size: 60px;
}

.blog-header h1::after,
.blog-header h1::before{
    content: "";
    width: 50px;
    height: 2px;
    display: inline-block;
    background: #060E38;
    margin: 10px;
}


.casos-main-header h1::after,
.casos-main-header h1::before{
    content: "";
    width: 50px;
    height: 2px;
    display: inline-block;
    background: #060E38;
    margin: 10px;
}

#eventos .eapp-events-calendar-events-calendar-component a{
  display: none !important;
}



#projetos .projetos-caixa img{
  object-fit: cover;
  height: 250px;
}

#projetos .projetos-caixa{
  position: relative;
}
#projetos .projetos-caixa .overlay{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background: rgba(0, 0, 0, 0.80);
  color: #fff;
  padding-top: 15px;

}

#projetos .projetos-caixa h5, 
#projetos .projetos-caixa p{
  text-shadow: 0px 8px 8px rgba(0, 0, 0, 1);
}

#projetos .border-inferior{
  border-bottom: 3px solid #fff;
  width: 2.5rem;
}

.horizontal-top{
  border-top: 1px solid #ccc;
  
  
}

.horizontal-top .owl-carousel{
  position: relative;
  top: -6.5%;
}



.right-line {
  border-right: 5px #086caa solid;
  height:2em
}

.top-line {
  border-top: 5px #086caa solid;
}

.halved {
  width: 50%;
  float:left;
}

/* Estilo global para os cards */
.activity-card {
  position: relative;
  border-radius: 15px;
  overflow: hidden;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease, opacity 0.3s ease;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.7), rgba(0, 204, 255, 0.7));
  backdrop-filter: blur(10px);
}

.activity-card:hover {
  transform: scale(1.05);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
  opacity: 0.9;
}

/* Imagem dos cards */
.activity-card img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  transition: opacity 0.3s ease;
}

.activity-card:hover img {
  opacity: 0.7;
}

/* Efeito de título */
.card-body {
  position: relative;
  z-index: 2;
  padding: 20px;
}

.card-title {
  font-size: 1.25rem;
  font-weight: bold;
  color: #333;
  transition: color 0.3s ease;
}

.activity-card:hover .card-title {
  color: #fff;
}

.card-text {
  font-size: 0.9rem;
  color: #555;
}

/* Sombra no texto */
.activity-card:hover .card-text {
  color: #fff;
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.6);
}

/* Ajustes no layout responsivo */
@media (max-width: 768px) {
  .activity-card img {
    height: 160px;
  }
}



.event-box {
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 20px;
  background-color: #f9f9f9;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  margin-bottom: 20px;
}
.event-header {
  font-size: 1.5rem;
  font-weight: bold;
}
.event-details {
  margin-top: 10px;
}
.event-date, .event-location, .event-time {
  font-size: 1rem;
}
/* .event-date {
  color: #007bff;
} */
.event-location {
  color: #28a745;
}
.event-time {
  color: #dc3545;
}


/* Dispositivos Celulares*/
@media screen and (max-width: 992px) {
  body {
    font-size: 0.9rem;
  }
  #header{
    background: #086caa !important;
    color: #fff;
  }
  
  #header .header-top {
    display: none !important;
  }

  #header .header-nav-menu .menu{
    display: flex !important;
  }

  #header .header-nav-menu li{
    border-bottom: none !important;
  }

  .menu li a {
    margin-left: 0px !important;
    color: #fff !important;
  }
  .menu li ul li a {
    margin-left: 0px !important;
    color: #0A84D1 !important;
    font-size: 14.4px !important;
  }
  .justify-end{
    justify-content: flex-start !important;
  }
  .logo-box img {
    width: 50% !important;
  }
  .fixed-top img {
    width: 50% !important;
  }
  .atividades-box{
    border-right: none !important;
  }
  .fixed-top {
    background: #0A84D1;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.7);
  }
  
  h1{
    font-size: 30px;
  }
  .numeros-header h1::after, .numeros-header h1::before,
  .casos-main-header h1::after, .casos-main-header h1::before,
  .blog-header h1::after, .blog-header h1::before {
    display: none;
  }

}


@media screen and (max-width: 768px) {
  #menu {
    display: none;
  }
  .invisible-desktop {
    display: block !important;
  }

  #header .header-nav-menu .menu{
    display: block !important;
    padding-top: 15px;
  }
  #header .header-nav-menu li{
    border-bottom: 1px dashed #ccc !important;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-left: 5px !important;
  }
  #header .header-nav-menu li:last-child{
    border-bottom: none !important;
  }
  #header .alinhar-end{
    display: block !important;
    justify-content: start !important;
  }

  .logo-box img {
    width: 20% !important;
  }
  .fixed-top img {
    width: 20% !important;
  }
  
  .share{
      margin-bottom: 20px !important;
  }
}