/*
Theme Name: XionDev
Theme URI: http://xiondev.com
Author: Cristian Mosqueira Brenes
Author URI: http://xiondev.org/cristian_mosqueira/
Description: Tema Original por Cristian Mosqueira Brenes, adaptado para WordPress.
Version: 2.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: parallax, responsive
Text Domain: XionDev

Este tema es bien cool.
*/


/***************

=Page

***************/

body {
	background:#fff;
	overflow-x:hidden;
	font-family: 'Ubuntu', sans-serif;
}
h1, h2, h3, h4, h5 {
	font-family: 'Lato', sans-serif;
	font-weight:lighter;
}

.cd-header {
	display:none;
}
#responsive-nav {
	display:none;
}

#header-xiondev {
	position:relative;
	width:100%;
	height:146px;
}
.resposive-XD {
	width:98%;
	max-width:1140px;
	margin:0 auto;
	position:relative;
}
.centerwrap-responsive {
	width:100%;
	max-width:1180px;
	margin:0 auto;
	position:relative;
}

#line-gray-XD {
	background:#d8d9da;
	height:35px;
	line-height:32px;
}
.head-socials {
	font-family: 'Lato', sans-serif;
	font-size:16px;
	text-align:left;
}
.head-socials a {
	color:#575852;
}
.head-socials a:hover {
	color:#222;
}
.socials-head {
	position:absolute;
	top:4px;
	right:0;
	min-width:10px;
	overflow:hidden;
}
.socials-head a {
	display:block;
	float:left;
	width:26px;
	height:26px;
	margin-left:10px;
}
.socials-head a img {
	opacity:0.6;
}
.socials-head a:hover img {
	opacity:1;
}

/*=Navigation
----------------------------------------*/


#logo-pc {
	width:175px;
	height:51px;
	top:29px;
	position:relative;
}

.navbar {
	height:111px;
	position:relative;
}

.main-navigation {
	clear: both;
}

.menu-menu-head-container {
	position:absolute;
	min-width:250px;
	right:0;
	top:37px;
}

ul.nav-menu,
div.nav-menu > ul {
	font-family: 'Lato', sans-serif;
	margin: 0;
	padding: 0;
}

.nav-menu li {
	display: inline-block;
	position: relative;
}

.nav-menu li a {
	color:#575852;
	display: block;
	font-size: 17px;
	padding:10px;
	margin-left:0px;
	text-decoration: none;
}
.nav-menu > li {
    min-height:34px;
}

/*.nav-menu li:hover,.active > a,
.nav-menu li a:hover,.active {
	border-bottom:1px solid #ED652A;
	color:#3F3F51;
}*/
/*.nav-menu a:hover,
.active {
	border-bottom:1px solid #ED652A;
	color:#3F3F51; 
}*/

.nav-menu .sub-menu,
.nav-menu .children {
	background-color: #fff;
	border:#ED652A 1px solid;
	border-radius:3px;
	display: none;
	padding: 5px;
	position: absolute;
    top:34px;
    left:10px;
	z-index: 99999;
}

.nav-menu .sub-menu ul,
.nav-menu .children ul {
	border-left: 0;
	left: 100%;
	top: 0;
}

ul.nav-menu ul a,
.nav-menu ul ul a {
	color:#3F3F51;
	margin: 0;
	width:150px;
	padding:5px;
}

ul.nav-menu ul a:hover,
.nav-menu ul ul a:hover {
	background-color:#ED652A;
	border:0;
	color:#fff;
}

ul.nav-menu li:hover > ul,
.nav-menu ul li:hover > ul {
	display: block;
}

.nav-menu .current_page_item > a,
.nav-menu .current_page_ancestor > a,
.nav-menu .current-menu-item > a,
.nav-menu .current-menu-ancestor > a {
	border-bottom:1px solid #ED652A;
	color:#3F3F51;
}

.menu-toggle {
	display: none;
}

#menu-item-18 a {
	background:#f48b5d;
	border-radius:3px;
	color:#fff;
}
#menu-item-18 a:hover {
	background:#ed6327;
}

.fixed {
	background:#fff;
	border-bottom:#575852 1px solid;
    position: fixed; 
    top: 0;
	width:100%;
    height: 70px; 
    z-index:9999;
	-webkit-transition: background-color 0.4s, border-bottom 0.4s;
	-moz-transition: background-color 0.4s, border-bottom 0.4s;
	transition: background-color 0.4s, border-bottom 0.4s;
}
.fixed #logo-pc {
	top:10px;
}
.fixed .menu-menu-head-container {
	top:17px;
}


/*****************************************************

=Slider

*****************************************************/

.bxslider {
	height:837px;
}

.XD-slider {
	width:100%;
	max-width:1140px;



	margin:0 auto;
}
.slider-warp {
	height:837px;
	background-size:100% auto !important;
}

.slide-1 {
	background:url(images/slider-bienvenida.jpg) center 0px  no-repeat;
}
.slide-1 article img {
	display:block;
	width:100%;
	height:auto;
	position:relative;
	top:168px;
}

.slide-2 {
	background:url(images/slider-innovacion.jpg) center 0px no-repeat;
}
img.inycr {
	display:block;
	width:321px;
	height:auto;
	margin:12px auto 26px;
}
p.frase-sld2 {
	text-align:center;
	font-family: 'Lato', sans-serif;
	font-weight:lighter;
	font-size:35px;
	color:#fff;
}
img.monitor-XD {
	display:block;
	width:1069px;
	height:auto;
	margin:28px auto 0;
}

.slide-3 {
	background:url(images/slider-woocommerce.jpg) center 0px no-repeat;
}

/*****************************************************

=Servicios

*****************************************************/

#servicios-XD {
	color:#828282;
	overflow: hidden;
	padding:95px 0 39px;
}
#servicios-XD h2 {
	font-size:40px;
	text-align:center;
}
.wrap-servicios {
	overflow:hidden;
}
.wrap-servicios article {
	float:left;
}
.wrap-servicios article img {
	display:block;
	margin:0 auto;
}
.wrap-servicios article p {
	text-align:center;
	font-size:16px;
	line-height:22px;
	font-weight:lighter;
}
.prinpals-XD {
	width:29.3%;
	margin:56px 2% 124px;
	padding-bottom:31px;
	position:relative;
}
.prinpals-XD h3 {
	font-size:30px;
	margin:19px 0;
	text-align:center;
}
.prinpals-XD a {
	position:absolute;
	bottom:0;
	width:100%;
	text-align:center;
	color:#ed6327;
}
.seconds-XD {
	width:23%;
	margin:0 1%;
}
.seconds-XD h4 {
	font-size:18px;
	margin:15px 0;
	text-align:center;
}

/*****************************************************

=Portafolio

*****************************************************/

#portafolio-XD {
	color:#828282;
	padding:71px 0 39px;
}

.port-slider li {
	position:relative;
}
.port-slider img {
	display:block;
	width:100%;
	height:auto;
}
.bg-slider-hover {
	background:url(images/gb-fff-trans.png);
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100vh;
	text-align:center;
	color:#8c8c8c;
	font-size:22px;
}
.bg-slider-hover h4 {
	font-size:40px;
    position:fixed;  
    top:50%;  
    left:50%;  
    width:446px;  
    margin-top:-51px;  
    margin-left:-223px;  
    z-index:1;
}
.bg-slider-hover p {
	font-family: 'Lato', sans-serif;
	font-weight:lighter; 
    position:fixed;  
    top:50%;  
    left:50%;  
    width:100%;
	max-width:600px;  
    margin-top:0px;  
    margin-left:-300px;  
    z-index:1;
}

#portafolio-XD h2 {
	font-size:40px;
	text-align:center;
	margin-top:52px;
}
.wrap-portafolio {
	overflow:hidden;
}
.wrap-portafolio article {
	float:left;
	width:29.3%;
	margin:56px 2% 39px;
	position:relative;
}
.wrap-portafolio article img {
	display:block;
	margin:0 auto;
}
.wrap-portafolio article p {
	text-align:center;
	font-size:16px;
	line-height:22px;
	font-weight:lighter;
}
.wrap-portafolio article h3 {
	font-size:30px;
	margin:19px 0;
	text-align:center;
}

/*****************************************************

=Sobre Nosotros

*****************************************************/

#about-XD {
	color:#828282;
	padding:71px 0 39px;
}
.imgabout {
	display:block;
	width:100%;
	height:auto;
}

#about-XD h2 {
	font-size:40px;
	text-align:center;
	margin:52px 0;
}
#about-XD p {
	text-align:center;
	font-size:16px;
	line-height:22px;
	font-weight:lighter;
	margin-bottom:17px;
}
ul.wrap-txt-about {
	overflow:hidden;
}
ul.wrap-txt-about li {
	float:left;
	width:29.3%;
	margin:20px 2% 36px;
	position:relative;
	text-align:center;
	font-size:16px;
	line-height:22px;
	font-weight:lighter;
	list-style:none;
}
ul.wrap-txt-about li h3 {
	font-size:30px;
	margin:19px 0;
	text-align:center;
}
#about-XD img.sellos {
	display:block;
	margin:0 auto;
}

/*****************************************************

=Contactenos

*****************************************************/

#contactenos-XD {
	background:url(images/bg-molino.jpg);
	width:100%;
	position:relative;
	overflow:hidden;
	z-index:0;
	clear: both;
	color:#828282;
	padding:71px 0 39px;
	height:960px;
}

#helice{
	background:url(images/helice6.png) no-repeat;
	position:relative;
    top: 694px;
    left:240px;
    width: 200px;
    height: 200px;
    z-index:10;
    animation: helice 5.5s infinite linear;
    -moz-animation: helice 5.5s infinite linear;
    -webkit-animation: helice 5.5s infinite linear;
}
 
    @-webkit-keyframes helice {  /* Safari and Chrome */
        from { -webkit-transform: rotate(0deg) }
        to   { -webkit-transform: rotate(360deg) }
    }
    @-moz-keyframes helice {  /* Firefox */
        from { -moz-transform: rotate(0deg) }
        to   { -moz-transform: rotate(360deg) }
    }
    @keyframes helice { /*  sintaxis original  */
        from { transform: rotate(0deg) }
        to   { transform: rotate(360deg) }
    }

/*****************************************************

=Footer XD

*****************************************************/

#footer-XD {
	background:#d8d9da;
	height:100px;
	line-height:100px;
	text-align:center;
	font-size:18px;
	font-weight:lighter;
}