

/* Start:/bitrix/templates/seoven_v5/styles.css?175986117738656*/
img {border: 0; }
* { 

        
}
html, body {margin: 0; padding: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 13px; font-weight: 300; font-family: 'Roboto', sans-serif; color: #ffffff; -webkit-overflow-scrolling: auto; }
b {font-weight: 400;}

body {background-position: center top; background-repeat: no-repeat; background-size: contain; overflow-y: hidden; position: relative; display: block; height: 100vh;}
/*

@font-face { src: url("/bitrix/templates/seoven_v5/images/GoodCyr-WideBook_20959.eot")}
@font-face { src: url("/bitrix/templates/seoven_v5/images/GoodCyr-WideBook_20959.ttf")}
*/

.wrapper { -webkit-overflow-scrolling: auto}
.wrapper header { position: fixed; top: 0; width: 100%; z-index: 999; top: -50px; opacity: 0;}
.wrapper header.active { top: 0; opacity: 1; }
.wrapper header .logo {width: 204px; vertical-align: top; position: absolute; left: 2%; top: 20px; font-size: 48px; font-weight: 100; color: white; text-decoration: none;}
.wrapper header .logo img {width: 166px;}
.wrapper header .logo span {color: #F03226}
.wrapper header .phone { font-size: 25px; text-decoration: none; vertical-align: top; color: #fff; display: inline-block;  position: absolute; left: 27%; top: 37px; font-weight: 100;}
.wrapper header .phone span { font-size: 16px; text-decoration: none;  display: inline-block;}
.wrapper header .call { font-size: 18px; text-decoration: none; vertical-align: top; color: #fff; display: inline-block;  position: absolute; left: 27%; top: 10px; font-weight: 100;/* border-bottom: 1px dashed rgba(255,255,255,0.4); */margin-left: 20px;}
.wrapper header > div {float: right; height: 100%;  position: absolute; right: 2%; top: 20px; }
.wrapper header > div > span {display: block;  text-align: right;}
.wrapper header > div > span a {color: #fff; text-transform: uppercase; margin-left: 26px; font-size: 12px; text-decoration: none; font-weight: 100;}
.wrapper header > div > span a:hover {border-bottom: 1px solid gray;}
.wrapper header > div > span a.active {font-weight: normal;}
.wrapper header > div > p {display: block; margin-top: 18px; text-align: right;}
.wrapper header > div > p a {color: #fff; text-transform: uppercase; margin-left: 26px; font-size: 20px; text-decoration: none; font-weight: 100;}
.wrapper header > div > p a.active {font-weight: normal;}
.wrapper header > div > p a:hover {color: #fff; border-bottom: 1px solid gray;}
/*
.wrapper .background_gray {background-color: #FAFAFA; border-top: 1px solid #EEEEEE;border-bottom: 1px solid #EEEEEE;}
.wrapper .background_gray:before {display: block; background-image: url(/bitrix/templates/seoven_v5/images/top_shadow.png); background-size: 100% 100%; height: 11px; content: ' '; width:  1054px; margin: 0 auto;}
.wrapper .background_gray:after {display: block; background-image: url(/bitrix/templates/seoven_v5/images/bottom_shadow.png); background-size: 100% 100%; height: 11px; content: ' '; width:  1054px; margin: 0 auto;}
.wrapper .background_gray > div {width:  1054px; margin: 0 auto; }

.wrapper .main.banner {height: 467px; background-image: url(/bitrix/templates/seoven_v5/images/main_banner.jpg); background-repeat: no-repeat; background-position: center center;}

.wrapper .wiki.banner { background-repeat: no-repeat; background-position: right center; background-size: auto 100%; padding-right: 500px; width: 554px; line-height: 160%;}
.wrapper .wiki.banner > img {float: left; margin: 0 10px 10px 0;}
.wrapper .wiki.other_text { width:  1054px; margin: 0 auto;}
*/
.wrapper main {display: block; width: 100%;}

.wrapper main > div .controlMainBTN {background-image: url('/bitrix/templates/seoven_v5/images/down_arr.svg'); background-position: center center; background-repeat: no-repeat; width: 50px; height:10px; background-size: 100% auto; display: block; text-decoration: none; position: fixed; bottom: 10px; left: 50%; margin-left: -25px; cursor: pointer; z-index: 9999; opacity: 0; bottom: -10px }
.wrapper main > div.current .controlMainBTN {opacity: 1; bottom: 10px }
.wrapper main > div .controlMainBTN#scrollUP {top: -10px; background-image: url('/bitrix/templates/seoven_v5/images/up_arr.svg');}
.wrapper main > div.current .controlMainBTN#scrollUP {top: 10px }

.wrapper main > div {display: block; background-position: center center; background-size: cover;  background-color: black; clear: both; overflow: hidden; height: 100%;}
.wrapper main > div.scrollable {overflow: hidden}
.wrapper main > div.current {overflow: inherit;}
.wrapper main > div > video {object-fit: cover;/* position: absolute; z-index: 10; display: block;*/ width: 100%; }
.wrapper main > div > div.background.video {width: 100%; height: 100%; }
.wrapper main > div > div.background.video > canvas {width: 100%; height: 100%; }
.wrapper main > div.current > video, .wrapper main > div.current > .mobile-slide {opacity: 0.2; z-index: auto;}
.wrapper main hr {border: 0; background-color: transparent; display: block; height: 100%; }
.wrapper .loading {position: fixed; left: 50%; top: 50%; margin: -89px 0 0 -89px; z-index: 99999; opacity: 0.9}
.wrapper .creation {}
.wrapper .creation h2 {text-align: left; font-size: 22px;color: #fff; font-weight: normal;}
.wrapper .creation h3 {text-align: left; font-size: 18px; color: #fff; font-weight: normal;}


.wrapper .creation.intro {}
.wrapper .creation.intro .content {opacity: 0; position: fixed; top: 18%; width: 1000px; left: 50%; margin-left: -500px; }
.wrapper .creation.intro.current .content {opacity: 1}
.wrapper .creation.intro .content h1 {font-weight: 100; font-size: 48px; margin-top: 100px; text-align: center;}
.wrapper .creation.intro .content a {background-image: url('/bitrix/templates/seoven_v5/images/down_arr.svg'); background-position: center center; background-repeat: no-repeat; width: 144px; height:27px; display: block; margin: 50px auto 0 auto; text-decoration: none;}

.wrapper .creation.price {background-image1: url('/bitrix/templates/seoven_v5/images/creation_price.jpg');}
.wrapper .creation.price > table {opacity: 0; position: fixed; top: 18%; border-spacing: 0px; width: 1200px; left: 49%; margin-left: -600px; font-size: 16px; }
.wrapper .creation.price.current > table.current {opacity: 1; top: 20%; left: 50%;}
.wrapper .creation.price.current > table.current.showPopup {left: 30%; opacity: 0;}

.wrapper .creation.price.current .popup {position: fixed; width: 100%; height: 100%; z-index: 1000; /*background-color: rgba(0,0,0,0.3);*/ top: 0; opacity: 0; }
.wrapper .creation.price.current .popup.active { opacity: 1;}
.wrapper .creation.price.current .popup > span {font-size: 128px; font-weight: 100; cursor: pointer; position: absolute; margin-left: -600px; left: 50%; color: white; top: 40%; background-image: url('/bitrix/templates/seoven_v5/images/left_arr.svg'); background-position: center center; background-repeat: no-repeat;}
.wrapper .creation.price.current .popup > span:hover {color: white;}
.wrapper .creation.price.current .popup > div {position: absolute; width: 1000px; top: 15%; left: 50%; margin-left: -500px;}
.wrapper .creation.price.current .popup.active > div {top: 17%;}
.wrapper .creation.price.current .popup > div h2 {font-weight: 300; font-size: 32px; margin-top: 0; padding-bottom: 5px; margin-bottom: 23px; border-bottom: 1px solid rgba(255,255,255,0.5);}
.wrapper .creation.price.current .popup > div h3 {font-weight: 100; font-size: 24px; margin-top: 0;}
.wrapper .creation.price.current .popup > div h3:before {content: '/'}
.wrapper .creation.price.current .popup > div h3:after {content: '/'}
.wrapper .creation.price.current .popup > div table {font-weight: 300; width: 100%; table-layout: fixed; }
.wrapper .creation.price.current .popup > div table td {vertical-align: top; font-size: 15px;}
.wrapper .creation.price.current .popup > div table ul {list-style-type: none; margin: 0; padding: 0;}
.wrapper .creation.price.current .popup > div table ul li {margin: 10px 0; padding: 0 0 0 15px; vertical-align: middle; background-image: url('/bitrix/templates/seoven_v5/images/line.svg'); background-position: left center; background-repeat: no-repeat; }

.wrapper .creation.price > table { }
.wrapper .creation.price > table th { text-align: left}
.wrapper .creation.price > table th.middle { border-left: 140px solid transparent; border-right: 140px solid transparent}
.wrapper .creation.price > table th h2 {font-size: 22px;  margin: 0 0 22px 0; padding: 0;}
.wrapper .creation.price > table td > * {max-width: 238px;}
.wrapper .creation.price > table td {}
.wrapper .creation.price > table td.middle { border-left: 140px solid transparent; border-right: 140px solid transparent}
.wrapper .creation.price > table td span {display: block; color: #fff; }
.wrapper .creation.price > table td ul {display: block; margin: 20px 0; padding: 0;}
.wrapper .creation.price > table td li {display: block; color: #fff; padding: 0 0 0 43px; margin: 18px 0; background-image: url(/bitrix/templates/seoven_v5/images/red_arrow_right.svg); background-repeat: no-repeat; background-position: left top; background-size: 20px 20px; min-height: 20px; }
.wrapper .creation.price > table td li a {color: #fff;}
.wrapper .creation.price > table td p {font-size: 22px; color: #fff; }
.wrapper .creation.price > table td p span {display: block; color: #fff; font-size: 13px; margin-top: 3px;}
.wrapper .creation.price > table td p s {font-size: 50%; display: inline-block; vertical-align: middle; margin-left: 3px;}
.wrapper .creation.price > table td > a {display: block; height: 36px; margin: 10px 0; background-color: #F03226; line-height: 36px; text-align: center; color: white; font-size: 20px; text-decoration: none;}
.wrapper .creation.price > table td > a:hover {background-image: url(/bitrix/templates/seoven_v5/images/submit_red.jpg);}
.wrapper .creation.price > table td > font > span {display: inline-block; vertical-align: top; border: 1px white solid; border-radius: 8px; width: 12px; height: 12px; color: white; text-align: center; font-size: 10px; line-height: 12px; margin-right: 16px; margin-top: 3px;}
.wrapper .creation.price > table td > font > font {display: inline-block; vertical-align: top; border-bottom: 1px dashed; color: #fff; cursor: pointer; font-size: 14px;}
.wrapper .creation.price > table td > font > div {display: none; position: absolute;}


.wrapper .creation.price > a {background-image: url('/bitrix/templates/seoven_v5/images/down_arr.svg'); background-position: center center; background-repeat: no-repeat; width: 144px; height:27px; display: block; margin: 80px auto 0 auto; text-decoration: none;}

/*
.wrapper .creation.calc {padding: 50px 0; width:  1054px; margin: 0 auto;}
.wrapper .creation.calc font {font-size: 90px; color: white; width: 110px; height: 110px; display: block; margin: 0 auto 40px auto; background-image: url(/bitrix/templates/seoven_v5/images/red_round.jpg); background-size: 100% 100%; line-height: 110px; text-align: center;}
.wrapper .creation.calc > span { color: #777; font-size: 35px; display: block; text-align: center; }
.wrapper .creation.calc h2 { color: #777; font-size: 35px; display: block; text-align: center; margin-top: 0; }
.wrapper .creation.calc > span a { color: #444; font-size: 35px; display: inline-block; text-decoration: none; border-bottom: 1px dashed;  margin-top: 30px; }
*/
.wrapper .creation.portfolio {background-image: url('/bitrix/templates/seoven_v5/images/creation.portfolio.jpg');}
.wrapper .creation.portfolio a {display: inline-block; width: 213px; height: 69px; line-height: 69px; border: 1px solid #eee; text-align: center; vertical-align: middle; margin: 12px 20px; background-color: white;}
.wrapper .creation.portfolio a img {max-width: 213px; max-height: 40px; vertical-align: middle; }

.wrapper .creation.technologies {overflow: hidden;}
.wrapper .creation.technologies h2 {position: fixed; top: 33%; margin: 0 auto; color: white; font-weight: 100; font-size: 64px; opacity: 0; left: 50%; margin-left: -450px; zoom: 0; text-align: center;}
.wrapper .creation.technologies.current h2 {position: fixed; top: 35%; color: white; font-weight: 100; font-size: 64px; opacity: 1; zoom: 1;}
.wrapper .creation.technologies.current video {opacity: 0.5}

.wrapper .creation.webtechnologies {font-size: 15px; background-image: url(/bitrix/templates/seoven_v5/images/creation_technologies.jpg); width: 100%; height: 100%; background-position: center center;}
.wrapper .creation.webtechnologies.current { background-image: none;}
.wrapper .creation.webtechnologies > div.background {background-image: url(/bitrix/templates/seoven_v5/images/creation_technologies.jpg); width: 100%; height: 100%; background-position: center center;}
.wrapper .creation.webtechnologies.current > div.background {opacity: 0.5;}
.wrapper .creation.webtechnologies > div.content {position: fixed; opacity: 0; top: 15%; width: 1000px; margin-left: -500px; left: 49%;}
.wrapper .creation.webtechnologies.current > div.content {opacity: 1; left: 50%;}
.wrapper .creation.webtechnologies > div.content h2 {font-weight: 300; font-size: 32px; margin-top: 0; padding-bottom: 5px; margin-bottom: 23px; border-bottom: 1px solid rgba(255,255,255,0.5);}
.wrapper .creation.webtechnologies > div.content h3 {font-weight: 100; font-size: 24px; margin-top: 0;}
.wrapper .creation.webtechnologies > div.content h3:before {content: '/'}
.wrapper .creation.webtechnologies > div.content h3:after {content: '/'}
.wrapper .creation.webtechnologies table {padding: 0; margin: 0; table-layout: fixed; border-spacing: 0; border-collapse: collapse; width: 100%;}
.wrapper .creation.webtechnologies a {display: inline-block; width: 123px; height: 105px; margin-right: 28px; background-color: white; border: 1px solid #EEEEEE; text-align: center; vertical-align: top; line-height: 105px;}
.wrapper .creation.webtechnologies a img {vertical-align: middle; max-width: 85px; max-height: 65px; }


.wrapper .creation.pluses {}
.wrapper .creation.pluses .content {opacity: 0; position: fixed; top: 18%; width: 1000px; left: 50%; margin-left: -500px; }
.wrapper .creation.pluses.current .content {opacity: 1}
.wrapper .creation.pluses .content h3 {font-weight: 300; font-size: 24px; margin-top: 0;}
.wrapper .creation.pluses .content h3 font {font-weight: 100;}
.wrapper .creation.pluses .content h3:before {content: '/'}
.wrapper .creation.pluses .content h3:after {content: '/'}
.wrapper .creation.pluses .content table {width: 100%;}
.wrapper .creation.pluses .content table td {vertical-align: top;}
.wrapper .creation.pluses .content table td:first-child {width: 60%;}
.wrapper .creation.pluses .content table td p {}
.wrapper .creation.pluses .content table td ul {display: block; margin: 20px 0; padding: 0;}
.wrapper .creation.pluses .content table td ul li {display: block; color: #444444; padding: 0 0 0 43px; margin: 18px 0; background-image: url(/bitrix/templates/seoven_v5/images/red_arrow_right.svg); background-repeat: no-repeat; background-position: left top; background-size: 20px 20px; min-height: 20px; color: white; font-size: 16px; font-weight: 100; }
.wrapper .creation.pluses .content table a {display: block; width: 200px; padding: 10px 50px; text-align: center; border-radius: 150px 20px; line-height: 40px; margin: 0 0 20px 0; background-color: white; opacity: 0.9}
.wrapper .creation.pluses .content table a img {display: inline; vertical-align: middle; max-width: 100%; max-height: 100%;}


.wrapper div.question {}
.wrapper div.question .background {width: 100%; height: 100%; background-position: center center; opacity: 0.7;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1e5799+0,2d5f99+100 */
background: #1e5799; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover,  #1e5799 0%, #2d5f99 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover,  #1e5799 0%,#2d5f99 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center,  #1e5799 0%,#2d5f99 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#2d5f99',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.wrapper div.question.current .background {opacity: 1; }
.wrapper div.question .content h2 {font-weight: 300; font-size: 32px; margin-top: 0; padding-bottom: 5px; margin-bottom: 23px; border-bottom: 1px solid rgba(255,255,255,0.5);}
.wrapper div.question .content {position: fixed; top: 18%; width: 1000px; left: 50%; margin-left: -500px; opacity: 0;}
.wrapper div.question.current .content {opacity: 1;}
.wrapper div.question .content input {background-color: rgba(255,255,255,0.1); border: 1px solid white;font-size: 18px; font-weight: 300; color: white; padding: 5px; width: 500px; outline: none;}
.wrapper div.question .content input[type="submit"] {width: 238px; height: 36px;}
.wrapper div.question .content textarea {background-color: rgba(255,255,255,0.1);  border: 1px solid white;font-size: 18px; font-weight: 300; color: white; padding: 5px; width: 500px; height: 200px; outline: none; }
.wrapper div.question .content input::-webkit-input-placeholder {color:white; font-weight: 100;}
.wrapper div.question .content input::-moz-placeholder {color:white; font-weight: 100;}
.wrapper div.question .content input:-moz-placeholder {color:white; font-weight: 100;}
.wrapper div.question .content input:-ms-input-placeholder  {color:white; font-weight: 100;}
.wrapper div.question .content textarea::-webkit-input-placeholder {color:white; font-weight: 100;}
.wrapper div.question .content textarea::-moz-placeholder {color:white; font-weight: 100;}
.wrapper div.question .content textarea:-moz-placeholder {color:white; font-weight: 100;}
.wrapper div.question .content textarea:-ms-input-placeholder  {color:white; font-weight: 100;}
.wrapper div.question .content h3 {font-size: 36px; font-weight: 300;  margin-top: 200px; padding-bottom: 5px; margin-bottom: 23px; text-align: center; opacity: 0;}
.wrapper div.question .content h3.visible {opacity: 1;}
.wrapper div.question .content span {display: inline-block; line-height: 70%; width: 250px; margin-left: 10px; vertical-align: middle;} 
.wrapper div.question .content span a {color: white} 
.wrapper div.question .content div {position: absolute; width: 400px; top: 40px; right: 0; opacity: 0;}
.wrapper div.question .content div.visible { opacity: 1;top: 50px;}
/*
.wrapper .support.content {width:  1054px; margin: 0 auto; padding: 20px 0 40px 0;}
.wrapper .support.content > a {color: black; font-weight: bold; display: block;}
*/




.wrapper .ad.intro {}
.wrapper .ad.intro .content {opacity: 0; position: fixed; top: 18%; width: 1000px; left: 50%; margin-left: -500px; }
.wrapper .ad.intro.current .content {opacity: 1}
.wrapper .ad.intro .content h1 {font-weight: 100; font-size: 36px; margin-top: 100px; text-align: center; line-height: 120%;}
.wrapper .ad.intro .content h1 font {font-size: 64px; }
.wrapper .ad.intro .content a {background-image: url('/bitrix/templates/seoven_v5/images/down_arr.svg'); background-position: center center; background-repeat: no-repeat; width: 144px; height:27px; display: block; margin: 50px auto 0 auto; text-decoration: none;}

.wrapper .ad.price {background-image1: url('/bitrix/templates/seoven_v5/images/creation_price.jpg');}
.wrapper .ad.price > table {opacity: 0; position: fixed; top: 18%; border-spacing: 0px; width: 1200px; left: 49%; margin-left: -600px; font-size: 16px; }
.wrapper .ad.price.current > table {opacity: 1; top: 20%; left: 50%;}
.wrapper .ad.price.current > table.showPopup {left: 30%; opacity: 0;}

.wrapper .ad.price.current .popup {position: fixed; width: 100%; height: 100%; z-index: 1000; /*background-color: rgba(0,0,0,0.3);*/ top: 0; opacity: 0; }
.wrapper .ad.price.current .popup.active { opacity: 1;}
.wrapper .ad.price.current .popup > span {font-size: 128px; font-weight: 100; cursor: pointer; position: absolute; margin-left: -600px; left: 50%; color: white; top: 40%; background-image: url('/bitrix/templates/seoven_v5/images/left_arr.svg'); background-position: center center; background-repeat: no-repeat;}
.wrapper .ad.price.current .popup > span:hover {color: white;}
.wrapper .ad.price.current .popup > div {position: absolute; width: 1000px; top: 15%; left: 50%; margin-left: -500px;}
.wrapper .ad.price.current .popup.active > div {top: 17%;}
.wrapper .ad.price.current .popup > div h2 {font-weight: 300; font-size: 32px; margin-top: 0; padding-bottom: 5px; margin-bottom: 23px; border-bottom: 1px solid rgba(255,255,255,0.5);}
.wrapper .ad.price.current .popup > div h3 {font-weight: 100; font-size: 24px; margin-top: 0;}
.wrapper .ad.price.current .popup > div h3:before {content: '/'}
.wrapper .ad.price.current .popup > div h3:after {content: '/'}
.wrapper .ad.price.current .popup > div table {font-weight: 300; width: 100%; table-layout: fixed; }
.wrapper .ad.price.current .popup > div table td {vertical-align: top; font-size: 15px;}
.wrapper .ad.price.current .popup > div table ul {list-style-type: none; margin: 0; padding: 0;}
.wrapper .ad.price.current .popup > div table ul li {margin: 10px 0; padding: 0 0 0 15px; vertical-align: middle; background-image: url('/bitrix/templates/seoven_v5/images/line.svg'); background-position: left center; background-repeat: no-repeat; }

.wrapper .ad.price > table { }
.wrapper .ad.price > table th { text-align: left}
.wrapper .ad.price > table th.middle { border-left: 140px solid transparent; border-right: 140px solid transparent}
.wrapper .ad.price > table th h2 {font-size: 22px;  margin: 0 0 22px 0; padding: 0;}
.wrapper .ad.price > table td > * {max-width: 238px;}
.wrapper .ad.price > table td {}
.wrapper .ad.price > table td.middle { border-left: 140px solid transparent; border-right: 140px solid transparent}
.wrapper .ad.price > table td span {display: block; color: #fff; }
.wrapper .ad.price > table td ul {display: block; margin: 20px 0; padding: 0;}
.wrapper .ad.price > table td li {display: block; color: #fff; padding: 0 0 0 43px; margin: 18px 0; background-image: url(/bitrix/templates/seoven_v5/images/red_arrow_right.svg); background-repeat: no-repeat; background-position: left top; background-size: 20px 20px; min-height: 20px; }
.wrapper .ad.price > table td li a {color: #fff;}
.wrapper .ad.price > table td p {font-size: 22px; color: #fff; }
.wrapper .ad.price > table td p span {display: block; color: #fff; font-size: 13px; margin-top: 3px;}
.wrapper .ad.price > table td > a {display: block; height: 36px; margin: 10px 0; background-color: #F03226; line-height: 36px; text-align: center; color: white; font-size: 20px; text-decoration: none;}
.wrapper .ad.price > table td > a:hover {background-image: url(/bitrix/templates/seoven_v5/images/submit_red.jpg);}
.wrapper .ad.price > table td > font > span {display: inline-block; vertical-align: top; border: 1px white solid; border-radius: 8px; width: 12px; height: 12px; color: white; text-align: center; font-size: 10px; line-height: 12px; margin-right: 16px; margin-top: 3px;}
.wrapper .ad.price > table td > font > font {display: inline-block; vertical-align: top; border-bottom: 1px dashed; color: #fff; cursor: pointer; font-size: 14px;}
.wrapper .ad.price > table td > font > div {display: none; position: absolute;}



.wrapper .ad.technologies {overflow: hidden;}
.wrapper .ad.technologies .content {opacity: 0; position: fixed; top: 18%; width: 1000px; left: 50%; margin-left: -500px; }
.wrapper .ad.technologies.current .content {opacity: 1}
.wrapper .ad.technologies .content h2 {font-weight: 100; font-size: 48px; margin-top: 50px; text-align: center; line-height: 120%;}
.wrapper .ad.technologies .content p {font-size: 20px; text-align: center; opacity: 0;margin-left: -5px}
.wrapper .ad.technologies .content p.price {text-align: right; padding-right: 100px;}
.wrapper .ad.technologies.current .content p.current {opacity: 1; margin-left: 0;}
.wrapper .ad.technologies .content span {opacity: 0;margin-left: -5px; margin-right: 5px}
.wrapper .ad.technologies.current .content span.current {opacity: 1; margin-left: 0; margin-right: 0}





.wrapper .main.intro {}
.wrapper .main.intro .content {opacity: 0; position: fixed; top: 18%; width: 1000px; left: 50%; margin-left: -500px; }
.wrapper .main.intro.current .content {opacity: 1}
.wrapper .main.intro .content h1 {font-weight: 100; font-size: 36px; margin-top: 100px; text-align: center; line-height: 120%;}
.wrapper .main.intro .content h1 font {font-size: 64px; }
.wrapper .main.intro .content a {background-image: url('/bitrix/templates/seoven_v5/images/down_arr.svg'); background-position: center center; background-repeat: no-repeat; width: 144px; height:27px; display: block; margin: 80px auto 0 auto; text-decoration: none;}



.wrapper .main.services {}
.wrapper .main.services .content {opacity: 0; position: fixed; top: 0%; width: 1000px; left: 50%; margin-left: -500px; text-align: center; }
.wrapper .main.services.current .content {opacity: 1}
.wrapper .main.services .content h2 {font-weight: 100; font-size: 42px; margin-top: 30%; text-align: center; line-height: 120%;}
.wrapper .main.services .content h2.current {margin-top: 10%;}
.wrapper .main.services .content h2 font {font-size: 64px; }
.wrapper .main.services .content div {margin-top: 10%;}
.wrapper .main.services .content div p {display: inline-block; opacity: 0; color: white;  font-weight: 100; margin: 30px 0; position: absolute; max-width: 450px; text-align: left; font-size: 18px;}
.wrapper .main.services .content div p a {font-size: 36px; line-height: 150%; color: white;  border-bottom: 1px solid white;  text-decoration: none;}
.wrapper .main.services .content div p.current {opacity: 1;}
.wrapper .main.services .content div p#creation {margin-top: 0; left: 0px; width: 300px;}
.wrapper .main.services .content div p#ad {margin-top: 0px; right: 0px; width: 320px;}
.wrapper .main.services .content div p#support {margin-top: 200px; left: 0; text-decoration: none;  width: 340px;}
.wrapper .main.services .content div p#support a { font-size: 28px;}
.wrapper .main.services .content div p#market {margin-top: 150px; right: 0; text-decoration: none;  width: 320px;}
.wrapper .main.services .content div p#market a { font-size: 28px;}
.wrapper .main.services .content div p#design {margin-top: 60px; left: 0; font-size: 18px;}
.wrapper .main.services .content div p#design a {font-size: 18px;}


.wrapper .main.contacts {}
.wrapper .main.contacts .content {opacity: 0; position: fixed; top: 0%; width: 1200px; left: 50%; margin-left: -600px; text-align: center; }
.wrapper .main.contacts.current .content {opacity: 1}
.wrapper .main.contacts .content h2 {font-weight: 100; font-size: 42px; margin-top: 30%; text-align: center; line-height: 120%;}
.wrapper .main.contacts .content h2.current {margin-top: 10%;}
.wrapper .main.contacts .content h2 font {font-size: 64px; }
.wrapper .main.contacts .content table {width: 100%;}
.wrapper .main.contacts .content table td {text-align: left; width: 40%; vertical-align: top; font-size: 18px;}
.wrapper .main.contacts .content table td#ymap {opacity: 0.9; width: 60%;}
.wrapper .main.contacts .content table td a {color: white;}


.wrapper .support.intro {}
.wrapper .support.intro .content {opacity: 0; position: fixed; top: 18%; width: 1000px; left: 50%; margin-left: -500px; }
.wrapper .support.intro.current .content {opacity: 1}
.wrapper .support.intro .content h1 {font-weight: 100; font-size: 36px; margin-top: 100px; text-align: center; line-height: 120%;}
.wrapper .support.intro .content h1 font {font-size: 64px; }
.wrapper .support.intro .content > a {background-image: url('/bitrix/templates/seoven_v5/images/down_arr.svg'); background-position: center center; background-repeat: no-repeat; width: 144px; height:27px; display: block; margin: 80px auto 0 auto; text-decoration: none;}
.wrapper .support.intro .content > div > a {position: fixed; top: 15px; left: 50%; color: white; z-index: 999; font-weight: 100; border-bottom: 1px solid #d2d2d2; text-decoration: none;}



.wrapper .support.services {}
.wrapper .support.services .content {opacity: 0; position: fixed; top: 0%; width: 1000px; height: 100%; left: 50%; margin-left: -500px; text-align: center; }
.wrapper .support.services.current .content.current {opacity: 1}
.wrapper .support.services .content h2 {font-weight: 100; font-size: 48px; text-align: center; line-height: 120%;}
.wrapper .support.services .content td {text-align: left; vertical-align: middle; }
.wrapper .support.services .content td p { font-size: 24px; font-weight: 300; text-align: left;}
.wrapper .support.services .content td p.mini { font-weight: 100;}
.wrapper .support.services .content#slide4 p {font-size: 18px;}
.wrapper .support.services .content.smaller p {font-size: 18px;}




.wrapper .video.intro {}
.wrapper .video.intro .content {opacity: 0; position: fixed; top: 18%; width: 1000px; left: 50%; margin-left: -500px; }
.wrapper .video.intro.current .content {opacity: 1}
.wrapper .video.intro .content h1 {font-weight: 100; font-size: 36px; margin-top: 100px; text-align: center; line-height: 120%;}
.wrapper .video.intro .content h1 font {font-size: 64px; }
.wrapper .video.intro .content > a {background-image: url('/bitrix/templates/seoven_v5/images/down_arr.svg'); background-position: center center; background-repeat: no-repeat; width: 144px; height:27px; display: block; margin: 80px auto 0 auto; text-decoration: none;}
.wrapper .video.intro .content > div > a {position: fixed; top: 15px; left: 50%; color: white; z-index: 999; font-weight: 100; border-bottom: 1px solid #d2d2d2; text-decoration: none;}

.wrapper .video.services {}
.wrapper .video.services .content {opacity: 0; position: fixed; top: 0%; width: 80%; height: 80%; margin-top: 5%; left: 10%; text-align: center; }
.wrapper .video.services.current .content {opacity: 1}
.wrapper .video.services .content h2 {font-weight: 100; font-size: 42px; margin-top: 5%; text-align: center; line-height: 120%;}
.wrapper .video.services .content h2.current {margin-top: 0%;}
.wrapper .video.services .content h2 font {font-size: 64px; }
.wrapper .video.services .content table {border: 5px solid transparent; margin: 0 auto; width: 100%;}
.wrapper .video.services .content td {font-size: 18px; font-weight: 100; opacity: 0;line-height: 170%; text-align: left; padding: 0 0%; white-space: nowrap; padding-left: 50px;}
.wrapper .video.services .content td.current { opacity: 1; padding-left: 0px;}
.wrapper .video.services .content font {display: block; font-size: 20px; font-weight: 100; opacity: 0; margin: 0; line-height: 170%; margin-top: 20px; text-align: center}
.wrapper .video.services .content font.current { opacity: 1}
.wrapper .video.services .content > a {background-image: url('/bitrix/templates/seoven_v5/images/down_arr.svg'); background-position: center center; background-repeat: no-repeat; width: 144px; height:27px; display: block; margin: 10px auto 0 auto; text-decoration: none;}


.wrapper .video.vimeo {}
.wrapper .video.vimeo .content {opacity: 0; position: fixed; top: 0%; width: 80%; height: 80%; margin-top: 5%; left: 10%; text-align: center; }
.wrapper .video.vimeo.current .content {opacity: 1}
.wrapper .video.vimeo .content h2 {font-weight: 100; font-size: 42px; margin-top: 15%; text-align: center; line-height: 120%;}
.wrapper .video.vimeo .content h2.current {margin-top: 10%;}
.wrapper .video.vimeo .content h2 font {font-size: 64px; }
.wrapper .video.vimeo .content p {font-size: 18px; line-height: 170%; }
.wrapper .video.vimeo .content p a {color: white; }
.wrapper .video.vimeo .content > a {background-image: url('/bitrix/templates/seoven_v5/images/down_arr.svg'); background-position: center center; background-repeat: no-repeat; width: 144px; height:27px; display: block; margin: 10px auto 0 auto; text-decoration: none;}


.wrapper .market.intro {}
.wrapper .market.intro .content {opacity: 0; position: fixed; top: 18%; width: 1000px; left: 50%; margin-left: -500px; }
.wrapper .market.intro.current .content {opacity: 1}
.wrapper .market.intro .content h1 {font-weight: 100; font-size: 48px; margin-top: 100px; text-align: center;}
.wrapper .market.intro .content h1 span {font-size: 36px}
.wrapper .market.intro .content a {background-image: url('/bitrix/templates/seoven_v5/images/down_arr.svg'); background-position: center center; background-repeat: no-repeat; width: 144px; height:27px; display: block; margin: 50px auto 0 auto; text-decoration: none;}



.wrapper .market.services {}
.wrapper .market.services .content {opacity: 0; position: fixed; top: 0%; width: 1000px; height: 100%; left: 50%; margin-left: -500px; text-align: center; }
.wrapper .market.services.current .content.current {opacity: 1}
.wrapper .market.services .content h2 {font-weight: 100; font-size: 48px; text-align: center; line-height: 120%;}
.wrapper .market.services .content td {text-align: left; vertical-align: middle; }
.wrapper .market.services .content td p { font-size: 24px; font-weight: 300; text-align: left;}
.wrapper .market.services .content td p.mini { font-weight: 100;}
.wrapper .market.services .content#slide4 p {font-size: 18px;}


.wrapper .bitrix.question {}
.wrapper .bitrix.question .content {opacity: 0; position: fixed; width: 1000px; height: 100%; left: 50%; top: 10%; margin-left: -500px; text-align: center; }
.wrapper .bitrix.question.current .content.current {opacity: 1}
.wrapper .bitrix.question .content h1 {font-weight: 100; font-size: 48px; text-align: left; line-height: 120%; margin-bottom: 0; border-bottom: 1px solid rgba(255,255,255,0.5);}
.wrapper .bitrix.question .content {text-align: left}
.wrapper .bitrix.question .content {text-align: left}
.wrapper .bitrix.question .content p {font-size: 18px; margin: 0 0 25px 0;}


.wrapper footer {width: 96%; line-height: 170%; position: fixed; bottom: -120px; opacity: 0;  left: 2%; height: 120px; font-weight: 100;}
.wrapper footer.active {bottom: 0; opacity: 1;}
.wrapper footer div {}
.wrapper footer div > *:first-child {text-decoration: underline; font-weight: normal;}
.wrapper footer .left {left: 0; position: absolute; top: 0;}
.wrapper footer .middle {left: 40%; position: absolute; top: 0;}
.wrapper footer .right {right: 0%; position: absolute; top: }
.wrapper footer a {text-decoration: none; color: white; }
.wrapper footer a:hover {font-weight: normal; border-bottom: 1px solid gray}
.wrapper footer a.call {border-bottom: 1px dashed rgba(255,255,255,0.4)}
.wrapper footer p {padding: 0; margin: 0;}
/*.wrapper footer p:hover {font-weight: normal;}*/

/* new services */
.service{
	opacity: 0
}
.current .service.current.showPopup {
  opacity: 0;
}
.current .service.current{
	opacity: 1
}
.service__wrapper{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	position: fixed;
	justify-content: space-between;
	flex-wrap: wrap;
	font-size: 16px;
	top: 20%;
	left: 50%;
	margin-left: -600px;
	width: 1200px;
}
.price-caption__title::before, .price-caption__title::after{
	content: '/'
}
.price-caption__title{
  font-weight: 100;
  font-size: 24px;
  margin-top: 0;
  text-align: left;
  color: #fff;
}

.service__item{
	width: 300px;
  margin-bottom: 20px;
}
.price-caption{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}
.price-caption__item{
	width: 50%
}
.service__title{
  font-size: 22px;
	font-weight: 400;
  margin: 0 0 22px 0;
  padding: 0;
}
.service__list{
	display: block;
  margin: 20px 0;
  padding: 0;
}
.service__list a{
	color: #fff
}
.service__list li{
	display: block;
  color: #fff;
  padding: 0 0 0 43px;
  margin: 18px 0;
  background-image: url(/bitrix/templates/seoven_v5/images/red_arrow_right.svg);
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 20px 20px;
  min-height: 20px;
}
.service__order-btn{
	display: block;
  height: 36px;
  margin: 10px 0;
  background-color: #F03226;
  line-height: 36px;
  text-align: center;
  color: white;
  font-size: 20px;
  text-decoration: none;
}
.service_read-more{
	display: inline-block;
  vertical-align: top;
  border-bottom: 1px dashed;
  color: #fff;
  cursor: pointer;
  font-size: 14px;
	text-decoration: none;
}
.round{
	display: inline-block;
  vertical-align: top;
  border: 1px white solid;
  border-radius: 8px;
  width: 12px;
  height: 12px;
  color: white;
  text-align: center;
  font-size: 10px;
  line-height: 12px;
  margin-right: 16px;
  margin-top: 3px;
}
.service__price{
	font-size: 22px;
	margin: 1em 1em 1em 0;
}
.service__price span{
	display: block;
  font-size: 13px;
  margin-top: 3px;
}
.service__price s{
	font-size: 65%;
  display: inline-block;
  vertical-align: middle;
  margin-left: 3px;
}
.price-caption__item ul{
	list-style-type: none;
  margin: 0;
  padding: 0;
}

.price-caption__item li{
  font-size: 15px;
	margin: 10px 0;
  padding: 0 0 0 15px;
  vertical-align: middle;
  background-image: url(/bitrix/templates/seoven_v5/images/line.svg);
  background-position: left center;
  background-repeat: no-repeat;
}
.more_info{
	display: none
}
/* new services end */


div[id="pozvonim-button"] {display: none!important;}
div[id="pozvonim-button"].visible {display: block!important;}

.cover{
	top: 0;
	left: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 100000000000000000;
}

@media (max-width: 575.98px) {
	.wrapper .support.intro .content, .wrapper .support.services .content, .wrapper .ad.intro .content, .wrapper .creation.webtechnologies > div.content, .wrapper .creation.pluses .content, .wrapper .ad.technologies .content, .service__wrapper, .wrapper .ad.price.current .popup > div {
		margin-left: 0;
		left: 0;
    padding: 0px 10px;
		width: auto 
	}
	.wrapper .ad.price.current .popup > span{
		margin-left: 0;
		left: auto;
		right: 0;
		top: 17%;
		font-size: 30px;
    width: 30px;
    z-index: 200
	}
	.wrapper .creation.pluses .content table a{
		padding: 10px 20px
	}
	.wrapper .creation.pluses .content table td ul li{
		padding: 0 0 0 30px
	}
	.wrapper .creation.webtechnologies.current > div.content{
		left: 0
	}
	.wrapper .creation.webtechnologies a {
    height: 75px;
    width: 60px
  }
	.wrapper .support.intro .content h1, .wrapper .ad.intro .content h1{
		font-size: 2rem;
		line-height: 1.5
	}
	.wrapper .support.intro .content h1 font, .wrapper .ad.intro .content h1 font {
	  font-size: 2em;
	  line-height: 1
	}
	.wrapper .support.services .content#slide4 p {
	  font-size: 14px;
	  line-height: 1.4
	}
	.wrapper .support.services .content h2{
		margin-bottom: 0.4em
	}
	.wrapper .support.services .content td p{
		font-size: 21px
	}
	.service__wrapper{
		top: 12%
	}
	.service__title{
		margin-bottom: 5px
	}
	.service__price{
		margin: 0.2em 1em 0.2em 0
	}
	.service__list, .service__caption{
		display: none
	}
	.service__order{
		font-size: 18px;
		height: 32px;
    margin: 5px 0;
    line-height: 32px;
	}
	.service__item{
		margin: 0 auto 12px
	}
	.wrapper .creation.webtechnologies a{
		margin-right: 5px;
		line-height: 55px;
		height: 55px;
	}
	.wrapper .creation.webtechnologies a img{
		max-width: 45px;
    max-height: 45px
	}
	.wrapper .creation.webtechnologies a{
		width: 45px
	}
	.wrapper .creation.pluses .content table a{
		width: 120px
	}
	.wrapper .creation.price.current .popup > span{
		width: 9vw;
	}
	.wrapper .creation.price .content{
		margin: 0;
	}
}

@media (max-width: 767.98px) {
	
}

@media (max-width: 991.98px) {
	
}

@media (max-width: 1199.98px) {
	
}



/* End */


/* Start:/bitrix/templates/seoven_v5/mobile.css?17598611824247*/
@media screen and (max-width: 1023px) { 
	html,body { -webkit-text-size-adjust:none; font-size: 3vw;  }
	body {overflow: visible;}
	
	.wrapper header .phone span {display: none;}
	.wrapper header .logo {font-size: 7vw; top: 1vw;}
	.wrapper header .phone {font-size: 4vw;top: 12vw; margin-left: 0; left: 2%;}
	.wrapper header .phone.call {top: 8vw;}
	.wrapper header > div {top: 3vw;}
	.wrapper header > div > span a {font-size: 4vw;}
	.wrapper header > div > p {margin: 0}
	.wrapper header > div > p a {font-size: 4vw; display: block}
	
	.wrapper main > div.current .controlMainBTN#scrollUP {top: 0;}
	.wrapper .main.intro .content a {margin-top: 20vh;}
	.wrapper main div.content {}
	
	.wrapper .main.intro .content h1  {font-size: 6vw;}
	.wrapper .main.intro .content h1 font {font-size: 10vw;}
	
	.wrapper .main.services .content {width: 96%; left: 0; top: 20vw;  margin-left: 2%; margin-right: 2%;margin-top: 0}
	.wrapper .main.services .content h2 {margin: 0;}
	.wrapper .main.services .content h2.current {margin: 0;}	
	.wrapper .main.services .content div {margin-top: 0;}
	.wrapper .main.services .content div p {display: block; position: inherit; margin-bottom: 2vw;}
	.wrapper .main.services .content div p#support {margin-top: 0} 
	.wrapper .main.services .content div p#market {margin-top: 0}
	.wrapper .main.services .content div p {font-size: 16px;}
	.wrapper .main.services .content div p a, .wrapper .main.services .content div p#support a,.wrapper .main.services .content div p#market a {font-size: 18px;}
	
	.wrapper .main.contacts .content {width: 96%; top: 20vw;left: 0; margin-left: 2%; margin-right: 2%;margin-top: 0}
	.wrapper .main.contacts .content h2 {margin: 0;}
	.wrapper .main.contacts .content h2.current {margin: 0;}	
	.wrapper .main.contacts .content table td {display: block; width: auto;}
	.wrapper .main.contacts .content table td#ymap {display: none;}
	
	.wrapper div.question .content {width: 96%; top: 20vw;left: 0; margin-left: 2%; margin-right: 2%;margin-top: 0}
	.wrapper div.question .content input, .wrapper div.question .content textarea {width: 90vw;}
	.wrapper div.question .content span {width: auto; margin-top: 1vh;}
	.wrapper div.question .content p {z-index: 8; position: relative} 
	.wrapper div.question .content div {width: 96%; margin: 0 2%; box-shadow: 0px 0px 4vw 6vw rgba(0,0,0,1); z-index: 5;}
	.wrapper div.question .content div.visible {background-color: rgba(0,0,0,1); z-index: 10;}
	
	.wrapper .creation.intro .content h1 {font-size: 6vw;}
	.wrapper .creation.intro .content a {margin-top: 10vh;}
	
	.wrapper .creation.price > table th {width: 33%;}
	.wrapper .creation.price > table th h2 {font-size: 3vw; margin-bottom: 0; }
	.wrapper .creation.price .content {width: 96%; left: 0; top: 20vw;  margin-left: 2%; margin-right: 2%;margin-top: 0}
	.wrapper .creation.price > table {width: 100%; font-size: 2vw; }
	.wrapper .creation.price > table td > * {max-width: 100%;}
	.wrapper .creation.price > table td ul {}
	.wrapper .creation.price.current > table {width: 95vw; font-size: 2vw; }
	.wrapper .creation.price > table th.middle, .wrapper .creation.price > table td.middle {border: 0;}
	.wrapper .creation.price.current > table.current {left: 0;}
	.wrapper .creation.price > table td span {height: 3vw;}
	.wrapper .creation.price > table td ul {display: block; height: 40vw;}
	.wrapper .creation.price > table td li {padding-left: 3.5vw; background-size: 3vw 3vw; font-size: 3vw; display: block; min-height: 7vw; }
	.wrapper .creation.price > table td p {font-size: 3vw; }
	.wrapper .creation.price > table td p span {font-size: 2vw;}
	.wrapper .creation.price > table td > a {font-size: 3vw;}
	.wrapper .creation.price > table td > font > font {font-size: 2vw; display: inline-block; width: 25vw;}
	
	.wrapper .creation.price.current .popup > span {top: 16%; font-size: 5vh; z-index: 10; margin-left: 10vw; width: 7vw; left: auto; right: 2%;}
	.wrapper .creation.price.current .popup > div {width: 100%; left: 0;margin-left: 0;}
	
	.wrapper .creation.technologies. h2 {font-size: 28px; }
	.wrapper .creation.technologies.current h2 {font-size: 28px; margin-left: 0; left: 0; width: 100%;  }
	
	.price-caption__item li {font-size: 12px;}
	
	.wrapper footer .right {display: none}
}
/* End */


/* Start:/bitrix/templates/seoven_v5/loading.css?175986117710482*/



@-webkit-keyframes uil-pacman-css-1 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
    -webkit-transform: rotate(-30deg);
    -o-transform: rotate(-30deg);
    transform: rotate(-30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
@-webkit-keyframes uil-pacman-css-1 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
    -webkit-transform: rotate(-30deg);
    -o-transform: rotate(-30deg);
    transform: rotate(-30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
@-moz-keyframes uil-pacman-css-1 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
    -webkit-transform: rotate(-30deg);
    -o-transform: rotate(-30deg);
    transform: rotate(-30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
@-ms-keyframes uil-pacman-css-1 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
    -webkit-transform: rotate(-30deg);
    -o-transform: rotate(-30deg);
    transform: rotate(-30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
@-moz-keyframes uil-pacman-css-1 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
    -webkit-transform: rotate(-30deg);
    -o-transform: rotate(-30deg);
    transform: rotate(-30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
@-webkit-keyframes uil-pacman-css-1 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
    -webkit-transform: rotate(-30deg);
    -o-transform: rotate(-30deg);
    transform: rotate(-30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
@-o-keyframes uil-pacman-css-1 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
    -webkit-transform: rotate(-30deg);
    -o-transform: rotate(-30deg);
    transform: rotate(-30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
@keyframes uil-pacman-css-1 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
    -webkit-transform: rotate(-30deg);
    -o-transform: rotate(-30deg);
    transform: rotate(-30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
width: 100%;
@-webkit-keyframes uil-pacman-css-2 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
@-webkit-keyframes uil-pacman-css-2 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
@-moz-keyframes uil-pacman-css-2 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
@-ms-keyframes uil-pacman-css-2 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
@-moz-keyframes uil-pacman-css-2 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
@-webkit-keyframes uil-pacman-css-2 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
@-o-keyframes uil-pacman-css-2 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
@keyframes uil-pacman-css-2 {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -ms-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
.uil-pacman-css {
  background: none;
  position: relative;
  width: 200px;
  height: 200px;
}
.uil-pacman-css > div {
  position: absolute;
  width: 200px;
  height: 200px;
}
.uil-pacman-css > div > div {
  background: #f03226;
  width: 200px;
  height: 100px;
  position: absolute;
  z-index: 1;
}
.uil-pacman-css > div:nth-of-type(1) {
  top: 0;
  -ms-animation: uil-pacman-css-1 1s linear infinite;
  -moz-animation: uil-pacman-css-1 1s linear infinite;
  -webkit-animation: uil-pacman-css-1 1s linear infinite;
  -o-animation: uil-pacman-css-1 1s linear infinite;
  animation: uil-pacman-css-1 1s linear infinite;
}
.uil-pacman-css > div:nth-of-type(1) > div {
  border-radius: 100px 100px 0 0;
}
.uil-pacman-css > div:nth-of-type(2) {
  top: 0px;
  -ms-animation: uil-pacman-css-2 1s linear infinite;
  -moz-animation: uil-pacman-css-2 1s linear infinite;
  -webkit-animation: uil-pacman-css-2 1s linear infinite;
  -o-animation: uil-pacman-css-2 1s linear infinite;
  animation: uil-pacman-css-2 1s linear infinite;
}
.uil-pacman-css > div:nth-of-type(2) > div {
  top: 100px;
  border-radius: 0 0 100px 100px;
}
.uil-pacman-css > div:nth-of-type(3) > div {
  width: 100px;
  height: 200px;
  border-radius: 100px 0 0 100px;
  background: #f03226;
}
/* End */
/* /bitrix/templates/seoven_v5/styles.css?175986117738656 */
/* /bitrix/templates/seoven_v5/mobile.css?17598611824247 */
/* /bitrix/templates/seoven_v5/loading.css?175986117710482 */
