/* Author: 
    Javier Romero

    Desarrollado por Barrabarra
    web: http://barrabarra.es
    email: javi@barrabarra.es
    Fecha: 2011
*/

body {
  margin: 0 auto;
  padding-top: 25px;
  background-color: #c3d6e7;
  overflow: hidden;
  overflow-y: scroll;
  text-align: justify;
}

body.embed, body.embed #main_content {
  margin: 0;
  padding: 0;
  width: 100%;
  background-color: #F7F8F9;
  overflow: auto;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'CenturyGothicRegular', arial, serif;
  -moz-text-shadow: #FFF 0 1px 0;
  -webkit-text-shadow: #FFF 0 1px 0;
  text-shadow: #FFF 0 1px 0;
}

hr {
  border-top: 0px;
  background-color: #999;
  border-bottom: 1px solid #FFF;
  width: 70%;
  margin: 2em auto;
}

ul {
  list-style-type: none;
}

a:active {
  color: #40189A;
}

.cb {
  clear: both; 
}

.right, .DER {
  float: right;
}

.left, .IZQ {
  float: left; 
}

img.right, img.DER {
  margin-left: 10px;
}

img.left, img.IZQ {
  margin-right: 10px; 
}

.text_center {
  text-align: center;   
}

.googlemap-map,
.google-map-container {
  height: 400px;
}

.orange {
  color: #40189A;
}

.rosa, a.rosa, a.rosa:visited {
  color: #D30042;   
}

.tropicopter {
/*   font-family: 'MistralRegular', arial, serif; */
  text-indent: -9999px;
  white-space: nowrap;
  overflow: hidden;
  background: url(../img/tropicopter_txt.png) no-repeat;
  display: inline-block;
  width: 96px;
  height: 22px;
  position: relative;
  top: -4px;
}

.book {
  text-decoration: none; 
}

#ribbon {
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 10;
}

.nubes-top {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 99%;
  overflow: hidden;
  z-index: 1;
}

#nube-lejos1, #nube-lejos2 {
  background: url(../img/bg-clouds-far.png) repeat-x;
  height: 250px;
}

#nube-lejos2 {
  top: 235px; 
  background-position: right top;
}

#nube-cerca, #nube-lejos3 {
  background: url(../img/bg-clouds-near.png) repeat-x;
  top: 450px;
  height: 250px;
}

body #container {
  position: relative; /* para aplicar z-index sobre nubes */
  z-index: 10;
  width: inherit;
/*   margin-bottom: -117px; */
}

#main_header {
  width: 100%;
  overflow: hidden;
}

#main_header #logo {
  float: left;
  margin: 0;
}

#main_header aside {
  float: right;
  width: 200px;
}

#main_header #llamanos {
  margin: 10px 0 20px 2px;
  font-family: arial, sans-serif;
  font-size: 33px;
  font-weight: bold;
  color: #40189A;
  -moz-text-shadow: #FFF 0 1px 0;
  -webkit-text-shadow: #FFF 0 1px 0;
  text-shadow: #FFF 0 1px 0;
}

#main_header #reserva_ya, #main_header #proximamente {
  text-decoration: none;
  font-family: 'Tinos', arial, serif;
  font-size: 26px;
  font-weight: bold;
  color: #FFF;
  text-shadow: #444 0 1px 0;
}

#main_header #proximamente {
  font-size: 16px;   
}

#main_header #reserva_ya div, #main_header #proximamente {
  text-align: center;
  height: 35px;
  line-height: 35px;
  width: 180px;
  padding: 0 10px;
  border-bottom: 1px solid #ECEAEA;
  background: -moz-linear-gradient(100% 100% 90deg, #E31F24, #D30042);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#D30042), to(#E31F24));
}

#main_header nav#menu {
  clear: both;
  height: 35px;
  margin-left: 2px;
}

nav#menu  li {
  float: left;
  width: 126px;
  min-width: 126px;
  text-align: center;
  background: -moz-linear-gradient(100% 100% 90deg, #F6F6F6, #FFFFFF);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#F6F6F6));
  border-bottom: 1px solid #ECEAEA;
  border-left: 1px solid #FFF;
  border-right: 1px solid #ECEAEA;
}

nav#menu > ul > li.haschild > a:after {
    content: " ▾";
}

nav#menu  li.selected {
  background: -moz-linear-gradient(100% 100% 90deg, #FFFFFF, #F6F6F6);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F6F6F6), to(#FFFFFF));
  border-bottom: 1px solid #40189A;
}

nav#menu  li.selected > a {
  background: url(../img/nav-selected.png) bottom center no-repeat;
}

.ie7 nav#menu  li.selected > a {
  background: url(../img/nav-selected.gif) bottom center no-repeat;
}

nav#menu  li:hover {
  box-shadow: #FFF 0 0 4px;
  -moz-box-shadow: #FFF 0 0 4px;
  -webkit-box-shadow: #FFF 0 0 4px;
  background: -moz-linear-gradient(100% 100% 90deg, #F8F8F8, #FFFFFF);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#F8F8F8));
}

nav#menu  li > ul {
  display: none;
  z-index: 20;
}

nav#menu  li > ul li, nav#menu  li:hover > ul li {
  width: auto;
  float: none; 
  padding: 0 4px;
  border-left: 1px solid #FFF;
  border-right: 1px solid #FFF;
  font-size: 12px;
  min-width: 151px;
}

nav#menu  li:hover > ul {
  display: block;
  position: absolute;
  margin-top: 1px;
  margin-left: -1px;
}

.ie7 nav#menu  li:hover > ul li {
  min-width: 170px;
  position: relative;
  top: 0px;
  left: -55px;
}

nav#menu  a, nav#menu  a:hover, nav#menu  a:visited {
  display: block;
  width: 100%;
  height: 34px;
  line-height: 34px;
  text-decoration: none;
  color: #444;
  text-shadow: #FFF 0 1px 0;
  font-weight: bold;
  font-size: 13px;
  white-space: nowrap;
  text-transform: uppercase;
}

nav#menu > ul > li:nth-child(5) {
  min-width: 240px;
}

nav#menu > ul > li:nth-child(1) > ul,
nav#menu > ul > li:nth-child(5) > ul {
  width: inherit;
  min-width: inherit;
}

nav#menu  a.ruta, nav#menu  a.ruta:hover, nav#menu  a.ruta:visited {
  color: #BB0A51;
}
/*nav#menu .ancestor li a {
  font-size: 10px;   
}*/

nav#menu li > ul li a, nav#menu li > ul li.selected a,
nav#menu li > ul li a:visited{
    color: #BB0A51;
}

nav#menu  a:active {
  color: #40189A;
  box-shadow: #40189A 0 0 3px;
  -moz-box-shadow: #40189A 0 0 3px;
  -webkit-box-shadow: #40189A 0 0 3px;
}

nav#menu ul ul ul {
/*   min-width: 200px; */
  width: auto;
/*   overflow: hidden; */
  position: relative;
  left: 99%;
  top: -1px;
}

nav#menu li > ul li, nav#menu li:hover > ul li {
  overflow: hidden;
}

nav#languages {
  text-align: right;   
  font-size: 11px;
}

nav#languages a {
  text-shadow: #FFF 0 1px 0;
  text-decoration: none;
}

nav#languages a:hover {
  text-decoration: underline;
}

#main_content {
  margin: 1em 0;
}

#main_footer {
  clear: both;
  position: relative;
  z-index: 10;
  height: 400px;
  margin: 0 -3000px;
  padding: 0 3000px;
  box-sizing: content-box;
  background: url(../img/bg-footer-sn.jpg) top center repeat-x;
  text-align: center;
}

#main_footer .links {
/*   padding-top: 170px; */
}

#main_footer a {
  color: #000;
  padding: 0 10px;
}

/** Portada **/

#main_text {
    margin: 40px 0;
    padding: 0px;
    overflow: auto;
    width: 648px;
}

#welcome h3, #experience h4, #services h4, #news h4 {
    text-align: center;
}

#welcome p {
    font-size: 14px;
    line-height: 2em;
}

#experience, #services {
    float: left;
    margin: 0;
    width: 300px;
}

#services {
    float: right;
    text-align: right;
}

#news {
    clear: both; 
    width: 100%;
    padding-top: 2em;
    text-align: center;
}

/** Páginas generales **/

#page_content {
  background-color: rgba(250,250,250,.8);
  padding: 20px;
  min-height: 450px;
} 

#page_content img {
  border: 5px solid white;
  width: 290px;
}

#page_content .pie img {
  width: 600px;
}

#page_content ul {
  list-style-type: disc;
  margin-left: 20px;
}

#page_content p {
  margin-bottom: 1em; 
}

/** Listado rutas **/

.listado_ruta {
  width: 100%;
  overflow: hidden;
}

.listado_ruta a {
  text-decoration: none;
  color: #444;
}

.listado_ruta .caption {
  margin: -10px 0 10px 0;
  background-color: #FFF;
  padding: 5px 10px;
}

.listado_ruta .details {
  float: left; 
}

.listado_ruta .book {
  display: block;
  float: right;
}

#page_content .listado_ruta img {
  width: auto;
}
    
    
/** Detalle ruta **/

.detalle_ruta #route_head {
  margin-bottom: 1em; 
}

.detalle_ruta #route_head h3, 
#page_content.cms-page h3 {
  color: #BB0A51;
}

#page_content .detalle_ruta #route_head ul.details {
  list-style-type: none;
  margin: 1em 0 0 0;
}
.detalle_ruta #route_head ul.details li .taxes {
  font-size: 9px;
  position: relative;
  top: -10px;
}

.detalle_ruta #route_head ul.details li {
  float: left;
  margin-right: 20px;
}
.detalle_ruta #route_head .book {
  clear: left;
}
.detalle_ruta header .book {
  float: right;
}

.detalle_ruta #route_head #share-header {
  clear: left;
  padding-top: 5px;
  height: 25px;
}

.detalle_ruta, .detalle_ruta #route_head, .detalle_ruta .description, .detalle_ruta .gallery {
  width: 100%;
  overflow: hidden;
}

/*.detalle_ruta .description .text {
  min-height: 280px;   
}*/

/*.detalle_ruta .description .text > p {
  padding-bottom: 1.5em;
}*/

.detalle_ruta #map {
  width: 600px;
  height: 400px;
}

.detalle_ruta .gallery img {
  margin: 4px 4px 0 0;
}

.detalle_ruta .gallery a {
  text-decoration: none;
}

.detalle_ruta .gallery a .pie {
  text-align: center;
  margin: -8px 0 0 0;
  padding: 0 5px;
  background: #FFF;
}

.detalle_ruta section header {
  width: 100%;
  overflow: hidden;
}

.detalle_ruta section header h4 {
  margin-top: 5px; 
}

/** Listado Noticias **/

.noticia {
  width: 100%;
  overflow: hidden;
}

.noticia .external_link {
  float: right;
}

.listado_noticias .pagination {
  clear: both;
  text-align: right;
  margin-top: 2em;
}

/** Contacto **/

.form input.input_text, .form textarea.input_text {
  position: relative;
  z-index: 1;
  padding-left: 4px;
  font-size: 16px;
}

.form label {
  display: block;
  width: 160px;
  position: relative;
  z-index: 2;
  padding-left: 5px;
  font-weight: normal;
  opacity: 0.75;
  -webkit-transition: opacity 0.15s linear;
}

.form label + input.input_text {
  margin-top: -51px;
}

.form label + textarea.input_text {
  margin-top: -28px;
}

.form #uniform-id_accepted_conditions {
  margin-right: 0px; 
}

.form .text_label {
  width: 310px;
}

label.focus { opacity: 0.35; }
label.has-text { opacity: 0.0; -webkit-transition-duration: 0s; }

/* FIXME no se queda al final de la página, sino al final de la ventana */
/*#main_footer {
  position: absolute;
  left: 0px;
  bottom: 0px;
  height: 170px;
  width: 100%;
  background: url(../img/bg-footer.png) repeat-x;
}*/

/*	13-column layout
	60 px columns, 24 px gutters, 72 px margins, 1212 px total (extra space for scrollbars)
	---------------------------------------------------------------------------------------
	1     2      3      4      5      6      7      8      9      10     11     12     13
	60px  144px  228px  312px  396px  480px  564px  648px  732px  816px  900px  984px  1068px	*/

@media only screen and (min-width: 1212px) {
    
        #main_header nav#menu {
/*           margin-left: 0px; */
        }
        
	nav#menu  li {
          float: left;
          width: 118px;
          min-width: 118px;
        }

        nav#menu > ul > li:nth-child(5) {
          min-width: 220px;
        }
        nav#menu  li > ul li, nav#menu  li:hover > ul li {
          min-width: 110px;
        }
        
	#main_text {
	  padding: 30px;
	  width: 1008px;
	}
	
	#experience, #services, #news {
	  width: 315px;
	  margin-right: 30px;
	  float: left;
          text-align: left;
	}
	
	#news {
	  clear: none;
	  margin-right: 0px;
	  padding-top: 0px;
	}
	
	#page_content img {
	  width: 330px;
        }
        
	#page_content .pie img {
          width: auto;
        }
        
        #page_content .column {
          width: 485px;   
        }
	
	/* listados rutas */
	.listado_ruta .caption {
	  display: block;
	  width: 380px;
	  float: right;
	  position: relative;
	  bottom: auto;
	  margin: 0;
	}
	
	.listado_ruta .details {
	  float: left;
	  position: relative;
	  left: 630px;
	  bottom: 75px;
	}
	.listado_ruta .book {
	  margin-top: -62px;
	}
	
	.detalle_ruta .description {
	  float: left;
	}
	
	.detalle_ruta .removable, .detalle_ruta .gallery .book {
	  visibility: hidden;
	  display: none;
	}
	
	#page_content .detalle_ruta .gallery img {
          width: 500px;
        }
        
        #page_content .detalle_ruta .gallery .pie {
          width: 500px;
        }
	
/*	.detalle_ruta .gallery {
	  width: 320px;
	  float: right;
	  margin-bottom: 2em;
	}*/
	
	.detalle_ruta .video {
	  float: left; 
	}
	
	#page_content .detalle_ruta .video iframe, #page_content .detalle_ruta .route #map {
	  width: 500px;
	  height: 310px;
	}
	
	.detalle_ruta .route {
	  float: right; 
	}
}


/*	5-column layout
	60 px columns, 24 px gutters, 42 px margins, 480 px total
	---------------------------------------------------------
	1     2      3      4      5
	60px  144px  228px  312px  396px	*/

@media only screen and (max-width: 767px) and (min-width: 480px) {
	
	#main_header #logo {
	  margin-bottom: .5em;
	}
    
	#main_header #logo img { 
	  width: 100%;
	  max-width: 396px; /* dividir entre 3.666667 para el alto */
	  height: auto;
	}
	
	#main_header aside {
	  width: 100%;
	  overflow: hidden;
	}
	
	#main_header #llamanos {
	  margin-top: 4px;
	  float: left;
	}
	
	#main_header #reserva_ya, #main_header #proximamente {
	  float: right; 
	}
	
	#main_header nav li {
	  width: 100%;
	}
	
	#main_header nav li:hover > ul {
	  display: none;
	}
  
	#main_content {
	  margin-top: 1em; 
	}
	#main_text {
	  width: 100%; 
	  box-sizing: border-box;
	}
        #page_content {
          min-height: 0;
        }

	#experience, #services, #news {
	  float: none;
	  width: 100%;
	  margin: 0 auto 1em auto;
	  padding-top: 0px;
          text-align: center;
	}
	
	#page_content img {
	  width: 100%;
	  max-width: 346px;
	  height: auto;
	}
	
	.detalle_ruta #route_head ul.details li {
	  float: none;
	  margin-right: 0px;
	}
	
	.detalle_ruta .video iframe {
	  width: 100%;
	  max-width: 356px;
	}
	
	.detalle_ruta .route #map {
	  width: 100%;
	  max-width: 356px;
	}
	
	.contact textarea.input_text {
	  width: 100%;
	  box-sizing: border-box;
	  height: 150px;
	}
}


/*	3-column layout
	60 px columns, 24 px gutters, 46 px margins, 320 px total
	---------------------------------------------------------
	1     2      3
	60px  144px  228px	*/

@media only screen and (max-width: 479px) {
	
	#main_header #logo {
	  margin-bottom: .5em;
	}
	
	#main_header #logo img { 
	  width: 100%;
	  max-width: 228px; /* dividir entre 3.666667 para el alto */
	  height: auto;
	}
  
	#main_header aside {
	  float: none;
	  margin: 10px auto;
	}
	
	#main_header #llamanos {
	  margin-top: 0px; 
	}
	
	#main_header nav li {
	  width: 100%;
	}
	
	#main_header nav li:hover > ul {
	  display: none;
	}
  
	#main_content {
	  margin-top: 1em; 
	}
  
	#main_text {
	  width: 100%;
	  box-sizing: border-box;
	}
	
        #page_content {
          min-height: 0;
        }
        
	#page_content img {
	  border: 2px solid white; 
	  width: 100%;
	  max-width: 185px;
	  height: auto;
	}
	
	#experience, #services, #news {
	  float: none;
	  width: 100%;
	  margin: 0 auto 1em auto;
	  padding-top: 0px;
          text-align: center;
	}
	
	.listado_ruta a:hover .caption {
	  display: none;
	}
	
	.detalle_ruta header .book {
	  clear: left;
	  float: none;
	  display: block;
	  padding: 10px 0;
	  margin-left: 45px;
	}
	
	.detalle_ruta #route_head #share-header {
	  height: 50px;
	  margin-left: 40px;
	}
	
	.detalle_ruta .video iframe {
	  width: 100%;
	  max-width: 188px;
	}
	
	.detalle_ruta .route #map {
	  width: 100%;
	  max-width: 188px;
	}
	
	.contact .input_text {
	  width: 100%;
	  box-sizing: border-box;
	}
	
	.contact textarea.input_text {
	  height: 95px; 
	}
	
	.contact .text_label {
	  width: 100%; 
	}
}


/*	Overrides for iPhone 4 
	and other high device-pixel-ratio devices
	-----------------------------------------	*/

@media 
	only screen and (-webkit-min-device-pixel-ratio: 2),
	only screen and (min-device-pixel-ratio: 2) {
	
}


.ie6 body, .ie7 body {
    overflow: hidden;
}

.ie6 #reserva_ya div, .ie7 #reserva_ya div, .ie8 #reserva_ya div, .ie9 #reserva_ya div,
.ie6 #proximamente, .ie7 #proximamente, .ie8 #proximamente, .ie8 #proximamente {
    background: url(../img/bg_reserva.gif) repeat-x;   
}

.ie6 #main_header nav li, .ie7 #main_header nav li, .ie8 #main_header nav li, .ie9 #main_header nav li {
    background: url(../img/bg_nav.gif) repeat-x;
}

.ie6 #main_header nav li a:hover {
    color: #333;
}

.ie6 #main_header nav li.selected, .ie7 #main_header nav li.selected, .ie8 #main_header nav li.selected, .ie9 #main_header nav li.selected {
    background: url(../img/bg_nav_selected.gif) repeat-x;
}

.ie6 #main_header nav li ul,
.ie6 #main_header nav li li {
    visibility: hidden;
    display: none;
}


.ie6 #page_content, .ie7 #page_content, .ie8 #page_content {
  background-color: #F7F7F7;
}

.ie6 #main_footer, .ie7 #main_footer {
    margin: 0;
    text-align: center;
    height: 200px;
    background: url(../img/bg-footer-sn-ie.png) center bottom repeat-x;
}

.ie6 .form label + input.input_text {
    margin-top: 0px;
}

.ie6 .form label + textarea.input_text {
    margin-top: 0px;
}