/*
Theme Name: hotelmanutara
Version: 1.0
Description: A child theme of Silvia
Template: silvia
*/

@import url("../silvia/style.css");
@import url(https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700,300italic);
@import url(https://fonts.googleapis.com/css?family=Shadows+Into+Light);

body, p, h1, h2, h3, h4, h5, a, ul, ol, li {
		font-family: 'Open Sans Condensed', sans-serif;
		color:#333;
}
.home p, .entry-content p {
    margin: 0 0 1em;
    font-size: 1.1em;
}
.home .seccion-principal p {
	width: 60%;
	display: inline-block;
	vertical-align: middle;
	margin: 0.5em 2em;
	text-align: left;
}
.home .seccion-principal img {
	display: inline-block;
	vertical-align: middle;
	margin: 0.5em 2em;
	width: 20%;
}
.entry-content h4 {
	    color:rgb(225, 156, 65);
}
body, .site {
	position: absolute;
	top: 0px;
	width: 100%;
	font-size: 16px; 
	color:#333;
}
.hentry {
    margin-bottom: 7em;
}
.alignright {
	margin-bottom: 1.5em;
}
/* HEADER */
.site-header {
    background: rgba(0,0,0,0.7);
	background: -moz-linear-gradient(top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.7) 50%, rgba(0,0,0,0) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0.7)), color-stop(50%, rgba(0,0,0,0.7)), color-stop(100%, rgba(0,0,0,0)));
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.7) 50%, rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.7) 50%, rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.7) 50%, rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.7) 50%, rgba(0,0,0,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );
    position: absolute;
    z-index: 999;
    width: 100%;
    padding-bottom: 0px;
    min-height: 130px;
}
.logo-manutara {
	float: left;
	max-width: 1220px;
	padding: 2em 2em 0em;
	position: relative;
	z-index: 999999;
}
@media screen and (min-width: 769px) {
	.logo-manutara {
		float: left;
	    max-width: 1220px;
	    padding: 5em 2em 4em;
	    position: relative;
	    z-index: -1;
	    background: #19380E;
	    margin-left: 5%;
	    border-radius: 0px 0px 50% 50%;
	    border: 1px dashed #fff;
	}
}
@media screen and (max-width:818px) {
	.home .seccion-principal p {
		width: 100%;
		vertical-align: initial;
		margin: 2em 0px;
		text-align: center;
	}
	.home .seccion-principal img {
		vertical-align: initial;
		margin: 2em auto;
		width: 60%;
	}
}
@media screen and (max-width:767px) {
	.logo-manutara {
		float: none;
		padding: 2em;
		text-align: center;
	}
}
@media screen and (max-width:480px) {
	.home .seccion-principal img {
		width: 80%;
	}
}
/* SLIDER */ 
.rslides_container {
	margin-bottom: 0px;
}
.rslides_tabs {
    margin-top: -40px;
    text-align: center;
    position: relative;
    z-index: 999999999;
}
.rslides_tabs a {
	background: rgba(255, 255, 255, 0.5);
}
.rslides_here a {
    background: rgba(255, 255, 255, 0.8);
}
.flowers {
    clear: both;
    position: fixed;
    bottom: -30px;
    width: 100%;
    height: 100px;
    background: url(img/separador.png);
    z-index: 9999999;
}
.img-page-interiores {
	width: 100%;
    margin-bottom: 3em;
}

/* MENU */
.top-bar {
	background: #000;
	color:#fff;
	font-size: 1em;
	text-align: right;
	padding-right: 2%;
	text-transform: uppercase;
}
.top-bar i {
	margin:0.5em;
}
.top-bar a, .top-bar a:hover {
	color:#fff;
	font-size: 0.8em;
}
ul.language-chooser {
    list-style: none;
    margin: 0px;
    display: inline-block;
    padding-left: 1em;
}
ul.language-chooser li {
	display: inline-block;
}
.search-toggle {
    display: none;
}
.main-navigation {
    padding: 0px 0px 2em; 
}
.menu-primary-items a, .menu-primary-items a:hover {
	color:#fff;
	border-bottom:0px;
	font-family: 'Shadows Into Light', cursive !important;
	font-size: 1.2em;
}
.menu-primary-items li.current-menu-item > a {
    color: #fff;
    border-bottom: 1px solid #fff;
}
.menu-primary-items li {
    padding: 0.5em 12px;
}
.menu-primary-items {
    text-align: right;
}
.menu-wrapper {
	position: absolute;
    width: 100%;
    left: 0px;
    padding: 0.3em 0px;
    background: #19380E;
}
.menu-primary-items {
    text-align: right;
    text-align: center;
    border-top: 1px #fff dashed;
    border-bottom: 1px dashed #fff;
}
@media screen and (max-width: 767px) {
	.slicknav_menu .slicknav_icon-bar {
		background-color:#fff;
	}
	.slicknav_nav {
    	background-color: #000;
    	margin-top: 100px;
	}
	.main-navigation {
	    padding: 0px 0px 1em;
	    background: #19380E;
	    border-top: 1px dashed #fff;
		border-bottom: 1px dashed #fff;
	}
	.menu-wrapper {
	    padding: 0px;
	}
	.slicknav_btn {
		padding-bottom: 1em;
	}
	
}

/* SIDEBAR */
.widget-title {
    color: #244C08;
    font-size: 1.8em;
    font-family: 'Shadows Into Light', cursive !important;
}
#text-2 .textwidget h4 {
	margin-top: -0.2em;
	margin-bottom: 1em;
	text-align: center;
	font-size: 1.8em;
	font-family: 'Shadows Into Light', cursive !important;
}
#secondary {
	border-left: 1px solid rgb(237, 237, 237);
	padding-left: 2em;
}
#text-2 .textwidget {
	text-align: center;
}
#text-2 .columna-paginas {
	width: 200px;
    height: 200px;
    margin: 0px auto;
}
/* SECCIONES */
.home .wide-container {
	text-align: center;
}
.separador {
	background: url(img/separador.png) repeat-x center;
	display: block;
	margin-top: -3em;
	width:100%;
	height: 50px;
}
.seccion-principal {
	width:90%;
	display: inline-block;
	vertical-align: top;
	margin:1em;
	min-height: 110px;
}
h3.destacado-home {
	color: #172306;
	text-align: center;
	font-size: 2.5em;
	font-family: 'Shadows Into Light', cursive !important;
}
.logos-turismo {
    display: inline-block;
    margin: 1em 2em;
    vertical-align: middle;
}
.logos-derecha {
	text-align: center;
}
.franja-dibujos {
	background: url(img/iconos.png) repeat-x;
	height: 40px;
	width:100%;
}
}
.rslides_container {
    margin-bottom: 2em;
}
.home #content.site-content {
	background: url(img/bg-content-5.png) bottom repeat-x !important;
}
@media screen and (max-width: 768px) {
	.site-header {
		background: #19380E;
		position: static;
	}
}
@media screen and (max-width: 641px) {
	.seccion-principal {
		width:auto;
	}
}
@media screen and (max-width:490px) {
	.site-header {
	    background: #2B4A11;
	    position: static;
	}
}
/* WIDGET */
.widget .caja-paginas {
	width: 80%;
	text-align: center;
	margin: 1.5em auto;
	background: #A3A950 url(img/bg-footer-2.png) no-repeat right bottom;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.21);
    padding-bottom: 0.1em;
}
/* SECCION PAGINAS */
.columna-footer {
	width: 20.7%;
	margin: 2%;
	display: inline-block;
	vertical-align: top;
	text-align: center;
}
.img-bottom {
	width:100%;
	padding: 5px;
}
.columna-paginas {
	border:10px solid #BCD03A;
    position: relative;
    overflow: hidden;
    padding: 15px;
    text-align: center;
    display: inline-block;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    margin-bottom: 20px;
    width:245px;
    height: 245px;
    -webkit-transition: all 1s ease-in-out;
	  -moz-transition: all 1s ease-in-out;
	  -o-transition: all 1s ease-in-out;
	  transition: all 1s ease-in-out;
}
.columna-paginas:hover {
    -webkit-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
}
.img-bottom {
    width: 100%;
    height: auto;
    padding: 5px;
    min-width: 500px;
    min-height: 300px;
	margin-top: -40%;
    margin-left: -75%;
}
.home div#primary #main {
	text-align: center;
}
.home .col {
    width: 31.2%;
    display: inline-block;
    min-width: 250px;
}
.home .col h4 {
	margin-top: 0px;
	color: #172306;
	text-align: center;
	font-size: 2.5em;
	font-family: 'Shadows Into Light', cursive !important;
}
@media screen and (max-width: 767px) {
.columna-footer {
	width: 45%;
	}
}
@media screen and (max-width: 480px) {
	.columna-paginas, .columna-footer {
		width: 100%;
	}
	#primary .columna-paginas {
		width: 210px;
		height: 210px;
	}
}
/* TARIFAS */
.cuadro-tarifas {
	background: #f3f3f3;
	padding: 2em;
	border-radius: 6px;
}
.cuadro-tarifas ul {
	list-style: circle;
	margin-bottom: 2em;
}
.cuadro-tarifas ul li {
    border-bottom: 1px solid #D8D8D8;
    line-height: 2.5em;
}
.cuadro-tarifas .tarifas-titulo {
	font-weight: 500;
	font-size: 1.4em;
}
.cuadro-tarifas .tarifas-titulares {
	font-weight: 500;
	font-size: 1.1em;
}
/* WIDGET */
.widget-title {
    background-color: transparent;
    text-align: left;
    border-bottom: 1px solid #f2f2f2;
    font-weight: bold;
    text-transform: none;
}
/* INTERIORES */
.entry-header h1.page-title {
	color:rgb(225, 156, 65);
	font-size: 3.5em;
	border-bottom: 1px solid #ededed;
	padding-bottom: 0.3em;
	margin-bottom: 1em;
	font-family: 'Shadows Into Light', cursive !important;
}

/* 	FOOTER */
.site-footer {
    background: #1A2707;
    color:#fff;
    padding-bottom: 0px;
    border-top: 9px solid rgb(231, 151, 49);
}
.columna-footer {
	text-align: left;
	padding: 0.3em 0.8em 2em;
	width:25%;
	min-width: 170px;
}
.columna-footer a {
	color:#fff;
}
.columna-footer i {
	margin: 0.3em;
}
.columna-footer:nth-child(2), div.columna-footer:nth-child(3) {
	border-left: 1px rgba(255,255,255,0.3) solid;
}
.columna-footer p {
	color:#fff;
	font-size: 0.9em;
	margin:0px 0px 0px 0.4em;
}
.footer-credits {
	font-size: 0.8em;
	color:#fff;
	text-align: center;
	margin:0px;
	background:#172306;
}
.footer-credits p {
	margin:0px;
	padding: 0.5em;
	color:#fff;
}
@media screen and (max-width: 767px) {
	.columna-footer:nth-child(1) {
		display: none;
	}
	.columna-footer {
		width:45%;
	}
}
@media screen and (max-width:480px) {
	.columna-footer:nth-child(2), div.columna-footer:nth-child(3) {
		border-left: 0px;
	}
}

/* PARALLAX */
/**
 * See: http://www.css-101.org/articles/ken-burns_effect/css-transition.php
 */

/**
 * Styling the container (the wrapper)
 *
 * position is used to make this box a containing block (it becomes a reference for its absolutely positioned children). overflow will hide part of the images moving outside of the box.
 */
 .contentslider {
 	display: block;
 	position: relative;
 }
 .contenedor {
 	position: static;
    display: block;
    overflow: hidden;
    height: 500px;
    margin-bottom: 2em;
 }

#slideshow {
    position: absolute;
    width: 100%;
    height: 660px;
    overflow: hidden;
    z-index: -10;
}

/**
 * Styling the images
 *
 * position:absolute is to put all images in a stack. Dimensions are set to increase the size of these images so their edges do not appear in the parent box when we move them inside the said box.
 * Because the images are now larger than their parent container, we use top, left and margin values to align them in the center of the box.
 * Finally, we set the transition (property and duration). Note that duration values are different for opacity and transform as we want the "fade-in" effect to be faster than the "panning" effect.
 */

#slideshow img {
    position:absolute;
    width:100%;
    opacity:0;
    -webkit-transition-property: opacity, -webkit-transform;
    -webkit-transition-duration: 3s, 10s;
       -moz-transition-property: opacity, -moz-transform;
       -moz-transition-duration: 3s, 10s;
        -ms-transition-property: opacity, -ms-transform;
        -ms-transition-duration: 3s, 10s;
         -o-transition-property: opacity, -o-transform;
         -o-transition-duration: 3s, 10s;
            transition-property: opacity, transform;
            transition-duration: 3s, 10s;
}

/**
 * We change the point of origin using four corners so images do not move in the same direction.
 * This technique allows us to create various paths while applying the same translate() values to all images (see the 'fx' class further below).
 */

#slideshow img  {
    -webkit-transform-origin: bottom left;
       -moz-transform-origin: bottom left;
        -ms-transform-origin: bottom left;
         -o-transform-origin: bottom left;
            transform-origin: bottom left;
}

#slideshow :nth-child(2n+1) {
    -webkit-transform-origin: top right;
       -moz-transform-origin: top right;
        -ms-transform-origin: top right;
         -o-transform-origin: top right;
            transform-origin: top right;
}

#slideshow :nth-child(3n+1) {
    -webkit-transform-origin: top left;
       -moz-transform-origin: top left;
        -ms-transform-origin: top left;
         -o-transform-origin: top left;
            transform-origin: top left;
}
#slideshow :nth-child(4n+1) {
  -webkit-transform-origin: bottom right;
     -moz-transform-origin: bottom right;
      -ms-transform-origin: bottom right;
       -o-transform-origin: bottom right;
          transform-origin: bottom right;
}

/**
 * Because of the stacking context, we need to make sure that the first image (in source) is not hidden by the last one.
 * The rule below moves all images past the second one down the stack.
 * This is because the second image needs to show on top of the first one when it transitions in.
 */

#slideshow .fx:first-child + img ~ img  {
    z-index:-1;
}

/**
 * Because images are styled with a different point of origin, the following rule will create different panning effects.
 */

#slideshow .fx {
    opacity:1;
    -webkit-transform: scale(1.1);
       -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
         -o-transform: scale(1.1);
            transform: scale(1.1);
}
/* slogan&image section */
	.slogan {
		    background: none;
		    float: right;
		    clear: both;
		    color: #fff;
		    padding: 3em;
		    width: 57%;
		    margin: 10% 0px 0px;
		    position: relative;
		    top: 3em;
		    z-index: 99999;
	}
	#slogan-frase-sup, #slogan-frase-sup-2 {
	    text-align: left;
	    font-weight: 700;
	    font-size: 3em;
    	margin-bottom: 0.3em;
	    line-height: 1em;
	    font-family: 'Shadows Into Light', cursive !important;
	    text-shadow: 1px 1px 1px #000;
	    color: #fff;
	}
	#slogan-frase-inf {
		color:#fff;
		font-size: 1.3em;
		font-weight: 600;
			    text-shadow: 1px 1px 1px #000;
	}
/* MEDIA QUERY BIG IMG HOME */
@media screen and (max-width: 1500px) {
	#slideshow {
       height: 500px;
}
}
@media screen and (max-width: 1360px) {
	#slideshow {
       height: 500px;
}
}
@media screen and (max-width: 1250px) {
	#slideshow, .contenedor {
       height: 400px;
}
}
@media screen and (max-width: 1100px) {
	#slideshow, .contenedor {
       height: 300px;
	}
	.slogan {
		    margin: 3% 0px 0px;
	}
}
@media screen and (max-width: 850px) {
	#slideshow, .contenedor {
       height: 250px;
	}
	.slogan {
		    display: none;
	}
}
@media screen and (max-width: 768px) {
	#slideshow, .contenedor {
       height: 200px;
	}
}
@media screen and (max-width: 450px) {
	.contentslider, .contenedor {
		display: none;
	}
}