@import url(http://fonts.googleapis.com/css?family=Quattrocento);

/*----------------------------------------------------------------------------- 

REVOLUTION RESPONSIVE BASIC STYLES OF HTML DOCUMENT

Screen Stylesheet 

version:   	1.0 
date:      	26/06/12 
author:		themepunch
email:     	support@themepunch.com 
website:   	http://www.themepunch.com
-----------------------------------------------------------------------------*/



/*********************************************************************************************
              -	SET THE SCREEN SIZES FOR THE BANNER IF YOU WISH TO MAKE THE BANNER RESOPONSIVE 	-	
**********************************************************************************************/

/*	-	THE BANNER CONTAINER (Padding, Shadow, Border etc. )	-	*/

/* regular desktop monitor */

/* custom styles specific for each slide */
.bannercontainer .slide8 .big {
    font-family: 'Quattrocento', serif, Arial;
/*
    background-color: transparent;
    color: #000000;
    width: 100%;
    text-align: center;
*/
}

/*	THE MEDIA CHOOSER TO SET DIFFERENT SIZES OF THE CONTAINER DEPENDING ON THE SCREEN SIZE    */

/* desktop override */
@media only screen and (min-width: 960px) {

    .bannercontainer .slide8 .middle {
        font-color: #000000;
        background-color: transparent;
        font-size: 15px;
        line-height:18px;
        width: 425px;
        white-space: normal;
    }

    .bannercontainer .slide8 .small {
        font-color: #000000;
        background-color: transparent;
        font-size: 13px;
        width: 425px;
        line-height:16px;
    }

    .bannercontainer .slide8 .small a{
        color: #0095e0;
    }
}

/* tablet screen */
@media only screen and (min-width: 768px) and (max-width: 959px)
{

    .bannercontainer .slide8 .big {
        background-color: transparent;
        color: #000000;
        width: 100%;
        text-align: center;
        line-height: 30px;
    }

    .bannercontainer .slide8 .middle {
        font-color: #000000;
        background-color: transparent;
        font-size: 14px;
        line-height:17px;
        width: 400px;
        white-space: normal;
    }

    .bannercontainer .slide8 .small {
        font-size: 12px;
        width: 380px;
        line-height:15px;
    }

    .bannercontainer .slide8 .small a{
        color: #0095e0;
    }
}

/* Landscape phone */
@media only screen and (min-width: 480px) and (max-width: 767px)
{
    .bannercontainer .slide8 .middle {
        font-color: #000000;
        background-color: transparent;
        font-size: 12px;
        line-height:15px;
        width: 250px;
        white-space: normal;
    }


    .bannercontainer .slide8 .small a{
        color: #0095e0;
    }
    
}

/* portrait phone */
@media only screen and (min-width: 0px) and (max-width: 479px) {

    .bannercontainer .slide8 .middle {
        font-color: #000000;
        background-color: transparent;
        font-size: 10px;
        line-height:12px;
        width: 185px;
        white-space: normal;
    }

    .bannercontainer .slide8 .small {
        font-color: #000000;
        background-color: transparent;
        font-size: 10px;
        width: 350px;
    }

    .bannercontainer .slide8 .small a{
        color: #0095e0;
    }
    
}