/*
 * Carousel
 * Copyright 2013 Ikosweb
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 *  Author: Cynthia Lara
 */


#f-carousel {
    height: 100%;
    padding: 0;
    margin: 0;
}

#f-carousel {
   /* min-height: 450px;
    min-width: 980px;*/
    width: 100%;
height: auto;
}

#wrap {
    display: block;
    background-color: #000;
    width: 100%;
    overflow: hidden;
    position: relative;
    clear: both;
    max-height: 760px;
}

.carousel-wrapper{
display: block;
float: none;
position: relative;
top: auto;
right: auto;
bottom: auto;
left: auto;
z-index: auto;
width: 100%;
margin: 0px;
overflow: hidden;  } 

.caroufredsel_wrapper {
    width: 100% !important;
    height: auto;
}

#item {
    float: left;
    position: relative;
    max-width: 349px;
    width: 30%;
}

#f-carousel img {
    display: block;
    float: left;
    position: relative;
    width: 100%;
}

.txt{
    position: absolute;
    width: 100%;
    top: 45%;
    text-align: center;
    font: 0.8em 'Quicksand';
    color: white;
    z-index: 3;
} 

@keyframes fadeIn {
    0% {
        opacity: 0.0;       
    }
    
    100% {
        opacity: 1; 
    }       
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0.0;       
    }
  
    100% {
        opacity: 1; 
    }       
}

.logo img{
    width: auto !important;
    margin: 0 auto;
float: none !important;
}

.logo{
    background:rgba(23,150,213,0.4);
    position: absolute;
    width: 100%;
padding: 31px 0;
}

.slidetxt {
    width: 90%;
    margin: 0 auto;
}

p.readmore {
    margin: 20px auto 0;
    border: 1px #009BB9 solid;
    width: 100px;
    padding: 10px;
    color: #009BB9;
}

.current p.readmore, .current .logo, .current .slidetxt{
opacity: 1;
animation-name: fadeIn;
    -webkit-animation-name: fadeIn; 
    animation-duration: 1.5s;   
    -webkit-animation-duration: 1.5s;
    animation-timing-function: ease-in-out; 
    -webkit-animation-timing-function: ease-in-out;     
    visibility: visible !important; 
} 

.current h1.carousel-title{
    margin-top: 200px;
    border: none;
    opacity: 1;
animation-name: fadeIn;
    -webkit-animation-name: fadeIn; 
    animation-duration: 1.5s;   
    -webkit-animation-duration: 1.5s;
    animation-timing-function: ease-in-out; 
    -webkit-animation-timing-function: ease-in-out;     
    visibility: visible !important; 
   }


p.readmore,.logo,.slidetxt{
opacity: 0;}          

h1.carousel-title{
    padding: 20px 0px;
    background-color: rgba(0, 0, 0, 0.6);
    font: 2em Georgia,serif;
    border-top: 1px solid #C5C5C5;
    border-bottom: 1px solid #C5C5C5;   
}

#prev,#next{
    z-index: 2;
    position: absolute;
    width: 43px;
    height: 43px;
    left: 50%;
    bottom: 180px;
    opacity: 0.3;
}

#prev{
    margin-left: -230px;
    background: url('../img/prev.png') 0px 0px no-repeat;
}
a#prev:hover, a#next:hover {
opacity: 1;}

#next{
    margin-left: 200px;
    background: url('../img/next.png') 0px 0px no-repeat;
}

#shadow {
    width: 100%;
    display: block;
    background: none repeat scroll 0% 0% rgb(0, 0, 0);
    box-shadow: 0px -90px 60px 50px rgb(0, 0, 0);
    position: relative;
    height: 70px;
    bottom: 70px;
}
