@charset "utf-8";
/* CSS Document */
html, body{background:#fff url(metal.jpg);margin:0;padding:0;height:100%;font-family:"Fira Sans", verdana, sans-serif;color:#080808;text-align:center;}
.clear{clear:both;}
img{max-width:100%;}
a:link,a:visited{text-decoration:none;color:#e8641a;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;cursor:pointer}
a:hover{color:#fcba47;}
.wsp{position:fixed;bottom:1em;left:0;background:#00be00;width:52px;height:52px;overflow:hidden;z-index:9;text-align:right;transition:all 0.3s ease;}
.wsp img{margin:10px 10px 0 0;}
.wsp:hover{width:70px;}
.portones{width:100%;max-width:1410px;margin:0 auto;font-size:16px;background:#fff;padding:0 0 12px;}
.venta{width:50%;float:left;margin-top:20px;font-size:18px;}
.instalacion{font-size:24px;font-weight:700;margin:0px 0 8px;}
.motor{font-size: 12px;margin:0;letter-spacing:1px;}
.enrejado{font-size: 16px;margin:0;letter-spacing:1px;}
.caba{padding-bottom:30px;}
.automatizado{width:82%;margin:0px auto 0;}
.amedida{width:20%;float:left;color:#e8641a;font-weight:700;text-align:center;cursor:pointer;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;padding:6px 0;}
.amedida:hover{background:#e8641a;color:#fff;}
.reparar{width:100%;}
@keyframes aires {0% {margin-left:0;}22% {margin-left:0;}25% {margin-left:-100%;}47% {margin-left:-100%;}50% {margin-left:-200%;}72% {margin-left:-200%;}75% {margin-left:-300%;}96% {margin-left:-300%;}100% {margin-left:0;}}
@-moz-keyframes aires {0% {margin-left:0;}22% {margin-left:0;}25% {margin-left:-100%;}47% {margin-left:-100%;}50% {margin-left:-200%;}72% {margin-left:-200%;}75% {margin-left:-300%;}96% {margin-left:-300%;}100% {margin-left:0;}}
@-webkit-keyframes aires {0% {margin-left:0;}22% {margin-left:0;}25% {margin-left:-100%;}47% {margin-left:-100%;}50% {margin-left:-200%;}72% {margin-left:-200%;}75% {margin-left:-300%;}96% {margin-left:-300%;}100% {margin-left:0;}}
.metal{width:100%;height:380px;overflow:hidden;background:url(001.jpg);background-size:cover;border-top:3px solid #e8641a;border-bottom:3px solid #cacaca}
.fabricante{width:400%;height:380px;animation: aires 20s infinite;-moz-animation: aires 20s infinite;-webkit-animation: aires 20s infinite;}
.porton{width:25%;height:400px;float:left;text-align:right}
.corredizo{background:url(001.jpg)center no-repeat;background-size:cover;}
.pivotante{background:url(002.jpg)center no-repeat;background-size:cover;}
.automatico{background:url(003.jpg)center no-repeat;background-size:cover;}
.plegable{background:url(004.jpg)center no-repeat;background-size:cover;}
#fabrica{width:100%;left:0;top:195px;position:absolute;background:#e8641a;display:none}
#portones{width:82%;margin:0 auto;padding:4px 0;color:#fff;}
.encaba{width:31.33%;float:left;margin:2px 1%;color:#fff;font-weight:700;padding:2px 0;}
.encaba:hover{background:#fcba47;}
h1{font-size:50px;color:#e8641a;margin:0;padding:40px 0 20px;}
.garage{width:60%;float:left;margin:0 0 20px 4%;height:260px;border-left:8px solid #e8641a;}
.garage p{width:90%;margin:22px auto;text-align:left;}
.doblechapa{width:25%;float:left;margin:0 0 20px 3%;background: url(portones/fabrica.jpg) center;background-size:cover;;height:260px;}
.corredizos{width:96%;margin:0 2% 70px;}
.corredizos p{text-align:left;margin:10px auto;}
h2{font-size:26px;font-weight:700;margin:0;padding:0 0 12px;text-align:center;}
.mantenimiento{width:46%;float:left;margin: 0 2% 70px;}
.mantenimiento p{text-align:center;margin:10px auto;}
.corredizos h2{text-align:left;}
.elporton{float:right;padding-left:10px;}
.linea{width:100%;height:3px;background:#e8641a;}
.fabrica{font-family:"Fira Sans", verdana, sans-serif;font-size:16px;width:80%;border:2px solid #e8641a;color:#080808;background:none;margin:0 0 12px;padding:4px;}
.levadizo{width:60%;max-width:240px;background:#fcba47;color:#fff;margin:4px 0 8px;padding:6px;font-weight:700;border:0;font-family:"Fira Sans", verdana, sans-serif;font-size:16px;cursor:pointer;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;transition:all 0.3s ease;}
.levadizo:hover{background:#e8641a;color:#080808;}
.urgencias{width:80%;margin:0 auto 10px;border:3px solid #e8641a;height:340px;}
.reja{width:100%;background:#080808;color:#fff;margin-top:16px;padding:8px 0 4px;}
.manual{width:90%;max-width:1410px;margin:0 auto;}
.chapa{width:50%;float:left;margin-bottom:12px;}
.portonmetal{display:none;}
#levadizos{width:100%;}
.motorizado{width:80%;height:290px;border:0;}
@keyframes portones {0%{margin-left: 0px;} 100%{margin-left: -1403px;}}
@-moz-keyframes portones {0%{margin-left: 0px;} 100%{margin-left: -1403px;}}
@-webkit-keyframes portones {0%{margin-left: 0px;} 100%{margin-left: -1403px;}}
.deportones{width:100%;height:200px;overflow:hidden;}
.deportones img{margin-right:20px;}
.reformas{width:2810px;height:200px;text-align:left;animation:portones linear 100s infinite;-moz-animation:portones linear 100s infinite;-webkit-animation:portones linear 18s infinite;}
@media only screen and (max-width: 820px) {
.automatizado{width:100%;}
.garage,.doblechapa{width:90%;float:none;margin:0 auto 14px;}
.garage{height:auto;border:0;}
.doblechapa{background-size:contain;background-repeat: no-repeat;}
}
@media only screen and (max-width: 680px) {
#venta{display:none;}
.automatizado{width:100%;height:31px;overflow:hidden;}
.portonmetal{display:block;}
.amedida{float:none;width:100%;}
.metal,.fabricante,.porton,.porton img{height:280px;}
.chapa{width:100%;float:none;}
}
@media only screen and (max-width: 570px) {
.venta{float:none;width:90%;margin:0 auto;padding:8px 0 4px;}
.venta img{max-width:60%;}
.mantenimiento{width:96%;float:none;margin: 0 2% 70px;}
}
@media only screen and (max-width: 500px) {
.metal,.fabricante,.porton,.porton img{height:160px;}
h1{font-size:38px}
.elporton{float:none;}
h2,.corredizos p{text-align:center;}
}