body{margin:0; padding:0; font-size:20px; font-family: Arial, Helvetica, sans-serif; color: #252525; background-color: #ffffff;}

/* HIGHLIGHT */

::-moz-selection { /* Code for Firefox */
  color: #fff;
  background: #25d366;
}

::selection {
  color: #fff;
  background: #25d366;
}

p{font-family: Arial, Helvetica, sans-serif; color: #252525; font-size:16px; line-height:24px;}

.link{color: #25d366; text-decoration: none;}
.link:hover{color: #25d366; text-decoration: underline;}

.linkb{color: #000000; text-decoration: none;}
.linkb:hover{color: #000000; text-decoration: underline;}

/* Radiobutton style */    
    
/* Customize the label (the container) */
.container {
  display: inline-block;
  position: relative;
  padding-left: 24px; 
  cursor: pointer;
  font-size: 16px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  margin-right: 16px;
  line-height: 20px;
}

/* Hide the browser's default radio button */
.container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 18px;
  width: 18px;
  background-color: #e2e6e9;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
  background-color: #d1d6db;
}

/* When the radio button is checked, add a blue background */
.container input:checked ~ .checkmark {
  background-color: #25d366;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.container .checkmark:after {
  top: 4px;
  left: 4px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: white;
}

#resp {font-size:14px; color:#e80437; margin-top:20px; margin-bottom:-36px; display:inline-block;}

/***** DESKTOP *****/

@media (min-width:1000px) {

#logo{width:200px; height:auto; position:relative; margin-left:-100px; left:50%;}

/* LOGIN */
  #clogin{width:520px; height:490px; position:absolute; margin-left:-260px; left:50%; margin-top:-245px; top:50%; text-align: center; font-size: 14px;}
  #rlogin{width:520px; height:640px; position:absolute; margin-left:-260px; left:50%; margin-top:-320px; top:50%; text-align: center; font-size: 14px;}
  #hlogin{width:100%; height:29px; position:relative; margin-bottom:40px;}
  #boxlogin{width:500px; height:auto; padding: 60px 0 66px 0; position:relative; margin-left:-250px; left:50%; background-color:#f5f5f5; border-radius:20px; text-align:center; font-size:16px; margin-bottom: 20px;}
  .inputlg{background-color:#ffffff; border:1px solid #ffffff; width:320px; padding:20px; font-size:20px; margin-top:14px; border-radius: 8px;}
  #frase {width:80%; height:auto; position:relative; margin-left:-40%; left:50%; font-size:18px; line-height:26px;}
/* FIM LOGIN */

/* CRIA CONTA */
  #hconta{width:800px; height:29px; position:relative; margin-left:-400px; left:50%; margin-bottom:40px; margin-top:60px; text-align:left;}
  #boxconta{width:1000px; height:auto; padding: 60px 0 76px 0; position:relative; margin-left:-500px; left:50%; background-color:#f5f5f5; border-radius:20px; text-align:center; margin-bottom: 20px;}
  #divconta{width:800px; height:auto; position:relative; margin-left:-400px; left:50%; background-color:#f5f5f5; text-align:left;}
  #eye {margin-top:-43px; cursor:pointer; float:right; background-color:#fff; padding:12px; font-size:20px; margin-top:14px; border-radius: 8px;}
  #eye1 {padding-top:6px; height:30px;}
  #eye2 {padding-top:6px; height:30px;}
/* FIM CRIA CONTA */

.btn{background-color:#25d366; color:#ffffff; border:1px solid #25d366; padding:20px 30px; font-size:20px; border-radius: 8px;}
.btnp{background-color:#25d366; color:#ffffff; border:1px solid #25d366; padding:8px 14px; width:auto; border-radius: 8px; font-family: Arial, Helvetica, sans-serif; font-size:14px; line-height:28px; color:#fff; text-decoration:none;}

.input{background-color:#ffffff; border:1px solid #ffffff; width:758px; padding:20px; font-size:20px; margin-top:14px; border-radius: 8px;}
.inputpass{background-color:#ffffff; border:1px solid #ffffff; width:680px; padding:20px; font-size:20px; margin-top:14px; border-radius: 8px;}
.inputp{background-color:#ffffff; border:1px solid #ffffff; width:240px; padding:20px; font-size:20px; margin-top:14px; border-radius: 8px;}
.captcha{background-color:#ffffff; border:1px solid #ffffff; width:240px; padding:20px; font-size:20px; margin-top:14px; border-radius: 8px;}

}

/***** MOBILE *****/

@media (max-width:999px) {

#logo{width:200px; height:auto; position:relative; margin-left:-100px; left:50%;}

/* LOGIN */
  #clogin{width:90%; height:490px; position: absolute; margin-left:-45%; left:50%; margin-top:-245px; top:50%; text-align: center; font-size: 14px;}
  #rlogin{width:90%; height:640px; position: absolute; margin-left:-45%; left:50%; margin-top:-320px; top:50%; text-align: center; font-size: 14px;}
  #hlogin{width:100%; height:29px; position: relative; margin-bottom:40px;}
  #boxlogin{width:90%; height:auto; padding: 42px 0 56px 0; position:relative; margin-left:-45%; left:50%; background-color:#f5f5f5; border-radius:20px; text-align:center; font-size:16px; margin-bottom: 20px;}
  .inputlg{background-color:#ffffff; border:1px solid #ffffff; width:78%; padding:4%; font-size:20px; margin-top:14px; border-radius: 8px; font-size:16px;}
  #frase {width:70%; height:auto; position:relative; margin-left:-35%; left:50%; font-size:16px; line-height:22px;}
/* FIM LOGIN */

/* CRIA CONTA */
#hconta{width:90%; height:29px; position:relative; margin-left:-45%; left:50%; margin-bottom:40px; margin-top:60px; text-align:left;}
#boxconta{width:90%; height:auto; position:relative; margin-left:-45%; left:50%; padding: 60px 0 76px 0; position:relative; background-color:#f5f5f5; border-radius:20px; text-align:center;}
#divconta{width:82%; height:auto; position:relative; margin-left:-41%; left:50%; background-color:#f5f5f5; text-align:left; font-size:16px;}
#eye {right:4%; margin-top:-42px; z-index:99; position: absolute; cursor:pointer;}
#eye1 {padding-top:0px; height:24px;}
#eye2 {padding-top:0px; height:24px;}
/* FIM CRIA CONTA */

.btn{background-color:#25d366; color:#ffffff; border:1px solid #25d366; padding:20px 30px; font-size:20px; border-radius: 8px;}
.btnp{background-color:#25d366; color:#ffffff; border:1px solid #25d366; padding:8px 14px; width:auto; border-radius: 8px; font-family: Arial, Helvetica, sans-serif; font-size:14px; line-height:28px; color:#fff; text-decoration:none;}

.input{background-color:#ffffff; border:1px solid #ffffff; width:86%; padding:20px; font-size:16px; margin-top:14px; border-radius: 8px;}
.inputpass{background-color:#ffffff; border:1px solid #ffffff; width:86%; padding:20px; font-size:16px; margin-top:14px; border-radius: 8px;}
.inputp{background-color:#ffffff; border:1px solid #ffffff; width:240px; padding:20px; font-size:16px; margin-top:14px; border-radius: 8px;}
.captcha{background-color:#ffffff; border:1px solid #ffffff; width:112px; padding:20px 10px 20px 10px; font-size:16px; margin-top:14px; border-radius: 8px;}

.line{display:block;}

}

/* Ajusta o posicionamento em telas menores que 490px */
@media (max-height: 540px) and (min-width:1000px) {
  #clogin{width:520px; height:490px; position:relative; margin-left:-260px; left:50%; margin-top:20px; text-align: center; font-size: 14px;}
}

@media (max-height: 540px) and (max-width: 999px) {
  #clogin{width:90%; height:490px; position: relative; margin-top:20px; text-align: center; font-size: 14px;}
}

/* Ajusta o posicionamento em telas menores que 490px */
@media (max-height: 720px) and (min-width:1000px) {
  #rlogin{width:520px; height:640px; position:relative; margin-left:-260px; left:50%; margin-top:20px; text-align: center; font-size: 14px;}
}

@media (max-height: 720px) and (max-width: 999px) {
  #rlogin{width:90%; height:640px; position: relative; margin-top:20px; text-align: center; font-size: 14px;}
}
