@font-face {
    font-family: HP Simplified;
   src: url(HPSimplified_Rg.ttf);
 }
 @import url('https://fonts.googleapis.com/css2?family=Roboto');
 @import url('https://fonts.googleapis.com/css2?family=Raleway');
body{
	background-color: #f2f2f2 !important;
	color: white;
	font-family: ARIAL;
	max-height: 100vh;
	
	
}

    img.bg_medidas {
        width: 100%;
        margin-top: -74px;
        margin-left: 1px;
        z-index: 1;
    }

span.altura {
    position: absolute;
    left: 85px;
    top: 271px;
}
span.largura {
    position: absolute;
    left: 183px;
    top: 459px;
}
span.vinco {
    position: absolute;
    top: 290px;
    left: 360px;
    font-size: 14px;
}
span.margem {
    position: absolute;
    top: 92px;
    left: 435px;
}
span.albtitulo {
    position: absolute;
    left: 40%;
    top: 51px;
}
span.result {
    position: absolute;
    top: 572px;
    left: 596px;
    font-size: 20px;
    font-weight: bold;
    
}
span.dorso {
    position: absolute;
    left: 425px;
    top: 310px;
    font-size: 15px;

}
span.laminatitulo {
    position: absolute;
    top: 652px;
    font-size: 20px;
}
span.altural {
    position: absolute;
    top: 895px;
    left: 86px;
}

span.largural {
    position: absolute;
    top: 1078px;
    left: 193px;
}
span.margeml {
    position: absolute;
    left: 429px;
    top: 685px;
}
span.resultl {
    position: absolute;
    top: 1170px;
    left: 629px;
    font-weight: bold;
}
img.bg_medidasl {
    width: 100%;
}
.area-btns {
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: baseline;
    flex-direction: column;
    padding: 29px;
}
input.btn.btn-danger {
    padding: 5px;
}
form{
	font-weight: 400;
}
#logointer {
    float: right;
    margin-top: -67px;
}
.menu ul li{
	list-style-type:none;
	display:inline-block;
	transition: 0.3s;
	font-family: 'Roboto', sans-serif;	
}

.cabecalho{
	height: 5.3125rem;
    background-color: #fff;
    /* margin-top: -48px; */
    padding: 5px;

}
.logo{
	width: 235px;
	height: 67px;
}
.menu a:hover{
		color:#F5082F;
		text-decoration: underline;
	
}
.menu a{
	color:#444444;
	font-size: 16px;
	padding:14px;
	font-weight: 400;
	text-decoration: none;
}
.menu{
    margin-left: 29%;
    width: 1020px;
    height: 74px;
    margin-top: -36px;
    
	
}


/*--------*/
.menu2 ul li{
	list-style-type:none !important;
	display:inline-block;
	padding:10px;
	margin-right:20px;
	transition: 0.3s;
	
	
}
.menu2 a:hover{
	
		background-color:#eee;
	
}
.menu2 a{
	color:#787878;
	transition:0.2s;
	font-size: 20px;
	padding:15px;
}


header img{
    margin-top: -10px;
    display: block;
    padding: 9px;
}
#interface {
    
    
    
    
    width: 900px;
    margin: 19px auto;
    background-color: white;
    padding-right: 20px;
    padding-left: 20px;
    padding-bottom: 20px;
    padding-top: 20px;
    border-radius: 5px;
     box-shadow: 0px 1px 2px grey;
    height: auto;
    color: #101010;
}
#maispag {
    margin-top: -34px;
    position: absolute;
    width: 25%;
    left: 36%;
}
select#pag {
    width: 24%;
}
/*#interface{
    background-image: url('../image/logo.png');
    background-repeat: no-repeat;
    background-position: 767px 151px;
    width: 900px;
    margin: 40px auto;
    background-color: #ff2111;
    padding-right: 20px;
    padding-left: 20px;
    padding-bottom: 20px;
    padding-top: 1px;
    border-radius: 7px;
    box-shadow: 0px 1px 2px gray;
    height: auto;
}*/
#interface h4 {
    text-align: center;
    color: black;
    font-family: 'Roboto',sans-serif;
}
span.foco{
	color:#ef4337;
	font-weight:bold;
}
#interface h1{
	font-size: 20px;
	color: white;
	text-align:center;
	
}

#saidas{
	text-align:center;
}	

#formulario input {
	width: 100px;
	background-color:#5680ea4d;
	border:1px;
	border-radius:5px ;
	padding:5px;
	appearance: textfield;
	text-align:center;
	text-transform:uppercase;
	
	
	
} 

input{
	width: 121px;
    	border-radius: 3px;
    	padding: 2px;
}
.addpag {
    border: 1px solid black;
    width: 212px !important;
    margin-left: 172px !important;
}
/*select, input[type="text"] {
   padding: 5px;
    margin-top: 10px;
    margin-right: 13px;
    border-radius: 5px;
    
    
    margin-left: 109px;
	width: 65%;
}*/
select.malbum {
    margin-left: 125px;
}
.adic {
    margin-left: 32px;
}
.talbum {
    margin-left: 43px;
}
select:hover {
    border: 1px solid #43b2e6;
}
#formulario input:hover{
	border:2px black;
}
#camp_codigo{
	width:5em;
}
#camp_descricao{
	width:300px;
}
#camp_preco{
	width:50px;
}
fieldset{
	width:500px;

	margin-top:15px;
}

#bt:hover {
    background-color: #fc2619 !important;
    color: white;
}
#bt {
    color: white;
    background-color: #ff2111 !important;
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
    padding: 12px;
    /* margin-left: 108px; */
    font-weight: bold;
    border: none;
    display: block;
}


	
a{
	text-decoration:none;
}
#bt:hover{
	background-color:#fc2619 !important;
	color:white;
}
#downsec{
	
	width:900px;
	display:block;
	margin:0 auto;
	
}
#downsec img{
	margin-left: -80px;
	width: 100%;
}
#downsec h2{
	font-family:HP Simplified;
	font-size: 20px;
	color:gray;
}


footer{
	font-family: 'Raleway', sans-serif !important;
}
footer img {
    position: absolute;
        margin-top: 118px;
    	margin-left: 50px;
   
}
.freelalogo{
   width: 103px;
    margin-left: 91%;
    margin-top: 148px;
}
@media screen and (max-width: 1336px) {
    span.margem {
        
        left: 644px;
    }
    span.vinco {
       
        left: 570px;
        
    }
    span.dorso {
       
        left: 633px;
        top: 413px;
       
    }
    span.altura {
     
        left: 294px;
        
    }
    span.largura {
        position: absolute;
        left: 394px;
        top: 560px;
    }
    span.result {
      
        top: 670px;
        left: 804px;
       
    }
    span.margeml {
        
        left: 643px;
       
    }
    span.altural {
       
        left: 303px;
    }
    span.largural {
     
        left: 404px;
    }
    span.resultl {
       
        left: 831px;
        
    }
  }