html, body { width: 100%; min-width: 300px; height: 100%; color: #e7e7e7; background: #272727; font: 300 15px/18px 'Raleway', sans-serif; } * { padding: 0; margin: 0; box-sizing: border-box; -moz-border-box: border-box; transition: all 0.2s ease; -moz-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -o-transition: all 0.2s ease; } img { border: none; max-width: 100%; height: auto; } img.item-img { margin-bottom: 20px; } a { color: #3f51b5; } .kutan a, .lyfuv a { color: #fff; text-decoration: none; display: inline-block; padding: 6px 20px; } a:hover { text-decoration: none; } a:active { color: #e10008; outline: none; } h1, h2, h3, h4, h5, h6 { font-family: 'Raleway', sans-serif; padding: 0; font-weight: 300; text-transform: uppercase; line-height: 1.1em; } h1 { font-size: 32px; line-height: 36px; } h2 { font-size: 30px; line-height: 34px; } h3 { font-size: 26px; margin: 25px 6px; } h4 { font-size: 22px; } h5 { font-size: 18px; margin-bottom: 20px; } h6 { font-size: 14px; } p { line-height: 170%; margin: 20px 5px; } .ul { margin: 10px 0; color: #666; } .ul li { list-style-image: url(/templates/image/li.png); line-height: 160%; margin: 5px 0; } .ol { margin: 10px 0; color: #666; } .ol li { line-height: 160%; margin: 5px 0; } /* form */ .kyrab { display: inline-block; vertical-align: middle; text-decoration: none; color: #ed1c24; border: 3px solid #ff594f; background: transparent; padding: 10px 20px; text-transform: uppercase; font-size: 14px; cursor: pointer; border-radius: 5px; } .kyrab:hover { background: #b4113f; } .kyrab:active { color: #fff; } .btn-inverse { display: inline-block; background: #08d9d6; background: linear-gradient(to right, #08d9d6, #138994); color: #fff; font-size: 14px; line-height: 20px; text-transform: uppercase; border-radius: 4px; font-weight: 600; padding: 8px 24px; outline: none !important; border: none; } .btn-inverse:hover { background: #0cf0ed; background: linear-gradient(to right, #0cf0ed, #18a8b5); color: #fff; } .btn-inverse-lined { border: 1px solid #08d9d6; background: transparent; font-weight: 300; color: #08d9d6; } .btn-lg { padding: 16px 32px; } .h3-line { margin: 30px 0 15px; border-bottom: 1px dashed #08d9d6; font-size: 22px; font-weight: 700; } input { font: 14px/1.6 'Raleway', sans-serif; color: #616161; } input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { /* display: none; <- Crashes Chrome on hover */ -webkit-appearance: none; margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ } .japiho-file { height: auto !important; } .align-c { text-align: center; } .align-r { text-align: right; } .align-j { text-align: justify; } .hidden { opacity: 0; display: none !important; } .visible { opacity: 1; display: block; } .italic { font-style: italic; font-size: 14px; } .rub { font-weight: normal; font-style: normal; } .mr-2 { margin-right: 6px; } .w-full { width: 100%; } /* layer */ .layer { min-height: 100%; margin-bottom: -120px; } .empty { height: 120px; } .clear { clear: left; } .qipo { max-width: 1180px; margin: 0 auto; padding: 0 30px; position: relative; } .preventscroll { overflow-y: scroll; position: fixed; width: 100%; left: 0px; top: 0px; } /* header */ .kutan { margin-bottom: 10px; background: #3f51b5; border-bottom: 1px solid #2b2723; } .kutan .qipo { display: flex; flex-direction: row; padding: 15px; } .kutan .logo { flex: 1 1 auto; padding-left: 30px; z-index: 810; } .kutan .logo a { color: rgba(255, 255, 255, 0.8); text-decoration: none; font-size: 20px; font-weight: 500; line-height: 30px; } .kutan .logo .icon { display: inline-block; vertical-align: middle; position: relative; width: 2px; height: 30px; background-color: #2a8bfb; margin-right: 5px; margin-top: -4px; } .kutan .logo .icon:before { content: ''; position: absolute; left: 0; bottom: 0; display: block; width: 2px; height: 15px; background-color: #f6d106; } .kutan .logo a sup { font-size: 11px; top: -1em; left: 3px; } .kutan .lecahe-nav { flex: none; padding-right: 30px; z-index: 805; } .lecahe-nav .current { color: #fff; cursor: pointer; line-height: 30px; z-index: 806; position: relative; } .lecahe-nav .current .dashed { border-bottom: 1px dashed rgba(255, 255, 255, 0.4); } .kutan .lang-nav { flex: none; z-index: 830; } .lang-nav .item { display: inline-block; vertical-align: middle; line-height: 30px; color: #797878; padding: 0 2px; } .lang-nav a.item { color: #fff; } .lang-nav a.item:hover { color: #ff594f; } .lang-nav .line { display: inline-block; vertical-align: middle; height: 30px; border-right: 1px solid #797878; } /* location */ .location-nav-sub { opacity: 0; visibility: hidden; position: fixed; top: 0; left: 0; bottom: 0; width: 100%; background-color: #252a34; overflow-y: auto; transition: all .2s ease; z-index: 801; } .location-nav-sub.visible { opacity: 1; visibility: visible; } .location-nav-sub .qipo { display: block; padding: 0; } .location-nav-sub__top { height: 60px; position: relative; border-bottom: 1px solid rgba(255, 255, 255, 0.1); padding: 15px; } .location-nav-sub__top .location-nav-toggle { width: 40px; height: 40px; cursor: pointer; margin: -5px; padding: 5px; border-radius: 4px; background: rgba(255, 255, 255, 0); transition: all 0.2s ease; position: absolute; left: 17px; top: 15px; } .location-nav-sub__top .location-nav-toggle:hover { background: rgba(255, 255, 255, 0.3); } .location-query { position: relative; height: 65px; padding: 20px 0 0; } .location-query input { outline: 0px solid orange; width: 100%; border: none; border-bottom: 1px solid #bebebe; font-size: 18px; line-height: 20px; height: 45px; font-weight: 400; padding: 5px 10px 20px; } .location-query input:focus { border-color: #08d9d6; } #location-autocomplete { position: absolute; z-index: 2; background: transparent; } #location-autocomplete-x { color: #c1bfbf; position: absolute; background: transparent; z-index: 1; } .location-hide { position: absolute; right: 10px; bottom: 20px; cursor: pointer; z-index: 5; } #location-result { padding: 5px 0 20px; } .autocomplete-suggestions { position: relative !important; background: #FFF; cursor: default; overflow: auto; } .autocomplete-suggestion { padding: 8px 10px; font-size: 16px; line-height: 20px; cursor: pointer; color: #c1bfbf; font-weight: 400; } .autocomplete-no-suggestion { padding: 8px 10px; } .autocomplete-selected { background: #e8f4fe; } .autocomplete-suggestions strong { color: #3b3e44; font-weight: 400; } #location-suggestion {} /* main */ .main {} .main .h1 { margin: 0 0 20px; font-weight: 600; } .rydu { margin: 10px 0; line-height: 2em; } .rydu>span { display: inline-block; font-weight: 300; } .rydu a:hover { text-decoration: none; color: #3f51b5; } .rydu a { color: #f9f9f9!important; text-decoration: underline; } .rydu>span:after { content: '›'; display: inline-block; vertical-align: middle; margin: 0 4px 0 8px; } .rydu>span:last-child a { text-decoration: none; } .rydu>span:last-child:after { display: none; } /* main-cities */ .main-cities { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; /* 16px */ column-gap: 1rem; /* 16px */ row-gap: 1rem; /* 16px */ height: 300px; overflow-x: hidden; overflow-y: auto; position: relative; margin: 30px 0; border-bottom: 4px solid #e0e0e0; } /* tabs */ .tabs-wrap { background: #fff; padding: 10px 0; margin-bottom: 20px; } .tabs { font-size: 0; } .tabs .item { display: inline-block; vertical-align: top; color: #333; font-size: 16px; line-height: 20px; padding: 9px 20px; cursor: pointer; height: 40px; } .tabs .item .d { display: inline-block; border-bottom: 1px solid #333; } .tabs .item:hover .d { border: none; } .tabs .item.current { background: #ff594f; color: #fff; border-radius: 4px; } .tabs .item.current .d { border: none; } /* top-nav */ .typo { position: relative; } .typo .item { display: inline-block; font-size: 16px; line-height: 24px; margin-right: 15px; background: #3f51b5; color: #fff; margin: 4px; padding: 5px 15px; text-decoration: none; } .typo .item:hover { background: #fff; color: #3f51b5; } .typo .tohu { display: inline-block; font-size: 16px; line-height: 24px; margin-right: 15px; background: #3f51b5; color: #fff; margin: 4px; padding: 5px 15px; text-decoration: none; } .typo .tohu:hover { background: #f5f8fa; color: #3f51b5; } .typo .item .title { cursor: pointer; line-height: 20px; } .typo .item .title a { color: #333; text-decoration: none; } .typo .item .icon { margin-left: 6px; vertical-align: bottom; } .typo .item:hover .item-sub { display: block; } .typo .item .item-sub { display: none; position: absolute; width: 100%; z-index: 800; height: auto; background: #fff; box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3); border-radius: 0 0 6px 6px; padding: 20px; top: 35px; left: 0; transition: all .2s ease; } .typo .item .item-sub a { display: inline-block; width: 24%; line-height: 28px; font-size: 16px; color: #000; text-decoration: none; } .typo .item .item-sub a:hover { color: rgb(248, 61, 98); } /**/ .location-select { position: relative; font-size: 16px; line-height: 20px; width: 240px; position: absolute; right: 30px; top: 0; } .location-select .current { height: 40px; padding: 4px 0 0; cursor: pointer; } .location-select .current .icon { margin-right: 2px; } .location-select .current .d { display: inline-block; border-bottom: 1px dashed #ccc; } .location-select:hover .current .d { border-color: transparent; } .location-select .sub-nav { position: absolute; background: #fff; top: 40px; right: 0; left: 0; z-index: 200; border-radius: 0 0 4px 4px; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05); padding: 10px 0; display: none; } .location-select:hover .sub-nav { display: block; } .location-select .sub-nav .line { padding: 5px 20px 5px 40px; } /* feed */ .item { background: #111; margin: 20px auto; padding: 20px; } .feed { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; /* 16px */ column-gap: 2rem; /* 16px */ row-gap: 2rem; /* 16px */ } .feed .item { display: flex; flex-direction: row; background: #fff; box-shadow: 0 16px 24px 0 rgba(0, 0, 0, 0.14); position: relative; margin-bottom: 10px; } .feed .item-img { flex: none; width: 40%; position: relative; } .feed .item-img .preview { display: block; width: 100%; height: 240px; background: center no-repeat; background-size: cover; } .feed .item-img__bg { position: absolute; background: linear-gradient(to bottom, hsla(0, 0%, 100%, 0), hsla(0, 0%, 0%, 0.8)); top: 60%; bottom: 0; left: 0; right: 0; z-index: 20; cursor: pointer; } .feed .item-img__check { position: absolute; top: 0; left: 30px; right: 30px; background-color: #3f51b5; color: #fff; font-weight: 400; text-align: center; font-size: 12px; line-height: 23px; border-radius: 0 0 3px 3px; z-index: 21; } .feed .item-img__info { position: absolute; bottom: 10px; left: 10px; z-index: 22; color: #fff; line-height: 24px; font-size: 12px; opacity: 0.6; } .feed .item-img__info svg { vertical-align: bottom; } .feed .item-body { flex: 1 1 0%; } .feed .item-top { display: flex; flex-direction: row; border-bottom: 2px solid #e0e0e0; font-size: 12px; } .feed .item-top div:nth-child(1) { flex: 1 1 auto; padding: 10px; } .feed .item-top div:nth-child(2) { flex: none; } .feed .item-top h3 { color: ; text-transform: none; font-size: 22px; font-weight: 500; margin-bottom: 3px; } .item-butt-right { display: block; background-color: rgb(236 72 153); border-radius: 0.5rem; padding: 10px 15px; } .bg-stripes-pink { background-color: #f472b61a; background-image: linear-gradient(135deg, #ec489980 10%, transparent 0, transparent 50%, #ec489980 0, #ec489980 60%, transparent 0, transparent); background-size: 7.07px 7.07px; } .feed .item-bottom { line-height: 20px; font-size: 14px; padding: 10px; background: #eee; } .feed .item-bottom .features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 0.3em; } .feed .item-bottom a { color: #fff; } .item .item-butt { display: inline-block; font-size: 16px; line-height: 24px; background: #3f51b5; margin: 4px; padding: 10px 30px; text-decoration: none; color: #fff; font-size: 14px; text-align: center; text-transform: uppercase; } .feed .item .item-butt svg { vertical-align: middle; } .feed .item .item-butt:hover { background-color: #00707d; } .feed .item .info-phone .icon { margin-right: 10px; } .feed .item .info-phone .d { display: inline-block; border-bottom: 1px dashed #ed1c24; } .feed .item .info-phone:hover .d { border-bottom: 1px dashed transparent; } /* profile */ .profile {} .profile-item { background: #fff; box-shadow: 0 16px 24px 0 rgba(0, 0, 0, 0.14); padding: 20px; margin-bottom: 30px; overflow: hidden; display: flex; flex-direction: row; } .profile-item-left { width: 40%; flex: none; } .profile-item-right { flex: 1 1 0%; padding-left: 20px; } .profile-item .h1 { margin: 0 0 10px; text-transform: none; } .profile-item .h3 { margin: 0 0 20px; font-size: 18px; font-weight: 600; } .border-line { border-bottom: 4px solid #e0e0e0; } .profile-item__gallery { margin-bottom: 20px; } .profile-item__gallery img { display: block; aspect-ratio: 8 / 10; width: 100%; object-fit: cover; } .profile-item__features { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 0.5rem; /* 16px */ row-gap: 0; /* 16px */ margin-bottom: 20px; } .profile-item__features .item { border: 1px solid #ccc; padding: 5px; border-radius: 5px; text-align: center; } .profile-item__features .item .hint { display: block; color: #7e7e7e; font-size: 12px; } .profile-item__features .item b { font-size: 24px; line-height: 40px; } .profile-item__contact { padding: 20px 0; font-size: 14px; } .profile-item__contact:last-child { padding-bottom: 0; } .profile-item__contact .line { display: flex; flex-wrap: nowrap; margin-bottom: 15px; } .profile-item__contact .line:last-child { margin-bottom: 0; } .profile-item__contact .line .icon { width: 40px; } .profile-item__contact .line div:nth-child(2) { flex: 1 1 0%; line-height: 26px; } .profile-item__contact .line .contact-mess { display: inline-block; width: 130px; } .profile-item__contact .line .contact-mess:first-child { margin-right: 10px; } .profile-item__contact .contact-price { height: 42px; line-height: 42px; } .profile-item__contact .contact-price b { font-size: 36px; margin: 0 4px; } .contact { display: inline-block; text-decoration: none; text-align: center; font-weight: 500; border: 1px solid #3f51b5; border-radius: 1rem; padding: 0 10px; color: #3f51b5; font-size: 13px; margin-left: 10px; cursor: pointer; } .profile-item__comment { padding: 20px 0; } .profile-item__contact { padding: 20px 0; } /* service-feed */ .service-feed { display: flex; flex-wrap: wrap; } .service-feed .item { border: 1px solid #3f51b561; border-radius: 3px; text-decoration: none; padding: 4px 8px; margin: 5px; font-size: 13px; } .service-feed .item:hover { background: #3f51b5; border-color: #3f51b5; color: #fff; } /* */ .suggestion-list { font-size: 0; padding: 0; margin-bottom: 20px; } .suggestion-list li { width: 50%; display: inline-block; vertical-align: top; font-size: 13px; } /* box */ .box { background: #fff; box-shadow: 0 24px 30px 0 rgba(0, 0, 0, 0.14); } .box-login { max-width: 680px; margin: 40px auto 60px; } .box-login .butiv { margin: 0; } .box-login .butiv .col-5, .box-login .butiv .col-6 { padding: 0; } .box-login .butiv .col:last-child { padding: 30px 40px 10px; } .box-login img { display: block; max-width: 100%; } .box-login input { width: 100%; } .box-login #wFormLogin { margin-bottom: 60px; } .box-login a { font-size: 12px; color: #ff2e63; } /* account */ .tabs-wrap-account { margin-bottom: 20px; } .account-photos {} .account-photos .item { margin-bottom: 20px; } .account-photos .item .detail { position: relative; } .account-photos .item .detail-ava { position: absolute; bottom: 35px; left: 0; right: 0; background: rgba(0, 0, 0, 0.6); text-align: center; color: #fff; font-size: 13px; padding: 8px 0; height: 35px; } .account-photos .item .detail-del { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.8); text-align: center; color: #fff; font-size: 13px; padding: 8px 0; height: 35px; border-radius: 0 0 8px 8px; } .account-photos .item .detail img { display: block; border-radius: 8px; } .account-main {} .account-feed {} .account-feed__features { font-size: 12px; color: #7b7b7b; } .account-feed__features span { margin-right: 8px; display: inline-block; } .account-feed__btns {} /* .pop-alert */ .pop-alert { position: fixed; z-index: 900; bottom: 0; left: 0; right: 0; color: #fff; padding: 20px; text-align: center; opacity: 0; } .pop-alert__success { background: green; } .pop-alert__error { background: red; } .pop-alert__visible { opacity: 1; } /* popup-phone */ .popup-phone { position: fixed; left: 5px; right: 5px; bottom: -80px; z-index: 800; transition: all 300ms; opacity: 1; background: #fff; border-radius: 10px; box-shadow: 0 0 40px 0 rgb(0 0 0 / 40%); padding: 6px 10px; display: flex; flex-wrap: nowrap; } .popup-phone__info { width: 120px; } .popup-phone__name { white-space: nowrap; overflow-x: hidden; overflow-y: hidden; color: #444; line-height: 20px; font-size: 12px; margin-bottom: 4px; } .popup-phone__button { flex: 1 1 auto; padding: 0 5px; } .popup-phone__button .contact { display: block; height: 40px; margin: 0; line-height: 40px; } .popup-phone__mess { height: 40px; } .popup-phone__mess img { width: 40px; display: inline-block; } /* b-lazy */ .b-lazy { opacity: 0; } .b-lazy.b-loaded { opacity: 1; transition: opacity 300ms; } /* footer */ .lyfuv { background: #1a1a1a; min-height: 120px; } footer ul, ul#map { padding-inline-start: 0px; overflow: hidden; margin-bottom: 0; padding: 0; list-style: none; max-height: 440px; } footer ul li, ul#map li { display: inline-block; vertical-align: top; margin-bottom: 0px; list-style-type: none; } .lyfuv .qipo { padding: 30px; font-size: 13px; line-height: 20px; color: #7a7a7b; } .lyfuv a { color: #fff; border: 1px solid #fff; display: inline-block; font-size: 16px; line-height: 24px; margin: 4px; padding: 5px 15px; text-decoration: none; } .lyfuv a:hover { background: #3f51b5; border: 1px solid #3f51b5; color: #fff; } .lyfuv-nav { margin-bottom: 20px; } .lyfuv-nav a { display: inline-block; margin-right: 2em; } /* mobile */ .mob-nav { flex: none; } .mob-nav-toggle { width: 40px; height: 40px; cursor: pointer; margin: -5px; padding: 5px; border-radius: 4px; background: rgba(255, 255, 255, 0); transition: all 0.2s ease; } .mob-nav-toggle:hover { background: rgba(255, 255, 255, 0.3); } .mob-nav-sub { opacity: 0; visibility: hidden; position: fixed; top: 0; left: 0; bottom: 0; width: 100%; background-color: #252a34; overflow-y: auto; transition: all .2s ease; z-index: 800; } .mob-nav-sub.visible { opacity: 1; visibility: visible; } .mob-nav-sub .qipo { display: block; padding: 0; } .mob-nav-sub__top { height: 60px; position: relative; border-bottom: 1px solid rgba(255, 255, 255, 0.1); padding: 15px; } .mob-nav-sub__top .logo {} .mob-nav-sub__top .mob-nav-toggle { position: absolute; left: 17px; top: 15px; } .mob-nav-sub__nav {} .mob-nav-sub__nav .item { display: block; color: #fff; font-size: 20px; font-family: 'Open Sans Condensed', sans-serif; font-weight: 600; line-height: 30px; padding: 5px 30px; } .mob-nav-sub__nav .item:hover, .mob-nav-sub__nav .item:active { background: #08d9d6; background: linear-gradient(to right, #08d9d6, #138994); } .mob-nav-sub__signup { text-align: center; padding: 20px; border-top: 1px solid rgba(255, 255, 255, 0.1); } .mob-nav-sub__signup .btn { display: block; } .mob-nav-sub__signup .btn:first-child { margin-bottom: 10px; } .mob-account { display: none; position: absolute; right: 0px; top: 0px; } .mob-account-toggle {} .mob-account-toggle .img { height: 60px; background: rgba(0, 0, 0, 0.1); padding: 10px; } .mob-account-toggle .img img { display: inline-block; width: 40px; height: 40px; border-radius: 6px; } .mob-account-sub { opacity: 0; visibility: hidden; position: fixed; top: 0; left: 0; bottom: 0; width: 100%; background-color: #fff; overflow-y: auto; transition: opacity .2s ease; z-index: 800; } .mob-account-sub.visible { opacity: 1; visibility: visible; } .mob-account-sub .mob-account-toggle { position: absolute; right: 21px; top: 16px; color: #fff; font-size: 28px; } .mob-account-sub__photo { background-color: #252a34; padding: 20px; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } .mob-account-sub__photo img { display: block; width: 30%; margin: 0 auto; border-radius: 6px; } .mob-account-sub__nav {} .mob-account-sub__nav .item { display: block; color: #444; font-size: 20px; font-family: 'Open Sans Condensed', sans-serif; font-weight: 600; line-height: 30px; padding: 5px 30px; border-bottom: 1px solid #eee; } /* map */ ul.map > a { display: inline-block; line-height: 24px; padding: 8px 15px; margin: 20px auto; font-size: 16px; background: #f5f8fa; text-decoration: none; } ul.map li { list-style: none; } ul.map li a, ul.map li strong { text-decoration: none; line-height: 1.6em; } ul.map li strong { font-size: 1.4em; } /* media */ @media screen and (max-width: 1000px) { .feed .item-wrap { width: 33%; } } @media screen and (max-width: 820px) { .feed .item-wrap { width: 50%; } .tabs-wrap { text-align: center; overflow-x: auto; overflow-y: hidden; white-space: nowrap; width: 100%; } .typo .item .item-sub { position: fixed; top: 230px; left: 0; right: 0; overflow-y: auto; max-height: 300px; } .typo .item .item-sub a { display: block; width: 100%; } .location-select { position: relative; margin: 20px auto 0; } .main .h1 { font-size: 26px; line-height: 30px; } .profile>.column { max-width: 100%; flex: 0 0 100%; padding: 0 !important; } } @media screen and (max-width: 600px) { body > .qipo { margin-top: 80px; } .kutan { position: fixed; top: 0; left: 0; right: 0; z-index: 990; height: 60px; } .layer { padding-top: 60px; } .qipo { padding: 0 15px; } .kutan .qipo {} .head-account-btns, .head-account, .kutan .lecahe-nav { display: none; opacity: 0; } .mob-nav { display: block; } .mob-account { display: block; } .main .h1 { font-size: 18px; line-height: 22px; font-weight: 300; margin-bottom: 15px; } .rydu { margin: 10px 0 0; } .contai-feed { padding: 0 !important; } .feed { display: block; } .lyfuv-nav a { display: block; } .profile-item { display: block; } .profile-item-left { display: block; flex: none; width: 100%; } .profile-item-right { display: block; flex: none; padding: 0; } .border-line { margin: 0 -20px; } .service-feed .item { flex: 1; white-space: nowrap; text-align: center; } .account-photos .col-3 { flex: 0 0 50%; max-width: 50%; padding: 0 10px; } .account-photos .item .detail-ava { bottom: 40px; font-size: 20px; height: 40px; line-height: 22px; } .account-photos .item .detail-del { font-size: 20px; height: 40px; line-height: 22px; } .account-photos .detail-ava .hint, .account-photos .detail-del .hint { display: none; } .account-feed__btns .btn { display: block; margin-bottom: 10px; } .popup-phone__visible { opacity: 1; bottom: 20px; } } @media screen and (max-width: 400px) { .qipo { padding: 0 10px; } .account-main-container { padding: 0; } .feed .item-wrap { margin-bottom: 0; } .tabs .item { display: block; } } @media screen and (max-width: 600px) { .butt-send , .item .item-butt { display: block!important; float: none!important; margin-bottom: 20px!important; } } @media screen and (max-width: 460px) {} /* custom */ footer hr { margin: 20px auto; } footer p { margin: 0 auto; color: #fff; font-size: 15px; } .kyrab { display: block; padding: 10px 20px; background-color: #3f51b5; border: 1px solid #3f51b5; color: #fff; cursor: pointer; border-radius: 0 !important; text-align: center; margin: 10px auto; } .butt-send { background-color: #fff; display: inline-block; position: relative; margin: 4px; padding: 21px 90px; border: 1px solid #fff; cursor: pointer; float: right; } .butt-send::before { content: url(/img/mail-send.svg); display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 30px; height: 30px; } .butt-send:hover { background-color: #3f51b5; border: 1px solid #3f51b5; color: #fff; } .item b, span.contact { font-size: 1.4em; line-height: 1.6em; } form textarea { width: 100%; padding: 10px; } form button { cursor: pointer; width: 100%; outline: none; border: none; margin: 6px auto!important; font-size: 16px; text-transform: uppercase!important; } form input { padding: 10px 30px; width: 100%; margin-bottom: 10px; } .zyzi { font-size: 20px; margin: 0px auto 10px; font-weight: bold; } /* id */ #popup, #popup_send { position: fixed; left: 50%; top: 45%; max-width: 400px; min-width: 360px; text-align: center; background: #fff; border: 1px solid #3f51b5; border-radius: 12px; padding: 40px 20px 20px; z-index: 9999; transform: translate(-50%, -1000%); } .popup_active { transition: all 0.6s; transform: translate(-50%, -50%) !important; display: block; } #popup button, #popup_send button { display: block; border: 1px solid #3f51b5; display: inline-block; font-size: 16px; line-height: 24px; background: #3f51b5; margin: 4px; padding: 10px 30px; text-decoration: none; color: #fff; font-size: 14px; } #popup a, #popup_send a { border: 1px solid #000; display: inline-block; font-size: 16px; line-height: 24px; background: none; padding: 10px 30px; text-decoration: none; color: #000; font-size: 14px; width: 100%; margin: 10px auto } #popup .active , #popup_send .active { color: #fff; background: #3f51b5; border-color: #3f51b5; } #overlay { position: fixed; z-index: 999; left: 0; top: 0; width: 200%; height: 200%; background-color: rgba(0, 0, 0, 0.6); display: none; } #cl, #cl_send { position: absolute; color: #222; top: 0px; right: 10px; font-size: 2rem; cursor: pointer; } #popup .zyzi, #popup p, #popup_send .zyzi, #popup_send p #cl, #cl_send { color: #333; } #id { position: fixed; right: 10px; bottom: 20px; width: 130px; height: 130px; background: #3f51b5 url(/img/sex4.gif) center no-repeat; z-index: 999; border-radius: 100%; border: none; } a#id:before { content: "секс знайомства поруч"; background: #3f51b5; width: 200%; display: block; color: #fff; padding: 10px 10px; bottom: -10px; position: absolute; right: 10px; border-radius: 50pc; text-align: center; text-transform: uppercase; } #err_send { display: none; } #b5970 { display: block; font-size: 16px; line-height: 24px; background: #3f51b5; margin: 10px 4px; padding: 10px 30px; text-decoration: none; color: #fff; font-size: 14px; text-align: center; text-transform: uppercase; } ul.lecahe { margin-bottom: 20px; } ul.lecahe li a { color: #fff; border: 1px solid #fff; display: inline-block; font-size: 16px; line-height: 24px; margin: 4px; padding: 5px 15px; text-decoration: none; } ul.lecahe li a:hover { color: #fff; background: #3f51b5; border: 1px solid #3f51b5; } ul.lecahe li { display: inline-block; vertical-align: top; margin-bottom: 0px; list-style-type: none; } /* ads */ .panuvo { background: #3f51b5; padding: 20px; text-align: center; } .panuvo a { display: inline-block; max-width: 24%; } .panuvo p { color:#fff; } @media screen and (max-width: 980px) { .panuvo a { max-width: 100%; } }