body {
     margin: 6px;
}
 h1{
     font-size:1.6em;
     font-family: Verdana, Geneva, sans-serif;
     border-bottom:2px solid #777777;
     background-color: #45b39d ;
     padding:20px;
}
 textarea{
     border:1px solid #333333;
     box-shadow: 2px 2px 5px #cccccc;
     border-radius:6px;
     padding:4px;
}
 .btbar {
     position:absolute;
     top:30px;
     right:14px;
}
 .textpl {
     width: 98%;
     height: 200px;
     margin-left: .2%;
}
 .conf {
     height: 0;
     opacity: 0;
     padding: 10px 10px 10px 30px;
     display: none;
     background-color: #d0ece7 ;
     transition: opacity 2s linear 1s;
     margin-top:-20px;
}
 .templ {
     display: flex;
     margin-top: 1rem;
     flex-direction: row;
     flex-wrap: no-wrap;
}
 .boton {
     text-align: center;
     display: inline-block;
     cursor: pointer;
     padding: 0.8em 0.7em;
     font-size: 1.2em;
     color: #ffffff;
     background-color: #615050;
     border-radius: 3px;
     user-select: none;
     border: 1px solid #333333;
     border-radius: 6px;
}
 .openfile {
     width: 0.1px;
     height: 0.1px;
     opacity: 0;
     overflow: hidden;
     position: absolute;
     z-index: -1;
}
 .base {
     margin-top: 50px;
     text-align: center;
     margin-bottom: 30px;
}
 label.boton {
     right: 10px;
}
 .label {
     vertical-align: top;
     font-size: 2em;
}
 .selector input[type="file"] {
     opacity: 0;
     height: 0;
     display: none;
}
 .textcode {
     display: block;
     margin-left: auto;
     margin-right: auto;
     width: 80%;
     height: 360px;
}
 .modal {
     display: none;
     position: fixed;
     z-index: 3000;
     padding-top: 0px;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     overflow: auto;
     background-color: rgba(0, 0, 0, 0.5);
     padding-top: 50px;
     transition: display 3s;
}
 .contenAxuda {
     position: relative;
     background-color: white;
     margin: auto;
     padding: 20px;
     width: 60%;
}
 .pecharAxuda {
     color: black;
     float: right;
     font-size: 30px;
     font-weight: bold;
}
 .pecharAxuda:hover, .pecharAxuda:focus {
     color: #000;
     text-decoration: none;
     cursor: pointer;
}
 .visibleAxuda {
     display: block;
}
 .visibleConf {
     opacity: 1;
     height: 150px;
     display: block;
}
 .gardaCode {
     display: block;
     margin-left: auto;
     margin-right: auto;
}
 .pebar {
     position:absolute;
     bottom:8px;
     right:0px;
     left:0px;
     margin-top: 60px;
     border-top: 2px solid #777777;
     padding: 4px;
     height: 30px;
}
 .urleduc{
     width:90%;
     font-size:1.2em;
     padding: 12px 20px;
     margin: 8px;
     display: block;
     border: 1px solid #333333;
     border-radius: 4px;
     box-sizing: border-box;
}
 .cllabel{
     font-size:1.2em;
     margin: 8px;
     text-align:left;
}
 .clbox{
     text-align:center;
     border:0px solid #777777;
     padding:20px;
}
 .clplantilla{
     font-size:1.2em;
     padding:6px;
}
 .esperar {
     display: none;
     position: fixed;
     z-index: 3001;
     padding-top: 0px;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     overflow: auto;
     background-color: rgba(0, 0, 0, 0.3);
     background-image: url(esperar.gif);
     background-position: center center;
     background-repeat: no-repeat;
}
 .visibleEsperar {
     display: block;
}