/*
 * jQuery FlexSlider v1.8
 * http://flex.madebymufffin.com
 *
 * Copyright 2011, Tyler Smith
 * Free to use under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 */
 #container {width: 80%; max-width: 800px; margin: 0 auto;}
/* Browser Resets */
.flex-container a:active,
.flexslider a:active {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {width: 100%; margin: 0; padding: 0;}
.flexslider .slides > li {display: none;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {max-width: 100%; display: block; width:100%; }
.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 { position: relative; zoom: 1;min-height: 350px;}
.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-image: url("../images/caption-bg.png"); background-repeat:no-repeat; background-position:0 0 ; background-size:100% 100%; background-color:rgba(0, 0, 0, 0); zoom: 1;}
.flex-caption {    text-transform: uppercase;padding: 1.5% 4% 1.5% 1.5%; position: absolute; left:0%; bottom:0px; font-size:26px; font-weight:700; color: #fff;   line-height: 40px; }
.flex-caption span { display:block; text-transform:uppercase; font-size:26px; line-height:30px; font-weight:300; color: #fff; }

/* Direction Nav */
.flex-direction-nav li a {width:26px; height:40px; margin:0; padding:0px; display: block; position: absolute; top: 55%; cursor: pointer; text-indent: -9999px;}
.flex-direction-nav li .flex-next { border-left:0px; right:10px; background:url("../images/control-dreta.png") no-repeat scroll 0 0;}
.flex-direction-nav li .flex-next:hover { background-position:-1px -39px;}

.flex-direction-nav li .flex-prev {left:10px; background:url("../images/control-esquerra.png") no-repeat scroll 0 0;}
.flex-direction-nav li .flex-prev:hover { background-position:1px -41px;}
.flex-direction-nav li .disabled {opacity: .3; filter:alpha(opacity=30); cursor: default;}
.flex-direction-nav {  left: 0; margin: 0 auto; position: absolute; right: 0;  top: 55%;  width: 90%;}

/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: 12%; text-align: left; left:45%;z-index:9}
.flex-control-nav li {margin: 0 0 0 10px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-nav li:first-child {margin: 0;}
.flex-control-nav li a { border-radius:50%; width:11px; height: 11px; display: block; background:#e2e2e2 none repeat scroll 0 0; cursor: pointer; text-indent: -9999px;}
.flex-control-nav li a:hover {background-position: 0 -13px;}
.flex-control-nav li a.flex-active {background:#f47920;}

.baner-caption { bottom: 10%;  position: absolute;  right: 5%;  text-align: right; width: 615px;}
.flexslider .flex-content {
	position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin: auto;
    display: flex;
    flex-flow: wrap;
	flex-direction: column;
    justify-content: center;
	align-items: center;
}
.flexslider .flex-content h1 { text-shadow: -1px 2px rgba(0, 0, 0, 0.5); animation: bannerh1 1s infinite; animation-iteration-count: 1; color: #ffffff;  font-family: 'merriweather-light';  font-size: 62px; line-height: 66px; width: 100%; text-align:center; }
.flexslider .flex-content a { color: #ffffff; font-family: "Conv_SourceSansPro-Light"; font-size: 20px; line-height: 28px; padding: 5px 20px; background: #36aef6; border: 1px solid #36aef6; border-radius: 50px; text-align: center; margin-top: 35px;  -webkit-transition: 0.5s ease-out; -moz-transition: 0.5s ease-out; -o-transition: 0.5s ease-out; transition: 0.5s ease-out; }
.flexslider .flex-content a:hover { text-decoration: none; background: transparent; border-color: white;}
/*.flexslider li a img { width:auto !important; background-color: #056cac; margin: 0; padding: 11.5px 13px; position: absolute; right: 0; top: 0;}*/
/*@keyframes bannerh1 {
    0%   { top:-10%; opacity:0;}
    100% {top: 40%; opacity:1;}
}
@-webkit-keyframes bannerh1 {
    0%   {top:-10%; opacity:0;}
    100% {top:40%; opacity:1;}
}*/

/**/
#slider .flex-direction-nav,
#carousel .flex-direction-nav{
	display: inline-block;
}
#slider .flexslider .slides img {
    height: auto;
}
#carousel {
	min-height: 0;
}
#carousel .slides img {
    width: 100%; /*proper aspect ratio of images*/
    height: auto;
}
#carousel .flex-direction-nav{
	top: 40%;
	width: 100%;
}
#carousel .flex-direction-nav li .flex-prev {
	left: 0px;
}
#carousel .flex-direction-nav li .flex-next {
    right: 0px;
}
.custom-navigation .flex-prev{
	position: absolute;
	top: 45%;
	left: 5%;
	color: #ffffff;
	font-size: 2.5em;
}
.custom-navigation .flex-next{
	position: absolute;
	top: 45%;
	right: 5%;
	color: #ffffff;
	font-size: 2.5em;
}

.custom-navigation .flex-next:hover, 
.custom-navigation .flex-prev:hover{
    color: #36aef6;
}

@media only screen and (max-width:1280px){
	.flex-control-nav {bottom:15%};
}
@media only screen and (max-width:1023px){
	.flex-control-nav {bottom:2%};
}