@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700&subset=cyrillic,cyrillic-ext');

body{font-family: 'Open Sans';}
header{height: 90px; background-color: #404e6a; position: relative; z-index: 10;}
footer{ background-color: #404e6a; padding: 15px 0; box-sizing: border-box;}
.footerContent{width: 1000px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start; height: 100%;}
.headerContent{width: 1000px; margin: 0 auto; height: 100%; display: flex; flex-direction: row; justify-content: space-between; align-items: center; position: relative;}
.footerContent{color: white; letter-spacing: 0.9px}
.footerContent>div>p:nth-child(1){font-weight: bold; font-size: 18px;}
.footerContent>div:nth-child(3) a{color: white; text-decoration: none;}
.footerContent>div:nth-child(3) a:hover{border-bottom: 1px solid white;}
.footerContent>div:nth-child(3) p{margin: 7.5px 0;}
.footerContent>div:nth-child(3) p:first-child{margin: 0 0 7.5px 0;}
.footerContent>div:nth-child(3) .phoneList p:last-child{margin: 7.5px 0 0 0;}
.sectionContent{width: 1000px; margin: 0 auto;}
.sectionContent::after{display: block; content: ' '; clear: both;}
.blockHeader{font-size: 36px; font-weight: bold; line-height: normal; font-variant: small-caps; color: #333;}
.popupBtn{width: 236px; height: 40px; border-radius: 5px; padding: 0 10px; background-color: #ec7304; display: block; line-height: 40px; text-align: center; text-decoration: none; color: white; margin: 0 auto; font-variant: small-caps; font-weight: bold; font-size: 20px;}

.menuButton{display: none !important; color: white; font-size: 36px;}
.logoBox a{display: flex; align-items: center; height: 100%; font-variant: small-caps; font-weight: bold; font-size: 20px;}
.logoBox .logo{background: url(../images/logo.png) no-repeat center center / 100%; width: 59px; height: 50px;}
.logoBox p{color: white; margin:0 0 0 20px; letter-spacing: 1.5px;}
.middleBlock{position: absolute; left: 50%; transform: translateX(-50%);}
.phoneBox{color: white; font-size: 18px; width: 256px; height: 40px; box-sizing: border-box; border: 1px solid white; border-radius: 5px; padding: 0 15px;}
.phoneBox>.phoneBoxHeader{display: flex; justify-content: space-between; align-items: center; height: 100%;}
.phoneBox .phoneList{display: none; position: absolute; top: 79px; left: 0; width: 256px; padding: 0 15px; box-sizing: border-box; background-color: #404E6A; text-align: center; border: 1px solid white; border-radius: 10px;}
.phoneBox .phoneList p{margin: 15px 0;}
.phoneBox .phoneList a{color: #fff;}
.phoneBox .phoneList p:hover a{border-bottom: 1px solid #fff;}
.phoneBox .fa-phone{border-right: 1px solid white; padding: 0 10px 0 0; }
.workHours p{margin: 0; font-size: 14px; color: white; line-height: normal; letter-spacing: 1px;}

/* ----- Menu ----- */
.firstScreen{ position: relative;}
.firstScreen nav{height: 50px; width: 100%; line-height: 50px; position: absolute; z-index: 9; background-color: rgba(255, 255, 255, 0.9);}
.firstScreen nav ul{width: 1000px; margin: 0 auto; display: flex; justify-content: space-between;}
.firstScreen nav li a{ color: #ec7303; font-size: 14px; text-transform: uppercase; font-weight: bold;}
/* --- End menu --- */

.firstSlider .item{height: 700px; background-size: cover !important; background-position: center center !important;}
.gradientMask{background: radial-gradient(ellipse at top, #404E6A 0%,#ffffff00 75%); width: 100%; height: 650px; position: absolute; top: 50px; z-index: 2;}
.gradientMask>div:nth-child(1), .gradientMask>div:nth-child(2){width: 1000px; color: white; text-align: center; font-weight: 600; margin: 50px auto;  font-variant: small-caps;}
.gradientMask>div p{ line-height: normal; text-shadow: 0 4px 4px #000;}
.gradientMask>div:nth-child(1){font-size: 48px;}
.gradientMask>div:nth-child(1) p{margin: 10px 0;}
.gradientMask>div:nth-child(2){font-size: 36px;}
/*.alcoSale{background: url(../images/alcoSale.png) no-repeat center center / contain; width: 415px; height: 455px; position: absolute; bottom: -70px; right: 20%;}*/

.secondScreen{background-color: #e2e3e6; height: 500px; padding: 50px 0; box-sizing: border-box;}
.officialDealer{margin: 72px 0 0 0; display: flex; justify-content: center;}
.officialDealer .shop_brand{width: 240px; height: 233px; display: inline-block; margin: 0 2px; position: relative;}
.shop_brand:hover .brandInfo{display: block;}
.brandInfo{position: absolute; bottom: 0; background: #404e6a; height: 25px; width: 100%; font-size: 13px; text-align: center; line-height: 25px; text-transform: uppercase; display: none;}
.brandInfo a{color: #ec7303; font-weight: bold;}

.thirdScreen{padding: 50px 0; min-height: 775px;}
.categoriesBlock{display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 30px;}
.categoriesBlock>.shop_category{width: 28%; height: 265px; display: flex; flex-direction: column; align-items: center; margin: 35px 0 0 0; position: relative;}
.categoriesBlock>.shop_category .shop_category_block_2{display: none; position: absolute; bottom: 0; padding-bottom: 95px; box-sizing: border-box; border-radius: 10px; background-color: rgba(64, 78, 106, 0.5); width: 100%; height: 100%; flex-direction: column; align-items: center; justify-content: center;}
.categoriesBlock>.shop_category .shop_category_block_2 .shop_category a{color: white; font-variant: small-caps; text-decoration: underline; font-size: 20px; font-weight: bold;}
.categoriesBlock>.shop_category:hover .shop_category_block_2{display: flex; text-align: center;}
.categoriesBlock>.shop_category>.shop_category_img{height: 180px;}
.categoriesBlock>.shop_category>.shop_category_name { position: relative; z-index: 2; width: 100%; height: 85px; border-radius: 10px; box-sizing: border-box; background-color: rgba(64, 78, 106, 0.90); text-align: center; font-size: 24px; font-weight: bold; color: #fcf9f9; padding: 0 10%; display: flex; align-items: center; justify-content: center; font-variant: small-caps;}
.thirdScreen .popupBtn{margin-top: 60px;  }

.fourthScreen{background:url(../images/tools.png) no-repeat center center, radial-gradient(circle at center, #ffffff 0%, #404E6A 45%); height: 665px; position: relative; box-sizing: border-box; padding: 50px 0;}
.fourthScreen .popupBtn{position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);}
.fourthScreen .blockHeader{width: 1000px; margin: 0 auto; color: white;}

.fifthScreen{padding: 50px 0;}
.fifthScreen .fifthBox {width: 45%; height: 350px;}
.fifthBox.box1{float: left; background: url(../images/man1.jpg) no-repeat bottom center / contain;}
.fifthBox.box2{float: right;}
.fifthBox.box2 p{font-variant: small-caps;}
.fifthBox.box2 p:nth-child(1){margin: 60px 0 15px 0; font-size: 20px; color: #333333; font-weight: bold;}
.fifthBox.box2 p:nth-child(2){ font-size: 18px; color: #333333;}
.fifthBox.box2 .popupBtn{ margin: 85px 0 0 0;}

.sixthScreen{background: url(../images/aboutUsBG.jpg) no-repeat center center / cover; height: 600px;}
.sixthScreen .sectionContent{height: 100%;}
.aboutUsBox{background-color: #404e6a; width: 60%; height: 100%; font-variant: small-caps; padding: 50px 60px; box-sizing: border-box;}
.aboutUsBox>p:nth-child(1){font-size: 36px; font-weight: bold; text-align: center; color: #fff;}
.aboutUsBox>p:nth-child(2){width: 250px; margin: 25px auto; text-align: center; font-size: 18px; color: #fff;}
.shortInfo{font-size: 18px; line-height: 22px; letter-spacing: 1.4px; text-align: justify;}
.aboutUsBox .shortInfo{color: #fff;}
.aboutUsBox .popupBtn{margin-top: 100px;}

.seventhScreen{padding: 50px; box-sizing: border-box;}
.seventhBox{width: 45%;}
.seventhBox.box1{float: left;}
.seventhBox.box1 .popupBtn{margin-top: 115px;}
.seventhBox.box2{float: right; height: 345px; background: url(../images/man2.jpg) no-repeat center center / contain;}

/* ------------- Main PopUp Form ------------- */
#mainPopupForm{width: 707px; height: 367px; background: url(../images/feedbackBG.jpg) no-repeat center center / cover; display: none;}
#mainPopupForm .mainInputFields{margin: 0 0 30px 0; position: relative; z-index: 2;}
#mainPopupForm input{box-sizing: border-box; border: none; font-variant: small-caps; font-size: 18px;}
#mainPopupForm input[type='text']{border-radius: 5px; background-color: rgb(246, 247, 249); width: 260px; height: 45px; color: #000; padding-left: 15px;}
#mainPopupForm input[type='submit']{border-radius: 5px; background-color: rgb(236, 115, 4); width: 170px; height: 35px; color: white; text-align: center; font:bold small-caps 16px 'Open Sans'; margin: 0 auto; display: block;}

#mainPopupForm form{float: right; margin: 45px 45px 0 0;}
#mainPopupForm .logoBox{margin: 0 0 30px 0;}

#mainPopupForm input[type='text'].error_input{border: 2px solid red;}
#mainPopupForm .errors.error.error_message{color: white; width: 50%; float: right; margin-top: 90px; font-size: 25px;}

#mainPopupForm input[type='text']::-webkit-input-placeholder       {text-indent: 0;   transition: text-indent 0.3s ease; color: #9b9c9d;}
#mainPopupForm input[type='text']::-moz-placeholder                {text-indent: 0;   transition: text-indent 0.3s ease; color: #9b9c9d;}
#mainPopupForm input[type='text']:-moz-placeholder                 {text-indent: 0;   transition: text-indent 0.3s ease; color: #9b9c9d;}
#mainPopupForm input[type='text']:-ms-input-placeholder            {text-indent: 0;   transition: text-indent 0.3s ease; color: #9b9c9d;}
#mainPopupForm input[type='text']:focus::-webkit-input-placeholder {text-indent: 500px; transition: text-indent 0.3s ease;}
#mainPopupForm input[type='text']:focus::-moz-placeholder          {text-indent: 500px; transition: text-indent 0.3s ease;}
#mainPopupForm input[type='text']:focus:-moz-placeholder           {text-indent: 500px; transition: text-indent 0.3s ease;}
#mainPopupForm input[type='text']:focus:-ms-input-placeholder      {text-indent: 500px; transition: text-indent 0.3s ease;}


.brandMenu { position: absolute; left: 50%; top: 0; width: 1200px; transform: translateX(-50%);}
.brandMenu>div{width: 20%; height: 75px; margin: 15px 0; float:right; clear: both;}
.brandMenu>div:nth-child(1){background: url(../images/logos/husqvarna.png) no-repeat center center / 90%,  rgba(255, 255, 255, 0.6);}
.brandMenu>div:nth-child(2){background: url(../images/logos/solo.png) no-repeat center center / contain,  rgba(255, 255, 255, 0.6);}
.brandMenu>div:nth-child(3){background: url(../images/logos/oleo_mac.png) no-repeat center center / 90%,  rgba(255, 255, 255, 0.6);}
.brandMenu>div:nth-child(4){background: url(../images/logos/gardena.png) no-repeat center center / 90%,  rgba(255, 255, 255, 0.6);}

.workHours p>span {width: 65px; display: inline-block;}

.searchBox{padding: 5px 0; box-sizing: border-box;}
.searchPage{width: 40%;}
.searchBox form, .searchPage form{display: flex; justify-content: space-between;}
.searchBox input, .searchPage input{box-sizing: border-box; height: 30px; display: inline-block; border-radius: 2.5px;}
.searchBox input[type="text"], .searchPage input[type="text"]{padding-left: 10px; border: 1px solid #404E6A; width: 74%; }
.searchBox input[type="submit"], .searchPage input[type="submit"]{background: #ec7303; color: white; border: none; width: 25%;}
.search_list{clear: both;}

/* ------------------------------------------- */

.copiraite {background: url(../images/qbitLogoSvgWhite.svg) no-repeat center center / contain; width: 95px; height: 44px; display: block; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); -webkit-filter: gray; filter: gray; -webkit-transition: 1.5s; transition: 1.5s; overflow: hidden; text-indent: 100%; white-space: nowrap;}
.copiraite:hover { -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%); -webkit-filter: url(grayscale.svg); filter: url(grayscale.svg); -webkit-filter: gray;	filter: gray; opacity: 1;}