@charset "utf-8";
/* CSS Document */

@font-face {
    font-family: Poppins;
    src: url("../fonts/Poppins-Light.ttf");
    font-weight: 300;
}
@font-face {
    font-family: Poppins;
    src: url("../fonts/Poppins-Medium.ttf");
    font-weight: 500;
}
@font-face {
    font-family: Poppins;
    src: url("../fonts/Poppins-Bold.ttf");
    font-weight: 700;
}
@font-face {
    font-family: Gloria;
    src: url("../fonts/GloriaHallelujah-Regular.ttf");
    font-weight: 400;
}

p.color-bn.subtit_jarindes {
    font-size: 23px;
    width: 55%;
    margin-left: auto;
    margin-right: auto;
font-family: Poppins;
    text-align: center;
}



/*espacios vacios en formularios*/
.blanckspace {
    height: 16px;
}

.pro-texto-center-jardines.col-md-6 {
    position: absolute;
    top: 75px;
    left: 20px;
}

.col-md-12.d-flex.white.mx-2 {
    margin-left: 2%;
    margin-right: 2%;
}

/*texto inspirados en la filosofia*/
p.color-bn.poppins.f-2em {
    font-size: 2em;
}

p.items_jardines {
    font-size: 0.8em;
}

.f-2em {
    font-size: 2em;
}

.lugar_carita{
position: absolute;
bottom: -150px;
left: 0;
width: 16%;
}

/* fuente obligatorios*/
p.white.f_obligatorio {
    font-size: 0.8em;
}

/*estilo para televisores*/
@media (min-width: 1600px)  {
.pro-texto-center-jardines.col-md-6 {
    position: absolute;
    top: 155px;
    left: 23px;
}

.home-bot-40-0 {
    bottom: 140px;
}

}




/*titulo formulario jardines*/
h2.titulo_form_jardines.yellow_title_form {
    color: #F8C900;
}

select#campos_pasadena {
    background-color: #00cdcc;
    border: 1px solid #ffffff;
    color: #ffffff;
}

/*estilo contenedor docentes editable*/
.col-md-12.cont_general_docentes {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    background-color: #F8C900;
}

.cont-docentes {
    width: 300px;
}

/* estilos formulario jardines */
.d-flex.col-md-12.p-5.f-column {
    flex-direction: column;
}

select.wpcf7-form-control.wpcf7-select.asunto_jardines {
    width: 100%;
    height: 45px;
}

.cont_flex_jardines {
    display: flex;
    flex-direction: column;
    width: 100%;
    background-color: #0D2947;
    align-items: center;
}

.contGen_jardines {
    display: flex;
    flex-direction: row;
    width: 80%;
}

.cont-formulario_jardines {
    width: 100%;
    display: flex;
}



input.wpcf7-form-control.wpcf7-text.Nombre_jardines {
    width: 100%;
    height: 45px;
}

input.wpcf7-form-control.wpcf7-text.Apellidos_jardines {
    width: 100%;
}

input.wpcf7-form-control.wpcf7-text.wpcf7-email.wpcf7-validates-as-email.correo_jardines {
    width: 100%;
    height: 45px;
}

input.wpcf7-form-control.wpcf7-text.wpcf7-tel.wpcf7-validates-as-tel.telefono_jardines {
    width: 100%;
}

textarea.wpcf7-form-control.wpcf7-textarea.mensaje_jardines {
    width: 100%;
    height: 50px;
}


.mensaje_jardines::placeholder {
    color: #ffffff;
}

select.wpcf7-form-control.wpcf7-select.asunto_jardines {
    width: 100%;
}




/* color amarillo formulario contacto*/
h1.colores_titulos {
    color: #F8C900;
    font-family: poppins;
}

/*ancho completo banners*/

.ancho_completo{
    width: 100%;
}

.col-md-12.bg_jardines {
    display: flex;
    flex-direction: column;
    width: 100%;
    background-color: #00cdcc;
}

.f_jardines.col-md-6 {
    height: 100%;
    width: 100%;
    margin: 0 0 3% 0;
}
 

 
html {
  scroll-behavior: smooth;
}


button.btn.btn-default.myba.ancho_ver {
    width: 140px;
}

.jgeneral-ancho-completo{
    width:100%;
}

.container{
    padding: 0px;
    max-width: 1320px;
    width: 100%;
}
.imagen-fondo{
    position: relative;
    display: inline-block;
    text-align: center;
    padding: 0px;
}
.color-blue{
    color: #2EB0F7;
}
.color-blue-osc{
    color: #297DDB;
}
.color-bn{
    color: #0D2947;
}
.color-bc{
    color: #297DDB;
}
.color-at{
    color: #00CDCC;
}
.color-yellow{
    color: #F7CF1C;
}
.color-aguam{
    color: #00CDCC;
}
.color-mora{
    color: #B000ED;
}
.color-naranja{
    color: #E28B00;
}
.color-white{
    color: white;
}
.color-red{
    color: #ED0073;
}
.color-green{
    color: #8CD636;
}
.subtit{
    font-family: Poppins;
    font-size: 21px;
}
.subtit2{
    font-family: Poppins;
    font-size: 15px;
}
.tc{
    text-align: center;
}
.jard-texto-center-1{
    position: absolute;
    top: 39%;
    padding-right: 7%;
    margin-left: 50px;
    color: white;
    transform: translatey(-50%);
}
.como-ap{
    padding:40px 20%;
    text-align: center;
}
.marg-1{
    padding: 0px 25%!important;
}
.nuestro-prop{
    align-self: center;
    padding: 0px;
}
.como-apr{
    background-color: #00CDCC;
    display: flex;
    padding: 0px;
    position: relative;
}
.como-apr2{
    background-color: #F8C900;
    display: flex;
    padding: 0px;
    position: relative;
}
.que-nos{
    font-family: gloria;
    font-weight: 300;
    margin-top: -100px;
}


.aula1{
    background-color: white;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    padding: 0px;
}

.aula1-img{
    transition: 0.3s;
    transform: translate(0%, 0%);
    opacity: 100%;
}
.aula1:hover .aula1-img{
    transition: 0.3s;
    transform: translatey( -30%);
    opacity: 70%;
}
.hid-aula{
    font-size: 1px!important;
    transition: 0.3s;
    opacity: 0;
}
.aula1:hover .hid-aula{
    font-size: 15px!important; 
    opacity: 1;
    transition: 0.3s;
}

.cuad-text{
   position: absolute;
    transition: 1s;
    padding: 6px 10px;
    background-color: #FFFFFF;
    bottom: 0px;
    width: 100%;
}
.risa{
    position: absolute;
    bottom: 0px;
    right: 0px;
    width: 25%
}
.qnhd{
    padding: 20px 10%;
}
.cuad-sm{
    padding:30px 30px;    
}
.sub-glo{
    font-family: Gloria;
    font-size: 32px;
}
.text-exp{
    margin-top: -74px;
    margin-left: 10%;
    width: 42%;
    font-size: 17px!important;
    padding-bottom: 26px;
}

.text-exp2{
    margin-top: -113px;
    margin-left: 62%;
    width: fit-content;
    font-size: 60px !important;
    text-align: right;
    padding-bottom: 20px;
}
.marg-cuad{
    padding: 20px 5%;
    position:relative;
}
.marg-cuad2{
    padding: 25px 3%;
    position:relative;
}
.hor-pup{
    font-family: Poppins;
    font-size: 20px;
    list-style:none;
}
.hor-pup p::before{
    content: url("../images/jardines-serv-risa.png");
    margin-left: -32px;
    margin-right: 9px;
}
.esp3{
    padding-bottom: 21px;
    margin-top: -103px;
    margin-left: 14%;
}
.padeq{
    padding: 0px 10px;
}
.mynput{
    border-radius: 10px;
    background-color: #e1e1e1;
    height: 40px;
    color: #172A46;
    font-weight: 700;
}
.myb{
    color: #0D2947;
    background-color: #F8C900;
    border: none;
    font-size: 16px;
    border-radius: 20px;
    padding: 10px 30px;
}
.myba{
    color: #0D2947;
    background-color: #00CDCC;
    border: none;
    font-size: 16px;
    border-radius: 20px;
    padding: 10px 30px;
}
.estre-amar{
    height: min-content;
}
.alt-estre{
    display: flex;
    justify-content: center;
    margin-top: -22px;
}
.padnom{
    padding-left:0px;
}
.mydir{
    font-size: 40px;
    margin:30px;
}
.mydirtext{
    font-size: 24px;
    width: 70%;
    margin-left: auto;
    margin-right: auto;
}

.container-pad{
    padding: 0px;
}

p{
    margin: 0px;
}
.flex-container {
  display: flex;
  flex-wrap: wrap;
}

.imagen-fondo-2{
    position: relative;
    display: inline-block;
    text-align: center;
    padding: 20px;
}


h2{
    font-family: Poppins;
    font-size: 50px;
    font-weight: 700;  
}

.texto-center-2{
    position: absolute;
    top: 25%;
    color: white;
}
.absol-1{
    position: absolute;
    top:36%;
    left: 60%;
    font-family: Poppins;
    font-size: 21px;
    width: 200px;
}
.absol-2{
    position: absolute;
    top:36%;
    left: 53%;
    font-family: Poppins;
    font-size: 21px;
    width: 195px;
}
.absol-3{
    position: absolute;
    top:18%;
    left: 9%;
    font-family: Poppins;
    font-size: 21px;
    width: 226px;
}
.absol-4{
    position: absolute;
    top:21%;
    left: 9%;
    font-family: Poppins;
    font-size: 21px;
    width: 200px;
}
.flex-prop{
    display: flex;
}
.disp-flex{
     display: flex;
}
.mis-vis{
    padding: 0px 70px;
}

.serv-bot:hover{
    box-shadow: 0px 0px 15px 5px #88888863;
    border-radius: 30px;
}

.hist-back{
    background-color: #0D2947;
    padding: 0px;
}
.equip-back{
    background-color: #F8C900;
    padding: 0px 0px 40px 0px;
}
.de-back{
    background-color: #2EB0F7;
    padding: 0px 0px 40px 0px;
}
.dp-back{
    background-color: #00CDCC;
    padding:  0px 0px 40px 0px;
}
.dd-back{
    background-color: #0D2947;
    padding: 0px 0px 40px 0px;
}
.dc-back{
    background-color: #B000ED;
    padding: 0px 0px 40px 0px;
}
.dco-back{
    background-color: #ED0073;
    padding: 0px 0px 40px 0px;
}
.df-back{
    background-color: #FCA300;
    padding: 0px 0px 40px 0px;
}
.imp-back{
    margin-bottom: 50px;
    padding: 0px;
}
.fecha{
    font-family: Poppins;
    font-size: 80px;
    font-weight: 700;
}


.circulo{
background-color: #F7CF1C;
width: 30px;
height: 30px;
border-radius: 50%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(calc(-50% - 2px), -50%);
}
.linea-izq{
    align-self: center;
    border-right: dashed #F7CF1C 3px;
}
.linea-der{
    align-self: center;
    border-left: dashed #F7CF1C 3px;
    margin: -3px;
}
.size-img{
    margin: 45px;
    max-height: 200px;
}
.clear {
    clear: both;
}
.pad{
    padding: 30px;
    align-self: center;
}
.mar-top{
    max-width: 102%;
}
.relat{
    position: relative;
}
.pad-equip{
    padding: 0px 200px 20px 200px;
}
.t-nom{
    font-family: Poppins;
    font-size: 14px;
    font-weight: 700;
    padding: 0px 15px;
}
.t-car{
    font-family: Poppins;
    font-size: 13px;
    font-weight: 700;
    padding: 0px 20px;
}
.t-des{
    font-family: Poppins;
    font-size: 13px;
    padding: 0px 20px;
}

/* HOME*/



h3{
    font-family: Gloria;
    font-size: 46px;
    font-weight: 700;  
}

.subtit-glo{
    font-family: Gloria;
    font-size: 50px;
}

.texto-center-5{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.texto-center-7{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    
}
.texto-center-6{
    position: absolute;
    top: 14%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}
.df-5{
    display: flex;
    flex-direction: column;
    width: 85%;
    z-index: 2;
}
.camp-5{
    color:white;
    background-color: #E31878;
    padding: 10px;
    border-radius: 37px;
}
.dona{
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translatey(-50%);
}
.mochila{
    position: relative;
    text-align: center;
    margin: 0px 21%;
}
.apoya{
    margin: 24px 30%;
}
a:hover{
    text-decoration: none;
}
a p:hover{
    filter: brightness(105%); 
    box-shadow: 2px 2px 6px 0px #00000045;    
}
.vidd:hover{
    filter: brightness(105%); 
    box-shadow: 2px 2px 6px 0px #00000045;    
}
.non:hover{
        filter: brightness(100%)!important;
    box-shadow:none!important;
}
.size-img-2{
    margin: 45px;
    max-height: 200px;
}
.pad0{
    padding-top: 5px;
    padding-bottom: 5px;
}
.pad00{
    padding:0px;
}
.pad5{
    padding:5px;
}

.redondeado{
	border-radius:20px;
    margin-left: auto;
    margin-right: auto;
}

.img-responsive{
    margin-left: auto;
    margin-right: auto;
}
.ftmg{
    font-size:17px;
    margin-bottom:10px;
}
.fft{
    text-align:center;
    font-size:15px;
    font-weight:300;
}
.foot{
    padding: 30px 0px;
    background-color: #0D2947;
    position: relative;
}
.pad-fot{
    padding: 50px 30px 15px 15px;
}

.bg_jardines {
    display: flex;
    justify-content: center;
    width: 80%;
    height: auto;
    margin: auto;
}

.cont_img_jardines {
    display: flex;
    justify-content: center;
    width: 80%;
    height: auto;
    margin: auto;
}

/*aipad air vertical*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) 
and (orientation: portrait) and (-webkit-device-pixel-ratio: 2) {
    .f_jardines.col-md-6 {
        height: 720px;
        width: 100%;
    }
    
    .mydirtext_jardines {
    font-size: 2vw;
    width: 75%;
}
} 


@media only screen and (device-aspect-ratio: 1180px/768px) and (orientation : portrait) /* does not work on iPad or LG */{

img.img-responsive.lugar_carita {
    position: absolute;
    bottom: -55px;
}

.fondo_jardines_mobile {
    background-image: url('https://www.aeiotu.com/wp-content/uploads/2023/05/ninos_jardin_principal.png');
    background-repeat: no-repeat;
    background-position: bottom;
    height: 980px;
    background-size: contain;
}

.pro-texto-center-jardines.col-md-6.globo_mobile {
    position: absolute;
    top: 85px;
    left: 25px;
}

.fondo_jardines_mobile {
    background-image: url('https://www.aeiotu.com/wp-content/uploads/2023/05/ninos_jardin_principal.png');
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
    height: 975px;
}

}

@media (max-width: 1199px) and (min-width: 992px) {
/*jardines*/
.jard-texto-center-1{
    top: 39%;
    padding-right: 3%;
    margin-left: 21px;
}
.qnhd{
    padding: 0px;
}
.text-exp{
    margin-top: -6.5%;
    margin-left: 9%;
    width: 43%;
    font-size: 15px;
    padding-bottom: 16px;
}

.text-exp2{
    margin-top: -9%;
    margin-left: 62%;
    width: fit-content;
    font-size: 4.5vw !important;
    text-align: right;
    padding-bottom: 14px;
    
}
.esp3{
    padding-bottom: 15px;
    margin-top: -82px;
    margin-left: 14%;
}


    
.texto-center-2{
    top: 23%!important;
}

.absol-1{
    position: absolute;
    top:38%;
    left: 61%;
    font-family: Poppins;
    font-size: 17px;
    width: 157px;
}
.absol-2{
    position: absolute;
    top:34%;
    left: 51%;
    font-family: Poppins;
    font-size: 17px;
    width: 157px;
}
.absol-3{
    position: absolute;
    top: 13%;
    left: 11%;
    font-family: Poppins;
    font-size: 17px;
    width: 156px;
}
.absol-4{
    position: absolute;
    top:20%;
    left: 8%;
    font-family: Poppins;
    font-size: 17px;
    width: 180px;
}
/*HOME*/
    h3{
        font-size: 3.7vw;
    }
}


@media (max-width:991px) {
    
p.color-bn.subtit_jarindes {
    font-size: 2em;
    text-align: center;
    margin: 5% 0%;
    width: 100%;
    padding: 0 10%;
}
    
img.img-desktop {
display: none;
}
img.img-mobile {
display: block!important;
}
.jard-texto-center-1{
    position: inherit;
    padding: 40px 0px;
    margin: -1px;
    color: white;
    background-color: #00CDCC;
    top: 0;
    transform: translateY(0px);
}
.como-ap{
    padding:40px 20px;
    text-align: center;
}

.nuestro-prop{
    text-align: center;
    padding: 0px 15px 15px 15px;
}
.como-apr{
    flex-direction: column;
}
.como-apr2{
    flex-direction: column;
}
.que-nos{
    margin-top: -20px;
}
.qnhd p{
    font-size: 5vw!important;
}
.clear-mob {
    clear: both;
}
.text-exp{
    margin-top: -13.5%;
    margin-left: 9%;
    width: 45%;
    font-size: 1.8vw !important;
    padding-bottom: 4%;
}

.text-exp2{
    left: 0%;
    margin-top: calc(-6% - 23px);
    margin-left: 59%;
    width: fit-content;
    font-size: 4vw !important;
    text-align: right;
    margin-bottom: 0px;
}
.marg-1{
    padding: 0px 10%!important;
}
.esp3{
    padding-bottom: 5px;
    margin-top: -9%;
    margin-left: 13%;
}
.colum{
    flex-direction: column;
}
.estre-amar{
    height: min-content;
    max-width: 25px;
}
.fdcol{
    flex-direction: column;
    align-items: inherit!important;
}
.myl{
    padding-left: 0px;
}
.alt-estre{
    margin-top: -3%;
}
.padnom{
    padding:0px;
}
.top-imp-soc{
    margin-top: 0%!important;
}
.mydir{
    font-size: 8vw;
    margin:30px;
}
.mydirtext{
    font-size: 6vw;
    width: 85%;
}

/*justificar texto*/
.txt_just{
    text-align: justify;
}
    
    /*HOME*/
h2{
font-size: 7vw;
margin: 0px;
}
h3{
font-size: 7vw;
margin: 0px;
}
.texto-center-5{
    top: 65%;
    left: 56%;
}
.dona{
    left: 50%;
    top: 0px;
    transform: translatex(-50%);
}
.text-left{
    text-align: left;
}
.df-5{
    width: 67%;
}
.mochila2{
position: relative;
text-align: center;
margin: 5px 34% 0px 0%;
}
.texto-center-6{
    position: absolute;
    left: 50%;
    width: 100%;
    font-weight: 400;
}
.apoya{
    margin: 24px 0%;
}
.camp-5{
    font-size: 4vw;
}
.cent-ver{
    margin-left: auto;
    margin-right: auto;
    width: 32vw;
}
.ban-bot{
    margin-top: -5px;
    margin-left: -2px;
}
.mar-cen{
    margin-left: auto;
    margin-right: auto;
}
.size-img-2{
    margin: 0px;
    max-height: 150px;
    float: right!important;
}
.pad0{
    padding: 0px;
}
.fecha{
    font-size: 11vw;
}
.texto-center-7{   
    width: fit-content;
}
.subtit-glo{
    font-family: Gloria;
    font-size: 8vw;
    margin-top: -21px!important;
    line-height: 8vw;
}
.non{
font-size: 3vw;
} 
.cent{
    display: flex;
    justify-content: center;
    max-height: 100px;
    margin-top: 36px;
}
.mx-tx{
    font-size: 4.5vw;
    padding: 20px 20%!important;
}
.disp-flex{
     flex-direction: column;
}
.fft{
    text-align:left;
    font-size:15px;
    font-weight:300;
}
.foot{
    padding: 30px 60px 100px 60px;
}
.aei{
    margin-left: 0px;
}
.pad-fot{
    padding: 50px 0px 15px 15px;
}
.cle{
    clear: both;
}
    
    

.flex-prop{
    flex-direction: column-reverse;
    margin-top: 0px!important;
}

.mis-vis{
    padding:0px;
    position: relative;
}
.texto-center-2{
    position: inherit;
}
.texto-center-3{
    margin: -1px;
    position: inherit;
    background-color: #61B82E;
    padding-bottom: 20px;
}
.texto-center-4{
    margin: -1px;
    position: inherit;
    background-color: #61B82E;
}
.mg-tp{
    margin-top: -2vh;
}
.flex-mob{
     flex-direction: column;
}
.flex-mob-inv{
     flex-direction: column-reverse;
}
.size-img{
    margin: 0px;
    max-height: 150px;
}
.circulo{
top: 50%;
left: 0%;
transform: translate(calc(-50% - 2px), -50%);      
}
.linea-izq{
    border-right:none;
}
.linea-der{
    border-left:none;
}
.linea-mob{
    margin-left: 40px;
    border-left: dashed #F7CF1C 3px;
    padding-bottom: 80px;
}
.pad{
    padding-bottom: 0px;
}
.mar-top{
    margin-top: -60px;
    margin-left: 1px;
}
.correct-px{
background-color: white;
    margin-top: -1px;
}
.absol-1{
    position: absolute;
    top:32%;
    left: 62%;
    font-family: Poppins;
    font-size: 4vw;
    width: 30%;
}
.absol-2{
    position: absolute;
    top: 16%;
    left: 53%;
    font-family: Poppins;
    font-size: 4vw;
    width: 30%;
}
.absol-3{
    position: absolute;
    top:15%;
    left: 8%;
    font-family: Poppins;
    font-size: 3.4vw;
    width: 36%;
}
.absol-4{
    position: absolute;
    top:12%;
    left: 11%;
    font-family: Poppins;
    font-size: 4vw;
    width: 30%;
}
.pad-equip{
    padding: 0px 50px 20px 50px;
}
    
.imagen-fondo-2{
    padding: 0px!important;
} 

.bg_jardines {
    display: flex;
    width: 100%;
    flex-direction: column;
    padding: 0 0% 5% 0%;
} 

}



@media (max-width: 767px){
    .cuad-sm{
        padding: 5%;
    }

    .col-md-12.cont_general_docentes {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    background-color: #F8C900;
    flex-wrap: wrap;
}

.bg_jardines {
    display: flex;
    width: 100%;
    flex-direction: column;
    padding: 0 0% 5% 0%;
} 

.fondo_jardines_mobile {
    background-image: url('https://www.aeiotu.com/wp-content/uploads/2023/05/ninos_jardin_principal.png');
    background-repeat: no-repeat;
    background-position: bottom;
    height: 775px;
}

p.nos-subtit.pr-5 {
    padding-right: 40px;
}

img.nos-img-mobile.globo_logo {
    position: absolute;
    bottom: 30px;
    width: 150px;
    right: 30px;
}

.pro-texto-center-jardines.col-md-6 {
    position: inherit;
    padding: 20px;
    margin: 0px;
    color: white;
    background-color: #00CDCC;
    top: 0;
    transform: translateY(0px);
    width: 100%;
}

.col-md-12.d-flex.white.mx-2 {
    margin-left: 2%;
    margin-right: 2%;
}
    
}



@media (min-width: 767px) and (max-width: 992px) {
  
    h2{
        font-size: 5vw;
    }
    .text-tall{
        font-size: 1.7vw;
    }
    
    .col-md-12.cont_general_docentes {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    background-color: #F8C900;
    flex-wrap: wrap;
}

.bg_jardines {
    display: flex;
    width: 100%;
    flex-direction: column;
    padding: 0 0% 5% 0%;
} 

.fondo_jardines_mobile {
    background-image: url('https://www.aeiotu.com/wp-content/uploads/2023/05/ninos_jardin_principal.png');
    background-repeat: no-repeat;
    background-position: bottom;
    height: 775px;
}

p.nos-subtit.pr-5 {
    padding-right: 40px;
}

img.nos-img-mobile.globo_logo {
    position: absolute;
    bottom: 30px;
    width: 150px;
    right: 30px;
}

.pro-texto-center-jardines.col-md-6 {
    position: inherit;
    padding: 20px;
    margin: 0px;
    color: white;
    background-color: #00CDCC;
    top: 0;
    transform: translateY(0px);
    width: 100%;
}

}