.myRow {width:100%; margin:5rem auto -1.5rem auto; padding:0rem;  text-align:center;}
h2 {font-size: 3rem; margin:0;}
h3 {font-size: 2rem; margin:0;}
#slider-section { position:relative; max-width: 972px;  width: 90%; min-width:26rem; height:auto; margin: 0rem auto;}

div#container {  max-width: 960px; width: 80%; height:auto; overflow:hidden; margin-bottom:0; }
div.content { display: none; clear: both; }
div.content a, div.navigation a { text-decoration: none; color: #005b88; }
div.content a:focus, div.content a:hover, div.content a:active { text-decoration: none; }

/*div.navigation a.pageLink { height: 30px; }*/
div.controls { margin:0rem 0 0rem 0; padding-bottom:0rem; }
div.controls a { font-size:1.7rem; font-weight:400; opacity:1; padding:0rem 1.2rem; text-decoration: underline; }
div.ss-controls { float: left; }
div.nav-controls { float: right; }

.pause,.play { display:none; }
.prev, .next { display:block; width:1.9rem; height:4.9rem; position:absolute; top:38%; z-index:1; }

.prev 		 {background:url(../images/design/arrowhalfcircleft.png) top 0 left 0px no-repeat; left:0rem; background-size:100%;}
.prev:hover  {background:url(../images/design/arrowhalfcircleft-h.png) top 0 left 0px no-repeat; left:0rem; background-size:100%;}
.next 		 {background:url(../images/design/arrowhalfcircright.png) top 0 left 0px no-repeat; right:1rem; background-size:100%;}
.next:hover  {background:url(../images/design/arrowhalfcircright-h.png) top 0 left 0px no-repeat; background-size:100%;}	


div.slideshow-container, div.loader, div.slideshow a.advance-link { width:100%; max-width: 960px; min-width:26rem; height:auto;    /* This should be set to be at least the width of the largest image in the slideshow with padding */ }
div.loader, div.slideshow a.advance-link, div.caption-container { height: auto; /* This should be set to be at least the height of the largest image in the slideshow with padding */ }

div.slideshow-container { position: relative; clear: both; float: left; width:100%; height: auto; min-height: 62rem;}
div.loader { position: absolute; top: 0; left: 0; background-image: url('images/loader.gif'); background-repeat: no-repeat; background-position: center; }
div.slideshow span.image-wrapper { display: block; position: absolute; top: 0; left: 0; }
div.slideshow a.advance-link { display: block; margin-top:0; padding-top:5px;/* This should be set to be at least the height of the largest image in the slideshow with padding */ text-align: center; }
div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited { text-decoration: none; }
div.slideshow a.advance-link:focus { outline: none; }
div.slideshow img { width:100%; height:auto; border:1px solid #999; }
div.caption-container { float: right; position: relative; margin-top: 5px; }
span.image-caption { display: block; position: absolute; top: 0; left: 0; }
div.photo-index { display:none; position: absolute; padding: 0 12px; color:#ccc; }
div.navigation-container { float: left; position: relative; left: 0; margin-top:0px; }
div.navigation { float: left; position: relative; left: 0; }
div.navigation a.pageLink { display: block; position: relative; float: left; margin: 2px; width: 16px; background-position:center center; background-repeat:no-repeat; }
div.navigation a.pageLink:focus { outline: none; }

ul.thumbs { margin: 1.5rem 0 0rem 0; padding: 0;  }
ul.thumbs li { float: left; width:13.1%; padding: 0; margin: 5px 9px 0px 0; list-style: none; }
a.thumb {  display: block; }
ul.thumbs li.selected a.thumb { }
a.thumb:focus { outline: none; }
ul.thumbs img { width:100%; border:1px solid #555; display: block; }
div.pagination { clear: both; }
div.navigation div.top { margin-bottom: 1rem; border:2px solid #f00;}
div.navigation div.bottom { padding: 0rem 0 1rem 0; }
div.pagination a, div.pagination span.current, div.pagination span.ellipsis { font-size: 1.3rem; display: block; float: left; margin:0px 2px 0px 0px; padding: 5px 10px; border: 1px solid #ccc; }
div.pagination a:hover { background-color: #eee; text-decoration: none; }
div.pagination span.current { font-weight: bold; background-color: #000; border-color: #000; color: #fff; }
div.pagination span.ellipsis { border: none; padding: 5px 0 3px 2px; }
div.gallery-gutter { clear: both; padding-bottom: 20px; }



@media (max-width:1126px) {


}


@media (max-width:1067px) {
div.slideshow-container { min-height: 62rem; }
.next {right:.1rem; }
}

@media (max-width:1040px) {
div.slideshow-container { min-height: 60rem; }
}


@media (max-width:1001px) {
.myRow {margin:11rem auto 0rem auto; }
div.slideshow-container { min-height: 58rem; }

}

@media (max-width:979px) {
ul.thumbs li { margin: 5px 5px 5px 0; list-style: none; }
}

@media (max-width:958px) {
div.slideshow-container { min-height: 56rem; }
}

@media (max-width:920px) {
div.slideshow-container { min-height: 54rem; }
}

@media (max-width:890px) {
div.slideshow-container { min-height: 52.5rem; }
}

@media (max-width:870px) {
div.slideshow-container { min-height: 51.5rem; }
}
@media (max-width:850px) {
div.slideshow-container { min-height: 50rem; }
}
@media (max-width:840px) {
div.slideshow-container { min-height: 49rem; }
}

@media (max-width:810px) {
div.slideshow-container { min-height: 47rem; }
}

@media (max-width:801px) {

ul.thumbs li { width:13%; margin: .5rem .5rem 0rem 0; }

}

@media (max-width:790px) {
div.slideshow-container { min-height: 46rem; }
}

@media (max-width:767px) {
.myRow {margin:6rem auto 0rem auto; }
div.slideshow-container { min-height: 45rem; }
div.pagination a, div.pagination span.current, div.pagination span.ellipsis { padding: 2px 10px; border: 1px solid #ccc; }
}

@media (max-width:736px) {
div.slideshow-container { min-height: 43rem; }
div.pagination a, div.pagination span.current, div.pagination span.ellipsis { font-size: 1rem;}
}

@media (max-width:700px) {
div.slideshow-container { min-height: 41rem; }
}

@media (max-width:670px) {
div.slideshow-container { min-height: 39rem; }
}


@media (max-width:645px) {
div.slideshow-container { min-height: 38rem; }
}

@media (max-width:620px) {
div.slideshow-container { min-height: 37rem; }
}

@media (max-width:600px) {
div.slideshow-container { min-height: 36rem; }

h2 {font-size: 2.5rem;}
}

@media (max-width:570px) {
div.slideshow-container { min-height: 34rem; }
}

@media (max-width:540px) {
div.slideshow-container { min-height: 32rem; }

}

@media (max-width:520px) {
div.slideshow-container { min-height: 31rem; }
.prev, .next { top:32%; }
h2 {font-size: 2.0rem;}
ul.thumbs li{ width:12.5%; }
}
@media (max-width:490px) {
div.slideshow-container { min-height: 29.5rem; }
}
@media (max-width:460px) {
div.slideshow-container { min-height: 27.5rem; }
}
@media (max-width:430px) {
div.slideshow-container { min-height: 26rem; }
ul.thumbs li{ width:12%; }

ul.thumbs, div.pagination {  }
.prev, .next { top:29%; }
}
@media (max-width:400px) {
div.slideshow-container { min-height: 24rem; }
}
@media (max-width:380px) {
div.slideshow-container { min-height: 23rem; }
}
@media (max-width:350px) {
div.slideshow-container { min-height: 21.5rem; }
.prev, .next { top:28%; }
h2 {font-size: 1.8rem;}
}

@media (max-width:330px) {
div.slideshow-container { min-height: 21rem; }
}

@media (max-width:310px) {
div.slideshow-container { min-height: 21rem; }
}
