@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600,700);

body 
{
    margin: 0px;
    padding: 0px;
    background-color: #efefef;
}
main{
    background-color: #fff;
    width: 960px;
    margin: auto;
}

#{}
header{
    margin-top: 0px;
    padding: 0px;
}

#contenedordatos{
    padding-top: 10px;
    padding-left: 20px;
    width: 203px;
    float: left;

}
#contenedordatosb{
    float: right;
    padding-top: 10px;
    padding-right: 10px;
    width: 150px;

}
#contenedordatosb a{
    font-family: "Open Sans",sans-serif;
    font-size: 0.7rem;
    font-weight: 400;
    color: black;
    text-decoration: none;
}
#articleindex h1{
    margin: 0px;
    padding: 0px;
    font-family: "Open Sans", sans-serif;
    font-size: 0.7rem;
    font-weight: 400;
    color: po
}
#a2{
    font-family: "Open Sans",sans-serif;
    font-size: 0.7rem;
    font-weight: 400;
    color: #000;
    text-decoration: none;
    padding-left: 10px;
}
#contenedordatosb a:hover{
    color: #000;
}
#header1
{
    background-color:powderblue;
    height: 40px;
  
}
#header2
{
    background-color:powderblue;
    height: 100px;
}
#logo{
    padding-left: 20px;
    padding-top: 10px;
    float: left;
}
nav{
    width: 385px;
    float: right;
    height: 50px;
    padding-top: 30px;
    padding-right: 20px;
}
nav ul 
{
    list-style: none;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    font-size: 0.8rem;
}
nav ul li
{
    float: right;
}
nav ul li a:hover
{
    color: #000;
}
nav ul li a 
{
    text-decoration: none;
    color:#000;    
    float:right;
    padding-left: 15px;
    text-align: center;
    margin-bottom:50px;
}
/** ImpresiÃ³n 3D **/

#impresion{
    padding: 2%;
}

#impresion h3{
    font-family: "Open Sans", sans-serif;
    color: powderblue;
    font-size: 20px;
    padding: % 0% 2% 5%;
}

#impresion p{
    padding: % 5% 0% 5%;
    column-count: 2;
    font-family: "Open Sans", sans-serif;
    color: #9D9C9C;
    font-size: 10px;
}

#video{
    position: relative;
    margin: 0 auto;
    height: 0;
    padding-bottom: 56.25%;
}

#video iframe{
    position: absolute;
    height: 100%;
    width: 100%;
    top:0px
    left:0px
}

#{}
}
#contenidosecundario h4:hover{
    color: powderblue;
}

footer{
    background-color:powderblue;
    clear: both;
    height: 210px;
}
#contenedorfooter{
    margin: auto;
    width: 721px;
    height: 150px;
    padding-top: 20px;
}
#columna1{
    width: 143px;
    float: left;
    display: block;
    margin-top: 15px;
}
#columna1 h1{
    font-family:"Open Sans", sans-serif;
    font-weight: 600;
    font-size: 0.8rem;
    color: #000;
}
#columna1 p{
    color: #fff;
    font-family:"Open Sans", sans-serif;
    font-weight: 400;
    font-size: 0.65rem;
}
#columna2{
    width: 348px;
    float: left;
    display: block;
    margin-left: 20px;
    margin-top: 19px;
}
#columna3{
    width: 143px;
    float: left;
    display: block;
    margin-left: 20px;
    margin-top: 10px;
}

#columna3 p{
    color: #000;
    font-family:"Open Sans", sans-serif;
    font-weight: 400;
    font-size: 0.8rem;
}

#legales p{
    clear: both;
    margin: auto;
    width: 821px;
    color: #000;
    font-family:"Open Sans", sans-serif;
    font-weight: 400;
    font-size: 0.6rem;
    text-align: center;
}
#formulario1{
    float: left;
    margin-top: 1px;
}
#formulario2{
    float: right;
    margin-right: 20px;
}
p{
    font-family: "Open Sans",sans-serif;
    font-weight: 400;
    font-size: 0.7rem;
}
#linea1{
    float: left;
    margin-left: 20px;
}
#linea2{
    float: left;
}


/*BIENVENIDOS*/
#{}
#imgarticleindex{
    margin-left: 20px;
    margin-top: 20px;
}
#articleindex h1{
    font-family: "Open Sans",sans-serif;
    font-weight: 700;
    font-size: 2rem;
    color: powderblue;
    width: 550px;
    float: left;
    padding-left: 20px;
    padding-top: 20px;
}
#articleindex p{
    font-family: "Open Sans",sans-serif;
    font-weight: 400;
    font-size: 0.8rem;
    color: #000;
    width: 550px;
    float: left;
    padding-left: 20px;
}
#imgasideindex{
    float: right;
    width: 360px;
    height: 130px;
    margin-right: 20px;
    margin-top: 11px;
}


/*personaliza*/
#{}
#personaliza{
    padding: 20px;
    background-color: rgba(26, 180, 190, 0.23);
    height: 420px;
    margin-top: 240px;
    font-family: "Open Sans",sans-serif;
}

#personaliza h2{
    font-family: "Open Sans",sans-serif;
    font-weight: 600;
    font-size: 1rem;
    color: #000;
    padding: 10px;
    width: 85px; 
    font-size: 20px;
    text-align: center;
}
#caja1index{
    float: left;
    width: 295px;
    background-color: #ecf0f1;
    text-align: center
}
#caja1index h3{
    font-family: "Open Sans",sans-serif;
    font-weight: 600;
    font-size: 1.1rem;
}
#caja1index p{
    font-family: "Open Sans",sans-serif;
    font-weight: 400;
    font-size: 0.8rem;
}
#caja2index{
    float: left;
    width: 295px;
    margin-left: 17px;
    background-color: #ecf0f1;
    text-align: center
}
#caja2index:hover{
    background-color: #f8f8c8;
}
#caja2index h3{
    font-family: "Open Sans",sans-serif;
    font-weight: 600;
    font-size: 1.1rem;
}
#caja2index p{
    font-family: "Open Sans",sans-serif;
    font-weight: 400;
    font-size: 0.8rem;
}
#caja3index{
    float: right;
    width: 295px;
    background-color: #ecf0f1;
    text-align: center
}
#caja3index:hover{
    background-color: #f8f8c8;
}
#caja3index h3{
    font-family: "Open Sans",sans-serif;
    font-weight: 600;
    font-size: 1.1rem;
}
#caja3index p{
    font-family: "Open Sans",sans-serif;
    font-weight: 400;
    font-size: 0.8rem;
}
.contenidopersonaliza{
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
}

/*compra*/
#{}

#sucursales p{
    padding: 1% 0% 0% 5%;
}

#compra{
    font-family:"Open Sans",sans-serif;
    background-color: powderblue;
    color: #000;
    font-size: 14px;
    padding: 2%;
}
#compra h2
{
    font-family: "Open Sans",sans-serif;
    color: #000;
    padding: 0px;
    width: 85px; 
    font-size: px;
    text-align: center;
}
#compraindex{
    background-color: powderblue;
    width: 940px;
    height: 500px;
    
}
#compraindex:hover{
    background-color: #f8f8c8;
}
#compraindex h3{
    font-family: "Open Sans",sans-serif;
    font-weight: 500;
    font-size: 1.2rem;
}
#compraindex p{
    font-family: "Open Sans",sans-serif;
    font-weight: 700;
    font-size: 0.69rem;
}
#textocompra{
    float: right;
    margin-right: 600px;
}


/*--------------------------------------------------------------------------------------------------------------------------*/
/*RESPONSIVE TABLET */

@media screen and (min-width:480px) and (max-width:780px){
body{
    max-width: 780px;
}
main{
    width: 95%;
}
    #header1{
    height: 55px;
        }
nav{
    width: 373px;
    padding-top: 20px;
}
img#logo{
    width: 300px;
}
img#imgarticleindex{
    width: 94%;
    height: auto;
}
#articleindex p{
    width: 367px;
}
#imgasideindex {
    float: right;
    width: 284px;
    height: 103px;
    margin-right: 20px;
    margin-top: 39px;
}
#caja1index{
    float: left;
    width: 210px;
    height: 356px;
}
#caja2index{
    float: left;
    margin-left: 27px;
    width: 210px;
}
#caja3index{
    float: right;
    width: 210px;
    height: 358px;
}
.imagcajaindex{
    width: 210px;
    height: 140px;
}
#personaliza{
    margin-top: 280px;
    padding-top: 2px;
}
#compra{
    width: 59%;
}
#compraindex{
    width: 426px;
    height: 435px;
}
.compraindeximg{
    width: 100%;
}
#imagencompra {
    float: left;
}
#textocompra {
    float: left;
    width: 200px;
    margin: 0px;
    margin-left: 20px;
}
#legales p{
    width: 724px;




/*RESPONSIVE CELULAR */

@media screen and (min-width:320px) and (max-width:568px){
    
/*index*/
    
body{
    max-width: 568px;
    margin: auto;
}
main{
    width: 100%;
    margin: auto;
}
img#logo{
    width: 82%;
}
#header1{
    height: 55px;
}
#header2{
    height: 126px;
}
nav{
    padding-top: 5px;
    margin-right: 46px;
}
nav ul li a{
    padding-left: 10px;
}
#contenedordatos{
    width: 140px;
}
#contenedordatosb{
    width: 88px;
    padding-right: 0px;
}
img#imgarticleindex{
    width: 92%;
    height: auto;
    margin-top: 5px;
    margin-left: 13px;
}
#articleindex h1 {
    width: 287px;
    float: left;
    padding-left: 28px;
    padding-top: 0px;
}
#articleindex p{
    width: 343px;
}

#imgasideindex{
    width: 88%;
    height: auto;
    margin-right: 26px;
}
#personaliza{
    float: left;
    margin-top: 15px;
    padding-top: 7px;
    height: 1050px;
    width: 95%;
    padding-left: 0px;
}
#personaliza h2{
    margin-left: 50px;
    margin-top: 10px;
}
#caja1index {
    float: left;
    width: 295px;
    margin-left: 50px;
    height: 322px;
}
#caja2index {
    margin-top: 10px;
    float: left;
    width: 295px;
    margin-left: 50px;
    height: 322px;
}
#caja3index {
    margin-top: 10px;
    float: left;
    width: 295px;
    margin-left: 50px;
    height: 322px;
}
#compra{
    margin-left: 40px;
}
#compra h2{
    margin-top: 0px;
}
#compraindex {
    width: 282px;
    height: 320px;
}
.compraindeximg{
    width: 100%;
}
#textocompra{
    float: left;
    margin-right: 0px;
    margin-left: 20px;
}
#proximoseventos {
    float: left;
    margin-left: 58px;
    padding-right: 0px; 
    padding-top: 0px; 
    padding-bottom: 20px;
    width: 285px;
}
#contenedorfooter {
    margin: auto;
    width: 277px;
    height: 444px;
    padding-top: 20px;
}
footer{
    height: 556px;
}
#legales p{
    width: 300px;
}
    

  



    