/*
Theme Name: Pixeled
Description: Sitio web Pixeled 2015
Author: Teko Estudio	
Author URI: http://www.tekoestudio.com

*/
@import 'fonts/DinCond.css';
@import 'fonts/DinMed.css';

body { font-family: 'Open sans', sans-serif; overflow-x: hidden; }

header { background: #fff;-moz-box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
-webkit-box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16); width: 100%;  overflow: hidden; position: fixed;  left: 0; z-index: 999; }

header a.logo { display: inline-block;background: url(images/logo.svg) center center no-repeat; width: 280px; height: 65px;  text-indent: -99999px;  float: left; margin: 5px 0 0 20px; }

header nav ul li a {display: block; text-transform: uppercase; font-family: 'Roboto'; color: #2d2d3a ; text-decoration: none; padding:30px 20px; font-size: 16px;  font-weight:bold;}

header nav ul li a.active, header nav ul li a:hover {color: #ffffff;background: rgba(255,8,82,1);
background: -moz-linear-gradient(top, rgba(255,8,82,1) 0%, rgba(218,90,128,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,8,82,1)), color-stop(100%, rgba(218,90,128,1)));
background: -webkit-linear-gradient(top, rgba(255,8,82,1) 0%, rgba(218,90,128,1) 100%);
background: -o-linear-gradient(top, rgba(255,8,82,1) 0%, rgba(218,90,128,1) 100%);
background: -ms-linear-gradient(top, rgba(255,8,82,1) 0%, rgba(218,90,128,1) 100%);
background: linear-gradient(to bottom, rgba(255,8,82,1) 0%, rgba(218,90,128,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff0852', endColorstr='#da5a80', GradientType=0 ); padding: 30px 20px; -moz-box-shadow:    0px 8px 4px 0px rgba(0,0,0,0.84);
box-shadow:         0px 8px 4px 0px rgba(0,0,0,0.84);}

/* Rectangle 3: */

nav ul {float: right; margin-right:15px;  }

nav ul li { float: left;}

.frase h5 {
   color: white;display: table;font-family: "Roboto";font-size: 30px;font-style: italic;line-height: 40px;margin: 0 auto;padding:20px 250px; text-align: center; }
   
.titulo { text-align: center; color: #fff; font-size: 2em;}

.frase h5 span {font-weight: bold; text-transform: uppercase;}

.right, .redes {float: right; }

nav {float: left;}

.servicio {transition:all 0.2s ease-in-out 0s;  }

/*.servicio:hover {-ms-transform: scale(1.1,1.1); /* IE 9 */
 /*   -webkit-transform: scale(1.1,1.1); /* Safari */
 /*   transform: scale(1.1,1.1);} */

#proyectowrap > div {
    background: #fff none repeat scroll 0 0;
    height: 70vh;
    margin: 6% 5%;
   
}

#owl-demo {
    max-height: 98%;
    overflow: hidden;
}
.owl-theme .owl-controls {
    position: absolute;
    right:30px;
    text-align: center;
    top: 75%;
}
.owl-pagination {
    display: none;
}

.owl-prev, .owl-next {
    position: relative;
}
 
/*replace the content value with the
corresponding value from the list below*/
 
.owl-prev:before {
    content: "\f104";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
/*--adjust as necessary--*/
    color: #000;
    font-size: 5em;
    padding-right: 0.5em;
    position: absolute;
    top: 10px;
    left: 0;
    text-indent:0px;
}

.owl-next:before {
    content: "\f105";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
/*--adjust as necessary--*/
    color: #000;
    font-size: 5em;
    padding-right: 0.5em;
    position: absolute;
    top: 10px;
    left: 20px; text-indent:0px;
}
.redes.limpiar > li {float: left; margin: 18px 10px 0 0px;}

.fa-circle.face {color: #3B5998;}

.fa-circle.twee {color: #4099FF;}

.lap-wrap > img {margin: 30px 0 0 0;}

.wrap-pixeled { margin:5% 0 0 0; }

.servicios { width: 30%; float: left; height: 100%; background: url(images/tex5.png);-webkit-box-shadow: 15px 3px 40px -13px rgba(24,26,36,1);
-moz-box-shadow: 15px 3px 40px -13px rgba(24,26,36,1);
box-shadow: 15px 3px 40px -13px rgba(24,26,36,1); z-index: 998;
    position: relative; }

.servicios ul li { margin: 0 0 5px 0; }
.servicio p {
    margin: 0 0 10px;
    color: #2d2d3a ; line-height:1.3em;
}

.servicios ul li.titulo { font-family: 'Roboto'; color: #fff; font-size: 2.2em; margin: 0 0 15px 35px; }

.servicios ul li a { font-family: 'Roboto'; color: #fff; text-decoration: none; padding: 15px 20px; display: block; width: 90%; margin: 0 5%; box-sizing: border-box;}

.servicios ul li a:hover, .servicios ul li a.active2 { background: #0e4e62; border-radius: 5px; }

.servicio > img {
    margin-left: 25%;
    margin-right: 25%;
    margin-top: 0;
    width: 50%;
}
.servicio h4 {
    font-family: "Open Sans";  font-size: 1.2em; color: #2d2d3a ;
    font-weight: 600; 
    font-size: 1.3em;
    line-height: 1.2em; margin-bottom: 10px;
}
.servicio > p {
    font-size: .9em;
    line-height: 1.5em;
}

.content-wrap { padding: 0px 0; margin:0px; }

.proyecto h4, .content-wrap h2, #ser h2, #proyectos h2, #clientes h2 { text-align: center; color: #2d2d3a ; font-family: 'DINCond'; font-size: 40px; margin: 40px 0 20px 0; font-weight: 100; text-transform: uppercase;}

.content-wrap h2 {color:#fff;}

.content-wrap h2 span, #ser h2 span, #proyectos h2 span, #clientes h2 span {margin: 0 20px; }

.tercio {
    width: 33.33%;
}
/*.proyecto {
    float: left;
    position: relative;
  
}
.proyecto img {
    width: 100%;
}
*/
.over-pro {
    background: none repeat scroll 0 0 rgba(255, 8, 81, 0.7);
    cursor: pointer;
    left: 0;
    position: absolute;
    top: 0;
}
.content-pro > h4 {
    font-family: 'Open sans';
    font-weight: 800; line-height: 2em;
    text-align: center;
    text-transform: uppercase;
    color: #fff;
    font-size: 1.2em;
}
.content-pro > p {
    font-family: 'Open sans';
    font-weight: 300; font-style: italic;
    text-align: center;
    color: #fff;
    font-size: 1em;
}

#clientes ul li {
    float: left;
    width: 14%;
    margin: 20px 1.3%;
}
#clientes ul li img {
    width: 90%;
    margin: 0 5%;
}

#ser {padding: 30px  0; background: #FBFBFB; }


.service-more {position:relative;}

a.ser-box-link {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #e7e7e7; left:45%; border-radius: 50%;
  display: block; margin-top:20px;
  text-decoration:none; transition:all 0.2s ease-in-out 0s;
    height: 35px; color:#ff1c5f;font-weight:bold; 
    position: absolute;font-size: 20px; 
    width: 35px;
}
.modal  { padding:25px;
    background-color: #fff;
    border: 1px solid #000;
    border-radius: 10px;
    box-shadow: 0 8px 6px -6px black;
    display: none;
    text-align: left;
    width: 600px;
}
a.ser-box-link:hover {background:#ff1c5f; color:#fff !important;  }

a.ser-box-link span:hover { color:#fff;  }

a.ser-box-link span {   top: 7px;
    position: relative; }

#servicios {margin: 50px 0 0 0;}

#servicios > li { width: 33%; float: left;  text-align: center; min-height: 410px;}

.wrap-pixeled > p { font-size: 1em;line-height: 1.5em; text-align: center; color:#fff;}

.content-wrap h3 { color: #44B8C7; font-family: 'Roboto'; font-size: 24px; margin: 0 0 20px 0; font-weight: 100; text-transform: uppercase;}

.cont-wrap { padding: 80px 0 0 0; margin: 0 auto; width: 980px;}

.wrap {  margin: 0 auto; width: 980px;}

.tit-footer { color: #544E4F; font-family: 'Roboto'; font-weight: 100; text-align: center; font-size: 17px; width: 70%; margin: 0 auto 15px auto; line-height: 22px; }

.lap { width: 50%; float: left; position: relative; }

.lap-ri { width: 55%; float: right; margin: 0 3% 0 0; }

.cont-lap-left { width: 40%; float: left;}

.cont-pixeled { width: 50%; float: right;background:#2d2d3a; padding:114px 5%; box-sizing:border-box;}

.cont-lap h4, .cont-lap-left h4 { font-family: 'Roboto'; margin: 0 0 10px 0; color: #756E6F; text-transform: uppercase; font-size: 21px; }

.wrap-lap li.num-list {background: url("images/li.png") no-repeat scroll 0 center rgba(0, 0, 0, 0); padding: 0 0 0 20px;}


.pixeled-wrap  {width: 100%;  height: 496px; background-repeat:no-repeat; background-size:cover; overflow:hidden; }

.desc-servicio { background: url(images/tex3.png); }

.desc-servicio img {max-height: 300px;width: 95%; border: 1px solid #81c2d8;}

.desc-servicio > h3 { color: #fff; font-family: "Roboto"; font-size: 2.5em; margin: 20px 0;  }

.temasr {float: left; width: 60%; padding: 0 0 0 30px; box-sizing:border-box;}

.gap { padding: 1px; }

.desc-servicio {height: 100%; padding: 60px 0 0 40px; position: absolute; top: 0; left: 0; width: 112%; box-shadow: 1px 1px 1px #000; }

.desc-servicio > p {color:#fff; max-width:700px; font-size: 18px; line-height: 25px;}

.inactive { transform: scale(1, 1) translate(1500px, 0px);}

#registro { position: relative; }

#mapa{width: 100%;height: 500px;}

#map{position: relative;}

.white {background: #fff; width: 100%; box-sizing:border-box; padding: 20px;}

.white img {width: 60%; margin: 0 20%;}

#contacto{position: absolute;top: 0;right: 0;}

.direcc {height: 500px;background: #FF0851;  width: 350px;  margin-right: 50px;  float: right;}

#clientes  {padding: 50px 0;}

#client{ font-size: 0;  }

.direcc > h3 {color: #ffffff;font-family:"Roboto";font-size: 24px; margin: 20px 0; text-align: center; font-weight: 400;}
    
input, textarea { background:#ffffff;border: 1px solid #dadad4; color: #998f82; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; margin: 10px 0; padding: 10px;width: 93%;  font-size: 14px;  font-family: 'Open sans', sans-serif; }

.contactanos { padding: 30px; color: #ffffff; font-size: 1em; line-height: 1.3em;}

.contactanos i {margin-right: 10px;}

.contactanos p {margin-bottom: 10px;}

.direcc ul li a {color: #ffffff;  text-decoration: none; display: block; }

.direcc ul li  {color: #ffffff; text-align: center;  margin: 5px 0; padding: 5px 0;}
		
footer {padding: 20px 0; background-color:#2f2f2f; width: 100%; color: #ffffff;}

footer p {float: left; display: inline; margin: 10px 0 0 30px; color:#575757;}

a.tekoestudio {background: url(images/tekoestudio.png) no-repeat; text-indent: -999999px; display: block; float: right; width: 159px; height: 35px; opacity: 0.4; margin: 0 30px 0 0;}

a.tekoestudio:hover {opacity: 1;}

.cambiaMapa { background: #44b8c7; border-radius: 5px; padding: 10px; }

.cambiaMapa:hover { background: #153032; text-decoration: none; }

input[type="submit"] {background: #424242;border:none; color: #fff; text-transform: uppercase; width: 100%;}

input[type="submit"]:hover {background: #44b8c7;}

.over { background:rgba(0, 0, 0, 0.8); bottom: 0; left: 0; position: fixed; right: 0; top: 0; z-index: 100000; }

a#cerrar {color:#fff;  margin: 30px; font-size: 2.1em; display: block;  position: absolute;
    right: 10px;}

.proyecto > h4 { text-align: center;  font-size: 2em; margin: 3% 0%; }

.descrip-servicio {width:43%; float:left;  padding: 30px; box-sizing:border-box;}

.gallery-servicio img {width:100%;}

.gallery-servicio {width:55%; float:right; background:#2d2d3a; height:100%;  padding: 20px;
    box-sizing: border-box;}

.proyecto > h5 { text-align: center; color: #fff; font-size: 1.2em;  }

img.clienteimg {width: 10%; margin: 30px 45%;  border-radius: 500px;}


.descrip-servicio > h4 {
    text-transform: uppercase; text-align:center; margin-bottom:15px;
}

.descrip-servicio >  p {
  text-align:center; color:#404040; font-size:14px; line-height:19px;
}

.descrip-servicio >  ul {
  margin-top:20px;
}

.descrip-servicio >  ul li {
  margin:10px ; color:#404040; font-size:14px; line-height:19px;
  
}

.descrip-servicio > h4 span{
margin:0 10px; }

.descripcion > p {
    text-align: center;
    color: #fff;
    font-size: 1em;
    margin-bottom: 10px;
}

#loader {
    left: 48%;
    position: absolute;
    top: 48%;
}

.proyecto li img {
    width: 100%;
}
.proyecto li {
    float: left;
    width: 20%;
    margin: 0 1%;
}

.spinner { position: absolute; top: 50%; left: 50%; }
.spinner i {  color: #fff; font-size: 40px; }

#proyectowrap .proyecto.limpiar {
    display: none;
}

#proyectowrap .proyecto.limpiar.active{
	display: block;
}

.btnslider { position: absolute; top: 45%; color: rgba(0,0,0,0.8); font-size: 50px; }

.rbtnslide { right: 10px; }
.lbtnslide { left: 10px; }

#iniciowrap { -webkit-transition: background-image 0.2s ease-in-out; transition: background-image 0.2s ease-in-out; }

.uno-box { font-size: 40px; font-family: 'Open Sans'; background: rgba(0,0,0,0.5); display: inline-block; padding: 20px; color: #fff; transform: translate(2000px, 0px); opacity: 0;  }

.dos-box { font-size: 40px; font-family: 'Open Sans'; background: rgba(241,38,241,0.82); display: inline-block; padding: 20px; color: #fff; transform: translate(2000px, 0px); opacity: 0;  }

#textss { margin-left: 200px; }