/* Copyright (C) YOOtheme GmbH, YOOtheme Proprietary Use License (http://www.yootheme.com/license) */

/* ========================================================================
   Use this file to add custom CSS easily for Jacuzzi
 ========================================================================== */

/* ========================================================================
   FONT ISSUE
 ========================================================================== */

@import url(https://fonts.googleapis.com/css?family=Lato:400,700,900,300);
@import url(https://fonts.googleapis.com/css?family=Roboto:400,500,700,900,300);

body {
  font-family: ‘Roboto’, arial, san-serif;
}


/* ========================================================================
   BUTTONS
 ========================================================================== */

.uk-button {
    font-weight: 400;
}

.yoo-zoo.product-uikit .element-itemlink > a {  
    background: #000000;
    color: #FFFFFF; 
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 10px;
    text-transform: uppercase;
    font-size: 14px;
}

.yoo-zoo.product-uikit .element-itemlink > a:hover {
    background: #E7B200;
    transition: background 0.3s, color 0.3s ease-in-out;
}

.uk-subnav > * {
    padding-left: 0px;
}


/* ========================================================================
   SLIDESHOW / SLIDE NAV
 ========================================================================== */

.uk-slidenav.uk-slidenav-previous,  
.uk-slidenav.uk-slidenav-next {  
    margin-left: -50px;
    margin-right: -50px; 
}

.uk-overlay-background {
    background: rgba(20,20,20,0.35);
}


/* ========================================================================
   TOOLBAR
 ========================================================================== */

.tm-toolbar {
    padding-top: 3px;
    padding-bottom: 0px;
}


/* ========================================================================
   NAVBAR
 ========================================================================== */

.tm-navbar, .tm-navbar > div {
    height: 110px;
}

.uk-nav-navbar > li > a {  
    color:#FFFFFF;
    font-size: 15px;
    font-weight: 400;
}

.uk-nav-navbar > li > a:hover {  
    color:rgba(255,255,255,0.5);
    font-size: 15px;
    font-weight: 400;
}

.uk-navbar-nav > li > a {
    height: 110px;
    line-height: 90px;
}

.uk-subnav > * > * {
    display: inline-block;
    color: rgba(77, 77, 77, 0.9);
}


/* ========================================================================
   FONT WEIGHT
 ========================================================================== */

h1, .uk-h1,
h2, .uk-h2,
h3, .uk-h3 {
    font-weight: 400;
}


/* ========================================================================
  GREY MODULE BACKGROUND
 ========================================================================== */

.tm-block-grey {
    background: #f6f6f6;
}

/* ========================================================================
   Mobile Text
 ========================================================================== */

@media(min-width: 320px) and (max-width: 768px) { 
h1 {font-size: 22px; line-height: 28px;}
h2 {font-size: 20px; line-height: 28px;}
h3 {font-size: 18px;}
h3 {font-size: 16px; line-height: 22px;}
h4 {font-size: 14px; letter-spacing: 1px;}
.uk-article-title {font-size: 24px;}
.uk-article-title {line-height: 32px;}
}

@media (min-width: 760px) and (max-width: 1216px) {
viewport {font-size: 12px;}
}


/* ========================================================================
   GRID - REMOVE BOTTOM TINY BAR
 ========================================================================== */

.tm-grid-lykka.uk-grid > div > .uk-panel p:last-child:before {
    content: '';
    border-bottom: 0px solid rgba(51, 51, 51, 0.1);
}


/* ========================================================================
   TABS
 ========================================================================== */

.uk-subnav-pill > * > * {
    padding: 3px 7px;
}

.uk-tab > li > a {
    letter-spacing: 2px;
    font-size: 18px;
    text-transform: uppercase;
    color: #000;
}

.uk-tab > li.uk-active > a {
    border-bottom-color: transparent;
    letter-spacing: 2px;
    font-size: 18px;
    text-transform: uppercase;
    color: #000;
    font-weight: 400;
    border-style: solid;
}

.uk-tab > li.uk-active > a {
    border-color: #000;
}

.uk-tab-center {
    border-bottom: 1px solid #000;
}


/* ========================================================================
   ZOO - layout
 ========================================================================== */

.uk-list > li:before,
.uk-list > li:after {
  content: "";
  display: inline;
}

.tm-noblog.tm-fullscreen > .tm-block-full-width > .uk-container { 
max-width: none !important; 
padding: 0 !important; 
}

.uk-panel-box {
    background: #ffffff;
    color: #666666;
    border: 1px solid #f1f1f1;
    background-color: #ffffff;
}

.uk-thumbnail {
    border: 0px solid rgba(51, 51, 51, 0.1);
}

@media (min-width: 1230px) {
.uk-panel-box div.uk-panel-teaser {
    margin-top: -10px;
    margin-left: -40px;
    margin-right: -40px;
}
}


/* ========================================================================
   Mobile Responsive Menu
 ========================================================================== */

@media (max-width: 1460px) {
.uk-navbar-nav > li > a {
    font-size: 14px;
}
.tm-navbar .tm-logo > * {
    width: 280px;
}
}

@media (max-width: 1410px) {
.uk-navbar-nav > li > a {
    font-size: 13px;
}
.tm-navbar .tm-logo > * {
    width: 250px;
}
}

@media (max-width: 1335px) {
.uk-navbar-nav > li > a {
    padding: 0 10px;
    font-size: 13px;
}
.tm-navbar .tm-logo > * {
    width: 210px;
}
.tm-toolbar, .tm-navbar > div {
    padding-left: 20px;
    padding-right: 20px;
}
}

@media (max-width: 1180px) {
.uk-navbar-nav > li > a {
    padding: 0 10px;
    font-size: 13px;
}
.tm-navbar .tm-logo > * {
    width: 200px;
}
.tm-toolbar, .tm-navbar > div {
    padding-left: 5px;
    padding-right: 5px;
}
}

@media (max-width: 1080px) {
.uk-navbar-nav > li > a {
    padding: 0 9px;
    font-size: 12px;
}
.tm-navbar .tm-logo > * {
    width: 190px;
}
.tm-toolbar, .tm-navbar > div {
    padding-left: 5px;
    padding-right: 5px;
}
}

@media (max-width: 1040px) {
.uk-navbar-nav > li > a {
    padding: 0 8px;
    font-size: 12px;
}
.tm-navbar .tm-logo > * {
    width: 180px;
}
.tm-toolbar, .tm-navbar > div {
    padding-left: 5px;
    padding-right: 5px;
}
}

@media (min-width: 760px) and (max-width: 1010px) {
.uk-navbar-nav > li > a {
    padding: 0 5px;
    font-size: 11px;
}
.tm-navbar .tm-logo > * {
    width: 155px;
}
.tm-toolbar, .tm-navbar > div {
    padding-left: 5px;
    padding-right: 5px;
}
}


.uk-navbar-content,
.uk-navbar-brand,
.uk-navbar-toggle {
  box-sizing: border-box;
  display: block;
  height: 150px;
  padding: 0 0px;
  float: left;
}