﻿* {
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
     box-sizing:border-box;
     font-family: 'Poppins';     
}
::-webkit-input-placeholder { 
    color:rgba(84, 84, 84, 1);   
    font-style:normal;
}
::-moz-placeholder {  
    color:rgba(84, 84, 84, 1);   
    font-style:normal; 
} 
:-ms-input-placeholder { 
    color:rgba(84, 84, 84, 1);   
    font-style:normal;
}
input:-moz-placeholder { 
    color:rgba(84, 84, 84, 1);   
    font-style:normal;
}
body {
    max-width:900px;   
    overflow-x: hidden;   
    overflow-y:auto;  
    margin:auto;
    
}
.ContentPage {
    width:100%;
    margin:auto;   
}
/******************HEADER**************************/
.logo {  
    width:20%;  
    height:100px;  
    float:left; 
    padding:10px; 
    text-align:center;
    background-color:rgba(255, 255, 255, 1);      
}
.imgLogo{
    width:160px;
    height:87%;
}
.titulo {
    width: 80%;    
    height:100px;  
    float: left;
    line-height: 5em;
    padding: 10px;
    text-align: center;   
    background-color:rgba(255, 255, 255, 1);  
}
    .titulo span {
        color:rgba(0, 0, 0, 1);
        font-weight: 400;
        font-size: 1.8em;
        letter-spacing: 0.3em;
    }
/******************BUSQUEDA**************************/
.buscador {
    width:100%;
    height:50px;
    float:left;
    background-color:#3c373b;
    border-top:1px solid  rgba(84, 84, 84, 0.6);  
    border-bottom:1px solid rgba(84, 84, 84, 0.6);  
}
.busqueda {
    width:50%;
    margin:auto;
    height:100%;
    float:left;  
    border-right:1px dashed rgba(255, 255, 255, 0.6); 
    padding-left:40px;
    padding-right:40px;          
}
    .busqueda span {
        color:rgba(255, 255, 255, 1);
        font-size:1em;
        font-weight:600;
    }
.linkBuscar{   
    border:1px solid rgba(84, 84, 84, 1);  
    padding-top:2px;
    padding-left:11px;
    padding-right:11px; 
    padding-bottom:2px;   
    text-decoration:none;    
    background-color:rgba(151, 151, 151, 1);
}
    .linkBuscar:hover {
         background-color:rgba(151, 151, 151, 0.9);
    }
    .linkBuscar span {
         font-size:0.9em;
         color:rgba(255, 255, 255, 1);
    }
.iconSearch {
    font-size:0.9em;
    color:rgba(0, 0, 0, 1);
    margin-right:4px;
}
.avanzada {
  
    height:100%;
    float:left; 
    padding-left:20px;
    padding-right:20px;
    color:rgba(255, 255, 255, 1);
}
.textBox {
    width:100%;
    height:30px;
    padding-left:10px;
    border:1px solid rgba(84, 84, 84, 0.7);
}
/********************CONTENIDO***********************************/
.content {
    width:100%;      
    height:679px;    
    float:left;   
     
}
@media only screen and (min-width: 1400px) {
    .content {
        width:100%;     
        height:700px;      
        float:left;   
           
    }
}
.divIzq {
    width:60%;
    float:left;
    height:100%;   
    padding:5px;
}
.divTitulo{
    width:100%;
    height:50px;   
}
.divHome {
    width:14%;
    height:100%;
    float:left;     
    text-align:center;  
    line-height:3.5em;
}
.iconHome {
    margin-right:4px;
    color:rgba(0, 0, 0, 1);
}
.inicio {
    background-color:rgba(151, 151, 151, 1);
    padding:5px;    
    color:rgba(255,255,255,1);
    font-size:1.0em;
    text-decoration:none;
    font-weight:bold;
    border:1px solid rgba(84, 84, 84, 1);
}
.inicio:hover{
    background-color:rgba(151, 151, 151, 0.9);
}
.divTexto {
    width:86%;
    height:100%; 
    float:left;      
    text-align:center;
    line-height:3.5em;
}
    .divTexto span {
        font-size:1em;
        color:#000;
        letter-spacing:0.1em;
        font-weight:600;
    }   
.divPuntosInterv {
    width:90%;
    height:70px;
    border:2px solid rgba(84, 84, 84, 0.5);
    margin:auto;
    overflow-y:auto;
}
.divPuntos {
    width:94%;
    padding-top:4px;    
    margin:auto;
}
    .divPuntos span {
        font-size:0.8em;
        font-weight:600;
        color:#000;
    }
.divInterv {
    width:88%;    
    margin:auto;
    padding-top:2px;
}
    .divInterv span {
        font-size:0.8em;
        font-weight:600;
        color:#000;
    }
.divContentVideo {
    width:85%;
    min-height:200px;   
    margin:auto;
    margin-top:8px;     
}
.txtTiempoReprod {
    text-align:center;    
    font-size:0.8em;
    border:2px solid rgba(84, 84, 84, 0.2);
    display:none;
}
.divPuntosInterv {
    width:90%;
    height:70px;
    border:2px solid rgba(84, 84, 84, 0.3);
    margin:auto;
    margin-top:4px;  
    overflow-y:auto;
}
.tituloDoc {
    width:90%;     
    margin:auto;
    margin-top:8px;
    overflow-y:auto;
}
    .tituloDoc span {
        font-size:1.1em;
        color:#000;
        letter-spacing:0.1em;
        font-weight:bold;
    }
.divDocumentacion {
    width:90%;
    height:140px;
    border:2px solid rgba(84, 84, 84, 0.3);
    margin:auto;
    margin-top:4px;
    overflow-y:auto;
}
.iconView {
    font-size:1.4em;
    color:rgba(0, 0, 0, 1);
}
    .iconView:hover {
        font-size:1.4em;
        color:#aca9ab;
    }
.divDrcha {
    width:40%;
    float:left;
    height:100%;  
    padding:5px; 
}
.tituloCompartir {
    width:95%;     
    margin:auto;   
    overflow-y:auto;
    margin-top:15px;
    margin-bottom:3px;
}
    .tituloCompartir span {
        font-size:1.1em;
        color:#000;
        letter-spacing:0.1em;
        font-weight:bold;
    }
.divCompartir {
    width:96%;
    height:50px;
    margin:auto;       
}
    .divCompartir table {
        width:100%;
        height:100%;
        margin:auto;
        text-align:right;
    }
    .divCompartir table input {
        width:100%;
        height:30px;
        padding-left:2%;
        font-size:0.8em;
    }
.iconFace {
    color:rgba(59, 89, 152,1);   
    font-size:1.8em;
    padding-top:3px;
    cursor:pointer;
}
.iconTwi {
    color:rgba(0, 172, 237,1);
    font-size:1.8em;
    padding-top:3px;
    cursor:pointer;
}
.tituloIntervFirmas {
    width:95%;     
    margin:auto;   
    overflow-y:auto;
    margin-top:3px;
    margin-bottom:2px;
}
    .tituloIntervFirmas span {
        font-size:1.1em;
        color:#000;
        letter-spacing:0.1em;
        font-weight:bold;
    }
.divDropInterv{
    width:100%;
    height:50px;   
}
.divPhoto {
    width:10%;
    float:left;
    height:100%;  
    text-align:center;
    line-height:4.2em;
}
.divDrop {
    width:90%;
    float:left;
    height:100%;
    text-align:center;
    line-height:3.5em;
    padding-left:2px;
    padding-right:2px;
}
.drop {
    width:100%;
    height:30px;
}
.ListadoInterv {
   width:100%;
   height:474px;
   margin:auto;  
   margin-top:4px;
   overflow-y:auto; 
   padding:10px;
   border:2px solid rgba(84, 84, 84, 0.3);
}
.linkPuntoInterv {
    text-decoration:none;
    color:#000;
    font-weight:600;
}
    .linkPuntoInterv:hover {
        text-decoration:none;
        color:rgba(84, 84, 84, 1);
        font-weight:600;
    }
.iconShare {
    color:rgba(0, 0, 0, 1);
    font-size:1.5em;
}
    .iconShare:hover {
        color:#aca9ab;
        font-size:1.5em;
    }
@media only screen and (min-width: 1400px) {
    .ListadoInterv {
        height:507px;
    }
}
.divPestañasFirma {
    width:95%;
    height:35px;
    margin:auto;
    margin-top:2px;   
}
.pestañaFirma {
    width:80px;
    height:100%;
    float:left;   
    margin-right:10px;
    background-color:rgba(192, 192, 192, 1);
    text-align:center;
    line-height:2.2em;
    cursor:pointer;
}
    .pestañaFirma:hover {       
       background-color:rgba(192, 192, 192, 1);   
    }
.pestañaFirma1{
    color:rgba(84, 84, 84, 1);
    text-decoration:none;
    font-weight:600;
    text-decoration:underline;
}
.pestañaFirma2{
    color:#fff;
    text-decoration:none;
    font-weight:600;   
}

.divContentFirma1 {
    width:95%;  
    margin:auto; 
    height:450px;
    border:2px solid rgba(84, 84, 84, 0.3);  
    padding:5px; 
}
.divTituloFirma {
    width:100%;
    color:#000;
    font-size:1em;
    font-weight:600;
}
.tableDatosFirma {
    width:100%;
    height:auto;
}
    .tableDatosFirma span{
        font-size:0.8em;
    }
.TextBoxFirma {
    width:100%;
    height:25px;
}
.textBoxMulti {
    width:100%;
    height:45px;
}
.divContentFirma2 {
    width:95%;  
    margin:auto; 
    height:450px;
    border:2px solid rgba(84, 84, 84, 0.3);
    padding:5px; 
}
.divVolverIndice {
    width:95%;
    height:40px;
    margin:auto;
    text-align:center;   
    padding:2px;
}
.divVolverIndice button{
    height:100%;
    cursor:pointer;
    border:2px solid rgba(84, 84, 84, 1);
    font-weight:600;
}
.divVolverIndice button:hover{   
    background-color:rgba(0, 172, 237,0.4);
}
@media only screen and (min-width: 1400px) {
    .divContentFirma1 {
        width:95%;  
        margin:auto; 
        height:450px;
        border:2px solid rgba(84, 84, 84, 0.3);   
    }
    .divContentFirma2 {
        width:95%;  
        margin:auto; 
        height:450px;
        border:2px solid rgba(84, 84, 84, 0.3);
    }
}

/*******************FOOTER*****************************/
.footer {   
    width:100%;
    height:100px;
    float:left;    
    background-color:#3c373b;
    border-top:1px solid rgba(84, 84, 84, 1);
}
.textoFooter {
    width:100%;
    height:30%;
    text-align:center;
    margin:auto;     
    padding:2px;     
}
    .textoFooter span {
        color:#ffffff;
        font-size:10pt;
    }
    .textoFooter span a {
        color:#ffffff;
        font-size:10pt;
        text-decoration:none;
        cursor:pointer;
    }
.redesSociales {
    width:100%;
    height:40%;
    text-align:center;       
}
.tableRedes {
    width:10%;
    margin:auto;   
    height:100%;
    text-align:center; 
}
.arriba {
    width:100%;
    height:30%;   
    text-align:right;    
    margin:auto; 
    padding-right:10px; 
    display:none;    
}    
.imgArriba {
    font-size:1.6em;
    cursor:pointer;
    color:rgba(255,255,255,1);
}
.imgArriba:hover {    
   color:#ede9ec;
}
    .logoSmartis {
    width:100%;
    height:40px;      
    text-align:center;
     
}
    .logoSmartis img {
        width:150px;
        height:100%; 
    }     
      

/*******************MEDIA*******************************/
@media only screen and (max-width: 900px) {
    .logo {
        padding: 10px;
        width: 100%;
        text-align: center;
    }

    .imgLogo {
        width: 160px;
        height: 100%;
    }

    .titulo {
        width: 100%;        
        float: left;
        height: auto;
        padding: 20px;
        line-height: 1.2em;
    }

        .titulo span {
            font-weight: 400;
            font-size: 2em;
            letter-spacing: 0.3em;
        }
    .buscador {
        width: 100%;
        height: 100%;
    }

    .busqueda {
        width: 100%;
        height: 100%;
        padding: 12px;
        border: none;
    }

    .textBox {
        width: 100%;
    }

    .avanzada {
        width: 100%;
        padding: 10px;
    }
    .ContentPage {
        width:100%;
    }
    .content{
        width:100%;
        height:auto;
    } 
    .divIzq {
        width:100%;
        float:left;
        height:100%;
        border-right:none;       
    }
    .divHome {
        width:100%;
        height:auto;
        float:left;   
        line-height:2.7em;
        text-align:center;
    }
    .inicio {       
        padding:5px;          
        font-size:1.0em;
        text-decoration:none;
        font-weight:bold;
    }    
    .divTexto {
        width:100%;
        height:auto;
        float:left;  
        padding-left:10px;
        padding-right:10px;
        line-height:2.5em;
    }
        .divTexto span {
            font-size:1.4em;
            color:#000;
            letter-spacing:0.1em;
        }  
    .divPuntosInterv {
        width:100%;
        height:80px;
        border:2px solid rgba(84, 84, 84, 0.5);
        margin:auto;
        margin-top:4px;
    } 
    .divContentVideo {
        width:100%;   
    }
    .tituloDoc {
        width:100%;
    }    
    .divDocumentacion {
        width:100%;       
    }
    .divDrcha {
        width:100%;
        float:left;
        height:100%;
        border-right:none;
        padding:5px; 
    }
    .tituloCompartir {
        width:98%;    
        margin-top:2px;   
    }
    .divCompartir {
        width:100%;   
    }
    .divCompartir table {
        width:100%;   
    }
    .tituloIntervFirmas {
        width:98%;    
        margin-top:2px;   
    }
    .divPestañasFirma {
          width:98%;    
    }
    .divContentFirma1 {
        width:98%;  
        margin:auto; 
        height:auto;
        border:2px solid rgba(84, 84, 84, 0.3);   
    }
    .divContentFirma2 {
        width:98%;  
        margin:auto; 
        height:auto;
        border:2px solid rgba(84, 84, 84, 0.3);
    }
    .footer {
        width: 100%;
        height: 100%;
        padding:10px;
    }
    .redesSociales
    {
        width:100%;
        height:100%;
    }
    .tableRedes {
        width:30%;
        margin:auto;   
        height:100%;
        text-align:center; 
    }
    .arriba {
        width:100%;
        display:block;
        height:100%;        
    }  
    /* Srollbar */
    ::-webkit-scrollbar {
        width: 10px;
    }
    ::-webkit-scrollbar-track {
        box-shadow: inset 0 0 5px grey;
        border-radius: 10px;
    }
    ::-webkit-scrollbar-thumb {
        background: #545454; 
        border-radius: 10px;
    }
    ::-webkit-scrollbar-thumb:hover {
        background: rgba(120, 170, 97, 1); 
    }
}
@media only screen and (max-width: 600px) {
    .logo{
        padding:10px; 
        width:100%;  
        text-align:center;
    }
    .imgLogo{
        width:160px;
        height:100%;
    }
    .titulo {
         width: 100%;         
         float:left;       
         height: auto;
         padding:20px;
         line-height: 2.5em;
    }
        .titulo span {
            font-weight: 400;
            font-size: 2em;
            letter-spacing: 0.3em;
        }
    .buscador {
        width:100%;
        height:100%;
    }
    .busqueda {
        width:100%;
        height:100%;
        padding:12px;
        border:none;
    }
    .textBox {
        width:100%;
    }
    .avanzada {
        width:100%;
        padding:10px;
    }
    .ContentPage {
        width:100%;
    }
    .content{
        width:100%;
        height:auto;
    } 
    .divIzq {
        width:100%;
        float:left;
        height:100%;
        border-right:none;       
    }
    .divHome {
        width:100%;
        height:auto;
        float:left;   
        line-height:2.7em;
        text-align:center;
    }
    .inicio {       
        padding:5px;  
        font-size:1.0em;
        text-decoration:none;
        font-weight:bold;
    }   
    .divTexto {
        width:100%;
        height:auto;
        float:left;  
        padding-left:10px;
        padding-right:10px;
        line-height:2.5em;
    }
        .divTexto span {
            font-size:1.3em;            
            letter-spacing:0.1em;
        }    
    .divPuntosInterv {
        width:100%;
        height:80px;
        border:2px solid rgba(84, 84, 84, 0.5);
        margin:auto;
        margin-top:4px;
    } 
    .divContentVideo {
        width:100%;   
    }
    .divDrcha {
        width:100%;
        float:left;
        height:100%;
        border-right:none;       
    }  
    .tituloCompartir {
        width:98%;    
        margin-top:2px;   
    }
    .divCompartir {
        width:100%;   
    }
    .divCompartir table {
        width:100%;   
    }
    .tituloIntervFirmas {
        width:98%;    
        margin-top:2px;   
    }
    .divPestañasFirma {
          width:98%;    
    }
    .footer {
        width: 100%;
        height: 100%;
        padding:10px;
    }
    .redesSociales
    {
        width:100%;
        height:100%;        
    }
    .tableRedes {
        width:30%;
        margin:auto;   
        height:100%;
        text-align:center; 
    }
    .arriba {
        width:100%;
        display:block;
        height:100%;       
    }    
    /* Srollbar */
    ::-webkit-scrollbar {
        width: 10px;
    }
    ::-webkit-scrollbar-track {
        box-shadow: inset 0 0 5px grey;
        border-radius: 10px;
    }
    ::-webkit-scrollbar-thumb {
        background: #545454; 
        border-radius: 10px;
    }
    ::-webkit-scrollbar-thumb:hover {
        background:#3c373b; 
    }
}
.linkDatosFirmaAnt{
    color:#000;
    font-size:0.9em;
    text-align:right;
    font-weight:bold;   
    text-decoration:none;
    margin-left:220px;
}
.linkDatosFirmaAnt:hover {
    color:rgba(151, 151, 151, 1);
}
.pnlFirmante {
    width:95%;  
    margin:auto; 
    height:523px;
    border:2px solid rgba(84, 84, 84, 0.3);
    padding:5px; 
}
    .tituloFirmaAnt{
        font-size:0.8em;
        font-weight:bold;
        color:#000;
        text-decoration:underline;
    }
    .pnlFirmante table {
        width:100%;       
    }
        .pnlFirmante table span {
            font-size:0.8em;
            font-weight:bold;
            color:#000;        
        }
.linkDescargar {
    font-size:0.8em;
    font-weight:bold;
    color:rgba(84, 84, 84, 1);
    text-decoration:none;
        cursor:pointer;
}
.textBoxFirmaAnt {
    width:100%;
    height:25px;
    padding:1%;
    font-size:0.6em;
}
.btnVolverAnt {
    color:rgba(84, 84, 84, 1);
    cursor:pointer;
    font-weight:bold;
    font-size:0.8em;   
    text-decoration:underline;
}
    .btnVolverAnt:hover {
        color:rgba(151, 151, 151, 1);
    }
