/* Styles for the image gallery */

.showSlide {  
    display: none  
}  
.showSlide img {  
    width: 100%;  
}  
.slidercontainer {  
    max-width: 1000px;  
    position: relative;  
    margin: auto;  
}  
.left, .right {  
    cursor: pointer;  
    position: absolute;  
    top: 50%;  
    width: auto;  
    padding: 16px;  
    margin-top: -22px;  
    color: white;  
    font-weight: bold;  
    font-size: 18px;  
    transition: 0.5s ease;  
    border-radius: 0 3px 3px 0;  
}  
.right {  
    right: 0;  
    border-radius: 3px 0 0 3px;  
}  
.left:hover, .right:hover {  
    background-color: rgba(115, 115, 115, 0.8);  
}  
.content {  
    color: #eff5d4;  
    font-size: 30px;  
    padding: 8px 12px;  
    position: absolute;  
    top: 10px;  
    width: 100%;  
    text-align: center;  
}  
.active {  
    background-color: #717171;  
}  
/* Fading animation */  
.fade {  
    -webkit-animation-name: fade;  
    -webkit-animation-duration: 0.5s;  
    animation-name: fade;  
    animation-duration: 0.5s;  
}  
@-webkit-keyframes fade {  
    from {  
        opacity: .4  
    }  
    to {  
        opacity: 1  
    }  
}  

@keyframes fade {  
    from {  
        opacity: .4  
    }  
    to {  
        opacity: 1  
    }  
}