@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700');
@import url('https://fonts.googleapis.com/css?family=Roboto:400,700');

body {
	font-family: 'Roboto', sans-serif;
}

.home-carousel {
	margin-left:auto;
	margin-right:auto;
}
.home-carousel .slick-track img {
    opacity: 0.4;
}
.home-carousel .slick-current {
    opacity: 1 !important;
}
.navbar-dark .navbar-toggler {
	border: 0px;
	transform: scale(0.8);
}
.dropdown-menu {
	background-color:#343a40;
	border: 0px;
	padding-bottom: 0px;
}
.dropdown-item {
	color:#CCC;
	font-size: 90%;
    border-bottom: 1px solid #666;
}
.container.about {
	text-align: center;
	font-size: 105%;
	padding: 40px;
}

/**********
Custom Bootstrap
*********/
.custom-logo {
    padding: 20px;
    text-align: center;
	margin: 0px;
}
.products-range h2 {
    font-size: 140%;
    padding: 20px;
    text-align: center;
}

.brands-nav {
            margin: 20px auto;
            padding: 0;
			text-align: center;
        }
        .brands-nav span {
            font-size: 14px;
            align-items: center;
            margin: 3px;
            padding: 5px 10px;
            list-style: none;
            cursor: pointer;
            transition: all .5s;
			background-color: #eee;
			text-align: center;
			display: inline-block;
        }
.brands-nav span.active {
    background: #0ca4fc;
}
footer {
    padding: 20px;
    text-align: center;
    margin-top: 60px;
    font-size: 80%;
}

/**********
Filterizr Style
*********/
.products-range .filter {
    text-align: center;
    margin: auto 20px;
}
.products-range .products {
    max-width: 1000px;
    text-align: center;
    margin: 10px auto;
}

[class^='filtr-'],
        [class*='filtr-'] {
            font-size: 14px;
            display: flex;
            align-items: center;
            justify-content: center;
            box-sizing: border-box;
            box-shadow: 0 0 0 2px #f1f1f1 inset;
}

@media screen and (max-width : 451px) {

[class^='filtr-'],
        [class*='filtr-'] {
			width: 120px;
        	height: 200px;
	}
}
@media screen and (min-width : 450px) {

[class^='filtr-'],
        [class*='filtr-'] {
			width: 240px;
        	height: 300px;
	}
}
.wrapper {
	max-width: 800px;
	margin: auto;
}
