*::-moz-selection {
  background-color: #fff68c;
  color: #000;
  text-shadow: none;
}

body{
	background: #fdfdfd;
	color: #444;
	font-size: 14px;
	font-weight:300;
	text-align:justify;
}

p{
	font-family: 'HNL', sans-serif;
}

a{
	color: #555;
	/*fdce00 fdbd00;*/
	text-decoration: none;
	-o-transition:.5s;
	-ms-transition:.5s;
	-moz-transition:.5s;
	-webkit-transition:.5s;
	transition:.5s;
}

a:visited{
	color: #555;
}

a:hover, a:focus, a:active {
  color: #fdce00;
}

.container,#content,#colophon{
	width: 960px;
	margin: 0 auto;
}

#masthead{
	height: 70px;
	line-height: 70px;
	width: 100%;
	background: #101820;
	margin-bottom: 36px;
}

.site-branding{
	width: 42%;
	float: left;
	position: relative;
	/*right: 40px;*/
}

h1.site-title{
	width: 332px;
	float: left;
	display: inline;
	clear: none;
	position: relative;
	top: 12px;
}
h1.site-title img{
	width: 180px;
	height: auto;
}
h2.site-description{
	color: #fdce00;
	width: 220px;
	float: left;
	display: inline;
	clear: none;
	line-height: 18px;
	font-weight: 700;
	padding-top: 17px;
	padding-left: 18px;
}
h2.site-description a{
	color: #fdce00;
}
h2.site-description a:hover{
	color: #FDBD00;
}

#site-navigation{
	width: 58%;
	float: left;
	color: #fff;
	font-weight: 700;
}

.main-navigation{
	clear: none;
}

.menu-menu-principal-container{
	float: right;
}

#site-navigation .menu ul{
	float: right;
}
#site-navigation .menu ul.nav-menu li{
	
}
#site-navigation a{
	-o-transition:.5s;
	-ms-transition:.5s;
	-moz-transition:.5s;
	-webkit-transition:.5s;
	transition:.5s;
	color: #fff;
	display: block;
	padding: 0 10px;
	font-size: 14px;
}
#site-navigation a:hover,
.current-menu-item a{
	color: #fff;
	background: #fdce00;
}

/*las imágenes son responsive...*/
#main img{
	max-width: 100%;
	height: auto;
}

.rslides_container {
  margin-bottom: 32px;
}

#primary{
	width: 620px;
	float: left;
	margin-right: 30px;
	clear: none;
}

#secondary{
	float: left;
	width: 310px;
}

.single-proyectos .entry-content{
	width: 720px;
	float: left;
}
.single-proyectos #secondary{
	width: 210px;
	float: right;
	margin-top: 1.5em;
	clear: right;
}


/*Templating some more,
specially Single
*/
/*.page-template-template-blog-php #primary,
.single-post #primary{
	width: 100%;	
}*/

/*.page-template-template-blog-php .entry-content,*/
.single-post .entry-content,
.single-post #comments,
.single-post .entry-footer{
	width: 620px;
	float: left;
}
/*.page-template-template-blog-php #secondary,*/
.single-post #secondary{
	width: 310px;
	float: right;
	margin-top: 1.5em;
	
}

/*.page-template-template-blog-php .entry-meta,
.page-template-template-blog-php .entry-footer,*/
.single-post .entry-meta,
.single-post .entry-footer{
	width: 620px;
	font-size: 12px;
}

.page-template-template-blog-php #secondary{
	/*margin-top: 26px;*/
}

/*Headings*/

h1.entry-title{
	border-bottom: 1px solid #444;
	font-size: 18px;
	font-weight: bold;
	padding-bottom: 9px;
}

h1.entry-title a{
	color: #444;
}

.entry-content{
	color: #333;
}

.entry-content a{
		text-decoration: underline;
	font-style:italic;
}

.comments-link,
.edit-link{
	display: none;
}

/*Sidebars*/
#secondary ul{
	list-style-type: none;
	margin: 0;
	padding: 0;
	
}

#secondary ul a{
	color: #111;
}
#secondary ul a:hover{
	color: #999;
}

.sidebar-proyectos h1{

}
.sidebar-proyectos ul{
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.widget-proyectos{
	margin-bottom: 2em;
}

.widget-proyectos ul li{
	font-family: 'Microsoft sans serif', Helvetica, Arial, sans-serif;
	color: #333;
}

.widget_execphp ul{
	margin: 0;
	padding: 0;
	margin-bottom: 2em;
	float: left;
}

.widget-proyectos-social ul li,.widget_execphp ul li{
	float: left;
	margin-right: 0.5em;
	list-style-type: none;
}
.widget_nav_menu{
	clear: both;
}
.execphpwidget{
	float: left;
	margin-bottom: 2em;
}

/*Bloque Amarillo*/
ul#menu-bloque-amarillo{
	margin: 0;
	list-style-type: none;
	background: #fdce00;
	width: 100%;
	height: 260px;
	padding: 55px 0 0 55px;
	position: relative;
}
ul#menu-bloque-amarillo li{
	margin: 0;
	padding: 0;
}
ul#menu-bloque-amarillo a{
	color: #fff;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 16px;
	display: block;
	transition: none;
}

ul#menu-bloque-amarillo a:hover{
	color: #000;
	/*background: #FDBD00;*/
}
/*Bloque Amarillo 2 (Home, Sidebar general)*/
ul#menu-bloque-amarillo-no-en-servicios{
	margin: 0;
	list-style-type: none;
	background: #fdce00;
	width: 100%;
	height: 260px;
	padding: 55px 0 0 55px;
	position: relative;
}
ul#menu-bloque-amarillo-no-en-servicios li{
	margin: 0;
	padding: 0;
}
ul#menu-bloque-amarillo-no-en-servicios a{
	color: #fff;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 16px;
	display: block;
	transition: none;
}

ul#menu-bloque-amarillo-no-en-servicios a:hover{
	color: #444;
	/*background: #FDBD00;*/
}

/*especial*/
.amarillo-selected{
	color: #444 !important;
	/*background: #FDBD00;*/
}

/*Bloque Amarillo III - en Proyecto single*/
.single-proyectos ul#menu-bloque-amarillo-no-en-servicios{
	margin: 0;
	list-style-type: none;
	background: #fdce00;
	width: 100%;
	height: auto;
	padding: 25px;
	position: static;
	clear: both;
	margin-top: 1.5em;
	float: left;
}
.single-proyectos ul#menu-bloque-amarillo-no-en-servicios li{
	margin: 0;
	padding: 0;
}
.single-proyectos ul#menu-bloque-amarillo-no-en-servicios a{
	color: #fff;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 12px;
	display: block;
	transition: none;
}

.single-proyectos ul#menu-bloque-amarillo-no-en-servicios a:hover{
	color: #000;
	background: #FDBD00;
}

/*Sidebar things*/
h1.widget-title{
	border-bottom: 1px solid #000;
	padding-bottom: 0;
	font-size: 18px;
	font-weight: bold;
	padding-bottom: 9px;
	margin-bottom: 0.5em;
}
.widget{
	color: #333;
	font-size: 13px;
}

/*Map things*/
#map_canvas{
	margin-bottom: 18px;
}
#map_canvas img{max-width: inherit;}

/*Casos de Estudio*/
#casos-de-estudio{
	background: #fdfdfd;
	float: left;
	position: relative;
	width: 100%;
}
#casos-de-estudio h1{
	margin-bottom: 2em;
}

ul.lista-de-proyectos{
	list-style-type: none;
	padding: 0;
	margin: 0 0 0 1em;
}

ul.lista-de-proyectos li{
	float: left;
	margin-right: 1em;
	margin-bottom: 1em;
	position: relative;
	width: 300px;
	height: 200px;
}

ul.lista-de-proyectos li a.proyecto-imagen{
	position: absolute;
	top: 0;
	left: 0;
	transition: 0.25s;
	width: 300px;
	height: 200px;
}
ul.lista-de-proyectos li a.proyecto-nombre{
	position: absolute;
	top: 0;
	left: 0;
	transition: 0.25s;
	opacity: 0;
	width: 300px;
	height: 200px;
	text-align: center;
	vertical-align: middle;
	line-height: 200px;
	color: #fff;
	font-weight: bold;
}

ul.lista-de-proyectos li a.proyecto-nombre:hover{
	position: absolute;
	top: 0;
	left: 0;
	opacity: 1;
	background: rgba(0,0,0,0.5);
}

/*#load-more{
	width: 100%;
	float: left;
	text-align: center;
	color: #999;
	font-size: 14px;
	font-weight: bold;
	margin: 36px 0 54px 0;
}

#load-more a{
	color: #999;
	display: block;
	width: 50%;
	margin: 0 auto;
	padding: 4px 0;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
    border-radius: 3px;
	border: 1px solid #ddd;
	transition: 0.25s;
}
#load-more a:hover{
	color: #fff;
	background: rgba(253,206,0,0.75);
	border: 1px solid #fdce00;
}*/

/*footer*/
#colophon{
	margin-bottom: 36px;
	padding-top: 10px;
	border-top: 1px solid #999;
	font-family: 'Microsoft sans serif', Helvetica, Arial, sans-serif;
}
#social-media{
	width: 50%;
	float: left;
}
#social-media ul{
	list-style-type: none;
	margin: 0;
	padding: 0;
}
#social-media ul li{
	float: left;
	margin-right: 0.5em;
}
#social-media ul li a{}
.site-info{
	width: auto;
	float: right;
	color: #999;
	font-size: 12px;
}
.site-info a{
	color: #999;
}
#unique-creditos{
	color: #000;
}

/*Servicios*/

#servicios{
	background: #f7f7f7;
	margin-bottom: 2em;
	display: none;
}
.servicio{
	display: none;
	width: 620px;
	padding: 56px 0;
	min-height: 380px;	
}

#arrow-down{
	text-align: center;
}

#arrow-down .rotated {
  transform: rotate(180deg);
  -ms-transform: rotate(180deg); /* IE 9 */
  -moz-transform: rotate(180deg); /* Firefox */
  -webkit-transform: rotate(180deg); /* Safari and Chrome */
  -o-transform: rotate(180deg); /* Opera */
}

#next-prev-close{
	float: left;
	width:620px;
	text-align: right;
	position: relative;
	top: 4.5em;
	z-index: 999;
}

#next-prev-close a{
	margin-left: 7px;
	display: inline-block;
}

/* Filterable */
#los-proyectos-mobile{
	display: none;
}
.portfolioFilter{
	width: 100%;
	float: left;
	margin: -1em 0 2em 0;
}
.portfolioFilter a{
	color: #000;
	margin-right: 1em;
	text-transform: uppercase;
	font-size: 12px;
}
.portfolioContainer{
	float: left;
	margin-bottom: 3em;
}

.portfolioContainer .proyecto-listado{
	/*float: left;*/
	margin-right: 1.25em;
	margin-bottom: 1.25em;
	position: relative;
	width: 300px;
	height: 200px;
}

.portfolioContainer a.proyecto-imagen{
	position: absolute;
	top: 0;
	left: 0;
	transition: 0.25s;
	width: 300px;
	height: 200px;
}
.portfolioContainer a.proyecto-nombre{
	position: absolute;
	top: 0;
	left: 0;
	transition: 0.25s;
	opacity: 0;
	width: 300px;
	height: 200px;
	text-align: center;
	vertical-align: middle;
	line-height: 200px;
	color: #fff;
	font-weight: bold;
}

.portfolioContainer a.proyecto-nombre:hover{
	position: absolute;
	top: 0;
	left: 0;
	opacity: 1;
	background: rgba(0,0,0,0.5);
}

.isotope-item {
    z-index: 2;
}
.isotope-hidden.isotope-item {
    pointer-events: none;
    z-index: 1;
}
.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */
 
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    transition-duration: 0.8s;
}
.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    transition-property: height, width;
}
.isotope .isotope-item {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    transition-property: transform, opacity;
}

/*Single Proyectos*/
.mitad-start,.mitad-end{
	width: 48%;
	float: left;
	font-size: 13px;
}
.mitad-start p,.mitad-end p{
	margin-bottom: 1.5em;
}
.mitad-start{
	margin-right: 4%;
}
.nav-links{
	clear: both;
	/*cambiado por cesar*/
	visibility:hidden;
}
.single-proyectos h1.entry-title{
	font-size: 24px;
	font-weight: bold;
}

.page .entry-header h1{
	font-size: 18px;
}

.page .entry-content h2,
.page .entry-content  h3,
.page .entry-content  h4,
.page .entry-content  h5,
.page .entry-content  h6,
.single-proyectos .entry-content h2,
.single-proyectos .entry-content  h3,
.single-proyectos .entry-content  h4,
.single-proyectos .entry-content  h5,
.single-proyectos .entry-content  h6,
.single-proyectos #secondary h2,
.single-proyectos #secondary  h3,
.single-proyectos #secondary h4,
.single-proyectos #secondary h5,
.single-proyectos #secondary h6
{
	border-bottom: 1px solid #000;
	font-weight: bold;
	margin-bottom: 1em;
	padding-bottom: 0.5em;
}

/*Nosotros*/
.page-template-template-full-width-php #primary{
	width: 100%;
}

#twothirds{
	width: 66%;
	float: left;
}
#onethird{
	width: 33%;
	float: left;
	margin-left: 1%;
}

#onethird img{
	float: right;
}

.page-id-6 .entry-header,.page-id-6 .symple-two-third{
	width: 600px;
}
.page-id-6 .wp-image-315{
	margin-top: -120px;
	margin-bottom: 2em;
}
.page-id-6 .menu-bloque-amarillo-no-en-servicios-container{
	position: relative;
	bottom: 4em;
}

/*Contacto*/

/*NextPrev Posts y Proyectos*/
.nav-next a,
.nav-previous a{
     -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
    border-radius: 3px;
	padding: 5px 10px;
	background: #222;
	width: auto;
	display: inline-block;
	color: #999;
}
.nav-next:visited a,
.nav-previous a:visited{
	color: #999;
}

.nav-next a:hover,
.nav-previous a:hover{
	background: #fdce00;
	color: #222;
}

/*Blog*/
.page-template-template-blog-php article .entry-title,
.single-post .entry-title{
	font-size: 18px;
}

#comments ol.comment-list{
	margin: 0;
	list-style-type: none;
}

/*Comments*/
#respond input[type=text], textarea,
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"]{
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
  outline: none;
  padding: 3px 0px 3px 3px;
  margin: 5px 1px 3px 0px;
  border: 1px solid #DDDDDD;
}
 
 
#respond input[type=text]:focus,
textarea:focus,
.wpcf7-form input[type="text"]:focus,
.wpcf7-form input[type="email"]:focus {
  box-shadow: 0 0 5px rgba(81, 203, 238, 1);
  /*margin: 5px 1px 3px 0px;*/
  border: 1px solid rgba(81, 203, 238, 1);
}

.comments-title{
	font-size: 24px;
	padding: 0.5em 0;
	margin: 1em 0;
	border-top: 1px solid #999;
	border-bottom: 1px solid #999;
}

li.comment{
	padding: 1em;
	background: #f9f9f9;
	border: 1px solid #ddd;
     -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
    border-radius: 3px;
	float: left;
}

li.comment img{
	float: left;
	margin-right: 1em;
	padding: 3px;
	background: #fff;
	border: 1px solid #eee;
}

.comment-author{
	line-height: 32px;
	display: inline-block;
	width: 50%;
	float: left;
}
.comment-metadata{
	width: 50%;
	float: left;
	text-align: right;
	line-height: 32px;
	font-size: 12px;
}
.comment-content{
	clear: both;
	display: block;
	float: left;
	width: 100%;
	margin-top: 1em;
	font-size: 16px;
	color: #555;
}

.reply{
	width: 100%;
	clear: both;
	float: left;
}

.comment-reply-title{
	width: 100%;
	float: left;
	color: #555;
	font-size: 16px;
	font-weight: bold;
	padding: 0.25em 0;
	margin: 0.5em 0;
	border-bottom: 1px dashed #999;
}

.comment-form-comment label{
	width: 100%;
	float: left;
	font-size: 14px;
	color: #555;
}

.form-allowed-tags{
	color: #555;
}

/*Archivos*/
.archive h1.page-title{
	font-size: 24px;
}
.archive h1.entry-title{
	font-size: 36px;
}

/*.archive article{
	padding: 1em;
	border: 1px solid #ddd;
}

.archive article.odd{
	background: #fdfdfd;
}
.archive article.even{
	background: #f9f9f9;
	border: 1px solid #ddd;
}*/

.archive .entry-meta,
.page-template-template-blog-php .entry-meta{
	font-size: small;
}

.archive article img,
.page-template-template-blog-php article img{
	padding: 2px;
	/*background: #fff;
	border: 1px solid #ddd;*/
	margin-bottom: 1.5em;
}

/*Navegacion Posts*/
.single-post .post-navigation{
	width: 620px;
	max-width: 620px;
	float: left;
	clear: none;
	margin-top: 1em;
}

/*Hide Mobile Menu*/
#menu-area-mobile{
	display: none;
}

.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"]{
	border: 1px solid #ddd;
}

/*Responsive*/

@media only screen and (max-width: 1100px){
	.container,#content,#colophon{
		width: 95%;
		padding: 0 2.5%;
	}
	
	#colophon{
		padding-top: 36px;
	}
	
	#primary{
		width: 60%;
		margin-right: 5%;
	}

	#secondary{
		float: left;
		width: 30%;
	}

	.single-proyectos .entry-content{
		width: 100%;
		float: left;
	}
	.single-proyectos #secondary{
		width: 100%;
		float: left;
		margin-top: 1.5em;
		clear: both;
	}
	
	/*Bloque Amarillo*/
	ul#menu-bloque-amarillo{
		width: 100%;
		height: auto;
		padding: 1em;
	}

	ul#menu-bloque-amarillo-no-en-servicios{
		width: 100%;
		height: auto;
		padding: 1em;
	}

	/*Bloque Amarillo III - en Proyecto single*/
	.single-proyectos ul#menu-bloque-amarillo-no-en-servicios{
		width: 100%;
		height: auto;
		padding: 1em;
	}
	
	.site-branding{
		width: 70%;
		float: left;
		position: static;
		right: auto;
	}

	#site-navigation{
		display: none;
	}
	
	ul.lista-de-proyectos li{
	  width: 30%;
	  height: 120px;
	  
	}
	ul.lista-de-proyectos li a,ul.lista-de-proyectos li a img{
	  width: 100%;
	  height: auto;
	  
	}
	ul.lista-de-proyectos li a.proyecto-nombre{
		position: absolute;
		top: 0;
		left: 0;
		transition: 0.25s;
		opacity: 0;
		width: 100%;
		height: 120px;
		line-height: 120px;
	}
	.site-info{
		float: left;
	}
	
	.page-id-6 .symple-all,
	.page-id-6 .entry-header{
		width: 100% !important;
	}
	.page-id-6 #menu-bloque-amarillo-no-en-servicios{
		display: none;
	}
	.page-id-6 .wp-image-315{
		margin-top: 0;
		margin-bottom: 0;
	}
	
	/*Servicios Mobile*/
	#menu-bloque-amarillo{
		display: none;
	}
	
	#next-prev-close,
	#servicios,
	.servicio{
		width: 100%;
	}
	
	/*Show Mobile Menu*/
	#menu-area-mobile{
		display: block;
	}
	#toggle{
		position: absolute;
		top: -67px;
		right: 10px;
		font-size: 44px;
	}
	
	#nav-mobile{
		width: 100%;
		float: left;
		z-index: 99;
		position: absolute;
		top: 70px;
	}
	#nav-mobile ul{
		display: none; /*only show with jquery*/
		list-style-type: none;
		margin: 0;
		padding: 0;
		clear: both;
		position: absolute;
		width: 100%;
		top: 0;
		left: 0;
	}
	#nav-mobile ul li{
		height: 44px;
		margin: 0;
		padding: 0;
		background: #111 /*rgba(0, 0, 0, 0.86)*/;
		display: block;
		border-top: 1px solid #222;
	}
	
	#nav-mobile ul li a{
		height: 44px;
		line-height: 44px;
		color: #fff;
		display: block;
		text-indent: 1em;
		font-size: 14px;
	}

}

@media only screen and (max-width: 960px){

	/*Single Post*/
	.single-post #primary{
		width: 100%;
		margin-right: 0;
	}
	
	.single-post .entry-content,
	.single-post #comments,
	.single-post .entry-footer{
		width: 100%;
	}

	.single-post #secondary{
		width: 100%;
	}

	.single-post .entry-meta,
	.single-post .entry-footer,
	.single-post .post-navigation{
		width: 100%;
	}

}

@media only screen and (max-width: 910px){

}

@media only screen and (max-width: 768px){
	.site-branding{
		width: 100%;
	}
	h2.site-description {
	  width: auto;
	}
	
	.site-info{
		width: 100%;
		text-align: center;
	}
	#social-media{
		width: 100%;
		text-align: center;
	}
	#social-media ul{
		width: 182px;
		margin: 0 auto;
	}

	#menu-bloque-amarillo,
	#arrow-down{
		display: none;
	}
	#servicios,
	.servicio{
		display: block;
		width: 100%;
	}
	
	/*Proyectos*/
	#los-proyectos{
		display: none;
	}
	#los-proyectos-mobile{
		display: block;
	}
	.portfolioContainerMobile{
		float: left;
		margin-bottom: 3em;
		text-align: center;
	}

	.portfolioContainerMobile .proyecto-listado{
		margin-right: 1.25em;
		margin-bottom: 1.25em;
		position: relative;
		width: 300px;
		height: 200px;
		margin: 0 auto;
		margin-bottom: 1em;
	}

	.portfolioContainerMobile a.proyecto-imagen{
		position: absolute;
		top: 0;
		left: 0;
		transition: 0.25s;
		width: 300px;
		height: 200px;
	}
	.portfolioContainerMobile a.proyecto-nombre{
		position: absolute;
		top: 0;
		left: 0;
		transition: 0.25s;
		opacity: 0;
		width: 300px;
		height: 200px;
		text-align: center;
		vertical-align: middle;
		line-height: 200px;
		color: #fff;
		font-weight: bold;
	}

	.portfolioContainerMobile a.proyecto-nombre:hover{
		position: absolute;
		top: 0;
		left: 0;
		opacity: 1;
		background: rgba(0,0,0,0.5);
	}

}

@media only screen and (max-width: 568px){

	#primary,
	#secondary{
		width: 100%;
		margin-right: 0;
	}
	
	h2.site-description{
		display: none;
	}
	
	#menu-bloque-amarillo,
	#arrow-down{
		display: none;
	}
	#servicios,
	.servicio{
		display: block;
	}
	
	/*listar proyectos a full*/
	ul.lista-de-proyectos{
		width: 300px;
		margin: 0 auto;
	}
	ul.lista-de-proyectos li{
	  width: 300px;
	  height: 200px;
	  display: block;
	  clear: both;
	}
	ul.lista-de-proyectos li a.proyecto-nombre{
		height: 200px;
		line-height: 200px;
	}
	#next-prev-close{
		visibility: hidden;
	}

}

@media only screen and (max-width: 480px){

}
@media only screen and (max-width: 320px){

}
