body {max-width:100%; overflow-x:hidden; background:#212121;}
a { color:#F60; }

/*  ////  LAYOUT */

.pagebanner {
  background:url("../img/templatebanner.gif") no-repeat scroll 50% 0px transparent;
}

.container {width:85%;}

section {
  clear:both;
  background-color:#ffffff;
  border:#dedede 1px solid;
  padding:30px;
  overflow:auto;
  margin-top:60px;
}

section > div > span {
  display: block;
  margin:6px 20px;
}

.title {
  color:#ff6600;
  margin-bottom:40px;
  font-weight:100;
}

.clear {
  min-height:125px;
  clear:both;
}

.btn.btn-hero {
  background-color: transparent;
  outline: none;
  margin:0;
  color: #ffffff;
  border: #ffffff 1px solid;
}
.btn.btn-hero:hover,
.btn.btn-hero:focus {
  background-color: #ff6600;
  border:#ff6600 1px solid;
}

.boxlimit {max-width:1800px; margin:0 auto;}





/*  ////  SLIDER HELPERS  */



.slide-data {
position:absolute;
width:inherit;
height:68%;
top:0;
bottom:0;
z-index:2;
margin:12px 0;
}


.slide-data h1{font-size:4em; margin:0; line-height:1; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4); }
.slide-data h3 {font-size:1.5em; letter-spacing:0.2em; margin:0; line-height:1;}
.slide-data p{
  display:inline-block; 
  padding:9px; 
  width:auto; 
  font-size:1.4vw;
  margin:0;
}

.slide-data .clear{min-height:1px;}

.slide-text {display:inline-block; position:absolute; width:94%; height:auto; margin:0 3%;}

.slide-data .slide-text img { width: auto; height: auto; display: inline; }





/*  ////  SLIDER TEXT POSITIONS   */

.bottom-left {bottom:1em; left:3.3em; text-align:left;}
.mid-left {top:40%; left:3.3em; text-align:left;}
.top-left {top:75px; left:3.3em; text-align:left;}
.bottom-center {bottom:1em; width:95%; text-align:center;}
.mid-center {top:30%; width:95%; text-align:center;}
.top-center {top:75px; width:95%; text-align:center;}
.bottom-right {bottom:1em; width:93%; text-align: right;}
.center-right {top:30%; width:93%; text-align:right;}
.top-right {top:75px; width:93%; text-align:right;}


.flex-direction-nav a:before  { 
    content: " ";
    display: block;
    background: url('../img/arrow-left.png') no-repeat;
    width: 40px;
    height: 50px;
}
.flex-direction-nav a.flex-next:before  { 
    content: " ";
    display: block;
    background: url('../img/arrow-right.png') no-repeat;
    width: 40px;
    height: 50px;
}






/*  ////  UTILITY */

.collapse-all {
  border:none;
  margin:0;
  padding:0;
}

.caps {text-transform:uppercase;}

.nomargin {margin:0;}
.nopadding {padding:0;}
.smpadding {padding:6px;}
.smmargin{margin:6px;}








/*  ////  TEXT & BUTTON STYLES  */

.orange {color:#ff6600;}
.orangebg {background-color:#ff6600;}

.grey {color:#666666;}
.greybg {background-color:#666666;}

.black {color:#212121;}
.blackbg {background-color:#000000;}
.transblackbg {background-color:rgba(0, 0, 0, 0.6);}

.white {color:#fafafa;}
.whitebg {background-color:#ffffff; border: none;}
.transwhitebg {background-color:rgba(255, 255, 255, 0.6);}

.thin {font-weight:100;}
.thick {font-weight:600;}

.banner {display:inline-block; padding:6px 3px;}

.orangebtn {background-color:#ff6600; color:#ffffff; }
.orangebtn:hover {background-color:#ffffff; color:#ff6600;}

.whitebtn {background-color:rgba(255, 255, 255, 0.7); color:#ff6600;}
.whitebtn:hover{background-color:#ffffff; color:#ff6600;}






/* 
-All should be equal. Default is 150px.
-This determines the height of the buttons area (and reflection)

.flex-control-thumbs: bottom;
.cta-buttons: top:;
.reflection:height:;

*/



.flexslider {
margin-bottom:0;
max-width:1800px;
}

.flex-control-thumbs {
  width:100%;
  position:absolute;
  bottom:75px;
  -webkit-opacity: 0;
  -moz-opacity: 0;
  opacity: 0;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}

.flex-control-thumbs li > img {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
}

.flexslider:hover > .flex-control-thumbs {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
}


.cta-buttons {
  margin:-75px auto 0 auto;
  /* background-image:url('../img/gradient.png'); */
  background-repeat: repeat-x;
  background-position: left bottom;
  background-color:rgba(255, 255, 255, 0.8);
  position:absolute;
  width:100%;
  height:auto;
  overflow-y:auto;
  overflow-x:hidden;
}

.btmlink {
  font-size:1.3em;
  font-weight:200;
  text-transform:uppercase;
  color:#666666;
  line-height:1;
  text-align:center;
  padding:24px 0px;
  margin:0;
}


a.btmlink:hover {color:#333333;}
a.btmlink:hover > .thick {color:#ff6600;}


.reflection {
  display:block;
  position:relative;
  width:100%;
  height:75px;
  clear:both;
}

.reflection img {
  vertical-align:top !important;
}


/*  slide reflection */
.reflected {
    display:block;
    -moz-transform: scaleY(-1);
    -o-transform: scaleY(-1);
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1);
    filter: FlipV;
    -ms-filter: "FlipV";
    opacity:0.8;
    z-index:-1;
}








/*  feat and buy callouts */


.callout {position:relative; min-height:300px;}

.callout-text {
  display:inline-block;
  position:relative;
  margin:-10% auto 10% auto;
  padding:6px;
  text-transform: uppercase;
  width:100%;
  background-color:rgba(0, 0, 0, 0.6);
  top:50px;
}

.callout-text h3 {margin:12px 12px; text-align:center; font-size:2em;}
.callout a {
  display:block; 
  color:#ffffff; 
  width:100%; 
  height:100%; 
  padding:12px;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}


.callout i {
  display:block;
  position:relative;
  border-radius:50% / 50%;
  padding:15px 10px;
  width:100px;
  height:50%;
  margin:15% auto;
  background-color:transparent;
  border:#ffffff 3px solid;
  font-size:5em;
  -webkit-opacity: 0;
  -moz-opacity: 0;
  opacity: 0;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}

.callout a:hover >  i {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
}

.callout a:hover {background-color:rgba(0, 0, 0, 0.5);}
.callout a:hover > .callout-text > h3 > span.thick {color:#ff6600;}


.main-video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0; height: 0; overflow: hidden;
    margin:0;
}

.main-video-container iframe,
.main-video-container object,
.main-video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*  video modal */
.video .modal-dialog {width:70%; background-color: #222222;}
.video .modal-header {background-color:#222222;}
.video .modal-body {padding:20px auto; background-color: #222222;}
.video .modal-footer {background-color:#222222;}
.video .modal-footer .btn-hero {margin-top:10px;}



.subfooter {margin-top:0;}


/*  ////  @MEDIA  */
/* tiny screen - center all the things */

@media(max-width:480px){
  .slide-data{height:55%; }
  .slide-text { position: absolute; bottom: 70px !important; top: initial !important; }
  .bottom-left {top:10%; width:100%; text-align:center; left:0; bottom:1em;}
  .mid-left {top:10%; width:100%; text-align:center; left:0; bottom:1em;}
  .top-left {top:10%; width:100%; text-align:center; left:0; bottom:1em;}
  .bottom-center {top:10%; width:100%; text-align:center; bottom:1em;}
  .mid-center {top:10%; width:100%; text-align:center; bottom:1em;}
  .top-center {top:10%; width:100%; text-align:center; bottom:1em;}
  .bottom-right {top:10%; width:100% !important; text-align:center; bottom:1em;}
  .center-right {top:10%; width:100% !important; text-align:center; bottom:1em;}
  .top-right {top:10%; width:100% !important; text-align:center; bottom:1em;}
  .flex-direction-nav a {top:25%;}
  .btn-group > .btn {float:left; width:100%;}
  .btmlink {padding: 24px 12px; font-size:0.8em !important;}
  .btmlink i {font-size:1.2em; width:50px;}
  .slide-data h1 {font-size:1.5em !important;}
  .slide-data p { width: 320px !important; }
  .thin { font-weight: 300; }
}


@media(max-width:780px){
  .flexslider {margin-top:55px;}
  .slide-data{padding:0; margin:0; height:60%;}
  .top-right, .top-left, .top-center {top:1em;}
  .top-right, .center-right, .bottom-right {width:88%;}
  .btn {padding:6px; font-size:0.8em; min-width:1px;}
  .flex-control-thumbs {display:none;}
  .reflection {height:280px;}
  .cta-buttons{position:relative; margin-top:-280px; padding:12px;}
  .flex-direction-nav a {top:25%;}
}



@media(max-width:1024px){
  .btn-group-justified {width:90%;}
  .btn-group-justified > .btn {float:left; min-width:160px; padding:24px 12px;}
  .btmlink {font-size:1em;}
  .slide-data h1 {font-size:2.5em;}
  .slide-data h3 {font-size:1em;}
  .slide-data p {font-size:1em;}
}

@media(min-width:1800px){
  .flexslider {width:1800px; margin:0 auto; border-left:#111111 1px solid; border-right:#111111 1px solid;}
  .boxlimit {position:relative; width:1800px; margin:0 auto; border-left:#111111 1px solid; border-right:#111111 1px solid;}
  .flex-control-thumbs {bottom:0;}
}