.hero-section{ 
  height:550px;
  background:no-repeat center center;
  background-size:cover
}
.hero-section section{margin-top:220px;width:100%}
#left-hero-content h1{margin:10px 0 10px 0}
#left-hero-content p{font:30px slatemed}
#left-hero-content p:first-child{color:#b3c935;margin-bottom:0}
#left-hero-content i{font-size:26px;color:#58595b}
.hero-section small{display:block;position:absolute;left:0;bottom:0;color:#ccc}

#visual-brochures{background-image:url(../img/support/visual-brochures.jpg)}
#visual-software{background-color: #060c19;
background-image: linear-gradient(180deg, #060c19 0%, #1b2f55 54%, #060c19 100%);
}
#visual-user-guides{background-image:url(../img/support/visual-user-guides.jpg)}
#visual-service{background-image:url(../img/support/visual-service-maintenance.jpg)}

/*////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////  CONTENT BEGINS HERE  ///////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////*/

.support-no-hero{margin-top:100px}
#company-name{font:30px slatemed;color:#b3c935}
.support-no-hero h2{font:36px gilroysbold;color:#282828}
#support-inner{min-height:750px}
#support-inner h1, #support-inner h3{font:20px robotomed;margin:40px 0 0 0;padding-bottom:0;color:#11233f}

/*----------------------- SEARCH PAGE --------------------------------*/
.search-page-content{min-height:1100px}
#search-page-form{margin-top:40px}
#search-list{margin-bottom:10%;min-height:700px}
#search-list h3{margin:15px 0 0 0}
#search-result-list{float:left;margin:10px 0 25px 0;padding-top:25px;border-top:10px solid #eee}
.search-result-title a{font:18px/1.3 slatemed;margin-bottom:10px;color:#7d868c}
.search-result-title a em{font-family:slatebold;color:#282828;margin-left:10px}
.search-result-title a:hover, .search-result-title em:hover{color:#0c3c61}

#support-form{
 position:relative;
 float:left;
 width:96%;
 background:#11233f;
 margin-top:10px;
 padding:30px 2% 0 2%;
 height:60px
}

#support-form fieldset{
 position:relative;
 float:left;
 border:0;
 margin-bottom:1.5%
}

.full-fieldset{width:49%;margin-right:2%}
#pub-type-field{margin-right:0}
#pub-institution-field, #pub-author-field{width:43%;margin-right:2%}
#pub-year-field{width:10%}
#search-field{width:70%;margin-right:2%}
#support-form label{
 display:none;
 color:#fff;
 font-size:16px
}

#search-submit .btn{
 float:left;
 width:100px;
 padding:6px 10px;
 margin-right:2%
}

#support-form input{
 float:left;
 background:#fff;
 width:96%;
 padding:0 2%;
 height:30px;
 font:16px slatelite;
 border:0;
 border-radius:0
}

.help-links li{font:16px slatebold}

/*------------- SUPPORT SEARCH DROPDOWN ----------------------*/
#support-search-box #support-form{margin-top:0;height:75px}

.support-fieldset{
 position:relative;
 float:left;
 height:60px;
 margin-right:3%;
 width:35%;
 min-width:250px
}

.select-box{
 top:0;
 -webkit-box-shadow: 0px 8px 23px -11px rgba(0,0,0,1);
 -moz-box-shadow: 0px 8px 23px -11px rgba(0,0,0,1);
 box-shadow: 0px 8px 23px -11px rgba(0,0,0,1);
 z-index:10
}
#support-list{margin-bottom:10%}
#col-support-wrap{float:left;width:100%;margin-top:25px}
#access-note{margin:10px 0 0 0}

/*------------------- 4 COLUMN ----------------------*/

.col4-support{
position:relative;
float:left;
width:22.8%;
height:390px;
margin:0 2.9% 30px 0;
background:#fff;
background:-moz-linear-gradient(top, #ffffff 64%, #ddd 100%); 
background:-webkit-linear-gradient(top, #ffffff 64%,#ddd 100%);
background:linear-gradient(to bottom, #ffffff 64%,#ddd 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff', endColorstr='#ddd',GradientType=0)
}

.col4-support:nth-child(4){margin-right:0}
.col4-support:nth-child(8){margin-right:0}
.col4-support:nth-child(12){margin-right:0}

.col4-support h4{font:14px/1.2 robotomed;color:#3a4044;width:92%;padding:20px 5% 0 5%}
.col4-support p{position:absolute;bottom:1%;right:4%;color:#0c3c61;font:14px slatebold}
.col4-support .btn{position:absolute;bottom:0;left:0;width:90%;font-size:12px;min-width:90px;line-height:1.3;padding-bottom:4px}
.col4-support .btn:hover{background:#7d868c}
.col4-support .fa-download{margin-left:3px;font-size:14px}

.site-prep-content{margin-bottom:10%}

/*--------------------------- Service Page ------------------------------*/
#service-possibilities{margin-bottom:0}
#service-list{margin-top:0}
.col4-service{
position:relative;
float:left;
width:24.6%;
margin-right:.5%;
text-align:center
}
.col4-service:last-child{margin:0}

.col4-service h4{
 font:18px slatebold;
 padding:10px 0;
 margin:0;
 color:#fff
}
#service-options{position:relative;background:#063660;text-align:left;padding-left:10px;padding-top:7px;line-height:1.2}
#service-options i{margin-left:10px;font-size:25px;vertical-align:bottom}
#gold-option{background:#c5b358}
#silver-option{background:#c0c0c0}
#materials-option{background:#c59858}

.col4-service p{float:left;margin-bottom:0;font-size:15px}
.col4-service strong{font-family:slatebold}

.service-type{position:relative;height:320px}
.service-type p{margin-top:20px;text-align:left;padding:0 10px}

.service-compare{background:#fff;height:40px;padding:5px 0 10px 0}
.service-compare:nth-child(odd){background:#f1f2f3}
#service-option-contract{text-align:left}
.service-compare p{
  color:#282828;
  width:100%;
  padding:10px 0;
  font-size:14px;
  line-height:1.2
} 
#service-option-contract p{font-family:robotomed;padding:10px;width:90%}
.service-comapre-wrap p{font-size:14px}
.mobile-service-option{display:none;background:#f1f2f3}

/*-------------------------- REQUEST INFO --------------------------*/
.request-heading{margin-top:115px;height:100%}
#request-wrapper h1{font:30px robotomed;color:#282828;margin-top:20px;margin-bottom:10px}

#request-sample-page{min-height:900px}
#request-info-page{min-height:900px;position:relative}
#request-info-page form{margin-bottom:15px}
#request-form{margin:0 auto 60px auto;width:55%;text-align:center}
#request-form h1{font:36px robotolite;margin-top:60px}
#email-preference{min-height:700px}
#email-preference p{margin-top:25px;text-align:center}
#email-preference small{color:#7d868c;font-size:14px}

/* JALA REQUEST --*/
#jala-request{min-height:980px}
#jala-request .img-left{width:25%}
#jala-request .p-text-right{width:72%;padding-top:0;margin-bottom:20px}
#jala-request .p-text-right p:first-child{margin:0}
#jala-request h3{padding:0 0 15px 0}
#mktoForm_1342{max-width:400px}
#mktoForm_1304{max-width:850px}

/*------------------------------------- USER PAGES --------------------------------------*/
#register-page, #login-page{position:relative;padding-bottom:5%}
#login-page{padding-bottom:10%}
#user-form{
 float:left;
 width:38%;
 margin-top:120px;
 padding:3% 0 1% 0
}
#user-note{padding-top:3%;border-top:1px solid #e4e3e3;width:38%;clear:left}
#user-form h2{float:left;font:16px slatelite;margin-bottom:30px;color:#7d868c}
#user-form h2 em{display:block;font:42px gilroysbold;color:#0e3455}
#user-form h4{clear:both;font:16px slatelite;margin-bottom:40px}
#forgot-inner h2 em{width:95%}
#forgot-inner h4{margin-bottom:20px}
#check-account{float:right;border:1px solid #ccc;margin-top:19px;padding:10px;text-transform:none;font:16px slatemed;color:#58595b}
#check-account:hover{border:1px solid #0e3455;color:#0e3455}
#user-form h3{float:left}

#user-form p{opacity:1;float:left;margin-top:5px;color:#7d868c}

#user-form fieldset{
 position:relative;
 float:left;
 width:100%;
 border:0;
 margin-bottom:20px
}
#register-page fieldset{margin-bottom:30px}
#login-page fieldset{margin-top:10px}
#confirm-pass-field{margin-top:5px}

#user-form label{
 display:none;
 color:#282828;
 font-size:16px
}

#user-form input{
 float:left;
 background:#fff;
 color:#282828;
 background:#fafafa;
 width:96%;
 padding:0 2%;
 height:40px;
 font:16px slatelite;
 border:1px solid #ddd;
 border-radius:1px;
 outline:none
}
#user-form input:focus{
 border:1px solid #00A9FC;
 color:#000
}

#user-form input::-webkit-input-placeholder{color:#282828}
#user-form input::-moz-placeholder{color:#282828}
#user-form input:-ms-input-placeholder{color:#282828}
#user-form input:-moz-placeholder{color:#282828}

#user-form fieldset span{color:red;margin-left:3px;font-size:14px}

#request-checkboxes{width:100%}
#request-checkboxes input, #request-checkboxes label{float:left}
#request-checkboxes input{width:20px;height:25px;margin-top:-5px;outline:none;-webkit-appearance:checkbox}
#request-checkboxes label{margin-left:-3px;display:block}
#request_contactme{margin-bottom:15px}

#user-form #user-submit{clear:left;margin-bottom:0}
#user-submit .btn, #user-form .user-submit .btn{float:left;margin-bottom:20px;cursor:pointer;border:0;border-radius:1px;background:#0e3455;color:#fff;width:20%;min-width:140px;font:13px robotomed}
#user-submit .btn:hover, #user-form .user-submit .btn:hover{background:#7d868c}
#user-submit .gray-btn{background:#7d868c}
#user-submit a{float:right;font:16px/1.3 slatemed;margin-top:9px;color:#58595b}
#user-submit a:hover{color:#0e3455}
#user-submit .fa{font-size:24px;margin-left:10px;vertical-align:bottom}

#user-droplet{position:absolute;right:0;top:0;width:40%;height:100%;background:url(../img/user/register-droplet.jpg) no-repeat left top;background-size:cover}
#login-page #user-droplet{background-image:url(../img/user/viusal-user-655t-v15.jpg)}

#error-box{float:left;width:96%;margin-bottom:10px}
#error-box li, #error-box p{font:15px/1.3 slatemed;margin:0 0 5px 0;color:red;list-style-type:none}
.parsley-errors-list{
 position:absolute;
 right:10px;
 top:12px;
 color:red;
 font-size:14px
}
#recaptcha_widget .parsley-errors-list{top:128px}

#thank-you-hero{background-image:url(../img/company/visual-company-lobby.jpg)}
#thank-you-heading h2{font:42px gilroysbold;color:#000;margin-top:20px}
#thank-you-heading{background:#fff}
#thank-you-heading p:nth-child(3){margin-bottom:0}
#thank-you-heading h3{font:20px robotomed;margin-top:0;padding-top:0}

/*-------------------------- USER PROFILE ---------------------------------*/
#profile-page .left-paragraph{width:100%;margin-bottom:5%}
#user-form .short-name-field{width:48.5%}
#user-form .short-name-field input{width:92%;padding:0 4%}
#user-form #field-one{margin-right:3%}
#user-form .short-field{margin-right:3%}
#profile-page label{display:block;font-family:slatemed;margin-bottom:2px}
#user-form input, #user-form textarea{background:#fff;box-shadow:inset 0 2px 4px 0 rgba(0,0,0,.04)}
#user-form #state-field{width:17%}
#user-form #zip-field{width:18%}
#user-form #country-field{width:59%;margin-right:0}
#user-form .select-box{top:20px;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;height:42px;border:1px solid #ddd;border-top:0}
#user-form .select-box li a{padding:14px 10px 13px 12px}
#user-form .current{box-shadow:inset 0 2px 4px 0 rgba(0,0,0,.04);border:1px solid #ddd;position:absolute;left:0;top:21px;z-index:15;width:94%;padding:10px 2.5% 10px 3.5%;background:#fff;font:16px slatelite;height:20px}
#state-field .current{width:84%;padding:10px 7% 10px 9%}
#zip-field input{width:85%;padding:0 5% 0 10%}
#user-form .current .fa{float:right;font-size:30px;color:#7d868c;margin-top:-5px}
#user-form .select-open{top:60px}
#user-form .select-shadow{-webkit-box-shadow:0 8px 23px -11px rgba(0,0,0,1);box-shadow:0 8px 32px -16px rgba(0,0,0,1);-moz-box-shadow:0 8px 23px -11px rgba(0,0,0,1);}
#update-form, #pass-blog{width:40%}
#update-form{margin-right:15%}
#update-form #user{color:#999}
#main-research{
 width:100%;
 background:#fff;
 color:#282828;
 background:#fafafa;
 width:96%;
 padding:10px 2%;
 height:100px;
 font:16px slatelite;
 border:1px solid #ddd;
 border-radius:1px;
 outline:none
}
#research-field p{margin-bottom:0}
#research-field b{color:#009add}
#password-form{float:left;border-bottom:1px solid #eee;padding-bottom:15px;margin-bottom:20px}
#password-form ul{width:100%}
#password-form li{margin-bottom:10px}
#user-form h4{font:18px slatemed;color:#0c3c61;margin-bottom:20px;padding:10px 2%;width:96%;background:#eee}
.left-paragraph #password-form p{margin-bottom:0;font-size:15px}
#update-form div, #user-form div{margin-right:35px;float:left}
#blog-note p{font:16px robotolite;margin-top:15px}
#blog-note a{font-size:16px}

/*-------------------------- PDF VIEWER -----------------------------------*/
#pdf-page{margin:125px 0 5% 0;min-height:800px}
#pdf-wrap{width:98%;background:#e5e5e5;padding:10px 1%}
#pdf-header{position:fixed;left:0;top:0;text-align:center;width:100%;z-index:1;right:0;left:0;margin-right:auto;margin-left:auto;top:100px}
#pdf-header-inner{position:relative;margin:0 auto;max-width:1200px;background:#e5e5e5;height:50px;border-top:20px solid #414447}
#pdf-buttons{position:absolute;left:15px;top:15px}
.page-btn{float:left;margin-right:10px}
#pdf-header .fa-plus{font-size:18px;color:#0e3455}
#pdf-header .fa-minus{font-size:18px;color:#bbb}
#pdf-download{font:14px robotomed;color:#fff;background:#0c3c61;border:0;position:absolute;right:10px;top:10px;cursor:pointer;padding:5px 10px}
#pdf-download:hover{background:#7d868c}
#pdf-download i{font-size:22px;margin-right:5px;color:#282828}
#page-count{margin:15px 0 0 0;padding:0;color:#282828;font-size:18px;display:none}
#pdf-viewer{float:left;width:100%;margin-top:15px}
#pdf-thumb{display:none}
#pdf-thumb .btn{padding:10px 0;font-size:18px}
#pdf-thumb i{margin-left:10px}

/*---------------------------- FAQS ------------------------------------*/
#faq-page{margin-top:160px}
#faq-page h1{font:30px robotomed}
#faq-search-box{margin:0}
#faq-search-box h3{
 margin-bottom:10px;
 padding-top:20px;
 font:20px robotomed;
 color:#282828
}
#faq-form{
 float:left;
 padding:0;
 margin-top:25px;
 width:60%;
 background:#fff
}
#faq-form fieldset{
 position:relative;
 float:left;
 border:0;
 width:60%;
 width:100%
}
#faq-form label{
 display:none;
 color:#fff;
 font-size:14px
}
#faq-form input{
 float:left;
 background:#fff;
 height:30px;
 border:1px solid #ddd;width:98.5%;padding:5px 0 5px 1.5%; font:normal 16px slatelite;
}

#faq-search-icon{position:absolute;right:0;top:0;border:1px solid #ddd;height:40px;padding:0 12px;background:#fff;border-right:0}
#faq-search-icon .fa-search{color:#7d868c;font-size:22px;margin-top:8px}

.faq-section{
  float:left;
  width:100%;
  margin-bottom:15px
}

.faq-section h2{
 font:26px/1.4 slatelite;
  padding-bottom:5px;
  margin-bottom:20px;
  color:#11233f;
  border-bottom:1px solid #7d868c
}

.faq-section ul{
  float:left;
  margin-bottom:15px;
}
.faq-section ul:last-child{margin-bottom:0}
.faq-section li{
  font:16px/1.3 slatereg;
  margin-bottom:15px;

}
.faq-section .ul-indent{
  clear:left;
  margin-left:3%;
}
.faq-section .faq-list-heading{
  font-family:slatebold;
  color:#282828;
}
.faq-section .faq-list-heading:before{
  display:none
}

.faq-section .no-indent{
  padding-left:0
}

@media all and (max-width: 1380px){
 #register-page, #login-page, #pdf-header, #profile-page{
   padding-left:3%;
   padding-right:3%;
   width:94%
 }
}

@media all and (max-width: 1290px){
 .service-type{height:340px}
}

@media all and (max-width: 1195px){

 .support-no-hero{margin-top:85px}
 #support-inner .support-no-hero h3{margin-top:10px}
 #search-page-form{margin-top:0px}
 .col4-support{height:370px}
 .service-type{height:360px}
 .col4-service h4{font-size:16px}
 #service-options{padding-top:6px}
 #service-options i{font-size:23px}
 .request-heading{margin-top:60px}
 #user-form{margin-top:70px}
 #pdf-page{margin-top:70px}
 #pdf-header{top:83px}
}

@media all and (max-width: 1090px){
 .col4-support{height:350px}
 .service-type{height:380px}
}

@media all and (max-width: 1060px){
 .service-type{height:400px}
 #request-form{width:65%}
}

@media all and (max-width: 1024px){
 .search-page-content{min-height:auto}
 #support-search-box{width:100%}
 #search-list{margin-bottom:0;min-height:auto}
 #search-list .pagination{margin-bottom:5%}
 .col4-support{height:420px}
 .service-type{height:300px}
 .col4-service h4{font-size:18px}
 #service-options{padding-top:7px;}
 #service-options i{font-size:25px}
 .search-docs .related-links{height:410px}
 #user-form, #user-note{width:45%}
}

@media all and (max-width: 950px){
 .col4-support{height:400px}
 .service-type{height:320px}
 .search-docs .related-links{height:430px}
 #pdf-header-inner{height:40px}
 #pdf-header i{font-size:16px}
 #pdf-download{font-size:16px}
 #pdf-download i{font-size:20px}
 #pdf-header p{font-size:16px}
 #pdf-page{margin-top:70px}
 #pdf-header{top:83px}
 #request-form{width:75%}
}

@media all and (max-width: 880px){
 .col4-support{height:370px}
 .service-type{height:340px}
}

@media all and (max-width: 845px){
 .hero-section{height:auto}
 .hero-section section{margin:23% 0}
 #left-hero-content h1{font-size:47px}
 #user-form{width:50%}
}

@media all and (max-width: 815px){
 .service-type{height:360px}
 .col4-service{width:100%;padding:0;margin:0 0 8% 0}
 .col4-service:first-child{margin-bottom:0}
 #service-option-contract{display:none}
 #service-options{padding:10px 0;text-align:center;line-height:1.4}
 #service-options i{display:none}
 .service-type{height:100%}
 .service-type p{padding-bottom:20px}
 .service-compare-wrap{float:left;width:100%}
 .service-compare{height:90%;padding:2.5% 0 5% 0;}
 .service-compare:nth-child(odd){background:#fff}
 .service-compare p{padding:1.5% 0}
 .service-compare .mobile-service-option{display:block;padding:1.5% 0;font-family:slatebold}
 #request-form{width:85%}
}

@media all and (max-width: 736px){
 .col4-support{width:48.5%;height:100%;background:#f5f5f5}
 .col4-support:nth-child(2){margin-right:0}
 .col4-support:nth-child(6){margin-right:0}
 .col4-support:nth-child(10){margin-right:0}
 .thmb-with-border{float:left;width:45%}
 .support-desc{float:right;padding-left:5%;width:50%}
 .col4-support h4{width:90%;padding:20px 0 0 0}
 .col4-support p{bottom:10%;right:0;left:50%}
 .col4-support .btn{bottom:10%;left:50.1%;width:35%}
  #user-form, #user-note{width:70%}
  #user-droplet{display:none}
  .search-result-title a em{display:block;margin-left:0}
  #pdf-thumb{display:block}
  #pdf-header, #pdf-wrap{display:none}
  #pdf-page{min-height:auto}
}

@media all and (max-width: 680px){
 .hero-section section{margin:25% 0}
 #pdf-thumb .btn{font-size:16px}
 #request-form{width:100%;margin:0 0 5% 0;float:left}
 #request-info-page p{margin-bottom:3%}
}

@media all and (max-width: 620px){
 #jala-request .img-left{width:55%;margin:0;min-width:300px}
 .search-docs .related-links{height:100%}
 #support-form{padding:30px 3% 0 3%;width:94%}
 #request-info-page form{margin-bottom:15px}
 #request-form{margin-bottom:3%}
 #request-form h1{font:30px robotolite;margin-top:30px}
}

@media all and (max-width: 590px){
  .col4-support{width:100%;margin-right:0}
  .thmb-with-border{width:30%}
  .support-desc{width:65%}
  .col4-support h4{font-size:17px;padding-top:40px}
  .col4-support p{bottom:10%;left:35%}
  .col4-support .btn{bottom:10%;left:35.1%;width:25%}
  #register-page #user-form{width:100%}
  #search-page-form #support-form{height:100px}
  #search-page-form fieldset{margin-bottom:10px}
  #search-field{width:100%;margin-right:0}
  #user-form, #user-note{width:93%}
}

@media all and (max-width: 510px){
 .support-fieldset{width:100%;}
 .col4-support h4{font-size:15px;padding-top:30px}
 .col4-support p{left:35%}
 .col4-support .btn{left:35.1%;width:25%}
}

@media all and (max-width: 420px){
#jala-request .img-left{width:100%;min-width:auto}
 .col4-support h4{padding-top:6%;font-size:14px}
 #user-form{width:100%}
 #register-page  #user-form h2{margin-bottom:15px}
 #register-page #check-account{clear:left;float:left;margin:0 0 20px 0}
}

