IKEA CSS

 

 

<link rel="stylesheet" type="text/css" href="https://code.kubanavratil.com/user/documents/upload/res2020/owl.carousel.min.css">
<link rel="stylesheet" type="text/css" href="https://code.kubanavratil.com/user/documents/upload/res2020/owl.theme.default.min.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
<style>
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;400;469;500;600;700&display=swap');
xxxbody * {font-family: 'Noto Sans', sans-serif !important;}
.navigation-in>ul>li>a, .menu-helper>span, .menu-helper > ul > li a, .navigation-buttons a[data-target="search"], .navigation-buttons a[data-target="cart"], .navigation-buttons a[data-target="login"], .navigation-buttons a[data-target="navigation"], .navigation-in>ul>li.exp>a {color: #111;}
.navigation-in>ul>li>a:hover, .menu-helper>span:hover, .menu-helper > ul > li a:hover, .navigation-buttons a[data-target="search"]:hover, .navigation-buttons a[data-target="cart"]:hover, .navigation-buttons a[data-target="login"]:hover, .navigation-buttons a[data-target="navigation"]:hover {color: #0058a3;}
#header, .navigation-in, .menu-helper>span, .navigation-buttons a[data-target="search"], .navigation-buttons a[data-target="login"], .navigation-buttons a[data-target="cart"], .navigation-buttons a[data-target="navigation"], .menu-helper>ul>li.exp>a, .menu-helper>ul>li.exp>ul>li {background-color: #fff; border-color: #fff;}
.navigation-buttons a[data-target="search"]:hover, .navigation-buttons a[data-target="cart"]:hover, .navigation-buttons a[data-target="login"]:hover, .navigation-buttons a[data-target="navigation"]:hover {background-color: #0058a3; border-color: #0058a3;color:#fff;}
.navigation-in ul.menu-level-2, .menu-helper>ul {background-color: #0058a3;border-color: #0058a3;}
.navigation-in ul.menu-level-2 li a:hover, .menu-helper>ul a:hover {xxxbackground-color: #004076;}
.navigation-in ul li a b {font-weight: 400;text-transform: uppercase;}
@media (min-width: 992px) {
.container.navigation-wrapper .site-name {flex-basis: 270px;}
#header .site-name a img {max-height: unset;width: 250px;}
.navigation-in ul.menu-level-2 {xxxtop: 80px;}
.navigation-buttons {padding-left: 29px;}
}
@media (max-width: 767px) {
#header {padding: 20px 10px;}
.navigation-buttons a[data-target="login"] {display: none;}
.navigation-buttons {top: 20px;}
}

.extended-banner-title, .extended-banner-text, .extended-banner-link {position: unset !important;border: none;background-color: transparent; box-shadow: none;color: #fff;}
.extended-banner-texts {padding: 20px;display: flex;flex-direction: column;flex-wrap: wrap;justify-content: flex-end;opacity: 0;transition: all 0.5s ease;}
.extended-banner-texts:hover {opacity: 1;background:#00000075;}

 

.columns-3 .products-block > div, .columns-4 .products-block>div {width: 100%;}

.homepage-texts-wrapper {display: none;}
.products-block > div .p {border-color:transparent;}
.products-block > div .p > a {border-radius: 12px;overflow:hidden;}
.products-block > div .p:hover > a {background:#000;}
.products-block > div .p:hover > a img {opacity: 0.5;}
#homepageProducts2 {display: block;opacity:1;}
.shp-tabs-row.responsive-nav {display: none;}

 

.products-block > div .p .name, .extended-banner-title {
font-size: 24px;
font-weight: 900;
text-align: left;
height: auto;
text-transform: uppercase;
letter-spacing: 5px;
}
.products-block .p-bottom .prices {text-align: left;padding-left: 6px;}
.products-block > div .p .p-bottom > div .p-tools {
justify-content: flex-start;
text-align: left;
padding-left: 5px;
}
.products-block > div .p:before {
content: '';
display: block;
width: 21px;
height: 21px;
border: solid 7px #fbd914;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
position: absolute;
top: 10px;
left: 10px;
z-index: 2;
}
.products-block > div .p:after {
transition: all 0.5s ease;
content: 'DOPORUČUJEME';
display: block;
opacity: 0;
padding: 0;
height: 21px;
width: 0;
background: #fbd914;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
position: absolute;
top: 10px;
left: 31px;
z-index: 2;
}
.products-block > div .p:hover:after {
width: auto;
opacity: 1;
padding: 0 10px;
}
@media (max-width:768px) {
.tab-pane .products-block {margin: 0;}
.tab-content {padding-left: 0px;padding-right: 0px;}
.index-content-wrapper {margin-right: -20px;width: calc(100% + 20px);}
.owl-item .item {padding-left:20px;}
.owl-item .item img {border-radius: 12px 0px 0px 12px;}
.container.navigation-wrapper .site-name {flex: 0 1 200px;}
}

.products-block > div .p .p-in {margin-top: -40px; position: relative;padding-top:0;}
.products-block > div .p .name {opacity: 0;padding-bottom: 20px;color:#fff;font-weight: 900;}
.products-block > div .p:hover .name {opacity: 1;}
.owl-theme .owl-nav.disabled+.owl-dots {margin-bottom: 30px;}

 

.homepage-box.before-carousel {
border-top-color: #fff;
border-bottom-color: #fff;
background-color: #fff;
padding:0;
}
.homepage-box.before-carousel .container {width:100%;}
/* FashionPlanet menu */
@media (min-width: 768px) {
.submenu-visible .navigation-in>ul>li.ext.exp>ul {flex-direction: column;max-height: 282px; max-width: 728px;}
.submenu-visible .navigation-in>ul>li.ext.exp>ul li {width:25%;border-right: solid 1px #dadada;}
.navigation-in>ul>li.ext>ul>li>a {display: none;}
.navigation-in>ul>li.ext>ul>li {min-height: 35px;}
.navigation-in>ul>li.ext>ul>li>div>a {padding: 10px 20px;}
.navigation-in>ul>li.ext>ul>li>div {width: 100%;}
.navigation-in>ul>li.ext>ul>li:last-child>div {position: relative; height: 282px; width: 100%;}
.submenu-visible .navigation-in>ul>li.ext.exp>ul:after {content:'Při nákupu nad 1999,- máte u nás dopravu zdarma';
display: block;
background: #000;
color: #fff;
position: absolute;
bottom: -34px;
left: 0;
right: 0;
font-size: 16px;
font-weight: 600;
font-family: 'Oswald', sans-serif;
padding: 10px 30px;
max-height: 34px;
overflow: hidden;
white-space: nowrap;}
}
.navigation-in ul.menu-level-2, .menu-helper>ul {background-color: #f0f0f0;border-color: #000;}
.menu-level-2 h5 {padding-left: 20px;font-weight: 600;}
.navigation-in>ul>li.ext>ul>li>div>a {font-weight: 300; font-size: 12px;font-family: 'Oswald', sans-serif !important;}
.navigation-in>ul>li.ext>ul>li>div>a:hover {color: #c77e7f;}
.navigation-in>ul>li.ext>ul>li:last-child>div {margin-bottom: 0;background-image: url("https://www.fashionplanet.cz/user/documents/upload/menu_img.png"); background-size: cover;}
.navigation-in>ul>li.ext>ul>li:last-child {border-right:none;}
@media (max-width:768px) {
.navigation-in ul.menu-level-2 {padding:20px;}
.navigation-in>ul>li.ext>ul>li:last-child>div {width:100%;height:250px;}
}
</style>