html {
  overflow-x: hidden;
}


th { text-align: left;}
br {
  display: block;
  content: "";
  margin: 12px;}

body{
padding: 0;
width: 100%;
display: block;
background-color: black;
margin: 0;
}
h1 {
font-family:"Roboto";
font-weight:300;
font-size: 55px;
text-align: center;
color: #fff;
margin: 0;
padding: 0;
}
h2 {
font-family:"Roboto";
font-weight: 300;
font-size: 38px;
text-align: center;
background:#f69823b3;
color: #000;
}
.border-text {
  font-family: 'Roboto', sans-serif;

    font-weight: 300;
    font-size: 30px;
    text-align: left;
    padding: 10px;
    margin: 20px 0 0 0px;
    color: #f69323;
}

h3 {
display: block;
font-family: 'Roboto', sans-serif;
font-weight: 300;
font-size: 20px;
margin: 5px 0;
padding: 0;
z-index: 1;
position: relative;
color: #ffffff;
padding: 10px;

}
.center { margin: 0 auto; }
.content{ width: 70%; padding: 20px 0 0 0;     }
.content1{ width: 100%; padding: 20px 0 0 0;     }
.content2{ width: 90%; padding: 20px 0 0 0;     }
.clear { clear: both; }

#nav a.active { color: #f69323 !important; opacity:1 !important;}
#header {
width: 100%;
background: url('../img/header-bg.png');
position: fixed;

height: 122px;
z-index: 1000;
text-align: left;
padding-top: 10px;
padding-left: 15px;
}
#nav { float: right; margin-top: -80px; padding-right: 30px; text-align: right; color:white;}
#nav a { color: #fff; margin-top: 5px;}
#logo1 {text-align: center;}
#logo a { color: #fff; text-decoration: none; font-size: 14px; margin-top: 0px; color: #fff; font-family:"Roboto"; font-weight: 300; }
#nav ul{
list-style: none;
display: block;
margin: 0 auto;
}
#nav li{
margin-top: 5px;
float: left;
padding-left: 35px;
}
#nav li a { display: block; font-weight: 300;   font-size: 14px; text-decoration:none; font-family: 'Roboto'; }
#nav li a:hover { color: #fff; opacity:1; }



#b1 {clear: inherit;
  float: left;
  margin-left: 1%;
    width: 21%;
    background: url('../img/fondobot.jpg') 0 0;
    opacity:0.5;
    text-align:center;
    vertical-align: middle;
    height: 280px;
}
.zoom {
    transition: transform .2s; /* Animation */
    padding: 5px;
    margin: 0 auto;
    -moz-transform:scale(1);
    -webkit-transform:scale(1);
    transform:scale(1);
}
.zoom:hover {
    transform: scale(1.2); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}

#b2 {clear: inherit;
  float: left;
  margin-left: 1%;
    width: 21%;
    background: url('../img/fondobot.jpg') -300px 0;
    opacity:0.5;
        text-align:center;
        vertical-align: middle;
            height: 280px;
}

#b3 {clear: inherit;
  float: left;
  margin-left: 1%;
    width: 21%;
    background: url('../img/fondobot.jpg') -600px 0;
    opacity:0.5;
        text-align:center;
        vertical-align: middle;
            height: 280px;
}

#b1:hover {opacity:1;}
#b2:hover {opacity:1;}
#b3:hover {opacity:1;}

.quotes {
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
font-size: 14px;
text-align: left;
margin: 0px auto;
}
.main {
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
font-size: 14px;
text-align: left;
margin: 30px auto;
}
 .author_name_white { font-family:"Roboto"; margin: 70px 0 0 75px; color: #fff; font-size: 20px; }
 .author_name_gray { font-family:"Roboto"; margin: 70px 0 0 75px; color: #94a4a4; font-size: 20px; }
 .quotes_container { width: 90%; margin: 0 auto; height: auto;}
#divider { background: url('../img/divider.png')no-repeat; width: 300px; height: 35px; margin: 0px auto 27px auto; }
#ribbon { background: url('../img/ribbon.png')no-repeat; width: 251px; height: 48px; margin: 0 auto; display: block; position: relative; top: -38px; }
#snowflakes1 { background: url('../img/snowflakes.png')no-repeat; width: 24px; height: 21px; margin: 0 auto; display: block; position: relative; bottom: -54px; left: -102px; }
#snowflakes2 { background: url('../img/snowflakes.png')no-repeat; width: 24px; height: 21px; margin: 0 auto; display: block; position: relative; bottom: -33px; right: -100px; }

#Inicio{
background:url('../img/primaria.jpg') 50% 0 no-repeat fixed;
color: #333333;
height: auto;
overflow: hidden;
padding-top: 80px;
background-size: cover;
display: block;
font-weight: 300;
padding-right: 35%;
padding-left: 12px;
line-height: 1.2;
}
#Productos{
background-color: #fff;

color: #fff;
min-height: 100vh;
padding: 110px 0 0 15px;
background-size: cover;

display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}

#Ubicacion{
background:url('../img/plots.jpg') 50% 0 no-repeat fixed;
position: relative;
flex-wrap: wrap;
height: 100vh;
color: white;
width:100%;
padding: 150px 20% 0 20%;
background-size: cover;
float: left;
display: block;
}
#Proyectos{
background-color: #000;
color: #fff;
overflow: hidden;
padding: 110px 0 0 0;
background-size: cover;
display: block;
}
{
    box-sizing: border-box;
}
#Galeria{
  width: 100%;
  padding: 110px 0 0 15px;
  overflow: auto;
  top: 138px;
  bottom: 0;
  height: auto;
}
#copyright { color: #fff; font-family:"Roboto"; font-size: 14px; margin-top: 100px; text-align: center; }
#copyright a { text-decoration: none; color: #fff; }


#cssSlider {
  width: 800px;
	height: 600px;
	overflow: hidden;
}



#video {float: left;}
#prodetalle {float: left; min-width: 200px; width: 31%; margin-right: 20px; padding: 5px; background-color: #271f1f8f;}
.td {text-align:"right"}

#sliderImages {	width : 3200px;	height: 600px;	overflow: hidden;

	animation: slide 30s infinite;	-moz-animation: slide 30s infinite;	-webkit-animation: slide 30s infinite; -o-animation: slide 30s infinite;
}
#sliderImages img {	float: left;}

#FS {  width: 280px;	height: 280px;	overflow: hidden;  	float: right;}
#SliFija {	width : 1200px;	height: 280px;	overflow: hidden;
	animation: afij 30s infinite;	-moz-animation: afij 30s infinite;	-webkit-animation: afij 30s infinite;	-o-animation: afij 30s infinite;}
#SliFija img {	float: left;}

#Acc {  width: 420px;	height: 280px;	overflow: hidden;  	float: right;}
#SlAcc {	width : 1600px;	height: 280px;	overflow: hidden;
	animation: aacc 30s infinite;	-moz-animation: aacc 30s infinite;	-webkit-animation: aacc 30s infinite;	-o-animation: aacc 30s infinite;}
#SlAcc img {	float: left;}





@keyframes slide{
	0%{margin-left: 0px;}	20%{margin-left: 0px;}  40%{margin-left: -800px;}	50%{margin-left: -800px;}	60%{margin-left: -1600px;}	70%{margin-left: -1600px;}	80%{margin-left: -2400px;}	90%{margin-left: -2400px;}

}

@-moz-keyframes slide{
  0%{margin-left: 0px;}	20%{margin-left: 0px;} 40%{margin-left: -800px;}  	50%{margin-left: -800px;}	60%{margin-left: -1600px;}	70%{margin-left: -1600px;}	80%{margin-left: -2400px;}	90%{margin-left: -2400px;}
}

@-webkit-keyframes slide{
  0%{margin-left: 0px;}	20%{margin-left: 0px;} 40%{margin-left: -800px;}  	50%{margin-left: -800px;}	60%{margin-left: -1600px;} 	70%{margin-left: -1600px;}	80%{margin-left: -2400px;}	90%{margin-left: -2400px;}
}

@-o-keyframes slide{
  0%{margin-left: 0px;}	20%{margin-left: 0px;} 40%{margin-left: -590px;}
  	50%{margin-left: -590px;}	60%{margin-left: -1180px;} 	70%{margin-left: -1180px;}	80%{margin-left: -1770px;} 	90%{margin-left: -1770px;}
}




@keyframes afij{
0%{margin-left: 0px;} 20%{margin-left: -260px;} 40%{margin-left: -600px;} 60%{margin-left: -900px;}
}

@-moz-keyframes afij{
  0%{margin-left: 0px;} 20%{margin-left: -260px;} 40%{margin-left: -600px;}  60%{margin-left: -900px;}
  }


@-webkit-keyframes afij{
  0%{margin-left: 0px;} 20%{margin-left: -260px;} 40%{margin-left: -600px;} 60%{margin-left: -900px;}
  }

@-o-keyframes afij{
  0%{margin-left: 0px;} 20%{margin-left: -260px;} 40%{margin-left: -600px;} 60%{margin-left: -900px;}
  }

  @keyframes aacc{
  0%{margin-left: 0px;} 20%{margin-left: -450px;} 40%{margin-left: -800px;} 60%{margin-left: -1200px;}
  }

  @-moz-keyframes aacc{
  0%{margin-left: 0px;} 20%{margin-left: -450px;} 40%{margin-left: -800px;} 60%{margin-left: -1200px;}
    }


  @-webkit-keyframes aacc{
  0%{margin-left: 0px;} 20%{margin-left: -450px;} 40%{margin-left: -800px;} 60%{margin-left: -1200px;}
    }

  @-o-keyframes aacc{
  0%{margin-left: 0px;} 20%{margin-left: -450px;} 40%{margin-left: -800px;} 60%{margin-left: -1200px;}
    }