/* CSS for jQuery Orbit Plugin 1.2.3
 * www.ZURB.com/playground
 * Copyright 2010, ZURB
 * Free to use under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php*/
	
@media screen and (max-width:1920px){
/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
================================================== */
#featured { height: 40px;background: #fff url('orbit/loading.gif') no-repeat center center;overflow: hidden; }
#featured>img,
#featured>div,
#featured>a { display: none; }
/* CONTAINER
   ================================================== */
div.orbit-wrapper { width: 1920px;height: 480px; position: relative;margin-top: -10px; margin-left:-4px;}
div.orbit {width: 1920px;height: 480px;/*position: relative;*/overflow: hidden; }
div.orbit>img {position: absolute;top: 0; left: 0;display: none;}
div.orbit>a { border: none;position: absolute;top: 0;left: 0; line-height: 0;display: none; }
.orbit>div { position: absolute; top: 0; left: 0;width: 100%; height: 100%;}
.orbit-pic1 {width: 150%;height: 400px; background-image: url('../../images/slide1.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic2 {width: 150%;height: 400px; background-image: url('../../images/slide2.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic3 {width: 150%;height: 400px; background-image: url('../../images/slide3.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic4 {width: 150%;height: 400px; background-image: url('../../images/slide4.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic5 {width: 150%;height: 400px; background-image: url('../../images/slide5.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic6 {width: 150%;height: 400px; background-image: url('../../images/slide6.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */
/* TIMER
   ================================================== */
div.timer {width: 40px; height: 40px;overflow: hidden; position: absolute; top: 10px; right: 10px;opacity: .6;cursor: pointer; z-index: 1001; }
span.rotator {display: block;width: 40px;height: 40px;position: absolute;top: 0; left: -20px; background: url(orbit/rotator-black.png) no-repeat;z-index: 3; }
span.mask {display: block; width: 20px;height: 40px;position: absolute; top: 0;right: 0;z-index: 2;overflow: hidden; }
span.rotator.move {left: 0 }
span.mask.move {width: 40px;left: 0;background: url(orbit/timer-black.png) repeat 0 0; }
span.pause {display: block;width: 40px;height: 40px;position: absolute;top: 0;left: 0; background: url(orbit/pause-black.png) no-repeat; z-index: 4;opacity: 0; }
span.pause.active {background: url(orbit/pause-black.png) no-repeat 0 -40px }
div.timer:hover span.pause,
span.pause.active {opacity: 1 }
/* CAPTIONS
   ================================================== */
.orbit-caption {display: none; font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; }
.orbit-wrapper .orbit-caption { background: #fff; background: rgba(0,0,0,.6);z-index: 1000;color: #fff;text-align: center;padding: 7px 0; font-size: 13px; position: absolute;right: 0;
bottom: 0;width: 100%; }
/* DIRECTIONAL NAV
   ================================================== */
div.slider-nav { display: block }
div.slider-nav span { width: 78px;height: 100px; text-indent: -9999px;position: absolute;z-index: 1000; top: 50%;margin-top: -50px;cursor: pointer; }
div.slider-nav span.right { background: url(orbit/right-arrow.png);right: 0; margin-right: -20px; }
div.slider-nav span.left { background: url(orbit/left-arrow.png);left: 0; margin-left: -20px; }	
/* BULLET NAV
   ================================================== */
.orbit-bullets {position: absolute;z-index: 1000; list-style: none; bottom: -40px;left: 50%;margin-left: -50px; padding: 0; }
.orbit-bullets li {float: left;margin-left: 5px; cursor: pointer;color: #999; text-indent: -9999px;background: url(orbit/bullets.jpg) no-repeat 4px 0; width: 13px; height: 12px; overflow: hidden; }
.orbit-bullets li.active {color: #222; background-position: -8px 0; }    
.orbit-bullets li.has-thumb { background: none; width: 100px; height: 75px; }
.orbit-bullets li.active.has-thumb {background-position: 0 0; border-top: 2px solid #000; }
}

@media screen and (max-width:1680px){
/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
================================================== */
#featured { height: 40px;background: #fff url('orbit/loading.gif') no-repeat center center;overflow: hidden; }
#featured>img,  
#featured>div,
#featured>a { display: none; }
/* CONTAINER
   ================================================== */
div.orbit-wrapper { width: 1680px;height: 410px; position: relative;margin-top: -10px; margin-left:-4px;}
div.orbit {width: 1680px;height: 410px;/*position: relative;*/overflow: hidden; }
div.orbit>img {position: absolute;top: 0; left: 0;display: none;}
div.orbit>a { border: none;position: absolute;top: 0;left: 0; line-height: 0;display: none; }
.orbit>div { position: absolute; top: 0; left: 0;width: 100%; height: 100%; }
.orbit-pic1 {width: 150%;height: 410px; background-image: url('../../images/slide1.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic2 {width: 150%;height: 410px; background-image: url('../../images/slide2.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic3 {width: 150%;height: 410px; background-image: url('../../images/slide3.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic4 {width: 150%;height: 410px; background-image: url('../../images/slide4.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic5 {width: 150%;height: 410px; background-image: url('../../images/slide5.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic6 {width: 150%;height: 410px; background-image: url('../../images/slide6.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */
/* TIMER
   ================================================== */
div.timer {width: 40px; height: 40px;overflow: hidden; position: absolute; top: 10px; right: 10px;opacity: .6;cursor: pointer; z-index: 1001; }
span.rotator {display: block;width: 40px;height: 40px;position: absolute;top: 0; left: -20px; background: url(orbit/rotator-black.png) no-repeat;z-index: 3; }
span.mask {display: block; width: 20px;height: 40px;position: absolute; top: 0;right: 0;z-index: 2;overflow: hidden; }
span.rotator.move {left: 0 }
span.mask.move {width: 40px;left: 0;background: url(orbit/timer-black.png) repeat 0 0; }
span.pause {display: block;width: 40px;height: 40px;position: absolute;top: 0;left: 0; background: url(orbit/pause-black.png) no-repeat; z-index: 4;opacity: 0; }
span.pause.active {background: url(orbit/pause-black.png) no-repeat 0 -40px }
div.timer:hover span.pause,
span.pause.active {opacity: 1 }
/* CAPTIONS
   ================================================== */
.orbit-caption {display: none; font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; }
.orbit-wrapper .orbit-caption { background: #fff; background: rgba(0,0,0,.6);z-index: 1000;color: #fff;text-align: center;padding: 7px 0; font-size: 13px; position: absolute;right: 0;
bottom: 0;width: 100%; }
/* DIRECTIONAL NAV
   ================================================== */
div.slider-nav { display: block }
div.slider-nav span { width: 78px;height: 100px; text-indent: -9999px;position: absolute;z-index: 1000; top: 50%;margin-top: -50px;cursor: pointer; }
div.slider-nav span.right { background: url(orbit/right-arrow.png);right: 0; margin-right: -20px; }
div.slider-nav span.left { background: url(orbit/left-arrow.png);left: 0; margin-left: -20px; }	
/* BULLET NAV
   ================================================== */
.orbit-bullets {position: absolute;z-index: 1000; list-style: none; bottom: -40px;left: 50%;margin-left: -50px; padding: 0; }
.orbit-bullets li {float: left;margin-left: 5px; cursor: pointer;color: #999; text-indent: -9999px;background: url(orbit/bullets.jpg) no-repeat 4px 0; width: 13px; height: 12px; overflow: hidden; }
.orbit-bullets li.active {color: #222; background-position: -8px 0; }    
.orbit-bullets li.has-thumb { background: none; width: 100px; height: 75px; }
.orbit-bullets li.active.has-thumb {background-position: 0 0; border-top: 2px solid #000; }
}

@media screen and (max-width:1440px){
/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
================================================== */
#featured { height: 40px;background: #fff url('orbit/loading.gif') no-repeat center center;overflow: hidden;}
#featured>img,  
#featured>div,
#featured>a { display: none; }
/* CONTAINER
   ================================================== */
div.orbit-wrapper { width: 1430px;height: 300px; position: absolute;margin-top: -10px; margin-left:-4px; margin-right:10px;}
div.orbit {width: 1430px;height: 300px;/*position: relative;*/overflow: hidden;}
div.orbit>img {position: absolute;top: 0; left: 0;display: none;}
div.orbit>a { border: none;position: absolute;top: 0;left: 0; line-height: 0;display: none;}
.orbit>div { position: absolute; top: 0; left: 0;width: 100%; height: 100%;}
.orbit-pic1 {width: 100%;height: 300px; background-image: url('../../images/slide1.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic2 {width: 100%;height: 300px; background-image: url('../../images/slide2.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic3 {width: 100%;height: 300px; background-image: url('../../images/slide3.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic4 {width: 100%;height: 300px; background-image: url('../../images/slide4.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic5 {width: 100%;height: 300px; background-image: url('../../images/slide5.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic6 {width: 100%;height: 300px; background-image: url('../../images/slide6.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */
/* TIMER
   ================================================== */
div.timer {width: 40px; height: 40px;overflow: hidden; position: absolute; top: 15px; right: 10px;opacity: .6;cursor: pointer; z-index: 1001; }
span.rotator {display: block;width: 40px;height: 40px;position: absolute;top: 0; left: -20px; background: url(orbit/rotator-black.png) no-repeat;z-index: 3; }
span.mask {display: block; width: 20px;height: 40px;position: absolute; top: 0;right: 0;z-index: 2;overflow: hidden; }
span.rotator.move {left: 0 }
span.mask.move {width: 40px;left: 0;background: url(orbit/timer-black.png) repeat 0 0; }
span.pause {display: block;width: 40px;height: 40px;position: absolute;top: 0;left: 0; background: url(orbit/pause-black.png) no-repeat; z-index: 4;opacity: 0; }
span.pause.active {background: url(orbit/pause-black.png) no-repeat 0 -40px }
div.timer:hover span.pause,
span.pause.active {opacity: 1 }
/* CAPTIONS
   ================================================== */
.orbit-caption {display: none; font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; }
.orbit-wrapper .orbit-caption { background: #fff; background: rgba(0,0,0,.6);z-index: 1000;color: #fff;text-align: center;padding: 7px 0; font-size: 13px; position: absolute;right: 0;
bottom: 0;width: 100%; }
/* DIRECTIONAL NAV
   ================================================== */
div.slider-nav { display: block }
div.slider-nav span { width: 78px;height: 100px; text-indent: -9999px;position: absolute;z-index: 1000; top: 50%;margin-top: -50px;cursor: pointer; }
div.slider-nav span.right { background: url(orbit/right-arrow.png);right: 0; margin-right: -20px; }
div.slider-nav span.left { background: url(orbit/left-arrow.png);left: 0; margin-left: -20px; }	
/* BULLET NAV
   ================================================== */
.orbit-bullets {position: absolute;z-index: 1000; list-style: none; bottom: -40px;left: 50%;margin-left: -50px; padding: 0; }
.orbit-bullets li {float: left;margin-left: 5px; cursor: pointer;color: #999; text-indent: -9999px;background: url(orbit/bullets.jpg) no-repeat 4px 0; width: 13px; height: 12px; overflow: hidden; }
.orbit-bullets li.active {color: #222; background-position: -8px 0; }    
.orbit-bullets li.has-thumb { background: none; width: 100px; height: 75px; }
.orbit-bullets li.active.has-thumb {background-position: 0 0; border-top: 2px solid #000; }
}



@media screen and (max-width:1366px){
/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
================================================== */
#featured { height: 40px;background: #fff url('orbit/loading.gif') no-repeat center center;overflow: hidden;}
#featured>img,  
#featured>div,
#featured>a { display: none; }
/* CONTAINER
   ================================================== */
div.orbit-wrapper { width: 1356px;height: 300px; position: absolute;margin-top: -10px; margin-left:-4px; margin-right:10px;}
div.orbit {width: 1356px;height: 300px;/*position: relative;*/overflow: hidden;}
div.orbit>img {position: absolute;top: 0; left: 0;display: none;}
div.orbit>a { border: none;position: absolute;top: 0;left: 0; line-height: 0;display: none;}
.orbit>div { position: absolute; top: 0; left: 0;width: 100%; height: 100%;}
.orbit-pic1 {width: 100%;height: 300px; background-image: url('../../images/slide1.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic2 {width: 100%;height: 300px; background-image: url('../../images/slide2.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic3 {width: 100%;height: 300px; background-image: url('../../images/slide3.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic4 {width: 100%;height: 300px; background-image: url('../../images/slide4.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic5 {width: 100%;height: 300px; background-image: url('../../images/slide5.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic6 {width: 100%;height: 300px; background-image: url('../../images/slide6.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */
/* TIMER
   ================================================== */
div.timer {width: 40px; height: 40px;overflow: hidden; position: absolute; top: 15px; right: 10px;opacity: .6;cursor: pointer; z-index: 1001; }
span.rotator {display: block;width: 40px;height: 40px;position: absolute;top: 0; left: -20px; background: url(orbit/rotator-black.png) no-repeat;z-index: 3; }
span.mask {display: block; width: 20px;height: 40px;position: absolute; top: 0;right: 0;z-index: 2;overflow: hidden; }
span.rotator.move {left: 0 }
span.mask.move {width: 40px;left: 0;background: url(orbit/timer-black.png) repeat 0 0; }
span.pause {display: block;width: 40px;height: 40px;position: absolute;top: 0;left: 0; background: url(orbit/pause-black.png) no-repeat; z-index: 4;opacity: 0; }
span.pause.active {background: url(orbit/pause-black.png) no-repeat 0 -40px }
div.timer:hover span.pause,
span.pause.active {opacity: 1 }
/* CAPTIONS
   ================================================== */
.orbit-caption {display: none; font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; }
.orbit-wrapper .orbit-caption { background: #fff; background: rgba(0,0,0,.6);z-index: 1000;color: #fff;text-align: center;padding: 7px 0; font-size: 13px; position: absolute;right: 0;
bottom: 0;width: 100%; }
/* DIRECTIONAL NAV
   ================================================== */
div.slider-nav { display: block }
div.slider-nav span { width: 78px;height: 100px; text-indent: -9999px;position: absolute;z-index: 1000; top: 50%;margin-top: -50px;cursor: pointer; }
div.slider-nav span.right { background: url(orbit/right-arrow.png);right: 0; margin-right: -20px; }
div.slider-nav span.left { background: url(orbit/left-arrow.png);left: 0; margin-left: -20px; }	
/* BULLET NAV
   ================================================== */
.orbit-bullets {position: absolute;z-index: 1000; list-style: none; bottom: -40px;left: 50%;margin-left: -50px; padding: 0; }
.orbit-bullets li {float: left;margin-left: 5px; cursor: pointer;color: #999; text-indent: -9999px;background: url(orbit/bullets.jpg) no-repeat 4px 0; width: 13px; height: 12px; overflow: hidden; }
.orbit-bullets li.active {color: #222; background-position: -8px 0; }    
.orbit-bullets li.has-thumb { background: none; width: 100px; height: 75px; }
.orbit-bullets li.active.has-thumb {background-position: 0 0; border-top: 2px solid #000; }
}

	
@media screen and (max-width:1280px){
/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
================================================== */
#featured { height: 40px;background: #fff url('orbit/loading.gif') no-repeat center center;overflow: hidden; }
#featured>img,  
#featured>div,
#featured>a { display: none; }
/* CONTAINER
   ================================================== */
div.orbit-wrapper { width: 1280px;height: 275px; position: relative;margin-top: -10px; margin-left:-4px;}
div.orbit {width: 1280px;height: 275px;/*position: relative;*/overflow: hidden; }
div.orbit>img {position: absolute;top: 0; left: 0;display: none;}
div.orbit>a { border: none;position: absolute;top: 0;left: 0; line-height: 0;display: none; }
.orbit>div { position: absolute; top: 0; left: 0;width: 100%; height: 100%; }
.orbit-pic1 {width: 80%;height: 330px; background-image: url('../../images/slide1.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic2 {width: 80%;height: 330px; background-image: url('../../images/slide2.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic3 {width: 80%;height: 330px; background-image: url('../../images/slide3.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic4 {width: 80%;height: 330px; background-image: url('../../images/slide4.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic5 {width: 80%;height: 330px; background-image: url('../../images/slide5.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic6 {width: 80%;height: 330px; background-image: url('../../images/slide6.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */
/* TIMER
   ================================================== */
div.timer {width: 40px; height: 40px;overflow: hidden; position: absolute; top: 10px; right: 10px;opacity: .6;cursor: pointer; z-index: 1001; }
span.rotator {display: block;width: 40px;height: 40px;position: absolute;top: 0; left: -20px; background: url(orbit/rotator-black.png) no-repeat;z-index: 3; }
span.mask {display: block; width: 20px;height: 40px;position: absolute; top: 0;right: 0;z-index: 2;overflow: hidden; }
span.rotator.move {left: 0 }
span.mask.move {width: 40px;left: 0;background: url(orbit/timer-black.png) repeat 0 0; }
span.pause {display: block;width: 40px;height: 40px;position: absolute;top: 0;left: 0; background: url(orbit/pause-black.png) no-repeat; z-index: 4;opacity: 0; }
span.pause.active {background: url(orbit/pause-black.png) no-repeat 0 -40px }
div.timer:hover span.pause,
span.pause.active {opacity: 1 }
/* CAPTIONS
   ================================================== */
.orbit-caption {display: none; font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; }
.orbit-wrapper .orbit-caption { background: #fff; background: rgba(0,0,0,.6);z-index: 1000;color: #fff;text-align: center;padding: 7px 0; font-size: 13px; position: absolute;right: 0;
bottom: 0;width: 100%; }
/* DIRECTIONAL NAV
   ================================================== */
div.slider-nav { display: block }
div.slider-nav span { width: 78px;height: 100px; text-indent: -9999px;position: absolute;z-index: 1000; top: 50%;margin-top: -50px;cursor: pointer; }
div.slider-nav span.right { background: url(orbit/right-arrow.png);right: 0; margin-right: -20px; }
div.slider-nav span.left { background: url(orbit/left-arrow.png);left: 0; margin-left: -20px; }	
/* BULLET NAV
   ================================================== */
.orbit-bullets {position: absolute;z-index: 1000; list-style: none; bottom: -40px;left: 50%;margin-left: -50px; padding: 0; }
.orbit-bullets li {float: left;margin-left: 5px; cursor: pointer;color: #999; text-indent: -9999px;background: url(orbit/bullets.jpg) no-repeat 4px 0; width: 13px; height: 12px; overflow: hidden; }
.orbit-bullets li.active {color: #222; background-position: -8px 0; }    
.orbit-bullets li.has-thumb { background: none; width: 100px; height: 75px; }
.orbit-bullets li.active.has-thumb {background-position: 0 0; border-top: 2px solid #000; }
}

@media screen and (max-width:1024px){
/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
================================================== */
#featured { height: 40px;background: #fff url('orbit/loading.gif') no-repeat center center;overflow: hidden; }
#featured>img,  
#featured>div,
#featured>a { display: none; }
/* CONTAINER
   ================================================== */
div.orbit-wrapper { width: 1024px;height: 275px; position: relative;margin-top: -10px; margin-left:-4px;}
div.orbit {width: 1024px;height: 275px;/*position: relative;*/overflow: hidden; }
div.orbit>img {position: absolute;top: 0; left: 0;display: none;}
div.orbit>a { border: none;position: absolute;top: 0;left: 0; line-height: 0;display: none; }
.orbit>div { position: absolute; top: 0; left: 0;width: 100%; height: 100%; }
.orbit-pic1 {width: 65%;height: 265px; background-image: url('../../images/slide1.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic2 {width: 65%;height: 265px; background-image: url('../../images/slide2.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic3 {width: 65%;height: 265px; background-image: url('../../images/slide3.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic4 {width: 65%;height: 265px; background-image: url('../../images/slide4.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic5 {width: 65%;height: 265px; background-image: url('../../images/slide5.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic6 {width: 65%;height: 265px; background-image: url('../../images/slide6.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */
/* TIMER
   ================================================== */
div.timer {width: 40px; height: 40px;overflow: hidden; position: absolute; top: 10px; right: 10px;opacity: .6;cursor: pointer; z-index: 1001; }
span.rotator {display: block;width: 40px;height: 40px;position: absolute;top: 0; left: -20px; background: url(orbit/rotator-black.png) no-repeat;z-index: 3; }
span.mask {display: block; width: 20px;height: 40px;position: absolute; top: 0;right: 0;z-index: 2;overflow: hidden; }
span.rotator.move {left: 0 }
span.mask.move {width: 40px;left: 0;background: url(orbit/timer-black.png) repeat 0 0; }
span.pause {display: block;width: 40px;height: 40px;position: absolute;top: 0;left: 0; background: url(orbit/pause-black.png) no-repeat; z-index: 4;opacity: 0; }
span.pause.active {background: url(orbit/pause-black.png) no-repeat 0 -40px }
div.timer:hover span.pause,
span.pause.active {opacity: 1 }
/* CAPTIONS
   ================================================== */
.orbit-caption {display: none; font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; }
.orbit-wrapper .orbit-caption { background: #fff; background: rgba(0,0,0,.6);z-index: 1000;color: #fff;text-align: center;padding: 7px 0; font-size: 13px; position: absolute;right: 0;
bottom: 0;width: 100%; }
/* DIRECTIONAL NAV
   ================================================== */
div.slider-nav { display: block }
div.slider-nav span { width: 78px;height: 100px; text-indent: -9999px;position: absolute;z-index: 1000; top: 50%;margin-top: -50px;cursor: pointer; }
div.slider-nav span.right { background: url(orbit/right-arrow.png);right: 0; margin-right: -20px; }
div.slider-nav span.left { background: url(orbit/left-arrow.png);left: 0; margin-left: -20px; }	
/* BULLET NAV
   ================================================== */
.orbit-bullets {position: absolute;z-index: 1000; list-style: none; bottom: -40px;left: 50%;margin-left: -50px; padding: 0; }
.orbit-bullets li {float: left;margin-left: 5px; cursor: pointer;color: #999; text-indent: -9999px;background: url(orbit/bullets.jpg) no-repeat 4px 0; width: 13px; height: 12px; overflow: hidden; }
.orbit-bullets li.active {color: #222; background-position: -8px 0; }    
.orbit-bullets li.has-thumb { background: none; width: 100px; height: 75px; }
.orbit-bullets li.active.has-thumb {background-position: 0 0; border-top: 2px solid #000; }
}


@media screen and (max-width:980px){
/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
================================================== */
#featured { height: 40px;background: #fff url('orbit/loading.gif') no-repeat center center;overflow: hidden; }
#featured>img,  
#featured>div,
#featured>a { display: none; }
/* CONTAINER
   ================================================== */
div.orbit-wrapper { width: 980px;height: 295px; position: relative;margin-top: -10px; margin-left:-4px;}
div.orbit {width: 980px;height: 295px;/*position: relative;*/overflow: hidden; }
div.orbit>img {position: absolute;top: 0; left: 0;display: none;}
div.orbit>a { border: none;position: absolute;top: 0;left: 0; line-height: 0;display: none; }
.orbit>div { position: absolute; top: 0; left: 0;width: 100%; height: 100%; }
.orbit-pic1 {width: 80%;height: 295px; background-image: url('../../images/slide1.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic2 {width: 80%;height: 295px; background-image: url('../../images/slide2.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic3 {width: 80%;height: 295px; background-image: url('../../images/slide3.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic4 {width: 80%;height: 295px; background-image: url('../../images/slide4.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic5 {width: 80%;height: 295px; background-image: url('../../images/slide5.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic6 {width: 80%;height: 295px; background-image: url('../../images/slide6.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */
/* TIMER
   ================================================== */
div.timer {width: 40px; height: 40px;overflow: hidden; position: absolute; top: 10px; right: 10px;opacity: .6;cursor: pointer; z-index: 1001; }
span.rotator {display: block;width: 40px;height: 40px;position: absolute;top: 0; left: -20px; background: url(orbit/rotator-black.png) no-repeat;z-index: 3; }
span.mask {display: block; width: 20px;height: 40px;position: absolute; top: 0;right: 0;z-index: 2;overflow: hidden; }
span.rotator.move {left: 0 }
span.mask.move {width: 40px;left: 0;background: url(orbit/timer-black.png) repeat 0 0; }
span.pause {display: block;width: 40px;height: 40px;position: absolute;top: 0;left: 0; background: url(orbit/pause-black.png) no-repeat; z-index: 4;opacity: 0; }
span.pause.active {background: url(orbit/pause-black.png) no-repeat 0 -40px }
div.timer:hover span.pause,
span.pause.active {opacity: 1 }
/* CAPTIONS
   ================================================== */
.orbit-caption {display: none; font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; }
.orbit-wrapper .orbit-caption { background: #fff; background: rgba(0,0,0,.6);z-index: 1000;color: #fff;text-align: center;padding: 7px 0; font-size: 13px; position: absolute;right: 0;
bottom: 0;width: 100%; }
/* DIRECTIONAL NAV
   ================================================== */
div.slider-nav { display: block }
div.slider-nav span { width: 78px;height: 100px; text-indent: -9999px;position: absolute;z-index: 1000; top: 50%;margin-top: -50px;cursor: pointer; }
div.slider-nav span.right { background: url(orbit/right-arrow.png);right: 0; margin-right: -20px; }
div.slider-nav span.left { background: url(orbit/left-arrow.png);left: 0; margin-left: -20px; }	
/* BULLET NAV
   ================================================== */
.orbit-bullets {position: absolute;z-index: 1000; list-style: none; bottom: -40px;left: 50%;margin-left: -50px; padding: 0; }
.orbit-bullets li {float: left;margin-left: 5px; cursor: pointer;color: #999; text-indent: -9999px;background: url(orbit/bullets.jpg) no-repeat 4px 0; width: 13px; height: 12px; overflow: hidden; }
.orbit-bullets li.active {color: #222; background-position: -8px 0; }    
.orbit-bullets li.has-thumb { background: none; width: 100px; height: 75px; }
.orbit-bullets li.active.has-thumb {background-position: 0 0; border-top: 2px solid #000; }
}

@media screen and (max-width:800px){
/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
================================================== */
#featured { height: 40px;background: #fff url('orbit/loading.gif') no-repeat center center;overflow: hidden; }
#featured>img,  
#featured>div,
#featured>a { display: none; }
/* CONTAINER
   ================================================== */
div.orbit-wrapper { width: 800px;height: 225px; position: relative;margin-top: -10px; margin-left:-4px;}
div.orbit {width: 800px;height: 225px;/*position: relative;*/overflow: hidden; }
div.orbit>img {position: absolute;top: 0; left: 0;display: none;}
div.orbit>a { border: none;position: absolute;top: 0;left: 0; line-height: 0;display: none; }
.orbit>div { position: absolute; top: 0; left: 0;width: 100%; height: 100%; }
.orbit-pic1 {width: 65%;height: 225px; background-image: url('../../images/slide1.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic2 {width: 65%;height: 225px; background-image: url('../../images/slide2.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic3 {width: 65%;height: 225px; background-image: url('../../images/slide3.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic4 {width: 65%;height: 225px; background-image: url('../../images/slide4.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic5 {width: 65%;height: 225px; background-image: url('../../images/slide5.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic6 {width: 65%;height: 225px; background-image: url('../../images/slide6.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */
/* TIMER
   ================================================== */
div.timer {width: 40px; height: 40px;overflow: hidden; position: absolute; top: 10px; right: 10px;opacity: .6;cursor: pointer; z-index: 1001; }
span.rotator {display: block;width: 40px;height: 40px;position: absolute;top: 0; left: -20px; background: url(orbit/rotator-black.png) no-repeat;z-index: 3; }
span.mask {display: block; width: 20px;height: 40px;position: absolute; top: 0;right: 0;z-index: 2;overflow: hidden; }
span.rotator.move {left: 0 }
span.mask.move {width: 40px;left: 0;background: url(orbit/timer-black.png) repeat 0 0; }
span.pause {display: block;width: 40px;height: 40px;position: absolute;top: 0;left: 0; background: url(orbit/pause-black.png) no-repeat; z-index: 4;opacity: 0; }
span.pause.active {background: url(orbit/pause-black.png) no-repeat 0 -40px }
div.timer:hover span.pause,
span.pause.active {opacity: 1 }
/* CAPTIONS
   ================================================== */
.orbit-caption {display: none; font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; }
.orbit-wrapper .orbit-caption { background: #fff; background: rgba(0,0,0,.6);z-index: 1000;color: #fff;text-align: center;padding: 7px 0; font-size: 13px; position: absolute;right: 0;
bottom: 0;width: 100%; }
/* DIRECTIONAL NAV
   ================================================== */
div.slider-nav { display: block }
div.slider-nav span { width: 78px;height: 100px; text-indent: -9999px;position: absolute;z-index: 1000; top: 50%;margin-top: -50px;cursor: pointer; }
div.slider-nav span.right { background: url(orbit/right-arrow.png);right: 0; margin-right: -20px; }
div.slider-nav span.left { background: url(orbit/left-arrow.png);left: 0; margin-left: -20px; }	
/* BULLET NAV
   ================================================== */
.orbit-bullets {position: absolute;z-index: 1000; list-style: none; bottom: -40px;left: 50%;margin-left: -50px; padding: 0; }
.orbit-bullets li {float: left;margin-left: 5px; cursor: pointer;color: #999; text-indent: -9999px;background: url(orbit/bullets.jpg) no-repeat 4px 0; width: 13px; height: 12px; overflow: hidden; }
.orbit-bullets li.active {color: #222; background-position: -8px 0; }    
.orbit-bullets li.has-thumb { background: none; width: 100px; height: 75px; }
.orbit-bullets li.active.has-thumb {background-position: 0 0; border-top: 2px solid #000; }
}

@media screen and (max-width:768px){
/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
================================================== */
#featured { height: 40px;background: #fff url('orbit/loading.gif') no-repeat center center;overflow: hidden; }
#featured>img,  
#featured>div,
#featured>a { display: none; }
/* CONTAINER
   ================================================== */
div.orbit-wrapper { width: 768px;height: 200px; position: relative;margin-top: -10px; margin-left:-4px;}
div.orbit {width: 768px;height: 200px;/*position: relative;*/overflow: hidden; }
div.orbit>img {position: absolute;top: 0; left: 0;display: none;}
div.orbit>a { border: none;position: absolute;top: 0;left: 0; line-height: 0;display: none; }
.orbit>div { position: absolute; top: 0; left: 0;width: 100%; height: 100%; }
.orbit-pic1 {width: 60%;height: 200px; background-image: url('../../images/slide1.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic2 {width: 60%;height: 200px; background-image: url('../../images/slide2.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic3 {width: 60%;height: 200px; background-image: url('../../images/slide3.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic4 {width: 60%;height: 200px; background-image: url('../../images/slide4.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic5 {width: 60%;height: 200px; background-image: url('../../images/slide5.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic6 {width: 60%;height: 200px; background-image: url('../../images/slide6.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */
/* TIMER
   ================================================== */
div.timer {width: 40px; height: 40px;overflow: hidden; position: absolute; top: 10px; right: 10px;opacity: .6;cursor: pointer; z-index: 1001; }
span.rotator {display: block;width: 40px;height: 40px;position: absolute;top: 0; left: -20px; background: url(orbit/rotator-black.png) no-repeat;z-index: 3; }
span.mask {display: block; width: 20px;height: 40px;position: absolute; top: 0;right: 0;z-index: 2;overflow: hidden; }
span.rotator.move {left: 0 }
span.mask.move {width: 40px;left: 0;background: url(orbit/timer-black.png) repeat 0 0; }
span.pause {display: block;width: 40px;height: 40px;position: absolute;top: 0;left: 0; background: url(orbit/pause-black.png) no-repeat; z-index: 4;opacity: 0; }
span.pause.active {background: url(orbit/pause-black.png) no-repeat 0 -40px }
div.timer:hover span.pause,
span.pause.active {opacity: 1 }
/* CAPTIONS
   ================================================== */
.orbit-caption {display: none; font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; }
.orbit-wrapper .orbit-caption { background: #fff; background: rgba(0,0,0,.6);z-index: 1000;color: #fff;text-align: center;padding: 7px 0; font-size: 13px; position: absolute;right: 0;
bottom: 0;width: 100%; }
/* DIRECTIONAL NAV
   ================================================== */
div.slider-nav { display: block }
div.slider-nav span { width: 78px;height: 100px; text-indent: -9999px;position: absolute;z-index: 1000; top: 50%;margin-top: -50px;cursor: pointer; }
div.slider-nav span.right { background: url(orbit/right-arrow.png);right: 0; margin-right: -20px; }
div.slider-nav span.left { background: url(orbit/left-arrow.png);left: 0; margin-left: -20px; }	
/* BULLET NAV
   ================================================== */
.orbit-bullets {position: absolute;z-index: 1000; list-style: none; bottom: -40px;left: 50%;margin-left: -50px; padding: 0; }
.orbit-bullets li {float: left;margin-left: 5px; cursor: pointer;color: #999; text-indent: -9999px;background: url(orbit/bullets.jpg) no-repeat 4px 0; width: 13px; height: 12px; overflow: hidden; }
.orbit-bullets li.active {color: #222; background-position: -8px 0; }    
.orbit-bullets li.has-thumb { background: none; width: 100px; height: 75px; }
.orbit-bullets li.active.has-thumb {background-position: 0 0; border-top: 2px solid #000; }
}

@media screen and (max-width:320px){
/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
================================================== */
#featured { height: 40px;background: #fff url('orbit/loading.gif') no-repeat center center;overflow: hidden; }
#featured>img,  
#featured>div,
#featured>a { display: none; }
/* CONTAINER
   ================================================== */
div.orbit-wrapper { width: 320px;height: 100px; position: relative;margin-top: -10px; margin-left:-4px;}
div.orbit {width: 320px;height: 100px;/*position: relative;*/overflow: hidden; }
div.orbit>img {position: absolute;top: 0; left: 0;display: none;}
div.orbit>a { border: none;position: absolute;top: 0;left: 0; line-height: 0;display: none; }
.orbit>div { position: absolute; top: 0; left: 0;width: 100%; height: 100%; }
.orbit-pic1 {width: 35%;height: 100px; background-image: url('../../images/slide1.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic2 {width: 35%;height: 100px; background-image: url('../../images/slide2.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic3 {width: 35%;height: 100px; background-image: url('../../images/slide3.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic4 {width: 35%;height: 100px; background-image: url('../../images/slide4.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic5 {width: 35%;height: 100px; background-image: url('../../images/slide5.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic6 {width: 35%;height: 100px; background-image: url('../../images/slide6.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */
/* TIMER
   ================================================== */
div.timer {width: 40px; height: 40px;overflow: hidden; position: absolute; top: 10px; right: 10px;opacity: .6;cursor: pointer; z-index: 1001; }
span.rotator {display: block;width: 40px;height: 40px;position: absolute;top: 0; left: -20px; background: url(orbit/rotator-black.png) no-repeat;z-index: 3; }
span.mask {display: block; width: 20px;height: 40px;position: absolute; top: 0;right: 0;z-index: 2;overflow: hidden; }
span.rotator.move {left: 0 }
span.mask.move {width: 40px;left: 0;background: url(orbit/timer-black.png) repeat 0 0; }
span.pause {display: block;width: 40px;height: 40px;position: absolute;top: 0;left: 0; background: url(orbit/pause-black.png) no-repeat; z-index: 4;opacity: 0; }
span.pause.active {background: url(orbit/pause-black.png) no-repeat 0 -40px }
div.timer:hover span.pause,
span.pause.active {opacity: 1 }
/* CAPTIONS
   ================================================== */
.orbit-caption {display: none; font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; }
.orbit-wrapper .orbit-caption { background: #fff; background: rgba(0,0,0,.6);z-index: 1000;color: #fff;text-align: center;padding: 7px 0; font-size: 13px; position: absolute;right: 0;
bottom: 0;width: 100%; }
/* DIRECTIONAL NAV
   ================================================== */
div.slider-nav { display: block }
div.slider-nav span { width: 78px;height: 100px; text-indent: -9999px;position: absolute;z-index: 1000; top: 50%;margin-top: -50px;cursor: pointer; }
div.slider-nav span.right { background: url(orbit/right-arrow.png);right: 0; margin-right: -20px; }
div.slider-nav span.left { background: url(orbit/left-arrow.png);left: 0; margin-left: -20px; }	
/* BULLET NAV
   ================================================== */
.orbit-bullets {position: absolute;z-index: 1000; list-style: none; bottom: -40px;left: 50%;margin-left: -50px; padding: 0; }
.orbit-bullets li {float: left;margin-left: 5px; cursor: pointer;color: #999; text-indent: -9999px;background: url(orbit/bullets.jpg) no-repeat 4px 0; width: 13px; height: 12px; overflow: hidden; }
.orbit-bullets li.active {color: #222; background-position: -8px 0; }    
.orbit-bullets li.has-thumb { background: none; width: 100px; height: 75px; }
.orbit-bullets li.active.has-thumb {background-position: 0 0; border-top: 2px solid #000; }
}

@media screen and (max-width:280px){
/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
================================================== */
#featured { height: 40px;background: #fff url('orbit/loading.gif') no-repeat center center;overflow: hidden; }
#featured>img,  
#featured>div,
#featured>a { display: none; }
/* CONTAINER
   ================================================== */
div.orbit-wrapper { width: 280px;height: 80px; position: relative;margin-top: -10px; margin-left:-4px;}
div.orbit {width: 280px;height: 80px;/*position: relative;*/overflow: hidden; }
div.orbit>img {position: absolute;top: 0; left: 0;display: none;}
div.orbit>a { border: none;position: absolute;top: 0;left: 0; line-height: 0;display: none; }
.orbit>div { position: absolute; top: 0; left: 0;width: 100%; height: 100%; }
.orbit-pic1 {width: 25%;height: 80px; background-image: url('../../images/slide1.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic2 {width: 25%;height: 80px; background-image: url('../../images/slide2.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic3 {width: 25%;height: 80px; background-image: url('../../images/slide3.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic4 {width: 25%;height: 80px; background-image: url('../../images/slide4.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic5 {width: 25%;height: 80px; background-image: url('../../images/slide5.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
.orbit-pic6 {width: 25%;height: 80px; background-image: url('../../images/slide6.png'); background-size: 100% 100%;border: 1px #2ab1eb;}
/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */
/* TIMER
   ================================================== */
div.timer {width: 40px; height: 40px;overflow: hidden; position: absolute; top: 10px; right: 10px;opacity: .6;cursor: pointer; z-index: 1001; }
span.rotator {display: block;width: 40px;height: 40px;position: absolute;top: 0; left: -20px; background: url(orbit/rotator-black.png) no-repeat;z-index: 3; }
span.mask {display: block; width: 20px;height: 40px;position: absolute; top: 0;right: 0;z-index: 2;overflow: hidden; }
span.rotator.move {left: 0 }
span.mask.move {width: 40px;left: 0;background: url(orbit/timer-black.png) repeat 0 0; }
span.pause {display: block;width: 40px;height: 40px;position: absolute;top: 0;left: 0; background: url(orbit/pause-black.png) no-repeat; z-index: 4;opacity: 0; }
span.pause.active {background: url(orbit/pause-black.png) no-repeat 0 -40px }
div.timer:hover span.pause,
span.pause.active {opacity: 1 }
/* CAPTIONS
   ================================================== */
.orbit-caption {display: none; font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; }
.orbit-wrapper .orbit-caption { background: #fff; background: rgba(0,0,0,.6);z-index: 1000;color: #fff;text-align: center;padding: 7px 0; font-size: 13px; position: absolute;right: 0;
bottom: 0;width: 100%; }
/* DIRECTIONAL NAV
   ================================================== */
div.slider-nav { display: block }
div.slider-nav span { width: 78px;height: 100px; text-indent: -9999px;position: absolute;z-index: 1000; top: 50%;margin-top: -50px;cursor: pointer; }
div.slider-nav span.right { background: url(orbit/right-arrow.png);right: 0; margin-right: -20px; }
div.slider-nav span.left { background: url(orbit/left-arrow.png);left: 0; margin-left: -20px; }	
/* BULLET NAV
   ================================================== */
.orbit-bullets {position: absolute;z-index: 1000; list-style: none; bottom: -40px;left: 50%;margin-left: -50px; padding: 0; }
.orbit-bullets li {float: left;margin-left: 5px; cursor: pointer;color: #999; text-indent: -9999px;background: url(orbit/bullets.jpg) no-repeat 4px 0; width: 13px; height: 12px; overflow: hidden; }
.orbit-bullets li.active {color: #222; background-position: -8px 0; }    
.orbit-bullets li.has-thumb { background: none; width: 100px; height: 75px; }
.orbit-bullets li.active.has-thumb {background-position: 0 0; border-top: 2px solid #000; }
}