﻿

/* RESPONSIVE */


/********  XL  *******/
@media screen and (min-width:1600px) {



    .cajaArbol {
        position: absolute;
        background-color: #eff8e0;
        width: 300px;
        height: 150px;
        margin: 10px;
        padding-top: 10px;
    }

    #cajaPadre {
        top: 20px;
        left: 450px;
    }

    #cajaMadre {
        top: 210px;
        left: 450px;
    }

    #cajaTitular {
        top: 105px;
        left: 45px;
        height: 230px;
    }

    #cajaEntrar {
        position: relative;
        margin-top: -70px;
        margin-left: 800px;
    }

    .cajaLtIndex {
        font-size:250%; 
        margin-top:20px;

    }


    .cajaEntradas {
        margin-left:20px;
        width:65%;
        margin:0 auto;
        margin-top:40px;
    }

    .controlFor {
        width:42%;
        font-size:150%;
        padding-left:4%;
        margin-left:10px;
    }

    #imgLupa {
        margin-top: -10px;
        cursor: pointer;
        width: 8%;
    }

    #cajaBuscador {
        height: 110px;
    }

    #cajaEntradasArbol {
        width:80%;
        height:400px;
        margin:0 auto;
        margin-top:10px;

    }

    #soyTitularIni {
        width: 270px;
        height:30px;
        margin: 10px;
        margin-top:0;
        padding-top: 5px;
        padding-left:30px;
    }

    #ltTu {
        font-size: 200%;
        margin-bottom: -10px;
        margin-top: -5px;
    }

     .ltArbol {
         font-size:150%;
    }


    .controlArbol {
      
        width: 250px;
        font-size: 120%;
        padding-left: 4%;
        margin-left: 20px;
        margin:0 auto;
        margin-top:10px;
    }


    #cajaEmpezarArbol {
    
        height:460px;
        margin-top:-400px;
    }

    #btnContinuar {
        
        width:150px;
        height:40px;
        font-size:120%; 
        padding-top:3px;
        cursor:pointer;
    }


    #rama1 {
        top: 195px;
        left: 355px;
    }

    #rama2 {
        top: 100px;
        left: 400px;
    }

    #rama3 {
        top: 100px;
        left: 410px;
    }

    #rama4 {
        top: 290px;
        left: 410px;
    }


}


/********  L  *******/
@media screen and (min-width:950px)and (max-width:1600px) {



    .cajaArbol {
        position: absolute;
        background-color: #eff8e0;
        width: 300px;
        height: 150px;
        margin: 10px;
        padding-top: 10px;
    }

    #cajaPadre {
        top: 20px;
        left: 450px;
    }

    #cajaMadre {
        top: 210px;
        left: 450px;
    }

    #cajaTitular {
        top: 105px;
        left: 45px;
        height: 230px;
    }

    #cajaEntrar {
        position: relative;
        margin-top: -70px;
        margin-left: 800px;
    }
    .cajaLtIndex {
        font-size: 250%;
        margin-top: 20px;
    }

    .cajaEntradas {
        margin-left: 20px;
        width: 65%;
        margin: 0 auto;
        margin-top: 40px;
    }

    .controlFor {
        width: 42%;
        font-size: 150%;
        padding-left: 4%;
        margin-left: 10px;
    }

    #imgLupa {
        margin-top: -10px;
        cursor: pointer;
        width: 8%;
    }

    #cajaBuscador {
        height: 110px;
    }

    #cajaEntradasArbol {
        width: 80%;
        height: 400px;
        margin: 0 auto;
        margin-top: 10px;
    }
    #soyTitularIni {
        width: 270px;
        height: 30px;
        margin: 10px;
        margin-top: 0;
        padding-top: 5px;
        padding-left: 30px;
    }

    #ltTu {
        font-size: 200%;
        margin-bottom: -10px;
        margin-top: -5px;
    }

    .ltArbol {
        font-size: 150%;
    }

    .controlArbol {
        width: 250px;
        font-size: 120%;
        padding-left: 4%;
        margin-left: 20px;
        margin: 0 auto;
        margin-top: 10px;
    }
    #cajaEmpezarArbol {
        height: 460px;
        margin-top: -400px;
    }
    #btnContinuar {
        width: 150px;
        height: 40px;
        font-size: 120%;
        padding-top: 3px;
        cursor: pointer;
    }


    #rama1 {
        top: 195px;
        left: 355px;
    }

    #rama2 {
        top: 100px;
        left: 400px;
    }

    #rama3 {
        top: 100px;
        left: 410px;
    }

    #rama4 {
        top: 290px;
        left: 410px;
    }


}

/********  M  *******/
@media screen and (min-width:650px)and (max-width:950px) {



    .cajaArbol {
        position: absolute;
        background-color: #eff8e0;
        width: 300px;
        height: 150px;
        margin: 10px;
        margin-left:0;
        padding-top: 10px;
    }

    #cajaPadre {
        top: 20px;
        left: 340px;
    }

    #cajaMadre {
        top: 210px;
        left: 340px;
    }
    #cajaTitular {
        top: 105px;
        left: 0px;
        height: 230px;
    }


  
    .cajaLtIndex {
        font-size: 250%;
        margin-top: 20px;
    }

    .cajaEntradas {
        margin-left: 20px;
        width: 640px;
        margin: 0 auto;
        margin-top: 40px;
    }

    .controlFor {
        width: 42%;
        font-size: 150%;
        padding-left: 4%;
        margin-left: 10px;
    }

    #imgLupa {
        margin-top: -10px;
        cursor: pointer;
        width: 8%;
    }

    #cajaBuscador {
        height: 110px;
    }
    #cajaEntradasArbol {
        width: 640px;
        height: 400px;
        margin: 0 auto;
        margin-top: 10px;
        /*border:1px solid red;*/
    }
    #soyTitularIni {
        width: 270px;
        height: 30px;
        margin: 10px;
        margin-top: 0;
        padding-top: 5px;
        padding-left: 30px;
    }

    #ltTu {
        font-size: 200%;
        margin-bottom: -10px;
        margin-top: -5px;
    }

    .ltArbol {
        font-size: 150%;
    }


    .controlArbol {
        width: 250px;
        font-size: 120%;
        padding-left: 4%;
        margin-left: 20px;
        margin: 0 auto;
        margin-top: 10px;
    }
    #cajaEmpezarArbol {
        height: 460px;
        margin-top: -400px;
    }

    #cajaEntrar {
        position: relative;
        margin-top: -70px;
        width:100%;
        /*margin-left: 800px;*/
    }


    #btnContinuar {
        width: 150px;
        height: 40px;
        font-size: 120%;
        padding-top: 3px;
        cursor: pointer;
        float:right;
        margin-right:10%;
    }


    #rama1 {
        top: 195px;
        left: 275px;
    }

    #rama2 {
        top: 100px;
        left: 315px;
    }

    #rama3 {
        top: 100px;
        left: 315px;
    }

    #rama4 {
        top: 290px;
        left: 315px;
    }


}


/********  S  *******/
@media screen and (min-width:500px)and (max-width:650px) {



    .cajaArbol {
        position: absolute;
        background-color: #eff8e0;
        width: 300px;
        height: 150px;
        margin: 10px;
        padding-top: 10px;
    }

    #cajaPadre {
        top: 20px;
        left: 450px;
    }

    #cajaMadre {
        top: 210px;
        left: 450px;
    }

    #cajaTitular {
        top: 105px;
        left: 45px;
        height: 230px;
    }


    #cajaEntrar {
        position: relative;
        margin-top: -70px;
        margin-left: 800px;
    }
    .cajaLtIndex {
        font-size: 250%;
        margin-top: 20px;
    }

    .cajaEntradas {
        margin-left: 20px;
        width: 65%;
        margin: 0 auto;
        margin-top: 40px;
    }

    .controlFor {
        width: 42%;
        font-size: 150%;
        padding-left: 4%;
        margin-left: 10px;
    }

    #imgLupa {
        margin-top: -10px;
        cursor: pointer;
        width: 8%;
    }

    #cajaBuscador {
        height: 110px;
    }

    #cajaEntradasArbol {
        width: 80%;
        height: 400px;
        margin: 0 auto;
        margin-top: 10px;
    }
    #soyTitularIni {
        width: 270px;
        height: 30px;
        margin: 10px;
        margin-top: 0;
        padding-top: 5px;
        padding-left: 30px;
    }

    #ltTu {
        font-size: 200%;
        margin-bottom: -10px;
        margin-top: -5px;
    }

    .ltArbol {
        font-size: 150%;
    }


    .controlArbol {
        width: 250px;
        font-size: 120%;
        padding-left: 4%;
        margin-left: 20px;
        margin: 0 auto;
        margin-top: 10px;
    }
    #cajaEmpezarArbol {
        height: 460px;
        margin-top: -400px;
    }
    #btnContinuar {
        width: 150px;
        height: 40px;
        font-size: 120%;
        padding-top: 3px;
        cursor: pointer;
    }


    #rama1 {
        top: 195px;
        left: 355px;
    }

    #rama2 {
        top: 100px;
        left: 400px;
    }

    #rama3 {
        top: 100px;
        left: 410px;
    }

    #rama4 {
        top: 290px;
        left: 410px;
    }


}



/********  XS  *******/
@media screen and (max-width:500px) {

    .ramaArbol {
        display: none;
    }



    .cajaArbol {
        /* background-color: #eff8e0;
        position: absolute; 
        width: 300px;
        height: 150px;
        margin: 10px;
        padding-top: 10px;
*/
        background-color: #eff8e0;
        position:relative;
        margin:0 auto;
        margin-bottom:20px;
        padding:20px;
        width:390px;
    }

    #cajaPadre {
        
    }

    #cajaMadre {
        
    }


   
    .cajaLtIndex {
        font-size: 30px;
        margin-top: 30px;
    }


    .cajaEntradas {
        margin-left: 20px;
        margin: 0 auto;
        margin-top: 20px;
    }

    .controlFor {
        width: 350px;
        font-size: 20px;
        padding-left: 4%;
        margin-left: 40px;
        margin-bottom:20px;
        height:40px;
    }

    .controlArbol {
        width: 350px;
        font-size: 20px;
        padding-left: 4%;
        margin-left: 20px;
        margin: 0 auto;
        margin-top: 10px;
    }

    #Titular_Sexo{

        height:40px;
        font-size:20px;
    }

    input, select {
        max-width: 500px;
    }

    #imgLupa {
        margin-top: -10px;
        cursor: auto;
        width: 50px;
    }

    #cajaBuscador {
        height: 160px;
        margin-top:-140px;
    }

    #cajaEntradasArbol {
        /*    width: 80%;
        height: 400px;
        margin: 0 auto;
        margin-top: 10px;*/
        margin-left: 20px;
        margin: 0 auto;
        margin-top: 20px;
    }

    #cajaTitular {
        /*top: 105px;
        left: 45px;
        height: 230px;*/
    }
    #soyTitularIni {
        width: 270px;
        height: 30px;
        margin: 10px;
        margin-top: 0;
        padding-top: 5px;
        padding-left: 30px;

        font-size:18px;
    }

    input[type="checkbox"] {
        width:25px;
        height:25px;
    }

    #ltTu {
        font-size: 34px;
        /*margin-bottom: -10px;
        margin-top: -5px;*/
    }

    .ltArbol {
        font-size: 24px;
    }


    #cuerpo{

        height:1170px;
    }

    #cajaEmpezarArbol {
        height: 750px;
        margin-top: -680px;
    }
    #btnContinuar {
        width: 180px;
        height: 50px;
        font-size: 20px;
        padding-top: 5px;
        cursor: auto;
       
    }

    #cajaEntrar {
        position: relative;
        
        width:180px;
        margin:0 auto;
        margin-top:-70px;
        /*margin-top: -70px;
        margin-left: 800px;*/
    }

}

/* FIN MEDIA QUERIES*/
/*******************************************************************/









body {
}

#paginaIndex{
    position:relative;
    margin:0 auto;
    /*width:1000px;*/
    width:90%;

}
.cajaLtIndex{
  
   /* font-size:250%; 
    margin-top:20px;*/

    font-weight:bold;
    position:relative;
    color:white;
    z-index:1;
    opacity:1.0;
}


.cajaIndex{
    position:relative;
background-color:white;
opacity:0.5;
margin-top:-80px;
z-index:0;

}

.cajaEntradas{
    position:relative;
    z-index:2;
    opacity:1;
    
   /* margin-left:20px;
    width:65%;
    margin:0 auto;
    margin-top:40px;*/
   
}

.controlFor{
    background-color:white;
    position:relative;
    opacity:1.0;
    z-index:3;
   border:3px solid #82a542;


  /*  width:42%;
    font-size:150%;
    padding-left:4%;
    margin-left:10px;*/
  
    
}

.controlArbol {
    background-color: white;
    position: relative;
    display:block;
    opacity: 1.0;
    z-index: 3;
    color:#808080;
    border: 3px solid #82a542;

   /* width: 250px;
    font-size: 120%;
    padding-left: 4%;
    margin-left: 20px;
    margin:0 auto;
    margin-top:10px;*/
    
}



#cajaEmpezarArbol{

position:relative;
z-index:1;

/*height:460px;
margin-top:-400px;*/


}

#cajaEntradasArbol{
    
   /* width:80%;
    height:400px;
    margin:0 auto;
    margin-top:10px;
*/

    position:relative;
    z-index:2;
  

}




/*

.cajaArbol {
    position: absolute;
    background-color: #eff8e0;
    width: 300px;
    height: 150px;
    margin: 10px;
    padding-top:10px;
}

#cajaPadre {
    top: 20px;
    left: 450px;
}

#cajaMadre {
    top: 210px;
    left: 450px;
}

#cajaTitular {
    top: 105px;
    left: 45px;
    height: 170px;
}


*/



.ramaArbol {
    position: absolute;
    background-color: #eff8e0;
}
.ramaH{
    width:50px;
    height:10px;

}

.ramaV{
    width:10px;
    height:200px;

}

.ltArbol{
   /* font-size:150%;*/

    color:#82a542;
    font-weight:bold;
    text-align:center;

}


#btnContinuar{
    position:relative;
    z-index:1;
    background-color:#82a542;
    color:white;
    text-align:center;
    font-weight:bold;

  /*  width:150px;
    height:40px;
    font-size:120%; 
    padding-top:3px;
    cursor:pointer;*/
}


.controlCheckboxFor {
    display: inline-block;
    margin-left: 20px;
    width: 20px;
    height: 20px;
    
}

.labelCheckboxFor {
    display: inline-block;
    height: 20px;
    /*width: 300px;*/
    font-size: 95%;
    position: relative;
    top: -5px;
    color: #5e5e5e;
    /*color: white;*/
   
}

#soyTitularIni {
    position: relative;
  
   /* width: 270px;
    height:30px;
    margin: 10px;
    margin-top:0;
    padding-top: 5px;
    padding-left:30px;*/
}
 