@font-face {
    font-family: 'Myriad Pro';
    src: url('../fonts/myriadpro-regular12-webfont.eot');
    src: url('../fonts/myriadpro-regular12-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/myriadpro-regular12-webfont.woff') format('woff'),
         url('../fonts/myriadpro-regular12-webfont.ttf') format('truetype'); 
    font-weight: normal;
    font-style: normal;
}  
@font-face {
    font-family: 'Myriad Pro';
    src: url('../fonts/myriadpro-it-webfont.eot');
    src: url('../fonts/myriadpro-it-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/myriadpro-it-webfont.woff') format('woff'),
         url('../fonts/myriadpro-it-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'Myriad Pro';
    src: url('../fonts/myriadpro-bold-webfont.eot');
    src: url('../fonts/myriadpro-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/myriadpro-bold-webfont.woff') format('woff'),
         url('../fonts/myriadpro-bold-webfont.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

body { margin: 0; padding: 0; background: #fff; font: 16px "Myriad Pro", Arial, Helvetica; color: #333; display: flex; flex-direction: column; min-height: 100vh; }
.sprite, .pseudosprite:before { background: url(../img/sprite.png) no-repeat; }
.pseudosprite:before { content: ''; display: block; }
span.sprite { display: inline-block; vertical-align: middle; }
ul.items { margin: 0; padding: 0; list-style: none; }
ul.items > li { margin: 0; padding: 0; display: inline-block; vertical-align: top; }

.wrap { background: #fff; flex: 1 1 auto; overflow: hidden; min-width: 970px; }
.container { min-width: 970px; }
.footer { clear: both; }

.form-group { position: relative; }
.form-group .notice { position: absolute; margin-left: -100%; width: 100%; text-align: right; top: 50%; z-index: 701; pointer-events: none; }
.form-group .notice > div { line-height: 1; font-size: 11px; color: #fff; background: #c00; padding: 8px; border-radius: 3px; display: inline-block; text-align: left; margin-right: 10px; position: relative; }
.form-group .notice > div:after { content: ''; position: absolute; right: -10px; top: 50%; border: 5px solid transparent; border-left-color: #c00; margin-top: -5px; }
.form-group .notice.from-top { text-align: left; left: 3px; top: 0; margin-left: 0; }
.form-group .notice.from-top > div:after { border-color: transparent; border-top-color: #c00; margin: 0; right: auto; top: auto; bottom: -10px; left: 10px; }
.form-group .notice { transition: all 0.3s cubic-bezier(.17,.67,.08,1); transform: translate(-50px,0); opacity: 0; }
.form-group .notice.animated { transform: none; opacity: 1; }

.form-group.wi .form-control { padding-left: 38px; }
.form-group.wi i { color: #ccc; position: absolute; line-height: 30px; margin-top: -15px; left: 10px; top: 50%; font-size: 130%; }
.form-group.wi .form-control:focus:not(.filled) + i,
.form-group.wi .form-control:hover:not(.filled) + i { color: #959595; }
.form-group.wi .form-control.filled + i { color: #ff972a; }

.modal { text-align: center; }
.modal:before { display: inline-block; vertical-align: middle; content: " "; height: 100%; }
.modal .modal-dialog { display: inline-block; text-align: left; vertical-align: middle; width: 400px; }
.modal .modal-content { padding: 30px; }
.modal .modal-content .modal-title { text-align: center; padding: 0 0 30px; }
.modal .modal-content .close { position: absolute; font-size: 14px; right: 0; top: 0; line-height: 1; padding: 20px; transition: opacity 0.3s ease; }
.modal .modal-content .modal-body { padding: 0; }
.modal .modal-content .btn { width: 100%; }

.modal#response .modal-dialog { display: inline-block; width: auto; }
.modal#response .modal-body { position: static; padding: 0 20px 0 0; }

.user-content { font-size: 14px; line-height: 1.4; color: #858585; }
.user-content ul { margin: 0 0 20px; padding: 0; list-style: none; }
.user-content ul li { position: relative; padding: 0 0 3px 15px; }
.user-content ul li:before { content: '•'; position: absolute; left: 0; margin-top: 1px; }
.user-content h3 { font-weight: bold; font-size: 15px; color: #2e2e2e; margin: 25px 0 15px; }
.user-content b,
.user-content strong { color: #6a6a6a; }
.user-content a { color: #94bf0b; }

.btn { text-transform: uppercase; font-size: 14px; font-weight: bold; color: #2e2e2e; border: 0; border-radius: 40px; padding: 0.7rem 2rem; }
.btn-yellow { background: #ffda0a; background: linear-gradient(112deg, #ffe50a, #ffc80a); }
.btn-gray { background: #e8e6d7 }
.btn-gray.cycle-pager-active { background: #ffda0a; background: linear-gradient(112deg, #ffe50a, #ffc80a); }

.block-title { margin: 100px 0 40px; text-align: center; text-transform: uppercase; font: bold 30px "Arial"; }
.page-title { text-align: left; margin: 0 0 20px; }

h3 { font: bold 20px "Arial"; }

form { margin: 20px 0; }
form .line .form-group { width: 50%; display: inline-block; vertical-align: top; padding-right: 7px; }
form .line .form-group + .form-group { padding-right: 0; padding-left: 7px; }
form .btn { width: 100%; font-size: 18px; }
form .form-control { font-style: italic; }

.head { background: url(/assets/templates/img/head-gradient.png) center top repeat-x; position: relative; display: block; }
.head span { display: block; }
.head .head-image { background: url(/assets/templates/img/head-image.jpg) center top no-repeat; padding-top: 260px; }
.head .head-contacts { position: absolute; bottom: 0; width: 100%; }
.head .head-contacts .container { position: relative; }
.head .head-contacts .address { position: absolute; bottom: 15px; left: 60px; font-size: 19px; color: #c30e7b; }
.head .head-contacts .phone { color: #5c9dd6; font-weight: bold; font-size: 55px; }
.head .head-contacts .phone .sprite { width: 54px; height: 54px; background-position: 0 -246px; margin: 0 10px 5px 5px; display: inline-block; }

.head-menu { background: #9bb84a; background: linear-gradient(#bdcb45,#7ba84d); padding: 13px 0; margin: 0 0 60px; }
.head-menu .menu { margin: 0; padding: 0; list-style: none; }
.head-menu .menu li { display: inline-block; width: 20%; }
.head-menu .menu li a { display: block; margin: 0 10%; text-align: center; background: #fff; color: #d47e2f; height: 33px; line-height: 33px; border-radius: 5px; text-decoration: none; font-weight: bold; font-size: 18px; }
.head-menu .menu li.active a { background: #d47e2f; color: #fff; }


@media ( max-width: 1200px ) {
    .head .head-image { background-size: auto 220px; padding-top: 220px; }
    .head .head-contacts .address { font-size: 15px; }
    .head .head-contacts .phone { font-size: 45px; }
}

.main-cats .items { margin: 0 -10px 50px; text-align: center; }
.main-cats .items li { width: 123px; padding: 0 10px 20px; font-size: 14px; line-height: 1.2; color: #858585; }
.main-cats .items li a { color: #333; text-decoration: none; }
.main-cats .items li .sprite { width: 52px; height: 47px; margin: 0 auto 10px; }
.main-cats .items li .sprite.i12 { background-position: -60px 0; }
.main-cats .items li .sprite.i13 { background-position: -120px 0; }
.main-cats .items li .sprite.i14 { background-position: -180px 0; }
.main-cats .items li .sprite.i15 { background-position: -240px 0; }
.main-cats .items li .sprite.i16 { background-position: 0 -60px; }
.main-cats .items li .sprite.i17 { background-position: -60px -60px; }
.main-cats .items li .sprite.i18 { background-position: -120px -60px; }
.main-cats .items li .sprite.i19 { background-position: -180px -60px; }
.main-cats .items li .title { display: block; }

.main-shops { text-align: center; margin: 0 0 50px; }
.main-shops .items { margin: 0 -10px 30px; }
.main-shops .items li { width: 220px; padding: 0 10px 20px; }
.main-shops .btn { font-size: 14px; }

.main-banners { margin: 50px 0; }
.main-banners img { border-radius: 6px; }
.main-banners .ctrl { position: absolute; left: 0; top: 0; width: 100px; bottom: 0; z-index: 200; }
.main-banners .ctrl.cycle-next { left: auto; right: 0; }
.main-banners .ctrl .sprite { width: 17px; height: 32px; background-position: -270px -60px; position: absolute; top: 50%; left: 50%; margin: -16px 0 0 -8px; opacity: 0.2; }
.main-banners .ctrl.cycle-next .sprite { background-position: -240px -60px; }
.main-banners .ctrl:hover .sprite { opacity: 0.5; }

.map { height: 400px; border-radius: 6px; overflow: hidden; background: #fafafa; margin: 40px 0 0; }
.map .balloon { font: 13px Futura, Arial, Helvetica; color: #858585; text-align: center; }
.map .balloon .sprite { width: 112px; height: 41px; background-position: 0 -200px; margin: 0 auto 5px; }

.features { text-align: center; padding: 0 0 70px; margin: 80px 0 0; }
.features .items li { width: 25%; font-size: 15px; color: #858585; }
.features .items li .sprite { width: 88px; height: 74px; background-position: 0 -120px; display: block; margin: 0 auto 15px; }
.features .items li .sprite.i2 { background-position: -100px -120px; }
.features .items li .sprite.i3 { background-position: -200px -120px; }

.footer { background: url(/assets/templates/img/footer.jpg) center top #6ca90a; color: #fff; padding: 25px 0 20px; }
.footer .socials .sprite { width: 30px; height: 30px; background-position: -160px -200px; display: inline-block; margin: 7px 8px 0 0; }
.footer .socials .sprite.instagram { background-position: -120px -200px; }
.footer .menu { margin: 0; padding: 10px 0 0; list-style: none; text-align: center; }
.footer .menu li { margin: 0 13px; padding: 0; display: inline-block; }
.footer .menu li a { color: #fff; font-size: 18px; font-weight: bold; }
.footer .contacts { font-size: 13px; }
.footer .contacts .phone { color: #fff; font-size: 20px; font-weight: bold; margin: 0 0 5px; }
.footer .contacts .phone .sprite { width: 18px; height: 18px; background-position: -230px -200px; position: relative; top: -2px; margin-right: 10px; }
.footer .contacts p { margin: 0 0 5px; }
.footer .contacts .btn { margin: 5px 15px 0 0; }

.sub-page .image { margin: 0 0 6px; }
.sub-page .image img { border-radius: 3px; }
.sub-page .images .items { margin: 0 -3px; }
.sub-page .images .items li { width: 33.33333%; padding: 0 3px 6px; }
.sub-page .images .items li img { border-radius: 3px; }


.plans { width: 900px; margin: 30px auto 0; max-width: 100%; }
.plans .slide { width: 900px; max-width: 100%; }
.plans .slide img { margin-bottom: 30px; }
.plans .slide .floor-shops .item { margin: 0 0 10px; position: relative; line-height: 30px; padding-left: 50px; }
.plans .slide .floor-shops .item .num { background: #e40878; position: absolute; color: #fff; width: 30px; height: 30px; border-radius: 50%; text-align: center; line-height: 30px; font-weight: bold; left: 0; }
.plans .slide .floor-shops .item .title a { color: #333; }
.plans .slide.floor4 .floor-shops { columns: 2; -moz-columns: 2; -webkit-columns: 2; }

.plans-pager { margin: 0 -5px; }
.plans-pager > span { margin: 0 5px 10px; padding: 0.7rem 1rem; }

@media ( min-width: 1200px ) {
    .footer .menu li a { font-size: 17px; }
    .plans-pager > span { padding: 0.7rem 1.6rem; }
}

.shops-page .plans-pager { text-align: center; margin-bottom: 60px; }
.shops-page .plans { margin-bottom: 60px; }

.shop-page .image { border: 1px solid #dadbd5; border-radius: 6px; overflow: hidden; padding: 20px; }

.cats .item { margin: 0 10px 40px 0; width: 100%; display: inline-block; }
.cats .item .item-title { font: bold 25px "Arial"; color: #666; margin: 0 0 20px; }
.cats .item ul { margin: 0; padding: 0; list-style: none; }
.cats .item ul li { margin: 8px 0; padding: 0; }
.cats .item ul li a { color: #858585; font-size: 14px; }

@supports ( -moz-columns: auto ) or ( -webkit-columns: auto ) or ( columns: auto ) {
    .cats { columns: 3; -moz-columns: 3; -webkit-columns: 3; }
}

.rent-page .anketa { margin: 40px 0 60px; }
.rent-page .anketa .btn { font-size: 15px; }