/* 

BRAND COLORS:
--------------------------------------------
Black   #575656
Green   #70b638 #3fa535 /hover: #007c32
Grey    #878786
*/

/* GLOBAL */
html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; border-collapse: collapse; border-spacing: 0; }
body { font-family: 'Roboto', sans-serif; color: #575656; font-size: 17px; font-weight: 400; line-height: 1.3; }
a { color: #b97ca9; text-decoration: underline; }
a:hover { text-decoration: underline; outline: 0; color: #167ead; }
strong, b { font-weight: bold; }
img { max-width: 100%; margin: 0; }
.clr { clear: both; }
.left { float: left; }
.right { float: right; }
.inline-item { display: inline-block; vertical-align: top; }
.tb { display: table; width: 100%; }
.tr { display: table-row; }
.td, .th { display: table-cell; vertical-align: middle; }
.clear-list, .clear-list li { list-style: none; }
.clear-list { padding: 0; margin-bottom: 0; }
.zoom-in { cursor: -moz-zoom-in; cursor: -webkit-zoom-in; cursor: zoom-in; }
.indent-this, .indent p { text-indent: 30px; }
.center { text-align: center; }
.align-left { text-align: left; }
.align-right { text-align: right; }
.align-center { text-align: center; }
img.align-left { float: left; margin: 0 10px 15px 0; max-width: 100%; }
img.align-right { float: right; margin: 0 0 15px 10px; max-width: 100%; }
img.align-center { margin: 0 auto 15px auto; max-width: 100%; }
.overflow-hidden { position: relative; overflow: hidden; }
html, body, .wrapper, .topbox { height: 100%; }
.wrapper, .bottombox { display: table; width: 100%; position: relative; }
.topbox { display: table-row; }
input[type=file] { margin-bottom: 6px; }

/* GLOBAL TRANSITION */
.menu li a, .menu li a::before, .butn, .mfp-close, .inline-item a, footer a, .socials-list li a, .langs li a, .owl-prev, .owl-next, .products-list .item::before, .product-image img, .articles-screen article figure img, .articles-screen article h3 a, .bx-prev, .bx-next { -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; } 

/* SECTIONS */ 
section, article { position: relative; z-index: 1; }
section.out, article.out { margin-bottom: 50px; }
section.in, article.in { padding-top: 50px; padding-bottom: 50px; }
section.out.in, article.out.in { padding-bottom: 0; }

/* TITLE */
.ttl { position: relative; text-align: center; margin-bottom: 40px; }
.ttl h1, .ttl h2, .ttl h3 { position: relative; color: #3fa535; font-size: 50px; text-transform: uppercase; line-height: 1.3; font-weight: 400; margin: 0; }

/* BUTTONS */
.butn { position: relative; display: inline-block; overflow: hidden; text-align: center; padding: 14px 25px; margin: 0; color: #3fa535; font-size: 18px; font-weight: bold; line-height: 1; text-transform: uppercase; border: 2px solid #3fa535; text-decoration: none; cursor: pointer; border-radius: 12px; outline: none; background: transparent; z-index: 5; }
.butn:after { background: #fff; content: ""; height: 155px; left: -75px; opacity: 0.2; position: absolute; top: -50px; transform: rotate(35deg); transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1); width: 50px; z-index: -10; }
.butn.white { background: #fff; border-color: #fff; }
.butn.red { background: #df1b23; border-color: #df1b23; color: #fff; }
.butn.geo { padding-top: 10px; padding-bottom: 10px; }
.butn.geo span, .butn.geo img { display: inline-block; vertical-align: top; }
.butn.geo span { margin-top: 7px; }
.butn:hover { background: #3fa535; text-decoration: none; color: #fff; }
.butn.red:hover { background: #a0151a; border-color: #a0151a; }
.butn:hover:after { left: 120%; transition: all 2550ms cubic-bezier(0.19, 1, 0.22, 1); }

/* BXSLIDER */
.bx-prev, .bx-next { position: absolute; top: 65%; margin: -12px 0 0 0; width: 28px; height: 40px; outline: none; background: #70b638 !important; border-radius: 4px; text-indent: 1000px; overflow: hidden; }
.bx-prev { left: -45px; }
.bx-prev::before { position: absolute; font-family: "FontAwesome"; font-weight: 900; content: "\f053"; font-size: 22px; color: #bceb06; top: 7px; left: -4px; text-indent: 0; width: 25px; line-height: 27px; z-index: 25; }
.bx-next { right: -45px; }
.bx-next::before { position: absolute; font-family: "FontAwesome"; font-weight: 900; content: "\f054"; font-size: 22px; color: #bceb06; top: 7px; left: -8px; text-indent: 0; width: 30px; line-height: 27px; z-index: 25; }
.bx-prev:hover, .bx-next:hover { background: #007c32 !important; }

/* HEADER */
header { position: absolute; top: 0; left: 0; width: 100%; z-index: 300; }
header .container { position: relative; padding-top: 4px; padding-bottom: 8px; }
.head-corner { position: absolute; top: -57px; left: 50%; margin-left: -775px; width: 1686px; height: 284px; background: url("../images/header-bg2.svg") 0 0 no-repeat; background-size: auto 100%; z-index: -1; }
body.home .head-corner { position: absolute; top: -45px; left: 50%; margin-left: -795px; width: 1686px; height: 459px; background: url("../images/header-bg.svg") 0 0 no-repeat; background-size: auto 100%; z-index: -1; }

/* HEADER - MENU */
.header-menu { position: fixed; top: 0; left: 50%; padding-top: 3px; padding-bottom: 3px; margin-left: -590px; width: 1155px; background: #4ea437; }
.menu { display: inline-block; vertical-align: top; }
.menu li { display: inline-block; margin: 0 20px 0 0; position: relative; }
.menu li a { display: block; position: relative; padding: 2px 5px; font-size: 15px; color: rgba(255,255,255,0.80); text-decoration: none; }
.menu li a::before { content: ""; position: absolute; top: 5px; right: -13px; width: 1px; height: 12px; background: #fff; }
.menu li a::after { display: none; content: ""; position: absolute; top: -8px; left: -13px; width: calc(100% + 23px); height: calc(100% + 2px); background: #b97ca9; z-index: -1; }
.menu li.active a::after { display: block; }
.menu li.active a { color: #fff !important; }
.menu li:last-child { margin: 0; }
.menu li:last-child a::before { display: none; }
.menu li a:hover { color: rgba(255,255,255,1); }
.menu li.highlight a { position: relative; background: #fc1628; }
/*.menu li.highlight::before { content: ""; position: absolute; bottom: -29px; left: 0; width: 79px; height: 24px; background: url("../images/vishpha-logo.svg") 0 0 no-repeat; background-size: 100% auto; }*/

/* HEADER - LOGOBOX */
.header-logobox h1 { margin-top: 20px; margin-bottom: 5px; }
body.home .header-logobox h1 { margin-top: 40px; }
.header-logobox h1 a { color: #fff; font-size: 85px; line-height: 1; font-weight: bold; text-transform: uppercase; text-decoration: none; }
.header-logobox h3 { color: #fff; font-size: 43px; line-height: 1; font-weight: 300; margin-bottom: 20px; }
.header-logobox p { color: #fff; }
.header-logobox p strong { position: relative; display: inline-block; font-weight: bold; text-transform: uppercase; padding: 1px 3px; background: #fc1628; }
.vishpha-logo { position: absolute; top: 35px; right: 355px; width: 79px; }
body.home .vishpha-logo { right: 350px; }
.favorit-medals { position: absolute; top: 140px; right: 488px; width: 240px; }

/* HZ ATTEMPTION */
.mz-attempt { position: fixed; bottom: 0; left: 0; width: 100%; height: 15%; z-index: 300; }
.mz-attempt::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.90); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); }
.mz-close { position: absolute; top: 5px; right: 2px; width: 32px; height: 32px; text-align: center; line-height: 32px; font-size: 32px; color: #3fa535; cursor: pointer; z-index: 301; }
.mz-promo { position: absolute; top: -25px; left: 0; width: 100%; background: #fff; padding: 1px 0 0 0; }
.mz-promo p { color: #949393; font-size: 11px; text-align: center; margin: 0; }
.mz-attempt .container { position: relative; padding-top: 3px; padding-bottom: 1px; }
.mz-attempt h3 { text-align: center; opacity: 0.6; color: #949393; font-size: 35px; font-weight: 100;text-transform: uppercase; -webkit-transform: scale(1, 4); -moz-transform: scale(1, 4);-ms-transform: scale(1, 4); -o-transform: scale(1, 4); transform: scale(1, 4); margin: 38px 0 35px -25px; }

/* MAIN SCREEN */
.main-screen { margin-top: 50px; }
.main-screen .container { position: relative; text-align: right; }
.main-screen-slider-box { position: relative; display: inline-block; max-width: 920px; }
.main-screen-slider-box img { max-width: 100%; }
.main-screen .owl-carousel .owl-nav .owl-prev, .main-screen .owl-carousel .owl-nav .owl-next { top: auto; bottom: 190px; margin-top: 0; }

/* PRODUCTS SHORT SCREEN */
.products-short-screen { margin-top: 20px; }
.products-list .item { position: relative; padding: 15px 15px 0 15px; }
.products-list .item::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(62,165,53,1); background: -moz-linear-gradient(top, rgba(62,165,53,1) 0%, rgba(62,165,53,0) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(62,165,53,1)), color-stop(100%, rgba(62,165,53,0))); background: -webkit-linear-gradient(top, rgba(62,165,53,1) 0%, rgba(62,165,53,0) 100%); background: -o-linear-gradient(top, rgba(62,165,53,1) 0%, rgba(62,165,53,0) 100%); background: -ms-linear-gradient(top, rgba(62,165,53,1) 0%, rgba(62,165,53,0) 100%); background: linear-gradient(to bottom, rgba(62,165,53,1) 0%, rgba(62,165,53,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3ea535', endColorstr='#3ea535', GradientType=0 ); opacity: 0.20; z-index: -1; }
.products-list .item::after { content: ""; position: absolute; top: 0; right: -15px; width: 1px; height: 100%; background: #949393; }
.products-list li:last-child .item::after { display: none; }
.product-image { margin-bottom: 10px; }
.product-image .td { height: 270px; text-align: center; }
.product-image .td img { width: auto; height: auto; max-width: 80%; max-height: 90%; }
.products-list .item h2 { color: #3fa535; font-size: 19px; font-weight: bold; text-transform: uppercase; }
.products-list .item p { color: #878786; font-size: 13px; font-weight: bold; min-height: 35px; }
.products-list li:hover .item::before { opacity: 0.55; }
.products-list li:hover .product-image img { transform: scale(1.06); }

/* PRODUCTS ABOUT SCREEN */
.section-tb .col-left, .section-tb .col-right { width: 50%; padding: 35px 0 150px 0; }
.section-tb .col-left { text-align: right; padding-right: 40px; }
.section-tb .col-right { padding-left: 40px; }
.section-tb .in { position: relative; display: inline-block; width: 100%; max-width: 535px; text-align: left; padding-bottom: 65px; }
section.product-1 .col-left { background: url("../images/product-1-bg.jpg") fixed no-repeat; background-size: cover; }
section.product-1 .col-right { background: #cadfb9; }
section.product-2 .col-left { background: url("../images/product-2-bg.jpg") fixed 0 no-repeat; background-size: cover; }
section.product-2 .col-right { background: #fdd29d; }
section.product-3 .col-left { background: url("../images/product-3-bg.jpg") fixed 0 no-repeat; background-size: cover; }
section.product-3 .col-right { background: #bddff7; }
section.product-1 .butn.white { color: #3e6c2c; }
section.product-2 .butn.white { color: #f39200; }
section.product-3 .butn.white { color: #2a87b1; }
section.product-1 .butn.white:hover { color: #fff; }
section.product-2 .butn.white:hover { color: #fff; background: #f39200; }
section.product-3 .butn.white:hover { color: #fff; background: #2a87b1; }
.products-about-screen .col-left h2 { color: #fff; font-size: 48px; line-height: 1; font-weight: 600; margin-bottom: 20px; }
.products-about-screen .col-left h3, .products-about-screen .col-left h4, .products-about-screen .col-left p { color: #fff; margin-bottom: 20px; }
.products-about-bottom { position: absolute; bottom: 15px; left: 0; width: 100%; }
.products-about-bottom .butn { width: 210px; }
.product-subttl { color: rgba(255,255,255,0.40); font-size: 118px; text-transform: uppercase; font-weight: bold; padding-left: 35px; margin: 5px 0 0 0; line-height: 1; }
.product-briefly-list li { margin-bottom: 15px; font-size: 14px; text-align: center; }
.product-briefly-list .td { height: 75px; }
.product-briefly-list .td img { width: auto; height: auto; max-width: 80%; max-height: 90%; }
th, td { font-size: 14px; padding: 5px; background: #ebede5; border-right: 2px solid #fff; }
th { text-align: center; background: #83b285; color: #fff; }
td { background: #ebede5; }
tr td:last-child, tr th:last-child { border: 0 !important; }
section.product-2 th { background: #f6a436; }
section.product-3 th { background: #92cef2; }
section.product-1 .odd { background: #d8dccc; border-bottom: 1px solid #b1d0b3 !important; }
section.product-3 td { background: #f4fafe; }
section.product-3 .odd { background: #ddeefc; border-bottom: 1px solid #b9d8eb !important; }

/* ARTICLES */
.articles-screen article { margin-bottom: 10px; }
.articles-screen article figure { position: relative; height: 160px; overflow: hidden; }
.articles-screen article figure img { position: absolute; top: 0; bottom: 0; margin: auto; width: 100%; min-height: 50px; }
.articles-screen article .item { position: relative; padding: 10px 10px 1px 35px; height: 160px; -webkit-box-shadow: 0px 0px 23px 6px rgba(226,226,225,.50); -moz-box-shadow: 0px 0px 23px 6px rgba(226,226,225,.50); box-shadow: 0px 0px 23px 6px rgba(226,226,225,.50); }
.articles-screen article .item::before { content: ""; position: absolute; top: 50%; margin-top: -20px; left: 0; width: 0; height: 0; border-style: solid; border-width: 20px 0 20px 20px; border-color: transparent transparent transparent rgba(226,226,225,.50); }
.articles-screen article h3 a { display: block; font-size: 24px; color: #706f6f; margin: 0 0 15px 0; text-decoration: none; } 
.articles-screen article p { font-size: 15px; }
.articles-screen article a { color: #007c34; }
.articles-screen article:hover figure img { transform: scale(1.06); }
.articles-screen article:hover h3 a { color: #3fa535; }

/* ARTICLE PAGE */
.header-separator { margin-top: 220px; }
.breadcrumbs { border-bottom: 1px solid #e1e1e1; padding: 12px 0; }
.breadcrumbs span, .breadcrumbs a { color: #575656; font-size: 17px; text-decoration: none; }
.brc-separator { margin: 0 4px; }
.article-ttl { position: relative; padding-right: 245px; margin-bottom: 15px; }
.article-ttl h1 { font-weight: 600; }
.article-ttl .date { position: absolute; top: 17px; right: 0; }
.article-page-text, .article-page-text * { color: #878786; font-size: 13px; }
.article-page-text ul { position: relative; padding: 10px 10px 10px 25px; margin-left: 10px; background: #ddecc6; }
.article-page-text ul::before { content: ""; position: absolute; top: 0; left: -10px; width: 1px; height: 100%; background: #3fa535; }
.article-page-text ul.clear-list { padding: 0; margin: 0; background: none; }
.article-page-text ul.clear-list::before { display: none; }
ul.clear-list.tea-list { margin: 0 -10px 15px -10px; }
.tea-list li { display: inline-block; vertical-align: top; width: 20%; margin: 0 -2px; }
.tea-list li .item { position: relative; padding: 0 10px; height: 544px; }
.tea-list li .item::after { content: ""; position: absolute; top: 0; right: 0; width: 1px; height: 100%; background: #949393; }
.tea-list li:last-child .item::after { display: none; }
.tea-list li .item img { width: 100%; margin-bottom: 15px; }
.tea-list li .item h2 { font-size: 17px; font-weight: bold; }
.tea-list li .item span { display: block; margin-top: 10px; padding: 10px; background: #ddecc6; }
.aurhor { border-top: 1px solid #e1e1e1; padding: 12px 0; font-size: 13px; }

/* FOOTER */
footer { background: #00701a; padding: 35px 0 15px 0; border-top: 10px solid #c0d9ad; } 
footer.mzpadd { margin-bottom: 16vh; }
.footer-contacts { padding-left: 45px; }
.footer-contacts h3 { color: #c0d9ad; font-weight: 300; text-transform: uppercase; }
.cont-adress { color: #fff; font-size: 13px; }
.footer-contacts p { position: relative; }
.cont-tel i, .cont-email i, .cont-adress i { position: absolute; color: #fff; font-size: 24px; }
.cont-adress i { top: 4px; left: -41px; font-size: 26px; }
.cont-tel i { top: 0; left: -39px; }
.cont-email i { top: 0; left: -45px; }
.cont-tel a, .cont-email a { color: #fff; text-decoration: none; }
footer img { max-width: 100%; }
.footer-logo h3 { color: #fff; font-size: 95px; line-height: 1; font-weight: bold; text-transform: uppercase; margin-bottom: 5px; }
.footer-logo h4 { color: #fff; font-size: 26px; line-height: 1; font-weight: 300; }
.license { color: #c0d9ad; font-size: 11px; line-height: 1.1; text-align: center; }