/**
*   Folha de estilos da pagina principal do questionario
*/


body {
   background-color: #1FAB89;
   color: #fff;
}


hr {
   width: 100%;
   height: 1px;
   margin: 100px 0;
   background-color: #DDDDDD;
   border: none;
}


p {
   line-height: 1.5em;
}

i.light {
   font-family: 'latolight_italic';
   font-size: 1.1em;
}


.txt_destaque {
   font-size: 2em;
   font-family: 'latolight';
}
.txt_destaque b {
   font-family: 'latoblack';
}


#site {
   width: 100%;
   padding: 0;
}

#content {
   display: flow-root;  /** table;*/
   width: 1100px;
   margin: 50px auto 0 auto;
}


#content .txt1 {
   margin-left: -0;
}
#content .txt2 {
   margin-left: 0;
}
#content .txt3 {
   margin: -50px 0 0 auto;
}
#content .txt4 {
   margin: 0 auto 0 0;
}
#content .txt5 {
   margin: 100px 0 40px 0;
   text-align:center;
}
#content .txt5 p {
   letter-spacing: 0.1em;
}
#content .txt6 {
   margin: 0 auto 0 0;
}
#content .txt7 {
   margin: 0 0 0 auto;
}
#content .txt8 {
   margin: 80px auto 40px 0;
}
#content .txt9 {
   margin: 80px auto 80px 0;
   text-align:center;
}


#content .buttons {
   text-align: center;
}
#content .button_comecar {
   display: inline-block;
   width: 320px;
   padding: 15px 35px;
   font-size: 1.7em;
   background-color: var(--laranja);
}
#content .button_comecar:first-child {
   margin-right: 30px;
}

#content .circulo_slogan_all {
   position: relative;
   z-index: -10;
}
#content #circulo_slogan1 {
   margin: -60px 0 -60px auto;
}
#content #circulo_slogan2 {
   margin: -60px auto 40px 0;
}
#content #circulo_slogan3 {
   margin: 0 0 40px auto;
}



#content #contato {
   margin: 80px 0;
}
#content #contato form {
   margin: 50px auto;
}
#content #contato form input,
#content #contato form textarea {
   background-color: #fff;
   border: 1px solid #888888;
   -webkit-border-radius: 2px;
   -moz-border-radius: 2px;
   border-radius: 2px;
}
#content #contato form input {
   width: 100%;
}
#content #contato form textarea {
   height: 130px;
   resize: none;
}



/*
footer {
   padding: 40px;
   background-color: var(--laranja);
}
footer .grid {
   grid-gap: 0 0;
   grid-template-areas: 'a b';
   grid-template-columns: 63% auto;
}
footer .grid .a div {
   padding: 40px 25px 0 25px;
   background-color: #fff;
}
footer .grid .a div span {
   display: inline-block;
   margin-right: 35px;
   margin-bottom: 40px;
}
footer .grid .b div {
   margin-top: 80px;
   text-align: center;
}
footer .grid .b div a {
   display: inline-block;
   margin-right: 20px;
}
footer .grid .b div a img {
   filter: brightness(10) contrast(10);
}
*/


/*** MOBILE MEDIA */
@media (max-width:767px) {

   .small,
   .media,
   .full {
      width: 95vw !important;
   }

   hr {
      margin: 30px 0;
   }

   #content {
      width: 100vw;
      margin: 0 auto;
   }
   #content #contato {
      margin: 30px 0;
   }
   #content .media .small {
      margin: 0 auto;
      width: 100%;
   }


   #content .txt1,
   #content .txt2,
   #content .txt3,
   #content .txt4,
   #content .txt6,
   #content .txt7,
   #content .txt8 {
      margin: 40px auto;
   }
   #content .txt5,
   #content .txt9 {
      margin: 60px auto;
   }


   #content #circulo_slogan1,
   #content #circulo_slogan2,
   #content #circulo_slogan3 {
      margin: 30px auto;
   }


   #content .button_comecar {
      display: block;
      width: 90%;
      padding: 15px;
      margin: 0 auto 35px auto;
      font-size: 1.6em;
      background-color: var(--laranja);
   }
   #content .button_comecar:first-child {
      margin: 0 auto 35px auto;
   }

   form button[value="enviar"] {
      margin: 0 auto;
      display: block;
      font-size: 1.3em;
      padding: 15px 35px;
   }

}



/*** TABLE MEDIA */
@media (min-width:768px) and (max-width:1023px) {

   .media {
      width: 90vw !important;
   }

   hr {
      margin: 60px 0;
   }


   #content {
      width: 95vw;
   }


   /*
   footer .grid {
      grid-template-areas: 'a' 'b';
      grid-template-columns: 100%;
   }
   footer .grid .b div {
      margin-top: 40px;
   }
   footer .grid .a div span {
      margin-right: 12px;
   }
   footer .grid .a div span img {
      width: 80%;
   }
   */

}

/*** DESKTOP MEDIA */
@media (min-width: 1024px) {

}
