@charset "utf-8";
body,html{font-family:'Open Sans',sans-serif;font-weight:400;color:#1f2226;font-size:16px;line-height:1.6;word-wrap:break-word;background:#fff}
:root{--default:#1f2226;--black:#000;--white:#fff;--yellow:#f7b602;--tcBlue:#14256a;}
:focus{outline:0}
h1{font-size:inherit;line-height:inherit;font-weight:inherit;margin:inherit;padding:inherit}
h1.categoryTitle{font-size:28px;color:var(--default);font-weight:700;margin-bottom:10px}
h2{font-size:inherit;line-height:inherit;font-weight:inherit;margin:inherit}
a{text-decoration:none;color:inherit;outline:0}
/*p{margin:0 0 20px}*/
/*p:last-child{margin:0}*/
input:focus{outline:0}
body.doNotScroll{overflow:hidden;height:100vh}
.flex{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}
.centerFlex{place-content:center}
.flexHeader{display:flex;align-items:center;justify-content:space-between;padding:20px 0 0}
.align-items-start{-ms-flex-align:start;align-items:flex-start}
.align-items-center{-ms-flex-align:center;align-items:center}
.align-items-end{-ms-flex-align:end;align-items:flex-end}
.transition2s{transition:all .2s linear 0s;-webkit-transition:all .2s linear 0s;-moz-transition:all .2s linear 0s;-o-transition:all .2s linear 0s;-ms-transition:all .2s linear 0s}
.transition3s{transition:all .3s linear 0s;-webkit-transition:all .3s linear 0s;-moz-transition:all .3s linear 0s;-o-transition:all .3s linear 0s;-ms-transition:all .3s linear 0s}
.nonMobile{display:block}
.mobile{display:none}
.text-small{font-size:14px;color:#757575}
.pp-r{font-family:'Oswald Regular',sans-serif}
.pp-m{font-family:'Oswald Medium',sans-serif}
.pp-b{font-family:'Oswald Bold',sans-serif}
.pp-sb{font-family:'Oswald SemiBold'}
img:not([alt]){border:5px solid red}
.italic{font-style: italic;}

.topHead .topHeadHolder{display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding: 25px 0;}
.topHead .topHeadHolder .headerLogo{width: 240px;}
.topHead .topHeadHolder .headerLogo a{display: block; width: 100%;}
.topHead .topHeadHolder .headerLogo a img{width: 100%; height: 100%;}
.topHead .topHeadHolder .headerMenu{list-style: none; display: flex; flex-direction: row;}
.topHead .topHeadHolder .headerMenu li{margin-right: 30px;}
.topHead .topHeadHolder .headerMenu li a{font-size: 14px; font-weight: 700;}
.topHead .topHeadHolder .headerSocial{display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: 150px;}
.topHead .topHeadHolder .headerSocial a{font-size: 26px; color: var(--tcBlue);}

.bottomHead{background-color: var(--tcBlue);}
.bottomHead .bottomHeadHolder{display: flex; flex-direction: row; justify-content: space-between; align-items: center;}
/*.bottomHead .bottomHeadHolder .topSearch{width: 350px;}
.bottomHead .bottomHeadHolder .topSearch form{position: relative; width: 100%;}
.bottomHead .bottomHeadHolder .topSearch form input{border-radius: 30px; width: 100%; border: 0; height: 45px; padding-left: 20px;}
.bottomHead .bottomHeadHolder .topSearch form button{background-color: #253237; border: 0; color: #fff; position: absolute; top: 0; right: -23px; height: 100%; width: 55px; border-radius: 0 30px 30px 0; text-align: center; font-size: 20px;}*/
.bottomHead .bottomHeadHolder .allCategories{background-color: #0583d7; padding: 10px 20px; cursor: pointer; position: relative;}
.bottomHead .bottomHeadHolder .allCategories .allCategoriesHeader{color: var(--white); font-size: 14px; font-weight: 700;}
.bottomHead .bottomHeadHolder .allCategories .allCategoriesHeader i:first-of-type{margin-right: 15px; font-size: 20px;}
.bottomHead .bottomHeadHolder .allCategories .allCategoriesHeader i:last-of-type{margin-left: 120px;}
.bottomHead .bottomHeadHolder .allCategories .allCategoriesMenu{display: none;}
.bottomHead .bottomHeadHolder .allCategories .allCategoriesMenu.open{display: flex; flex-direction: column; width: 315px; position: absolute; top: 60px; left: 0; padding: 15px; list-style: none; z-index: 10; color: var(--white); background-color: var(--tcBlue);}
.bottomHead .bottomHeadHolder .allCategories .allCategoriesMenu.open li{font-size: 17px; font-weight: 400; margin-bottom: 25px;}
.bottomHead .bottomHeadHolder .headerPhone{display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: 170px;}
.bottomHead .bottomHeadHolder .headerPhone i{color: var(--white); font-size: 32px;}
.bottomHead .bottomHeadHolder .headerPhone p{color: var(--white); font-size: 14px; font-weight: 400;}
.bottomHead .bottomHeadHolder .headerPhone p a{font-size: 14px; font-weight: 700;}

.mainSwiper .swiper-wrapper{width: 100%; height: calc(500vw/15);}
.mainSwiper .swiper-wrapper .topItemHolder{display: flex; align-items: center; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover;}
.mainSwiper .swiper-wrapper .topItemHolder .bannerText{width: 70%;}
.mainSwiper .swiper-wrapper .topItemHolder .bannerText .topText{text-transform: uppercase; font-size: 17px; font-weight: 400; margin: 0 0 10px 70px; opacity: 0;}
.mainSwiper .swiper-wrapper .topItemHolder .bannerText h1{font-size: 45px; font-weight: 600; color: #253237; line-height: 1.2; margin-left: 70px; opacity: 0;}
.mainSwiper .swiper-wrapper .topItemHolder .bannerText h1 strong{font-size: 60px; font-weight: 700;}
.mainSwiper .swiper-wrapper .topItemHolder .bannerText .lowerText{font-size: 19px; font-weight: 400; margin-left: 70px; opacity: 0;}
@keyframes fadeInUp{
    0% {
        opacity: 0;
        transform: translate3d(0,100px,0);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}
.mainSwiper .swiper-wrapper .swiper-slide-active .bannerText .animate__animated{animation-delay: .5s; animation-name: fadeInUp; -webkit-animation-delay: .5s; -webkit-animation-name: fadeInUp;}

#section2{margin: 80px 0;}
#section2 .s2ItemHolder{display: flex; flex-direction: column-reverse; margin-right: 10px;}
#section2 .s2ItemHolder .s2TextHolder{background-color: #f5f5f5;}
#section2 .s2ItemHolder .s2TextHolder .s2Title{color: var(--tcBlue); font-size: 36px; font-weight: 700; text-align: center;}
#section2 .s2ItemHolder .s2TextHolder p{margin-left: 20px;}
#section2 .s2ItemHolder .s2ImgHolder{width: 100%;}
#section2 .s2ItemHolder .s2ImgHolder img{width: 100%;}

#section3 h1{font-size: 90px; font-weight: 300; text-align: center; margin-bottom: 60px;}
#section3 p{text-align: justify;}

#izdvojeno{margin-top: 60px; margin-bottom: 100px;}
#izdvojeno .productLine{ margin-bottom: 25px;}
#izdvojeno .productLine .productsHolder{display: flex; flex-direction: row;flex-wrap: wrap; justify-content: space-between; align-items: center;}
#izdvojeno .productsTitle{color: var(--tcBlue); font-size: 42px; font-weight: 600; text-align: center;}
#izdvojeno .productHolder{border: 1px solid #ebebeb; border-radius: 5px; padding: 20px; transition: all .3s linear; width: 32%; margin-bottom: 20px;}
#izdvojeno .productHolder:hover{border-color: var(--tcBlue);}
#izdvojeno .productHolder .productTextHolder .productTitle{font-size: 16px; font-weight: 700; color: var(--tcBlue); margin-top: 50px;}
#izdvojeno .productHolder .productTextHolder .productPrice{font-size: 16px; font-weight: 400; margin-top: 40px; letter-spacing: 1px;}

footer .footerOne{background-color: #f5f5f5; display: flex; flex-direction: row; height: 140px;}
footer .footerOne .footerOneItemsHolder{width: 33%; display: flex; flex-direction: column; justify-content: center; align-items: center;}
footer .footerOne .footerOneItemsHolder p{margin: 0;}
footer .footerOne .footerOneItemsHolder:last-of-type{flex-direction: row;}
footer .footerOne .footerOneItemsHolder.footerOneMiddle{justify-content: space-around;}
footer .footerOne .footerOneItemsHolder .footerLogoHolder{width: 35%;}
footer .footerOne .footerOneItemsHolder .footerOneAddress{color:var(--default);}
footer .footerOne .footerOneItemsHolder .footerOneAddress i{color:var(--tcBlue); margin-right: 10px;}
footer .footerOne .footerOneItemsHolder a i{ width: 50px; height: 50px; border-radius: 50%; color: #fff; background-color:var(--tcBlue); line-height: 50px; text-align: center; margin-right: 15px;}

footer .footerThree{background-color: #fdefef;}
footer .footerThree .footerThreeHolder{display: flex; flex-direction: row; justify-content: center; align-items: center;}
footer .footerThree .footerThreeHolder .copy{color:var(--default); font-size: 16px; font-weight: 400;}