@font-face { font-family: 'CuprumFFURegular'; src: url('../../fonts/CuprumFFU/Regular/font.eot'); src: url('../../fonts/CuprumFFU/Regular/font.eot?#iefix') format('embedded-opentype'), url('../../fonts/CuprumFFU/Regular/font.woff') format('woff'), url('../../fonts/CuprumFFU/Regular/font.ttf') format('truetype'), url('../../fonts/CuprumFFU/Regular/font.svg#cuprumffuregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'CuprumFFURegular'; src: url('../../fonts/CuprumFFU/Regular/font.eot'); src: local('☺'), url('../../fonts/CuprumFFU/Regular/font.woff') format('woff'), url('../../fonts/CuprumFFU/Regular/font.ttf') format('truetype'), url('../../fonts/CuprumFFU/Regular/font.svg') format('svg'); font-weight: normal; font-style: normal; } @CuprumFFURegular: CuprumFFURegular, Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif; @CompactRegular: CompactRegular, CuprumFFURegular, "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif; @import 'presets.less'; .main.layout { .relative(1); background: #fbebe1; } header.layout { .path-top { .relative(2); background: #FFFFFF url('../../images/bg/head-top-new.png') no-repeat 50% 0; min-height: 211px; .logo { .absolute(); top: 20px; left: 62px; } .slogan { .absolute(); top: 11px; right: 60px; background: url('../../images/bg/slogan.png') no-repeat 0 0; width: 255px; height: 99px; } .address { .relative(); float: right; margin: 22px 68px 0 0; min-width: 185px; word-spacing: 3px; font-size: 35px; font-family: @CuprumFFURegular; text-align: right; padding-left: 23px; .link { clear: both; float: right; &:hover { text-decoration: none; } &.phone { &:before { background-position: 0 0; } } &.email { &:before { background-position: -23px 0; margin-top: 5px; } } } } } .main-menu { .relative(1); text-align: center; &:after { content: ''; display: block; height: 1px; background-color: #ffeadb; } .list { .relative(1); background-color: #FFFFFF; } .item { display: inline-block; font-family: @CompactRegular; font-size: 23px; margin-left: 32px; &:first-child { margin-left: 0; } &:hover, &.active { > .link { color: #9e0b0f; text-decoration: none; &:after { border-bottom-color: #9e0b0f; } } } > .link { .relative(); display: block; line-height: 48px; height: 44px; -webkit-transition: color .6s ease-out; transition: color .6s ease-out; &:after { .absolute(); content: ''; top: 100%; left: 0; width: 100%; border-bottom: 2px solid transparent; -webkit-transition: border-bottom-color .6s ease-out; transition: border-bottom-color .6s ease-out; } } } } .main-slider { margin: 27px 65px; overflow: hidden; padding-bottom: 10px; &:after { content: ''; display: block; height: 1px; background-color: #1c1564; margin-top: 51px; } .container-slider { width: 924px; margin: 0 auto; overflow: hidden; } .item { float: left; width: 270px; margin-left: 38px; .link { display: inline-block; .relative(); .picture { .relative(1); } } .description { margin-top: 15px; color: #1b1564; .container { padding: 0 3px; .title { text-transform: uppercase; font-size: 20px; font-weight: bold; } .intro { display: block; font-size: 14px; } } .price { display: block; color: #9d0b0e; font-size: 24px; font-weight: bold; .sum { margin: 0 4px; .sum-description { font-size: 18px; color: #000; } } } } } .bx-wrapper { .bx-viewport { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; border: 0; left: auto; background: none; } .bx-controls-direction a { margin-top: -30px; width: 45px; height: 60px; background: #9e0a0f url('../../images/icons/elements.png') no-repeat 0 -31px; -webkit-transition: background-color .6s ease-out; transition: background-color .6s ease-out; &:hover { background-color: #464646; } &.bx-prev { background-position: 0 -31px; left: -80px; } &.bx-next { background-position: -45px -31px; right: -80px; } } .item { margin: 0; } } } } .container.layout { overflow: hidden; .content.layout { padding: 10px 68px 36px; overflow: hidden; .gallery { .picture { margin: 0 18px 18px 0; } } .last-events { .relative(); margin: 37px 0 25px; padding: 10px 0 0; border-top: 1px solid #999999; border-bottom: 1px solid #999999; .columns { margin-top: 24px; .column { font-size: 18px; line-height: 1em; width: 26%; margin-left: 11%; .date { .relative(); color: #525252; text-transform: uppercase; display: block; padding-left: 20px; &:before { .absolute(); content: '\2192'; left: 0; top: 2px; font-size: 16px; } } .sub-title { font-size: 20px; margin-top: 15px; display: inline-block; } } } .all-events { .absolute(); top: 13px; right: 20px; text-transform: uppercase; color: #464646; font-size: 14px; text-decoration: underline; &:after { .absolute(); content: '\2192'; right: -16px; top: -1px; } &:hover { text-decoration: none; } } } .objects { .items { font-size: 0; .item { width: 233px; text-align: center; display: inline-block; font-size: 18px; vertical-align: top; margin: 0 28px 28px 0; .picture { max-width: 100%; -webkit-box-shadow: 4px 4px 10px 1px rgba(0,0,0,.4); box-shadow: 4px 4px 10px 1px rgba(0,0,0,.4); -webkit-transition: box-shadow .4s ease-out; transition: box-shadow .4s ease-out; &:hover { -webkit-box-shadow: 4px 4px 0 0 rgba(0,0,0,0); box-shadow: 4px 4px 0 0 rgba(0,0,0,0); } } .options { text-align: left; min-height: 60px; margin-top: 25px; padding: 0 0 0 2px; color: #1b1464; font-size: 14px; .name { font-family: @CompactRegular; font-size: 20px; text-transform: uppercase; max-height: 56px; overflow: hidden; &.short { max-height: 28px; text-overflow: ellipsis; white-space: nowrap; } } .intro { overflow: hidden; text-overflow: ellipsis; max-height: 40px; } } } } } .catalog { margin-top: 10px; .objects { margin-top: 30px; .items { .item { .options { .name { text-transform: none; text-align: center; } } } } } .picture { border-color: #f0f0f0; } } .catalog__item { margin-top: 56px; .container.layout-2 { overflow: hidden; padding-bottom: 10px; .picture { float: left; width: 510px; margin-right: 50px; -webkit-box-shadow: 4px 4px 10px 1px rgba(0, 0, 0, 0.4); box-shadow: 4px 4px 10px 1px rgba(0, 0, 0, 0.4); } .intro { overflow: hidden; font-family: CuprumFFURegular, Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 16px; line-height: 1.2em; .title { color: #9e0a0f; font-size: 36px; margin-bottom: 26px; } .options { .option { margin-top: 18px; &:first-child { margin-top: 0; } .name { float: left; width: 240px; margin-right: 10px; } .value { display: block; overflow: hidden; } } } .notice { margin-top: 40px; &:before { content: '*'; } } } } .gallery { margin-top: 55px; .picture { -webkit-box-shadow: 4px 4px 10px 1px rgba(0, 0, 0, 0.4); box-shadow: 4px 4px 10px 1px rgba(0, 0, 0, 0.4); -webkit-transition: box-shadow 0.4s ease-out; transition: box-shadow 0.4s ease-out; &:hover { -webkit-box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0); box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0); } } .item { margin: 0 22px 22px 0; } } } .contacts { .map { .sizing(content-box); float: left; width: 500px; height: 300px; padding: 9px; background-color: #f0f0f0; -webkit-box-shadow: 4px 4px 10px 1px rgba(0,0,0,.4); box-shadow: 4px 4px 10px 1px rgba(0,0,0,.4); margin-right: 40px; } .info { overflow: hidden; a { color: #9d0b0e; &[href^="tel"] { color: #464646; &:hover { color: #464646; text-decoration: none; } } } } } .news { h1 { padding-left: 30px; } .items { .item { margin-top: 40px; &:first-child { margin-top: 0; } .picture { float: left; margin-right: 60px; -webkit-box-shadow: 4px 4px 10px 1px rgba(0, 0, 0, 0.4); box-shadow: 4px 4px 10px 1px rgba(0, 0, 0, 0.4); -webkit-transition: box-shadow 0.4s ease-out; transition: box-shadow 0.4s ease-out; &:hover { -webkit-box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0); box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0); } } .intro { overflow: hidden; .title { color: #9e0a0f; text-transform: none; a { color: #9e0a0f; } } } } } } } .catalog-menu { .relative(1); margin-top: 25px; font-size: 0; padding: 0 68px 65px; &:after { .absolute(1); content: ''; width: 100%; height: 44px; background-color: #FFFFFF; -webkit-box-shadow: 0 -4px 30px 2px rgba(0, 0, 0, 0.4); box-shadow: 0 -4px 30px 2px rgba(0, 0, 0, 0.4); bottom: 0; left: 0; } .item { width: 301px; display: inline-block; vertical-align: top; margin: 10px 0 46px 42px; font-size: 20px; text-transform: uppercase; &:nth-child(3n+1) { } &.special { .name { .link { color: #9d0a0f; .relative(); &:hover { border-bottom-color: #9d0a0f; } &:before, &::after { .absolute(1); content: '*'; top: 50%; line-height: .5em; } &::after { right: -10px; } &::before { left: -10px; } } } } .container.layout-2 { .relative(1); .picture { .relative(1); } } .name { font-family: @CompactRegular; margin-top: 10px; word-spacing: 3px; .link { border-bottom: 1px solid transparent; .text-link { .relative(1); top: .1em; } &:hover { text-decoration: none; border-bottom-color: #1b1564; } } .number { font-size: 24px; line-height: 32px; vertical-align: bottom; } } } .picture { border-color: #f0f0f0; } } } footer.layout { .relative(); border-top: 1px solid #969696; padding: 10px 0 100px; margin: 0 62px 0 62px; text-align: center; .logo { .absolute(); top: 17px; left: 10px; } .social-icons { .absolute(); top: 15px; right: 0; font-size: 0; .item { display: inline-block; width: 36px; height: 36px; margin-left: 15px; background: url('../../images/icons/social.png') no-repeat 0 -100px; &:first-child { margin-left: 0; } &.odn { background-position: 0 0; } &.fb { background-position: -36px 0; } &.vk { background-position: -72px 0; } } } .foot-menu { margin-top: 24px; font-size: 0; .item { display: inline-block; text-transform: uppercase; padding: 0 6px; font-size: 15px; border-left: 1px solid #464646; &:first-child { margin-left: 0; border-left: 0; } .link { color: #464646; } } } .about { font-size: 16px; margin-top: 10px; line-height: 1em; color: #888a8b; } a[href^="tel"] { color: #888a8b; text-decoration: none; &:hover { text-decoration: none; } } } #title-slider{ font-size: 30px; font-weight: bold; padding: 20px 90px 20px; }