/* Start:/local/templates/vip_group/template_styles.css?157234604237883*/
body {
font-family: "Fira Sans", sans-serif;
font-size: 16px;
color: #333;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: bold;
color: #236093;
}
h1 {
margin-bottom: 3rem;
font-size: 3.5rem;
}
h2 {
margin-bottom: 2rem;
font-size: 2.5rem;
}
h2.title {
margin-bottom: 3rem;
font-size: 3.5rem;
text-align: center;
}
h3 {
margin-bottom: 2rem;
font-size: 2rem;
}
html {
height: auto;
min-width: 320px;
width: auto !important;
}
body {
min-height: 100%;
position: relative;
padding: 0 !important;
}
header {
background: rgba(91, 138, 181, 0.15);
padding: 10px 0;
color: #333;
}
header h1 {
margin-bottom: 0.5rem;
color: inherit;
background: none;
font-size: 2em;
}
header .logo {
max-width: 100%;
max-width: 100%;
display: inline-block;
}
header .logo img {
width: 100%;
}
footer {
background: #13284c;
color: #fff;
bottom: 0;
left: 0;
right: 0;
padding: 20px 0;
}
footer .logo {
max-width: 100%;
display: inline-block;
}
footer .logo img {
width: 100%;
}
footer nav ul {
list-style: none;
}
footer nav ul li a {
color: inherit;
margin-bottom: 5px;
}
footer nav ul {
padding-left: 20px;
}
footer nav > ul {
margin: 0;
padding: 0;
}
header .contacts,
footer .contacts {
font-size: 18px;
text-align: right;
overflow: hidden;
}
header .contacts {
margin-top: 10px;
}
header .contacts a,
footer .contacts a {
color: inherit;
display: block;
float: right;
clear: both;
}
header .contacts i,
footer .contacts i {
font-size: 85%;
}
header .contacts .phone {
/*color: rgb(184, 49, 47);*/
font-weight: bold;
font-size: 120%;
margin-top: 10px;
}
footer .contacts .phone {
font-weight: bold;
font-size: 120%;
}
.phone-callback {
font-size: 80%;
margin-bottom: 10px;
}
footer a:hover,
footer a:focus,
footer a:active {
color: inherit;
opacity: 0.8;
}
footer .name {
margin-top: 15px;
font-family: "Fira Sans", sans-serif;
font-size: 2rem;
font-weight: bold;
}
footer .social {
text-align: right;
margin-top: 15px;
}
footer .social img {
width: 32px;
}
#menu {
background: #5b8ab5;
color: #fff;
}
#menu nav {
font-weight: 300;
display: block;
}
#menu nav .icon {
display: none;
}
#menu nav ul {
list-style: none;
margin: 0;
padding: 0;
}
#menu nav ul li {
display: inline-block;
margin-right: 25px;
padding: 10px 0;
position: relative;
}
#menu nav ul li a {
color: inherit;
padding: 5px 10px;
border-radius: 5px;
display: inline-block;
}
#menu nav a.submenu {
background: url('/local/templates/vip_group/img/menu-down.png') no-repeat right 15px;
padding-right: 25px;
}
#menu nav ul li.active > a,
#menu nav ul li a:hover,
#menu nav ul li a:focus,
#menu nav ul li a:active {
color: inherit;
background-color: rgba(255, 255, 255, 0.3);
}
#menu nav ul ul {
list-style: none;
position: absolute;
left: -9999px;
opacity: 0;
-webkit-transition: 0.25s linear opacity;
z-index: 100;
overflow: hidden;
margin-top: 7px;
}
#menu nav ul ul li {
padding-top: 0;
display: block;
text-align: left !important;
background-color: #5b8ab5;
margin-right: 0;
}
#menu nav ul ul a {
white-space: nowrap;
display: block;
padding: 5px 20px;
border-radius: 0;
}
#menu nav ul ul li:last-child {
padding-bottom: 0;
}
#menu nav ul li:hover ul {
left: 0;
top: 58px;
opacity: 1;
}
#menu nav > ul > li:hover > a {
text-decoration: underline;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
#menu nav ul li:hover ul a {
text-decoration: none;
-webkit-transition: -webkit-transform 0.075s linear;
}
#menu nav ul li:hover ul li a:hover {
text-decoration: underline;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
#content{
padding: 20px 0;
}
#content iframe {
width: 100%;
}
#content .text img,
#content .text table {
max-width: 100%;
height: auto;
}
#content,
#content text {
overflow: hidden;
}
/* ==========================================================================
Photos
========================================================================== */
.album {
width: 265px;
height: 360px;
margin: 0 20px 40px 0;
float: left;
}
.album .picture {
background: url(/local/templates/profile/img/album-back.png) no-repeat center;
width: 280px;
height: 279px;
}
.album .picture .photo-album-password {
display: none;
}
.album .picture a {
display: inline-block;
margin: 27px 0 0 30px;
position: relative;
}
.album .picture a .overlay {
background: rgba(0, 0, 0, 0.4);
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
}
.album .info {
text-align: center;
margin-top: 4px;
}
.album .info .btn {
font-size: 16px;
max-height: 80px;
}
.album .info p {
font-size: 16px;
color: #acbdbf;
margin: 10px 0 0;
}
.photo {
background-color: #ffffff;
border: 1px solid #d2dadb;
border-radius: 0;
padding: 10px;
margin: 0 40px 40px 0;
float: left;
width: 196px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
.photo:nth-child(5n) {
margin-right: 0;
}
.photo .picture a {
display: inline-block;
overflow: hidden;
width: 100%;
}
.photo .info {
margin: 10px 0 0;
color: #2c3538;
}
.photo .info .name {
font-size: 16px;
height: 46px;
display: none;
}
.photo .info p {
color: #acbdbf;
margin: 5px 0;
}
/* ==========================================================================
Photo lightbox
========================================================================== */
.modal-backdrop.in {
opacity: 0.75;
}
.modal-dialog {
margin-top: 120px;
}
h4.modal-title {
font-weight: normal;
font-size: 24px;
color: #2c3638;
}
h4.modal-title span {
font-size: 18px;
color: #8a9fa4;
}
.modal-header,
.modal-footer {
background-color: rgba(0, 0, 0, 0.7);
border: none;
}
h4.modal-title {
color: #fff;
}
.modal-header .close {
position: absolute;
right: -12px;
top: -12px;
color: #fff;
opacity: 1;
font-size: 24px;
background: rgba(0, 0, 0, 0.7);
width: 32px;
height: 32px;
border-radius: 16px;
padding: 2px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.4);
z-index: 2000;
}
.modal-content {
border: none;
background: transparent;
}
.modal-header .like {
margin-top: 3px;
}
#photo-modal .modal-body {
padding: 0;
background: rgb(51, 51, 51) url(/local/templates/vip_group/img/ajax-loader.svg) center no-repeat;
background-size: 64px 64px;
overflow: hidden;
}
#photo-modal .modal-body img {
width: 100%;
}
#photo-modal .modal-footer {
text-align: left;
}
#photo-modal .modal-dialog {
position: relative;
}
#photo-modal .modal-dialog .modal-right {
position: absolute;
left: 600px;
width: 120px;
height: 480px;
}
#photo-modal .modal-dialog .modal-right a {
width: 120px;
top: 0;
bottom: 0;
display: block;
text-align: right;
position: fixed;
z-index: 1050;
}
#photo-modal .modal-dialog .modal-left {
position: absolute;
left: -120px;
width: 120px;
height: 480px;
}
#photo-modal .modal-dialog .modal-left a {
width: 120px;
top: 0;
bottom: 0;
display: block;
position: fixed;
z-index: 1050;
}
#photo-modal .modal-body img {
cursor: pointer;
}
#photo-modal .modal-body .btn-group {
position: absolute;
right: 8px;
top: 8px;
opacity: 0.4;
}
#photo-modal .modal-body .btn-group.open,
#photo-modal .modal-body .btn-group:hover {
opacity: 1;
}
/* Ðовый диалог Ð´Ð»Ñ Ñ„Ð¾Ñ‚Ð¾Ð³Ñ€Ð°Ñ„Ð¸Ð¹ */
#photo-modal .modal-content {
border-radius: 0;
}
#photo-modal .modal-dialog {
display: flex;
align-items: center;
justify-content: center;
left: 0;
right: 0;
top: 0;
bottom: 0;
height: 100%;
margin: 0 auto;
}
#photo-modal .modal-dialog .modal-left,
#photo-modal .modal-dialog .modal-right {
height: 60px;
}
.photo-next-slide span,
.photo-prev-slide span {
top: auto;
}
#photo-modal .modal-dialog .modal-left a,
#photo-modal .modal-dialog .modal-right a {
position: static;
}
#photo-modal .modal-body {
width: 600px;
min-height: 400px;
}
@media (min-width: 1024px) {
.modal-dialog {
width: 800px;
}
#photo-modal .modal-body {
width: 800px;
}
#photo-modal .modal-dialog .modal-right {
left: 800px;
}
}
.dropdown-menu > li > a.text-danger {
color: #a94442;
}
a:active,
a:focus {
outline: none;
}
.btn-black {
background: #2c3638;
border: 1px solid #2c3638;
box-shadow: none;
color: #ffffff;
text-shadow: none;
white-space: normal;
}
.btn-black:hover {
background-color: #111719;
border: 1px solid #111719;
box-shadow: none;
color: #ffffff;
}
.btn-black:active {
background-color: #060b0d;
color: #ffffff;
box-shadow: inset 0 2px 3px rgba(0, 0, 0, .125);
}
.well {
padding: 15px 20px;
background: #e8ecec;
box-shadow: none;
border: 1px solid #d9dfdf;
border-radius: 0;
}
.well h2 {
margin: 0;
color: #232b2d;
background-color: transparent;
}
.well h2 span {
color: #8a9fa4;
font-size: 22px;
}
.well h2 i.text-muted {
font-size: 20px;
color: #8A9FA4;
}
.well .description {
margin: 4px 0 0;
font-size: 16px;
color: #8a9fa4;
}
.well input.form-control {
font-size: 16px;
}
.well .input-group .btn-default {
background-color: #ffffff;
}
.well .btn {
font-size: 16px;
height: 34px;
}
.well .btn-alt {
background-color: #f5f6f8;
}
.well .btn-alt.btn-success:hover {
background-color: #1ed085;
}
.well .btn-alt.btn-success:active {
background-color: #1aac6d;
}
/* ==========================================================================
Buttons
========================================================================== */
.btn {
white-space: normal;
word-wrap: break-word;
}
.btn:focus,
.btn:active {
outline: none;
}
.btn-default {
background: none;
border: 1px solid #d2dadb;
box-shadow: none;
color: #7f7f7f;
text-shadow: none;
}
.btn-default:hover {
background-color: #d9f9fd;
border: 1px solid #d2dadb;
box-shadow: none;
color: #0abcd6;
}
.btn-default:active {
background-color: #e7ebeb;
color: #99abae;
box-shadow: inset 0 2px 3px rgba(0, 0, 0, .125);
}
.btn-primary {
background: #0bc7e1;
border: 1px solid #0bc7e1;
box-shadow: none;
color: #ffffff;
text-shadow: none;
}
.btn-primary:hover {
background-color: #0bc7e1;
border: 1px solid #0bc7e1;
box-shadow: none;
color: #ffffff;
}
.btn-primary:active {
background-color: #098ea2;
color: #ffffff;
box-shadow: inset 0 2px 3px rgba(0, 0, 0, .125);
}
.btn-success {
background: #1ed085;
border: 1px solid #1ed085;
box-shadow: none;
color: #ffffff;
text-shadow: none;
}
.btn-success:hover {
background-color: #1ed88d;
border: 1px solid #1ED88D;
box-shadow: none;
color: #ffffff;
}
.btn-success:active {
background-color: #1aac6d;
color: #ffffff;
box-shadow: inset 0 2px 3px rgba(0, 0, 0, .125);
}
.btn-danger {
background: #d9534f;
border: 1px solid #d9534f;
box-shadow: none;
color: #ffffff;
text-shadow: none;
}
.btn-danger:hover {
background-color: #ea5954;
border: 1px solid #ea5954;
box-shadow: none;
color: #ffffff;
}
.btn-danger:active {
background-color: #c84e4a;
color: #ffffff;
box-shadow: inset 0 2px 3px rgba(0, 0, 0, .125);
}
.btn-black {
background: #2c3638;
border: 1px solid #2c3638;
box-shadow: none;
color: #ffffff;
text-shadow: none;
}
.btn-black:hover {
background-color: #111719;
border: 1px solid #111719;
box-shadow: none;
color: #ffffff;
}
.btn-black:active {
background-color: #060b0d;
color: #ffffff;
box-shadow: inset 0 2px 3px rgba(0, 0, 0, .125);
}
.btn-alt.btn-default {
background: none;
border: 1px solid #d2dadb;
box-shadow: none;
color: #b5c1c4;
text-shadow: none;
}
.btn-alt.btn-default:hover {
background-color: #d9f9fd;
border: 1px solid #d2dadb;
box-shadow: none;
color: #0abcd6;
}
.btn-alt.btn-default:active {
background-color: #e7ebeb;
color: #99abae;
box-shadow: inset 0 2px 3px rgba(0, 0, 0, .125);
}
.btn-alt.btn-success {
background: none;
border: 1px solid #d2dadb;
box-shadow: none;
color: #45a142;
text-shadow: none;
}
.btn-alt.btn-success:hover {
background-color: #1ed085;
border: 1px solid #1ed085;
box-shadow: none;
color: #ffffff;
}
.btn-alt.btn-success:active {
background-color: #1aac6d;
color: #ffffff;
box-shadow: inset 0 2px 3px rgba(0, 0, 0, .125);
}
.btn-alt.btn-danger {
background: none;
border: 1px solid #d2dadb;
box-shadow: none;
color: #d65554;
text-shadow: none;
}
.btn-alt.btn-danger:hover {
background-color: #d65554;
border: 1px solid #d65554;
box-shadow: none;
color: #ffffff;
}
.btn-alt.btn-danger:active {
background-color: #b92d2d;
color: #ffffff;
box-shadow: inset 0 2px 3px rgba(0, 0, 0, .125);
}
/* ==========================================================================
Inputs
========================================================================== */
input[type=text].form-control,
input[type=email].form-control,
input[type=password].form-control,
input[type=number].form-control,
textarea.form-control {
border: 1px solid #d2dadb;
box-shadow: none;
}
.form-horizontal .form-group .control-label {
font-weight: normal;
text-align: left;
}
.range .col-xs-5 {
width: 48%;
}
.range .col-xs-2 {
width: 4%;
padding: 0;
}
/* ==========================================================================
News
========================================================================== */
.feed-wrap,
.feed-item-wrap {
font-family: inherit;
font-size: inherit;
}
.post {
/*border: 1px solid #d8dcde;*/
padding: 15px;
border-radius: 10px;
border: 1px solid rgba(35, 96, 147, 0.15);
background-color: rgba(35, 96, 147, 0.07);
margin-bottom: 20px;
max-height: 320px;
overflow: hidden;
position: relative;
}
.post .btn-load-full {
position: absolute;
left: -1px;
bottom: -1px;
right: -1px;
border-top-left-radius: 0;
border-top-right-radius: 0;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
border-top: none;
}
.post .btn-load-full:hover,
.post .btn-load-full:focus,
.post .btn-load-full:active {
opacity: 0.9;
}
.post.full {
max-height: none;
}
.post .date {
color: #9ca0a2;
font-size: 90%;
margin-bottom: 15px;
}
.post .feed-post-text-block-inner-inner {
padding: 0;
}
.feed-wrap .col-sm-6:nth-child(2n+1) {
clear: both;
}
.feed-post-text-block-inner {
max-height: none;
max-width: none;
}
#wall {
margin: 40px 0 40px;
}
.sonet-group-create-popup-form-add-select-uf .files {
padding-bottom: 20px;
margin-bottom: 20px;
border-bottom: 1px solid #ccc;
}
.sonet-group-create-popup-form-add-select-uf .files:last-child {
padding-bottom: 0;
margin-bottom: 0;
border-bottom: none;
}
#news {
border-top: 1px solid #ccc;
background-color: rgba(19, 40, 76, 0.03);
}
#description {
padding-bottom: 20px;
}
/* ==========================================================================
Slider
========================================================================== */
#slider {
border-top: 1px solid #ccc;
background-color: rgba(19, 40, 76, 0.03);
overflow: hidden;
}
#slider .flexslider .slides li {
height: 400px;
background: no-repeat center;
background-size: cover;
}
#slider .flexslider .flex-control-nav {
bottom: 0;
}
#slider .flexslider {
margin: 0;
border: none;
}
.flex-direction-nav a {
width: 45px;
height: 45px;
}
#slider .slides li {
position: relative;
display: flex;
}
#slider .slides li .content {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
padding: 10%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
color: #333;
text-align: center;
text-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
background-color: rgba(0, 0, 0, 0.3);
}
#slider .slides li .content h3 {
margin: 0 0 20px;
color: inherit;
font-size: 48px;
}
#slider .slides li .content p {
color: inherit;
font-size: 21px;
}
.slide-preview {
height: 120px;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.slide-preview .content {
position: absolute;
left: 15px;
right: 15px;
top: 0;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
color: #333;
padding: 5px;
background-color: rgba(0, 0, 0, 0.3);
text-align: center;
}
.slide-preview .content h3 {
margin: 0 0 5px;
color: inherit;
font-size: 12px;
}
.slide-preview .content p {
color: inherit;
font-size: 7px;
}
#wall .block-header h3 {
float: left;
}
#wall .block-header .actions {
float: right;
margin-top: 15px;
}
#wall-new-message {
padding: 15px;
border-radius: 10px;
border: 1px solid rgba(35, 96, 147, 0.15);
background-color: rgba(35, 96, 147, 0.07);
margin: 0 15px 30px;
}
#wall-new-message .feed-add-post-form {
background: #fff;
}
.colorpicker-parent {
position: relative;
}
.colorpicker-parent .color {
position: absolute;
width: 20px;
height: 20px;
border: 1px solid #888;
top: 7px;
right: -5px;
z-index: 10;
}
.btn-alt.btn-success {
background: #fff;
}
/**
* Audioplayer
*/
.audioplayer {
max-width: 600px;
overflow: hidden;
margin-bottom: 15px;
}
.audioplayer .button {
width: 32px;
height: 32px;
background: no-repeat center;
background-size: cover;
float: left;
cursor: pointer;
margin-right: 8px;
}
.audioplayer .button.play {
background-image: url('/local/templates/vip_group/img/audioplayer/play.png');
}
.audioplayer .button.pause {
background-image: url('/local/templates/vip_group/img/audioplayer/pause.png');
}
.audioplayer .info {
margin: 0 8px 0 0;
float: left;
width: 80%;
width: calc(100% - 90px);
}
.audioplayer .time {
float: left;
width: 40px;
}
.audioplayer .timeline {
height: 4px;
background: rgba(0, 74, 136, 0.1);
margin-top: 4px;
position: relative;
cursor: pointer;
margin: 0;
}
.audioplayer .timeline .loaded {
position: absolute;
height: 4px;
left: 0;
top: 0;
background: rgba(0, 74, 136, 0.3);
}
.audioplayer .timeline .played {
position: absolute;
height: 4px;
left: 0;
top: 0;
background: rgba(0, 74, 136, 1);
}
.audioplayer .timeline::before {
content: none;
}
/**
* Photos on wall
*/
.image-row {
margin-right: -5px;
margin-left: -5px;
overflow: hidden;
}
.image-row + .image-row {
margin-top: 10px;
}
.image-item {
padding: 0 5px;
float: left;
}
.image-item img {
width: 100%;
}
/* ==========================================================================
Blocks
========================================================================== */
.block {
background-color: #ffffff;
border: 1px solid #d2dadb;
border-radius: 6px;
padding: 20px;
margin-bottom: 20px;
color: #333;
}
.block:last-child {
margin-bottom: 80px;
}
.block.full {
padding: 0;
}
.block .block-header {
border-bottom: 1px solid #d2dadb;
margin: -20px -20px 20px;
padding: 20px 20px 0;
}
.block .block-header h3 {
margin: 0 0 15px;
}
.block .block-footer {
background: #f5f6f8;
border-top: 1px solid #d2dadb;
margin: 20px -20px -20px;
padding: 20px;
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px;
}
.block.full .block-footer {
margin: 0;
padding: 20px 0;
}
.block .nav-tabs {
padding: 20px 20px 0;
font-size: 16px;
}
.block .nav-tabs li a {
color: #666666;
}
.block .nav-tabs li.active a {
color: #333333;
}
.block .tab-pane .form-horizontal {
padding: 40px 20px 20px;
}
.fields-list .row {
margin-bottom: 5px;
}
.fields-list .row > div:first-child {
color: #7f7f7f;
}
.fields-list h4 {
color: #002d5d;
margin: 30px 0 15px;
}
#user-list .users,
#group-list .groups {
border-right: 1px solid #d2dadb;
min-height: 320px;
}
#user-list .filter,
#group-list .filter {
padding: 20px;
}
#user-list .filter h4,
#group-list .filter h4 {
color: #232b2d;
margin: 0 0 20px;
}
.feed-wrap,
.feed-item-wrap {
color: inherit;
}
.feed-wrap .empty {
padding: 0 15px;
}
/* ==========================================================================
Users & groups lists
========================================================================== */
.user,
.group {
margin: 0 -15px;
padding: 20px 20px;
}
.user + .user,
.group + .group {
border-top: 1px solid #d2dadb;
}
.user .picture,
.group .picture {
float: left;
}
.user .picture a,
.group .picture a {
display: inline-block;
border: 1px solid #C4C6C7;
border-radius: 6px;
overflow: hidden;
}
.user .picture a img,
.group .picture a img {
width: 160px;
height: 160px;
}
.user .name,
.group .name {
padding: 5px 0;
font-weight: bold;
font-size: 18px;
margin-left: 180px;
}
.user .name a,
.group .name a {
color: #002d5d;
}
.user .name a:hover,
.group .name a:hover {
text-decoration: none;
}
.user .data,
.group .data {
margin-left: 180px;
margin-top: 10px;
}
.user .info,
.group .info {
font-size: 18px;
}
.user .actions .btn,
.group .actions .btn {
font-size: 16px;
}
.group .info .count,
.group .info .city {
color: #8a9fa4;
}
.group .info .count + .city{
margin-top: -10px;
}
.bxu-bottom-block {
position: static !important;
}
.swal2-popup {
font-size: 1.3rem;
}
#callback-button {
position: fixed;
bottom: 40px;
right: 40px;
z-index: 100;
}
@-webkit-keyframes pulse {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
opacity: 1;
}
to {
-webkit-transform: scale3d(1.8, 1.8, 1.8);
transform: scale3d(1.8, 1.8, 1.8);
opacity: 0;
}
}
@keyframes pulse {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
opacity: 1;
}
to {
-webkit-transform: scale3d(1.8, 1.8, 1.8);
transform: scale3d(1.8, 1.8, 1.8);
opacity: 0;
}
}
#callback-button .button {
width: 56px;
height: 56px;
background-color: #ab192d;
border: 2px solid #c27883;
border-radius: 100%;
position: relative;
cursor: pointer;
box-shadow: 0 0 10px #ab192d73;
}
#callback-button .button::before {
content: "";
width: 68px;
height: 68px;
border: 1px solid #c27883;
display: block;
top: -8px;
left: -8px;
border-radius: 100%;
position: absolute;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-name: pulse;
animation-name: pulse;
}
#callback-button .button i {
color: inherit;
font-size: 24px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -12px;
margin-top: -12px;
}
#callback-button .person {
position: absolute;
right: 72px;
bottom: 0;
width: 360px;
border: 2px solid #c27883;
padding: 10px;
border-radius: 10px;
background-color: #fff;
box-shadow: 0 0 10px #ab192d73;
font-size: 90%;
cursor: pointer;
}
#callback-button .person::after {
content: '';
position: absolute;
right: -22px;
bottom: 15px;
border: 10px solid transparent;
border-left: 10px solid #c27883;
}
#callback-button .person .photo {
width: 48px;
height: 48px;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
border-radius: 100%;
border: 1px solid #0000002e;
margin: 0;
float: left;
}
#callback-button .person .photo ~ .name,
#callback-button .person .photo ~ .text {
margin-left: 60px;
}
#callback-button .person .name {
font-weight: bold;
margin-bottom: 5px;
}
#callback-button .person .text {
line-height: 1.12;
}
.big-callback-form {
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 2000;
background-color: #10182078;
}
.big-callback-form .form {
width: 350px;
height: 100%;
position: absolute;
right: 0;
top: 0;
bottom: 0;
background-color: #fff;
border-left: 1px solid #ccc;
}
.big-callback-form .form-header {
border-bottom: 1px solid #ccc;
padding: 15px 20px;
position: absolute;
left: 0;
right: 0;
top: 0;
font-size: 12px;
text-align: center;
background-color: #fff;
text-transform: uppercase;
font-weight: bold;
line-height: 1;
color: #8a8a8a;
}
.big-callback-form .form-header .close {
position: absolute;
right: 20px;
top: 12px;
}
.big-callback-form .form-footer {
border-top: 1px solid #ccc;
padding: 15px 20px;
position: absolute;
left: 0;
right: 0;
bottom: 0;
font-size: 12px;
text-align: center;
background-color: #fff;
line-height: 1;
color: #8a8a8a;
}
.big-callback-form .form-footer a {
position: relative;
}
.big-callback-form .form-footer a::after {
content: "";
background-position: center;
background-size: cover;
background-repeat: no-repeat;
width: 24px;
height: 24px;
display: inline-block;
background-image: url('/local/templates/.default/img/favicon.png');
position: absolute;
right: -27px;
top: -7px;
}
.big-callback-form .form-body {
overflow-y: auto;
height: 100%;
height: calc(100% - 86px);
margin: 43px 0;
padding: 25px;
line-height: 1.2;
}
.big-callback-form .form-control {
border-radius: 0;
min-width: 100%;
background-color: #f9f9f9;
font-size: 16px;
}
.big-callback-form textarea {
resize: none;
}
.big-callback-form .form-body h3 {
text-align: center;
}
.big-callback-form .form-body h3 + p {
margin-bottom: 50px;
font-size: 12px;
}
.big-callback-form .form-body .form-group {
margin-bottom: 20px;
}
.big-callback-form .form-body .form-group.has-error .form-control {
border-color: #843534;
background-color: rgba(132, 53, 52, 0.16);
}
.big-callback-form .form-body button {
margin: 0 auto;
display: block;
text-transform: uppercase;
font-size: 14px;
padding: 12px 25px;
border-radius: 0;
margin-top: 30px;
}
.big-callback-form .form-body .alert {
border-radius: 0;
background-image: none !important;
margin-bottom: -10px;
padding: 10px 15px;
}
/**
* Mobile
*/
@media (max-device-width: 767px) {
.container {
width: auto;
}
header img {
max-width: 100%;
}
header .container .row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
header .container .row .col-lg-2 {
order: 2;
flex-direction: column;
flex-basis: 20%;
height: 50px;
}
header .container .row .col-lg-7 {
order: 1;
flex-direction: column;
flex-basis: 100%;
margin-bottom: 10px;
text-align: center;
}
header .container .row .col-lg-3 {
order: 3;
flex-direction: column;
flex-basis: 75%;
display: table;
height: 50px;
}
header .container .row .col-lg-3 .contacts {
display: table-cell;
vertical-align: middle;
}
header .logo {
margin: 0 !important;
max-height: 50px;
}
header .logo img {
max-height: 50px;
width: auto;
max-width: 100%;
}
header h1,
header .contacts,
header .contacts .phone {
margin-top: 0;
}
header .contacts .email {
display: none;
}
header .contacts .phone {
font-size: 100%;
}
#menu nav .icon {
display: block;
color: inherit;
padding: 10px 15px;
margin: 0 -15px;
border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
#menu nav .icon:hover,
#menu nav .icon:focus,
#menu nav .icon:active {
text-decoration: none;
}
#menu nav ul {
display: none;
}
#menu nav ul.visible {
display: block;
}
#menu nav ul li {
display: block;
margin: 0 -15px;
padding: 0;
}
#menu nav ul li a {
display: block;
padding: 5px 15px;
background-color: transparent;
border-radius: 0;
}
#menu nav ul li > a:hover,
#menu nav ul li > a:focus,
#menu nav ul li > a:active,
#menu nav ul li.active > a {
background: rgba(255, 255, 255, 0.3);
text-decoration: none;
}
#menu nav a.submenu {
background: none;
}
#menu nav ul ul {
position: static;
opacity: 1;
margin-top: 5px !important;
}
#menu nav ul ul li > a {
padding-left: 45px;
}
#menu nav ul li.pull-right {
float: none !important;
}
#menu nav ul li span.hidden {
display: inline !important;
}
footer {
position: static;
padding: 15px 0;
}
footer .col-lg-2 {
margin-bottom: 15px;
overflow: hidden;
}
footer .col-lg-2 .logo {
max-width: 50px;
float: left;
}
footer .col-lg-2 .name {
margin-top: 0;
}
footer .col-lg-3 nav {
margin-bottom: 15px;
}
footer .col-lg-2 .name,
footer .col-lg-2 .description {
margin-left: 60px;
}
footer .contacts,
footer .social {
text-align: left;
}
header .contacts a,
footer .contacts a {
float: none;
}
#slider .flexslider .slides li {
height: 320px;
}
#slider .slides li .content h3 {
font-size: 32px;
}
#slider .slides li .content p {
font-size: 16px;
}
.slide-preview {
margin-bottom: 20px;
}
main {
padding-bottom: 0 !important;
}
#wall .btn-load-more {
margin: 0 15px;
width: calc(100% - 30px);
}
#user-list .block-content {
display: flex;
flex-direction: column;
}
#user-list .block-content .users {
order: 2;
width: 100%;
padding: 0;
border-right: none;
}
#user-list .block-content .filter {
order: 1;
width: 100%;
padding: 0;
border-bottom: 1px solid #d2dadb;
}
#user-list .block-content .filter .form-control {
padding: 6px;
}
.user .picture a img,
.group .picture a img {
width: 60px;
height: 60px;
}
.user .name,
.group .name {
margin-left: 80px;
}
.user .data,
.group .data {
margin-left: 80px;
margin-top: 0;
}
.block {
border: none;
padding: 0;
}
.well .row {
display: flex;
flex-direction: column;
}
.well .row > div {
width: 100%;
}
.well .input-group {
margin-top: 10px;
}
.well .btn {
margin-top: 10px;
}
.well .btn.pull-right {
float: none !important;
}
.well .btn-group.pull-right {
float: none !important;
}
.user,
.group {
margin: 15px 0 0;
padding: 0;
}
.user .name,
.group .name {
font-size: 90%;
}
.user .info,
.group .info {
font-size: 90%;
}
.page.container > .col-xs-12 {
padding: 0;
}
div.bx-html-editor {
min-width: auto !important;
}
.bxhtmled-area-cnt,
.bxhtmled-iframe-cnt {
width: auto !important;
height: auto !important;
left: 0;
right: 0;
bottom: 0;
}
.bxhtmled-area-cnt {
left: -5px;
}
.bxhtmled-top-bar-wrap {
display: inline;
}
.block-footer .col-xs-offset-4 {
margin-left: 0;
width: 100%;
}
#vip-settings .form-group .col-sm-8 .row > div {
float: none;
width: 100%;
}
.photos {
display: flex;
flex-wrap: wrap;
}
.photo {
width: calc((100% - 21px) / 3);
margin: 0 10px 10px 0;
padding: 0;
overflow: hidden;
}
.photo .picture a {
display: block;
}
.photo .picture img {
width: 100%;
}
.photo .info {
display: none;
}
.photo:nth-child(5n) {
margin-right: 10px;
}
.photo:nth-child(3n) {
margin-right: 0;
}
.bx-viewer-wrap-outer {
top: 5% !important;
left: 5% !important;
right: 5% !important;
bottom: 5% !important;
}
.bx-viewer-wrap-inner {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.bx-viewer-wrap {
height: 100% !important;
width: auto !important;
display: table;
}
.bx-viewer-cap-wrap {
display: table-cell;
vertical-align: middle;
}
.bx-viewer-wrap img {
height: auto !important;
width: 100% !important;
}
.bx-viewer-prev-outer,
.bx-viewer-next-outer {
z-index: 20;
top: 10%;
bottom: 10%;
height: 80%;
}
.bx-viewer-close {
z-index: 30;
}
.bx-viewer-wrap-loading {
width: 100% !important;
}
.bxu-start-block-spacer-img {
min-height: 200px;
}
.bxu-start-block-cont {
top: -7% !important;
}
.bxiu-notice-form {
padding: 0 10px;
font-size: 12px;
}
#photo-modal .modal-dialog .modal-left,
#photo-modal .modal-dialog .modal-right {
display: none;
}
#photo-modal .modal-content {
width: 100%;
}
h4.modal-title {
font-size: 16px;
}
h4.modal-title span {
font-size: 12px;
}
.modal-header,
.modal-footer {
padding: 8px 10px;
}
.modal-footer {
font-size: 14px;
}
#photo-modal .modal-body {
min-height: auto;
}
#photo-modal .modal-content {
border: none;
display: flex;
justify-content: center;
flex-direction: column;
height: 100%;
}
#photo-modal .modal-body {
width: 100%;
height: 85%;
height: calc(100% - 67px);
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
}
.modal-header .close {
border-radius: 0;
box-shadow: none;
top: 0;
right: 0;
width: 39px;
height: 39px;
background: transparent;
color: #fff;
}
.modal.fade .modal-dialog {
transform: none;
transition: none;
}
.modal.in .modal-dialog {
transform: none;
}
.album {
margin: 0 auto 20px;
float: none;
}
}
@media (max-device-width: 480px) {
#callback-button {
bottom: 8px;
right: 8px;
}
#callback-button .person {
bottom: 72px;
right: 0;
width: 305px;
}
#callback-button .person::after {
border-left-color: transparent !important;
border-top: 10px solid #c27883;
right: 16px;
bottom: -22px;
}
#callback-button .person .photo ~ .name,
#callback-button .person .photo ~ .text {
margin-left: 0;
text-align: center;
}
#callback-button .person .photo {
float: none;
margin: 0 auto 10px;
width: 64px;
height: 64px;
}
@-webkit-keyframes pulse {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
opacity: 1;
}
to {
-webkit-transform: scale3d(1.4, 1.4, 1.4);
transform: scale3d(1.4, 1.4, 1.4);
opacity: 0;
}
}
@keyframes pulse {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
opacity: 1;
}
to {
-webkit-transform: scale3d(1.4, 1.4, 1.4);
transform: scale3d(1.4, 1.4, 1.4);
opacity: 0;
}
}
.big-callback-form .form {
width: 100%;
border-left: none;
}
.big-callback-form .form-body {
padding: 20px;
}
.big-callback-form .form-body h3 {
margin: 0 0 10px;
}
.big-callback-form .form-body h3 + p {
margin-bottom: 15px;
}
.big-callback-form label,
.big-callback-form .form-control {
font-size: 14px;
}
.big-callback-form textarea {
height: 80px;
}
.big-callback-form .form-body .form-group {
margin-bottom: 10px;
}
.big-callback-form .form-body button {
margin-top: 10px;
}
.big-callback-form .form-body .alert {
margin-bottom: 10px;
}
}
/* End */
/* /local/templates/vip_group/template_styles.css?157234604237883 */