@import "../../../assets/fonts/NissanAG/font.css" all;

/*	style reset */
html, body, img, embed, noembed, object, noscript, ul, ol, li, dl, dt, dd, a, table, thead, tbody, tfoot, tr, th, td, caption, abbr, acronym, address, b, basefont, bdo, big, cite, code, del, dfn, em, font, i, ins, kbd, nobr, q, samp, small, strike, strong, sub, sup, tt, var, xmp, br, div, h1, h2, h3, h4, h5, h6, hr, marquee, p, pre, span, button, fieldset, form, label, legend, optgroup, option, select, textarea, frame, iframe, noframes {border: 0; margin: 0; padding: 0;}
input	{ margin: 0; padding: 0; }
/*	/style reset */

* {box-sizing: border-box}

body {font-family: "Nissan AG", Helvetica, Arial, sans-serif;color: #000000;line-height: 1.3;}
.page {position: relative;overflow: hidden;}

.width-wrap {width: 780px;margin-left: auto !important;margin-right: auto !important;}

.common-counter-images {position: relative;margin-top: -50px;font-size: 0;white-space: nowrap;text-align: center;}
.common-counter-images img {margin: 0 5px;}

.top-links {z-index: 2;position: absolute;top: 0;left: 0;right: 0;}
.top-links a {display: block;}
.top-links a.l1 {height: 300px;}
.top-links a.l2 {position: absolute;top: 0;left: 0;right: 50%;height: 690px;margin-right: 500px;}
.top-links a.l3 {position: absolute;top: 0;left: 50%;right: 0;height: 690px;margin-left: 100px;}

/* main.tpl */
.main .top {position: relative;height: 0;text-align: right;}
.main .top .width-wrap {}
.main .top .logo {z-index: 1;position: absolute;top: 95px;margin-left: -5px;}
.main .top .logo a {position: relative;display: block;width: 80px;height: 110px;}
.main .top .logo a img {position: absolute;top: -20px;left: -50px;display: block;width: 180px;}
.main .top .social-copyright {z-index: 10;position: relative;padding-top: 15px;}
.main .top .social-copyright .copyright {display: inline-block;vertical-align: middle;font-size: 13px;}
.main .top .social-copyright .social {display: inline-block;vertical-align: middle;margin: 0;padding: 0;list-style: none;font-size: 0;}
.main .top .social-copyright .social > li {display: inline-block;margin-left: 10px;}
.main .top .social-copyright .social > li a {display: block;}
.main .top .social-copyright .social > li a .svg {width: 30px;height: 30px;}
.main .top .social-copyright .social > li a .svg .square {display: none;}
.main .top .social-copyright .social > li a .svg .circle {display: block;fill: rgba(255,255,255,0.6);}
.main .top .social-copyright .social > li a .svg .ico {fill: #7f7f7f;}
.main .top .social-copyright .social > li a:hover .svg .circle {display: block;fill: #c71444;}
.main .top .social-copyright .social > li a:hover .svg .ico {fill: #ffffff;}
.main .bot {position: relative;background: url(../img/bottom-bg.png) repeat-y 50% 0;}
.main .bot .logo {position: absolute;top: -45px;left: 0;right: 0;width: 60px;height: 86px;margin: auto;}
.main .bot .logo span {position: relative;display: block;width: 60px;height: 86px;}
.main .bot .logo span img {position: absolute;top: -14px;left: -40px; display: block;width: 140px;}
.main .bot .car {height: 700px;background: url(../img/man_bottom.png) no-repeat 50% 50%;}
.main .head {position: relative;height: 1000px;background: url(../img/main_top_lines.jpg) no-repeat 50% 0;}
.main .head .title {width: 980px;margin: 0 auto;padding: 90px 0 0 220px;}
.main .head .title .text {font-size: 72px;font-weight: bold;color: #c71444;text-transform: uppercase;line-height: 0.8;letter-spacing: -3px;}
.main .head .title .desc {margin: 10px 0;font-size: 28px;font-weight: bold;color: #000000;text-transform: uppercase;line-height: 0.8;}
.main .head .title .test-drive {margin-top: 10px;font-size: 16px;color: #000000;}
.main .head .title .test-drive span {font-weight: 500;color: #c71444;text-transform: uppercase;}
.main .head .cities-list {position: relative;width: 980px;height: 390px;margin: 85px auto 0;}
.main .head .cities-list > li {z-index: 10;position: absolute;width: 16px;height: 16px;margin: 0;padding: 0;list-style: none;border: 2px solid #ffffff;border-radius: 50%;background-color: #c71444;cursor: pointer;box-sizing: content-box;}
.main .head .cities-list > li:hover {box-shadow: 0 0 0 2px #ffffff;}
.main .head .cities-list > li span {position: absolute;top: 0;left: 100%;display: block;padding-left: 8px;font-size: 12px;font-weight: 500;color: #000000;line-height: 16px;text-transform: uppercase;white-space: nowrap;}
.main .head .cities-list > li:hover span {color: #c71444;}
.main .head .cities-list > li.active span {color: #c71444;}
.main .head .cities-list > li b {position: absolute;bottom: 100%;left: 100%;display: block;padding-left: 8px;color: #c71444;text-transform: uppercase;line-height: 0.8;}
.main .head .cities-list > li.alm {top: 343px;left: 330px;}
.main .head .cities-list > li.msk {top: 135px;left: 112px;}
.main .head .cities-list > li.msk span {top: -5px;}
.main .head .cities-list > li.spb {top: 49px; left: 108px;}
.main .head .cities-list > li.nn  {top: 155px;left: 166px;}
.main .head .cities-list > li.nn span {top: 5px;}
.main .head .cities-list > li.smr {top: 226px;left: 184px;}
.main .head .cities-list > li.kzn {top: 191px;left: 198px;}
.main .head .cities-list > li.kzn span {top: 5px;}
.main .head .cities-list > li.ekt {top: 190px;left: 291px;}
.main .head .cities-list > li.ekt span {top: 5px;}
.main .head .cities-list > li.nsb {top: 261px;left: 445px;}
.main .head .cities-list > li.sch {top: 300px;left: 33px;width: 14px;height: 14px;box-shadow: 0 0 0 3px #c71444;}
.main .head .cities-cycle {position: absolute !important;bottom: 0;left: 0;right: 0;margin: auto;padding: 0;font-size: 0;white-space: nowrap;background-color: rgba(0, 0, 0, 0.1);}
.main .head .cities-cycle:before {position: absolute;top: 0;bottom: 0;left: 20px;right: 0;display: block;width: 780px;height: 270px;margin: auto;content: '';background-color: #ffffff;}
.main .head .cities-cycle .cycle-btn {z-index: 10;position: absolute;top: 0;bottom: 0;width: 50px;height: 50px;margin: auto; cursor: pointer;}
.main .head .cities-cycle .cycle-btn .svg {fill: #8f9092;}
.main .head .cities-cycle .cycle-btn:hover .svg {fill: #c71444;}
.main .head .cities-cycle .cycle-prev {right: 50%;margin-right: 320px;}
.main .head .cities-cycle .cycle-next {left: 50%;margin-left: 320px;}
.main .head .cities-cycle .item {display: inline-block;vertical-align: top;width: 780px;height: 270px;margin: 20px 10px;padding: 40px 80px;background-color: rgba(255, 255, 255, 0.4);}
.main .head .cities-cycle .item .event-date {z-index: 10;position: relative;font-size: 24px; margin-bottom: 25px;}
.main .head .cities-cycle .item .city-name {z-index: 10;position: relative;font-size: 36px;font-weight: bold;}
.main .head .cities-cycle .item .city-name span {z-index: 10;position: relative;font-size: 30px;font-weight: normal;}
.main .head .cities-cycle .item .test-drive-link {z-index: 10;position: relative;display: inline-block;padding: 8px 15px;font-size: 14px;font-weight: bold;color: #ffffff;text-transform: uppercase;text-decoration: none;background-color: #c71444;}
.main .head .xtrail {z-index: 1;position: absolute;top: 544px;left: 50%;width: 674px;height: 355px;margin-left: -282px; background: url(../img/xtrail.png) no-repeat 0 0;}
.main .news-list {position: relative;width: 960px;margin: 0 auto 60px;padding: 30px 0;}
.main .news-list .title {padding-left: 170px;font-size: 30px;font-weight: bold;color: #000000;}
.main .news-list .news-nav {padding: 10px 10px 0 0;float: right;}
.main .news-list .news-nav > li {display: inline-block;vertical-align: middle;margin-left: 10px;font-size: 14px;color: #c71444;text-decoration: none;cursor: pointer;}
.main .news-list .news-nav > li.active {color: #000000;}
.main .news-list .news-list-wrap {margin-top: 40px;overflow: hidden;}
.main .news-list .news-list-menu {float: left;margin-right: 10px;width: 160px;}
.main .news-list .news-list-menu ul {list-style-type: none;}
.main .news-list .news-list-menu li {margin: 0 10px 10px;padding-top: 5px;}
.main .news-list .news-list-menu li.active {background-color: #e2e2e2;padding: 5px 10px; margin: 0 0 5px;}
.main .news-list .news-list-menu span {color: #c71444;cursor: pointer;}
.main .news-list .news-list-box {width: 800px;margin: 0 -10px;float: left;font-size: 0;}
.main .news-list .news-list-box .item {display: inline-block;vertical-align: top;width: 380px;margin: 0 10px 20px;border-top: 1px solid #000000;}
.main .news-list .news-list-box .item a {color: inherit;text-decoration: none;}
.main .news-list .news-list-box .item .news-thumb {width: 380px;height: 180px;overflow: hidden;}
.main .news-list .news-list-box .item .news-thumb img {width: 100%;}
.main .news-list .news-list-box .item .news-title {margin: 20px 0;font-size: 18px;font-weight: bold;color: #000000;text-transform: uppercase;}
.main .news-list .news-list-box .item .news-teaser {margin: 10px 0;font-size: 16px;}
.main .news-list .news-list-box .item .news-more-link {margin-top: 10px;}
.main .news-list .news-list-box .item .news-more-link a {font-size: 14px;color: #8f9092;}
.main .news-list .news-list-box .item .news-more-link a:hover {color: #c71444;}


/* article.tpl */
.article {background: #ebebeb url(../img/article_top_lines.jpg) no-repeat 50% 0;}
.article .top {position: relative;height: 80px;text-align: right;background-color: #ffffff;box-shadow: 0 3px 25px rgba(0,0,0,0.25);}
.article .top .logo {position: absolute;top: 16px;}
.article .top .logo a {position: relative;display: block;width: 60px;height: 86px;}
.article .top .logo a img {position: absolute;top: -14px;left: -40px; display: block;width: 140px;}
.article .top .social-copyright {padding-top: 15px;}
.article .top .social-copyright .copyright {display: inline-block;vertical-align: middle;font-size: 13px;}
.article .top .social-copyright .social {display: inline-block;vertical-align: middle;margin: 0;padding: 0;list-style: none;font-size: 0; position: relative; z-index: 10}
.article .top .social-copyright .social > li {display: inline-block;margin-left: 10px;}
.article .top .social-copyright .social > li a {display: block;}
.article .top .social-copyright .social > li a .svg {width: 30px;height: 30px;}
.article .top .social-copyright .social > li a .svg .square {display: none;}
.article .top .social-copyright .social > li a .svg .circle {display: none;}
.article .top .social-copyright .social > li a .svg .ico {fill: #7f7f7f;}
.article .top .social-copyright .social > li a:hover .svg .circle {display: block;fill: #c71444;}
.article .top .social-copyright .social > li a:hover .svg .ico {fill: #ffffff;}
.article .bot {position: relative;}
.article .bot .logo {position: absolute;top: -45px;left: 0;right: 0;width: 60px;height: 86px;margin: auto;}
.article .bot .logo span {position: relative;display: block;width: 60px;height: 86px;}
.article .bot .logo span img {position: absolute;top: -14px;left: -40px; display: block;width: 140px;}
.article .bot .car {height: 500px;background: url(../img/man_bottom.png) no-repeat 50% 50%;}
.article .article-news {margin: 50px 0;padding: 40px 80px;background-color: #ffffff;box-shadow: 0 1px 4px rgba(0,0,0,0.25);}
.article .article-news .main-href {margin-bottom: 10px;}
.article .article-news .main-href a {color: #c71444}
.article .article-news .title {font-size: 30px;font-weight: bold;color: #000000;text-transform: uppercase;}
.article .article-news .video {margin: 20px -80px;}
.article .article-news .photo {margin: 20px -80px;}
.article .article-news .photo img {display: block;width: 100%;}
.article .article-news .photo-desc {margin: 10px 0 50px;}
.article .article-news .poster {margin: 20px -80px;}
.article .article-news .poster img {display: block;width: 100%;}
.article .article-news .content {}
.article .article-news .content p {margin: 30px 0;}
.article .article-news .content a {color: #c71444;}
.article .article-news .content ul {margin: 30px 0;padding-left: 20px;}
.article .article-news .city {float: left;font-size: 24px;font-weight: bold;color: #c71444;}
.article .article-news .city a {color: inherit; text-decoration: none;}
.article .article-news .date {float: right;padding-top: 10px;font-size: 11px;color: #858585;}
.article .article-news .bottom-main-href {clear: both; font-size: 16px; float: left;}
.article .article-news .bottom-main-href a {color: #c71444}
.article .article-news .social {margin: 0;padding: 20px 0 0;list-style: none;clear: both;font-size: 0;text-align: right;}
.article .article-news .social > li {display: inline-block;vertical-align: middle;margin-left: 10px;font-size: 14px;color: #000000;}
.article .article-news .social > li a {display: block;width: 30px;height: 30px;border-radius: 50%;background-color: #ffffff;box-shadow: 0 0 1px rgba(0,0,0,0.25);}
.article .article-news .social > li a .svg {width: 30px;height: 30px;}
.article .article-news .social > li a .svg .square {display: none;}
.article .article-news .social > li a .svg .circle {display: none;}
.article .article-news .social > li a .svg .ico {fill: #7f7f7f;}
.article .article-news .social > li a:hover .svg .ico {fill: #c71444;}
.article .news-list {position: relative;padding: 30px 0;background-color: #ffffff;}
.article .news-list .news-title {font-size: 30px;font-weight: bold;color: #000000;}
.article .news-list .news-nav {padding-top: 10px;float: right;}
.article .news-list .news-nav > li {display: inline-block;vertical-align: middle;margin-left: 10px;}
.article .news-list .news-nav > li a {font-size: 14px;color: #c71444;text-decoration: none;cursor: pointer;}
.article .news-list .news-nav > li a.select {color: #000000;}
.article .news-list .news-box {margin: 40px -10px 20px;font-size: 0;}
.article .news-list .news-box .item {display: inline-block;vertical-align: top;width: 380px;margin: 0 10px 20px;border-top: 1px solid #000000;}
.article .news-list .news-box .item a {color: inherit;text-decoration: none;}
.article .news-list .news-box .item .news-thumb {width: 380px;height: 180px;overflow: hidden;}
.article .news-list .news-box .item .news-thumb img {width: 100%;}
.article .news-list .news-box .item .news-title {margin: 20px 0;font-size: 18px;font-weight: bold;color: #000000;text-transform: uppercase;}
.article .news-list .news-box .item .news-teaser {margin: 10px 0;font-size: 16px;}
.article .news-list .news-box .item .news-more-link {margin-top: 10px;}
.article .news-list .news-box .item .news-more-link a {font-size: 14px;color: #8f9092;}
.article .news-list .news-box .item .news-more-link a:hover {color: #c71444;}
.client-inner-link-left {display: block; position: absolute; top: 0; right: 50%; height: 100%; margin-right: 390px; width: 100%; z-index: 5}
.client-inner-link-right {display: block; position: absolute; top: 0; left: 50%; height: 100%; margin-left: 390px; width: 100%; z-index: 5}
.client-inner-link-top {height: 130px; display: block; position: absolute; z-index: 1; width: 100%;}