/************************************************
    BANNER CONTROL
	STYLE DEFINITIONS
	VERSION 1.0
	Developed by Justin Kercher
    Apollo Internet Media
	Create: 28/02/2013
    
    NB: DO NOT MODIFY THIS DOCUMENT. APPLY
    OVERRIDES IN STYLE.CSS with !important rule
************************************************/
        
.flexslider { z-index: 1 !important; text-align: left; overflow: hidden; }
    .flexslider ul.slides * { -webkit-backface-visibility: hidden !important; } /* required for android problems fix */
        .flexslider ul.slides li { position: relative; -webkit-transform: translateZ(0) !important; }
            .flexslider ul.slides li .mainlink { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
            .flexslider ul.slides li .bannerDescription { position: absolute; right: 40px; top: 0px; padding: 20px; width: 40%; height: auto;  font-size: inherit;
                                                          transition-delay: 1.0s; -moz-transition-delay: 1.0s; /* Firefox 4 */-webkit-transition-delay: 1.0s; /* Safari and Chrome */ -o-transition-delay: 1.0s; /* Opera */ 
                                                          -webkit-transform: translateZ(1000) !important; -webkit-perspective: 1000 !important; display: block; }
                .flexslider ul.slides li .bannerDescription img { width: auto; height: auto; }
                .flexslider ul.slides li .bannerDescription .bannerDescripitonBackground { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: #ffffff; 
                                                                                           opacity:0.8; filter:alpha(opacity=80); border-radius: 0px 0px 4px 4px; }      
                                                                                           
                .flexslider ul.slides li .bannerDescription .bannerDescriptionContent { position: relative; }                                                                          
                .flexslider ul.slides li .bannerDescription a.button { margin-right: 2px; }
                
            .flexslider ul.slides li .bannerCaption { position: absolute; left: 0px; bottom: 10px; font-size: 2.0em; font-weight: lighter; font-family: Century Gothic, Sans-Serif; padding: 10px 20px; 
                                                      max-width: 50%; white-space: nowrap; overflow: hidden; -webkit-transform: translateZ(10) !important; }
                .flexslider ul.slides li .bannerCaption .bannerCaptionBackground { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: #ffffff;  opacity:0.8; filter:alpha(opacity=80); border-radius: 0px 4px 4px 0px; }
                .flexslider ul.slides li .bannerCaption .bannerCaptionContent { position: relative;  }
                .flexslider ul.slides li .bannerCaption a { text-decoration: none !important; color: inherit !important; }
                
    .flex-control-nav { right: 5% !important; bottom: 6% !important; width: auto !important;  }            
    .flex-pauseplay { position: absolute; bottom: 7%; right: 2%; z-index: 20000; }
    .flex-pauseplay a { text-decoration: none !important; cursor: pointer !important; }
    .flex-play:before { content: "\e072";  font-family: 'Glyphicons Halflings'; color: rgba(0,0,0,0.8); } /* Requires Glyphicons font */
    .flex-pause:before { content: "\e073"; font-family: 'Glyphicons Halflings'; color: rgba(0,0,0,0.8); } /* Requires Glyphicons font */
                
    /*************************************
		MEDIA QUERIES
	*************************************/                                     

   
    /* SM Sizing */
    @media (max-width: 991px) {
        .flexslider ul.slides li .bannerDescription { left: 2%; right: 2%; bottom: 0px; top: auto;  width: auto; }
        .flexslider ul.slides li .bannerCaption { top: 0px; bottom: auto; left: 2%; right: 2%; height: auto; text-align: center; max-width: 100%; }
        .flexslider ul.slides li .bannerCaption .bannerCaptionBackground { border-radius: 0px 0px 10px 10px }
        .flexslider ul.slides li .bannerDescription .bannerDescripitonBackground { border-radius: 10px 10px 0px 0px; }
    }
    
    /* XS sizing */
    @media (max-width: 767px) {
        /* reduce font size */
        .bannerCaption { font-size: 1.5em !important; max-width: 100% !important;
                         bottom: 0px !important; left: 0px !important; right: 0px !important; top: auto !important; text-align: left !important; } 
        .bannerDescription, bannerDescription *  { display: none !important; }
        .flexslider ul.slides li .bannerCaption .bannerCaptionBackground { border-radius: 0px !important; }
    }
    
    /* Hide Nav */
    @media (max-width: 550px) {
        .flex-control-paging { display: none; }
    }