/**
 * Lamark
 *
 * Creative Portfolio Template
 *
 * v1.2
 * By Amcode
 */



/**
 * [TABLE OF CONTENTS]
 *
 * - PRELOADER
 * - HEADER
 *    - Logo
 *    - Menu
 *    - Trigger
 * - HEROS
 * - SECTIONS
 * - PORTFOLIO
 *    - Filters
 *    - Grid
 * - ABOUT
 * - CONTACT
 * - BLOG
 * - PAGINATIONS
 * - SHARE
 * - FOOTER
 * - MISC
 *    - Images
 *    - Vertical center
 */



/** == PRELOADER == */
/** ================================================== */

	.preloader {
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1000;
		background: #FFFFFF;
	}

	.loader {
		width: 32px;
		height: 32px;
		position: absolute;
		top: 50%;
		left: 50%;
		margin: -16px 0 0 -16px;
		border: 4px solid #E1E1E1;
		border-top: 4px solid #1E2023;
		border-radius: 50%;

		-webkit-animation: preloader-anim 0.5s infinite linear;
		animation: preloader-anim 0.5s infinite linear;
	}

	@-webkit-keyframes preloader-anim {
		from { -webkit-transform: rotate(0deg); }
		to { -webkit-transform: rotate(360deg); }
	}

	@keyframes preloader-anim {
		from { transform: rotate(0deg); }
		to { transform: rotate(360deg); }
	}



/** == HEADER == */
/** ================================================== */

	.site-header {
		display: table;
		width: 100%;
		height: 80px;
		position: fixed;
		z-index: 3;
		background: #FFFFFF;
	}

	.header-inner {
		display: table-cell;
		vertical-align: middle;
	}

	/** Logo */
	.site-logo {
		text-transform: uppercase;
		font-size: 1.4em;
		font-weight: 700;
		line-height: 30px;
		letter-spacing: 0.3em;
	}

	/** Menu */
	#site-menu li {
		display: inline-block;
		position: relative;
		margin-left: 15px;
		line-height: 30px;
	}

	#site-menu li:first-child { margin-left: 0; }

	#site-menu li a {
		text-transform: uppercase;
		font-size: 0.8em;
		letter-spacing: 0.3em;

		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}

	#site-menu li a:hover { opacity: 0.5; }

	#site-menu li ul {
		display: none;
		width: 180px;
		position: absolute;
		top: 100%;
		left: 0;
		margin: 0;
		padding: 10px 0;
		background: #000000;
	}

	#site-menu li:hover ul { display: block; }

	#site-menu li ul li {
		display: block;
		line-height: normal;
		margin: 0;
	}

	#site-menu li ul li a {
		display: block;
		color: #FFFFFF;
		font-weight: 400;
		padding: 10px 25px;
	}

	#site-menu li ul li a.active { opacity: 0.5; }
	
	#site-menu li ul.children {
		display: none;
		width: 180px;
		position: absolute;
		left: 180px;
		margin: 0;
		top: 0;
		padding: 10px 0;
		background: #000000;
	}
	
	#site-menu li ul li:hover ul.children { display: block; }
	
	#site-menu li ul.children li {
		display: block;
		line-height: normal;
		margin: 0;
		
	}
	
	#site-menu li ul.children li a:hover { display: block; }
	
	#site-menu li ul.children li a {
		display: block;
		color: #FFFFFF;
		font-weight: 400;
		padding: 10px 25px;
	}
	
	#site-menu li ul.children li:first-child a{
	margin-left: 0;
	}
	


	/** Trigger */
	.trigger-nav {
		width: 30px;
		height: 30px;
		position: relative;
		overflow: hidden;
		cursor: pointer;
	}

	.trigger-nav .inner {
		width: 18px;
		height: 18px;
		position: absolute;
		top: 50%;
		left: 50%;
		margin: -9px 0 0 -9px;
	}

	.trigger-nav .inner .icon-bar {
		width: 20px;
		height: 2px;
		position: absolute;
		left: 0;
		background: #1E2023;

		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}

	.trigger-nav .inner .icon-bar.top { top: 0; }
	.trigger-nav .inner .icon-bar.middle { top: 8px; }
	.trigger-nav .inner .icon-bar.bottom { bottom: 0; }

	.trigger-nav.open-nav .inner .icon-bar.middle { opacity: 0; }

	.trigger-nav.open-nav .inner .icon-bar.top {
		top: 8px;

		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	.trigger-nav.open-nav .inner .icon-bar.bottom {
		bottom: 8px;

		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}



/** == HEROS == */
/** ================================================== */

	.hero { position: relative; }

	.hero-image,
	.hero-content {
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
	}

	.hero-header {
		position: absolute;
		top: 50%;
		/* top: 20%; */
		left: 50%;
		padding: 30px;
		/* background: rgba(255, 255, 255, 0.9); */
	    outline: 4px double #FFF; 
		/*
		background: rgba(255, 255, 255, 0.9);
		outline-offset: 8px;
		*/

		-webkit-transform: translateX(-50%) translateY(-50%);
		transform: translateX(-50%) translateY(-50%);
	}

	.hero-header-title {
		text-transform: uppercase;
		font-size: 1.8em;
		font-weight: 700;
		letter-spacing: 0.3em;
		
	}

	.hero-header-subtitle {
		text-transform: uppercase;
		font-size: 0.8em;
		margin-top: 5px;
		letter-spacing: 0.3em;
		/*-webkit-text-stroke: 1px black;*/
	   color: #FFF;
	   /*text-shadow:

		 -1px -1px 0 #FFF,  
		  1px -1px 0 #FFF,
		  -1px 1px 0 #FFF,
		   1px 1px 0 #FFF; */
	}



/** == SECTIONS == */
/** ================================================== */

	.sections { position: relative; }
	.sections.padding-size-s { padding: 25px 0; }
	.sections.padding-size-m { padding: 50px 0; }
	.sections.padding-size-l { padding: 25px 0; }



/** == PORTFOLIO == */
/** ================================================== */

	/** Filters */
	.filters {
		text-align: center;
		margin-bottom: 25px;
	}

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

	.filters li a {
		text-transform: uppercase;
		font-size: 0.8em;
		padding: 5px 15px;
	}

	.filters li a.active {
		color: #FFFFFF;
		background: #1E2023;
	}

	/** Grid */
	.grid .entry {
		float: left;
		position: relative;
	}

	.entry-image,
	.entry-hover {
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		background-position: center center;
	}

	.entry-hover {
		visibility: hidden;
		opacity: 0;
		background: rgba(255, 255, 255, 0.9);

		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}

	.entry:hover .entry-hover {
		visibility: visible;
		opacity: 1;
	}

	.entry-title {
		text-transform: uppercase;
		font-size: 1.2em;
		font-weight: 700;
		position: relative;
		top: -15px;
		opacity: 0;

		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}

	.entry-subtitle {
		font-size: 0.8em;
		position: relative;
		bottom: -15px;
		opacity: 0;

		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}

	.entry:hover .entry-title,
	.entry:hover .entry-subtitle { opacity: 1; }
	.entry:hover .entry-title { top: 0; }
	.entry:hover .entry-subtitle { bottom: 0; }

	.entry-fix-caption {
		padding: 15px 25px;
		position: absolute;
		left: 0;
		bottom: 0;
		z-index: 1;
		background: #FFFFFF;
	}



/** == ABOUT == */
/** ================================================== */



/** == CONTACT == */
/** ================================================== */

	#messages {
		display: none;
		margin-top: 25px;
	}

	#messages .error {
		padding: 15px 25px;
		color: #999999;
		background: #F1F1F1;
	}

	#messages .success {
		text-align: center;
		padding: 25px;
		color: #999999;
		background: #F1F1F1;
	}



/** == BLOG == */
/** ================================================== */

	.blog-tag a {
		display: inline-block;
		padding: 2px 10px;
		background: #F1F1F1;

		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}

	.blog-tag a:hover {
		color: #FFFFFF;
		background: #1E2023;
	}

	.blog-tag i {
		color: #999999;
		margin-right: 15px;
	}

	.blog-search { margin-bottom: 25px; }

	input.blog-search-input {
		height: 60px;
		line-height: 52px;
		border: 4px solid #F1F1F1;
	}

	.blog-search-btn {
		height: 60px;
		line-height: 60px;
		position: absolute;
		top: 0;
		right: 0;
		margin: 0;
		font-size: 1em;
		color: #1E2023;
		background: #F1F1F1;
	}

	.share-blog {
		display: block;
		padding: 25px 0;
		margin: 50px 0;
		border-top: 2px solid #E1E1E1;
		border-bottom: 2px solid #E1E1E1;
	}

	.comment { margin-top: 50px; }

	.comment-meta {
		display: table;
		margin-left: 25px;
		height: 60px;
	}

	.comment-meta-inner {
		display: table-cell;
		vertical-align: middle;
	}

	.comment-date {
		font-size: 0.8em;
		color: #999999;
	}

	.comment-content {
		padding: 15px;
		margin-top: 15px;
		border-radius: 5px;
		border: 1px solid #E1E1E1;
		position: relative;
	}

	.comment-content:before {
		content: '';
		width: 0;
		height: 0;
		border-left: 8px solid transparent;
		border-right: 8px solid transparent;
		border-bottom: 8px solid #E1E1E1;
		position: absolute;
		top: -8px;
		left: 22px;
	}

	.comment-form { margin-top: 50px; }



/** == PAGINATIONS == */
/** ================================================== */

	.paginations { position: relative; }

	.paginations:before {
		content: '';
		width: 20px;
		height: 2px;
		background: #1E2023;
		position: absolute;
		top: 0;
		left: 50%;
		margin-left: -10px;
	}

	.project-pagination {
		width: 210px;
		height: 40px;
		margin: 0 auto 25px;
	}

	.blog-pagination {
		width: 140px;
		height: 40px;
		margin: 0 auto 25px;
	}

	.project-pagination li,
	.blog-pagination li {
		display: block;
		float: left;
		width: 60px;
		height: 40px;
		line-height: 40px;
		position: relative;
		margin: 0 5px;
		background: #F1F1F1;
		cursor: pointer;

		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}

	.project-pagination li:hover,
	.blog-pagination li:hover {
		color: #FFFFFF;
		background: #1E2023;
	}

	.project-pagination li a,
	.blog-pagination li a {
		display: block;
		text-align: center;
	}



/** == SHARE == */
/** ================================================== */

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

	.share.share-project li { margin: 0 15px; }
	.share.share-blog li { margin: 0 5px; }

	.share li.share-title {
		text-transform: uppercase;
		font-size: 0.8em;
		color: #999999;
	}

	.share.share-project li.share-title { display: block; }
	.share.share-blog li.share-title { margin-left: 0; }

	.share li a {
		text-transform: uppercase;
		font-size: 0.8em;

		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}

	.share.share-project li a:hover { opacity: 0.5; }

	.share.share-blog li a {
		display: block;
		padding: 5px 10px;
		background: #F1F1F1;
	}

	.share.share-blog li a:hover {
		color: #FFFFFF;
		background: #1E2023;
	}



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

	.site-footer { background: #F1F1F1; }
	.footer-inner { padding: 50px 0; }

	.copy {
		font-size: 0.8em;
		color: #999999;
	}

	.copy a,
	.copy span { color: #1E2023; }

	.back2top {
		width: 40px;
		height: 40px;
		position: absolute;
		top: -20px;
		right: 50px;
		background: #1E2023;
		cursor: pointer;
		text-align: center;
		color: #FFFFFF;
		line-height: 40px;
	}



/** == MISC == */
/** ================================================== */

	/** Images */
	.iBG {
		background-size: cover;
		background-repeat: no-repeat;
	}

	.img-responsive {
		display: block;
		min-width: 100%;
		max-width: 100%;
	}

	.img-rounded { border-radius: 50%; }

	.parallax { background-attachment: fixed; }

	/** Vertical center */
	.vcenter { position: relative; }
	
	.redes {
		filter: invert(30%);
	}
	
	.redes:hover {
		transition: all 0.3s ease 0s;
		filter: invert(0%);		
		
	}
/* CSS para la animación y localización de los DIV de cookies */
@keyframes desaparecer
{
0%	{bottom: 0px;}
80%	{bottom: 0px;}
100%	{bottom: -50px;}
}
@-webkit-keyframes desaparecer /* Safari and Chrome */
{
0%	{bottom: 0px;}
80%	{bottom: 0px;}
100%	{bottom: -50px;}
}
@keyframes aparecer
{
0%	{bottom: -38px;}
10%	{bottom: 0px;}
90%	{bottom: 0px;}
100%	{bottom: -38px;}
}
@-webkit-keyframes aparecer /* Safari and Chrome */
{
0%	{bottom: -38px;}
10%	{bottom: 0px;}
90%	{bottom: 0px;}
100%	{bottom: -38px;}
}
#cookiesms1:target {
display: none;
}
.cookiesms{	
width:100%;
/* height:143px; */
margin:0 auto;
padding-left:1%;
padding-top:5px;
font-size: 10px;
clear:both;
font-weight: strong;
color: #333;
bottom:0px;
position:fixed;
left: 0px;
background-color: #FFF;
opacity:0.8;
filter:alpha(opacity=70); /* For IE8 and earlier */
transition: bottom 1s;
-webkit-transition:bottom 1s; /* Safari */
-webkit-box-shadow: 3px -3px 1px rgba(50, 50, 50, 0.56);
-moz-box-shadow: 3px -3px 1px rgba(50, 50, 50, 0.56);
box-shadow: 3px -3px 1px rgba(50, 50, 50, 0.56);
z-index:999999999;
}
.cookiesms:hover{
bottom:0px;
}
.cookies2{
background-color: #FFF;
display:inline;
opacity:0.95;
filter:alpha(opacity=95);
position:absolute;
left:1%;
top:-40px;
font-size:15px;
height:40px;
padding-left:25px;
padding-right:25px;
-webkit-border-top-right-radius: 15px;
-webkit-border-top-left-radius: 15px;
-moz-border-radius-topright: 15px;
-moz-border-radius-topleft: 15px;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
-webkit-box-shadow: 3px -3px 1px rgba(50, 50, 50, 0.56);
-moz-box-shadow: 3px -3px 1px rgba(50, 50, 50, 0.56);
box-shadow: 3px -3px 1px rgba(50, 50, 50, 0.56);
}
/* Fin del CSS para cookies */
