/*
 * jQuery FlexSlider v1.8
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 */

/* Browser Resets */
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin:0; padding: 0; list-style: none;}

/* FlexSlider Necessary Styles
*********************************/
.flexslider {width:100%; margin:0 0 0 40px; padding: 0;float:left;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {max-width:100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .slides {display: block;}
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}


/* FlexSlider Default Theme
*********************************/
.flexslider {margin-bottom:40px;position: relative; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; zoom: 1;}
.flexslider .slides {zoom: 1;}
.flexslider .slides > li {position: relative;}
/* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */
.flex-container {zoom: 1; position: relative;}

/* Caption style */
/* IE rgba() hack */
.flex-caption {background:none; -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); zoom: 1;}
.flex-caption {width: 96%; padding: 2%; margin: 0; position: absolute; left: 0; bottom: 0; background: rgba(0,0,0,.3); color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.3); font-size: 18px; line-height: 18px;}

/* Direction Nav */
.flex-direction-nav { height: 0; }
.flex-direction-nav li a {width: 45px; height: 45px; margin: -13px 0 0; display: block; background: url(../images/bg_direction_nav.png) no-repeat; position: absolute; top: 50%; cursor: pointer; text-indent: -999em;}
.flex-direction-nav li .next {background-position: -45px 0; right:-5px;}
.flex-direction-nav li .prev {left:-50px;}
.flex-direction-nav li .disabled {opacity: .3; filter:alpha(opacity=30); cursor: default;}

/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center;}
.flex-control-nav li {margin: 0 0 0 5px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-nav li:first-child {margin: 0;}
.flex-control-nav li a {width: 27px; height: 20px; display: block; background: url(../images/bg_control_nav.png) no-repeat; cursor: pointer; text-indent: -999em;}
.flex-control-nav li a:hover {background-position: 0 -30px;}
.flex-control-nav li a.active {background-position: 0 -60px; cursor: default;}

@media only screen and (min-width: 481px) and (max-width: 768px) {
	
	.flex-control-nav{ width:700px;}
	.flexslider .slides img{
	width:700px; margin-left:-20px;
	}
	.flex-direction-nav {display:none;}
	
	
	}
	
	
	
@media only screen and (max-width: 480px) {
	

	.flex-control-nav{ width:50%;}
	.flexslider .slides img{
	max-width:450px; margin-left:-30px;}
	.flex-direction-nav {display:none;
	}
	
#logo{ position:absolute; z-index:3000;left:15%;}

#banner{-moz-transform:scale(0.6); -webkit-transform:scale(0.6); -o-transform:scale(0.6); text-align:left; margin-left:-35px;}


header{ width:100%;}

    nav {
        border-bottom: 0;
        height: auto;
		width:390px;
		background-color:#d8c39d;
		margin-left:20px;
		margin-top:130px;
		margin-bottom:25px;
		 
		
    }
 
    nav ul {
        display: none;
        height: auto;
        width: 100%;
    }
 
    nav li {
        width: 50%;
        float: left;
        position: relative;
		margin: 2px 0px;
	
		
    }
	
	 nav li:first-child{
		 margin-top:40px;
    }
 
    nav a {
        text-align: left;
        width: 100%;
        text-indent:15px;
    }
	
	
	
    nav a#pull {
        display: block;
		
	
		
        width:350px;
        position: relative;
    }
	
 
    nav a#pull:after {
        content:"";
		width: 30px;
        height: 20px;
        display: inline-block;
        position: absolute;
        top: 10px;
		border:0;
		text-align:left;
    }
	
	#redes{ margin-left:55%;-moz-transform:scale(0.8); -webkit-transform:scale(0.8); -o-transform:scale(0.8);
	padding-top:155px;}
	
	#content{ width:480px;margin:0 auto; height:auto; overflow:hidden;}

#entradas{ width:100%;}
	 

#video{ max-width:420px;}
#video iframe{ margin-left:5%; max-width:420px;}

article{ width:420px; margin-top:20px;
}
article p{ width:240px; margin-left:30px; font-size:15px;}
article img{-moz-transform:scale(0.8); -webkit-transform:scale(0.8); -o-transform:scale(0.8);}

article h1{ font-family: 'Lily Script One', cursive; color:#675546; font-size:24px; margin:25px 0px 5px 80px; width:300px;}

article h2{ font-family: 'Lily Script One', cursive; color:#4cabaf; font-size:24px; margin:0px 0px 5px 70px; width:300px;}

.divider{ width:380px; height:10px;margin-left:20px;}


	#textos{ margin-top:70px;}
  
  #textos .img{ width:80%; margin-left:10px;}
  
  #textos .image{ width:55%; margin-left:20%;}
  
   #textos .divider{ width:40%;}
  
  
  #wrap{ width:480px; height:100%; float:left; vertical-align:top; padding-top:0px; }


#textos h1{font-family: 'Lily Script One', cursive; color:#675546; font-size:15px; font-weight:100; color:#900; text-align:center; margin-top:10px; padding-top:20px; }

#textos h2{font-family: 'Lily Script One', cursive; color:#633; font-size:24px; font-weight:100; text-align:center; width:100%; float:left;}


#textos p {
    color: #675546;
    float: left;
    font-family: 'Lato',sans-serif;
    font-size: 16px;
	font-weight:400;
	margin-left:40px;
    text-align: justify;
    width: 360px;
	margin-bottom:30px;
}
	


#quote{ margin-left:20px; width:390px;}

#quote h3{ font-size:18px;}
#quote img{ margin-bottom:90px;}


#izq{ width:550px; display:inline-block; padding:0px 0px 20px 0px; vertical-align:top;
margin-bottom:40px;}

#izq p{font-family: 'Lato', sans-serif; text-align:left; font-size:16px;color:#966; text-shadow: 0px 1px 1px rgba(255, 255, 255, 1); width:400px; margin-left:20px;}

#izq h1{font-family: 'Lily Script One', cursive;
color:#675546;
font-size:30px;
font-weight:100; color:#900; 
text-shadow: 0px 1px 1px rgba(255, 255, 255, 1); text-align:center;}

iframe{ width:330px; margin-left:0px; padding-left:0px;}

 #mapa{  vertical-align:top; text-align:left;padding:0px 0px 0px 30px; max-width:480px;  overflow: auto;}
 
#mapa h2 { text-align:center; width:90%; padding-top:20px;}

.form{margin-left:-60px;}

.form1{margin-left:-100px;}

	
}

@media only screen and (max-width: 320px) {
	body{ max-width:320px;}

	.flex-control-nav{ width:250px;}
	.flexslider .slides img{
	max-width:320px; margin-left:-30px;}
	.flex-direction-nav {display:none;
	}
	
#logo{ position:absolute; z-index:3000;left:-5px;}

#banner{-moz-transform:scale(0.5); -webkit-transform:scale(0.5); -o-transform:scale(0.5); text-align:left; margin-left:-25%;}


header{ width:320px;}

    nav {
        border-bottom: 0;
        height: auto;
		width:290px;
		background-color:#d8c39d;
		margin-left:10px;
		margin-top:130px;
		margin-bottom:25px;
		 
		
    }
 
    nav ul {
        display: none;
        height: auto;
        width: 100%;
    }
 
    nav li {
        width: 50%;
        float: left;
        position: relative;
    }
 
    nav a {
        text-align: left;
        width: 100%;
        text-indent:15px;
    }
	
	
	
    nav a#pull {
        display: block;
	
		
        width:290px;
        position: relative;
    }
	
 
    nav a#pull:after {
        content:"";
		width: 30px;
        height: 20px;
        display: inline-block;
        position: absolute;
        left: 15px;
        top: 10px;
    }
	
	#redes{ margin-left:-15px;-moz-transform:scale(0.8); -webkit-transform:scale(0.8); -o-transform:scale(0.8);
	padding-top:155px;}
	
	#content{ width:320px; margin:0 auto; height:auto; overflow:hidden;}

#entradas{ width:100%;}
	 

#video{ max-width:300px; margin-left:0px;}
iframe{ width:300px;}

article{ width:320px; margin-left:0px;
}
article p{ width:140px; margin-left:20px; font-size:14px;}
article img{-moz-transform:scale(0.8); -webkit-transform:scale(0.8); -o-transform:scale(0.8);}

article h1{ font-family: 'Lily Script One', cursive; color:#675546; font-size:20px; margin:25px 0px 5px 40px; width:200px;}

article h2{ font-family: 'Lily Script One', cursive; color:#4cabaf; font-size:20px; margin:0px 0px 5px 50px; width:200px;}

.divider{ width:280px; height:10px;margin-left:20px;}

#textos p {
    color: #675546;
    float: left;
    font-family: 'Lato',sans-serif;
    font-size: 16px;
	margin-left:20px;
    text-align: justify;
    width:55%;

}

#textos h1{ font-size:22px; margin-left:-120px;}

#textos h2{ font-size:22px; margin-left:-90px;}
 #textos .img{ width:85%; margin-left:-20px;}
  #textos .image{ width:85%; margin-left:-30px; margin-top:-25px; -moz-transform:scale(0.65); -webkit-transform:scale(0.65); -o-transform:scale(0.65); margin-bottom:-30px;}
 
 .cinta{ margin-left:-70px;-moz-transform:scale(0.8); -webkit-transform:scale(0.8); -o-transform:scale(0.8);}	
 
 #textos1{
	display:inline-block;
	width:350px;
	float:left;

background-image:url(../images/ricepaper2.png);
background-repeat:repeat;
-webkit-border-radius:10px;
-moz-border-radius: 10px;
border-radius: 10px; 
  height:350px;
  margin:10px;
  text-align:center;}
  
  
   #textos{ padding-bottom:50px;}
  
 #textos .divider { margin-right:190px;
   
}

#izq{ width:320px; display:inline-block; padding:0px; vertical-align:top;
}


.form{margin-left:-30px;}

.form1{margin-left:-70px;}

#quote{ margin-left:20px; width:270px;}

#quote h3{ font-size:17px;}
#quote img{ margin-bottom:90px;}


iframe{ width:260px; margin-left:0px; padding-left:0px; overflow:hidden;}

 #mapa{  vertical-align:top; text-align:left;padding:0px 0px 0px 30px; width:320px;  overflow: auto;}
 
 
 #mapa h2 { text-align:center; width:80%; padding-top:20px;}
 

	
}

	