/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0; padding:0; border:0; outline:0;}
button::-moz-focus-inner, input::-moz-focus-inner {padding:0; border:0; outline:0;}
*, *::after, *::before {
    box-sizing: border-box;
}
*, *::after, *::before {
    box-sizing: border-box;
}



/* main styles */
body {margin:0; padding:0;}
body {background:#ffffff; color:#253227; font:300 20px/27px "Open Sans", SansVerdana, Geneva, sans-serif;}
body.yellowbg {background-color:#F6DC00}
h1, h2, h3, h4, h5, h6, p {margin:0;}
p {margin-bottom:1em; padding:0;}

A {color:#253227; text-decoration:underline;transition:color 0.2s ease 0s;}
A:hover {color:#253227; text-decoration:underline; transition:color 0.2s ease 0s;} 
a.bluehover span.addborder {border-bottom:1px solid #253227; text-decoration:none;}
a.bluehover:hover span.addborder {color:#0152FC; border-bottom:1px solid #0152FC; text-decoration:none;}
a.bluehover, a.bluehover:hover {text-decoration:none;}

H1 {font:52px 'Open Sans', SansVerdana, Geneva, sans-serif; font-weight:300; line-height:120%; padding:0; margin:0 0 4px 0;}
h2 {font:36px 'Open Sans', SansVerdana, Geneva, sans-serif; font-weight:300; line-height:120%; padding:0; margin:-12px 0 0;}
h3 {font:22px 'Open Sans', SansVerdana, Geneva, sans-serif; font-weight:300; line-height:120%; padding:0; margin:44px 0 15px; text-align:left;}
.clear {clear:both; height:1px; width:100%; font-size:0;}
.btn, .btn:link, .btn:active, .btn:visited {border-radius:30px; color:#253227; font-size:20px; height:57px; line-height:53px; text-align:center; text-decoration:none; border:#253227 solid 1px; display:inline-block}
.btn:hover {text-decoration:none; background-color: #fff; border-color: #fff; color: #253227;}
.btn_menu, .btn_menu:link, .btn_menu:active, .btn_menu:visited {position:absolute; right:56px; top:56px; width:219px;}	
.btn_more, .btn_more:link, .btn_more:active, .btn_more:visited {color:#fff;border:#fff solid 1px; width:185px; }
.btn_more:hover {color:#fff;text-decoration:none; background-color:#fff; border-color:#fff !important;}
.quote {font-size:200%; font-style: italic; margin:0 auto; line-height: 115%; padding-bottom: 10px; width:70%;}
.about_photos {width:640px}
.about_photos_vert {width:540px;}

/* button menu all page */
.menu_button {border-radius:30px; color:#253227; font-size:20px; text-align:center; text-decoration:none; border:#253227 solid 1px; display:inline-block; font-weight: 300; height: auto; line-height: 100%; padding: 17px 23px;}
.menu_button:hover {text-decoration:none; background-color: #fff; border-color: #fff; color: #253227;}

.menu_button.menu_button_white {color:#fff; border:#fff solid 1px;}
.menu_button.menu_button_white:hover {text-decoration:none; background-color: #fff; border-color: #fff; color: #253227;}
.mediamarkt .menu_button:hover {color: #ec0094;}
.vedomosti .menu_button:hover {color: #226F6E;}
.rosgazeta .menu_button:hover {color: #cc293e;}

.mainpagebody header {position: absolute; left: 0; right: 0;}
header .april_logo {float: left; margin: 65px 0 0 65px;}
header .april_logo img {max-width: 353px;}
.inner_bg header .april_logo img {max-width: 361px;}
header .april_menu {float: right; margin: 56px 56px 0 0;}
header {margin-bottom: 40px;}
/* \ button menu */

.photo {position:relative; min-width:1250px;}
.photo__container--top {position:relative;}
.photo__container {width:968px;}
.photo__container {margin-left:auto; margin-right:auto; padding-left:0; padding-right:0;}
.photo__container {padding-left:20px; padding-right:20px;}

.inner { text-align:center; color:#fff;}
.inner a {color:#fff;}
.inner h1 {margin-bottom:24px;}

.item {position:relative; text-align:left;}
.s16 {font-size:16px;}
.s20 {font-size:20px;}
.s22 {font-size:22px;}
.small {font-size:14px; line-height:140%}
.nowrap {white-space:nowrap;}
.comment {font:italic 14px "Times New Roman",Times,serif; left:720px; position:absolute; top:0;}
.comment.down.wide {width:690px;}
.comment.down {left:auto; margin-bottom:22px; margin-top:-26px; position:relative; text-align:right; top:auto; width:676px;}
.email {font-style:normal;}
.beforetext {margin-bottom:25px;}
.preview {font-family:"Times New Roman",Times,serif; font-size:14px; list-style:outside none none; margin:0; padding:0;}
.preview li {float:left; margin:0 18px 21px 0; padding:0; vertical-align:top;}
.preview p {margin:0; padding:0 0 3px 5px;}

.medimg {float:left; font-family:"Times New Roman",Times,serif; font-size:14px; line-height:100%; list-style:outside none none; margin:13px 0 7px; padding:0;}
.medimg li {float:left; margin:0 23px 12px -4px; padding:0; vertical-align:bottom;}
.medimg .botomasksmall img {margin-top:142px;}
.medimg .botomasksmall p {margin-right:3px;}
.medimg p {margin:2px 0 0; padding:0 0 6px 5px; text-align:right;}
.photo__presentation {background-color:#F6DC00; background-image:url(../imgs/eugene_bg_right.png); background-position:right top; background-repeat:no-repeat; background-size:cover; padding-top:50%;}
.photo.smartphones .photo__presentation {background:#EE3048 url(../imgs/smartphones.png) left bottom no-repeat; background-size:cover; }
.photo__content {bottom:300px; left:0; position:absolute; right:0;}
.row::after {clear:both;}
.row::after, .row::before {content:""; display:table;}
.row {margin-left:0;}
.col {display:inline-block; vertical-align:top; width:100%;}

.photo__heading {margin-bottom:1em; width: 64%; padding-left: 30px;}
.photo__heading h1 {font:40px 'Open Sans', SansVerdana, Geneva, sans-serif; font-weight:300; line-height:120%; padding:0; margin:0 0 40px 0; text-align:left;}
.photo__heading p {padding:0; margin:0; text-align:left; font-size:17px;}
.photo__heading p span {white-space:nowrap}
.photo__heading .phone a {text-decoration:none !important;}
.photo__heading.ForMobile .phone {font-size:14px;}
.photo .ForMobile .btn_menu.mainpagemenu {font-size:14px; padding: 10px;}


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

.projects {color:#fff; min-width:1250px;}
.projects a {color:#fff; text-decoration:none;}
.projects a:hover {color:#fff; text-decoration:none; opacity:1}
.projects h2 {opacity:0.9;}
.projects h2.medium {font-size:32px; margin-top:0px;}
.projects .tags {font-size:16px;}
.projects .tags a {margin-right:20px; opacity:0.9}
.projects .tags a:hover {text-decoration:none; opacity:1;}
.projects_logo {width:470px; height:100%; position:relative; float:left;}
.projects_logo img {left:50%; position:absolute; top:50%; transform:translateX(-50%) translateY(-50%); -ms-transform:translateX(-50%) translateY(-50%); -webkit-transform:translateX(-50%) translateY(-50%); -o-transform:translateX(-50%) translateY(-50%); -moz-transform:translateX(-50%) translateY(-50%);}
.projects_more {width:240px; height:100%; float:right; position:relative;}
.projects_more a, .projects_more span {margin-right:58px; position:absolute; top:50%; transform:translateY(-50%);}
.projects_more em {font-style:normal;}
.projects_caption {margin:0 325px 0 470px; position:relative; height:100%}
.projects_caption.no_morebtn {margin-right:260px;}
.projects_caption div, .projects_caption span {position:absolute; top:50%; transform:translateY(-50%); width:100%}
.line_projects.line_contacts a {color:#253227 !important; text-decoration:none !important;}
.line_projects.line_contacts h2 {padding:0; margin:0;}

.photo__heading.ForMobile b {font-size:14px;}
.photo__heading.ForMobile a span {opacity:0.9;}
.photo__heading.ForMobile a:hover span {opacity:1;}
.bluetag {background-color:#3D61FD; color:#fff !important; border-radius:6px; padding:0px 6px 1px; white-space:nowrap; text-decoration:none !important;}

.inner_bg {position:relative}
.inner_bg.mediamarkt {background-color:#EC0094;}
.inner_bg.rosgazeta {background-color:#EE3048;}
.inner_bg.vedomosti {background-color:#226F6E;}
.inner_bg .top_bg {width:100%; position: fixed; top:0; left:0; z-index:20;}
.inner_infoblock {position:relative; z-index:40; padding-bottom: 500px;}


.interview {width:1000px; margin:0 auto; padding-top:50px}

.stats {height:0; overflow: hidden;}


/* ---------------------------- inner_page ---------------------------- */
.textalign_center {margin:0 auto; text-align:center;}
.textalign_center.fixtext {width:700px; margin-bottom:20px; margin-top:20px; line-height:150%}
.textalign_center.brand_about {width:700px; margin-bottom:60px; margin-top:28px; line-height:150%}
.brand_logo img {width:400px;}
h1.textalign_center {width:700px; margin-bottom:65px; font-size:40px;}
.rosgazeta h1.textalign_center {width:740px;}
.iphone_appstorescreens ul {white-space:nowrap;}
.iphone_appstorescreens li {display:inline; list-style:none; width:348px;}
.ipad_hidden {overflow:hidden; text-align:right; margin-top:100px;}
.ipad_hidden img {margin-right:-180px; margin-left:80px;}
.textalign_center.icon_descr {margin-top:-25px;}
.textalign_center.ipad_descr {margin-top:-22px;}
.textalign_center.ipad_screensdescr {margin-top:-29px;}
.textalign_center.iphone_startscreen {margin-top:145px;}
.textalign_center.iphone_startscreen_descr {margin-top:-35px;}
.textalign_center.iphone_appstorescreens {margin-top:136px;}
.textalign_center.iphone_appstorescreens_descr {margin-top:-15px; margin-bottom:220px;}
.textalign_center.showmore {padding-top:68px; margin-bottom:22px;}
.textalign_center.showmore_btn {margin-top:75px;}
.textalign_center.ipad_smallcenter_descr {margin-bottom:95px; margin-top:5px;}
.textalign_center.site_screen {margin-top:90px;}
.textalign_center.site_screen img {width:968px; height:auto;}
.textalign_center.site_screen_descr {margin-top:-25px;}
.textalign_center.ipad_smallcenter {margin-top:75px;}
.iphone_present {padding-top:19px; padding-bottom:17px;}
.appicon img {width:250px;}

.rosgazeta .textalign_center.appicon {margin-top:70px;}
.rosgazeta .textalign_center.carousel_line_descr {margin-top:-5px;}
.rosgazeta .textalign_center.iphone_startscreen {margin-top:90px; width:300px;}
.rosgazeta .iphone_startbg {background:url(../imgs/projects/rosgazeta/iphone-start.png) no-repeat top center; padding:23% 9% 43% 9%; max-width:300px;background-size:cover;}
.rosgazeta .iphone_startbg img {width:100%;}
.rosgazeta .textalign_center.iphone_startscreen_descr {margin-top:-15px;}

.vedomosti .inner .carousel {height:723px; font-size:14px;}
.vedomosti .inner .carousel > .wrap > ul {height:723px;}
.vedomosti .inner .carousel > .wrap > ul > li > img {height:auto;}
.vedomosti .inner .carousel > .wrap > ul > li > p {margin-top:-25px;}
.vedomosti .inner .carousel_line {margin-top:57px;}
.vedomosti .inner .resizeImg {margin-top:117px; margin-bottom:300px;}
.vedomosti .inner .resizeImg img {width:100%;}
.vedomosti .inner .resizeImg .small {margin-top:-21px;}
.vedomosti .inner .appicon {margin-top:34px;}
.vedomosti .iphone_vedom img {width:348px;}
.mt-25 {margin-top:-25px;}


/* ---------------------------- carousel_line ---------------------------- */
.carousel_line {margin-top:113px;}
.carousel {display:block; position:relative; -webkit-transform:translateZ(0); width:100%; min-width:400px; margin:0 auto; font-size:0; height:571px; -webkit-overflow-scrolling:touch;/* for tablets */
}
.touch .carousel {overflow:auto}
.carousel:before, .carousel:after {content:''; opacity:0; position:absolute; top:0; bottom:0; z-index:2; width:50px; text-align:center; font-size:80px; line-height:190px; font-family:arial; color:#555; font-weight:bold; pointer-events:none; -webkit-transition:0.2s ease-out; transition:0.2s ease-out}
/* .carousel:before {content:'\2039'; left:0; text-indent:-80px; -webkit-box-shadow:50px 0 20px -20px #eeeeee inset; box-shadow:50px 0 20px -20px #eeeeee inset}
.carousel:after {content:'\203A'; right:0; text-indent:50px; -webkit-box-shadow:-50px 0 20px -20px #eeeeee inset; box-shadow:-50px 0 20px -20px #eeeeee inset}
.carousel.right:after, .carousel.left:before {opacity:1}
.carousel.right:after {right:8px; text-indent:70px}
.carousel.left:before {left:8px; text-indent:-120px} */
.carousel > a {position:absolute; margin:0; top:0; bottom:0; color:#CCC; font-size:1.5em; -webkit-transition:0.1s; transition:0.1s}
.carousel > a:hover {color:#FFF}
.carousel > a.prev {left:-20px}
.carousel > a.next {right:-20px}
.carousel > .indicator {pointer-events:none; position:absolute; z-index:4; bottom:0; left:0; background:#d82b6a; height:4px; border-radius:10px; opacity:0; -webkit-transition:opacity 0.2s, bottom 0.2s; transition:opacity 0.2s, bottom 0.2s}
.carousel:hover > .indicator {opacity:1; bottom:-10px}
.carousel > .wrap {overflow:hidden; border-radius:5px}
.carousel > .wrap > ul {list-style:none; white-space:nowrap; height:571px}
.carousel > .wrap > ul > li {display:inline-block; vertical-align:middle; height:100%; margin:0 0 0 5px; position:relative; overflow:hidden; -webkit-transition:0.25s ease-out; transition:0.25s ease-out}
.carousel > .wrap > ul > li:first-child {margin:0}
.carousel > .wrap > ul > li > img {display:block; height:100%; margin:auto; vertical-align:bottom; position:relative; z-index:1; -webkit-transition:1s ease; transition:1s ease}
.textalign_center.carousel_line_descr {margin-top:-25px;}
/* ---------------------------- carousel_line ---------------------------- */



.footer {color:#fff; position:absolute; z-index:100; bottom:0; left:0; width:100%; height:500px; background-size:cover; background-position:center top; background-repeat:no-repeat;}
.footer.popmech {background-color:#273364; background-image:url(../imgs/projects/popmech/footer_bg.png);}
.footer.mediamarkt {background-color:#EC0094; background-image:url(../imgs/projects/mediamarkt/footer_bg.jpg);}
.footer.rosgazeta {background-color:#EE3048; background-image:url(../imgs/projects/rosgazeta/footer_bg.jpg);}
.footer.vedomosti {background-color:#226F6E; background-image:url(../imgs/projects/vedomosti/footer_bg.jpg);}
.footer.rosgazeta .btn_more, .footer.rosgazeta .btn_more:link, .footer.rosgazeta .btn_more:active, .footer.rosgazeta .btn_more:visited {border-color:#CC293E;}
.footer.rosgazeta .btn_more:hover {border-color:#fff;}
.footer.rosgazeta .textalign_center.showmore_btn a:hover {color:#EE3048;}
.footer.mediamarkt .btn_more, .footer.mediamarkt .btn_more:link, .footer.mediamarkt .btn_more:active, .footer.mediamarkt .btn_more:visited {border-color:#EC0094;}
.footer.mediamarkt .btn_more:hover {border-color:#fff;}
.footer.mediamarkt .textalign_center.showmore_btn a:hover {color:#EC0094;}
.footer.vedomosti .btn_more, .footer.vedomosti .btn_more:link, .footer.vedomosti .btn_more:active, .footer.vedomosti .btn_more:visited {border-color:#fff;}
.footer.vedomosti .btn_more:hover {border-color:#fff;}
.footer.vedomosti .textalign_center.showmore_btn a:hover {color:#226F6E;}

.footer .btn_more, .footer .btn_more:link, .footer .btn_more:active, .footer .btn_more:visited {border-color:#5C658A; width:143px;}
.footer .btn_more:hover {border-color:#fff;}
.footer .shadow {height:14px; width:100%; background:linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.01)) repeat scroll 0 0; opacity: 0.47;}

.textalign_center.showmore_btn em {font-style:normal;}
.textalign_center.showmore_btn a:hover {color:#33417C;}


.ForDesktop {display:block;}
.ForMobile {display:none;}
.ForRetina {display:none;}
.Retina {display:none;}

.BorderPadding {padding-left:20px; padding-right:20px;}


/* ---------------------------- mediamarkt ---------------------------- */
.mediamarkt .phone-pinklogo {background-image:url(../imgs/projects/mediamarkt/phone-pinklogo.png); background-repeat:no-repeat; background-position:0 0; display:inline-block; width:348px; height:673px;}
.mediamarkt .iphone-01 {background-image:url(../imgs/projects/mediamarkt/phone-01.png); background-repeat:no-repeat; background-position:0 0; display:inline-block; width:348px; height:673px;}
.mediamarkt .iphone-02 {background-image:url(../imgs/projects/mediamarkt/phone-02.png); background-repeat:no-repeat; background-position:0 0; display:inline-block; width:348px; height:673px;}
.mediamarkt .iphone-03 {background-image:url(../imgs/projects/mediamarkt/phone-03.png); background-repeat:no-repeat; background-position:0 0; display:inline-block; width:348px; height:673px;}



/* about */
main.about {padding-left:65px; padding-right:30px; color:#253227;}
.about_text {margin-right:580px; line-height:140%;}
.centralblock h3 {padding:0; margin:20px 0 5px 0; font-weight:400}
.centralblock {padding-top:30px; line-height:140%;}

.about_socblock p {padding:0; margin:0;}
footer.about {margin-top:100px; padding-bottom:90px; padding-left:65px; padding-right:65px; font-size: 16px;}
.about_contacts div.about_contacts_margin {margin-left:90px; margin-top:20px;}
.about_text_margin {float:left; width:100%;}

.icons {display: inline-block; margin-right: 7px; background:url(../imgs/icons.png) 0 0 no-repeat;}
.icons.fb {width: 23px; height: 23px; background-position: -96px 0; margin-bottom: -4px;}
.icons.fb.active, .icons.fb:hover, a:hover .icons.fb {width: 23px; height: 23px; background-position: -123px 0}
.icons.inst {width: 23px; height: 23px; background-position: -149px 0; margin-bottom: -4px;}
.icons.inst.active, .icons.inst:hover, a:hover .icons.inst {width: 23px; height: 23px; background-position: -175px 0}
.icons.cv {width: 43px; height: 42px; background-position: 0 0; display: block; float: left; margin-top: 4px; margin-right: 10px; margin-left: -4px;}
.icons.cv.active, .icons.cv:hover, a:hover .icons.cv {width: 43px; height: 42px; background-position: -49px 0}

.about_contacts {float:right; width:580px;}
.about_contacts_phone {margin-bottom: 5px;}
.about_contacts_email {margin-bottom: 10px;}

.about_card {font-size:18px; margin:20px 0 69px 0}
.about_card span.textcv {display: block; text-decoration: none; line-height: 120%; font-size: 18px;}
.about_card a {text-decoration: none;}

.about_socblock .eugene-h2 {margin-top: 7px;}
.about_socblock .olga-h2 {margin-top: 23px;}
.about_socblock .about_socblock_link {margin-bottom: 7px; white-space: nowrap;}


 
.olga-photo img {-webkit-filter: grayscale(1); /* Webkit браузеры */  
        filter: gray; /* для IE6-9 */  
        filter: grayscale(1); /* W3C */ }
.ava_photo {float: left; width: 100px;}
.ava_photo img {width: 100px; height: 100px; border-radius: 100px;}
.ava_photo.olga-photo img {margin-top: 25px;}
.ava_contacts {margin-left: 115px;}
.about_contacts div.about_contacts_margin {margin-left:40px;}


/* ---------------------------- listworks_page ---------------------------- */
.listworks_page {padding-left:65px; padding-right: 65px;}
.listworks_container p {padding: 0; margin: 0; line-height: 140%;}
.listworks_container {padding-top: 35px;}
.listworks_container h1 {padding: 0; margin: 0 0 -10px 0;}
ul.listprojects {padding: 0; margin: 0; list-style: none}
ul.listprojects li {padding: 0; margin: 0 0 15px 0; line-height: 110%; list-style: none}
ul.listprojects .time {font-size: 14px;}
h2.year {padding: 0; margin: 30px 0 8px 0;}

/* ---------------------------- page404 ---------------------------- */
.page404 {padding-left:65px; padding-right: 65px; margin-bottom: 150px;}
.page404 h1 {padding: 0; margin: 40px 0 10px 0;}

.collage3 {background: url(/imgs/collage.png) repeat-x; height: 500px;}