/* #Scroller
================================================== */
#scroller {    overflow: visible;    position: relative;   height: 455px; width: 950px; margin: 0 auto; }
#scroller img {    display: block;}
#scroller .mobile-buttons {    left: 0;    position: absolute;    top: 5px;    width: 100px;}
#scroller .mobile-buttons a {    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);    color: #FFFFFF;    display: block;    font-size: 11px;    line-height: 24px;    margin-bottom: 2px;    padding: 0 0 0 10px;    text-decoration: none;}
#scroller .overlay {    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);    bottom: 0;    height: 142px;    left: 0;    position: absolute;    width: 100%;}
#scroller .content {    height: 142px;    overflow: hidden;}
#scroller .content h2, #scroller .content p {    float: left;    padding: 0 10px;}
#scroller .content h2 {    margin: 10px 0 0;}
#scroller .content p {    color: #DDDDDD;    margin-bottom: 30px;    padding-top: 10px;}
#scroller .content .button {    border-radius: 0 0 0 0;    box-shadow: 0 2px 6px #000000;    float: right;    font-size: 18px;    line-height: 30px;    margin: 20px 10px 0 0;    padding: 5px 10px;    text-transform: uppercase;}
.button-surround button, .button-surround .button {    background: linear-gradient(to bottom, #45484D 0%, #000000 100%) repeat scroll 0 0 transparent;    border-radius: 0 0 0 0;    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);    color: #FFFFFF;    float: right;    font-size: 18px;    font-weight: normal;    line-height: 30px;    margin: 20px 10px 0 0;    padding: 5px 10px;    text-shadow: 0 -2px 0 #000000;    text-transform: uppercase;}
#scroller .controls { position:absolute; right: 20px; bottom: 10px; height: 28px; display: block; z-index: 1000; }
#scroller .controls .control { border-radius: 20px;   background: none repeat scroll 0 0 #f2f2f2;    display: inline-block;    height: 12px;    margin: 10px 5px;    overflow: visible;    width: 12px;}
#scroller .controls .control.selected, #scroller .controls .control:hover {    background: none repeat scroll 0 0 #dbc321;    cursor: pointer;}
#scroller .controls .control span {    display: block;    height: 30px;    margin: -9px 0 0 -9px;    width: 30px; }
#scroller .images {    position: relative;    width: 100%;    height: 100%;}

#scroller .images > img {  z-index: 1;  left: 0;    opacity: 0;    position: absolute;    top: 0;    width: 100%;    height: 100%;  }

#scroller .images > img.selected { opacity: 1; z-index: 100!important; }

.scroller-control { position: relative; top: 8px; cursor: pointer; display: block; width: 15px!important; height: 15px!important; border: none!important; }
.scroller-control.float-left  { left: 390px; cursor: pointer; }
.scroller-control.float-right { right: 390px; cursor: pointer; }

.scroll-full { background-color:#000000; margin-bottom:20px!important; }
.news-scroller { display: block; overflow:hidden; }
#scroller-news > h1 { position: absolute; top:10px; left:45px; margin:0; color:#ffffff; z-index:999; font-size:30px; }
#scroller-news { overflow: hidden;    position: relative;   height: 307px; width: 100%; margin: 0 auto; }
#scroller-news img { display: block;}
#scroller-news .mobile-buttons {    left: 0;    position: absolute;    top: 5px;    width: 100px;}
#scroller-news .mobile-buttons a {    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);    color: #FFFFFF;    display: block;    font-size: 11px;    line-height: 24px;    margin-bottom: 2px;    padding: 0 0 0 10px;    text-decoration: none;}
#scroller-news .overlay {    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);    bottom: 0;    height: 142px;    left: 0;    position: absolute;    width: 100%;}

#scroller-news .controls { position:absolute; left:195px; padding:0 15px; bottom: 5px; height: 28px; display: block; z-index: 1000; }
#scroller-news .controls .control { cursor:pointer; border-radius: 20px;   background: none repeat scroll 0 0 #f2f2f2;    display: inline-block;    height: 10px;    margin: 10px 3px;    overflow: visible;    width: 10px;}
#scroller-news .controls .control.selected, #scroller .controls .control:hover {    background: none repeat scroll 0 0 #dbc321;    cursor: pointer;}
#scroller-news .controls .control span {    display: block;    height: 30px;    margin: -9px 0 0 -9px;    width: 30px; }

#scroller-news .images {    position: relative;    width: 100%;    height: 100%;}

#scroller-news .images > div { z-index: 1;  left: 0;    opacity: 0;    position: absolute;    top: 0;    width: 100%;    height: 100%; }
#scroller-news .images > div.selected { opacity: 1; z-index: 100!important; }

#scroller-news .images .left-scroller  { display:block; float:left; background-color: #000000; padding:65px 45px 0; width:50%; height:100%; box-sizing: border-box; -moz-box-sizing: border-box; }
#scroller-news .images .left-scroller h3  { color:#ffffff; font-size:23px; line-height:22px; margin:0; }
#scroller-news .images .left-scroller h4  { color:#DBC321; margin:5px 0 10px; font-size:17px; line-height:20px; }
#scroller-news .images .left-scroller p   { color:#ffffff; font-size:15px; line-height:16px; }
#scroller-news .images .left-scroller p a { color:#DBC321; font-style: italic; }


#scroller-news .images .right-scroller { background-color:#000000; display:block; float:right; width:50%; height:100%; box-sizing: border-box; -moz-box-sizing: border-box; }
#scroller-news .images .right-scroller img { display:block; margin:0 auto; height:100%; }

.scroller-control { position: relative; top: 8px; cursor: pointer; display: block; width: 15px!important; height: 15px!important; border: none!important; }
.scroller-control.float-left  { left: 390px; cursor: pointer; }
.scroller-control.float-right { right: 390px; cursor: pointer; }

#scroller-news #left-arrow  { cursor:pointer; position: absolute; left:0; top:8px; display:block; width:10px; }
#scroller-news #right-arrow { cursor:pointer; position: absolute; right:0; top:8px; display: block; width:10px; }

#scroller-news .img-controls { display: block; position: absolute; left:45px; bottom:30px; z-index:1000; }
#scroller-news .img-controls img { cursor: pointer; display:block; float:left; width:65px; height:50px; margin-right:5px; }
#scroller-news .img-controls img:last-of-type { margin:0; }
#scroller-news .img-controls img.selected { border:1px solid #DBC321; }

/* #Media Queries
================================================== */
    /* Larger than standard 960 (browsers) */
	@media only screen and (min-width: 1240px) {
        #scroller { height: 510px; width: 1180px; }
	}

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {}

	/* Tablet Portrait size to standard 960 (devices and browsers)*/
	@media only screen and (min-width: 768px) and (max-width: 959px) {
        #scroller { height: 360px; width:750px; }

        /* News Page
        =================================== */
        #scroller-news { height:290px; }
        #scroller-news > h1 { font-size:25px; line-height:25px; }
        #scroller-news .images .left-scroller { padding:45px 45px 0; }
        #scroller-news .images .left-scroller p { font-size:12px; }
		#scroller-news .img-controls { left:15px; }
		#scroller-news .controls { left:135px; }
	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
        #scroller { width:100%; height:145px; }
		#scroller .controls { bottom:-2px; right:5px; }
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
		#scroller { width:420px; height:190px; }
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {}