/* PAGE STRUCTURE */

.column12, .column11, .column10, .column9, .column8, .column7, .column6, .column5, .column4, .column3, .column2, .column1{float: left; padding: 0 25px 0 0;} .column12{width: 100%;} .column11{width: 91.6666%;} .column10{width: 83.3333%;} .column9{width: 75%;} .column8{width: 66.6666%;} .column7{width: 58.3333%;} .column6{width: 50%;} .column5{width: 41.6666%;} .column4{width: 33.3333%;} .column3{width: 25%;} .column2{width: 16.6666%;} .column1{width: 8.3333%;} .last{padding: 0;} .cf{zoom: 1;} .cf:before, .cf:after{content: ""; display: table;} .cf:after{clear: both;} .clear{clear: both;} *{box-sizing: border-box;}

.main-content{padding: 50px 0;}
.container{max-width: 1200px; padding: 0 20px; margin: 0 auto;}
.pad-tb{padding: 50px 0;}
.right{float: right;}

.teal-bg{background: #397675;} .teal-bg p{color:#fff;}
.grey-bg{background: #fafafa;}

/* HEADER */

.header-container{width: 100%; box-shadow: 0 5px 2px 0 rgba(0,0,0,.25); top: -100px; transition: all .4s ease-in-out;}
.top-header{background: #333; padding: 5px 0; font-size: 12px; font-weight: 700;}
.top-header .address{display: inline-block; color: #aaa; padding: 0 15px 0 0; border-right: 2px #aaa solid;}
.top-header .phone{display: inline-block; color: #fff; padding: 0 0 0 15px;}
.top-header .social{float: right; font-size: 14px; color: #fff;}
.top-header .social a{margin-left: 10px;} .top-header .social a:hover{color: #ddd;}
.header{width: 100%; background: #fff;}
.header .logo{float: left; width: 125px; padding: 10px 0;}

.stick{position: fixed; top: 0; width: 100%; z-index: 9999;}
.stick .top-header{display: none;}
.stick .header .logo{width: 90px; padding: 5px 0;}
.push{height: 100px;}

/* STYLES */

.hero{background: url("../images/hero.png") bottom center no-repeat; padding: 50px 0 100px; box-shadow: inset 0 5px 2px 0 rgba(0,0,0,.25);}
.hero h1{font-size: 32px; text-transform: uppercase; line-height: 36px; color: #555; margin-top: 30px;}
.hero p{font-size: 16px; line-height: 28px; color: #555;}
.hero .continue{clear: both; margin: 10px 0; text-align: center;}
.hero .continue a{font-size: 48px; text-shadow: 0px 0px 10px rgba(0,0,0,0.15); color: #fff; opacity: .6;}
.hero .continue a:hover{opacity: 1;}

.signup{text-align: center;}
.signup h2{font-size: 30px; text-transform: uppercase; color: #3b7473; margin-bottom: 15px;}
.signup .column6{width: calc(50% - 8px); margin: 0 4px; padding: 35px 20px; box-shadow: 0 5px 2px 0 rgba(0,0,0,.25); border: 1px #ddd solid; border-radius: 3px;}
.signup .column6 img{max-height: 45px; width: auto; margin-bottom: 10px;}

.hibid{background: #ffffff; background: -moz-linear-gradient(top, #ffffff 0%, #dddddd 100%); background: -webkit-linear-gradient(top, #ffffff 0%,#dddddd 100%); background: linear-gradient(to bottom, #ffffff 0%,#dddddd 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 ); padding: 50px 0 0; text-align: center;}
.hibid h2{font-size: 30px; text-transform: uppercase; color: #2a6795; margin-bottom: 35px;}
.hibid p{font-size: 20px; font-weight: 700; line-height: 48px; color: #2a6795;}
.hibid p img{position: relative; top: 2px;}

.spotlight-top{background: #dddddd url("../images/spotlight.png") center center; background-size: cover; height: 120px;}
.spotlight strong{font-size: 16px; font-weight: 700; color: #3b7473; margin-bottom: 5px;}
.spotlight p{font-size: 12px; font-weight: 700; line-height: 18px; text-align: center; color: #555;}
.spotlight .column3{margin: 25px 0; transition: all .2s ease-in-out;} .spotlight .column3:hover{opacity: .75;}
.spotlight .column3:nth-child(4n+1){clear: both;}

.grey-box{background: #fafafa; padding: 20px; border: 1px #ccc solid; margin-bottom: 10px;}
.grey-box p{font-size: 14px; line-height: 24px; color: #3F3F45}
.portals p{display: inline-block; width: 49%; text-align: center;}

.our-customers{text-align: center;}
.our-customers h1{font-size: 36px;}
.our-customers p{font-size: 20px; line-height: 30px; color: #3F3F45;}

.testimonials{margin: 35px 0;}
.testimonials h2{font-size: 30px; text-transform: uppercase; text-align: center; color: #3b7473;}
#testimonial-slider{background: #fff; width: 100% !important; margin: 25px 0 15px; border: 1px #ccc solid;}
#testimonial-slider div{width: 100%;}
#testimonial-slider section{float: left; width: 100%; padding: 25px; box-sizing: border-box;}
#testimonial-slider hr{margin: 20px 0; padding: 0;}
#testimonial-slider img{max-height: 50px;}
.slidesjs-pagination{position: absolute; z-index: 8888;}
.slidesjs-pagination li{display: inline-block;}
.slidesjs-pagination li a{display: block; width: 14px; height: 0; padding-top: 14px; background-image: url(/themes/SandhillsTemplate/images/pagination.png); background-position: 0 -14px; overflow: hidden;}
.slidesjs-pagination li.active a, .slidesjs-pagination li:hover a{background-position: 0 -28px;}
.slidesjs-pagination li a:hover{background-position: 0 0;}
.testimonial-pagination ul li{list-style: none; margin-right: 6px !important; margin-left: 0 !important;}
.testimonial-pagination{position: relative;}
.slidesjs-previous{position: absolute; right: 25px; z-index: 99999;} .slidesjs-next{position: absolute; right: 0; z-index: 9999;}

ul.about-sidebar li{list-style-type: none !important; margin: 0 !important; padding: 10px 0; border-bottom: 1px #ccc solid;}
ul.about-sidebar li:last-child{border-bottom: none;}
ul.about-sidebar li a{position: relative; display:block; padding-left: 20px;}
ul.about-sidebar li a:before{position: absolute; font-family: 'FontAwesome'; content: "\f101"; left: 0; transition: all .2s ease-in-out;}
ul.about-sidebar li a:hover{padding-left: 25px;}

.main-content table{border: 1px #ccc solid; margin: 8px 0; min-width: 500px;}
.main-content td{border: 1px #ccc solid; padding: 5px;}
.main-content tr:nth-child(even){background: #fafafa;}

.show select{position: relative; width: 100%; border: 1px #ccc solid; margin: 5px 0; padding: 10px; -webkit-appearance: none; border-radius: 0;}
.select-wrap{position: relative; margin-bottom: 25px;}
.select-wrap:after{position: absolute; font-family: 'FontAwesome'; content: "\f0d7"; right: 10px; top: -30px; color: #777; margin-bottom: 25px;}

/* WEBINARS */

.af-title{margin: 15px 0; color: #3a7574; border-bottom: 1px #ccc solid;}
.hibid-title{margin: 15px 0; color: #2a6795; border-bottom: 1px #ccc solid;}

.video-container{display: flex; flex-wrap: wrap;}
.video-thumbnail{width: calc(33.3333% - 10px); margin: 15px 5px; text-align: center;}
.video-thumbnail img{display: block;}
.video-thumbnail a{font-weight: 700; color: #777;}
.video-title{background: #fafafa; border: 1px #ccc solid; padding: 12px; box-sizing: border-box;}

.modal-video, .modal-video-movie-wrap{animation-timing-function:ease-out; animation-duration:.3s; width:100%}
.modal-video{position: fixed; top: 0; left: 0; height: 100%; background-color: rgba(0,0,0,.5); z-index: 1000000; cursor: pointer; opacity: 1; animation-name: modal-video; transition: opacity .3s ease-out}
.modal-video-close{opacity: 0}
.modal-video-close .modal-video-movie-wrap{transform: translate(0,100px)}
.modal-video-body{max-width: 940px; width: 100%; height: 100%; margin: 0 auto; display: table}
.modal-video-inner{display: table-cell; vertical-align: middle; width: 100%; height: 100%}
.modal-video-movie-wrap{height: 0; position: relative; padding-bottom: 56.25%; background-color: #333; animation-name: modal-video-inner; transform: translate(0,0);  transition: transform .3s ease-out}
.modal-video-movie-wrap iframe{position: absolute; top: 0; left: 0; width: 100%; height: 100%}
.modal-video-close-btn{position: absolute; padding: 0; margin: 0; z-index: 2; top: -35px; right: 0; display: inline-block; width: 25px; height: 25px; overflow: hidden; border: none; background: 0 0; cursor: pointer}
.modal-video-close-btn:after{font-family: FontAwesome; content: '\f00d'; font-size: 24px; color: #ccc;}
.modal-video-close-btn:hover:after{color: #fff;}

@keyframes modal-video{
    from{opacity: 0}
    to{opacity: 1}
}
@keyframes modal-video-inner{
    from{transform: translate(0,100px)}
    to{transform: translate(0,0)}
}

/* LIVE HELP */

.live-help table{min-width: 100%;}
.live-help td{border: none; padding: 10px;}
.live-help tr{background: #F5F5F5;} .live-help tr:nth-child(even){background: #F5F5F5;}
.style7{color: #FFFFFF; background-color: #666666;}

/* REMOTE PAGE */

.remote-header{background: #3E7E7E; padding: 3px 0;}
.remote-body{padding: 50px 0;}

/* PLANS */

.table{display: block; background: #fff; margin: 15px 0; font-size: 12px; border: 1px #ddd solid; border-bottom: none; box-shadow: 0 5px 2px 0 rgba(0,0,0,.25);}
.table-header{display: flex; align-items: center; background: #3b7473; border-bottom: 1px #ccc solid;}
.table-header .table-cell{flex: 1; padding: 12px 15px; font-size: 15px; font-weight: 700; text-transform: uppercase; color: #fff;}
.table-header .table-cell:first-child{flex: none; width: 300px;}
.table-header .table-cell:last-child{border-right: none;}
.table-row{display: flex; border-bottom: 1px #ccc solid;}
.table-row:nth-child(odd){background: #f5f5f5;}
.table-row .table-cell{flex: 1; padding: 10px 15px; border-left: 1px #ccc solid;}
.table-row .table-cell:first-child{flex: none; width: 300px; background: #fff; font-weight: 700; color: #555;}

/* FOOTER */

.footer-top{background: url("../images/footer.png") center center; background-size: cover; height: 120px;}
.footer{background: #3b7473; font-weight: 700; color: #fff;}
.footer .top-footer .address{display: inline-block; color: #fff; padding: 0 15px 0 0; border-right: 2px #aaa solid;}
.footer .top-footer .phone{display: inline-block; color: #fff; padding: 0 0 0 15px;}
.footer .top-footer .social{float: right; font-size: 14px; color: #fff;}
.footer .top-footer .social a{margin-left: 10px;} .footer .social a:hover{color: #ddd;}
.footer .top-footer{padding: 25px 0;}
.footer .mid-footer{border-top: 1px #9dbab9 solid; padding: 25px 0; color: #ddd; line-height: 25px;}
.footer .mid-footer h5{color: #fff; margin-bottom: 10px;}
.footer .mid-footer a{display: block;} .footer .mid-footer a:hover{color: #fff;}
.footer .agreements{padding: 20px 0; text-align: center;}
.footer .agreements ul{margin: 5px 0;}
.footer .agreements ul li{border-right: 1px #fff solid; display: inline-block;} .agreements ul li:last-child{border-right: none;}
.footer .agreements ul li a{color: #ddd; padding: 10px;} .agreements ul li a:hover{color: #fff;}

/* RESPONSIVE */

.show{display: none;}
.show-mobile{display: none;}

@media screen and (max-width: 1024px){
    .header-container{position: relative; top: 0;}
    .push{display: none; height: 149px;}
    .header .container{padding: 0;}
    .header .logo{float: none; width: 100%; text-align: center;}
    .header .logo img{position: relative; left: -20px;}
    
    .hero h1{margin-top: 0;}
    .video-thumbnail{width: calc(50% - 10px);}
}
@media screen and (max-width: 768px){
    .column8, .column6, .column4{float: none; width: 100%; padding: 0; margin: 10px 0;}
    .column3{width: 50%; margin: 10px 0;}
    
    .hero{text-align: center; padding: 20px 0 80px;} .hero h1{font-size: 20px; line-height: 24px;}
    .hero img{max-height: 150px;}
    .signup h2{font-size: 20px;}
    .signup .column6{float: none; width: 100%; margin: 10px 0;}
    .hibid{padding: 25px 0;} .hibid h2{font-size: 20px;} .hibid p{font-size: 16px;}
    .hibid img{max-height: 150px;}
    .spotlight .column3:nth-child(4n+1){clear: inherit;} .spotlight .column3:nth-child(2n+1){clear: both;}
    
    .plan-container{width: 100%; margin: 10px 0;}
    .testimonial-container{column-count: 1;}
    
    .table-container{max-width: 100%; overflow-x: scroll;}
    .table{width: 700px;}
}
@media screen and (max-width: 480px){
	.show-mobile{display: block;}
    .column3{float: none; width: 100%; padding: 0; margin: 10px 0;}
    .top-header{text-align: center;}
    .top-header .social{display: none;}
    
    .footer .top-footer{text-align: center; padding: 0;}
    .footer .top-footer .social{float: none; width: 100%; margin: 10px 0;}
    .footer .mid-footer{display: none;}
    .footer .agreements ul li{display: block; border: none; margin: 5px 0;}
    .footer .bottom-footer .copyright, .footer .bottom-footer .host{float: none; width: 100%; text-align: center; margin: 5px 0;}
    
    .portals p{display: block; width: 100%;}
    .video-thumbnail{width: 100%; margin: 10px 0;}
}