*{
    margin: 0;
    padding: 0;
}


[type=number1] {
  width:20%;
  display: inline-block;
  text-align: center;
  border: 0;
  border-bottom: 1px solid rgba(0,0,0,.2);
  height: 28px;
  line-height: 28px;  
  margin-bottom: 10px;
  font-size: 1em;
  color: darkslategray;
  background-color: #daeadc;
    border-radius:5px;
}




[type=submit]:hover {
     margin-left: 40%;
  margin-right: -40%;
  width: 20%;
  border: solid 2px #018af7e0;
  background-color: white;
  border-radius: 5px;
  height: 50px;
  color: #2fc1f9;
  font-weight: 400;
  font-size: 1em;
}


[type=submit] {
     margin-left: 40%;
  margin-right: -40%;
  width: 20%;
  border: 0;
  background-color: #2fc1f9;
  border-radius: 5px;
  height: 50px;
  color: white;
  font-weight: 400;
  font-size: 1em;
}







.nuevo{
     margin-left: 32%;
  margin-right: -50%;
    
    color:#018af7e0;
}

.nuevo2{
    text-align: center;
    color:#018af7e0;
}

[type=number2] {
width:36%;
margin-left: 32%;
margin-right: 32%;
display: inline-block;
border:0;
border-bottom: 1px solid #018af7e0;
height: 35px;
line-height: 28px;  
margin-bottom: 10px;
font-size: 18px;
color: black;
background-color: #daeadc;
border-radius:5px;
}

.nuevo3{
margin-left: 40%;
margin-right: -50%;
color:#018af7e0;
}





[type=number4] {
    border-radius:10px;
    text-align: center;
    width:16%;
    margin-left: 40%;
    margin-right: 44%;
 display: inline-block;
  border: 0;
  border-bottom: 1px solid rgba(0,0,0,.2);
  height: 38px;
  line-height: 38px;  
  margin-bottom: 10px;
  font-size: 1em;
  color: darkslategray;
  background-color: #daeadc;
}

@media (max-width:788px){
    
    
[type=number1] {
  width:60%;
  display: inline-block;
  text-align: center;
  border: 0;
  border-bottom: 1px solid rgba(0,0,0,.2);
  height: 30px;
  line-height: 30px;  
  margin-bottom: 10px;
  font-size: 1em;
  color: darkslategray;
  background-color: #daeadc;
}

.nuevo{
     margin-left: 10%;
  margin-right: -10%;
    
    color:#018af7e0;
}
    
    [type=number2] {
    width:80%;
    margin-left: 10%;
    margin-right: -10%;
 display: inline-block;
  border: 0;
  border-bottom: 1px solid rgba(0,0,0,.2);
  height: 30px;
  line-height: 30px;  
  margin-bottom: 10px;
  font-size: 1em;
  color: darkslategray;
  background-color: #daeadc;
        border-radius:5px;
}

[type=number3] {
    border-radius:10px;
    text-align: center;
    width:80%;
    margin-left: 10%;
    margin-right: -10%;
 display: inline-block;
  border:0;
  border-bottom: 1px solid rgba(0,0,0,.2);
  height: 35px;
  line-height: 35px;  
  margin-bottom: 10px;
  margin-bottom: 10px;
  font-size: 12px;
  color: darkslategray;
  background-color: #daeadc;
}


[type="number4"] {
    border-radius:10px;
    text-align: center;
    width:80%;
    margin-left: 10%;
    margin-right: -10%;
 display: inline-block;
  border:0;
  border-bottom: 1px solid rgba(0,0,0,.2);
  height: 38px;
  line-height: 38px;  
  margin-bottom: 10px;
  font-size: 1em;
  color: darkslategray;
  background-color: #daeadc;
}
    
    .nuevo3{
margin-left: 10%;
margin-right: -90%;
color:#018af7e0;
}
}
.datagrid table {
                border-collapse: collapse;
                text-align: left;
                width: 100%;

            }
            
            .datagrid {
                font: normal 12px/150% Arial, Helvetica, sans-serif;
                background: #fff;
                overflow: hidden;
                border: 1px solid #dff0d8;
                -webkit-border-radius: 3px;
                -moz-border-radius: 3px;
                border-radius: 3px;
            }
            
            .datagrid table td,
            .datagrid table th {
                padding: 3px 10px;
            }
            
            .datagrid table thead th {
                background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dff0d8), color-stop(1, #dff0d8));
                background: -moz-linear-gradient( center top, #006699 5%, #00557F 100%);
                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#dff0d8, endColorstr=#dff0d8);
                background-color: #dff0d8;
                color: #FFFFFF;
                font-size: 15px;
                font-weight: bold;
                border-left: 1px solid #dff0d8;
            }
            
            .datagrid table thead th:first-child {
                border: none;
            }
            
            .datagrid table tbody td {
                color: #00557F;
                border-left: 1px solid #E1EEF4;
                font-size: 12px;
                font-weight: normal;
            }
            
            .datagrid table tbody td:first-child {
                border-left: none;
            }
            
            .datagrid table tbody tr:last-child td {
                border-bottom: none;
            }
            
            .datagrid table tfoot td div {
                border-top: 1px solid #dff0d8;
                background: #E1EEf4;
            }
            
            .datagrid table tfoot td {
                padding: 0;
                font-size: 12px
            }
            
            .datagrid table tfoot td div {
                padding: 2px;
            }
            
            .datagrid table tfoot td ul {
                margin: 0;
                padding: 0;
                list-style: none;
                text-align: right;
            }
            
            .datagrid table tfoot li {
                display: inline;
            }
            
            .datagrid table tfoot li a {
                text-decoration: none;
                display: inline-block;
                padding: 2px 8px;
                margin: 1px;
                color: #FFFFFF;
                border: 1px solid #dff0d8;
                -webkit-border-radius: 3px;
                -moz-border-radius: 3px;
                border-radius: 3px;
                background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dff0d8), color-stop(1, #dff0d8));
                background: -moz-linear-gradient( center top, #006699 5%, #00557F 100%);
                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#dff0d8, endColorstr=#dff0d8);
                background-color: #dff0d8;
            }
            
            .datagrid table tfoot ul.active,
            .datagrid table tfoot ul a:hover {
                text-decoration: none;
                border-color: #dff0d8;
                color: #FFFFFF;
                background: none;
                background-color: #dff0d8;
            }
            
            div.dhtmlx_window_active,
            div.dhx_modal_cover_dv {
                position: fixed !important;
            }
            
            .datagrid {
                margin-top: 30px;
                margin-left: 10px;
                margin-right: 10px;
            }

body{
    
    background-color:#dff0d8;
    
}

header{
    text-align: center;
        }

.nombre{
   background-color: #018af7e0;
}

img{
   margin-top: 0%;
    background-color: 
   }

.division {
    background-color:#018af7e0;
    height:80px;
    }


.titulo{
   
   position: absolute;
   text-align: center;  
   background-color: #dff0d8;
   width: 100%;
    height: 60px;
   margin-top: 3%;
    
}

.circulo{
    background-color:#018af7e0;
}
.titulo2{
   
   position: absolute;
   text-align: center;  
   background-color: #018af7e0;
   width: 100%;
    height: 60px;
   
    
}

.contenedor{
   text-align: center;
   margin-top: 15%; 
}

body {
  background-color: #1abc9c;
  font: 1em Helvetica;
}

#container {
  width: 499px;
  margin: 25px auto;
}

.whysign {
  float: left;
  background-color: white;
  width: 480px;
  height: 347px;
  border-radius: 0 5px 5px 0;
  padding-top: 20px;
  padding-right: 20px;
}

.signup {
  float: left;
  width: 500px;
  padding: 30px 0px;
  background-color: #dff0d8;
  text-align: center;
  border-radius: 5px 0 0 5px;
  margin-top : 140px;
}



h1 {
  color: rgba(0,0,0,.7);
  font-weight: 900;
  font-size: 2.5em;
}

p {
  color: rgba(0,0,0,.6);
  font-size: 1.2em;
  margin: 50px 0 50px 0;
}

span {
  font-size: .75em;
  background-color: white;
  padding: 2px 5px;
  color: rgba(0,0,0,.6);
  border-radius: 2px;
  box-shadow: 1px 1px 1px rgba(0,0,0,.3);
  margin: 5px;
}

span:hover {
  color: #53CACE;
}

p:nth-of-type(2) {
  font-size: 1em;
}