default.css

header{

    margin-left:-10px;
    margin-right:-10px;
    margin-top:-10px;
    height:150px;
    background: #0A2A12;
    position:relative;
    min-width: 1300px;
}

body{
    height: 900px;
    background-image: radial-gradient(#37934c, #145f26);
}

/*--------------------------------- INDEX -----------------------------------*/

#login{
    text-align: center;
    font-size: 30px;
    font-family: 'Abel', sans-serif;
    color: white;
    padding-top: 120px;
    position: relative;
    min-width: 1100px;
    p{
        position: center;
    }
}

.caixa_inf{
    border: 0px;
    padding: 15px;
    margin: 20px 2px 0 0;
    font-size: 25px;
    font-family: 'Abel', sans-serif;

}
.button_entrar{
    margin: 20px 0 200px 0;
    border: 0;
    background: #0A2A12;
    color: white;
    font-size: 30px;
    padding: 8px 40px;

}

/*--------------------------------- RECEITAS ----------------------------------*/

#caixa{
    height: 3000px;
    margin-top: 0px;
    margin-left: 30px;
    margin-right: 30;
    margin-bottom: 0px;
    width: 1000px;
    display: inline-block;  
}

.diet{
    position: relative;
    top:100px;
    height: 500px; 
}

#iddiet{
    position: relative;
    bottom: 100px;
    right: 40px;
    font-size: 50px;
}

.light{
    position: relative;
    top:50px;
    height: 500px; 
}

#idlight{
    position: relative;
    bottom: 100px;
    right: 40px;
    font-size: 50px;
}

.sem_gluten{
    position: relative;
    top:100px;
    height: 500px; 
}

#idsgluten{
    position: relative;
    bottom: 100px;
    right: 40px;
    font-size: 50px;
}

.sem_lactose{
    position: relative;
    top:1480px;
    height: 500px; 
}

#idslactose{
    position: relative;
    bottom: 100px;
    right: 40px;
    font-size: 50px;
}

#nomereceita{
    position: relative;
    bottom: 23px;
    right: 48px;
    color: white;
    font-size: 20px;
    font-family: 'Abel', sans-serif;
}
.receita{
    width: 250px;
    height: 250px;
    background-color: rgba(10, 42, 18, 0.5);
    position: absolute;
    top: -20px;
}
.tipo_receita p{
    color: white;
    font-size: 40px;
    font-family: 'Abel', sans-serif;
}
 .tipo_receita .receita p{
    font-size: 20px;
    color: white;
    margin-top: 0;
    margin-left: 0;
    font-family: 'Abel', sans-serif;
}
#menor{
    height: 300px;
}
#cookieUsuarioReceitas{
    position: relative;
    left: 950px;
    bottom: 3000px;
    height: 43px;
    width: 295px;
}

#cookieTextoReceitas{
    color:white;
    position: relative;
    right: 40px;
    bottom: 12px;
}
 #sairReceitas{
    position: relative;
    left: 254px;
    bottom: 55px;
    font-size: 18px;
 }

 #cookieUsuarioReceita{
    position: relative;
    bottom: 2610px;
    left: 910px;
 }

 #cookieTextoReceita{
    color: white;
 }

 #sairReceita{
    position: relative;
    left: 300px;
    bottom: 42px;
 }

 #origemTexto{
    position: relative;
    bottom: 1000px;
 }

/*--------------------------------- RECEITA ----------------------------------*/

h1{
    text-align: center;
    color: white;
    font-family: 'Abel', sans-serif;
}

p{
    margin-left: 50px;
    color: white;
    font-family: 'Abel', sans-serif;
    font-size: 20px;
}



#rece_esque{
    position: relative;
    top: 50px;
    height: 1200px;
}

#rece_tab{
    position: relative;
    bottom: 120px;
    left: 900px;

}

#rece_info{
    position: relative;
    left: 405px;
    bottom: 700px;
    width: 400px;
    font-family: 'Abel', sans-serif;
}
#origem{
    position: relative;
    text-align: center;
    color: white;
    bottom: 1000px;
    right: 20px;
}

#rece_img{
    width: 400px;
    position: relative;
    height: 200px;
    bottom: 120px;
    top: 150px;
    left: 50px;
}
#ohref{
    text-align: center;
}

h2{
    color: white;
    text-align: center;
    font-family: 'Abel', sans-serif;
}

#ing{
    font-size: 19px;
}
a:link{
    color: white;
}
a:visited{
    color: #0A2A12;
}
a:hover{
    color:#0A2A12;
}
a:active{
    color:#0A2A12;
}


#origemUrl{
    position: relative;
    left: 80px;
}



/*--------------------------------- LOCAIS ----------------------------------*/

#caixa_locais{
    width: 700px;
    height: 3300px;
    padding-bottom: 30px;

}
#caixa_restaurantes{
    width: 700px;
    margin-top: 200px;
    height: 2000px;
    margin-left: 740px;
    margin-top: -3135px; 
}

.locais{
    height: 160px;
    width: 350px;
    background-color: rgba(10, 42, 18, 0.5);
    margin-top: 20px;
    position: absolute;
    border: 4px solid;

}
h3{
    font-size: 50px;
    color: black;
    margin-left: 300px;
}

#caixa_restaurantes .locais{
    border-color: grey;
}
#caixa_locais .locais{
    border-color: white;
}
#caixa_restaurantes h3{
    color: grey;
    margin-left: 190px;
    
    
}
#caixa_restaurantes{
    padding-top: 0;
    margin-top: 0;
    top: -3310px;
    position: relative;
}
.locais p{
    max-width: 140px;
    
}
.top{
    padding-top: 175px;
}
.left{
    padding-left: 365px;
}
.nome_local {
    color: white;
    font-size: 19px;
    left: 160px;
    top: -155px;
    position: relative;
}
.pagina{
    display: inline;
    margin-bottom: 220px;
}

#cookieUsuarioLocais{
    position: relative;
    left: 920px;
    bottom: 5350px;
    height: 43px;
    width: 325px;
    color: white;
}

#cookieTextoLocais{
    color:white;
    position: relative;
    right: 40px;
    bottom: 12px;
}
 #sairLocais{
    position: relative;
    left: 274px;
    bottom: 55px;
    font-size: 18px;
    color: white;
 }
 #favoritos{
    top: -100px;
    position: relative;
    padding-top: 0; 
 }


 #cookieUsuarioLocal{
    position: relative;
    bottom: 610px;
    left: 900px;
    color: white;
 }

 #cookieTextoLocal{
    position: relative;
    color: white;
 }

 #sairLocal{
    position: relative;
    color: white;
    left: 310px;
    bottom: 42px;
 }


 #buttonFavorito{
    position: relative;
    bottom: 875px;
    left: 380px;
    background-image: url("icones/estrela_claro.png") ;
 }

 #estre_fav{
    position: relative;
    top:-450px;
    left: 500px;  
 }

/*------------------------------- RESTAURANTE -------------------------------*/ 

.local{
    margin: 0 auto;
    margin-right: 50px;
    margin-top: 50px;
    height: 400px;
    width: 1200px;
}
#imagem_local
{
    position:relative;
    top:50px
    max-height: 400px;
}
#plocal{
    color:white;
    margin-left: 450px;    
    text-align: center;

}
#description{
    margin: 0 auto;
    margin-left: 0px;
    width: 700px;
    position: relative;
    left:500px;
    top:-250px;
    text-align: justify;

}
#textlocal{
    font-size: 25;
    color: white;
    position: relative;
    left:-10px;
    text-align: center;
}
#intro{
    color:white;
    position: relative;
    left:-40;
    top:30px;
}

#infra{
    color: white;
}
#address{
    color:white;
    position: relative;
    text-align: center;
    left:-40;
    top:70px;
    padding-bottom: 0;

}

#address2{
    color:white;
    position: relative;
    text-align: center;
    left:-40;
    font-size: 17px;
    top:50px;
    padding-bottom: 0;

}

.nome{
    font-size: 18px;
    font-family: 'Abel', sans-serif;
    color: #0A2A12;
    padding: 6px 36px 6px 36px;
}
.email{

    font-size: 18px;
    font-family: 'Abel', sans-serif;
    color: #0A2A12;
    padding: 6px 36px 6px 36px;
}
.enviar{
    top: 220px;   
    font-family: 'Abel', sans-serif;
    color: white;
    border: 0;    
    position: relative;

    margin: 20px;
    background: #0A2A12;
    color: white;
    font-size: 30px;
    padding: 8px 40px;
}
.comentario{
    font-size: 35px;
    font-family: 'Abel', sans-serif;
    color: white;    
    padding: 36px 34px 36px 34px;
    max-width: 175px;
    max-height: 46px;
    position: relative;
    top: 400px;
    margin: 0 auto;
}


.caixacomment{    
    font-family: 'Abel', sans-serif;
    color: #0A2A12;
    font-style: bold;    
    padding: 100px 400px 0px 34px;
    width: 200px;
    height: 100px;
    position: relative;
    top: 300px;
    margin: 0 auto;
    /*margin-bottom: 300px;*/
}

.star-rating{
  font-size: 0;
  white-space: nowrap;
  display: inline-block;
  width: 300px;
  height: 50px;
  overflow: hidden;
  position: relative;
  background: url('icones/red_chili_pepper2.png');
  background-size: contain;
  margin-left: 100px;
}
i{
  opacity: 0;
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 20%;
  z-index: 1;
  background: url('icones/red_chili_pepper.png');
  background-size: contain;
  }
#rating{ 
  -moz-appearance: none;
  -webkit-appearance: none;
  opacity: 0;
  display: inline-block;
  width: 20%;
  height: 100%;
  margin: 0;
  padding: 0;
  z-index: 2;
  position: relative;
 }
.star-rating input:hover + i,
.star-rating input:checked + i{
 
  opacity: 1;
}
 .star-rating i ~ i {
  width: 40%;
}
 .star-rating i ~ i ~ i {
  width: 60%;
}
 .star-rating i ~ i ~ i ~ i {
  width: 80%;
}
.star-rating i ~ i ~ i ~ i ~ i {
  width: 100%;
}

.choice {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  text-align: center;
  padding: 20px;
  display: block;
}
.body,
::after,
::before {
  height: 100%;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  text-align: center;
  vertical-align: middle;
}
.body {
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.body::before {
  height: 100%;
  content: '';
  width: 0;
  background: red;
  vertical-align: middle;
  display: inline-block;
}

.comentariosteste{
    display: inline;
    position:relative;
    top: 420px;  
    bottom: 200px;
}

.username{    
    position: relative;
    left: 120px;
    text-align: left;
    font-size: 20px;
    font-style: bold;
}

.datahora{   
    position: relative;
    top: -30px;
    left: 938px;
    text-align: left;
    font-size: 13px;
    font-style: bold;
}
.comment{
    position: relative;
    top: -35px;
    font-size: 15px;
    max-width: 900px;
    margin: 0 auto;    
    border: solid 1.5px #0A2A12;
    background-color: #0A2A12;
    padding: 10px;  
}

.com{
    position: relative;
    bottom: 500px;
}

/*--------------------------------- SOBRE -----------------------------------*/


#titulo{
    font-size: 30px;
    font-family: 'Abel', sans-serif;
    color: white;
    text-align: center;
    padding-top: 120px;
}
#tudo{
    
    min-width: 1000px;
}
#sobre{
    font-size: 18px;
    font-family: 'Abel', sans-serif;
    color: white;
    margin-left: 190px;
    margin-top: -140px;
    max-width: 450px;
    min-width: 400px;
    text-align: center;
}
#contato{
    font-size: 18px;
    font-family: 'Abel', sans-serif;
    color: white;
    max-width: 400px;
    margin-left: 800px;
    min-width: 400px;
    text-align: center;
}


/*--------------------------------- MAPA -----------------------------------*/

#googleMap{
    position: relative;
    top:-50px;
}

#pesquisa{
    font-size: 40px;
    font-family: 'Abel', sans-serif;
    color: white;
    padding: 30px 0 -200px 75px;
    margin: 0;
    left: 10px;
    position: relative;
    text-align: left;
}
#pbusca{
    font-size: 40px;
    font-family: 'Abel', sans-serif;
    color: white;
    text-align: left;
    padding: 0;
    margin: 0;
    margin-top: 5px;
    
}
#mapa{
    top: -15px;
    position: relative;
    left: 30px;
}
#checkboxMapa{
    position: relative;
    left: 900px;
    top:-50px;
}

#errodepesquisa{
    position: relative;
    top:-70px;
    left:17px;
    color:white;
    font-size: 15px;
}
.caixainput{
    border: 0px;
    padding: 0;
    margin: 20px 2px 0 0;
    font-size: 20px;
    font-family: 'Abel', sans-serif;
    left: 100px;
    top: -40px;
    height: 25px;

}
.botaobusca{
    margin: 20px 0 0 0;
    border: 0;
    background: #0A2A12;
    color: white;
    font-size: 20px;
    padding: 0;
    height: 25px;
    top: 3px;
    position: relative;
}

.infoBox { 
    background-color: white; 
    width: 300px; 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 14px; 
    border: 2px solid #3fa7d8; 
    border-radius: 3px; 
    margin-top: 10px; 
    color: black;
}
.infoBox p { 
    padding: 0; 
    color:black;
}
.infoBox:before { 
    border-left: 10px solid transparent; 
    border-right: 10px solid transparent; 
    border-bottom: 10px solid #3fa7d8; 
    top: -10px; 
    content: ""; 
    height: 0; 
    position: absolute; 
    width: 0; 
    left: 138px 
}

#cookieUsuarioMapa{
    position: relative;
    left: 950px;
    bottom: 786px;
    height: 43px;
    width: 295px;
    border:solid;
    border-image: radial-gradient(#37934c, #145f26);
}

#cookieTextoMapa{
    color:white;
    position: relative;
    right: 40px;
    bottom: 12px;
}
 #sairMapa{
    position: relative;
    left: 254px;
    bottom: 55px;
    font-size: 18px;
 }

/*--------------------------------- FAVORITOS -----------------------------------*/ 

.top1{
    padding-top: 175px;
    padding-left: 120px;
}
.left1{
    padding-left: 485px;
} 
.left2{
    padding-left: 850px;
}

#cookieUsuarioFavoritos{
    position: relative;
    bottom: 490px;
    left: 1000px;
}

#sairFavoritos{
    position: relative;
    left: 240px;
    bottom: 40px;
}