/*--------------------------------------------------------------
  About: www.garmin.com content (not to be confused with the global Garmin CSS library)
  Scope: Corporate content living on Marketing/Communications CMS
  Area: GGDC Market Pages
  Table of Contents:
  1) Slideshow Components
  2) Sub Navigation
  3) Carousel
  4) Videos
  5) Blog
  6) Overlay Market Specific Styles
  7) Media Queries
-------------------------------------------------------------- */
/* ***********************************************************************
   *                                                                     *
   *    Section 1: Generic Page
   *                                                                     *
   *********************************************************************** */
.container-bg {
  border-top: solid 1px #dcdcdc;
  background-color: #fcfcfc;
  background-image: linear-gradient(top, rgb(232,232,232) 0%, rgb(255,255,255) 200px);
  background-image: -o-linear-gradient(top, rgb(232,232,232) 0%, rgb(255,255,255) 200px);
  background-image: -moz-linear-gradient(top, rgb(232,232,232) 0%, rgb(255,255,255) 200px);
  background-image: -webkit-linear-gradient(top, rgb(232,232,232) 0%, rgb(255,255,255) 200px);
  background-image: -ms-linear-gradient(top, rgb(232,232,232) 0%, rgb(255,255,255) 200px);
  -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.6);
}
.no-bottom {
 margin-bottom: 0;
}
.market-border {
  position: relative;
}
.market-border:after {
  content: "";
  display: block;
  border-left: solid 1px #dcdcdc;
  position: absolute;
  bottom: 0;
  top: 0;
  left: -30px;
}
.boxable {
  min-height: 152px;
}
.market-links {
  padding: 0;
}
.market-links li {
  list-style: none;
}
#TB_overlay {
  z-index: 1000;
}
#TB_window {
  z-index: 10000;
  background:#FFF;
   -webkit-border-bottom-right-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
      -moz-border-bottom-right-radius: 4px;
       -moz-border-bottom-left-radius: 4px;
           border-bottom-right-radius: 4px;
            border-bottom-left-radius: 4px;
}
#TB_ajaxContent {
  padding: 20px
}
#TB_title {
  background-color: #e5e5e5;
  border-bottom: solid 1px #dcdcdc;
  height: 36px;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}
#TB_closeAjaxWindow {
  padding: 11px 10px 5px 0;
}

/* ***********************************************************************
   *                                                                     *
   *    End Section 1: Generic Page
   *                                                                     *
   *********************************************************************** */

/* ***********************************************************************
   *                                                                     *
   *    Section 1: Slideshow Components
   *                                                                     *
   *********************************************************************** */
.banner.market {
	width: 940px;
	padding-right: 0;
}
.banner, .promo-box {
  box-shadow: none;
}
.slide-show-container {
  position:relative;
}
.slide-show-nav {
  position:absolute;
  width:auto;
  height:16px;
  padding: 7px 2px 7px 7px;
  bottom:15px;
  left:15px;
  z-index:8;
  border: solid 1px #222;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
  background-color: #373737;
  background-image: linear-gradient(bottom, rgb(45,45,45) 0%, rgb(63,63,63) 100%);
  background-image: -o-linear-gradient(bottom, rgb(45,45,45) 0%, rgb(63,63,63) 100%);
  background-image: -moz-linear-gradient(bottom, rgb(45,45,45) 0%, rgb(63,63,63) 100%);
  background-image: -webkit-linear-gradient(bottom, rgb(45,45,45) 0%, rgb(63,63,63) 100%);
  background-image: -ms-linear-gradient(bottom, rgb(45,45,45) 0%, rgb(63,63,63) 100%); 
  background-image: -webkit-gradient(
  	linear,
  	left bottom,
  	left top,
  	color-stop(0, rgb(45,45,45)),
  	color-stop(1, rgb(63,63,63))
  );
  -webkit-box-shadow: inset 0 0 1px 0 rgba(255,255,255,.10), inset 0 1px 0 0 rgba(255,255,255,.1);
     -moz-box-shadow: inset 0 0 1px 0 rgba(255,255,255,.10), inset 0 1px 0 0 rgba(255,255,255,.1);
          box-shadow: inset 0 0 1px 0 rgba(255,255,255,.10), inset 0 1px 0 0 rgba(255,255,255,.1);
  opacity: .70;
}
.slide-show-nav:hover {
  opacity: 1;
}
.slide-show-nav a {
  display: block;
  float:left;
  margin-right:5px;
  width: 16px;
  height:16px;
  text-indent: -9999em;
  -webkit-border-radius: 8px;
     -moz-border-radius: 8px;
          border-radius: 8px;
  background-color: #e7e7e7;
  background-image: linear-gradient(bottom, rgb(231,231,231) 25%, rgb(179,179,179) 100%);
  background-image: -o-linear-gradient(bottom, rgb(231,231,231) 25%, rgb(179,179,179) 100%);
  background-image: -moz-linear-gradient(bottom, rgb(231,231,231) 25%, rgb(179,179,179) 100%);
  background-image: -webkit-linear-gradient(bottom, rgb(231,231,231) 25%, rgb(179,179,179) 100%);
  background-image: -ms-linear-gradient(bottom, rgb(231,231,231) 25%, rgb(179,179,179) 100%);
  
  background-image: -webkit-gradient(
  	linear,
  	left bottom,
  	left top,
  	color-stop(0.25, rgb(231,231,231)),
  	color-stop(1, rgb(179,179,179))
  );
  -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,1);
     -moz-box-shadow:inset 0 1px 1px rgba(0,0,0,1);
          box-shadow:inset 0 1px 1px rgba(0,0,0,1);
}
.slide-show-nav .activeSlide,
.slide-show-nav .activeSlide:hover {
  cursor: default;
  background-color: #007CC3;
  background-image: linear-gradient(bottom, rgb(0,124,195) 0%, rgb(46,163,230) 100%);
  background-image: -o-linear-gradient(bottom, rgb(0,124,195) 0%, rgb(46,163,230) 100%);
  background-image: -moz-linear-gradient(bottom, rgb(0,124,195) 0%, rgb(46,163,230) 100%);
  background-image: -webkit-linear-gradient(bottom, rgb(0,124,195) 0%, rgb(46,163,230) 100%);
  background-image: -ms-linear-gradient(bottom, rgb(0,124,195) 0%, rgb(46,163,230) 100%);
  background-image: -webkit-gradient(
  	linear,
  	left bottom,
  	left top,
  	color-stop(0, rgb(0,124,195)),
  	color-stop(1, rgb(46,163,230))
  );
}
#prev,
#next {
  display: none;
}
/* ***********************************************************************
   *                                                                     *
   *    Section 1: End Slideshow Components
   *                                                                     *
   *********************************************************************** */
/* ***********************************************************************
   *                                                                     *
   *    Section 2: Sub Navigation
   *                                                                     *
   *********************************************************************** */
.market-sub-nav { 
  padding: 0;
  width: 938px;
  border: solid 1px #aaa;
}
.market-sub-nav, .market-sub-nav li a {
  background-color: #e7e7e7;
  background-image: linear-gradient(bottom, rgb(225,225,225) 0%, rgb(240,240,240) 100%);
  background-image: -o-linear-gradient(bottom, rgb(225,225,225) 0%, rgb(240,240,240) 100%);
  background-image: -moz-linear-gradient(bottom, rgb(225,225,225) 0%, rgb(240,240,240) 100%);
  background-image: -webkit-linear-gradient(bottom, rgb(225,225,225) 0%, rgb(240,240,240) 100%);
  background-image: -ms-linear-gradient(bottom, rgb(225,225,225) 0%, rgb(240,240,240) 100%);
  background-image: -webkit-gradient(
  	linear,
  	left bottom,
  	left top,
  	color-stop(0, rgb(225,225,225)),
  	color-stop(1, rgb(240,240,240))
  );
  -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
     -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
          box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.market-sub-nav li {
  display: block;
  float: left;
  list-style: none;
}
.market-sub-nav li a {
  display: block;
  line-height: 25px;
  padding: 15px;
  border-right: solid 1px #bbb;
  border-left: solid 1px #fff;
  font-weight: bold;
  color: #555;
  text-shadow: 0 1px 0 rgba(255,255,255,.9);
}
.market-sub-nav li.first a {
  border-left: none;
}
.market-sub-nav li.last a {
  
}
.market-sub-nav li a:hover {
  text-decoration: none;
  border-left-color: #eee;
  background-color: #ddd;
  background-image: linear-gradient(bottom, rgb(215,215,215) 0%, rgb(230,230,230) 100%);
  background-image: -o-linear-gradient(bottom, rgb(215,215,215) 0%, rgb(230,230,230) 100%);
  background-image: -moz-linear-gradient(bottom, rgb(215,215,215) 0%, rgb(230,230,230) 100%);
  background-image: -webkit-linear-gradient(bottom, rgb(215,215,215) 0%, rgb(230,230,230) 100%);
  background-image: -ms-linear-gradient(bottom, rgb(215,215,215) 0%, rgb(230,230,230) 100%);
  background-image: -webkit-gradient(
  	linear,
  	left bottom,
  	left top,
  	color-stop(0, rgb(215,215,215)),
  	color-stop(1, rgb(230,230,230))
  );
  -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
     -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
          box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}
/* ***********************************************************************
   *                                                                     *
   *    End Section 2: Sub Navigation
   *                                                                     *
   *********************************************************************** */
/* ***********************************************************************
   *                                                                     *
   *    Section 3: Carousel
   *                                                                     *
   *********************************************************************** */
.carousel-container {
  position: relative;
  margin-top: 20px;
  padding-top: 10px;
}
.carousel {
  width: 940px;	
  height: 266px;
  overflow: hidden;
  position: relative;
  background: url(../images/carousel-bg.png) no-repeat 0 80%;
}
.carousel ul {
  padding: 0;
  position:absolute;
}
.carousel ul li {
  width: 313px;
  margin-right: 0;
}
.carousel ul li, .carousel ul li img {
  display: block;
  float: left;
}
.carousel ul li img {
  height: 250px;
  margin-right: 20px;
}
.carousel ul li h3 {
  margin-top: 20px;
}
.carousel ul li p {
}
.controls {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1000;
}
.pagination-status {
  display: none;
}
.pagination-buttons {
  float: right;
}
.pagination-buttons .prev, .pagination-buttons .next, .pagination-buttons .prev:link, .pagination-buttons .next:link, .pagination-buttons .prev:visited, .pagination-buttons .next:visited {
  font-size: 32px;
  padding: 0 7px 7px 7px;
  line-height: .55;
  float: left;
}
.page-btn, .page-btn:link, .page-btn:visited {
  font-family:'OpenSansLight','HelveticaNeue','HelveticaNeueu',Arial,sans-serif;
  padding: 8px;
  display: inline-block;
  border-style: solid;
  border-width: 1px;
}
.page-btn:hover, .page-btn:hover {
  text-decoration: none;
  cursor: pointer;
}
.page-btn, .page-btn:link, .page-btn:visited, .page-btn.active:hover, .page-btn.active:active, .page-btn.right.active:active,
.page-btn.disabled:hover, .page-btn.disabled.left:active, .page-btn.disabled.right:active {
  color: #555;
  border-color: #d1d1d1;
  background-color: #ededed;
  background-image:         linear-gradient(bottom, rgb(237,237,237) 0%, rgb(254,254,254) 100%);
  background-image:      -o-linear-gradient(bottom, rgb(237,237,237) 0%, rgb(254,254,254) 100%);
  background-image:    -moz-linear-gradient(bottom, rgb(237,237,237) 0%, rgb(254,254,254) 100%);
  background-image: -webkit-linear-gradient(bottom, rgb(237,237,237) 0%, rgb(254,254,254) 100%);
  background-image:     -ms-linear-gradient(bottom, rgb(237,237,237) 0%, rgb(254,254,254) 100%);
  background-image: -webkit-gradient(
  	linear,
  	left bottom,
  	left top,
  	color-stop(0, rgb(237,237,237)),
  	color-stop(1, rgb(254,254,254))
  );
  text-shadow: 0 1px 0 rgba(255,255,255,.85);
  -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,1);
     -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,1);
          box-shadow: inset 0 1px 0 rgba(255,255,255,1);
}
.page-btn:hover, .page-btn:hover {
  color: #555;
  background-color: #f4f4f4;
  background-image:         linear-gradient(bottom, rgb(244,244,244) 0%, rgb(255,255,255) 100%);
  background-image:      -o-linear-gradient(bottom, rgb(244,244,244) 0%, rgb(255,255,255) 100%);
  background-image:    -moz-linear-gradient(bottom, rgb(244,244,244) 0%, rgb(255,255,255) 100%);
  background-image: -webkit-linear-gradient(bottom, rgb(244,244,244) 0%, rgb(255,255,255) 100%);
  background-image:     -ms-linear-gradient(bottom, rgb(244,244,244) 0%, rgb(255,255,255) 100%);
  background-image: -webkit-gradient(
  	linear,
  	left bottom,
  	left top,
  	color-stop(0, rgb(244,244,244)),
  	color-stop(1, rgb(255,255,255))
  );
}
 
.page-btn.active:hover,
.page-btn.disabled:hover {
  cursor: default;
}
.page-btn:active {
  -webkit-box-shadow: inset 0 2px 2px rgba(0, 0, 0, .05), 0 1px 2px rgba(0, 0, 0, .05);
     -moz-box-shadow: inset 0 2px 2px rgba(0, 0, 0, .05), 0 1px 2px rgba(0, 0, 0, .05);
          box-shadow: inset 0 2px 2px rgba(0, 0, 0, .05), 0 1px 2px rgba(0, 0, 0, .05);
}
.page-btn.left {
  -webkit-border-top-left-radius: 2px;
     -moz-border-top-left-radius: 2px;
          border-top-left-radius: 2px;
  -webkit-border-bottom-left-radius: 2px;
     -moz-border-bottom-left-radius: 2px;
          border-bottom-left-radius: 2px;    
}
.page-btn.right {
  border-left: none;
  -webkit-border-top-right-radius: 2px;
     -moz-border-top-right-radius: 2px;
          border-top-right-radius: 2px;
  -webkit-border-bottom-right-radius: 2px;
     -moz-border-bottom-right-radius: 2px;
          border-bottom-right-radius: 2px;
  -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,1), inset 1px 0 0 rgba(255,255,255,1);
     -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,1), inset 1px 0 0 rgba(255,255,255,1);
          box-shadow: inset 0 1px 0 rgba(255,255,255,1), inset 1px 0 0 rgba(255,255,255,1);
}
.page-btn.right:active, .page-btn.left:active {
  -webkit-box-shadow: inset 0 2px 2px rgba(0, 0, 0, .05), 0 1px 2px rgba(0, 0, 0, .05);
     -moz-box-shadow: inset 0 2px 2px rgba(0, 0, 0, .05), 0 1px 2px rgba(0, 0, 0, .05);
          box-shadow: inset 0 2px 2px rgba(0, 0, 0, .05), 0 1px 2px rgba(0, 0, 0, .05);
}
/* ***********************************************************************
   *                                                                     *
   *    End Section 3: Carousel
   *                                                                     *
   *********************************************************************** */
/* ***********************************************************************
   *                                                                     *
   *    Section 4: Videos
   *                                                                     *
   *********************************************************************** */
.videos {
  padding-bottom: 20px;
  border-bottom: solid 1px #dcdcdc;
}
.videos.large-preview .ytThumb, .videos.large-preview .ytPropCont {
  width: 193px;
  margin-bottom: 5px;
}
.videos.large-preview .ytVideos li img {
 margin-left: -13px;
}

.videos.large-preview .ytThumbClip a:after {
  left: 61px;
}
/* ***********************************************************************
   *                                                                     *
   *    End Section 5: Blog
   *                                                                     *
   *********************************************************************** */
.feedburnerFeedBlock ul {
  padding: 0;
}
.feedburnerFeedBlock ul li {
  list-style: none;
  margin-bottom: 16px;
}
#creditfooter, .fbsubscribelink {
  display: none;
}
/* ***********************************************************************
   *                                                                     *
   *    Section 5: End Blog
   *                                                                     *
   *********************************************************************** */
/* ***********************************************************************
   *                                                                     *
   *    Section 6: Overlay Market Specific Styles
   *                                                                     *
   *********************************************************************** */
.overlay.video {
  width: 640px;
}
.overlay .details {
  width: 300px;
  margin-right: 20px;
}
.overlay .cta div img {
  display: block;
}
.overlay .cta div a {
  margin-left: 19px;
}
.overlay .cta div h5 {
  padding-left: 36px;
}
/* ***********************************************************************
   *                                                                     *
   *    End Section 6: Overlay Market Specific Styles
   *                                                                     *
   *********************************************************************** */
/* ***********************************************************************
   *                                                                     *
   *    Section 7: Media Queries
   *                                                                     *
   *********************************************************************** */
@media screen and (max-width: 767px){
body.explore .background-takeover{display:none;}
}
@media screen and (min-width: 768px){
.slide-show {width: 940px; min-height: 320px;}
}