@font-face {
font-family: 'Roboto';
src: url('../fonts/ncaa_michigan_st_spartans-webfont.woff2') format('woff2'),
url('../fonts/ncaa_michigan_st_spartans-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}

*{outline:none;}
body{font-family: 'Open Sans', Arial; background:#191919; padding:0 !important;}
h1,h2,h3,h4,h5,h6,p{margin:0; padding:0;}
.full-width{width:100%;}
.clear{clear:both;}


#header{padding:15px 0;}
#header #social{margin:15px 0 0 0; padding:0px; text-align:right;}
#header #social li{list-style:none; display:inline-block; padding:0; margin:0; border:none;}
#header #social li a i{font-size:14px; color:#848484; width:30px; line-height:30px; text-align:center; margin:0; transition:.3s;}
#header #social li a i:hover{color:#fff; background:#ed7717; border-radius:50%;}
#header .input-group{background:#282828; border-radius:4px; margin-top:15px;}
#header input{background:none; border:none; box-shadow:none; font-size:12px; color:#ed7717; height:30px; padding:0 15px;}
#header button{color:#ed7717;}

#nav{background:none; border:none; margin:15px 0 0 0; min-height:inherit; border-radius:0px; position:absolute; z-index:1; left:0; right:0;}
#nav .navbar-toggle{float:none; width:100%; margin:0; background:#ed7717; border:none; border-radius:0; color:#fff;}
#nav .navbar-nav > li > a{font-family:Roboto; font-size:20px; color:#fff; padding:0 20px; line-height:40px; transition: .3s;}
#nav .navbar-nav > li > a .caret{transform: rotate(0); transition:.3s;}
#nav .navbar-nav>.open> a .caret{transform: rotate(-180deg);}
#nav .navbar-nav>.open>a,
#nav .navbar-nav>li>a:hover{background:#ed7717 !important; color:#fff}
#nav .dropdown-menu{background:#ed7717 !important; border:none; border-radius:0; box-shadow:none; }
#nav .dropdown-menu>li>a{color:#fff; font-size:14px; transition: .3s;}
#nav .dropdown-menu>.open>a,
#nav .dropdown-menu>li>a:hover{background:#fff; color:#ed7717;}
#nav .dropdown-menu .dropdown-menu{background:#fff !important; margin:0;}
#nav .dropdown-menu .dropdown-menu>li>a{color:#ed7717; font-size:12px; transition: .3s;}
#nav .dropdown-menu .dropdown-menu>.open>a,
#nav .dropdown-menu .dropdown-menu>li>a:hover{background:#ed7717; color:#fff;}
#nav .dropdown-menu .caret{transform:rotate(-90deg); transition:.3s; margin-top:-4px;}
#nav .dropdown-menu>.open .caret{transform: rotate(90deg);}

#categoriesArea{margin-top:50px;}
.categoryThumbnail{padding:0; text-align:center; position:relative;}
.categoryThumbnail a{text-decoration:none;}
.categoryThumbnail img{filter:grayscale(100%); -webkit-filter:grayscale(100%); transition:.3s;}
.categoryThumbnail:hover img{filter:grayscale(0%); -webkit-filter:grayscale(0%);}
.categoryThumbnail .text{position:absolute; top:15px; right:15px; bottom:15px; left:15px; border:2px solid #ed7717; visibility:hidden; opacity:0; filter:alpha(opacity=0); transition:.3s;}
.categoryThumbnail:hover .text{visibility:visible;  opacity:1; filter:alpha(opacity=100);}
.categoryThumbnail h1{position:absolute; right:0; bottom:0; left:0; font-family:Roboto; font-size:30px; color:#000000; background:#fff; padding:30px 15px;}


#categories1{text-align:center;}
.catThumbnail{padding:0; position:relative;}
.catThumbnail:hover .txt{opacity:1; filter:alpha(opacity=100);}
.catThumbnail .txt{position:absolute; top:15px; right:15px; bottom:15px; left:15px; background:rgba(25,124,56,0.5); opacity:0; filter:alpha(opacity=0); transition:.3s;}
.catThumbnail h1{font-weight:800; font-size:40px; color:#fff; text-transform:uppercase; margin-top:50%; transform: translateY(-50%);}


#welcomeArea{margin-top:50px;}
#welcomeArea h1{font-family:Roboto; font-size:30px; color:#ed7717; margin-bottom:15px;}
#welcomeArea p{font-size:14px; color:#848484; margin-top:15px;}
#welcomeArea button{font-family:Roboto; font-size:16px; color:#ed7717; padding:0; margin-top:15px;}
#welcomeArea .col-md-offset-2{position:relative;}
#welcomeArea #aboutThumbnailArea{margin:0; position:absolute; left:-40%;}
#welcomeArea #aboutThumbnailArea .col-xs-6{padding:0; border-right:1px solid #232323;}
#welcomeArea #aboutThumbnailArea .col-xs-6:last-child{border:0;}
#welcomeArea .aboutThumbnail{background:#1e1e1e; border-bottom:1px solid #232323; padding:30px; text-align:center; transition:.3s;}
#welcomeArea .aboutThumbnail:last-child{border:none;}
#welcomeArea .aboutThumbnail:hover{background:#ed7717;}
#welcomeArea .aboutThumbnail a{color:#848484; transition:.3s; text-decoration:none;}
#welcomeArea .aboutThumbnail:hover a{color:#fff;}
#welcomeArea .aboutThumbnail i{font-size:40px; }
#welcomeArea .aboutThumbnail h2{font-family:Roboto; font-size:20px; margin-top:15px;}

#productsArea{margin:50px 0;}
#productsArea h1{font-family:Roboto; font-size:30px; color:#ed7717;}
.productThumbnail{margin-top:30px; text-align:center;}
.productThumbnail .image{background:#fff; position:relative;}
.productThumbnail .basketBtn{position:absolute; top:15px; left:15px; }
.productThumbnail .basketBtn i{background:#191919; border-radius:50%; color:#fff; width:40px; line-height:40px; transition:.3s;}
.productThumbnail .basketBtn i:hover{background:#ed7717;}
.productThumbnail .text{margin-top:15px;}
.productThumbnail h2{font-family:Roboto; font-size:20px; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.productThumbnail h3{font-size:12px; color:#fff; margin-top:5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

#fixBanner{padding:100px 30px; background:url(../images/fix-banner.jpg) center no-repeat #000;}

#newsArea{margin:50px 0;}
#newsArea h1{font-family:Roboto; font-size:30px; color:#ed7717; margin-bottom:15px;}
#newsArea p{font-size:14px; color:#848484; margin-top:15px;}
#newsArea .newsThumbnail{background:#fff; padding:15px; text-align:center; margin-top:30px;}
#newsArea .newsThumbnail h2{font-family:Roboto; font-size:24px; color:#ed7717;}
#newsArea .newsThumbnail p{font-size:12px; color:#848484; margin:10px 0;}
#newsArea .newsThumbnail button{font-family:Roboto; font-size:16px; color:#ed7717; padding:0;}

#servicesArea{}
.serviceThumbnail{background:url(../images/service-bg.jpg) no-repeat; background-size:100% 100%; border-radius:4px; text-align:center; padding:15px 10px;}
.serviceThumbnail h1{font-family:Roboto; font-size:20px; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.serviceThumbnail h1 i{margin-right:5px;}

#bottom{margin:20px 0 30px 0;}
#bottom h1{font-family:Roboto; font-size:24px; color:#ed7717; margin:30px 0 15px 0;}
#bottom img{margin:30px 0 15px 0;}
#bottom p{font-size:14px;  color:#848484;}
#bottom ul{margin:0; padding:0;}
#bottom li{display:block; font-size:14px; color:#848484; margin-bottom:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#bottom li:last-child{margin:0;}
#bottom li a{color:#848484;}
#bottom li i{margin-right:5px;}

#footer{margin-bottom:50px; text-align:center;}
#footer p{font-size:14px; color:#848484; margin-top:30px;}
#footer p a{color:#ed7717;}
#footer p span{margin:0 5px;}

#breadcrumb{background:url(../images/bg2.jpg) top center no-repeat; background-size:cover; padding:80px 0 30px 0; text-align:center;}
#breadcrumb .breadcrumb{margin:0; padding:0; background:none;}
#breadcrumb .breadcrumb li{font-size:12px; color:rgba(255,255,255,1);}
#breadcrumb .breadcrumb li a{color:rgba(255,255,255,0.8); transition:.3s;}
#breadcrumb h1{font-family:Roboto; font-size:30px; font-weight:700; color:#fff; text-transform:uppercase;}

#leftCategories{margin-bottom:30px;}
#leftCategories .panel{margin:30px 0 0 0; background:none; border:none; border-radius:0px; box-shadow:none;}
#leftCategories i{margin-left:5px; transform:rotate(0); transition:.3s;}
#leftCategories a[aria-expanded="true"] i{transform: rotate(-180deg); margin-top:5px;}
.menuLC1,
.menuLC2,
.menuLC3{display:block; margin-bottom:1px; text-decoration:none !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.menuLC1{font-size:14px; color:#fff !important; font-weight:700; padding:10px; text-transform:uppercase; background:#ed7717;}
.menuLC2{font-size:14px; color:#fff !important; padding:5px 10px; background:#282828;}
.menuLC3{font-size:12px; color:#fff !important; padding:5px 10px;}
.menuLC1:hover,
.menuLC2:hover,
.menuLC3:hover{color:#fff !important; background:#ed7717 !important;}


#largeImage{border:1px solid #ccc; padding:10px; background:#fff; margin-top:30px;}

#moreProducts{text-align:left;}
#moreProducts ul{margin:0px; padding:0px; text-align:center;}
#moreProducts ul li{width:19%; margin-top:10px; display:inline-block; list-style:none; border:1px solid #ccc;}

#productDetails{margin-top:30px; text-align:left;}
#productDetails h1{font-size:24px; color:#ed7717;}
#productDetails h2{font-size:14px; color:#fff; margin-top:5px;}
#productDetails p{font-size:14px; color:#fff;}
#productDetails p b{color:#ed7717; margin-right:5px;}

#productDetails form{margin-top:30px; text-align:left;}
#productDetails form label{font-size:14px; font-weight:500; color:#ed7717; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#productDetails form input,
#productDetails form select{box-shadow:none; border:1px solid #cccc; border-radius:0; font-size:12px; color:#000;}

#productDetails form .btn{font-family:Roboto; width:100%; background:#ed7717; border:none; border-radius:0; font-size:18px; color:#fff; border:1px solid #ed7717;}

#productDetails .media{margin-bottom:10px; text-align:left;}
#productDetails .media-left i{width:40px; font-size:14px; color:#fff; text-align:center; line-height:40px; background:#ed7717; border-radius:50%;}


#productDescription{margin-top:30px; text-align:left;}
#productDescription p{font-size:14px; font-weight:300; color:#fff; margin-top:15px;}
#productDescription p b{color:#ed7717; font-weight:700;}
#productDescription table{margin-top:30px;}
#productDescription td b{color:#ed7717;}
#productDescription td{font-size:14px; color:#fff; padding:5px 8px;}





.modal-open{overflow:auto !important;}
.productModalView #largeImage{margin:0px;}
.productModalView #productDetails h2{color:#000; }

@media(min-width:768px){
.productModalView{}
.productModalView .modal-dialog{top:50%; transform:translateY(-50%) !important; margin:0 auto !important;}
.productModalView .modal-dialog > button{width:40px; line-height:40px; background:#fff; border:none; border-radius:50%; font-size:20px; color:#1b3194; text-align:center; position:absolute; right:-20px; top:-20px; z-index:1;}
}

@media (min-width:992px) and (max-width:1199px){
.categoryThumbnail h1{font-size:28px;}

#welcomeArea .aboutThumbnail i{font-size:30px; }
#welcomeArea .aboutThumbnail h2{font-size:18px;}
}
@media (min-width:768px) and (max-width:991px){
.categoryThumbnail h1{font-size:20px;}

#welcomeArea .col-md-offset-2{margin-top:30px;}
}
@media (min-width:0px) and (max-width:767px){
#header img{margin:0 auto;}
#header #social{text-align:center;}

#nav{margin:0; position:static;}
#nav .dropdown-menu .caret{transform:rotate(0); transition:.3s;}
#nav .dropdown-menu>.open .caret{transform: rotate(-180deg);}

#categoriesArea{padding:0 15px;}
.categoryThumbnail h1{font-size:20px; padding:15px;}

#welcomeArea .col-md-offset-2{margin-top:30px;}
#welcomeArea #aboutThumbnailArea{position:static;}
#welcomeArea .aboutThumbnail{padding:30px 15px;}
#welcomeArea .aboutThumbnail i{font-size:30px; }
#welcomeArea .aboutThumbnail h2{font-size:18px;}

#productsArea .col-xs-6:nth-child(2n+1){padding-left:7.5px;}
#productsArea .col-xs-6:nth-child(2n+0){padding-right:7.5px;}

#servicesArea .col-xs-12 .serviceThumbnail{margin-bottom:15px;}
#servicesArea .col-xs-12:last-child .serviceThumbnail{margin-bottom:0;}

#breadcrumb{padding:30px 0;}
}