
@font-face {
    font-family: GillSansStd-Bold;
    src: url(../fonts/GillSansStd-Bold.otf);
}
@font-face {
    font-family: GillSansStd-Light;
    src: url(../fonts/GillSansStd-Light.otf);
}
@font-face {
    font-family: GillSansStd-Regular;
    src: url(../fonts/GillSansStd.otf);
}
@font-face {
    font-family: ITCAvantGardeStd-BoldCn;
    src: url(../fonts/ITCAvantGardeStd-BoldCn.otf);
}
html,body,.container,.container-fluid
{
    height:100%;
    font-family: GillSansStd-Regular;

	letter-spacing: .100em;
	font-size: 16px;
	line-height: 23px;
}

li a
{
    font-family: GillSansStd-Regular;

	letter-spacing: .100em;
	font-size: 13px;
	line-height: 23px;
}
.my-bold 
{ 
	font-family: GillSansStd-Bold ;
	letter-spacing: .100em;
	font-size: 19px;
	line-height: 23.13px;
} 
.my-light
{ 
	font-family: GillSansStd-Light ;
	letter-spacing: .100em;
}
.my-regular 
{ 
	font-family: GillSansStd-Regular ;
	letter-spacing: .100em;
	font-size: 16px;
	line-height: 23px;
}
.itc 
{ 
	font-family:  ITCAvantGardeStd-BoldCn;
	letter-spacing: .120em;
	font-size: 45px;
	line-height: 45px;
}
.itc-info
{ 
	font-family:  ITCAvantGardeStd-BoldCn;
	letter-spacing: .120em;
	font-size: 29px;
	line-height: 30px;
}

.img-center 
{
    display: block;
    margin-left: auto;
    margin-right: auto 
}


.big-top { margin-top: 8em;}
.medium-top { margin-top: 5em;}
.top { margin-top: 1.5em; }
.mini-top { margin-top: 1em; }
.no-top { margin-top: -10px } 


.white { color: white}
.navbar-inverse 
{
	background-color: rgba(37,37,37);
	border-color: transparent;
}


.btn-slide 
{
	background-color: rgb(230,60,47);
	border-color: rgb(230,60,47);
	border-radius: 0px;
	min-width: 80px;
	margin-left: 20px;
	margin-bottom: 10px;
}
.btn-slide:active:hover,.btn-slide:hover
{
	background-color: rgba(230,60,47,.8);
	border-color: rgba(230,60,47,.8);
}
.btn-contacto { border-radius: 0px}

.btn-slide:focus
{
	background-color: rgba(230,60,47,.8);
	border-color: rgba(230,60,47,.8);
}

.gray-solid { color: #949494}
.gray-bold-solid { color: #4D4D4D; font-weight: bold;}
.gray { color: rgba(255,255,255,.3);}
.gray-bold
{
	color: rgba(255,255,255,.5);
	font-weight: bold;
}


.separator-red 
{ 
	border-bottom: 2px solid #E63C2F;
	width: 50px;
}

.head { font-size: 20px;}

.recomendacion
{
	margin-right: 500px;
}

.red { color: #E63C2F !important;}

.bloque-3
{
	background-image: url(../img/bloques/bloque-3/background.png);
	background-size: cover;
	color: white;
	min-height: 100% !important;
	height: auto;
}

.img-bio { max-width: 100%;}

textarea { resize: none; }

@media (max-width: 768px) {
	.logo-b1 { margin-top: 8em;}
	.bloque-1
	{
		background-image: url(../img/bloques/1.png);
		background-size: cover;
		color: white;
		min-height: 100% !important;
		height: auto;
	}
	.bloque-2
	{
		background-image: url(../img/bloques/2.gif);
		background-size: cover;
		color: black;
	}
	.bloque-4
	{
		background-image: url(../img/bloques/bloque-4/background.png);
		background-size: cover;
		color: black;
	}
	.bloque-5
	{
		background-image: url(../img/bloques/bloque-5/background.png);
		background-size: cover;
		color: white;
	}
	.bloque-9
	{
		background-image: url(../img/footer/background.png);
		background-size: cover;
		color: black;
	}
	.top-sm { margin-top: 1.5em}
}
@media (min-width: 768px) and (max-width: 991px){
	.logo-b1 { margin-top: 20em;}
	.middle 
	{
	  position: relative;
	  top: 20%;
	  -webkit-transform: translateY(0%);
	  -ms-transform: translateY(0%);
	  transform: translateY(0%);
	}
	.bloque-1
	{
		background-image: url(../img/bloques/1.png);
		background-size: cover;
		color: white;
		min-height: 100% !important;
		height: auto;
	}

	.bloque-2
	{
		background-image: url(../img/bloques/2.gif);
		background-size: cover;
		color: black;
		min-height: 30% !important;
	}
	.bloque-4
	{
		background-image: url(../img/bloques/bloque-4/background.png);
		background-size: cover;
		color: black;
		min-height: 30% !important;
	}
	.bloque-5
	{
		background-image: url(../img/bloques/bloque-5/background.png);
		background-size: cover;
		color: white;
		min-height: 30% !important;
	}
	.bloque-9
	{
		background-image: url(../img/footer/background.png);
		background-size: cover;
		color: black;
		min-height: 30% !important;
	}
}
@media (min-width: 992px) and (max-width: 1199px) {
	.logo-b1 { margin-top: 10em;}
	.middle 
	{
	  position: relative;
	  top: 20%;
	  -webkit-transform: translateY(10%);
	  -ms-transform: translateY(10%);
	  transform: translateY(10%);
	}
	.bloque-1
	{
		background-image: url(../img/bloques/1.png);
		background-size: cover;
		color: white;
		min-height: 80% !important;
		height: auto;
	}
	.bloque-2
	{
		background-image: url(../img/bloques/2.gif);
		background-size: cover;
		color: black;
		min-height: 60% !important;
	}
	.bloque-4
	{
		background-image: url(../img/bloques/bloque-4/background.png);
		background-size: cover;
		color: black;
		min-height: 70% !important;
	}
	.bloque-5
	{
		background-image: url(../img/bloques/bloque-5/background.png);
		background-size: cover;
		color: white;
		min-height: 75% !important;
	}
	.bloque-9
	{
		background-image: url(../img/footer/background.png);
		background-size: cover;
		color: black;
		min-height: 60% !important;
	}
}

@media (min-width: 1200px) and (max-width: 1499px) {
	.logo-b1 { margin-top: 14em;}
	.bloque-1
	{
		background-image: url(../img/bloques/1.png);
		background-size: cover;
		color: white;
		height: 100% !important;
		
	}
	.middle 
	{
	  position: relative;
	  top: 60%;
	  -webkit-transform: translateY(3em);
	  -ms-transform: translateY(3em);
	  transform: translateY(3em);
	}
	.bloque-2
	{
		background-image: url(../img/bloques/2.gif);
		background-size: cover;
		color: white;
		min-height: 60% !important;
	}
	.bloque-4
	{
		background-image: url(../img/bloques/bloque-4/background.png);
		background-size: cover;
		color: black;
		min-height: 80%!important;
	}
	.bloque-5
	{
		background-image: url(../img/bloques/bloque-5/background.png);
		background-size: cover;
		color: black;
		min-height: 90%;
	}
	.bloque-9
	{
		background-image: url(../img/footer/background.png);
		background-size: cover;
		color: black;
		min-height: 60% !important;
	}
	.border-right { border-right: 2px solid white}
	.border-black { border-right: 2px solid black}
}

@media (min-width: 1500px) {
	.logo-b1 { margin-top: 22em;}
	.bloque-1
	{
		background-image: url(../img/bloques/1.png);
		background-size: cover;
		color: white;
		min-height: 100% !important;
		height: auto;
	}
	.middle 
	{
	  position: relative;
	  top: 60%;
	  -webkit-transform: translateY(3em);
	  -ms-transform: translateY(3em);
	  transform: translateY(3em);
	}
	.bloque-2
	{
		background-image: url(../img/bloques/2.gif);
		background-size: cover;
		color: white;
		min-height: 60% !important;
	}
	.bloque-4
	{
		background-image: url(../img/bloques/bloque-4/background.png);
		background-size: cover;
		color: black;
		min-height: 60% !important;
	}
	.bloque-5
	{
		background-image: url(../img/bloques/bloque-5/background.png);
		background-size: cover;
		color: black;
		min-height: 60% !important;
	}
	.bloque-9
	{
		background-image: url(../img/footer/background.png);
		background-size: cover;
		color: black;
		min-height: 60% !important;
	}
	.border-right { border-right: 2px solid white}
	.border-black { border-right: 2px solid black}
}

/* Removes the default 20px margin and creates some padding space for the indicators and controls */
.carousel {
    margin-bottom: 0;
	padding: 0 40px 30px 40px;
}
/* Reposition the controls slightly */
.carousel-control {
	left: -12px;
}
.carousel-control.right {
	right: -12px;
}
/* Changes the position of the indicators */
.carousel-indicators {
	right: 50%;
	top: auto;
	bottom: 0px;
	margin-right: -19px;
}
/* Changes the colour of the indicators */
.carousel-indicators li {
	background: #c0c0c0;
}
.carousel-indicators .active {
background: #333333;
}
.bx-pager-link { display: none !important;}
.bx-prev { display: none; }
.bx-next { display: none; }


.map-responsive iframe{
    width:100%;
    margin-bottom: -6px;
}

.bg-black
{
	background-image: url(../img/footer/footer-bottom.png);
	background-size: cover;
	color: white;
	min-height: 30px !important;
	height: auto;
}

#b1-text-2 { display: none }
#b2-text-2 { display: none }

#test { max-height: 60% } 



.modal-content
{
	border-radius: 0px;
	background-color: rgba(37,37,37,.97);
}

.modal-input
{
	color: white;
	border-radius: 0px;
	background-color: transparent;
	border: 2px solid rgba(255,255,255,.5);
}


.modal {
  text-align: center;
}

@media screen and (min-width: 768px) { 
  .modal:before {
    display: inline-block;
    vertical-align: middle;
    content: " ";
    height: 100%;
  }
}

.modal-dialog {
  display: inline-block;
  text-align: left;
  vertical-align: middle;
}

.invalid 
{
	border-color: red;	
	border-width: 1px;
}
.img-loading { max-width: 50px; }

.map 
{ 
	height: 70%;
	margin-right: -15px;
	margin-left: -15px; 
}

.back-to-top 
{ 
	color: white;
	background-color: rgba(37,37,37,.8);
	border: 1px solid rgba(255,255,255,.5);
	border-width: 1px;
	position: fixed;	 
	bottom: 10px;
	right: 10px;
	z-index: 100;
	text-decoration: none;
	border-radius: 0px;
}
.back-to-top:hover
{ 
	color: rgba(255,255,255,.5);
	background-color: rgba(37,37,37,.8);
	border: 1px solid rgba(255,255,255,.5);
	border-width: 1px;
	position: fixed;	 
	bottom: 10px;
	right: 10px;
	z-index: 100;
	text-decoration: none;
	border-radius: 0px;
}
.menu-active { color: white !important; }


.navbar-inverse { background-color: rgb(37,37,37)}
@media (min-width: 768px) {
.transparent { background-color: transparent; }
}

.navbar-collapse {margin-top: 15px;}

a:link { text-decoration:none;} 
.hover-red:hover { color: #E63C2F };

.slide { min-height: 100%}

.slider4 { margin-top: 0;}

#toInicio { cursor: pointer; }

#toDiferente { cursor: pointer;}

#toBio { cursor: pointer;}

#toComo { cursor: pointer;}

#toContacto { cursor: pointer;}

.mini-font { font-size: 10px;}

.footer-font { font-size: 13px; }

.toInicio { cursor: pointer; }

.bio-content div div strong { color: #E63C2F; }
.bio-content div p { color: white; }