html, body{
width:100%; 
height:100%; 
text-rendering: optimizeLegibility !important;
-webkit-font-smoothing: antialiased !important;
margin: 0px;
font-family: Montserrat;
color: #484848;
}

* {outline: none;}
a, a:active, a:hover {outline: none; text-decoration:none; color: #484848;}
area, area:active, area:hover {outline:none;}
img { border: 0; -ms-interpolation-mode: bicubic;}
svg:not(:root) { overflow: hidden; }

/*========================*/
/*========================*/

.mitad{ width: 50%; float:left;}

#wrapper{ width:100%; position:absolute;}

#header{ height: 120px; background-color: #fff; position:fixed; width: 100%; z-index: 99; }
#logo{    width: 230px;
    height: 120px; background-image:url(img/grupo-fragus.png); background-position:center;background-size: 65%; background-repeat:no-repeat; position: absolute; left: 75px;}

#menu{position: absolute; right: 75px; top: 53px;}

#menu ul{padding: 0px; margin: 0px; list-style:none;}

#menu ul li{ float: left;
    margin: 0px 25px;
    font-family: Montserrat;
    font-size: 13px;
	text-transform: uppercase; letter-spacing: 2px; cursor:pointer;
    font-weight: 400;
	color: #000;}
	
#menu ul li a{color: #000; transition: color .2s; -webkit-transition: color .2s; cursor:pointer;}
	
#menu ul li a:hover{color:#9a8;}

#hero{ margin-top: 120px; width: 100%; height: 580px; position:relative; }

#hero-btn{
    margin: auto;
	width: 200px;
    margin-top: 20px;
    text-align: center;
    color: #9a8;
    font-size: 17px;
    padding: 15px;
    letter-spacing: 4px;
	cursor:pointer;
	background-color: rgba(0,0,0,.5);
	border: 1px dashed #9a8;
	border-radius: 4px;
}


h1{ text-align:center; margin:auto; width: 100%; font-size: 35px; color: #fff; z-index: 97; position:absolute; top: 37%; font-weight: 200; 
text-shadow: 0px 0px 40px rgba(0,0,0,.7);
    letter-spacing: -1px;}

#fragus-empresa{width: 75%; margin:auto; position:relative; box-sizing:border-box; }

#fragus{display:inline-block; height: 100%; margin-top: 100px; margin-bottom: 100px; }

#fragus-texto1{ display:inline-block; height: 100%;}

h2{ font-family: Montserrat;
	color: #111;
	font-size: 35px;
    font-weight: 100;
    letter-spacing: -1px;}
	
h4{ font-family: Montserrat;
	color: #8a9;
	font-size: 15px;
    font-weight: 600;
    letter-spacing: 3px;
	margin-bottom: -20px;}

#fragus-texto1 p{font-family: Montserrat; font-size: 16px;  color: #484848; width: 90%; line-height: 25px;}

#fragus-fotos{height: 415px; }

#fragus-slider{ width: 80%; height: 100%;  float:right; position:relative; margin-top:20px;}

#fragus-slider-mobile{display:none; width: 100%; height: 100%; float:right; position:relative; margin-top:20px;}

/*===========  SERVICIOS  ============*/


#servicios{ position:relative; width: 100%; display: inline-block; padding: 50px 15%;
    box-sizing: border-box; background-color: #111; 
}

#servicios h2{ color: #fff; text-align:center; font-size: 30px;}
	

	
#servicios-container{ margin:auto; z-index: 9999; margin-top: 70px;}

.service-container{
	width :100%;
	display:inline-block;
	margin-bottom: 50px;
}

.cada-servicio{
	    height: 150px;
    width: 275px;
    float: left;
    position: relative;
    display: inline-block;
    -moz-border-radius: 2px;
    cursor: pointer;
    transition: ease all .2s;
    -webkit-transition: ease all .2s;
    background-size: cover;
}

.cada-servicio:hover{ opacity:.8;}
	


.img-serv{
	border-top-right-radius: 6px; -webkit-border-top-right-radius: 6px; -moz-border-top-right-radius: 6px;
	border-top-left-radius: 6px; -webkit-border-top-left-radius: 6px; -moz-border-top-left-radius: 6px; 
	background-position:center; background-size: cover; width: 100%;     height: 170px;
    margin-bottom: 25px;
}
	
#serv1{background-image:url(img/producto-terminado-fragus.jpg); }
#serv2{background-image:url(img/diseno-prendas-fragus.jpg); }
#serv3{background-image:url(img/corte-confeccion-fragus.jpg); }
#serv4{background-image:url(img/molderia-fragus.jpg); }
#serv5{background-image:url(img/estampados-fragus.jpg); }
#serv6{background-image:url(img/tejeduria-bordado-fragus.jpg); }
#serv7{background-image:url(img/planchado-embolsado-fragus.jpg); }
#serv8{background-image:url(img/envio-producto-fragus.jpg); }

.detalle-titulo{     color: white;
    text-align: center;
    box-sizing: border-box;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
    position: relative;
    width: 95%;
    height: 90%;
    line-height: 135px;
    background-color: rgba(0,0,0,.5);
    margin: auto;
    margin-top: 3%;
	border:1px dashed #9a8;
	border-radius:4px;
	font-weight: 600;
}

.detalle-texto{ font-size: 17px;
    color: #9a8;
    line-height: 25px;
    left: 40px;
    position: relative;
	margin-top: 40px;
}

.cada-detalle {display:none;
	background-color: rgba(255,255,255,.97);
	 padding: 40px;
    border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
    box-sizing: border-box;
    position: absolute;
    top: 200px;
    left: 50%;
    width: 50%;
    margin-left: -25%;
	text-align:center;
}

.close{ 
	background-color: #484848;
    font-size: 15px;
    font-weight: 800;
    color: #fff;
    width: 90px;
    border-radius: 70px;
    padding: 7px 2px;
    text-align: center;
    margin: auto;
    margin-top: 30px;
    cursor: pointer;
    letter-spacing: 1px;
}
	
	
/*===========  CLIENTES  ============*/
	
	
#clientes{ width: 100%;
    position: relative;
    display: inline-block;
    padding: 30px 10% 120px 10%;
    box-sizing: border-box;
	text-align:center;
	display:none;
}

#clientes-container{width: 90%; display:inline-block;}

.cada-cliente{width: 18%; background-size: 120%; background-position:center; background-repeat: no-repeat; float:left; height: 125px; margin: 1%;}

#cliente1{background-image:url(img/clientes-fragus-google-off.jpg);}
#cliente2{background-image:url(img/clientes-fragus-nestle-off.jpg)}
#cliente3{background-image:url(img/clientes-fragus-samsung-off.jpg);}
#cliente4{background-image:url(img/clientes-fragus-cocacola-off.jpg);}
#cliente5{background-image:url(img/clientes-fragus-airfrance-off.jpg);}

#cliente6{background-image:url(img/clientes-fragus-alitalia-off.jpg);}
#cliente7{background-image:url(img/clientes-fragus-prune-off.jpg);}
#cliente8{background-image:url(img/clientes-fragus-lg-off.jpg);}
#cliente9{background-image:url(img/clientes-fragus-alvear-off.jpg);}
#cliente10{background-image:url(img/clientes-fragus-redhat-off.jpg);}

#cliente11{background-image:url(img/clientes-fragus-mercadolibre-off.jpg);}
#cliente12{background-image:url(img/clientes-fragus-pierrefabre-off.jpg);}
#cliente13{background-image:url(img/clientes-fragus-techint-off.jpg);}
#cliente14{background-image:url(img/clientes-fragus-bcociudad-off.jpg);}
#cliente15{background-image:url(img/clientes-fragus-belatrix-off.jpg);}



#cliente1-on{background-image:url(img/clientes-fragus-google.jpg); }
#cliente2-on{background-image:url(img/clientes-fragus-nestle.jpg); }
#cliente3-on{background-image:url(img/clientes-fragus-samsung.jpg); }
#cliente4-on{background-image:url(img/clientes-fragus-cocacola.jpg);  }
#cliente5-on{background-image:url(img/clientes-fragus-airfrance.jpg); }

#cliente6-on{background-image:url(img/clientes-fragus-alitalia.jpg);}
#cliente7-on{background-image:url(img/clientes-fragus-prune.jpg);}
#cliente8-on{background-image:url(img/clientes-fragus-lg.jpg); }
#cliente9-on{background-image:url(img/clientes-fragus-alvear.jpg); }
#cliente10-on{background-image:url(img/clientes-fragus-redhat.jpg); }

#cliente11-on{background-image:url(img/clientes-fragus-mercadolibre.jpg);}
#cliente12-on{background-image:url(img/clientes-fragus-pierrefabre.jpg); }
#cliente13-on{background-image:url(img/clientes-fragus-techint.jpg);}
#cliente14-on{background-image:url(img/clientes-fragus-bcociudad.jpg);}
#cliente15-on{background-image:url(img/clientes-fragus-belatrix.jpg); }


.cliente-on{ opacity:0; transition: ease all .2s; -webkit-transition: ease all .2s;  width:100%; height: 100%; background-size: 120%; background-position:center; background-repeat: no-repeat;}	
.cliente-on:hover{ opacity:1;}	
	

/*===========  FOOTER  ============*/


#contacto{ width: 100%;
	background-color: #222; color: #fff;
    background-image: url(img/bg-footer.jpg);
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat;
	height: 300px;
	position: absolute;
}

#footer-logo{ 
	position: absolute;
	top:0px;
    right: 30px;
    width: 250px;
    height: 200px;
    background-image: url(img/grupo-fragus-blanco.png);
    background-position: center;
    background-size: 75%;
    background-repeat: no-repeat;
    opacity: 1;
}

#footer-texto{margin-top: 50px; margin-left:50px;}

#address{ font-size :20px; width: 60%;}

#address a{text-decoration:none; color: #9a8;}
#address a:hover{color: white;}


.copy{font-size: 14px;
    line-height: 100px;}



.fragus-foto1 {
  height: 100%; width: 100%;
  background-size: 85%; background-repeat:no-repeat; background-position:center; position:absolute;
}
.fragus-foto1 {
  background-image:url(img/grupo-fragus-producto-terminado.jpg); opacity: .9; z-index:2;
} 

.marco2{ height: 100%; border:1px dashed #9a8; border-radius:2px; position:relative; left: 75%; top: -5%; width: 70%; opacity: .4; z-index:1;}
.marco{ height: 100%; border:1px dashed #9a8; border-radius:2px; position:absolute; left: 10%; top: 5%; width: 70%; z-index:3}

/*===========  SLIDESHOW  ============*/

#slideshow{width: 100%; height: 105%; position:relative; background-color: black; }

.slide1,.slide2,.slide3,.slide4 {
  width: 100%;
  height: 100%;
  background-size: cover; background-repeat:no-repeat; background-position:center;
  position:absolute;
	opacity:.7;
}
.slide1 {
  background-image:url(img/bg-fragus-producto-terminado.jpg);
} 
.slide2 {
  background-image:url(img/bg-fragus-textil.jpg);
}
.slide3 {
  background-image:url(img/bg-fragus-fabrica-ropa.jpg);
}
.slide4 {
  background-image:url(img/bg-fragus-servicios.jpg);
}




/*===========  GALERIA  ============*/


#photo-gal{
	width: 100%;
	position:relative;
	display: block;
}

#photo-gal ul{
	width: 100%;
	position:relative;
	padding: 0;
    margin: 0;
	list-style:none;
	float:left;
}

#photo-gal ul li{
	float:left; width:25%; height: 350px;
}

#photo-gal ul li .zoom{
	background-size: cover; background-repeat: no-repeat; background-position:center; width: 100%; height: 100%; cursor:pointer;
}

#photo-gal ul li:hover{ transform: scale(1.05); transition: ease all 500ms; -webkit-transition: ease all 500ms; -moz-transition: ease all 500ms;}

.fragus-gal-foto1{background-image: url(img/fragus-foto1.jpg);}
.fragus-gal-foto2{background-image: url(img/fragus-foto2.jpg);}
.fragus-gal-foto3{background-image: url(img/fragus-foto3.jpg);}
.fragus-gal-foto4{background-image: url(img/fragus-foto4.jpg);}
.fragus-gal-foto5{background-image: url(img/fragus-foto5.jpg);}
.fragus-gal-foto6{background-image: url(img/fragus-foto6.jpg);}
.fragus-gal-foto7{background-image: url(img/fragus-foto7.jpg);}
.fragus-gal-foto8{background-image: url(img/fragus-foto8.jpg);}