/* styling here */
@import url('https://fonts.googleapis.com/css?family=Nunito+Sans:200,300,400,700,900');

@import "home.css";
@import "company.css";
@import "brands.css";
@import "contacts.css";
@import "products.css";
@import "header.css";
@import "footer.css";

/* TABLET */
@media (min-width: 768px) {
	.sm-spacer150 {height: 150px;}
	.sm-spacer120 {height: 120px;}
	.sm-spacer90 {height: 90px;}
	.sm-spacer60 {height: 60px;}
	.sm-spacer30 {height: 30px;}
	.sm-spacer15 {height: 15px;}

	.sm-block150 {display: inline-block; width: 150px;}
	.sm-block120 {display: inline-block; width: 120px;}
	.sm-block90 {display: inline-block; width: 90px;}
	.sm-block60 {display: inline-block; width: 60px;}
	.sm-block30 {display: inline-block; width: 30px;}
	.sm-block15 {display: inline-block; width: 15px;}

	.sm-taleft {text-align: left;}
	.sm-tacenter {text-align: center;}
	.sm-taright {text-align: right;}
	.sm-tajustify {text-align: justify;}
}

/* DESKTOP */
@media (min-width: 992px) {
	.md-spacer150 {height: 150px;}
	.md-spacer120 {height: 120px;}
	.md-spacer90 {height: 90px;}
	.md-spacer60 {height: 60px;}
	.md-spacer30 {height: 30px;}
	.md-spacer15 {height: 15px;}

	.md-block150 {display: inline-block; width: 150px;}
	.md-block120 {display: inline-block; width: 120px;}
	.md-block90 {display: inline-block; width: 90px;}
	.md-block60 {display: inline-block; width: 60px;}
	.md-block30 {display: inline-block; width: 30px;}
	.md-block15 {display: inline-block; width: 15px;}

	.md-taleft {text-align: left;}
	.md-tacenter {text-align: center;}
	.md-taright {text-align: right;}
	.md-tajustify {text-align: justify;}
}

/* LARGE DISPLAY'S */
@media (min-width: 1200px) {
	.lg-spacer150 {height: 150px;}
	.lg-spacer120 {height: 120px;}
	.lg-spacer90 {height: 90px;}
	.lg-spacer60 {height: 60px;}
	.lg-spacer30 {height: 30px;}
	.lg-spacer15 {height: 15px;}

	.lg-block150 {display: inline-block; width: 150px;}
	.lg-block120 {display: inline-block; width: 120px;}
	.lg-block90 {display: inline-block; width: 90px;}
	.lg-block60 {display: inline-block; width: 60px;}
	.lg-block30 {display: inline-block; width: 30px;}
	.lg-block15 {display: inline-block; width: 15px;}

	.lg-taleft {text-align: left;}
	.lg-tacenter {text-align: center;}
	.lg-taright {text-align: right;}
	.lg-tajustify {text-align: justify;}
}

/* MOBILE */
@media (max-width: 767px) {
	.xs-spacer150 {height: 150px;}
	.xs-spacer120 {height: 120px;}
	.xs-spacer90 {height: 90px;}
	.xs-spacer60 {height: 60px;}
	.xs-spacer30 {height: 30px;}
	.xs-spacer15 {height: 15px;}

	.xs-block150 {display: inline-block; width: 150px;}
	.xs-block120 {display: inline-block; width: 120px;}
	.xs-block90 {display: inline-block; width: 90px;}
	.xs-block60 {display: inline-block; width: 60px;}
	.xs-block30 {display: inline-block; width: 30px;}
	.xs-block15 {display: inline-block; width: 15px;}

	.xs-taleft {text-align: left;}
	.xs-tacenter {text-align: center;}
	.xs-taright {text-align: right;}
	.xs-tajustify {text-align: justify;}
}

html body
{
	font-family: 'Nunito sans', sans-serif;
	font-size: 16px;
	color: #fff;
}

img
{
	max-width: 100%;
}

h1
{
	font-size: 50px;
	color: #000;
	text-transform: uppercase;
}

.banner
{
	margin-top: -52px;
	background-position: center top !important;
	background-repeat: no-repeat !important;
	background-size: cover !important;
}

.banner h2 span
{
	font-weight: 700;
	color: #fff;
	font-style: italic;
	font-size: 48px;
	text-transform: uppercase;
	border-bottom: 5px solid #f7a219;
}

.banner h2
{
	text-align: center;
}

.banner h1
{
	text-align: left;
	color: #fff;
	margin-top: 0px;
}

.banner h1, .banner h2
{
	font-style: italic;
	font-weight: 300;
}

h1 b
{
	color: #f7a219;
}

h3
{
	font-size: 30px;
	color: #fff;
	margin-top: 0px;
	font-style: italic;
	font-weight: 300;
}

h3 b
{
	color: #f7a219;
	font-style: normal;
}

.textContacts h3
{
	color: #000;
	font-style: normal;
}

.btn
{
	font-size: 16px;
}

.btn-default
{
	color: #fff;
	background-color: #f7a219;
	border-color: #f7a219;
	padding: 15px 60px;
	border-radius: 0px;
	border-width:2px;
}

.btn-default:hover
{
	color: #f7a219;
	background-color: #000;
	border-color: #f7a219;
}

.btn-primary
{
	color: #f7a219;
	background-color: #000;
	border-color: #000;
	padding: 15px 60px;
	border-radius: 0px;
	border-width:2px;
}

footer .btn-primary
{
	border-color: #f7a219;
}

.btn-primary:hover
{
	color: #fff;
	background-color: #f7a219;
	border-color: #f7a219;
}

footer .btn-primary:focus
{
	background-color: transparent;
	border-color: #f7a219;
	color: #f7a219;
}

.btn-link
{
	background-color: #fff;
	color: #000;
	padding: 9px 50px;
	text-transform: uppercase;
	border: 1px solid #fff;
}

.btn-link:hover
{
	background-color: transparent;
	color: #fff;
	border: 1px solid #fff;
	text-decoration: none;
}

.slice
{
	transform: skewX(-20deg);
	-ms-transform: skewX(-20deg);
	-webkit-transform: skewX(-20deg);
}

.slice span
{
	transform: skewX(20deg);
	-ms-transform: skewX(20deg);
	-webkit-transform: skewX(20deg);
	display: block;
}


.yellow-bg
{
	background-color: #f7a219;
}

.black-bg
{
	background-color: #000;
}

.banner-products
{
	background-image: url(../images/sections/know-products.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

.banner-products h1, .banner-contact-us h1{
	font-weight: 300;
}

.banner-contact-us
{
	background-image: url(../images/sections/contact-us.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top center;
}

.brand-slides
{
	background-image: url(../images/sections/brands-slide.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

.carousel-indicators li
{
	height: 13px;
	width: 43px;
	background-color: #fff;
	border-radius: 0px;
	border-color: #fff;
	transform: skewX(-20deg);
	-ms-transform: skewX(-20deg);
	-webkit-transform: skewX(-20deg);
	border: 0px;
	margin: 0px !important;
	margin-left: 5px !important;
	margin-right: 5px !important;
}


.carousel-indicators .active
{
	background-color: #f7a219;
	border: 0px;
	height: 13px;
	width: 43px;
}

button, a {
	-webkit-transition: all 200ms ease 0s; /* Safari */
	transition: all 200ms ease 0s;
}

a.active
{
	color: #f7a219 !important;
}

.form-control:focus
{
	border-color: #f7a219;
	-webkit-box-shadow: inset 0 1px 1px rgba(247, 162, 25,.075), 0 0 8px rgba(247, 162, 25,.6);
	box-shadow: inset 0 1px 1px rgba(247, 162, 25,.075), 0 0 8px rgba(247, 162, 25,.6);
}

a:focus
{
	outline: none;
}

/*MEDIA QUERIES*/
@media (max-width: 767px)
{
	h1
	{
		font-size: 40px;
	}

	.navbar-brand>img
	{
		margin-top: 0px;
		max-width: 195px;
	}

	.navbar
	{
		height: 65px;
	}

	.navbar-toggle
	{
		margin-top: 15px;
	}

	.container>.navbar-collapse
	{
		margin-top: 6px;
	}

	ul.nav.navbar-nav.navbar-right
	{
		background: #000;
		border-bottom: 1px solid #f7a219;
	}

	.navbar-nav
	{
		margin: 0px -15px;
	}

	.navbar-default .navbar-nav>li>a
	{
		padding-right: 15px;
		padding-left: 15px;
	}

	.nav .slice
	{
		margin-left: 25px;
	}

	.home
	{
		margin-top: 0px;
	}

	.banner-products, .banner-contact-us
	{
		background: none;
	}

	.btn-primary, .btn-default, .btn-link
	{
		padding: 10px 15px;
	}

        .banner h2 span
        {
                font-size: 40px;
        }

}

@media (min-width: 768px) and (max-width: 991px)
{

}

@media (min-width: 992px)
{

}