/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video {display:block}
mark, rp, rt, ruby, summary, time {display:inline}
/* Left & Right alignment */
.left {float:left}
.right {float:right}
.wrapper {width:100%;overflow:hidden}
/* Global properties ======================================================== */
body {background-color:#303030 !important;border:0;font:14px Arial, Helvetica, sans-serif;color:#202020;line-height:20px;min-width:100%;overflow:hidden; min-widht:800px; }
.ic {border:0;float:right;background:#fff;color:#f00;width:50%;line-height:10px;font-size:10px;margin:-220% 0 0 0;overflow:hidden;padding:0}
/* Global Structure ============================================================= */
.main {	margin:0 auto; padding-bottom:80px; }
.block {height:92px}
.extra { margin:0 auto 0px;position:absolute; float:left; width: 100%; min-height:100%;   }
.bg1 {background:#000;position:relative;z-index:1;width:100%; float:left;}
.box {width:100%;overflow:hidden;padding-top:20px;padding-bottom:20px;position:relative; min-height:600px; }
.pagination {position:absolute;top:-35px;left:0}
.pagination li {float:left;padding-right:2px;font-size:20px;line-height:34px}
.pagination a {display:inline-block;width:35px;height:35px;color:#000;text-align:center;text-decoration:none;text-align:center;background:#fff}
.pagination a:hover, .pagination .current a {background-position:left;color:#fff;background:#000}
/* ============================= main layout ====================== */
a {color:#202020;text-decoration:underline;outline:none}
a:hover {text-decoration:none}
h1 {padding:10px 0 0 0}
h2 {font-size:22px;line-height:1.2em;padding:17px 0 20px 0;color:#000;font-weight:700}
p {padding-bottom:20px}
/* ============================= header ====================== */
header {width:280px;float:left; position:absolute;}
#logo {display:block;text-indent:-9999px;background:url(../images/logo.png) 0 0 no-repeat;background-size: 100% 100%; width:300px;height:75px;  }
#menu {padding-top:20px}
#menu > li {width:100%;overflow:hidden;padding-bottom:4px}
#menu > li > a {display:inline-block;font-size:26px;line-height:54px;height:56px;color:#fff;background:#000;text-decoration:none;position:relative;letter-spacing:0px;cursor:pointer; max-width:240px}
#menu > li > a span {display:block;background:#fff;position:absolute;width:100%;height:100%;top:0;left:0}
#menu > li > a strong {position:relative;display:block;padding:0 95px 0 40px;height:56px}
#menu > li > a:hover, #menu > li > a.active {color:#000}
#menu > li > a:hover strong, #menu > li > a.active strong{} 
/* ============================= content ====================== */

#content {
	float: left;
position: relative;
right: 50px;
left: 300px;
width: calc(100% - 350px);
margin-bottom: 180px;
}
#content p {
	text-align: justify;
}
#content > ul > li {position:relative;width:100%;bottom:0}
.box1 { background-color: rgba(255,255,255,0.85);/*background:url(../images/bg_content.png) repeat */;width:100%;position:relative;top:0;left:0; float:left;}
.inner {padding:25px 55px 25px 60px;position:relative}
.close {position:absolute;top:20px;right:20px;width:25px;height:25px;background:url(../images/close.gif) 0 0 no-repeat;display:block}
.close span {display:block;background:url(../images/close.gif) 0 bottom no-repeat;width:100%;height:100%}
.pad_left1 {padding-left:5%}
.pad_bot1 {padding-bottom:25px}
.pad_bot2 {padding-bottom:4px}
.pad_bot3 {padding-bottom:10px}
.marg_right1 {margin-right:29px}
#page_Services .pad_bot3 {padding-bottom:15px}
#content figure {padding-top:5px}
.button1, .button2 {display:inline-block;font-size:16px;color:#000;text-transform:uppercase;text-decoration:none;background:#fff;line-height:33px;position:relative}
.button2:hover{color:White; background-color:Black;}
.button1 span {position:absolute;top:0;left:0;width:100%;height:100%;background:#000}
.button1 strong {position:relative;font-weight:400;display:block;padding:0 14px;letter-spacing:-1px}
.button1:hover {color:#fff}
.date {float:left;width:52px;margin-right:17px;text-align:center;font-size:49px;font-weight:700;color:#000;letter-spacing:-1px;line-height:1.2em}
.date strong {margin-top:-9px;display:block}
.date span {font-weight:400;font-size:25px;line-height:1.2em;margin-top:-13px;display:block}
.color1 {color:#000}
.list1, .list2 {margin-top:-2px}
.list1 li, .list2 li {line-height:24px}
.list1 a, .list2 a {padding-left:10px;background:url(../images/marker_1.gif) 0 6px no-repeat;text-decoration:none}
.list1 a:hover {color:#fff}
.list2 a {color:#fff}
.list2 a:hover {color:#808080}
.tabs .nav {padding-top:5px}
.tabs .nav li {line-height:28px;padding-bottom:2px}
.tabs .nav li a {position:relative;font-size:16px;letter-spacing:-1px;text-transform:uppercase;text-decoration:none;height:28px;line-height:26px;padding:0 39px 0 9px;color:#fff;background:#000;display:inline-block}
.tabs .nav li a span {display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:#fff}
.tabs .nav li a strong {font-weight:400}
.tabs .nav li a:hover, .tabs .nav .selected a {color:#000}
.tab-content figure {padding-bottom:15px}
.tab-content figure.marg_right1 {margin-right:20px}
/* Lightbox image */
.lightbox-image {position:relative;overflow:hidden;display:block;background:#fff;z-index:1}
.lightbox-image img {position:relative;z-index:1}
.lightbox-image > span {display:block;position:absolute;left:0;top:0;width:100%;height:100%;background:url(../images/border.gif) 0 0 no-repeat;z-index:2}
.pp_details {height:0;padding:0;margin:0;font-size:0;line-height:0;visibility:visible !important}
.pp_description {display:none;height:0;padding:0;margin:0;font-size:0;line-height:0}
.pp_close {position:absolute;z-index:99;top:-30px;right:0;display:none !important}
div.light_square .pp_next {position:absolute;top:48%;right:-68px;width:35px;height:35px;background:url(../images/marker_right.gif) left top no-repeat;visibility:visible !important}
div.light_square .pp_next:hover {background-position:bottom}
div.light_square .pp_previous {position:absolute;top:48%;left:-68px;width:35px;height:35px;background:url(../images/marker_left.gif) left top no-repeat;visibility:visible !important}
div.light_square .pp_previous:hover {background-position:bottom}
.pp_arrow_previous, .pp_arrow_next {display:none !important}
.link1 {color:#fff;text-decoration:none}
.link1:hover {text-decoration:underline}
/* ============================= footer ====================== */
footer {font-size:16px;text-transform:uppercase;font-weight:400;line-height:40px;position:relative;padding:24px 0 0 0;letter-spacing:-1px; margin: 0; padding: 0; text-align: center; color:#606060;}
footer a {color:#fff;text-decoration:none}
footer a:hover {color:#808080}
.col_1 {width:360px;float:left}
.col_2 {width:740px;float:left;text-align:center}
#footer_logo {float:left;background:url(../images/footer_logo.gif) 0 0 no-repeat;width:111px;height:45px;text-indent:-9999px;margin-right:22px}
/* ============================= forms ============================= */
#ContactForm {margin-top:-2px} 
#ContactForm .wrapper {overflow:inherit;min-height:30px}
#ContactForm span {float:left;width:75px;color:#000;padding-top:2px}
#ContactForm a {margin-right:10px;float:left;margin-top:23px;width:112px;text-align:center}
#ContactForm a span {width:100%}
#ContactForm .input {float:left;margin:0;width:525px;height:16px;background:#fff;padding:4px 10px;color:#808080;font:14px "Trebuchet MS", Arial, Helvetica, sans-serif}
#ContactForm textarea {overflow:auto;margin:0;float:left;width:95%;height:80px;background:#fff;padding:4px 10px;color:#808080;font:14px "Trebuchet MS", Arial, Helvetica, sans-serif}

.followHolder{position: absolute;display: inline-block;float: right;margin-top: 30px;width: 300px; right: 50px}
.followHolder span{font-family: 'Open Sans', sans-serif; position: relative; display: inline-block; color: #313131; font-size: 21px; line-height: 24px;width: 100%;text-align: right;}
.followHolder > ul{display: inline-block;float: right;margin-top: 20px;}
.followHolder > ul > li{display: inline-block; float: left;margin-left: 6px;}
.followHolder > ul > li > a{}
.menubtn {display:none;}


footer p {
	margin-left: auto;
	margin-right: auto;
	max-width: 750px;
	color: white;
	font-size: 12px;
	text-align: center;
	padding: 0;
	line-height: 20px;
}

footer {
	position:absolute;
   bottom:0;
   width:100%;
   height:80px;   
   background:#000;
}

#margen_superior {
		height: 700px;
}

.followHolder {
		top: -700px;
}


body {
		background: url(../images/bg_1920_larga.jpg) no-repeat 200px 0; 
		background-size: 1920px auto;
}

.iframe {
	width:100%; 
	height: 900px; 
	border:2px solid grey; 
	overflow:hidden;
}

.conocenoslinks {
	height:300px;
	padding-top:80px;
	text-align:center;	
}
.conocenoslinks h2 {
	margin-top:20px;
	font-variant: small-caps;
}

.carafaustoborder {
	border: 1px solid white;
	width: 580px;
	height: 580px;
	position: absolute;
	top: -610px;
	left: 243px;
}
.carafausto, .carajorge {
	width: 100%;
	height: 100%;
	opacity : .05;
	position: absolute;
  -o-transition:opacity .2s ease-out, opacity .25s ease-in;
  -ms-transition:opacity .2s ease-out, opacity .25s ease-in;
  -moz-transition:opacity .2s ease-out, opacity .25s ease-in;
  -webkit-transition:opacity .2s ease-out, opacity .25s ease-in;
  /* ...and now override with proper CSS property */
  transition:opacity .2s ease-out, opacity .25s ease-in;
	background: url(../images/fausto.jpg) ;
	background-size:100% 100%;
}

.carafaustoborder h2, .carajorgeborder h2 {
	opacity:.95;
	position: absolute;
	bottom: 0;
	color: black;
	text-shadow: -2px 0 2px white, 0 2px 2px white, 2px 0 2px white, 0 -2px 2px white;
	font-size:30px;
	margin-left:50px;
	margin-bottom: 3px;
	padding-bottom: 3px;
}

.carafausto:hover, .carajorge:hover  {
	opacity:.95;
}

.carafausto:hover h2, .carajorge:hover h2 {
	opacity:.95;
}

.carajorgeborder {
	border: 1px solid white;
	width: 580px;
	height: 580px;
	position: absolute;
	top: -698px;
	left: 830px;
}
.carajorge {
	background: url(../images/jorge.jpg) ;
	background-size:100% 100%;
}

#box_izq{float:left; width: 55%;padding: 0 10% 60px 0; min-width: 250px;}
#box_der{float:left; width: 30%; height: 100%;padding: 0 0 40px 0; min-width: 250px;}

.imagecurriculum {max-height: 200px;max-width: 100%; min-width: 85px;}
.linkcurriculum{float: left;min-height: 230px;text-align: center;background-color:#bbb;-webkit-border-radius: 9px;padding: 15px; opacity: .7; min-width: 65%; }
.linkcurriculum:hover, .linkcurriculum:active{ opacity:1;}

.fotocurriculum  {
	height: 70px;
	border: 2px solid gray;
	border-radius: 5px;
	margin-right: 20px;
}

.titulocurriculum {
	vertical-align: bottom;
}

.error{position: relative;
width: 100%;
color: red;}

@media all and (max-width: 1800px) {
	body {
		background: url(../images/bg_1920_larga.jpg) no-repeat 190px 0; 
		background-size: 1400px auto;
	}
	
	.iframe {
		height: 800px; 
	}

	.carafaustoborder {
		width: 420px;
		height: 420px;
		top: -426px;
		left: 139px;
	}
	.carajorgeborder {
		width: 420px;
		height: 420px;
		top: -488px;
		left: 572px;
	}
	
	.carafaustoborder h2, .carajorgeborder h2 {
		font-size:20px;
	}



		
	#margen_superior {
		height: 482px;
	}
	.followHolder {
		top: -470px;
	}
}

@media all and (max-width: 1600px) {

	body {
		background: url(../images/bg_1200_larga.jpg) no-repeat 150px 0; 
		background-size: 1200px auto;
	}
	
	.iframe {
		height: 700px; 
	}
	
	.carafaustoborder {
		width: 370px;
		height: 370px;
		top: -378px;
		left: 53px;
	}
	.carajorgeborder {
		width: 370px;
		height: 370px;
		top: -429px;
		left: 433px;
	}
	
	.carafaustoborder h2, .carajorgeborder h2 {
		font-size:20px;
	}



		
	#margen_superior {
		height: 420px;
	}
	.followHolder {
		top: -420px;
	}
}

@media all and (max-width: 1400px) {
	body {
		background: url(../images/bg_1040_larga.jpg) no-repeat 130px 0; 
		background-size: 1040px auto;
	}
	
	.iframe {
		height: 600px; 
	}

	.carafaustoborder {
		width: 310px;
		height: 310px;
		top: -330px;
		left: 13px;
	}
	.carajorgeborder {
		width: 305px;
		height: 305px;
		top: -376px;
		left: 339px;
	}
	
	.carafaustoborder h2, .carajorgeborder h2 {
		font-size:20px;
	}


	#margen_superior {
		height: 370px;
	}
	.followHolder {
		top: -370px;
	}
}


@media all and (max-width: 1200px) {
	body {
		background: url(../images/bg_960_larga.jpg) no-repeat 100px 0; 
		background-size: 960px auto;
	}
	
	.iframe {
		height: 500px; 
	}
	
	.carafaustoborder {
		width: 290PX;
		height: 290px;
		top: -302px;
		left: -27px;
	}

	.carajorgeborder {
		width: 290PX;
		height: 290px;
		top: -340px;
		left: 269px;
	}

	
	.carafaustoborder h2, .carajorgeborder h2 {
		text-shadow: -1px 0 1px white, 0 1px 1px white, 1px 0 1px white, 0 -1px 1px white;
		font-size:20px;
	}

	
	.carafaustoborder h2, .carajorgeborder h2 {
		font-size:20px;
	}



	#margen_superior {
		height: 330px;
	}
	
	.followHolder {
		top: -330px;
	}


		/* 
	@-webkit-keyframes box_izq_animation {
	    0%   {
	    	left:250px;
			top:200px;
			height:400px; 
			width: 400px; 
		}
	    100% { 	
	    	left:450px;
			top:300px;
			height:100px; 
			width: 190px; 
		}
	
	@keyframes box_izq_animation {
	    0%   {}
	    100% { width: 200px; height: 200px;}
	}
	*/

	#box_izq{float:left; width: 100%;padding: 0 10% 60px 0; min-width: 250px;}
	#box_der{float:left; width: 100%; height: 100%;padding: 0 0 40px 0; min-width: 250px; text-align:center;}
}

@media all and (max-width: 1000px) {
	body {
		background: url(../images/bg_800_larga.jpg) no-repeat 166px 0; 
		background-size: 800px auto;
	}

	.iframe {
		height: 400px; 
	}

	.carafaustoborder {
		width: 240px;
		height: 240px;
		top: -262px;
		left: 9px;
	}

	.carajorgeborder {
		width: 240px;
		height: 240px;
		top: -304px;
		left: 256px;
	}
	
	.followHolder {
		width: 200px;
		right: 10px;
		margin-top: 0px;
		top: 0px;
		z-index: 98;
	}
	
	.followHolder a {
		margin-left : 30px;
	}


	
	#margen_superior {
		height: 290px;
	}
	
}

@media all and (max-width: 800px) {
	body {
		background: url(../images/bg_600_larga.jpg) no-repeat 70px 100px; 
		background-size: 600px auto;
	}
	
	#margen_superior {
		height: 200px;
	}
	
	
	.iframe {
		height: 350px; 
	}

	.carafausto, .carajorge {
		opacity:.95;
	}

	.carafaustoborder {
		width: 173px;
		height: 173px;
		top: -189px;
		left: 86px;
	}

	.carajorgeborder {
		width: 173px;
		height: 173px;
		top: -214px;
		left: 279px;
	}

	
	.carafaustoborder h2, .carajorgeborder h2 {
		font-size: 14px;
		margin-left: 20px;
		top: 0;
		margin-top: 0;
		padding-top: 2px;
	}

	header {
		width : 90px;
	}
	
	#content {
		top:100px;
		left: 92px;
		width: calc(100% - 94px);
	}
	.inner {
		padding: 5px 15px 5px 20px;
		position: relative;
	}

	#menu > li > a strong {position:relative;display:block;padding:0 2px 0 2px;}
	
	#menu > li > a { font-size:12px; line-height:34px; height:36px}
	
	footer p {
		font-size:10px;
	}

	footer small {
		font-size:9px;
	}

	footer {
		height:120px;
	}

	.main {	padding-bottom:120px;}

	html {
		overflow-x: hidden;
	}
}


@media all and (max-width: 500px) {
	body {
		background: url(../images/bg_300_larga.jpg) no-repeat 20px 60px; 
		background-size: 300px auto;
	}
	
	#margen_superior {
		height: 115px;
	}
	
	
	.iframe {
		height: 300px; 
	}

	.carafaustoborder {
		width: 87px;
		height: 87px;
		top: -106px;
		left: 54px;
	}

	.carajorgeborder {
		width: 86px;
		height: 86px;
		top: -117px;
		left: 161px;
	}

	
	.carafaustoborder h2, .carajorgeborder h2 {
		font-size: 10px;
		margin-left: 4px;
		top: 0;
		margin-top: 0;
		padding-top: 2px;
	}
	

	
	header {
		width : 90px;
	}
	
	#content {
		top:100px;
		left: 92px;
		width: calc(100% - 94px);
	}
	.inner {
		padding: 10px;
		position: relative;
	}

	#menu > li > a strong {position:relative;display:block;padding:0 2px 0 2px;}
	
	#menu > li > a { font-size:12px; line-height:34px; height:36px}
	
	footer p {
		font-size:10px;
	}

	footer small {
		font-size:9px;
	}

	footer {
		height:100px;
	}

	.main {	padding-bottom:120px;}

	html {
		overflow-x: hidden;
	}
	
	nav {
		display: none;
	}
	
	#logo {
		margin: auto;
	}
	
	header {
		width: 100%;
	}
	
	#content {
		left: 8px;
		position: relative;
		float: left;
		width: calc(100% - 13px);
		top: 45px;
		}
	
	.menubtn {
		display: block;
		position: fixed;
		left: 10px;
		top: 5px;
		color: white;
		background: #000000;
		background: url('../images/list.png'), -moz-linear-gradient(top, #000000 0%, #000000 1%, #999999 1%, #000000 41%, #000000 67%, #424242 99%, #000000 100%);
		background: url('../images/list.png'), -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-stop(1%,#000000), color-stop(1%,#999999), color-stop(41%,#000000), color-stop(67%,#000000), color-stop(99%,#424242), color-stop(100%,#000000));
		background: url('../images/list.png'), -webkit-linear-gradient(top, #000000 0%,#000000 1%,#999999 1%,#00000041%,#000000 67%,#424242 99%,#000000 100%);
		background: url('../images/list.png'), -o-linear-gradient(top, #000000 0%,#000000 1%,#999999 1%,#000000 41%,#000000 67%,#424242 99%,#000000 100%);
		background: url('../images/list.png'), -ms-linear-gradient(top, #000000 0%,#000000 1%,#999999 1%,#000000 41%,#000000 67%,#424242 99%,#000000 100%);
		background: url('../images/list.png'), linear-gradient(to bottom, #0000000%,#000000 1%,#999999 1%,#00000041%,#000000 67%,#424242 99%,#000000 100%);
		border: 1px solid gray;
		text-align: center;
		padding-top: 4px;
		z-index: 150;
		background-size: 21px 19px, 100% 100%;
		background-position: 8px 12px,center center, 0 0;
		background-repeat: no-repeat;
		color: transparent;
		height: 43px;
		width: 40px;
		border-radius: 10px;
	}
	#logo {
		position: fixed;
		z-index: 150;
		background-color: black;
		width: 100%;
		top: 0;
		background-size: 160px 40px;
		background-position: center center;
		height: 53px;	
	}
	nav {
		overflow:hidden;
		display: block;
		position: fixed;
		top: 45px;
		left:10px;
		width: 109px;
		font-size: 18px !important;
		z-index: 20;
		padding-left: 10px;
		background: black;
		max-height: 260px; /* approximate max height */
		transition-property: all;
		transition-duration: .5s;
		transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
	}
	
	nav.closed {
		max-height: 0px; /* approximate max height */
	}
	
	.linkcurriculum {
		opacity : 1;
	}
}

/*
#box_izq  {
	position: fixed;
	border: 1px solid white; 

    -webkit-animation-name: box_izq_animation;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;

    animation-name: box_izq_animation;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    
}
*/

#menu a, footer, h2, .button1, .date, .tabs .nav li a { font-family: ubuntu }


/* CSS3 calc() fallback */
#css3-calc {
    width: 10px;
    width: calc(10px + 10px);
    display: none;
}

.cookie-inner {
	background: rgba(20, 20, 20, 0.9); 
	position: fixed; 
	left: 0%; 
	bottom: 0; 
	color: #fff;  
	width: 100%; 
	z-index: 199; 
	font-size: 11px;  
	text-align: left; 
	padding: 1px 0;	
}

.cookie-button {
	background: white;
	margin: 0 10px; 
	color: #000; 
	width: 73px; 
	height: 24px; 
	float: right; 
	font-size: 12px; 
	font-weight: bold;
}