﻿/* Start of blog page slideshow */
div#slideshowblog {position:relative; width:100%; height:520px; overflow:hidden;z-index:1; background-color:gray;}
div#blogimagepager { position:relative; text-align:center; z-index:1000 !important; text-decoration: none; top:-35px; left:0px;}
div#blogimagepager a { color:white; background:  #232f93; text-decoration: none; margin: 0px 4px 0px 0px; padding:10px; text-align:center;  }
div#blogimagepager a.activeSlide { background:#009900; }
div#blogimagepager a.focus { outline: none; }
div#slideshowblog .feature-item {position:relative !important; width: 100% !important;z-index:100;}
div#slideshowblog .feature-item .content {width:40%; position:absolute; top:20px; left:2%; z-index:100; margin:0; padding:2%;}
div#slideshowblog .feature-item .content > p { font-size:140%; color: white; margin:0; padding:0;}
div#slideshowblog .feature-item .content > h3 { font-size:200%; color: white; margin:0; padding:0; }
div#slideshowblog .feature-item .slide-img {position:absolute; top:20px; left:410px;width: 450px; }
div#slideshowblog .feature-item .content div.button {margin-top:10%; margin-bottom:5%; z-index:1000;}
div#slideshowblog .feature-item .content div.button > a {background-color: gray; color:#ffffff; padding:3%; vertical-align:middle; }
div#slideshowblog .feature-item .content div.button > a:hover { background-color:#232f93; padding:3% !important; color:#ffffff; vertical-align:middle; }

div#slideshowblog2 {position:relative; width:750px; height:405px; overflow:hidden;z-index:1; background-color:gray;}

/* End of home page slideshow */

@media only screen and (max-width : 991px) {
div#slideshowblog .feature-item .slide-img {position:relative; left:0; }
div#slideshowblog .feature-item .content {width:98%;}
}

/* Mobile definition */
@media only screen and (max-device-width : 480px) {
h1.blog  { font-size:110%;}
div#slideshowblog { clear:both; position:relative; width:100%; height:480px; overflow:hidden;z-index:1; background-color:gray;}
div#blogimagepager { position:relative; text-align:right; z-index:1000 !important; text-decoration: none; top:-25px; left:0px;}
div#blogimagepager a,
div#blogimagepager a:link,
div#blogimagepager a:visited,
div#blogimagepager a:active,
div#blogimagepager a:hover,
div#blogimagepager a:focus { font-size:80% !important;}
div#blogimagepager a { color:white; background:  #232f93; text-decoration: none; margin: 0px 4px 0px 0px; padding:5px; text-align:center;  }
div#blogimagepager a.activeSlide { background:#009900; }
div#blogimagepager a.focus { outline: none; }
div#slideshowblog .feature-item {position:relative !important; height:auto; width: 100% !important;z-index:100;}
div#slideshowblog .feature-item .content {width:96%; float:left; top:2%; left:2%; z-index:100; margin:0; padding:2%; background-color: gray; opacity:0.8;}
div#slideshowblog .feature-item .content > p { font-size:90%; color: white; margin:0; padding:0;}
div#slideshowblog .feature-item .content > h3 { font-size:100%; color: white; margin:0; padding:0;}
div#slideshowblog .feature-item .slide-img {position:relative;float:left;}
div#slideshowblog .feature-item .slide-img {position:relative; top:10px; left:0px;}
div#slideshowblog .feature-item .content div.button { position:relative; float:left; margin-top:20px; margin-bottom:5px; z-index:1000;}
div#slideshowblog .feature-item .content div.button > a { font-size:80% !important; background-color: gray; color:#ffffff; padding:3%; vertical-align:middle; }
div#slideshowblog .feature-item .content div.button > a:hover { font-size:80% !important; background-color:#232f93; padding:3% !important; color:#ffffff; vertical-align:middle; }
div#slideshowblog .feature-item .content div.button > a:link,
div#slideshowblog .feature-item .content div.button > a:visited,
div#slideshowblog .feature-item .content div.button > a:active { font-size:80% !important;}

div#slideshowblog2 { clear:both; position:relative; width:100%; height:194px; overflow:hidden;z-index:1; background-color:gray;}

}