body{

  font-family: Arial, Helvetica, sans-serif;

  font-size : 12px;
  color: gray;
  background-image:url('Images/background.png');
  background-repeat : repeat;
  background-color: #eee;
}

header {
   position:relative;
   top:8px;
   left:310px;
   width:1030px;
   height:30px;
   text-align:right;
}

npag {
   position:absolute;
   top:45px;
   left:2px;
   width:200px;
   height:25px;
   font-size : 14px;
   font-weight: bold;
   color: gray;
}

nav {
   position:absolute;
   top:80px;
   left:2px;
   width:200px;
   height:450px;
}

section {
   position:absolute;
   border: 1px dashed;
   top:55px;
   left:220px;
   width:1130px;
   height:530px;
}

article {
   position:absolute;
   border: 1px dashed;
   top:130px;
   left:10px;
   width:850px;
   height:300px;
}


articlede {
   position:absolute;
   border: 1px dashed;
   top:130px;
   left:880px;
   width:230px;
   height:300px;
}

supiz {
   position:absolute;
   border: 1px dashed;
   top:5px;
   left:10px;
   width:370px;
   height:120px;
   font-size : 9px;
   font-weight: bold;

}
supde {
   position:absolute;
   border: 1px dashed;
   top:5px;
   left:725px;
   width:385px;
   height:120px;
}

infiz {
   position:absolute;
   border: 1px dashed;
   top:435px;
   left:10px;
   width:370px;
   height:90px;
}

infce {
   position:absolute;
   border: 1px dashed;
   top:435px;
   left:390px;
   width:325px;
   height:90px;
}
infde {
   position:absolute;
   border: 1px dashed;
   top:435px;
   left:725px;
   width:385px;
   height:90px;
}

pcuentasi {
   position:absolute;
   border: 1px dashed;
   border-radius: 3px;

   top:30px;
   left:10px;
   width:350px;
   height:390px;
}

pcii {
   position:absolute;
   top:0px;
   left:2px;
   width:80px;
   height:350px;
}

pcic {
   position:absolute;
   top:160px;
   left:90px;
   width:20px;
   height:10px;
}

pcid {
   position:absolute;
   top:0px;
   left:115px;
   width:230px;
   height:350px;
}
pcib {
   position:absolute;
   top:355px;
   left:16px;
   width:300px;
   height:30px;
}
pcuentasd {
   position:absolute;
   border-width:1px;
   border-style:groove;
   border-color:#5A5656;
   top:20px;
   left:370px;
   width:700px;
   height:500px;
}

footer {
   position:absolute;
   top:620px;
   left:2px;
   width:1345px;
   height:20px;
   font-size : 12px;
   color: #000000;
}

.label {
  color: rgb(159, 161, 160));
  font-size : 10px;
  padding: 8px;
}
.datossn {
  display: inline-inline-grid;
  width:55px;
  height:10px;
  font-size : 10px;
}
.success {background-color: #4CAF50;} /* Green */
.info {background-color: #2196F3;} /* Blue */
.warning {background-color: #ff9800;} /* Orange */
.danger {background-color: #f44336;} /* Red */
.other {background-color: #e7e7e7; color: black;} /* Gray */

clogin {
   position:absolute;
   background-image:url('Images/login.png');
   top:150px;
   left:445px;
   width:450px;
   height:300px;
   padding-left: 20px;
   text-align:right;
}
form{

    margin: 0 auto;
    width: 400px;
    padding: 21px;

}

input{

    border: solid 0;
    border-radius: 3px;

}
input[type=text], input[type=password]{

    padding: 5px;
    font-size: 14px;
    border-radius: 5px;
    outline: none;

    width: 305px;
}

input[type=submit]{

    background-color: #1E69E3;

    color: white;

    padding: 8px;

    border: none;

    width: 200px;

}

.center{

    text-align: center;

}


.opcion{

    padding: 5px 0;

}


.barra{

    background-color:rgb(152, 196, 236);

    border-radius: 4px;

    padding: 10px;
}


.seleccionado{

    background-color: rgb(33, 90, 143);

    border-radius: 4px;

    color: white;

    padding: 10px;

}


.cerrar-sesion{

    float: right;

}