/**
 * Icon list
 */

/* Glyphicons */
.glyphicons-list {
  list-style: none;
  padding: 0;
}

.glyphicons-list li {
  display: inline-block;
  float: left;
  width: 12.5%;
  height: 115px;
  background-color: #f8f8f8;
  border: 1px solid #fff;
  padding: 10px;
  transition: .3s ease;
}

.glyphicons-list li:hover {
  background-color: #eee;
}

.glyphicons-list .glyphicon {
  display: block;
  text-align: center;
  font-size: 25px;
  color: #222;
}

.glyphicons-list .glyphicon-class {
  display: block;
  text-align: center;
  margin-top: 10px;
  line-height: 16px;
  font-size: 13px;
}

/* Font Awesome */
.fa-page-header {
  font-size: 20px;
  padding-bottom: 15px;
  border-bottom: 1px solid #f1f1f1;
}

.fontawesome-icon-list .fa-hover {
  margin-bottom: 5px;
  transition: .3s ease;
}

.fontawesome-icon-list .fa-hover:hover {
  background-color: #f8f8f8;
}

.fontawesome-icon-list .fa-hover .fa {
  width: 25px;
  color: #222;
}


@media (max-width: 767px) {
  .glyphicons-list li {
    width: 25%;
  }
}


/**
 * Prism supported languages
 */
.prism-languages {
  list-style: none;
  padding: 0;
  margin: 20px 0;
}

.prism-languages li {
  width: 33.3333%;
  float: left;
}

.prism-languages li code {
  margin-left: 8px;
}

@media (max-width: 991px) {

  .prism-languages li {
    width: 50%;
  }

}


/**
 * Code window spacer
 */
.window-content .btn {
  margin-bottom: 6px;
}

/**
 *   Exotool site specific
 */

/* the background video */
.background_video2 {
    height:100%;
    width:100%;
    position:absolute;
    top:0px;
    left:0px;
    z-index:1500;
    padding:0;
    margin:0;*/
/*    position: fixed;*/
    right: 0;
}
.background_video {
    width: 100%;
    z-index: 1;
/*    position: fixed; */
}
/* the background banner image*/
.banner.banner-full-height {
    height: 56vw;
}
/* for the home page we need a background on the banner because we are showing a video in "fixed"
  position. so on some devices the non-fixed image background shows when page pulled, so we need a 
 a background image */
.banner.banner-full-height.exotool_site_banner,
.banner.banner-sm.exotool_site_banner {
   background-image:url(../../site_assets/snow.jpg);
   background-position: center top; 
   background-size: 100vw auto;
}
/* except for the homepage, we dont want the titles going over the center of the background image */ 
.banner.banner-sm.exotool_site_banner:not(.homepage) {
   max-height: 22vw;
   line-height: 15px;
}


/* now we also need a background on the navbar where there is no banner*/
.navbar.navbar-default.nobanner  {
   background-image:url(../../site_assets/snow.jpg);
   background-position: center top;
   background-size: 100vw auto;
}

/*
 * Pricing stuff
 */
.ptb-90{
    padding: 80px 0px
}
.pricing-container > .col-lg-4, .pricing-container > .col-lg-3, .pricing-container > .col-md-4, .pricing-container > .col-md-3, .pricing-container > .col-sm-4, .pricing-container > .col-sm-3 {
    padding-left: 0;
    padding-right: 0;
}
.pricing-content {
    margin-bottom: 30px;
    margin-top: 50px;
    text-align: center;
    color: #777777;
    border: 1px solid #eee;
    line-height: 30px;
}
.pricing-content .price {
    padding: 40px 20px 20px 20px;
    font-size: 60px;
    font-weight: 900;
    color: #FFFFFF;
}
.pricing-content .price {
    background-color: #24394c;
}
.pricing-content .price small {
    color: #4d7192;
    display: block;
    font-size: 12px;
    margin-top: 22px;
}
.pricing-content .type {
    background-color: #108fcf;
}
.pricing-content .type {
    padding: 50px 20px;
    font-weight: 900;
    text-transform: uppercase;
    font-size: 24px;
    color: #fff;
}
.pricing-content ul {
    list-style: none;
    margin: 0;
    text-align: center;
    padding-left: 0px;
}
.pricing-content ul li {
    padding-top: 20px;
    padding-bottom: 20px;
    cursor: pointer;
    border-bottom: 1px solid #eee;
}
.pricing-content ul li i {
    margin-right: 5px;
}
.pricing-content.popular {
    margin-top: 10px;
}
.pricing-content ul.capabilities li {
    padding-top: 0px;
    padding-bottom: 0px;
    border-bottom: none;
}
.pricing-content ul.capabilities {
    border-bottom: 1px solid #eee;
}
.callforprice {
	font-size: 14pt;
}
.price a:hover{
	text-decoration:none;
}
/* blue skin */
.navbar-default.navbar-light li > a:focus,
.navbar-default.navbar-light li > a:hover,
.navbar-default.navbar-light .active > a,
.navbar-default.navbar-light .active > a:focus,
.navbar-default.navbar-light .active > a:hover,
.navbar-default.navbar-light .open > a:focus,
.navbar-default.navbar-light .open > a:hover,
.navbar-default.navbar-light .open > a,
.sidenav a.active,
.sidenav a:hover,
.sidenav > li > a.active,
.sidenav > li > a:hover,
.sidenav li.active > a,
.sidebar-boxed .sidenav > li > a:hover,
.sidebar-boxed .sidenav > li > a.open,
a,
a:focus,
a:hover,
h1 a:before,
h2 a:before,
h3 a:before,
.toc a:hover,
.toc a:active,
.tabs-text .nav-tabs > li.active a,
.tabs-btn .nav-tabs li.active a,
.code-tabs .languages .btn.active,
.code-tabs .languages .btn:active,
.promo > .fa,
.promo > .glyphicon,
.pagination > li > a:focus,
.pagination > li > a:hover,
.pagination > li > span:focus,
.pagination > li > span:hover,
.pager li > a:hover {
  color: #62a8ea;
}

.site-header .navbar,
.sidenav > li > ul li.active a:before,
.sidenav > li > ul a.active:before,
.sidebar-line .sidenav li.active > a:before,
.sidebar-line .sidenav a.active:before,
.carousel.indicators-out .carousel-indicators .active,
.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
  background-color: #62a8ea;
}

.carousel.indicators-out .carousel-indicators li {
  border-color: #62a8ea;
}

.tabs-text .nav-tabs > li.active {
  border-bottom-color: #62a8ea;
}

.grid-view li {
  border-top-color: #62a8ea;
}

@media screen and (max-width: 767px) {
  .navbar {
    background-color: #17174a !important;
  }
  .banner.banner-full-height.exotool_site_banner,
  .banner.banner-sm.exotool_site_banner {
     background-position: 50% 50px; 
     background-size: 100vw auto;
   }
  .banner.banner-sm.exotool_site_banner:not(.homepage) {
     max-height: 23vw;
     line-height: 5px;
   }


}
@media screen and (max-width: 374px) {

   .banner.banner-sm h1,
   .banner.banner-sm h5,
   {
     line-height:10px !important;
     /*margin-bottom:10px;*/
   }
   .banner.banner-sm h1 {
     font-size:19px !important;
   }
   .banner.banner-sm h5 {
     font-size:14px !important;
   }
}