@charset "UTF-8";
/* TODAS DEMASI MÍDIAS */

/* typica
 device breakpoints 
celular: 600px até 768px
tablet: 768x até 992px
desktop: 992px até 1200px
grandes telas: acima de 1200px

okd
*/
:root {
    /*cores*/
    --AmaerAzulMarinho : #34354d;
    --AmaerAzulMarinho2 : #262750;
    --AmaerVerde01 : #00933e;
    --AmaerVerde02 : #004c31;
    --AmaerVerde03 : #009f59;
    --corverde  :#225D4D;
    --corverdee :#235C4D;
    --corfundo  :#151515e8;
    --corverdec :#b7f0d6;
    --corazulc  :#4faddb;
    --corazule  :#286291;
    --corpreta  :#000;
    --corbranca :#fff;
    --corlaranja:tomato; 
    /*fontes*/
    --fonte-padrao   : Arial, Verdana, Helvetica, sans-serif; /* pode mudar*/
    --fonte-destaque1: 'Abel', cursive; /*  pode mudar*/
    --fonte-tema     : 'Fahkwang', sans-serif;/*pode mudar */
}

@media print { /*impressoras*/
    * {
        font-family: 'Courier New', Courier, monospace;
       
    }
    main h1 {
        font-size: xx-small;
        text-shadow: none;
        color: black;
        
    
    }
    body {
        background-image: url('../IMAGENS/back-print.jpg'); /*não precisa*/
    }
    
    main {
        border: 1px solid gray;
        width: 90vw;
    }
    main::after {
        content: 'Impressao site CABEFE';
        text-decoration: overline;
        
    }


}
@media  screen and (min-width: 300px) and (max-width:600px)
 { /*C E L U L A R E S*/
      /* mensagem inicial */
       .cookies-msg .cookies-msir
        {
            width: 97%;
            height: 96%;
            background-color: var(--corbranca);
            color: var(--corpreta);
            position: fixed;
            top: 3%;
            bottom: 5%;
            left: 50%;
            transform: translate(-50%);
            border-radius: 15px;
            display: none;
        
        }
        .cookies-msg.mostrar 
        {
            display: block;
        }
		
		 .cookies-msir.mostrar 
        {
            display: block;
        }
		
        .cookies-msg .cookies-txt  .cookies-msir .cookiesir-txt
        {
            
            text-align: justify;
            font-size: 14px;
            padding: 20px;
        }

        .cookies-msg .cookies-btn .cookies-msir .cookiesir-btn
        {

            transform: translate(40%);
        }

        .cookies-msg .cookies-btn button .cookies-msir .cookiesir-btn
        {
            background-color:var(--corpreta);
            color:var(--corbranca);
            font-weight: 700;
            font-size: 10px;
            padding: 10px 40px;
            cursor:pointer;
            transition: 0.2s;
            
        }
        .cookies-msg .cookies-btn  .cookies-msir .cookiesir-btn button:hover 
        {
            transform: scale(0.9);

        }

        /* imagem do home cabefe*/
   

    .menu {
        
        display: none;
	}
    
    #opcoes {

        display: none;
		
    }
    

    .homedv1 {
        display: block;
		
        background-image: url('../IMAGENS/AMAERHOME/idosostrabalhocelular2.jpg');
       
        background-size: cover;
        background-position: center bottom;
		margin-top:65px;
        
    }
    .MainPrincipal
    {
        margin-top: 0px;
    }
	.textosTitulos
	{
		padding-top:20%;
        text-align:center; 
	}
    #top-celular{
        padding-top: 15%;
    }
    /*NAV MENU*/
    .menu ul {
        background: var(--AmaerVerde01);
        /*opacity: 90%;*/
        
        color: var(--corbranca);
    }  
    .menu li {
        display: block;
        width: 100vw;
        background-color: var(--AmaerVerde02);

    }
    .menu {
        height: 100px;                                               
        align-items: center;
        display: block;
        margin-top: 120px;
        margin-left:0px;
        padding-left: 0px;
        color: var(--corverdec);
        
    
    }
    .menu li a{
        text-align: center;
    }
    nav.menu div.container-fluid{
       
        text-align: center;

    } 

    .menu-toggle
    { 
        display: block;
       
        margin-left:80%;
        margin-top:-65px;
	}
    i#burguer {
        background-color: var(--AmaerVerde03);
        display: block;
        color: white;
        text-align: center;
        padding: 0px;
        cursor: pointer;
    
    }
    i#burguer:hover {
        background-color: white;
        color: var(--corverdee);
    }
    /*fim nave menu*/

	#loginSocios 
	{
		display:inline-block;
	}	
    .botao 
    {
        box-shadow: 1px 1px 1px 1px var(--AmaerAzulMarinho2);
        border: none;
        border-radius: 5px;
        margin-bottom: 10px;
        background: var(--AmaerAzulMarinho2);
        color: var(--AmaerAzulMarinho);
        text-align: center;
        width: 100px; 
    }
    .botao:hover 
    {
        color:black;

    }
	.textohome{
        margin-top: 5%;
        padding-top: 10%;
    }
	
	.textohome>h1
		{
			display: block;
            text-align: center;
            color: var(--corbranca);
            text-shadow: 2px 2px 1px black;
		}

    .textohome>h2{
        color:#b7f0d6;
        text-align: center;
        text-shadow: 2px 7px 3px black;

    }
		
	section >h5
	{
		
		
		text-shadow: 2px 2px 3px var(--corpreta);
    }      

	
    .textohome>h5
	{
		display: none;
	}
    
	.textohome>h3
        {  
			
            font-size: 20px;
            color: var(--corbranca);
            text-align: justify;
            font-weight: 100;
            text-shadow: 5px 5px 7px black;
			max-width: 790px;
			padding:7%;
			padding-top:30px;
            margin:auto;
        }
	
    div>.emater-Text

    {
        background: url("../IMAGENS/AMAERHOME/idososrindo.jpg") no-repeat;
        background-position: left bottom;
        color:var(--corbranca);
        font-size: 16px;
        font-weight: 300;
		text-align: justify;
        text-shadow:var(--corpreta) 5px 5px 7px;
        background-size: cover;
		padding:7%;
        background-position: top center;
        height: auto;

    }
    div>.unimed-Text

    {
        background: url("../IMAGENS/fundoverde2.jpg") no-repeat;
        background-position: left bottom;
        color:var(--corbranca);
        font-size: 16px;
        font-weight: 200;
		text-align: justify;
        text-shadow:var(--corpreta)  5px 5px 7px;
        background-size: cover;
		padding:7%;
        background-position: top center;
        height: auto;

    }
    
    

	.logoE
	{
		padding-bottom: 5px;
	}
	.logoU
	{
		padding-top:5px;

	}
    .link-area
    {
    position:fixed;
    bottom:180px;
    text-align: center;
    left:20px;
    z-index: 3;  
    padding:15px;
    border-radius:20px;
    background:rgb(7, 230, 37);
    }
    .link-area a
    {
    text-decoration:none;
    color:var(--corpreta);
    font-size:20px;
    }
    .link-area a span{
    color: var(--corbranca);
    }

}

@media screen and (min-width: 601px) and (max-width:1000px) { 
    /*T A B L E T */
    .cookies-msg
        {
            width: vw;
            height: vh;
            background-color: var(--corbranca);
            color: var(--corpreta);
            position: fixed;
            top: 3%;
            bottom: 5%;
            left: 50%;
            transform: translate(-50%);
            border-radius: 15px;
            display: none;
        
        }
        .cookies-msg.mostrar{
            display: block;
        }
        .cookies-msg .cookies-txt
        {
            
            text-align: justify;
            font-size: 17px;
            padding: 20px;
        }

        .cookies-msg .cookies-btn
        {

            transform: translate(40%);
        }

        .cookies-msg .cookies-btn button
        {
            background-color:var(--corbranca);
            color:var(--corbranca);
            font-weight: 700;
            font-size: 17px;
            padding: 10px 40px;
            cursor:pointer;
            transition: 0.2s;
            
        }
        .cookies-msg .cookies-btn button:hover
        {
            transform: scale(0.9);

        }
        .homedv1 {
            background-image: url('../IMAGENS/AMAERHOME/maos.jpg');
            display: block;
            background-size: cover;
            background-position: center center;
            
        }
        .menu ul {
            background: var(--AmaerVerde02);
           /* opacity: 99%;*/
            color: var(--corbranca);
        }  
        .menu li {
            display: block;
            width: 100vw;
            background-color: var(--AmaerVerde02);

        }
        
        .menu {
            
            align-items: center;
            display: block;
            height: 100px;
            margin-top: 16.7%;
            margin-left:-13px;
        
            color: var(--AmaerVerde03);
        
        }
        .menu li a{
            text-align: center;
        }
        .menu-toggle
        { 
            display:block;
            margin-left: 90%;
            margin-top: -65px;
        }
        i#burguer {
            background-color: var(--AmaerVerde01);
            display: block;
            color: white;
            text-align: center;
            padding: 0px;
            cursor: pointer;
        
        }
        i#burguer:hover {
            background-color: white;
            color: var(--AmaerVerde02);
        }
    
        nav.menu div.container-fluid{
        
            text-align: center;

        } 
        section {
            padding-top: 10vh;
            padding-bottom: 10vh;
            
        }
        
        section > h1,h2,h5 {
            padding-top: 5px;
            text-align: center;
            text-shadow: 2px 2px 3px var(--corpreta);
        }
        
        section>h1 {
            text-align: center;
            font-size: 2.3em;
            color:var(--corbranca);
        }
        section>h5 {
            color: var(--corbranca);
            font-size: 1.2em;
            
        }
        .textosTitulos
            {
            padding-top:20%;
            text-align:center;
            }
        .textohome>h3
            {
                font-size: 20px;
                color: var(--corbranca);
                text-align: justify;
                font-weight: 200px;
                text-shadow: 1px 3px 4px black;
                padding: 30px;
                max-width: 690px;
                margin: auto;
            }
        
        section>h2 {    
            color:var(--corverdec);
            margin:30px;
            font-size: 2.4em;
            font-family: var(--fonte-tema);     
        }
        div>.emater-Text ,div> .unimed-Text
            {
            margin-top: 0px;
            font-size: .7em;
            text-align: justify;
            padding: 5px;
            background: var(--corbranca);
            color:var(--corpreta);

        }
        .menu,#opcoes {
            display: none;
        }
        

        .botao 
        {
            box-shadow: 1px 1px 1px 1px var(--AmaerAzulMarinho2);
            border: none;
            border-radius: 5px;
            text-align: center;
            background: var(--AmaerAzulMarinho);
            color: var(--corverdec);
            width: 100px; 
        }
        .destaque {
            background: var(--corazulc);
            
        }
        .destaque:hover {
            background: var(--corazulc);
            color: var(--corverdec);
        }
        .emater-Text > p, .unimed-Text >p
        {
            margin-top: 0px;
            font-size: 14px;
            text-align: justify;
            padding: 5px;
            background: var(--corbranca);
            color:var(--corpreta);

        }
        
        .imgEmater
        {    
            
            background-image: url("../IMAGENS/AMAERHOME/maos.jpg") ;
            width: auto;
            height: auto;
            background-size: cover;
            background-position: top center;
            background-repeat: no-repeat;
            
        }
}   
@media screen and (min-width: 1001px) and (max-width: 1758px) { /*Desktop*/
    /* D E S K T O P*/
    
    
    
    .imgEmater
    {    
        
        background-image: url("../IMAGENS/AMAERHOME/maos2.jpg") ;
        
        background-size: cover;
        background-position: center center;
        
        background-repeat: no-repeat;
        
    }

    header {
       padding-bottom: 0px;
    }
    
	
	.menu, #opcoes {
        display: block;
    }
   
    
    .menu {
       
        align-items: center;
        display: inline-block;
        margin-left:28%;
        /* margin-top: 3.5%; */ 
        vertical-align: top;
        height: 100px;
        margin-top: -40px;
        margin-right: 1%;
        color: var(--corverdec);
    
    }
    .menu li {
        display: inline-block;
        width: auto;
        background-color: var(--corverdee);

    }
    .menu ul a{
        background-color: var(--corbranca);
    }


    .homedv1 {
        background-image: url('../IMAGENS/AMAERHOME/idosostrabalhodesktop.jpg');
        display: block;
        background-size: cover;
        background-position: top center;
        margin-top: auto;
    }
    section {
        padding-top: 10vh;
        padding-bottom: 10vh;
        
    }

        section > h1, h2, h5 {
            padding-top: 5px;
            text-align: center;
            
            text-shadow: 2px 2px 3px var(--corpreta);
        }

        section > h1 {
            padding-left:600px;
            text-align: center;
            font-size: 3.2em;
            color: var(--corbranca);
        }
    section>h5 {
        color: var(--corbranca);
        font-size: 1.2em;
        
    }

    
    .textohome>h3
        {
            font-size: 1.55em;
            color: var(--corbranca);
            text-align: justify;
            font-weight: 100;
            text-shadow: 4px 3px 7px black;
            padding-right:10px;
            padding-left:650px;
            max-width: 1300px;
            margin: auto;
        }
    .textohome
	{
	  display: block;
	  
	}
    section>h2,h5 {    
        color:var(--corverdec);
        margin:30px;
	    padding-left:600px;
        font-size: 2.9em;
        font-family: var(--fonte-tema);     
    }
    div>.emater-Text ,div>.unimed-Text
        {
        max-width: 1000px;
        margin-top:0px;
        font-weight: 100;
        padding-top: 20px;
        font-size: 22px;
        text-align: justify;
        
        background: var(--corbranca);
        color:var(--corpreta);
    }
    
    
    .menu-toggle
    {
        display: none;
    }
   
    .link-area
    {
    position:fixed;
    bottom:5px;
    text-align: center;
    left:20px;
    z-index: 3;  
    padding:15px;
    border-radius:20px;
    background:rgb(7, 230, 37);
    }
    .link-area a
    {
    text-decoration:none;
    color:var(--corpreta);
    font-size:20px;
    }
    .link-area a span{
    color: var(--corbranca);
    }
}
@media screen and (min-width: 1758px) { /* telas grandes*/
    .homedv1 {
        background-image: url('../IMAGENS/AMAERHOME/maos.jpg');
        display: block;
        background-size: cover;
        background-position: top center;
        margin-top: auto;
     }
    .menu{
     align-items: center;

     display: inline-block;
     margin-left:900px;
     /* margin-top: 3.5%; */ 
     vertical-align: top;
     height: 100px;
     margin-top: -50px;
     
     
     color: var(--corverdec);
    }
    .menu-toggle
    {
        display: none;
    }
     section {
        padding-top: 10vh;
        padding-bottom: 10vh;
        
    }
    
    section > h1,h2,h5 {
        padding-top: 5px;
		padding-left: 990px;
        text-align: center;
        text-shadow: 2px 2px 3px var(--corpreta);
    }
    
    section>h1 {
        margin-top: 0px;
        text-align: center;
        font-size: 2.9em;
        color:var(--corbranca);
    }
    section>h5 {
        color: var(--corbranca);
        font-size: 1.4em;
        
    }
    
    .textohome>h3
        {
            font-size: 1.8em;
            color: var(--corbranca);
            text-align: justify;
            font-weight: 1000px;
            text-shadow: 2px 2px 1px black;
            padding: 30px;
			padding-left: 990px;
            max-width: 2350px;
            margin: auto;
        }
    
    section>h2 {    
        color:var(--corverdec);
        margin:30px;
        font-size: 2.8em;
        font-family: var(--fonte-tema);     
    }
    div>.emater-Text ,div> .unimed-Text
        {
        margin-top: 0px;
        font-size: 25px;
        text-align: justify;
        padding: 5px;
        background: var(--corbranca);
        color:var(--corpreta);
        max-width: 800px;
        
        
    }
    
    
    
}