@font-face {
    font-family: 'Circular Bold Medium';
    src: URL('CircularStd-Regular.otf') format('truetype');
}

*{
	margin:0;
	padding:0;
	font-family:system-ui, helvetica;
	/*font-family: 'Circular Bold Medium';*/
	    

	outline: none;
}


body{
	    background: #f7f7f7;
}


a{
	text-decoration: none;
}


 a{
	color: #03a9f4;
}

li{
	list-style: none;
}


h1{
	display: inline-block;
    padding: 3px 10px;
    border-radius: 3px;
    color: #24292e;
    border: 1px solid #24292e;
    font-size: 14px;
    border-bottom: 3px solid #24292e;
}



header{
	    text-align: right;
    background: #ffffff;
    border-bottom: 1px solid #e9e9e9;
    padding: 20px 0px;
    box-shadow: 0px 1px 4px 1px #e9e9e9;
}



header nav{
	    max-width: 1080px;
    margin: auto;
}



section{
	
    margin: auto;
  

}
header nav a{
	display: inline-block;
    margin: 8px;
    font-size: 14px;
        color: #24292e;
    font-weight: 500;
}

header nav a:hover{
        color: #3c6778;
}




.h1{
	display: inline-block;
    margin: 0px auto 0px 0px;
    text-align: left;
    width: 50%;

}
.h1 span{
	font-size: 17px;
         color: #24292e;
    font-weight: 600;
    margin-left: 10px;
}


.menu{
	display: inline-block;
    width: 48%;
    margin: 0px 0px 0px auto;
    text-align: right;
}




#log{
    max-width: 480px;
    margin: auto;
    position: fixed;
    left: 10%;
    right: 10%;
    border: 1px solid #e9e9e9;
    padding: 0px 0px 20px 0px;
}



#log .caixa{
    
 border-right:0px;
 
}


#log .senharec{
    width: 86%;
    margin: 5px auto;
    max-width: 300px;
}


#log button.fecha{
      background: transparent;
    border: 0px solid #e9e9e9;
    padding: 5px 10px;
    margin: 5px 5px 0px auto;
    display: block;
    border-radius: 3px;
    font-weight: 800;
    cursor: pointer;
    color: #24292e;
    font-family: cursive;
    font-size: 12px;
}

h3, h2{
	   
       margin: 20px auto 5px auto;
   color: #24292e;
    font-size: 30px;
    text-align: center;
    font-weight: 500;

}

h3{
    font-size:20px;
    margin-top:2px;
    margin-bottom:20px;
    font-weight: 400;
}





form{
	 width:100%;

}


form h3{
	    background: #ffffff;
    padding: 10px 0px 5px 0px;
    text-align: center;
    color: #24292e;
    font-size: 16px;
    margin-top: 10px;
        font-family: 'Circular Bold Medium';
}



#log form h3{
    padding: 0px 0px 5px 0px;
    margin-top:0px;
}

form .key{
	margin: 10px auto 10px auto;
    text-align: center;
    width: 80%;
    border: 1px solid #e7efef;
    background: transparent;
    max-width: 340px;
    border-radius: 3px;
    }
    
    
    form .key i{
        color: #a9b3be;
    margin-left: 3%;
    font-size: 14px;
    }




.icon-wrench{
        color: aquamarine;
}


.icon-qrcode{
        color: #3c6778;
}


.icon-list-ul{
        color: #523302;
}
 form input{
padding: 15px 0.9%;
    width: 86%;
    margin-left: 1%;
    display: inline;
    border: 0px;
    border-radius: 3px;
    color: #2e5454;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: transparent;
    font-size: 14px;
}


	::-webkit-input-placeholder {
   color: #6f8b99;
}

:-moz-placeholder { /* Firefox 18- */
  color: #6f8b99;
}

::-moz-placeholder {  /* Firefox 19+ */
  color: #6f8b99;
}

:-ms-input-placeholder {  
   color: #6f8b99;
}


form .bedit button{
	    cursor: pointer;
    display: block;
    background: #03a9f4;
    color: white;
    border: 1px solid #069ade;
    border-radius: 3px;
    padding: 10px 0px;
    margin: 15px 0px 10px 0;
    font-weight: bold;
    width: 100%;
    box-sizing: content-box;

}



form .bedit{
margin: 10px auto;
    width: 80%;
    max-width: 340px;
}


.senharec{
	    width: 87%;
    margin: 20px auto;
    margin-top:10px;
    max-width: 330px;
    text-align: left;
}


.senharec a{

	    font-size: 14px;
}



.cadastro01{
	margin: 20px auto;
    width: 89%;
    text-align: center;
    max-width: 300px;
}

.cadastro01 p{
	font-size: 14px;
	color: #607d8b;
}		



.cadastro01 a{
	color: #03a9f4
}







/**********//*******************/

.geral2, .geral{
	    grid-template-columns: repeat(2, 1fr);
    display: grid;
    margin: auto;
    max-width:1080px;
    
}



.caixa2{
    background: white;

    
}



.caixa4{
    margin: 0px auto;
    border: 1px solid #e9e9e9;
    background: white;
    margin: 20px 10px;
}

.geral .backf, .geral .backf2{
	  
    background: #fff;
    padding: 47px 0px;
    border: 1px solid #e9e9e9;
    margin: 10px;
        border-radius: 5px;
    box-shadow: 0px 1px 5px 1px #e9e9e9;
}



.geral .backf2{
    padding: 46px 0px;
    margin: 10px;
    


}


.geral .backf2 h3{
    font-size: 20px;
    text-align: center;
    color: #24292e;
        font-family: 'Circular Bold Medium';
}


.geral .backf2 h3.abreh{
    padding:19px 23px;
    margin:0px auto;
}


.geral a{
	font-weight: 500;
}



.geral .backf h3{
	font-size: 20px;
    text-align: center;
    color: #24292e;
        font-family: 'Circular Bold Medium';
}


.imgn{
    margin: 10px auto;
    width: 98%;
}


.imgn .item1{
        background: #fff;
    padding: 38px 0px;
    border: 1px solid #e9e9e9;
    margin: 10px;
    width: 98%;
}

.imgn a{
font-weight: 500;
	}


.imgn h3{
	    text-align: center;
    color: #607d8b;
    margin: 10px auto;
    font-size: 20px;
   
    width: 96%;
}



.caixa{
    border-right: 1px solid #e9e9e9;
    margin-top:20px;
}


.caixa2 .caixa{
    margin-top:5px;
}


.caixa3{
        grid-template-columns: repeat(2, 1fr);
    display: grid;
    margin: 10px 0px 0px 0px;
    background: white;
    border-top: 1px solid #e9e9e9;
}



.demo{
	    margin: 40px auto;
    text-align: center;
    font-size: 20px;
}

.demo2{
    margin: 0px auto;
    text-align: center;
    font-size: 20px;
    padding-bottom: 20px;
    padding-top: 30px;

}


.demo h3, .demo2 h3{
    color: #24292e;
    font-size: 23px;
    padding: 2px;
    margin-top: 20px;
}


.demo2 h3 a{
	font-weight: 500;
	font-size:20px;
}



.geral .spanf, .imgn .spanf{
    display: block;
    margin: 10px auto;
    text-align: center;
    border: 1px solid #b8c2c7;
    width: auto;
    padding: 15px 2px;
    width: 40px;
    border-radius: 3px;
}









/********************/
footer{
      color: #595f64;
    font-size: 12px;
  
    clear: both;
    bottom: 0;
    background: #ffffff;
    border-top: 1px solid #e1e1e1;
    padding: 10px 0px 10px 10px;
    text-align:center;
    
    

}


footer p {
    font-size: 12px;
    max-width: 1080px;
    margin: 5px auto;   
    font-family: 'Circular Bold Medium';
        
    }


    .footer{
    	max-width: 1080px;
    	margin: auto;
    }
    


.logofin{
        display: inline-block;
    padding: 0px 4px;
    border-radius: 3px;
    color: #24292e;
    border: 1px solid #24292e;
    font-size: 8px;
    border-bottom: 2px solid #24292e;
}

.postc{
    text-align: center;
}

.postc h1{
    margin: auto;
    text-align: center;
    display: block;
    max-width: 500px;
}


.postc .inicio{
    padding: 10px 20px;
    background: transparent;
    border: 1px solid #607d8b;
    border-radius: 3px;
    cursor:pointer;
}
    
    
    
    .postc .paga{
            padding: 10px 20px;
    border: 1px solid #177456;
    border-radius: 3px;
    background: #11bb6c;
    color: #f7f7f7;
    margin-left: 10px;
    cursor:pointer;

    }
    
    
    
    
    
    
    
    
    
    

@media only screen and (max-width: 480px) {
    
    
   #log .senharec{
           width: 80%;
        max-width:300px;
    }
    
    
   .caixa2 .senharec{
           width: 80%;
        max-width:300px;
        margin-top:10px;
    }
    
    
    .geral .backf h3, .geral .backf2 h3{
    font-size: 16px;
    font-weight: 200;
    }
    #moboff{
        display:none;
    }
	         form{
	             width:98%;
	         }
	         
	         .geral2, .geral{
	             display:block;
	         }
	         
	         
	         .caixa3{
	             display:block;
	         }
	         
	         .caixa {
    border-right: 0px;
	         }
	         
	         .geral2 .imgn, .geral2 .caixa2, .geral .backf, .geral .backf2 {
    width: 98%;
   margin: 20px auto;
    
	         }
	         
	         
	         
	         header nav a{
	                 margin: 8px 2px;
    font-size: 11px;
    display:inline;
    
	         }
	         
	         .menu{
	             width: 58%;
	         }
	         
	         
	         .h1{
	             width: 38%;
	         }
	            .h1 span{
	             margin-left:5px;
	         }
	         
	         .demo2{
	                 border-top: 1px solid #e9e9e9;
    margin-top: 22px;

	         }
	         
	         .demo2 h3{
	             font-size: 18px;
	         }
	      .preco  h2{
	            font-size: 18px;
	        }
	       .preco h3{
	            font-size:14px;
	        }

	     }