html { overflow-y: scroll; margin: 0; padding: 0; }
body { background-color: #fff; color: #000; font-size:14px; font-family: 'PT Sans', sans-serif; margin: 0px; padding: 0px; }
body, td, th, input, textarea, select, a { font-size: 14px; }
td { vertical-align:top;}
h1, .h1 { color: #383936; margin-top: 0px; margin-bottom: 20px; font-size: 32px; font-weight: normal; text-shadow: 0 0 1px rgba(0, 0, 0, .01); font-family: 'Roboto', sans-serif; }
h2, .h2 { color: #000; font-size: 18px; font-weight: 600; margin-top: 0px; margin-bottom: 15px; font-family: 'Roboto', sans-serif; text-transform: uppercase; }
h3, .h3 { font-size:20px; color: #383936; margin-top:0; margin-bottom:15px; font-family: 'Roboto', sans-serif;}
p { margin-top: 0px; margin-bottom: 20px; font-size: 1.1em; }
a, a:visited, a b { color: #0085b1; text-decoration: underline; cursor: pointer; }
a:hover { text-decoration: none; }
a:focus { outline:none;}
a img { border: none; }
strong { color: #000;}
form { padding: 0; 	margin: 0; }
input[type='text'], input[type='email'], input[type='password'], textarea { background: #fff; border: 1px solid #eae9e6; padding:5px 3px; margin-left: 0px; margin-right: 0px; font-size: 14px; font-weight: normal;}
select { background: #fff; border: 1px solid #eae9e6; padding: 2px; }
label { cursor: pointer; font-size: 14px; }
.link { text-decoration:  underline; color: #0085b1; cursor: pointer;}
.link:hover { text-decoration: none; }
.mobile { display: none;}
hr.divider { max-width: 15rem; border: none; border-bottom: 1px solid #E8ECEB; margin-bottom: 2rem!important; margin-top: 1rem !important; clear: both;}
.container img { max-width: 100%;}
.page-section { padding: 40px 0;}

/* Buttons */
.btn, .btn:visited { border-radius: 4px; text-decoration: none; padding: .5rem 2rem; text-transform: uppercase; color: #666;}
.btn.btn-green { background: #00C01B; color: #fff;}


/* Header */
#mainNav { background: #fff;}
.navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link:hover { color: #554f40; text-decoration: none; font-family: 'PT Sans', sans-serif;}
.navbar-light .navbar-nav .nav-link:hover { text-decoration: underline;}

@media (min-width: 992px){
	.navbar-expand-lg .navbar-collapse { border-bottom: 1px solid #e5e5e5; padding-bottom: 15px; padding-top: 25px;}
}
@media (max-width: 992px){
	#mainNav { padding-top: 5px !important; padding-bottom: 5px !important;}
	#mainNav .logo { max-width: 150px;}
}



/* Top banner*/
.top-banner { padding-top: 160px;}
.top-banner .container { max-width: 1280px;}
#school-accessories { background: #ff4026 url(../img/home_red_box_bg.jpg) repeat center center; }
.school-accessories { width: 460px; height: 310px; text-align: center; background: url(../img/school-accessories.png) no-repeat center top; padding-top: 60px; display: none;}
.school-accessories h3 { font-size: 18px; color: #0E0E0E; text-transform: uppercase; text-shadow: 1px 1px 5px #ccc; font-weight: bold;}
.school-accessories .h1 { font-weight: bold; font-size: 48px; text-shadow: 2px 3px 3px #ccc;}

@media (max-width: 992px){
	.top-banner { padding-top: 100px;}
	#school-accessories .col-lg-7 h3 { font-size: 18px;}
}


/* Products */
#products h3 { color: #62676b;}
#products .col-lg-4 { margin-bottom: 40px; padding: 0 25px;}
#products .col-lg-4 .prod_title { box-shadow: 0 3px 3px 0 #e5e5e5;  }
#products .col-lg-4 p { font-size: 15px;}
#products .col-lg-4 .prod_inner { padding: 0; position: relative;}
#products .col-lg-4 .prod_hover { position: absolute; display: none; _display: table-cell; color: #FFFBFB; background: rgba(255,74,49,0.9); width: 100%; height: 100%; box-shadow: 0 0 0 0 #fff; font-size: 14px; padding-top: 40px; left: 0; right: 0; top: 0;
bottom: 0; z-index: 10;}
#products .col-lg-4 .prod_hover p { font-size: 14px;}
#products .col-lg-4:hover .prod_hover { display: table-cell; cursor: default;}
.accessories-list { color: #383936; font-size: 16px;}

/* Promo */
#promo { background: #F5F5F3; padding-top: 0;}
#promo .container { padding-top: 5em;}
#promo h2 { text-transform: uppercase; display: block; margin: 0 auto; margin-top: -13px; width: 248px; height: 50px; line-height: 50px; padding: 0; background: url(../img/promo-title-bg.png) no-repeat center top; font-size: 16px; color: #FFFCFC; text-align: center; left: 15px; right: 15px; position: absolute;}
#promo #contactform input[type="text"], #promo #contactform input[type="email"] { display: block; width: 100%; text-align: left; border: 1px solid #CFCECD; box-shadow: 0 3px 3px 0 #e5e5e5; margin-bottom: 15px; height: 40px; line-height: 40px; padding: 0 10px;}
#promo #contactform input[type="checkbox"] { margin-right: 5px;}
#promo #contactform p { margin-bottom: 10px;}
.call_me_success { margin: 0 auto; max-width: 100%; text-align: center; font-size: 14px; line-height: 21px; padding: 35px 20px; border: 1px solid #CFCECD; box-shadow: 0 3px 3px 0 #e5e5e5; background: #fff;}
.call_me_error { color: #FF4026; margin-bottom: 15px;}
.form-info { position: absolute; background: #fff; z-index: 999; top: 0; margin-top: -15px;}
.call_me_success h3 { font-size: 18px; font-weight: bold; color: #000; margin-bottom: 25px;}

#to_website { background: #FFD52A; padding: 2rem 0;}
#to_website .col-lg-5 { text-align: center;}
#to_website .col-lg-3 { text-align: right;}
.to_website_icons span { display: inline-block; text-align: center; margin-right: 40px; color: #000; font-size: 11px;}
#to_website .btn { box-shadow: 0 3px 5px 1px #c5c5c5;}

@media (max-width: 992px){
	#to_website { text-align: center;}
	#to_website .col-lg-4 img { margin-bottom: 20px;}
	#to_website .col-lg-3 { text-align: center; padding-top: 30px;}
}

/* Brands */
#brands { text-align: center; padding: 0 0 50px 0;}


/* Contact */
#contact { background: #281f1d url(../img/footer_bg.jpg) repeat center top; padding-top: 30px; padding-bottom: 50px;}
#contact h2 { color: #fff; text-align: center;}
#contact .divider { border-color: #FF0707;}
#contact .row .col-lg-3 { color: #919497;}
#contact .row .col-lg-3 hr { display: none;}
#topcontrol { left: auto !important; right: 20px; text-align: center; color: #919497;}
#topcontrol img { display: block; margin-left: 5px;}

@media (min-width: 992px){
	#contact .row .col-lg-3 { max-width: 20%;}
}
@media (max-width: 992px){
	#contact .row .col-lg-3 { text-align: center;}
	#contact .row .col-lg-3 hr { display: block; margin-bottom: 15px; margin-top: 15px; padding: 0; border: none; border-bottom: 1px solid #666; text-align: center; max-width: 40px; height: 1px;}
}




.slick-slide { margin: 0px 20px; text-align: center; }
.slick-slide img { width: auto; max-width: 100%; margin: 0 auto;}
.slick-slider { position: relative; display: block; box-sizing: border-box; 
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
            user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}
.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; }
.slick-list:focus { outline: none; }
.slick-list.dragging { cursor: pointer; cursor: hand; }
.slick-slider .slick-track, .slick-slider .slick-list{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}
.slick-track { position: relative; top: 0; left: 0; display: block; }
.slick-track:before, .slick-track:after { display: table; content: ''; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }
.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }
.slick-arrow.slick-hidden { display: none; }
.slick-prev { position: absolute; left: 0; top: 5px;}
.slick-next { position: absolute; right: 0; top: 5px;}


