@charset "UTF-8";
/* CSS Document */


body{

/* 	color: #e1f2ff; */
	color: #fff;
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
   font-weight: 300;
	
}

html{

}

body,html{
	background-color: black;
	height: 100%;
}

h1, h2, h3, h4{
	font-family:  'splendid_plan_9regular', "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
	margin: 0;
}


a:link    {color:#2C99B6; text-decoration: none; font-weight: bold;}
a:visited {color:#2C99B6;}
a:hover   {color:#115F73;font-weight: bold;}
a:active  {color:#115F73;}

@font-face {
    font-family: 'splendid_plan_9regular';
    src: url('splendid_plan_9_regular-webfont.eot');
    src: url('splendid_plan_9_regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('splendid_plan_9_regular-webfont.woff2') format('woff2'),
         url('splendid_plan_9_regular-webfont.woff') format('woff'),
         url('splendid_plan_9_regular-webfont.ttf') format('truetype'),
         url('splendid_plan_9_regular-webfont.svg#splendid_plan_9regular') format('svg');
    font-weight: normal;
    font-style: normal;

}

.boldFont{
	font-weight: bold;
}

.live_transmission{
	color: #f8feff;
    text-transform: uppercase;
    text-align: center;
    margin: 30px 5px;
    font-family: 'splendid_plan_9regular';
    font-size: 20px;
    cursor: pointer;
    letter-spacing: 1px;
    display: inline-block;
    padding: 10px 15px;
    border: 1px solid #0EF9FB;
}

.live_transmission:hover{
	color: #9cf0ff
}


.cool-border{
	border: 1px solid #20434A;
	padding: 15px;
	background-color: rgba(4, 32, 37, 0.8);
}


textarea {
	resize:vertical;
}

#leftWall{
	position: absolute;
	left: -130px;
	top: 0;
	height: 100%;
	width: 300px;
	background-image: url("../img/leftWall.png");
	background-repeat: repeat-y;
	z-index: 0;
	pointer-events: none;
	background-position: 0 0;
}


#rightWall{
	position: absolute;
	right:0px;
	top: 0;
	height: 100%;
	width: 300px;
	background-image: url("../img/rightWall.png");
	background-repeat: repeat-y;
	z-index: 0;
	pointer-events: none;
	background-position: 0 0;
}

#blackScreen{
	position: fixed;
	z-index:9;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.5);
	display: none;
}


/*

#rocks{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 7300px;
	overflow: hidden;
	z-index: 0;
}

#leftRocks{
	position: absolute;
	left: 50px;
	top: 0;
	height: 7300px;
	width: 127px;
	background-image: url("../img/leftRocks.png");
	background-repeat: repeat-y;
	z-index: 10;
}


#rightRocks{
	position: absolute;
	right:25px;
	top: 0;
	height: 7300px;
	width: 114px;
	background-image: url("../img/rightRocks.png");
	background-repeat: repeat-y;
	z-index: 10;
}


#leftWall2{
	position: absolute;
	left: 60px;
	top: 0;
	height: 7300px;
	width: 218px;
	background-image: url("../img/leftWall2.png");
	background-repeat: repeat-y;
	background-position: 0 -2700px;

}


#rightWall2{
	position: absolute;
	right:70px;
	top: 0;
	height: 7300px;
	width: 114px;
	background-image: url("../img/rightWall2.png");
	background-repeat: repeat-y;
	
}
*/


#emitter-canvas{
	position: fixed;
	left: 50%;
	top: 0;
	z-index: 0;
	margin-left: -400px;
}


.wrapper{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: table;
	z-index: 10;
	margin-top: 0px;
	min-height: 700px;
}

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



.container{
	z-index: 9;
	position: relative;
}

.space{
	height: 70px;
}

.footer{
	z-index: 10;
}


.imgLeft{
	padding-left: 120px;

}

.infoBox{
	padding: 10px;
	font-size: 12px;
	background-image: url("../img/info_bg.png");
	text-align: justify;
	letter-spacing: 1px;
}

.titleBox{
	font-family: splendid_plan_9regular, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
	background-color: #2C99B6;
	color: #fff;
	font-size: 15px;
	text-transform: uppercase;
	display: inline-block;
	padding: 5px;
	letter-spacing: 1px;
}

.blue_bg{
	font-family: splendid_plan_9regular, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
	background-color: #2C99B6;
	color: #fff;
	display: inline-block;
	padding: 5px;
	letter-spacing: 1px;
}

#concursoTitle{
	font-family: splendid_plan_9regular, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
	color: #fff;
	font-size: 25px;
	line-height: 25px;
	text-transform: uppercase;
	letter-spacing: 1px;
	text-align: center;
	margin-bottom: 20px;
	margin-top: 10px;
	background-color: #2C99B6;
	padding: 5px 10px;
	display: inline-block;
	
}


.centerText{
	text-align: center;
}

.centerTitle{
	text-align: center;
}

.font25{
	font-size: 20px !important;
	line-height: 40px;
	display: inline;
}

.list-number{
	list-style:decimal;
}


.imageSpace{
	height: 0px;
}


/* HEADER */

#header{
	position: fixed;
	width: 100%;
	height: 55px;	
	z-index: 50;
	background-color: #000;
	top: 0;
	left:0;
}



#instituciones{
	position: relative;
	top: 10px;
}

#logoHeader{
	position: absolute;
	left: 10px;
	top: 10px;
}

#logoHeader img{
	height: 25px;
}

/* MENU */

.borderTop{
	padding-top: 10px;
}

#menu_btn{
	position: fixed;
	left: 10px;
	top: 50%;
	margin-top: -30px;
	cursor: pointer;
	width: 40px;
	height: 35px;
/* 	color: #2C99B6; */
	color: #fff;
	font-size: 13px;
	z-index: 11;
	
	
}
#menu_btn img{
	width: 100%;
	height: 100%;
}


#menu{
	position: fixed;
	width: 200px;
	height: 100%;
	background-color: #2C99B6;
	left: -200px;
	z-index: 51;
	font-size: 10px;
	box-shadow: 0px 0px 15px #000;
}

#menu ul{
	position: absolute;
	top: 50%;
	
	list-style: none;
	margin: 0;
	padding: 0;
	margin-top: -150px;
	margin-left: 15px;
}

#menu ul li{
	margin-bottom: 10px;
}

#menu ul li img{
	margin-right: 10px;	
}


#menu a:link    {color:#fff; text-decoration: none;font-weight: normal;}
#menu a:visited {color:#fff;}
#menu a:hover   {color:#d5b2bf;}
#menu a:active  {color:#fff;}


#menu i{
	font-size: 16px !important;
	margin: 0 5px;
}

.container>.navbar-header {

  background-color: #2C99B6;
  color: #fff;
}
.navbar-default .navbar-brand:focus, .navbar-default .navbar-brand:hover {
  color: #c7c7c7;
  background-color: transparent;
}


.navbar-default .navbar-brand {
  color: #fff;
}

.navbar-default .navbar-collapse, .navbar-default .navbar-form {
  background-color: #2C99B6;
}

.navbar-default .navbar-nav>li>a {
  color: #fff;
  font-weight: normal;
}




.navbar-default .navbar-nav>li>a>img{
	margin-right: 10px;
	height: 15px;
}


.patrocinadores_logos{
	text-align: center;
	margin-top: 10px;
	margin-bottom: 10px;
}
.patrocinadores_logos img{
	margin-left: 5px;
	margin-right: 5px;
	margin-bottom: 5px;
	max-height: 45px;
}	

/* HOME */
 #esa_logo{
	 max-width: 450px;
	 margin-bottom: 10px;
 }
#homeTable{
	width: 80%;
	margin: 0 auto;
	margin-bottom: 20px;
}

#homeTable td{
	width: 33.33%;
	text-align: center;
	cursor: pointer;
}

#homeTable .titleBox{
	padding: 10px 15px;
	
}

#homeTable a:hover{
	opacity: 0.8;
}

#homeTable .titleBox{
	padding: 10px 15px;
}

#patrocinadores_home{
	margin-bottom: 30px;
}



/* CONVOCATORIA */
#table-prices, #table-prices th, #table-prices td{
	border: 1px solid #2D2D2D;
	text-align: left;
}

#table-prices th{
	background-color: #2C99B6;
	
}

#table-prices td,th{
	width: 25%;
	padding: 5px;
}

#table-prices td{
	height: 55px;
}



/* REGISTRATE */
#registroTable{
	width: 100%;
	margin: 0 auto;
	margin-bottom: 20px;
}

#registroTable h3{
	margin-top: 30px; 
	cursor: pointer;
}

#registroTable td{
	width: 33.33%;
	text-align: center;
	cursor: pointer;
	height: 50px;
}

#registroTable .titleBox{
	padding: 10px 15px;
	
}

#registroTable td:hover{
	opacity: 0.8;
}

.registroTableTitle{
	font-family: splendid_plan_9regular, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
	color: #fff;
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: 1px;
}


.block_relative {
       position: relative;
}
.regresar_btn {
       cursor: pointer;
       position: absolute;
       right: 0;
       bottom: 10px;
       line-height: 16px;
}

.regresar_btn:hover{
	opacity: 0.8;
}



.form-registrate {
	display: none;
	opacity: 0;
	text-align: left;
}
.form-registrate form{
	padding-top: 50px;
}

.form-registrate .titleBox{
	margin-top: 50px;
}

.form-registrate .div-center {
	text-align: center;
}

.validateSize.error-input{
	border: 2px solid #F90000;
	animation: blinker 0.3s linear 10;
	outline: none;
}

.form-registrate .error,
.form-registrate .error-captcha {
	border: 2px solid #F90000;
	animation: blinker 0.3s linear 10;
}

@keyframes blinker {  
  100% { border:2px solid #000 }
}

input[type="file"]{
	margin-top: 10px;
}



.form_empresas_title{
	text-align: center;
}

.form_field{
	margin-bottom: 10px;
}


input[type=text], input[type=textarea], input[type=password], input[type=email], input[type=number], input[type=date], select, textarea {
  width: 100%;
  display: inline-block;
  padding: 4px;
  color: #fff !important;
  background: #383838;
  border: 1px solid #383838;
  outline: none;
}

.submit_btn{
	font-family: splendid_plan_9regular, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
	background-color: #2C99B6;
	color: #fff;
	font-size: 15px;
	text-transform: uppercase;
	display: inline-block;
	padding: 5px;
	letter-spacing: 1px;
	border: none;
	width: 60%;
	display: none;
	opacity: 0;
}

.submit_btn:hover{
	background-color: #115F73;
}

.form-registrate .each_captcha {
	display: inline-block;
}
.form-registrate .each_captcha .last_captcha {
	display: inline-block !important;
    width: 80px !important;
    text-align: center;
    vertical-align: middle;
}
.form-registrate .each_captcha .content_captcha {
	display: inline-block;
    width: 90px;
	vertical-align: middle;
}
.form-registrate .each_captcha .refresh_captcha {
	cursor: pointer;
}

/* Edicion 2015 */

#edicion2015 ul{
	list-style-type: decimal;
}


/* FOOTER */

#patrocinadores{
	position: absolute;
	right: 30px;
	bottom: 10px;
}

#patrocinadores img{
	height: 35px;
	margin-left: 10px;
}

#footerHome {
  position: fixed;
  bottom: 0;
  height: 192px;
  width: 100%;
  z-index: 8;
}

.footer .container-fluid{
	padding: 0 !important;
	margin: 0;
}

#avisoPrivacidadFoot{
	width: 100%;
	text-align: center;
	position: absolute;
	bottom: 5px;
	text-transform: uppercase;
	font-size: 11px;
}


.jumbotron p {
  margin-bottom: 15px;
  font-size: 15px;
  font-weight: normal;
}





/* MODAL */



.modal {
	background-color: rgba(2, 21, 31, 0.7);
}

.modal-header {
    min-height: 16.43px;
    padding: 15px;
    border-bottom: 0;
}

.modal-content {
    position: relative;
    background-color: rgba(8, 141, 165, 0.4);
    border: 1px solid #0EF9FB;
    border-radius: 0px;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0,0,0,.5);
    box-shadow: 0 3px 9px rgba(0,0,0,.5);
    color: white;
    letter-spacing: 1px;
}
.modal-footer {
    border-top: 0;
}

.close {
    line-height: 1;
    color: #fff;;
    text-shadow: 0 1px 0 #000;
    filter: alpha(opacity=100);
    opacity: 1;
    font-size: 2em;
}

.modal-header .close {
    margin-top: -12px;
}

.vertical-alignment-helper {
    display:table;
    height: 100%;
    width: 100%;
    pointer-events:none; /* This makes sure that we can still click outside of the modal to close it */
}
.vertical-align-center {
    /* To center vertically */
    display: table-cell;
    vertical-align: middle;
    pointer-events:none;
}
.modal-content {
    /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
    width:inherit;
    height:inherit;
    /* To center horizontally */
    margin: 0 auto;
    pointer-events: all;
}

.modal a{
	color: #00fbff;
	text-decoration: none;
}
.modal a:hover{
	color: #15d4d6;
}

.modal h2{
	margin-bottom: 10px;
}






.blink {
    -webkit-animation: blink .75s linear infinite;
    -moz-animation: blink .75s linear infinite;
    -ms-animation: blink .75s linear infinite;
    -o-animation: blink .75s linear infinite;
    animation: blink .75s linear infinite;
}

@-webkit-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}

@-moz-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}

@-ms-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}

@-o-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}

@keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}






/*SLIDERS */

.bx-wrapper .bx-viewport{
	background: initial;
	-webkit-box-shadow: none;
	box-shadow: none;
}

#slider{
	margin-top: 25px;
	max-width: 275px;
}

#big_slider{
	margin-top: 15px;	
}

.bx-wrapper .bx-pager.bx-default-pager a:hover{
	background: #2C99B6;
}

.bx-wrapper .bx-pager.bx-default-pager a.active {
	background: #2C99B6;
}

.bx-wrapper .bx-viewport {
	border: none;
}

.bx-viewport li img, #winner_video{
	border: 3px solid #2C99B6;
}

#winner_video{
	margin-top: 25px;

}


/* POPUP */

#popup_signin h3{
	margin-top: 40px;
	margin-bottom: 10px;
}




@media (max-width: 1199px){
	.imgLeft{
		padding-left: 90px;
	
	}
}

@media (max-width: 992px){
	.imgLeft{
		padding-left: 0px;
	}
	#popup_signin h3{
		margin-top: 0px;
	}

}


@media (max-width: 767px){
	
	#header{
		top: 0px;
		position: absolute;
		height: 35px;
		z-index: 10;
		
		position: relative;
		margin-top: 50px;
		background-color: transparent;
	}
	
	.wrapper{
		top: 30px;
	}
	
	.patrocinadores_logos img{
		max-height: 40px;
	}
	
	.space{
		height: 100px;
	}
	
	
	#instituciones img{
		width: 100%;
	}
	
	#homeTable td img{
		height: 30px;
	}
	
	
	#concursoTitle{
		
		font-size: 25px;
		line-height: 25px;
	
		margin-bottom: 20px;
		margin-top: 10px;
		background-color: #2C99B6;
		padding: 10px;
		
	}

	.wall{
		opacity: 0.5;
	}
	
	#blackScreen{
		
		display: block;
	}
	
	h2{
		font-size: 26px;
	}
	h3{
		font-size: 20px;
	}
	
	#popupMessage .modal-dialog  {width:95%;}
	
	.titleBox{
		display: block;
	}
	
}


@media (max-width: 500px){
	#home_esa_logo{
		max-width: 200px;
		margin-bottom: 20px;
	}
}




@media (max-height: 800px){
 .footer{
	 height: 150px !important;
	 background-image: url("../img/floor_small.png") !important;
 }
}




/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}
body {
  /* Margin bottom by footer height */
  margin-bottom: 180px;
}
.footer {
  position: fixed;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 239px;

  background-image: url("../img/floor.png");
  background-position: 0px 0px;
  background-repeat: repeat-x;
}


/* CENTER HOME VERTICALLY
-------------------------------------------------- */
.jumbotron.vertical-center {
  margin-bottom: 0px; /* Remove the default bottom margin of .jumbotron */
  background-color: black;
  margin-top: 0px;
}

.vertical-center {
  min-height: 100%;  /* Fallback for vh unit */
  min-height: 100vh; /* You might also want to use
                        'height' property instead.
                        
                        Note that for percentage values of
                        'height' or 'min-height' properties,
                        the 'height' of the parent element
                        should be specified explicitly.
  
                        In this case the parent of '.vertical-center'
                        is the <body> element */

  /* Make it a flex container */
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex; 
  
  /* Align the bootstrap's container vertically */
    -webkit-box-align : center;
  -webkit-align-items : center;
       -moz-box-align : center;
       -ms-flex-align : center;
          align-items : center;
  
  /* In legacy web browsers such as Firefox 9
     we need to specify the width of the flex container */
  width: 100%;
  
  /* Also 'margin: 0 auto' doesn't have any effect on flex items in such web browsers
     hence the bootstrap's container won't be aligned to the center anymore.
  
     Therefore, we should use the following declarations to get it centered again */
         -webkit-box-pack : center;
            -moz-box-pack : center;
            -ms-flex-pack : center;
  -webkit-justify-content : center;
          justify-content : center;
}