html { box-sizing:border-box; height:100%; }
*, *:before, *:after { box-sizing:inherit; }

body { background:#814b7f url('../img/catalog/bg.png') fixed repeat left top; font-size:14px; font-family:'Newslab', serif; color:#333333; line-height:1.5; height:100%; }

img { max-width:100%; height:auto; }

#container { display:flex; flex-direction:column; height:100%; }

.container { padding:0 20px; }

#header { flex:0 0 auto; padding:20px 0 10px; }

#header-columns { display:flex; align-items:center; margin-bottom:10px; }

#logo { width:20%; }
#logo img { width:50%; vertical-align:bottom; }

#title { width:60%; font-size:36px; font-family:'Emily Lime Pro', serif; text-align:center; color:#fee404; line-height:1; padding:0 10px; }

#back { width:20%; text-align:right; }
#back a { font-size:16px; color:#fff; transition:color 0.5s; text-decoration:none; }
#back a:hover { color:#fee404; }

#search { background-color:rgba(0, 132, 141, 0.75); border-radius:20px; overflow:hidden; padding:0 20px; }
#search input { float:left; font-size:15px; width:95%; height:36px; color:#fff; background-color:transparent; border-width:0; padding:0; outline-width:0; line-height:36px; }
#search input::-webkit-input-placeholder { color:#fff; }
#search input:-moz-placeholder { color:#fff; }
#search input::-moz-placeholder { color:#fff; }
#search input:-ms-input-placeholder { color:#fff; }
#search button { float:right; font-size:20px; outline-width:0; border-width:0; width:5%; height:36px; padding:0; background-color:transparent; color:#fff; transition:color 0.5s; }
#search button:hover { color:#fee404; }

#body { flex:1 1 auto; overflow-y:auto; }

#catalog { padding:0 60px; }

.slick-arrow { position:absolute; top:50%; display:block; background-color:rgba(0, 132, 141, 0.75); width:40px; height:160px; margin-top:-80px; z-index:99; text-align:center; line-height:160px; color:#fff; font-size:42px; border-radius:5px; }

.slick-prev { left:0; }
.slick-next { right:0; }

.slick-dots { list-style-type:none; margin:0; padding:0; text-align:center; }
.slick-dots li { display:inline-block; margin:5px; }
.slick-dots li button { background-color:rgba(0, 132, 141, 0.75); color:#fff; padding:0; width:35px; height:35px; line-height:35px; border-width:0; outline-width:0; border-radius:5px; transition:background-color 0.5s; }
.slick-dots li button:hover, .slick-dots li.slick-active button { background-color:#27AB4A; }

.product-category { float:left; padding:10px; width:20%; }
.product-category a { background-color:#fff; border-radius:10px; box-shadow:5px 5px 10px 0px rgba(0, 0, 0, 0.25); border-width:5px; border-style:solid; display:block; position:relative; -webkit-tap-highlight-color:rgba(0, 132, 141, 0.75); text-decoration:none; }
.product-category img { display:block; padding:10px; width:100%; }
.product-category-description { font-size:15px; font-weight:bold; text-align:center; color:#fff; padding-top:5px; position:absolute; bottom:0; width:100%; line-height:1; }

.product { float:left; padding:10px; width:20%; }
.product a { background-color:#fff; border-radius:10px; box-shadow:5px 5px 10px 0px rgba(0, 0, 0, 0.25); border-width:5px; border-style:solid; display:block; -webkit-tap-highlight-color:rgba(0, 132, 141, 0.75); }
.product img { display:block; padding:5px; width:100%; }

.color-1 a, .color-7 a { border-color:#c12826; }
.color-2 a, .color-8 a { border-color:#f07332; }
.color-3 a, .color-5 a { border-color:#00848d; }
.color-4 a, .color-6 a { border-color:#27ab4a; }

.color-1 .product-category-description, .color-7 .product-category-description { background-color:#c12826; }
.color-2 .product-category-description, .color-8 .product-category-description { background-color:#f07332; }
.color-3 .product-category-description, .color-5 .product-category-description { background-color:#00848d; }
.color-4 .product-category-description, .color-6 .product-category-description { background-color:#27ab4a; }

.no-results { font-size:48px; text-align:center; color:#fff; }

.fancybox-navigation .fancybox-button, .fancybox-toolbar { opacity:1 !important; visibility:visible !important; }
.fancybox-button { color:#fff; width:90px; height:90px; }
.fancybox-navigation .fancybox-button { padding:0; width:90px; height:90px; }