.mdi::before {
  font-size: 24px;
  line-height: 14px;
}
.btn .mdi::before {
  position: relative;
  top: 4px;
}
.btn-xs .mdi::before {
  font-size: 18px;
  top: 3px;
}
.btn-sm .mdi::before {
  font-size: 18px;
  top: 3px;
}
.dropdown-menu .mdi {
  width: 18px;
}
.dropdown-menu .mdi::before {
  position: relative;
  top: 4px;
  left: -8px;
}
.nav .mdi::before {
  position: relative;
  top: 4px;
}
.navbar .navbar-toggle .mdi::before {
  position: relative;
  top: 4px;
  color: #FFF;
}
.breadcrumb .mdi::before {
  position: relative;
  top: 4px;
}
.breadcrumb a:hover {
  text-decoration: none;
}
.breadcrumb a:hover span {
  text-decoration: underline;
}
.alert .mdi::before {
  position: relative;
  top: 4px;
  margin-right: 2px;
}
.input-group-addon .mdi::before {
  position: relative;
  top: 3px;
}
.navbar-brand .mdi::before {
  position: relative;
  top: 2px;
  margin-right: 2px;
}
.list-group-item .mdi::before {
  position: relative;
  top: 3px;
  left: -3px;
}
:root {
  --fc-button-bg-color: #9b2621;
  --fc-button-hover-bg-color: #6d0015;
  --fc-button-border-color: #9b2621;
  --fc-button-hover-border-color: #6d0015;
}
::-moz-placeholder {
  font-size: 12px;
  font-weight: 300;
  color: #999;
  line-height: 24px;
}
:-ms-input-placeholder {
  font-size: 12px;
  font-weight: 300;
  color: #999;
  line-height: 24px;
}
::placeholder {
  font-size: 12px;
  font-weight: 300;
  color: #999;
  line-height: 24px;
}
@media (max-width: 768px) {
  ::-moz-placeholder {
    font-size: 11px;
  }
  :-ms-input-placeholder {
    font-size: 11px;
  }
  ::placeholder {
    font-size: 11px;
  }
}
@media (max-width: 550px) {
  ::-moz-placeholder {
    font-size: 10px;
  }
  :-ms-input-placeholder {
    font-size: 10px;
  }
  ::placeholder {
    font-size: 10px;
  }
}
/*
body {
	padding: 0;
	width: 100%;
	overflow: overlay;
	&::-webkit-scrollbar {
		display: initial;
	}
	&::-webkit-scrollbar:window-inactive {
		display: none;
	}
}

* {
	&::-webkit-scrollbar {
		width: 8px;
		height: 8px;
		background: transparent;
		//display: none;
	}
	&::-webkit-scrollbar-track {
		//background: #ddd;
		background: transparent;
	}

	&::-webkit-scrollbar-thumb {
		background: rgba(0,0,0,.2);
		opacity: .8;
		.border-radius(4px);
	}
	&:hover {
		&::-webkit-scrollbar {
			display: initial;
		}
	}
}

*.scrollbarVisible {
	&::-webkit-scrollbar {
		display: initial;
	}
}

*/
.noselect {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.clf:after {
  content: "";
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
.text-ellipsis {
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
}
#app {
  margin: 0 auto;
  background: #efefef;
}
#app > .navbar > .container {
  opacity: 0;
}
body {
  font-size: 13px;
}
body.loaded #app > .navbar > .container {
  opacity: 1;
}
.form-control {
  font-size: 13px;
  line-height: 1.1;
  padding: 0 6px;
  height: calc(1.6em + 0.50rem + 2px);
}
.form-control:focus,
.form-control.focus {
  outline: 0;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}
select,
select.form-control {
  height: 30px;
  border: 1px solid #eee;
}
textarea.form-control {
  min-height: 100px;
}
.form-control-hint {
  padding: 6px 0;
  font-size: 10px;
  color: #666;
}
.form-control-hint.notRequired {
  font-size: 13px;
  font-weight: 700;
  color: #006600;
}
.navbar {
  color: #fff;
  background: #6f0014;
  background: -webkit-gradient(left top, left bottom, color-stop(0%, #6f0014), color-stop(78%, #9b031f), color-stop(100%, #9b031f));
  background: linear-gradient(to bottom, #6f0014 0%, #9b031f 78%, #9b031f 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#6f0014", endColorstr="#9b031f", GradientType=0);
  padding: 0;
  height: 53px;
  position: fixed;
  width: 100%;
  z-index: 101;
  top: 0;
}
.navbar .container {
  flex-wrap: unset;
}
.navbar.navbar-dark .navbar-toggler {
  color: #ddd;
  border: none;
  outline: 0;
  padding: 16px 1rem 16px 5px;
}
.navbar.navbar-dark .navbar-toggler.right {
  display: none;
}
@media (max-width: 760px) {
  .navbar.navbar-dark .navbar-toggler.right {
    display: block;
  }
}
.navbar .navbar-nav {
  flex-direction: row;
}
.navbar .navbar-nav a.nav-link,
.navbar .navbar-nav a.nav-link:visited {
  color: #fff;
  border: 1px solid #b65364;
  background: #6f0014;
  border-radius: 0.25rem;
  padding: 0.5rem;
  margin: 0 0.25rem;
}
.navbar .navbar-nav a.nav-link.reg,
.navbar .navbar-nav a.nav-link:visited.reg {
  color: #fff;
  border: 1px solid #cb8994;
  background: #b65364;
}
.navbar .navbar-brand {
  background: url(/images/logo.png?43f50b63e5a771fa647d74a14216fe93) no-repeat;
  display: inline-block;
  width: 228px;
  height: 50px;
  background-size: contain;
  background-position: left center;
  display: none;
}
.navbar .navbar-brand.nouser {
  display: inline-block;
}
@media (max-width: 768px) {
  .navbar .navbar-brand {
    height: 38px;
  }
}
.navbar .navbar-icon {
  width: 40px;
  height: 40px;
  cursor: pointer;
  display: block;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 20px 20px;
  transition: all 0.15s;
  line-height: 40px;
  text-align: center;
  /*&.navbar-notif {
            //background-image: url("../img/icons/top-bell.svg");
            background-image: url("../img/icons/megaphone-7.svg");
        }

        &.navbar-message {
            //background-image: url("../img/icons/top-envelope.svg");
            background-image: url("../img/icons/chat-2.svg");
        }

        &.navbar-bog {
            //background-image: url("../img/icons/top-envelope.svg");
            //background-image: url("../img/bog.svg");
        }

        &.navbar-friend {
            //background-image: url("../img/icons/top-friends.svg");
            background-image: url("../img/icons/users.svg");
        }

        &.navbar-online {
            //background-image: url("../img/icons/top-globe.svg");
            background-image: url("../img/icons/globe-6.svg");
        }

        &.navbar-dates {
            //background-image: url("../img/icons/top-dash.svg");
            background-image: url("../img/icons/time-1.svg");
        }

        &.navbar-nudges {
            //background-image: url("../img/icons/top-flash.svg");
            background-image: url("../img/icons/cursor-30.svg");
        }

        &.navbar-settings {
            //background-image: url("../img/icons/top-flash.svg");
            background-image: url("../img/icons/gear-4.svg");
        }*/
}
.navbar .navbar-icon .badge {
  position: relative;
  color: #fff;
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  background: #f00;
  padding: 0;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  border-radius: 50%;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
  float: right;
  margin-left: -30px;
  transition: transform 0.5s;
  transform-origin: center;
}
.navbar .navbar-icon .badge:empty {
  transform: scale(0);
}
.navbar .navbar-icon .badge.animate {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
  transform-origin: center bottom;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}
.navbar .navbar-icon .badge.gmessage {
  background: #826fd0;
  margin-top: 20px;
}
.navbar .navbar-icon i.i {
  font-size: 22px;
  color: #fff;
  line-height: 40px;
  width: 40px;
  text-align: center;
  display: inline-block;
}
.navbar .navbar-icon .svgIcon {
  height: 30px;
  width: 30px;
  display: inline-block;
}
.navbar .navbar-icon .svgIcon .svgIconPath {
  fill: #fff;
}
.navbar .navbar-icon:hover {
  background-color: rgba(0, 0, 0, 0.1);
}
.navbar .navbar-icon:hover i.i {
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
}
.navbar .navbar-icon:hover .svgIcon {
  filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.4));
}
.navbar #topSearchForm {
  width: 0;
}
.navbar .popupTopSearchPopup {
  display: block;
}
.navbar #topSearchFormPopup {
  padding: 5px;
}
.navbar input.topSearch {
  display: none;
  max-width: 100%;
  margin: 0;
  height: 32px;
  float: left;
}
.navbar button.topSearch {
  display: none;
  border: none;
  border-left: 1px solid #aaa;
  width: 50px;
  height: 25px;
  background: url(/images/search-icon.svg?63f5170c7311e752cf774dbc22f0f82a) no-repeat center;
  margin: 3px 0 0 -50px;
}
.navbar input.topSearchPopup {
  max-width: 100%;
  margin: 0;
  height: 32px;
  float: left;
}
.navbar button.topSearchPopup {
  border: none;
  border-left: 1px solid #aaa;
  width: 50px;
  height: 25px;
  background: url(/images/search-icon.svg?63f5170c7311e752cf774dbc22f0f82a) no-repeat center;
  margin: 3px 0 0 -50px;
}
.navbar.navbar-sec {
  color: #9b031f;
  background: #fff;
  padding: 0;
  height: 50px;
  transition-duration: 0.2s;
  position: fixed;
  top: 53px;
  width: 100%;
  z-index: 100;
  display: none;
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);
}
.navbar.navbar-sec.top {
  top: 0;
}
.navbar.navbar-sec .navbar-icon {
  width: 50px;
  height: 50px;
  cursor: pointer;
  display: block;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 20px 20px;
  transition: all 0.15s;
  border-bottom: 4px solid transparent;
}
.navbar.navbar-sec .navbar-icon i.i {
  font-size: 22px;
  color: #999;
  line-height: 50px;
  width: 50px;
  text-align: center;
  display: inline-block;
}
.navbar.navbar-sec .navbar-icon:hover {
  background-color: transparent;
}
.navbar.navbar-sec .navbar-icon:hover i.i {
  color: #9b031f;
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
}
.navbar.navbar-sec .navbar-icon.active {
  border-bottom-color: #9b031f;
}
.navbar.navbar-sec .navbar-icon.active i.i {
  color: #9b031f;
}
.countBadge {
  position: absolute;
  color: #fff;
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  background: #f00;
  padding: 0;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  border-radius: 50%;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
  right: -10px;
  top: -5px;
  transition: transform 0.5s;
  transform-origin: center;
}
.countBadge.small {
  font-size: 9px;
  min-width: 12px;
  height: 12px;
  line-height: 12px;
}
.countBadge.bottom {
  top: unset;
  bottom: -5px;
}
.countBadge:empty {
  transform: scale(0);
}
.countBadge.animate {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
  transform-origin: center bottom;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}
.countBadge.class1 {
  background: #d06fc0;
  margin-top: 20px;
}
.countBadge.class2 {
  background: #826fd0;
  margin-top: 20px;
}
.main {
  margin-top: 40px;
  min-height: calc(100vh - 96px);
}
.main.py-4 {
  padding-bottom: 0 !important;
}
.lmenu {
  max-height: calc( 100vh - 64px );
  overflow: auto;
}
.lmenu .sideHeader {
  display: none;
}
.lmenu.sticky-top {
  top: 64px;
}
.lmenu.admin .leftmenu .menuitem a,
.lmenu.admin .leftmenu .menuitem span.a {
  font-size: 13px;
  font-weight: 400;
  padding: 3px 3px 3px 10px;
}
.lmenu.admin .leftmenu .menuitem .menusubitems {
  padding: 0 0 0 3px;
  overflow: hidden;
  transition: all 0.2s;
  transform-origin: top;
  transform: scaleY(0);
  height: 0;
}
.lmenu.admin .leftmenu .menuitem .menusubitems a {
  font-size: 13px;
  line-height: 20px;
}
.lmenu.admin .leftmenu .menuitem.active .menusubitems {
  transform: scaleY(1);
  height: auto;
}
.leftmenu {
  clear: both;
  padding-bottom: 60px;
}
.leftmenu .menuheader {
  padding: 15px 5px 5px 5px;
  border-bottom: 1px solid #d7d7d7;
  text-transform: uppercase;
  color: #363636;
  font-size: 14px;
  font-weight: 700;
}
.leftmenu .menuheader:first-child {
  padding: 5px 5px 5px 5px;
}
.leftmenu .menubutton {
  padding: 2px 0;
}
.leftmenu .menubutton a,
.leftmenu .menubutton span.a {
  display: block;
  padding: 5px 3px 5px 3px;
  background-repeat: no-repeat;
  background-position: 6px center;
  font-size: 13px;
  color: #000;
  background: #ccc;
  border-radius: 0.25rem;
  border: 1px solid #ccc;
  font-weight: 400;
  background-size: 20px 20px;
  cursor: pointer;
  text-align: center;
  overflow: hidden;
  box-sizing: border-box;
}
.leftmenu .menubutton a.supportUs,
.leftmenu .menubutton span.a.supportUs {
  color: #fff;
  background-color: #9b2621;
  border-color: #9b2621;
  transition: 0.2s all;
}
.leftmenu .menubutton a.supportUs:hover,
.leftmenu .menubutton span.a.supportUs:hover {
  background-color: #7b1e1a;
  border-color: #711c18;
}
.leftmenu .menubutton a i.i,
.leftmenu .menubutton span.a i.i {
  font-size: 18px;
  color: #9b2621;
  margin-right: 10px;
  transition: all 0.15s;
  display: inline-block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  vertical-align: bottom;
}
.leftmenu .menubutton a:hover,
.leftmenu .menubutton span.a:hover {
  text-decoration: none;
}
.leftmenu .menubutton a:hover i.i,
.leftmenu .menubutton span.a:hover i.i {
  color: #9b2621;
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
}
.leftmenu .menuitem a,
.leftmenu .menuitem span.a {
  display: block;
  padding: 3px 3px 3px 3px;
  background-repeat: no-repeat;
  background-position: 6px center;
  font-size: 16px;
  color: #000;
  font-weight: 300;
  background-size: 20px 20px;
  cursor: pointer;
  border-radius: 0.25rem;
  overflow: hidden;
}
.leftmenu .menuitem a i.i,
.leftmenu .menuitem span.a i.i {
  font-size: 18px;
  color: #9b2621;
  margin-right: 10px;
  transition: all 0.15s;
  display: inline-block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  vertical-align: bottom;
}
.leftmenu .menuitem a .svgIcon,
.leftmenu .menuitem span.a .svgIcon {
  height: 24px;
  width: 24px;
  display: inline-block;
  margin-right: 10px;
  transition: all 0.15s;
  margin-top: -4px;
}
.leftmenu .menuitem a .svgIcon .svgIconPath,
.leftmenu .menuitem span.a .svgIcon .svgIconPath {
  fill: #9b2621;
}
.leftmenu .menuitem a:hover,
.leftmenu .menuitem span.a:hover {
  text-decoration: none;
  background-color: #fff;
  background-color: rgba(0, 0, 0, 0.1);
}
.leftmenu .menuitem a:hover i.i,
.leftmenu .menuitem span.a:hover i.i {
  color: #9b2621;
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
}
.leftmenu .menuitem a:hover .svgIcon,
.leftmenu .menuitem span.a:hover .svgIcon {
  fill: #9b2621;
  filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.4));
}
.leftmenu .menuitem a.plus,
.leftmenu .menuitem span.a.plus {
  display: block;
  float: right;
  height: 30px;
  width: 30px;
  margin-left: -30px;
  padding: 0;
  opacity: 0;
  overflow: hidden;
  border-radius: 50%;
}
@media (max-width: 768px) {
  .leftmenu .menuitem a.plus,
  .leftmenu .menuitem span.a.plus {
    opacity: 0.8;
  }
}
.leftmenu .menuitem a.plus i.i,
.leftmenu .menuitem span.a.plus i.i {
  color: #666;
  margin-right: 0;
  display: inline-block;
  height: 30px;
  width: 30px;
  line-height: 30px;
  text-align: center;
}
.leftmenu .menuitem a.plus i.i::before,
.leftmenu .menuitem span.a.plus i.i::before {
  height: 30px;
  width: 30px;
  line-height: 30px;
}
.leftmenu .menuitem a.plus:hover,
.leftmenu .menuitem span.a.plus:hover {
  text-decoration: none;
  background-color: #fff;
  background-color: rgba(0, 0, 0, 0.1);
}
.leftmenu .menuitem a.plus:hover i.i,
.leftmenu .menuitem span.a.plus:hover i.i {
  color: #000;
  text-shadow: unset;
}
.leftmenu .menuitem:hover a.plus,
.leftmenu .menuitem:hover span.a.plus {
  opacity: 1;
}
.leftmenu .menuitem .badge {
  position: relative;
  color: #fff;
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  background: #f00;
  padding: 0;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  border-radius: 50%;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
  float: right;
  margin-left: -30px;
  transition: transform 0.5s;
  transform-origin: center;
}
.leftmenu .menuitem .badge:empty {
  transform: scale(0);
}
.leftmenu .menuitem .badge.animate {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
  transform-origin: center bottom;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}
.leftmenu .menuitem.disabled {
  opacity: 0.5;
}
.leftmenu .menuitem .menusubitems {
  padding: 0 0 0 10px;
  overflow: hidden;
  transition: all 0.2s;
  transform-origin: top;
  transform: scaleY(0);
  height: 0;
}
.leftmenu .menuitem .menusubitems a {
  font-size: 14px;
  line-height: 25px;
}
.leftmenu .menuitem.active .menusubitems {
  transform: scaleY(1);
  height: auto;
}
.leftmenu .menuitem.article a,
.leftmenu .menuitem.article span.a {
  font-size: 12px;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.leftmenu .menuitem.albums a {
  background-image: url(/images/foto.svg?72386d30bfd9f26c4a946214b8833cce);
}
.leftmenu .menuitem.videos a {
  background-image: url(/images/ico_video.svg?0e3668a6c129ee009488874d2ab31cc0);
}
.leftmenu .menuitem.groups a {
  background-image: url(/images/skupiny.svg?780b5885fa64041a1b84fe8296808723);
}
.leftmenu .menuitem.wall a {
  background-image: url(/images/zed.svg?9df7637181f160abab88e12d95fb820d);
}
.leftmenu .menuitem.chats a {
  background-image: url(/images/chat-2.svg?5c326279bed3bfd27bb718e3090a9dc4);
}
.leftmenu .menuitem.fastdates a {
  background-image: url(/images/rande.svg?e03e25585ec207ad785ae497ca62601a);
}
.leftmenu .menuitem.forum a {
  background-image: url(/images/diskuze.svg?49e83fd27dec9714ff4757338f8446bc);
}
.leftmenu .menuitem.dating a {
  background-image: url(/images/inzeraty.svg?374b8cbe5ed7f062dc599a23cbbde1bc);
}
.leftmenu .menuitem.blogs a {
  background-image: url(/images/blog.svg?40fef8309757d6c2c4ecc1b1e3cdd3a3);
}
.leftmenu .menuitem.stories a {
  background-image: url(/images/povidky.svg?db0bb31c1279d5ea8aca4d57225961b9);
}
.leftmenu .menuitem.polls a {
  background-image: url(/images/anketa.svg?1a39b6570cfdf01916f9920eeca34749);
}
.leftmenu .menuitem.clubs a {
  background-image: url(/images/kluby.svg?e1585172f9ad751bcad3e78ffd67c878);
}
.leftmenu .menuitem.beaches a {
  background-image: url(/images/beach.png?236b12c59012f7671c2eab5720aa17e3);
}
.leftmenu .menuitem.privates a {
  background-image: url(/images/private.png?1ad503c14173d58f038396711048471c);
}
.leftmenu .menuitem.photographers a {
  background-image: url(/images/photographer.png?01eea81a0a67b54c19f06a611e5db228);
}
.leftmenu .menuitem.events a {
  background-image: url(/images/akce.svg?7002872c95e251a9dc59f38b1c5f7733);
}
.notice {
  padding: 10px;
  border: 1px solid #ccc;
  background: #eee;
  color: #000;
  font-size: 14px;
  margin-bottom: 20px;
  overflow: hidden;
  border-radius: 0.25rem;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.notice.info {
  border-color: #99ff99;
  background: #ccffcc;
  color: #060;
}
.notice.warning {
  border-color: #ffff99;
  background: #ffffcc;
  color: #660;
}
.notice.error {
  border-color: #ff9999;
  background: #ffcccc;
  color: #600;
}
.notice .link {
  float: right;
  font-weight: 600;
}
.menuProfile {
  height: 24px;
  margin-bottom: 10px;
}
.menuProfile .profileImg {
  float: left;
  text-align: left;
  margin-right: 10px;
  border-radius: 50%;
  overflow: hidden;
}
.menuProfile .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 24px;
  height: 24px;
  border-radius: 50%;
}
.menuProfile .profileName {
  font-size: 14px;
  font-weight: 700;
  line-height: 24px;
  text-align: left;
  margin-top: 5px;
  color: #9b2621;
}
.menuProfile .profileEdit {
  text-align: left;
}
.menuProfile .profileEdit a {
  font-size: 12px;
  color: #000;
}
.menuProfile .profileEdit a:visited {
  color: #000;
}
.scrollUp {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 100;
  cursor: pointer;
  color: #fff;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  opacity: 0;
  transform-origin: center;
  transform: scale(0);
  transition: all 0.2s;
}
.scrollUp.active {
  transform: scale(1);
  opacity: 0.6;
}
.scrollUp i.i.mdi:before {
  font-size: 60px;
}
.scrollUp:hover {
  opacity: 1;
  text-shadow: 0 0 20px rgba(0, 0, 0, 0.9);
}
.profileAvatar {
  margin-bottom: 10px;
  float: left;
}
.profileAvatar .profileImg {
  float: left;
  text-align: left;
  border-radius: 50%;
  overflow: hidden;
}
.profileAvatar .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 50px;
  height: 50px;
}
.profileAvatar .profileName {
  font-size: 16px;
  font-weight: 700;
  text-align: left;
  margin-top: 5px;
  color: #9b2621;
}
.profileTop .tab {
  margin-bottom: 0;
}
.profileForm .map {
  width: calc( 100% - 40px );
  height: 300px;
  padding: 10px;
  margin: 0 auto;
}
.profileForm .col-form-label {
  font-size: 0.8rem;
  color: #6d0015;
  font-weight: 600;
}
.profileForm .col-form-label .genderIcon {
  vertical-align: bottom;
}
.profileForm .form-control {
  font-size: 0.8rem;
}
.profileForm .form-control.required {
  background: #ffcccc;
}
.profileForm .form-control.required.filled {
  background: #ccffcc;
}
.profileForm .form-control.required.filled ~ div {
  background: #ccffcc;
}
.profileForm .form-control.required.filled.error {
  background: #ffcccc;
}
.profileForm .form-control.required.filled.error ~ div {
  background: #ffcccc;
}
.profileForm .form-control.required ~ div {
  background: #ffcccc;
}
.profileForm .form-control.error {
  background: #ffcccc;
}
.profileForm .form-control.error ~ div {
  background: #ffcccc;
}
.profileForm .dropdown-toggle,
.profileForm .dropdown-menu {
  font-size: 0.8rem;
}
.searchForm .map {
  width: calc( 100% - 40px );
  height: 300px;
  padding: 10px;
  margin: 0 auto;
}
.membersListType {
  text-align: right;
  padding-right: 5px;
  padding-bottom: 10px;
  margin-bottom: 5px;
  border-bottom: 1px solid #eee;
}
.membersListType button {
  width: 32px;
  height: 32px;
  text-align: center;
  background: #ccc;
  color: #000;
  border: 1px solid #ccc;
  border-radius: 0.25rem;
  outline: 0;
}
.membersListType button.active {
  background: #9b2621;
  color: #fff;
  border: 1px solid #9b2621;
}
.nothingFound,
.noMembersFound,
.noClubsFound {
  padding: 20px;
  color: #666;
  text-align: center;
}
a.profileLink.m,
a.profileLink.mm {
  color: #4272e5;
}
a.profileLink.f,
a.profileLink.ff {
  color: #e649bc;
}
a.profileLink.mf,
a.profileLink.fm {
  color: #aa49e6;
}
.memberslist {
  clear: both;
}
.memberslist .member {
  margin: 5px;
  width: calc( 50% - 10px );
  height: 160px;
  float: left;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 0.25rem;
  /*
                @media (min-width: 780px) {
                    width: ~"calc( 25% - 10px )";
                }
                @media (min-width: 992px) {
                    width: ~"calc( 25% - 10px )";
                }*/
}
@media (min-width: 550px) {
  .memberslist .member {
    width: calc( 33.3% - 10px );
  }
}
@media (min-width: 992px) {
  .memberslist .member {
    width: calc( 25% - 10px );
  }
}
.memberslist .member .profileImg {
  text-align: center;
  position: relative;
}
.memberslist .member .profileImg img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 160px;
}
.memberslist .member .profileImg .verifiedIcon {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 24px;
  height: 24px;
}
.memberslist .member .profileImg .profileFlag {
  position: absolute;
  left: 5px;
  top: 5px;
}
.memberslist .member .profileImg .genderIcon {
  position: absolute;
  left: 5px;
  bottom: 5px;
}
.memberslist .member .profileImg .onlineIcon {
  position: absolute;
  bottom: 5px;
  right: 5px;
  width: 10px;
  height: 10px;
  border-radius: 50px;
  border: 1px solid transparent;
  overflow: hidden;
}
.memberslist .member .profileImg .onlineIcon.offline {
  background: transparent;
}
.memberslist .member .profileImg .onlineIcon.online {
  background: #090;
}
.memberslist .member .profileInfo {
  padding: 10px;
  height: 160px;
  margin: -45px 0 -160px 0;
  position: relative;
  transition: 0.1s 0.5s all;
}
.memberslist .member .profileInfo a {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.memberslist .member .profileInfo a:hover {
  text-decoration: none;
}
.memberslist .member .profileInfo .profileName {
  font-size: 14px;
  font-weight: 600;
  margin-top: 5px;
  text-align: center;
}
.memberslist .member .profileInfo .profileType {
  font-size: 10px;
  font-weight: 700;
  margin-top: 5px;
  text-align: center;
}
.memberslist .member .profileInfo .profileType .admin {
  color: #f00;
}
.memberslist .member .profileInfo .profileType .seller {
  color: #666;
}
.memberslist .member .profileInfo .profileType .m {
  color: #4272e5;
}
.memberslist .member .profileInfo .profileType .f {
  color: #e649bc;
}
.memberslist .member .profileInfo .profileIcons {
  font-size: 12px;
  font-weight: 400;
  margin-top: 20px;
  text-align: center;
}
.memberslist .member .profileInfo .profileIcons .countIcon {
  display: inline-block;
  width: 30px;
  text-align: center;
}
.memberslist .member .profileInfo .profileIcons .countIcon i {
  font-size: 14px;
  display: block;
}
.memberslist .member .profileInfo .profileIcons a {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.memberslist .member .profileInfo .profileLoc {
  font-size: 12px;
  font-weight: 400;
  text-align: left;
  margin-top: 10px;
  margin-left: 20px;
  color: #fff;
}
.memberslist .member .actions {
  position: relative;
  margin-bottom: -30px;
  text-align: right;
  z-index: 10;
  width: 100%;
  height: 30px;
  color: #fff;
}
.memberslist .member .actions .buttonIcon {
  color: #fff;
  background-color: rgba(0, 0, 0, 0.25);
  top: 5px;
  right: 5px;
}
.memberslist .member .actions .buttonIcon.left {
  left: 5px;
}
.memberslist .member .actions .buttonIcon:hover {
  color: #fff;
  background-color: rgba(0, 0, 0, 0.5);
}
.memberslist .member:hover .profileInfo {
  margin-top: -160px;
  background-color: rgba(0, 0, 0, 0.5);
}
.memberslist .member:hover .profileInfo a {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.memberslist .member:hover .profileInfo a:hover {
  text-decoration: none;
}
.memberslist .member:hover .actions .buttonIcon {
  color: #fff;
}
.memberslist.list .member {
  height: 255px;
  border-color: #eee;
  background-color: #f9f9f9;
  transition: 0.1s all;
  /*
                    @media (min-width: 780px) {
                        width: ~"calc( 25% - 10px )";
                    }
                    @media (min-width: 992px) {
                        width: ~"calc( 25% - 10px )";
                    }*/
}
@media (min-width: 550px) {
  .memberslist.list .member {
    width: calc( 33.3% - 10px );
  }
}
@media (min-width: 992px) {
  .memberslist.list .member {
    width: calc( 25% - 10px );
  }
}
.memberslist.list .member .profileImg {
  text-align: center;
  position: relative;
}
.memberslist.list .member .profileImg img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 160px;
}
.memberslist.list .member .profileInfo {
  padding: 0px;
  height: 90px;
  margin: 0px 0 0px 0;
  transition: none;
}
.memberslist.list .member .profileInfo a {
  color: #000;
  text-shadow: none;
}
.memberslist.list .member .profileInfo a:hover {
  text-decoration: none;
}
.memberslist.list .member .profileInfo .profileName {
  margin-left: 5px;
  font-size: 14px;
  font-weight: 600;
  color: #6d0015;
}
.memberslist.list .member .profileInfo .profileType {
  margin-top: 0px;
  margin-left: 5px;
}
.memberslist.list .member .profileInfo .profileIcons {
  margin-top: 16px;
  font-size: 11px;
  color: #333;
}
.memberslist.list .member .profileInfo .profileIcons a {
  color: #000;
  text-shadow: none;
}
.memberslist.list .member .profileInfo .profileLoc {
  font-size: 11px;
  font-weight: 400;
  margin-top: -47px;
  margin-left: 25px;
  color: #000;
}
.memberslist.list .member:hover {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.memberslist.list .member:hover .profileInfo {
  margin-top: 0;
  background-color: transparent;
}
.memberslist.list .member:hover .profileInfo a {
  color: #000;
  text-shadow: none;
}
.memberslist.list .member:hover .profileInfo a:hover {
  text-decoration: none;
}
.memberstable {
  clear: both;
  width: 100%;
}
.memberstable .noMembersFound {
  padding: 20px;
  color: #666;
  text-align: center;
}
.memberstable .tableHeader {
  background-color: #fff;
  font-size: 11px;
  border-bottom: 1px solid #eee;
}
.memberstable .tableHeader th {
  font-weight: 400;
  padding: 2px;
}
.memberstable .tableHeader th.headerIcon {
  text-align: center;
}
.memberstable .tableHeader th a {
  color: #666;
}
.memberstable .tableHeader th a:hover {
  text-decoration: none;
}
.memberstable .tableHeader th i {
  font-size: 14px;
  display: inline-block;
  line-height: 11px;
}
.memberstable .member,
.memberstable .notif,
.memberstable .gift {
  overflow: hidden;
  border: 1px solid transparent;
  border-bottom-color: #eee;
}
.memberstable .member td,
.memberstable .notif td,
.memberstable .gift td {
  padding: 2px;
}
.memberstable .member:hover td,
.memberstable .notif:hover td,
.memberstable .gift:hover td {
  background: #f9f9f9;
}
.memberstable .member .pAvatar,
.memberstable .notif .pAvatar,
.memberstable .gift .pAvatar {
  text-align: center;
  width: 40px;
}
.memberstable .member .pAvatar .avatar,
.memberstable .notif .pAvatar .avatar,
.memberstable .gift .pAvatar .avatar {
  width: 30px;
  height: 30px;
  display: block;
}
.memberstable .member a,
.memberstable .notif a,
.memberstable .gift a {
  color: #000;
}
.memberstable .member a:hover,
.memberstable .notif a:hover,
.memberstable .gift a:hover {
  text-decoration: none;
}
.memberstable .member .profileName,
.memberstable .notif .profileName,
.memberstable .gift .profileName {
  font-size: 14px;
  font-weight: 600;
  text-align: left;
  margin-top: 5px;
  margin-left: 20px;
}
.memberstable .member .profileName.m,
.memberstable .notif .profileName.m,
.memberstable .gift .profileName.m {
  color: #4272e5;
}
.memberstable .member .profileName.f,
.memberstable .notif .profileName.f,
.memberstable .gift .profileName.f {
  color: #e649bc;
}
.memberstable .member .profileName.mf,
.memberstable .notif .profileName.mf,
.memberstable .gift .profileName.mf,
.memberstable .member .profileName.fm,
.memberstable .notif .profileName.fm,
.memberstable .gift .profileName.fm {
  color: #aa49e6;
}
.memberstable .member .profileName a,
.memberstable .notif .profileName a,
.memberstable .gift .profileName a {
  color: inherit;
}
.memberstable .member .profileType,
.memberstable .notif .profileType,
.memberstable .gift .profileType {
  font-size: 11px;
  font-weight: 500;
  text-align: left;
  margin-top: 5px;
  margin-left: 20px;
}
.memberstable .member .profileType .admin,
.memberstable .notif .profileType .admin,
.memberstable .gift .profileType .admin {
  color: #f00;
}
.memberstable .member .profileType .seller,
.memberstable .notif .profileType .seller,
.memberstable .gift .profileType .seller {
  color: #666;
}
.memberstable .member .profileType .m,
.memberstable .notif .profileType .m,
.memberstable .gift .profileType .m {
  color: #4272e5;
}
.memberstable .member .profileType .f,
.memberstable .notif .profileType .f,
.memberstable .gift .profileType .f {
  color: #e649bc;
}
.memberstable .member .profileLoc,
.memberstable .notif .profileLoc,
.memberstable .gift .profileLoc {
  font-size: 12px;
  font-weight: 400;
}
.memberstable .member .profileDate,
.memberstable .notif .profileDate,
.memberstable .gift .profileDate,
.memberstable .member .notifDate,
.memberstable .notif .notifDate,
.memberstable .gift .notifDate {
  font-size: 12px;
  font-weight: 400;
  text-align: right;
}
.memberstable .member .profileCount,
.memberstable .notif .profileCount,
.memberstable .gift .profileCount {
  font-size: 10px;
  text-align: center;
}
.memberstable .member .profileIcons,
.memberstable .notif .profileIcons,
.memberstable .gift .profileIcons {
  font-size: 12px;
  font-weight: 400;
  margin-top: 5px;
  text-align: center;
}
.memberstable .member .profileIcons .countIcon,
.memberstable .notif .profileIcons .countIcon,
.memberstable .gift .profileIcons .countIcon {
  display: inline-block;
  width: 30px;
  text-align: center;
  color: #666;
}
.memberstable .member .profileIcons .countIcon i,
.memberstable .notif .profileIcons .countIcon i,
.memberstable .gift .profileIcons .countIcon i {
  font-size: 14px;
  display: block;
}
.memberstable .member .profileIcons a,
.memberstable .notif .profileIcons a,
.memberstable .gift .profileIcons a {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.memberstable .member .notifIcon,
.memberstable .notif .notifIcon,
.memberstable .gift .notifIcon {
  font-size: 12px;
  color: #6d0015;
}
.memberstable .member .notifIcon .name,
.memberstable .notif .notifIcon .name,
.memberstable .gift .notifIcon .name {
  font-weight: 600;
  margin-left: 6px;
}
.memberstable .member .notifText,
.memberstable .notif .notifText,
.memberstable .gift .notifText {
  font-size: 12px;
}
.memberstable .member .notifText .name,
.memberstable .notif .notifText .name,
.memberstable .gift .notifText .name {
  font-weight: 600;
  margin-left: 6px;
}
.memberstable .member .tableActions,
.memberstable .notif .tableActions,
.memberstable .gift .tableActions {
  text-align: right;
}
.memberstable .member .giftImg,
.memberstable .notif .giftImg,
.memberstable .gift .giftImg {
  max-width: 100px;
  max-height: 50px;
}
.memberstable .member .giftImg > img,
.memberstable .notif .giftImg > img,
.memberstable .gift .giftImg > img {
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
  height: 100%;
  max-height: 50px;
}
.memberstable .member:hover .profileInfo,
.memberstable .notif:hover .profileInfo,
.memberstable .gift:hover .profileInfo {
  margin-top: -160px;
  background-color: rgba(0, 0, 0, 0.5);
}
.memberstable .member:hover .profileInfo a,
.memberstable .notif:hover .profileInfo a,
.memberstable .gift:hover .profileInfo a {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.memberstable .member:hover .profileInfo a:hover,
.memberstable .notif:hover .profileInfo a:hover,
.memberstable .gift:hover .profileInfo a:hover {
  text-decoration: none;
}
.searchMap {
  height: 500px;
}
.profilePhoto .profileImg {
  text-align: center;
  width: 308px;
  height: 308px;
  border: 1px solid #ccc;
  padding: 4px;
  max-width: 100%;
  margin: 0;
}
.profilePhoto .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
.profileClubPhoto .profileImg {
  text-align: center;
  width: 608px;
  height: 308px;
  border: 1px solid #ccc;
  padding: 4px;
  max-width: 100%;
  margin: 0;
}
.profileClubPhoto .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
@media (max-width: 550px) {
  .profileClubPhoto .profileImg {
    width: 308px;
    height: 158px;
  }
}
.profilePhotoCrop {
  width: 310px;
  height: 310px;
  border: 1px solid #ccc;
  padding: 4px;
  margin: 0;
  position: relative;
}
.profilePhotoCrop.empty {
  display: none;
}
.profilePhotoCrop .profileImg {
  width: 300px;
  height: 300px;
  padding: 0;
  max-width: 100%;
  margin: 0;
}
.profilePhotoCrop .profileImg > img {
  display: block;
  max-width: 100%;
}
.profileClubPhotoCrop {
  width: 610px;
  max-width: 100%;
  height: 310px;
  border: 1px solid #ccc;
  padding: 4px;
  margin: 0;
  position: relative;
}
.profileClubPhotoCrop.empty {
  display: none;
}
.profileClubPhotoCrop .profileImg {
  width: 600px;
  height: 300px;
  padding: 0;
  max-width: 100%;
  margin: 0;
}
.profileClubPhotoCrop .profileImg > img {
  display: block;
  max-width: 100%;
}
@media (max-width: 550px) {
  .profileClubPhotoCrop {
    width: 310px;
    height: 160px;
  }
  .profileClubPhotoCrop .profileImg {
    width: 300px;
    height: 150px;
  }
}
.memberProfile .profileImg {
  text-align: center;
  width: 200px;
  height: 200px;
  border: 1px solid #ccc;
  padding: 4px;
}
.memberProfile .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
.memberProfile .profileName {
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  margin-top: 5px;
}
.memberProfile .row {
  padding: 3px 3px;
}
.memberProfile .row .rowlabel {
  font-weight: 700;
  color: #000;
  width: 20%;
  float: left;
  padding: 0 10px;
  font-size: 13px;
  text-align: left;
}
.memberProfile .row .rowlabel.m {
  color: #4272e5;
}
.memberProfile .row .rowlabel.f {
  color: #e649bc;
}
.memberProfile .row .rowvalue {
  color: #333;
  width: 30%;
  font-size: 13px;
  float: left;
}
.memberProfile .row .rowvalue.oneline {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.memberProfile .row .rowvalue.name {
  font-weight: 600;
}
.memberProfile .row .rowvalue .lang {
  white-space: nowrap;
}
.memberProfile .row .rowvalue .notset {
  color: #ccc;
}
.memberProfile .row.single .rowvalue {
  width: 70%;
}
.memberProfile .profileDesc {
  padding: 0 0 10px 0;
  font-size: 13px;
  line-height: 23px;
}
.memberProfile .profileDesc .notset {
  color: #ccc;
}
.memberProfile #map {
  height: 200px;
  width: 100%;
}
.memberProfile.single .row .rowvalue {
  width: 70%;
}
img.zodiac {
  width: 24px;
  height: 24px;
  margin-top: -5px;
  margin-bottom: 0;
  -o-object-fit: contain;
     object-fit: contain;
}
img.zodiac + span.zodiac {
  display: none;
}
img.zodiac:active + span.zodiac {
  display: inline;
}
img.zodiac:focus + span.zodiac {
  display: inline;
}
.buyMembershipButton {
  font-weight: bold;
  text-align: center;
  font-size: 14px;
  padding: 8px 11px;
  border-radius: 3px;
  margin: 10px 5px;
  color: #fff;
  background: #3e703e;
  cursor: pointer;
}
.membershipInfo {
  font-weight: normal;
  text-align: center;
  font-size: 12px;
  padding: 2px;
  border-radius: 3px;
  margin: 10px 5px;
  color: #666;
  background: #eee;
}
.membershipInfo .membershipInfoDate {
  font-weight: bold;
  text-align: center;
  font-size: 12px;
  color: #333;
}
.memberProfileTop {
  padding: 15px;
}
.memberProfileTop .py-2 {
  display: block;
}
.memberProfileTop .memberProfilePhoto {
  float: left;
}
@media (max-width: 550px) {
  .memberProfileTop .memberProfilePhoto {
    float: none;
    padding-top: 0;
    max-width: 200px;
    margin: 0 auto;
  }
}
.memberProfileTop .memberProfilePhoto .profileImg {
  text-align: center;
  width: 200px;
  height: 200px;
  border: 1px solid #ccc;
  padding: 4px;
  position: relative;
}
.memberProfileTop .memberProfilePhoto .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
.memberProfileTop .memberProfilePhoto .profileImg > .verifiedIcon {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 24px;
  height: 24px;
}
.memberProfileTop .memberProfilePhoto .profileImg .flagIcon {
  position: absolute;
  top: 10px;
  left: 10px;
}
.memberProfileTop .memberProfilePhoto .profileImg .onlineIcon {
  position: absolute;
  bottom: 10px;
  right: 10px;
}
.memberProfileTop .memberProfilePhoto .profileImg .onlineIcon.offline {
  color: transparent;
}
.memberProfileTop .memberProfilePhoto .profileImg .onlineIcon.online {
  color: #090;
}
.memberProfileTop .memberProfilePhoto .profileImg .genderIcon {
  position: absolute;
  bottom: 10px;
  left: 10px;
}
.memberProfileTop .memberProfilePhoto .profileName {
  background: #6d0015;
  font-weight: bold;
  font-size: 17px;
  padding: 8px 11px;
  border-radius: 3px;
  color: #fff;
  text-align: center;
  margin: 10px 5px;
}
.memberProfileTop .memberProfilePhoto .profileType {
  font-weight: bold;
  text-align: center;
  background: #eee;
  font-size: 17px;
  padding: 8px 11px;
  border-radius: 3px;
  color: #333;
  margin: 10px 5px;
}
.memberProfileTop .memberProfilePhoto .profileType.admin {
  color: #fff;
  background: #72323e;
}
.memberProfileTop .memberProfilePhoto .profileType.seller {
  color: #fff;
  background: #ccc;
}
.memberProfileTop .memberProfilePhoto .profileType.new_user {
  color: #fff;
  background: #999;
}
.memberProfileTop .memberProfilePhoto .profileType.confirmed_user {
  color: #fff;
  background: #666;
}
.memberProfileTop .memberProfilePhoto .profileType.user {
  color: #fff;
  background: #5a7799;
}
.memberProfileTop .memberProfilePhoto .profileType.member {
  color: #fff;
  background: #3e703e;
}
.memberProfileTop .memberProfileInfo {
  clear: both;
  padding-top: 20px;
  margin-left: 0;
  width: auto;
}
@media (max-width: 770px) {
  .memberProfileTop .memberProfileInfo {
    clear: unset;
    float: right;
    padding-top: 0;
    width: 58%;
  }
}
@media (max-width: 550px) {
  .memberProfileTop .memberProfileInfo {
    clear: both;
    float: none;
    padding-top: 20px;
    width: auto;
  }
}
.memberProfileTop .memberProfileInfo .profileName {
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  margin-top: 5px;
}
.memberProfileTop .memberProfileInfo .homeIcon {
  margin-top: -3px;
  margin-bottom: -3px;
  display: block;
}
.memberProfileTop .memberProfileInfo .swingersIcon24 {
  display: block;
  width: 24px;
  height: 24px;
  margin-top: -2px;
  margin-bottom: -2px;
  background: url(/images/logoicon.png?8dd0dd668da19450bf521759495b4bfb) no-repeat;
  background-size: cover;
}
.memberProfileTop .memberProfileInfo .row {
  padding: 3px 3px;
}
.memberProfileTop .memberProfileInfo .row .rowlabel {
  font-weight: 700;
  color: #000;
  width: 50%;
  float: left;
  padding-left: 10px;
  font-size: 13px;
}
@media (max-width: 770px) {
  .memberProfileTop .memberProfileInfo .row .rowlabel {
    width: 45%;
  }
}
.memberProfileTop .memberProfileInfo .row .rowlabel .genderIcon {
  vertical-align: middle;
}
.memberProfileTop .memberProfileInfo .row .rowvalue {
  color: #333;
  width: 50%;
  font-size: 13px;
  float: left;
}
@media (max-width: 770px) {
  .memberProfileTop .memberProfileInfo .row .rowvalue {
    width: 55%;
  }
}
.memberProfileTop .memberProfileInfo .row .rowvalue.oneline {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.memberProfileTop .memberProfileInfo .row .rowvalue .notset {
  color: #ccc;
}
.memberProfileTop .memberProfileClubPhoto {
  float: left;
}
@media (max-width: 770px) {
  .memberProfileTop .memberProfileClubPhoto {
    float: none;
    padding-top: 0;
    max-width: 300px;
    margin: 0 auto;
  }
}
.memberProfileTop .memberProfileClubPhoto .profileImg {
  text-align: center;
  width: 300px;
  height: 150px;
  border: 1px solid #ccc;
  padding: 4px;
  position: relative;
}
.memberProfileTop .memberProfileClubPhoto .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
.memberProfileTop .memberProfileClubInfo {
  clear: both;
  padding-top: 20px;
  margin-left: 0;
  width: auto;
}
@media (max-width: 770px) {
  .memberProfileTop .memberProfileClubInfo {
    clear: both;
    float: none;
    padding-top: 20px;
    width: auto;
  }
}
.memberProfileTop .memberProfileClubInfo .profileName {
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  margin-top: 5px;
}
.memberProfileTop .memberProfileClubInfo .homeIcon {
  margin-top: -3px;
  margin-bottom: -3px;
  display: block;
}
.memberProfileTop .memberProfileClubInfo .row {
  padding: 3px 3px;
}
.memberProfileTop .memberProfileClubInfo .row .rowlabel {
  font-weight: 700;
  color: #000;
  width: 30%;
  float: left;
  padding-left: 10px;
  font-size: 13px;
}
@media (max-width: 770px) {
  .memberProfileTop .memberProfileClubInfo .row .rowlabel {
    width: 45%;
  }
}
.memberProfileTop .memberProfileClubInfo .row .rowlabel .genderIcon {
  vertical-align: middle;
}
.memberProfileTop .memberProfileClubInfo .row .rowvalue {
  color: #333;
  width: 70%;
  font-size: 13px;
  float: left;
}
@media (max-width: 770px) {
  .memberProfileTop .memberProfileClubInfo .row .rowvalue {
    width: 55%;
  }
}
.memberProfileTop .memberProfileClubInfo .row .rowvalue.oneline {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.memberProfileTop .memberProfileClubInfo .row .rowvalue .notset {
  color: #ccc;
}
.memberProfileTop .memberProfileAdmin {
  clear: both;
  padding: 10px 0 20px 0;
}
.memberProfileTop .memberProfileAdmin .form-control {
  width: auto;
  display: inline-block;
}
.memberProfileButtons {
  margin-bottom: 20px;
  text-align: center;
}
.memberProfileButtons button {
  text-align: center;
  font-size: 12px;
  background-image: none;
  background-color: #fff;
  border: 1px solid #f1d6d5;
  color: #9b2621;
  display: inline-block;
  padding: 4px 8px;
  border-radius: 0.25rem;
  margin: 0;
  outline: none;
  height: 30px;
  line-height: 18px;
}
.memberProfileButtons button i.i {
  font-size: 18px;
  line-height: 20px;
  vertical-align: bottom;
}
.memberProfileButtons button i.i.mdi::before {
  font-size: 18px;
}
.memberProfileButtons button .svgIcon {
  height: 18px;
  width: 24px;
  display: inline-block;
  vertical-align: sub;
}
.memberProfileButtons button .svgIcon .svgIconPath {
  fill: #9b2621;
}
.memberProfileButtons button.active {
  background-color: #9b2621;
  border: 1px solid #9b2621;
  color: #fff;
}
.memberProfileButtons button.active .svgIcon .svgIconPath {
  fill: #fff;
}
.memberProfileButtons button.wait {
  background-color: #be7673;
  border: 1px solid #be7673;
  color: #fff;
}
.memberProfileButtons button:disabled,
.memberProfileButtons button.disabled {
  background-color: #eee;
  border: 1px solid #ccc;
  color: #ccc;
}
.memberProfileButtons button:disabled .svgIcon .svgIconPath,
.memberProfileButtons button.disabled .svgIcon .svgIconPath {
  fill: #ccc;
}
.memberProfileButtons button:active {
  background-color: #9b2621;
  border: 1px solid #9b2621;
  color: #fff;
}
.memberProfileButtons button:active .svgIcon .svgIconPath {
  fill: #fff;
}
.memberProfileButtons button:hover {
  opacity: 0.8;
}
.twocards .memberProfile .row {
  padding: 3px 3px;
}
.twocards .memberProfile .row .rowlabel {
  font-weight: 700;
  color: #000;
  width: 40%;
  float: left;
  padding: 0 10px;
  font-size: 13px;
  text-align: left;
}
.twocards .memberProfile .row .rowlabel.m {
  color: #4272e5;
}
.twocards .memberProfile .row .rowlabel.f {
  color: #e649bc;
}
.twocards .memberProfile .row .rowvalue {
  color: #333;
  width: 30%;
  font-size: 13px;
  float: left;
}
.twocards .memberProfile .row .rowvalue .notset {
  color: #ccc;
}
.twocards .memberProfile .row .rowvalue.both {
  width: 60%;
}
.twocards .memberProfile .row .genderIcon {
  vertical-align: middle;
}
.genderIcon {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  display: inline-block;
  width: 24px;
  height: 24px;
}
.genderIcon.m {
  background-image: url(/images/g-m2.png?f1c59d40a73fea2e70e57d6c79d45e87);
  background-size: 75%;
  background-position-y: 3px;
}
.genderIcon.f {
  background-image: url(/images/g-f2.png?e95945efa837b355d2af085bc2d97eb6);
  background-size: 100%;
  background-position-y: bottom;
}
.genderIcon.mm {
  background-image: url(/images/g-mm.png?6a76a2d8055b6e7f4ef9409ca8a75c9e);
}
.genderIcon.mf,
.genderIcon.fm {
  background-image: url(/images/g-mf.png?12268cb0fc7e50527b22fbb4182a5123);
}
.genderIcon.ff {
  background-image: url(/images/g-ff.png?d680d4f0c8e3665633536e6a188de5bc);
}
.datingSexIcon {
  display: inline-block;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid #ccc;
  vertical-align: text-bottom;
}
.datingSexIcon i.i {
  display: inline-block;
  height: 30px;
  width: 30px;
  line-height: 30px;
  text-align: center;
}
.datingSexIcon i.i::before {
  position: unset;
  height: 30px;
  width: 30px;
  line-height: 30px;
}
.datingSexIcon.sex {
  color: #003300;
  background: #99ff99;
  border: 1px solid #33cc33;
}
.datingSexIcon.sex.active {
  color: #fff;
  background: #006600;
  border: 1px solid #003300;
}
.datingSexIcon.maybe_sex {
  color: #333300;
  background: #ffff99;
  border: 1px solid #cccc66;
}
.datingSexIcon.maybe_sex.active {
  color: #fff;
  background: #666600;
  border: 1px solid #333300;
}
.datingSexIcon.no_sex {
  color: #330000;
  background: #ffcccc;
  border: 1px solid #ff9999;
}
.datingSexIcon.no_sex.active {
  color: #fff;
  background: #660000;
  border: 1px solid #330000;
}
.profileSection {
  display: block;
  clear: both;
  margin-bottom: 20px;
  border: 1px solid #ccc;
  background: #fff;
  min-height: 100px;
  border-radius: 0.25rem;
  overflow: hidden;
  color: #000;
  box-shadow: 0px 1px 3px -1px rgba(0, 0, 0, 0.2);
  transition: all 0.15s;
}
.profileSection:hover {
  text-decoration: none;
  color: #000;
  box-shadow: 0px 1px 20px -1px rgba(0, 0, 0, 0.5);
}
.profileSection .icon {
  display: block;
  height: 100px;
  background: #9b031f;
  text-align: center;
  color: #fff;
}
.profileSection .icon i {
  line-height: 100px;
}
.profileSection .header {
  display: block;
  font-size: 16px;
  color: #6d0015;
  padding: 5px;
  text-align: center;
  border-bottom: 1px solid #ccc;
}
.profileSection .content {
  display: block;
  font-size: 12px;
  padding: 5px 5px 5px 115px;
}
.profileSubSection {
  display: block;
  clear: both;
  padding: 2px 6px;
  margin-bottom: 4px;
  border: 1px solid #ccc;
  border-radius: 0.25rem;
  overflow: hidden;
  background: #eee;
  color: #000;
  box-shadow: 0px 1px 3px -1px rgba(0, 0, 0, 0.2);
  transition: all 0.15s;
}
.profileSubSection:hover {
  text-decoration: none;
  color: #fff;
  background: #9b031f;
  border: 1px solid #ccc;
  box-shadow: 0px 1px 10px -1px rgba(0, 0, 0, 0.5);
}
.clubslist .club {
  margin: 10px;
  width: 340px;
  height: 160px;
  float: left;
  overflow: hidden;
  width: 100%;
  width: calc( 100% - 20px );
}
@media (min-width: 550px) {
  .clubslist .club {
    width: calc( 50% - 20px );
  }
}
@media (min-width: 992px) {
  .clubslist .club {
    width: calc( 50% - 20px );
  }
}
.clubslist .club .profileImg {
  text-align: center;
  width: 100%;
}
.clubslist .club .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 340px;
  width: 100%;
  height: 160px;
}
.clubslist .club .profileInfo {
  padding: 10px;
  height: 160px;
  margin: -45px 0 -160px 0;
  position: relative;
  transition: 0.1s 0.5s all;
}
.clubslist .club .profileInfo a {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.clubslist .club .profileInfo a:hover {
  text-decoration: none;
}
.clubslist .club .profileInfo .profileName {
  font-size: 16px;
  font-weight: 700;
  text-align: left;
  margin-top: 5px;
}
.clubslist .club .profileInfo .profileType {
  font-size: 12px;
  font-weight: 700;
  text-align: left;
  margin-top: 5px;
}
.clubslist .club .profileInfo .profileIcons {
  font-size: 12px;
  font-weight: 700;
  text-align: left;
  margin-top: 5px;
}
.clubslist .club .profileInfo .profileIcons a {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.clubslist .club .profileInfo .profileLoc {
  font-size: 13px;
  font-weight: 700;
  text-align: left;
  margin-top: 5px;
  color: #fff;
}
.clubslist .club:hover .profileInfo {
  margin-top: -160px;
  background-color: rgba(0, 0, 0, 0.5);
}
.clubslist .club:hover .profileInfo a {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.clubslist .club:hover .profileInfo a:hover {
  text-decoration: none;
}
.eventslist .event {
  margin: 10px;
  width: 100%;
  min-height: 160px;
  width: calc( 100% - 10px );
  height: 170px;
  float: left;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 0.25rem;
}
@media (min-width: 550px) {
  .eventslist .event {
    width: calc( 50% - 20px );
  }
}
@media (min-width: 992px) {
  .eventslist .event {
    width: calc( 50% - 20px );
  }
}
.eventslist .event b {
  vertical-align: top;
}
.eventslist .event .eventImg {
  display: block;
  text-align: center;
  float: left;
  width: 100%;
}
.eventslist .event .eventImg > img {
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
  height: 170px;
}
.eventslist .event .eventInfo {
  width: 100%;
  float: left;
  padding: 0 10px;
  height: 170px;
  position: relative;
  transition: 0.1s 0.5s all;
  color: #fff;
}
.eventslist .event .eventInfo a {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.eventslist .event .eventInfo a:hover {
  text-decoration: none;
}
.eventslist .event .eventInfo .eventName {
  font-size: 14px;
  font-weight: 700;
  text-align: left;
}
.eventslist .event .eventInfo .eventDetail {
  width: calc( 100% - 60px );
}
.eventslist .event .eventInfo .eventClub {
  font-size: 12px;
  font-weight: 700;
  text-align: left;
}
.eventslist .event .eventInfo .eventDate {
  font-size: 12px;
  font-weight: normal;
  text-align: left;
  margin-top: 5px;
}
.eventslist .event .eventInfo .eventDesc {
  font-size: 12px;
  font-weight: normal;
  text-align: left;
  margin-top: 5px;
  max-height: 160px;
  overflow-y: auto;
}
.eventslist .event .eventInfo .eventAddress {
  font-size: 12px;
  font-weight: normal;
  text-align: left;
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.eventslist .event .eventInfo .eventFor {
  font-size: 12px;
  font-weight: normal;
  text-align: left;
  margin-top: 2px;
}
.eventslist .event .eventInfo .eventIcons {
  font-size: 12px;
  font-weight: 700;
  text-align: left;
  margin-top: 2px;
}
.eventslist .event .eventInfo .eventIcons a {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.eventslist .event .eventInfo .eventLoc {
  font-size: 13px;
  font-weight: 700;
  text-align: left;
  margin-top: 2px;
  color: #fff;
}
.eventslist .event .eventInfo .eventAttending {
  float: right;
  width: 60px;
  margin-top: 20px;
}
.eventslist .event .eventInfo .eventAttending .att {
  clear: both;
}
.eventslist .event .eventInfo .eventAttending .att .genderIcon {
  float: left;
}
.eventslist .event .eventInfo .eventAttending .att .count {
  float: left;
  text-align: right;
  width: 30px;
}
.eventslist .event:hover {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.eventslist .event:hover .eventInfo {
  margin-top: -170px;
  background-color: rgba(0, 0, 0, 0.5);
}
.eventslist .event:hover .eventInfo a:hover {
  text-decoration: none;
}
.eventslist.list .event {
  margin: 10px;
  width: 100%;
  min-height: 120px;
  clear: both;
  height: auto;
  float: left;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 0.25rem;
  /*
                    @media (min-width: 780px) {
                        width: ~"calc( 25% - 10px )";
                    }
                    @media (min-width: 992px) {
                        width: ~"calc( 25% - 10px )";
                    }*/
}
@media (min-width: 550px) {
  .eventslist.list .event {
    width: 100%;
  }
}
@media (min-width: 992px) {
  .eventslist.list .event {
    width: 100%;
  }
}
.eventslist.list .event b {
  vertical-align: top;
}
.eventslist.list .event .eventImg {
  display: block;
  text-align: center;
  float: left;
  width: 40%;
}
.eventslist.list .event .eventImg > img {
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
  max-height: 120px;
}
.eventslist.list .event .eventInfo {
  width: 60%;
  float: left;
  padding: 0 10px;
  position: relative;
  transition: 0.1s all;
  color: #333;
  height: auto;
}
.eventslist.list .event .eventInfo a {
  color: #6d0015;
  text-shadow: none;
}
.eventslist.list .event .eventInfo a:hover {
  text-decoration: none;
}
.eventslist.list .event .eventInfo .eventName {
  font-size: 14px;
  font-weight: 700;
  text-align: left;
}
.eventslist.list .event .eventInfo .eventDetail {
  width: calc( 100% - 60px );
}
.eventslist.list .event .eventInfo .eventClub {
  font-size: 12px;
  font-weight: 700;
  text-align: left;
}
.eventslist.list .event .eventInfo .eventDate {
  font-size: 12px;
  font-weight: normal;
  text-align: left;
  margin-top: 2px;
}
.eventslist.list .event .eventInfo .eventDesc {
  font-size: 12px;
  font-weight: normal;
  text-align: left;
  margin-top: 2px;
  max-height: 160px;
  overflow-y: auto;
}
.eventslist.list .event .eventInfo .eventAddress {
  font-size: 12px;
  font-weight: normal;
  text-align: left;
  margin-top: 2px;
}
.eventslist.list .event .eventInfo .eventFor {
  font-size: 12px;
  font-weight: normal;
  text-align: left;
  margin-top: 5px;
}
.eventslist.list .event .eventInfo .eventIcons {
  font-size: 12px;
  font-weight: 700;
  text-align: left;
  margin-top: 5px;
}
.eventslist.list .event .eventInfo .eventIcons a {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.eventslist.list .event .eventInfo .eventLoc {
  font-size: 13px;
  font-weight: 700;
  text-align: left;
  margin-top: 5px;
  color: #fff;
}
.eventslist.list .event .eventInfo .eventAttending {
  float: right;
  width: 60px;
  margin-top: 20px;
}
.eventslist.list .event .eventInfo .eventAttending .att {
  clear: both;
}
.eventslist.list .event .eventInfo .eventAttending .att .genderIcon {
  float: left;
}
.eventslist.list .event .eventInfo .eventAttending .att .count {
  float: left;
  text-align: right;
  width: 30px;
}
.eventslist.list .event:hover {
  box-shadow: none;
}
.eventslist.list .event:hover .eventInfo {
  margin-top: 0;
  background-color: transparent;
}
.eventslist.list .event:hover .eventInfo a {
  color: #6d0015;
  text-shadow: none;
}
.eventslist.list .event:hover .eventInfo a:hover {
  text-decoration: none;
}
.eventMembersTable .confirmed {
  background-color: #99ff99;
}
.eventMembersTable .confirmed:hover td {
  background-color: #99ff99;
}
.eventMembersTable .yes {
  background-color: #ccffcc;
}
.eventMembersTable .yes:hover td {
  background-color: #99ff99;
}
.eventMembersTable .maybe {
  background-color: #ffffcc;
}
.eventMembersTable .maybe:hover td {
  background-color: #ffff99;
}
.eventMembersTable .not {
  background-color: #ffcccc;
}
.eventMembersTable .not:hover td {
  background-color: #ff9999;
}
.eventMembersTable .no {
  background-color: #eee;
}
.eventMembersTable .no:hover td {
  background-color: #ccc;
}
.eventMembersTable .unreg {
  background-color: #eee;
}
.eventMembersTable .tableActions {
  text-align: right;
}
.eventMembersTable .profileType i.i.mdi:before {
  font-size: 16px;
}
.eventMembersTable .joinedWithUser {
  font-size: 11px;
}
.eventMembersTable span.joinedWithUser {
  color: #666;
}
.eventProfile .eventAttending {
  float: right;
  width: 80px;
  margin-top: 20px;
  margin-left: -80px;
}
.eventProfile .eventAttending .att {
  clear: both;
}
.eventProfile .eventAttending .att.attHeader {
  font-size: 12px;
  font-weight: 700;
}
.eventProfile .eventAttending .att .genderIcon {
  float: left;
}
.eventProfile .eventAttending .att .count {
  float: left;
  text-align: right;
  width: 30px;
}
.eventProfile .row.single .rowlabel {
  width: 25%;
}
.eventProfile .row.single .rowvalue {
  width: 50%;
}
.eventCannotJoinReason {
  margin: 10px 0 -10px 0;
  font-size: 12px;
  color: #666;
  font-weight: 700;
}
.eventCannotJoinReason.past {
  font-weight: 700;
}
.eventCannotJoinReason.nobody {
  font-weight: 500;
}
.eventCannotJoinReason.regonly {
  font-size: 14px;
  color: #9e0724;
  font-weight: 700;
}
.eventCannotJoinReason.certonly {
  font-size: 14px;
  color: #72323e;
  font-weight: 500;
}
.eventCannotJoinReason.membersonly {
  font-size: 14px;
  color: #72323e;
}
.eventCannotJoinReason.gendersonly {
  color: #5a7799;
  font-weight: 500;
}
.eventCannotJoinReason.absence {
  color: #9e075d;
  font-weight: 500;
}
.eventCannotJoinReason.banlist {
  color: #666666;
  font-weight: 500;
}
.memberProfileButtons.eventProfileButtons button {
  width: 100%;
  height: 100%;
  /*@media (max-width: 768px) {
            display: inline-grid;
            width: 72px;
        }*/
}
.memberProfileButtons.eventProfileButtons button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.memberProfileButtons.eventProfileButtons button.btnGreen {
  color: #003300;
  background: #99ff99;
  border: 1px solid #33cc33;
}
.memberProfileButtons.eventProfileButtons button.btnGreen.active {
  color: #fff;
  background: #006600;
  border: 1px solid #003300;
}
.memberProfileButtons.eventProfileButtons button.btnYellow {
  color: #333300;
  background: #ffff99;
  border: 1px solid #cccc66;
}
.memberProfileButtons.eventProfileButtons button.btnYellow.active {
  color: #fff;
  background: #666600;
  border: 1px solid #333300;
}
.memberProfileButtons.eventProfileButtons button.btnRed {
  color: #330000;
  background: #ffcccc;
  border: 1px solid #ff9999;
}
.memberProfileButtons.eventProfileButtons button.btnRed.active {
  color: #fff;
  background: #660000;
  border: 1px solid #330000;
}
@media (max-width: 1200px) {
}
@media (max-width: 550px) {
}
@media (max-width: 440px) {
}
.memberProfileButtons.eventProfileButtons .actionsButton {
  width: 100%;
  height: 100%;
}
.eventProfileTop .profileImg {
  text-align: center;
  width: 100%;
  padding: 4px;
  position: relative;
  max-height: 400px;
  overflow: hidden;
}
.eventProfileTop .profileImg > img {
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
  height: 100%;
  max-height: 400px;
}
.eventProfileTop .profileImg.noimg {
  max-height: 200px;
}
.eventProfileTop .profileImg.noimg > img {
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
  height: 100%;
  max-height: 200px;
}
@media (max-width: 550px) {
  .eventProfile {
    /*float: none;
        padding-top: 0;
        max-width: 200px;
        margin: 0 auto;*/
  }
}
.eventProfile .profileImg {
  text-align: center;
  width: 100%;
  border: 1px solid #ccc;
  padding: 4px;
  position: relative;
}
.eventProfile .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
.photoslist {
  display: flex;
  flex-wrap: wrap;
}
.photoslist .photo {
  padding: 5px;
  width: 25%;
}
@media (max-width: 650px) {
  .photoslist .photo {
    width: 33%;
    /*float: none;
            padding-top: 0;
            max-width: 200px;
            margin: 0 auto;*/
  }
}
@media (max-width: 550px) {
  .photoslist .photo {
    width: 50%;
    /*float: none;
            padding-top: 0;
            max-width: 200px;
            margin: 0 auto;*/
  }
}
.photoslist .photo .photoImg {
  text-align: center;
}
.photoslist .photo .photoImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 150px;
}
.photoslist .photo .photoName {
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  margin-top: 5px;
}
.acceptStatus-y {
  color: #006600;
}
.acceptStatus-n {
  color: #666600;
}
.acceptStatus-deny {
  color: #660000;
}
.albumslist {
  display: flex;
  /* flex-grow: 1; */
  flex-wrap: wrap;
}
.albumslist .album {
  margin: 5px;
  width: calc( 33.33% - 10px );
  /*flex-grow: 1;
        flex-shrink: 3;*/
  border: 1px solid #e6e6e6;
  border-radius: 0.25rem;
  overflow: hidden;
}
.albumslist .album .albumStatusInfo {
  margin-bottom: -30px;
  padding: 0;
  height: 30px;
  line-height: 30px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: #ccc;
  opacity: 0.7;
}
.albumslist .album.albumStatus-y .albumStatusInfo {
  background: #006600;
}
.albumslist .album.albumStatus-n .albumStatusInfo {
  background: #666600;
}
.albumslist .album.albumStatus-deny .albumStatusInfo {
  background: #660000;
}
.albumslist .album .albumDeletedInfo {
  margin-bottom: -60px;
  margin-top: 30px;
  padding: 0;
  height: 30px;
  line-height: 30px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: #333;
  opacity: 0.7;
}
@media (max-width: 550px) {
  .albumslist .album {
    width: calc( 50% - 10px );
    /*float: none;
            padding-top: 0;
            max-width: 200px;
            margin: 0 auto;*/
  }
}
.albumslist .album .albumImg {
  text-align: center;
  width: 100%;
  height: 200px;
}
.albumslist .album .albumImg img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 200px;
}
.albumslist .album .albumInfo {
  padding: 5px 10px;
}
.albumslist .album .albumName {
  font-size: 14px;
  font-weight: 700;
  text-align: left;
}
.albumslist .album .albumAuthor {
  font-size: 12px;
  font-weight: 500;
  text-align: left;
}
.albumslist .album .countIcon {
  font-size: 12px;
  font-weight: 500;
  float: left;
  margin-right: 15px;
  line-height: 30px;
  color: #999;
}
.albumslist .album .countIcon i.fa {
  font-size: 14px;
  margin-right: 5px;
}
.albumslist .album:hover .albumStatusInfo {
  opacity: 0.8;
}
.videoslist {
  display: flex;
  /* flex-grow: 1; */
  flex-wrap: wrap;
}
.videoslist .video {
  margin: 5px;
  width: calc( 50% - 10px );
  float: left;
  border: 1px solid #e6e6e6;
  border-radius: 0.25rem;
  overflow: hidden;
}
.videoslist .video .albumStatusInfo {
  margin-bottom: -30px;
  padding: 0;
  height: 30px;
  line-height: 30px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: #ccc;
  opacity: 0.7;
  position: relative;
  z-index: 1;
}
.videoslist .video.albumStatus-y .albumStatusInfo {
  background: #006600;
}
.videoslist .video.albumStatus-n .albumStatusInfo {
  background: #666600;
}
.videoslist .video.albumStatus-deny .albumStatusInfo {
  background: #660000;
}
.videoslist .video .albumDeletedInfo {
  margin-bottom: -60px;
  margin-top: 30px;
  padding: 0;
  height: 30px;
  line-height: 30px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: #333;
  opacity: 0.7;
}
@media (max-width: 550px) {
  .videoslist .video {
    width: calc( 100% - 10px );
    /*float: none;
            padding-top: 0;
            max-width: 200px;
            margin: 0 auto;*/
  }
}
.videoslist .video .videoImg {
  text-align: center;
  width: 100%;
  height: 200px;
}
.videoslist .video .videoImg img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 200px;
}
.videoslist .video .videoImg video {
  max-height: 100%;
}
.videoslist .video .videoVid {
  text-align: center;
  width: 100%;
}
.videoslist .video .videoVid video {
  max-height: 100%;
}
.videoslist .video .videoInfo {
  padding: 5px 10px;
}
.videoslist .video .videoName {
  font-size: 16px;
  font-weight: 700;
  text-align: left;
}
.videoslist .video .videoAuthor {
  font-size: 12px;
  font-weight: 500;
  text-align: left;
}
.videoslist .video .countIcon {
  font-size: 12px;
  font-weight: 500;
  float: left;
  margin-right: 15px;
  line-height: 30px;
  color: #999;
}
.videoslist .video .countIcon i.fa {
  font-size: 14px;
  margin-right: 5px;
}
.listDeletedInfo {
  margin-bottom: -30px;
  padding: 0;
  height: 30px;
  line-height: 30px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: #333;
  opacity: 0.7;
}
.datinglist .dating {
  padding: 5px;
  float: none;
  border-bottom: 1px solid #ccc;
}
.datinglist .dating:after {
  content: "";
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
.datinglist .dating:last-child {
  border-bottom: none;
}
.datinglist .dating .datingDate {
  text-align: right;
  float: right;
  font-size: 12px;
  color: #666;
}
.datinglist .dating .datingUser {
  text-align: left;
  float: left;
  font-weight: 600;
}
.datinglist .dating .datingDesc {
  font-weight: 500;
  font-size: 12px;
  clear: both;
}
.datinglist .dating .sexContent {
  float: right;
  padding: 0 0 20px 20px;
  text-align: center;
  font-size: 12px;
  color: #666;
  width: 100px;
}
.groupProfileTop {
  padding: 0;
}
.groupProfileTop .py-2 {
  display: block;
}
.groupProfileTop .groupProfilePhoto {
  float: left;
  margin: -15px -15px 15px -15px;
  width: calc( 100% + 30px );
}
@media (max-width: 550px) {
  .groupProfileTop .groupProfilePhoto {
    float: none;
    padding-top: 0;
  }
}
.groupProfileTop .groupProfilePhoto .profileImg {
  text-align: center;
  width: 100%;
  height: auto;
  padding: 0;
  position: relative;
}
.groupProfileTop .groupProfilePhoto .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  max-height: 150px;
}
.groupProfileTop .groupProfileInfo {
  clear: both;
  padding-top: 20px;
  margin-left: 0;
  width: auto;
}
@media (max-width: 770px) {
  .groupProfileTop .groupProfileInfo {
    clear: unset;
    float: right;
    padding-top: 0;
    width: 55%;
  }
}
@media (max-width: 550px) {
  .groupProfileTop .groupProfileInfo {
    clear: both;
    float: none;
    padding-top: 20px;
    width: auto;
  }
}
.groupslist {
  display: flex;
  flex-wrap: wrap;
}
.groupslist .group {
  padding: 0;
  float: left;
  border: 1px solid #eee;
  background: #fff;
  height: 90px;
  border-radius: 0.25rem;
  overflow: hidden;
  margin: 5px;
  width: calc( 50% - 10px );
  box-shadow: 0px 1px 3px -1px rgba(0, 0, 0, 0.2);
}
@media (max-width: 576px) {
  .groupslist .group {
    width: calc( 100% - 10px );
  }
}
.groupslist .group i.i {
  color: #ccc;
  display: inline-block;
  margin-right: 4px;
  line-height: 14px;
  vertical-align: middle;
}
.groupslist .group i.i.mdi:before {
  font-size: 14px;
  line-height: 14px;
}
.groupslist .group .groupImg {
  display: block;
  text-align: center;
  float: left;
  width: 100%;
}
.groupslist .group .groupImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 90px;
}
.groupslist .group .groupInfo {
  margin-top: -90px;
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  float: left;
  padding: 10px;
  height: 90px;
  position: relative;
  transition: 0.1s 0.5s all;
  color: #fff;
}
.groupslist .group .groupDate {
  text-align: right;
  float: right;
  font-size: 12px;
  color: #333;
  margin-left: 20px;
  color: #eee;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.groupslist .group .groupMemberCount {
  text-align: right;
  float: right;
  font-size: 12px;
  color: #333;
  margin-left: 20px;
  color: #eee;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.groupslist .group .groupName {
  text-align: left;
  float: none;
  font-weight: 600;
  margin-bottom: 10px;
  height: 40px;
}
.groupslist .group .groupName a {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.groupslist .group .groupName a:hover {
  text-decoration: none;
}
.groupslist .group .groupUser {
  text-align: left;
  float: left;
  font-size: 12px;
  font-weight: 400;
}
.groupslist .group .groupUser a {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
}
.groupslist .group .groupUser a:hover {
  text-decoration: none;
}
.groupslist .group .groupDesc {
  font-weight: 500;
  font-size: 11px;
  color: #999;
  clear: both;
  padding: 5px 0;
  display: none;
}
.blogslist .blog .postTitle {
  margin: 0px -15px -15px -15px;
  padding: 20px;
}
.blogslist .blog .postContent {
  margin: -15px;
  padding: 20px;
  overflow: hidden;
}
.blogslist .blog .blogDate {
  text-align: right;
  float: right;
  font-size: 12px;
  color: #666;
  margin-left: 20px;
}
.blogslist .blog .blogName {
  text-align: left;
  font-size: 16px;
  font-weight: 600;
}
.blogslist .blog .blogUser {
  text-align: left;
  float: right;
  font-size: 12px;
  font-weight: 600;
}
.blogslist .blog .blogDesc {
  font-weight: 500;
  font-size: 12px;
  clear: both;
}
.blogClass.b1 {
  background: #ffeeee;
}
.blogClass.b1.fg {
  color: #ffcccc;
  background: unset;
}
.blogClass.b2 {
  background: #fff6ee;
}
.blogClass.b2.fg {
  color: #ffe6cc;
  background: unset;
}
.blogClass.b3 {
  background: #ffffee;
}
.blogClass.b3.fg {
  color: #ffffcc;
  background: unset;
}
.blogClass.b4 {
  background: #f6ffee;
}
.blogClass.b4.fg {
  color: #e6ffcc;
  background: unset;
}
.blogClass.b5 {
  background: #eeffee;
}
.blogClass.b5.fg {
  color: #ccffcc;
  background: unset;
}
.blogClass.b6 {
  background: #eefff6;
}
.blogClass.b6.fg {
  color: #ccffe6;
  background: unset;
}
.blogClass.b7 {
  background: #eeffff;
}
.blogClass.b7.fg {
  color: #ccffff;
  background: unset;
}
.blogClass.b8 {
  background: #eef6ff;
}
.blogClass.b8.fg {
  color: #cce6ff;
  background: unset;
}
.blogClass.b9 {
  background: #eeeeff;
}
.blogClass.b9.fg {
  color: #ccccff;
  background: unset;
}
.blogClass.b10 {
  background: #f6eeff;
}
.blogClass.b10.fg {
  color: #e6ccff;
  background: unset;
}
.blogClass.b11 {
  background: #ffeeff;
}
.blogClass.b11.fg {
  color: #ffccff;
  background: unset;
}
.blogClass.b12 {
  background: #ffeef6;
}
.blogClass.b12.fg {
  color: #ffcce6;
  background: unset;
}
.blogPost .blogDate {
  text-align: right;
  float: right;
  font-size: 12px;
  color: #666;
  margin-left: 20px;
}
.blogPost .blogTitle {
  text-align: left;
  float: left;
  font-weight: 600;
  color: #9b2621;
}
.blogPost .blogUser {
  text-align: left;
  float: right;
  font-size: 12px;
  font-weight: 600;
}
.blogPost .blogDesc {
  font-weight: 500;
  font-size: 12px;
  clear: both;
}
.storieslist .story .postTitle {
  margin: 0px -15px -15px -15px;
  padding: 20px;
}
.storieslist .story .postContent {
  margin: -15px;
  padding: 20px;
  overflow: hidden;
}
.storieslist .story .storyDate {
  text-align: right;
  float: right;
  font-size: 12px;
  color: #666;
  margin-left: 20px;
}
.storieslist .story .storyName {
  text-align: left;
  float: left;
  font-weight: 600;
}
.storieslist .story .storyUser {
  text-align: left;
  float: right;
  font-size: 12px;
  font-weight: 600;
}
.storieslist .story .storyDesc {
  font-weight: 500;
  font-size: 12px;
  clear: both;
}
.storyPost .storyDate {
  text-align: right;
  float: right;
  font-size: 12px;
  color: #666;
  margin-left: 20px;
}
.storyPost .storyTitle {
  text-align: left;
  float: left;
  font-weight: 600;
  color: #9b2621;
}
.storyPost .storyUser {
  text-align: left;
  float: right;
  font-size: 12px;
  font-weight: 600;
}
.storyPost .storyDesc {
  font-weight: 500;
  font-size: 12px;
  clear: both;
}
.articleslist .article .postTitle {
  margin: 0px -15px -15px -15px;
  padding: 20px;
}
.articleslist .article .postContent {
  margin: -15px;
  padding: 20px;
  overflow: hidden;
}
.articleslist .article .postImage {
  margin: 0 0 20px 20px;
  float: right;
  width: 40%;
  padding: 0;
}
.articleslist .article .postImage img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.articleslist .article .postSource {
  font-size: 11px;
  text-align: right;
}
.articleslist .article .articleDate {
  text-align: right;
  float: right;
  font-size: 12px;
  color: #666;
  margin-left: 20px;
}
.articleslist .article .articleName {
  text-align: left;
  float: left;
  font-weight: 600;
}
.articleslist .article .articleUser {
  text-align: left;
  float: right;
  font-size: 12px;
  font-weight: 600;
}
.articleslist .article .articleDesc {
  font-weight: 500;
  font-size: 12px;
  clear: both;
}
.articleslist.list .article .postTitle {
  margin: 0px -15px 0px -15px;
  padding: 0 20px;
  float: left;
  width: calc( 100% - 100px );
}
.articleslist.list .article .postImage {
  margin: -15px -15px -15px -15px;
  float: right;
  width: 140px;
  padding: 0 0 0 20px;
}
.articleslist.list .article .postImage img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.articlePost .articleDate {
  text-align: right;
  float: right;
  font-size: 12px;
  color: #666;
  margin-left: 20px;
}
.articlePost .articleTitle {
  text-align: left;
  float: left;
  font-weight: 600;
  color: #9b2621;
}
.articlePost .articleUser {
  text-align: left;
  float: right;
  font-size: 12px;
  font-weight: 600;
}
.articlePost .articleDesc {
  font-weight: 500;
  font-size: 12px;
  clear: both;
}
.postComments .reply:hover > .postActions {
  opacity: 1;
}
.walllist .wall {
  padding: 15px 15px 4px 15px;
  float: none;
  border-bottom: 1px solid #ccc;
}
.walllist .wall:after {
  content: "";
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
.walllist .wall.inactive {
  opacity: 0.5;
}
.walllist .wall:last-child {
  border-bottom: none;
}
.walllist .wall:hover .postActions {
  opacity: 1;
}
.wallbanner {
  padding: 10px;
}
.wallbanner img {
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
}
.invitePeople .inviteButton {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.invitePeople .inviteButton i.i {
  color: #9b2621;
  display: block;
  float: right;
  margin-left: 20px;
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
}
.invitePeople .inviteButton i.i.mdi:before {
  font-size: 40px;
  line-height: 40px;
}
.invitePeople .inviteButton:hover i.i {
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
}
.instaStoriesList {
  display: flex;
}
.instaStoriesList.listWrap {
  flex-flow: wrap;
}
@media (max-width: 768px) {
  .instaStoriesList.listWrap .instaStory {
    width: 33.3%;
    padding-bottom: 52%;
  }
}
.instaStoriesList .instaStory {
  width: 20%;
  cursor: pointer;
  position: relative;
  padding-bottom: 32%;
}
.instaStoriesList .instaStory .instaStoryText {
  position: absolute;
  color: #fff;
  font-size: 12px;
  font-weight: 400;
}
@media (max-width: 768px) {
  .instaStoriesList .instaStory .instaStoryText {
    font-size: 10px;
  }
}
@media (max-width: 576px) {
  .instaStoriesList .instaStory .instaStoryText {
    font-size: 8px;
  }
}
.instaStoriesList .instaStory .instaStoryPhoto {
  position: absolute;
  width: 100%;
  height: 100%;
}
.instaStoriesList .instaStory .instaStoryPhoto img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.instaStoriesList .instaStory .instaStoryVideo {
  position: absolute;
  width: 100%;
  height: 100%;
}
.instaStoriesList .instaStory .instaStoryVideo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.instaStoriesList .instaStory .instaStoryVideo video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.instaStoriesList .instaStory .instaStoryVideo .instaActionIcon {
  opacity: 0.5;
}
.instaStoriesList .instaStory .instaStoryAvatar {
  position: relative;
  padding: 10px 10px 0 10px;
}
@media (max-width: 768px) {
  .instaStoriesList .instaStory .instaStoryAvatar {
    padding: 5px 5px 0 5px;
  }
  .instaStoriesList .instaStory .instaStoryAvatar .avatar {
    width: 30px;
    height: 30px;
  }
}
.instaStoriesList .instaStory .instaStoryName {
  position: relative;
  padding: 0 10px 10px 10px;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
}
@media (max-width: 768px) {
  .instaStoriesList .instaStory .instaStoryName {
    padding: 0 5px 5px 5px;
    font-size: 11px;
  }
}
.instaStoriesList .instaStory .instaStoryFrame {
  overflow: hidden;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transform-origin: center;
  transition: 0.2s all;
  position: absolute;
  top: 5px;
  bottom: 5px;
  left: 5px;
  right: 5px;
}
.instaStoriesList .instaStory .instaStoryFrame:hover {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}
.instaStoriesList .instaStory.instaStoryCreate .instaStoryClass {
  background: #ccc;
}
.instaStoriesList .instaStory.instaStoryCreate .instaStoryAvatar {
  padding: 0;
}
.instaStoriesList .instaStory.instaStoryCreate .instaStoryAvatar .avatar {
  width: 100%;
  height: auto;
}
.instaStoriesList .instaStory.instaStoryCreate .instaStoryAvatar .avatar > img {
  border-radius: 0;
}
.instaStoriesList .instaStory.instaStoryOpenAll {
  text-decoration: none;
}
.instaStoriesList .instaStory.instaStoryOpenAll .instaStoryClass {
  background: #ccc;
}
.instaStoriesList .instaStory.instaStoryOpenAll:hover {
  text-decoration: none;
}
.instaStoriesList .instaStory .instaActionIcon {
  position: absolute;
  top: calc( 60% - 17px );
  left: calc( 50% - 17px );
  text-align: center;
}
.instaStoriesList .instaStory .instaActionIcon i.i {
  border: 2px solid #ccc;
  width: 34px;
  height: 34px;
  display: inline-block;
  border-radius: 50%;
  line-height: 30px;
  color: #fff;
  background: #666;
}
.instaStoriesList .instaStory .instaActionIcon i.i.mdi:before {
  font-size: 24px;
  line-height: 30px;
}
.instaStoriesList .instaStory .listDeletedInfo {
  background: rgba(0, 0, 0, 0.75);
  opacity: 1;
  position: absolute;
  top: 50px;
  width: 100%;
}
.instaStoryList .instaStory {
  width: 100%;
  /* whatever width you like */
  position: relative;
  /* so .content can use position: absolute */
}
.instaStoryList .instaStory:after {
  padding-top: 160%;
  /* percentage of containing block _width_ */
  display: block;
  content: '';
}
.instaStoryList .instaStory .instaStoryText {
  position: absolute;
  color: #fff;
  font-size: 60px;
  font-weight: 400;
}
@media (max-width: 768px) {
}
@media (max-width: 576px) {
}
.instaStoryList .instaStory .instaStoryPhoto {
  position: absolute;
  width: 100%;
  height: 100%;
}
.instaStoryList .instaStory .instaStoryPhoto img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.instaStoryList .instaStory .instaStoryVideo {
  position: absolute;
  width: 100%;
  height: 100%;
}
.instaStoryList .instaStory .instaStoryVideo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.instaStoryList .instaStory .instaStoryVideo video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.instaStoryList .instaStory .instaStoryVideo .instaActionIcon {
  opacity: 0.5;
}
.instaStoryList .instaStory .instaStoryAvatar {
  position: relative;
  padding: 10px 10px 0 10px;
  z-index: 3;
}
@media (max-width: 768px) {
  .instaStoryList .instaStory .instaStoryAvatar {
    padding: 5px 5px 0 5px;
  }
}
.instaStoryList .instaStory .instaStoryAvatar .avatar {
  float: left;
  margin-right: 0;
}
.instaStoryList .instaStory .instaStoryName {
  position: relative;
  padding: 0 10px 10px 10px;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  float: left;
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.75);
  line-height: 40px;
}
@media (max-width: 768px) {
  .instaStoryList .instaStory .instaStoryName {
    padding: 0 5px 5px 5px;
    font-size: 11px;
  }
}
.instaStoryList .instaStory .instaStoryFrame {
  overflow: hidden;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  position: relative;
  transform-origin: center;
  transition: 0.2s all;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  /* follow the parent's edges */
}
.instaStoryList .instaStory .instaStoryFrame:hover {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}
.instaStoryList .carousel-indicators {
  top: 0;
  bottom: unset;
}
.instaStoryModal .modal-content {
  border-radius: 1rem;
  background: rgba(0, 0, 0, 0.75);
}
.instaStoryModal .modal-content .modal-header {
  position: absolute;
  z-index: 5;
  width: auto;
  right: 0;
  border-bottom: none;
}
.instaStoryModal .modal-content .modal-body {
  padding: 0;
}
.instaStoryModal .modal-content .loading {
  width: 100%;
  /* whatever width you like */
  position: relative;
  /* so .content can use position: absolute */
}
.instaStoryModal .modal-content .loading > div {
  color: #fff;
  position: relative;
  margin-top: 80%;
  margin-bottom: -80%;
}
.instaStoryModal .modal-content .loading:after {
  padding-top: calc( 160% - 20px );
  display: block;
  content: ' ';
}
.instaStoryModal .messageForm {
  position: absolute;
  bottom: 5px;
  left: 5px;
  right: 5px;
  opacity: 0.7;
  margin: 0;
  z-index: 20;
}
.instaStoryModal .messageForm:hover,
.instaStoryModal .messageForm:focus-within {
  opacity: 1;
}
.instaStoryModal .messageForm:empty {
  padding: 0;
}
.instaStoryModal .messageForm .messagesDisabled {
  color: #666;
  line-height: 40px;
  font-size: 12px;
  text-align: center;
}
.instaStoryModal .messageForm .commentProfile {
  width: 50px;
  height: 40px;
  float: left;
}
.instaStoryModal .messageForm .commentProfile .profileImg {
  float: left;
  text-align: left;
  margin-right: 10px;
  border-radius: 50%;
  overflow: hidden;
}
.instaStoryModal .messageForm .commentProfile .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 40px;
  height: 40px;
}
.instaStoryModal .messageForm .preview {
  padding: 10px;
  height: 110px;
}
.instaStoryModal .messageForm .preview img,
.instaStoryModal .messageForm .preview video {
  max-height: 100px;
  float: left;
}
.instaStoryModal .messageForm .preview:empty {
  padding: 0;
  height: 0;
}
.instaStoryModal .messageForm .preview .remove {
  float: left;
  margin-left: 10px;
  text-align: center;
  width: 24px;
  height: 24px;
  cursor: pointer;
  border: 1px solid #6d0015;
  border-radius: 50%;
  background: #9b2621;
  color: #fff;
}
.instaStoryModal .messageForm .commentInput {
  width: auto;
  float: none;
  display: flex;
}
.instaStoryModal .messageForm .commentInput .commentField {
  position: relative;
  width: calc( 100% - 40px );
  transition: 0.1s all;
}
.instaStoryModal .messageForm .commentInput .commentField .comment {
  text-align: left;
  border-radius: 20px;
  border: 1px solid #ccc;
  overflow: hidden;
  width: 100%;
  height: 40px;
  outline: 0;
  resize: none;
  padding: 8px 30px 8px 12px;
  margin-bottom: -8px;
}
.instaStoryModal .messageForm .commentInput .commentField .comment:focus {
  border-color: #9b2621;
}
.instaStoryModal .messageForm .commentInput .commentField .buttonEmoji {
  display: inline-block;
  position: absolute;
  border: none;
  cursor: pointer;
  top: 0;
  right: 0;
  border-radius: 50%;
  color: #666;
  background-color: transparent;
  width: 40px;
  height: 40px;
  transition: 0.1s all;
}
.instaStoryModal .messageForm .commentInput .commentField .buttonEmoji:hover {
  background: #ccc;
}
.instaStoryModal .messageForm .commentInput .commentField .buttonEmoji i.i {
  display: inline-block;
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
}
.instaStoryModal .messageForm .commentInput .commentField .buttonEmoji i.i::before {
  height: 40px;
  width: 40px;
  line-height: 40px;
}
.instaStoryModal .messageForm .commentInput .commentButtons {
  float: right;
  width: 40px;
  display: flex;
  transition: 0.1s all;
}
.instaStoryModal .messageForm .commentInput .commentButtons div.button {
  display: inline-block;
  right: 0;
  position: relative;
  border: none;
  cursor: pointer;
  color: #666;
  background-color: transparent;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  transition: 0.1s all;
}
.instaStoryModal .messageForm .commentInput .commentButtons div.button:hover {
  background: #ccc;
}
.instaStoryModal .messageForm .commentInput .commentButtons div.button i.i {
  display: inline-block;
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
}
.instaStoryModal .messageForm .commentInput .commentButtons div.button i.i::before {
  height: 40px;
  width: 40px;
  line-height: 40px;
}
.instaStoryModal .messageForm .commentInput .commentButtons div.button input[type=file] {
  width: 40px;
  height: 40px;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  font-size: 0;
  opacity: 0;
}
.instaStoryModal .messageForm .commentInput .commentButtons div.button.buttonSubmit button {
  outline: 0;
  width: 40px;
  height: 40px;
  padding: 0;
  border: none;
  cursor: pointer;
  top: 0;
  right: 0;
  border-radius: 50%;
  color: #666;
  background: transparent;
  transition: 0.1s all;
}
.instaStoryModal .messageForm .commentInput .commentButtons div.button.buttonSubmit button:hover {
  background: #ccc;
}
.instaStoryModal .messageForm .commentInput .comment {
  text-align: left;
  border-radius: 20px;
  border: 1px solid #ccc;
  overflow: hidden;
  height: 40px;
  outline: 0;
  resize: none;
  padding: 8px 12px;
  margin-bottom: -8px;
}
.instaStoryModal .messageForm .commentInput .comment:focus {
  border-color: #9b2621;
}
.instaStoryModal .messageForm .commentInput.fullWidth {
  display: block;
  float: none;
  width: 100%;
}
.instaStoryModal .messageForm .commentInput.fullWidth .commentField {
  position: relative;
  width: 100%;
}
.instaStoryModal .messageForm .commentInput.fullWidth .commentButtons {
  margin-top: 2px;
}
.instaStoryModal .messageForm .commentInput.fullWidth:after {
  content: "";
  clear: both;
  display: table;
}
.instaStoryModal .listDeletedInfo {
  background: rgba(0, 0, 0, 0.75);
  opacity: 1;
  position: absolute;
  top: 50px;
  width: 100%;
}
.instaStorySelection {
  display: none;
}
.instaStorySelection.active {
  display: flex;
}
.instaStorySelection .instaStorySel {
  width: 33.3%;
  padding: 5px;
  cursor: pointer;
  position: relative;
  padding-bottom: 53%;
}
.instaStorySelection .instaStorySel .instaStorySelFrame {
  background: #ccc;
  overflow: hidden;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  transition: 0.2s all;
  position: absolute;
  top: 5px;
  bottom: 5px;
  left: 5px;
  right: 5px;
}
.instaStorySelection .instaStorySel .instaStorySelFrame:hover {
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.25);
}
.instaStorySelection .instaStorySel .instaStorySelFrame .instaStoryIcon {
  text-align: center;
}
.instaStorySelection .instaStorySel .instaStorySelFrame .instaStoryIcon i.i {
  border: 2px solid #fff;
  width: 54px;
  height: 54px;
  display: inline-block;
  border-radius: 50%;
  line-height: 50px;
  color: #fff;
  background: #666;
}
.instaStorySelection .instaStorySel .instaStorySelFrame .instaStoryIcon i.i.mdi:before {
  font-size: 24px;
  line-height: 50px;
}
.instaStorySelection .instaStorySel .instaStorySelFrame .instaStoryText {
  color: #fff;
  text-align: center;
  font-weight: 700;
  height: 40px;
}
.instaStorySelection .instaStorySel .instaStorySelFrame.selText {
  /*background-color: #ffbd77;
                background-image: linear-gradient(319deg, #ffbd77 0%, #f0f4a4 37%, #acfcd9 100%);*/
  background-color: #c73e1d;
  background-image: linear-gradient(315deg, #c73e1d 0%, #a23b72 37%, #2e86ab 100%);
}
.instaStorySelection .instaStorySel .instaStorySelFrame.selImage {
  background-color: #663dff;
  background-image: linear-gradient(319deg, #663dff 0%, #aa00ff 37%, #cc4499 100%);
}
.instaStorySelection .instaStorySel .instaStorySelFrame.selVideo {
  background-color: #d3212d;
  background-image: linear-gradient(319deg, #d3212d 0%, #009245 37%, #ffbf00 100%);
}
.instaStorySelection .instaStorySel .instaStorySelFrame input[type=file] {
  width: 100%;
  height: 100%;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  font-size: 0;
  opacity: 0;
}
.instaStoryEditor {
  display: none;
}
.instaStoryEditor.active {
  display: block;
}
.instaStoryEditor .instaStoryEditorHeader {
  height: 40px;
}
.instaStoryEditor .instaStoryEditorHeader .actionsButton {
  right: unset;
  left: 15px;
  top: 15px;
}
.instaStoryEditor .instaStoryEditorHeader .headerText {
  margin-left: 40px;
  font-weight: 600;
}
.instaStoryEditor .instaEditorButtons {
  display: flex;
  flex-direction: column;
  width: 50px;
  position: absolute;
  left: 0;
}
.instaStoryEditor .instaEditorButtons.right {
  left: unset;
  right: 0;
}
.instaStoryEditor .instaEditorButtons .instaEditorButton {
  height: 40px;
  width: 40px;
  margin: 4px;
  border-radius: 50%;
  background-color: #eee;
  text-align: center;
  border: 1px solid transparent;
  cursor: pointer;
}
.instaStoryEditor .instaEditorButtons .instaEditorButton i.i.mdi:before {
  line-height: 40px;
}
.instaStoryEditor .instaEditorButtons .instaEditorButton.active {
  border-color: #ccc;
}
.instaStoryEditor .instaEditorButtons .instaEditorButton.file {
  position: relative;
}
.instaStoryEditor .instaEditorButtons .instaEditorButton.file input {
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  font-size: 0;
}
.instaStoryPreview {
  overflow: hidden;
  border-radius: 10px;
  max-height: 600px;
  max-width: 80%;
  margin: 0 auto;
  aspect-ratio: 0.625;
  width: 100%;
  /* whatever width you like */
  position: relative;
  /* so .content can use position: absolute */
}
.instaStoryPreview:after {
  padding-top: 160%;
  /* percentage of containing block _width_ */
  display: block;
  content: '';
}
.instaStoryPreview.instaText {
  /*.textContainer {
            position: absolute;
            &:focus, &:hover {
                .buttonIcon {
                    color: #fff;
                }
                textarea {
                    border-color: #fff;
                    background: rgba(0,0,0,.1);
                }
            }
        }*/
}
.instaStoryPreview.instaText .buttonIcon {
  color: rgba(255, 255, 255, 0.25);
}
.instaStoryPreview.instaText .buttonIcon:hover {
  background-color: #666;
}
.instaStoryPreview.instaPhoto {
  touch-action: none;
}
.instaStoryPreview.instaPhoto img {
  /*width: 100%;
            height: 100%;
            object-fit: cover;*/
}
.instaStoryPreview.instaVideo video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.instaStoryPreview textarea {
  transform: translate(10%, 10%);
  resize: none;
  border: 1px solid transparent;
  outline: 0;
  background: transparent;
  width: 50%;
  height: 50%;
  border-radius: 10px;
  padding: 10px;
  font-size: 36px;
  color: #fff;
  border-color: rgba(255, 255, 255, 0.25);
  touch-action: none;
  box-sizing: border-box;
  transform-origin: center;
  position: absolute;
  top: 0;
  left: 0;
}
.instaStoryPreview textarea:focus,
.instaStoryPreview textarea:hover {
  border-color: #fff;
  background: rgba(0, 0, 0, 0.1);
}
.instaStoryClass {
  background: #000;
  background-position: center;
}
.instaStoryClass.classA {
  background-color: #ffbd77;
  background-image: linear-gradient(319deg, #ffbd77 0%, #f0f4a4 37%, #acfcd9 100%);
}
.instaStoryClass.classB {
  background-color: #c73e1d;
  background-image: linear-gradient(315deg, #c73e1d 0%, #a23b72 37%, #2e86ab 100%);
}
.instaStoryClass.classC {
  background-color: #663dff;
  background-image: linear-gradient(319deg, #663dff 0%, #aa00ff 37%, #cc4499 100%);
}
.instaStoryClass.classD {
  background-color: #d3212d;
  background-image: linear-gradient(319deg, #d3212d 0%, #009245 37%, #ffbf00 100%);
}
.instaStoryClass.classE {
  background-color: #e4ff6d;
  background-image: linear-gradient(319deg, #e4ff6d 0%, #ffad42 37%, #e4ff6d 100%);
}
.instaStoryClass.classF {
  background-color: #ff1493;
  background-image: linear-gradient(319deg, #ff1493 0%, #0000ff 37%, #ff8c00 100%);
}
.instaStoryClass.classG {
  background-color: #7fd82b;
  background-image: linear-gradient(319deg, #7fd82b 0%, #ef4063 37%, #e557c6 100%);
}
.instaStoryClass.classH {
  background-color: #ff7d59;
  background-image: linear-gradient(319deg, #ff7d59 0%, #ff583a 37%, #f4a698 100%);
}
.gradientBackground {
  background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);
  background-size: 300% 300%;
}
.gradientBackground.animated {
  -webkit-animation: animatedgradient 3s ease alternate infinite;
          animation: animatedgradient 3s ease alternate infinite;
}
@-webkit-keyframes animatedgradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@keyframes animatedgradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
.postList .postHeader .postInfo {
  float: left;
  margin-left: 10px;
}
.postList .postHeader .postInfo .postDate {
  font-size: 12px;
  color: #666;
}
.postList .postHeader .postInfo .postUser {
  text-align: left;
  color: #666;
}
.postList .postHeader .postInfo .postUser a {
  font-weight: 600;
}
.postList .postActions {
  position: absolute;
  top: 10px;
  right: 10px;
  opacity: 0;
}
.postList .postActions.noHide {
  opacity: 1;
}
.postList .postActions.second {
  right: 40px;
  opacity: 1;
}
@media (max-width: 768px) {
  .postList .postActions {
    opacity: 1;
  }
}
.postList .postActions .buttonIcon {
  color: #ccc;
}
.postList .postActions .buttonIcon:hover {
  color: #666;
  background: #eee;
}
.postList .postActions .buttonIcon:focus {
  color: #fff;
  background: #9b2621;
}
.postList .postActions .actionsMenu {
  display: none;
  position: absolute;
  top: 30px;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  z-index: 10;
  flex-direction: column;
}
.postList .postActions .actionsMenu .buttonIcon {
  display: inline-block;
  float: left;
}
.postList .postActions.active {
  opacity: 1;
}
.postList .postActions.active > .buttonIcon {
  color: #fff;
  background: #9b2621;
}
.postList .postActions.active .actionsMenu {
  display: flex;
}
.postList .postActions.collision .actionsMenu {
  flex-direction: column-reverse;
  top: unset;
  bottom: 30px;
}
.postList .postContent {
  font-weight: 400;
  font-size: 16px;
  clear: both;
}
.postList .postContent.small {
  font-size: 14px;
}
.postList .postContent .postText {
  padding: 15px 0;
}
.postList .postContent .postPhoto {
  margin: 0 -15px;
}
.postList .postContent .postPhoto .photoImg {
  text-align: center;
  background: #e3e3e3;
}
.postList .postContent .postPhoto .photoImg img {
  max-height: 600px;
  min-height: 200px;
  max-width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.postList .postContent .postVideo {
  margin: 0 -15px;
}
.postList .postContent .postVideo video {
  max-height: 600px;
  max-width: 100%;
  background-color: #e3e3e3;
}
.postList .postContent .postVideo .plyr__poster {
  background-color: #e3e3e3;
}
.postList .postContent .postVideo .videoImg {
  text-align: center;
  background: #e3e3e3;
}
.postList .postContent .postVideo .videoImg img {
  max-height: 600px;
  min-height: 200px;
  max-width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.postList .postTitle {
  font-weight: 600;
  font-size: 16px;
  clear: both;
  padding: 10px 0 20px 0;
}
.postList .postRepost {
  margin-top: 15px;
  border: 1px solid #e3e3e3;
  padding: 15px 15px 0 15px;
  border-radius: 0.25rem;
  overflow: hidden;
}
.postList .postRepost .postContent {
  margin-bottom: 0;
}
.postList .postRepost .postContent .postPhoto {
  margin: 15px -15px 0 -15px;
}
.postList .postRepost .postContent .postVideo {
  margin: 15px -15px 0 -15px;
}
.postList .postRepost .repostRemoved {
  padding: 0 0 15px 0;
  text-align: center;
  color: #999;
  font-size: 12px;
  font-weight: 700;
}
.postList .postComments {
  padding-left: 0;
}
.postList .postComments .photoImg img {
  max-width: 100%;
}
.postList .postComments .empty {
  padding: 6px 0 16px 0;
  font-size: 12px;
  text-align: center;
  color: #999;
}
.postList .postComments .postComments {
  padding-left: 10px;
}
.postList .postComments .postComments .postComments {
  padding-left: 10px;
}
.postList:hover .postHeader .postActions {
  opacity: 1;
}
.postList:hover .postHeader .postActions .postAction {
  display: block;
}
.newPost,
.editPost,
.sharePost {
  clear: both;
}
.newPost .commentButtons,
.editPost .commentButtons,
.sharePost .commentButtons {
  display: flex;
}
.newPost .commentButtons .likes,
.editPost .commentButtons .likes,
.sharePost .commentButtons .likes,
.newPost .commentButtons .comments,
.editPost .commentButtons .comments,
.sharePost .commentButtons .comments,
.newPost .commentButtons .shares,
.editPost .commentButtons .shares,
.sharePost .commentButtons .shares {
  line-height: 40px;
  flex: 1;
  text-align: center;
}
.newPost .commentButtons .likes a,
.editPost .commentButtons .likes a,
.sharePost .commentButtons .likes a,
.newPost .commentButtons .comments a,
.editPost .commentButtons .comments a,
.sharePost .commentButtons .comments a,
.newPost .commentButtons .shares a,
.editPost .commentButtons .shares a,
.sharePost .commentButtons .shares a {
  color: #999;
  display: block;
  text-align: center;
}
.newPost .postForm,
.editPost .postForm,
.sharePost .postForm {
  margin: 0;
}
.newPost .postForm .commentProfile,
.editPost .postForm .commentProfile,
.sharePost .postForm .commentProfile {
  width: 50px;
  height: 40px;
  float: left;
}
.newPost .postForm .commentProfile .profileImg,
.editPost .postForm .commentProfile .profileImg,
.sharePost .postForm .commentProfile .profileImg {
  float: left;
  text-align: left;
  margin-right: 10px;
  border-radius: 50%;
  overflow: hidden;
}
.newPost .postForm .commentProfile .profileImg > img,
.editPost .postForm .commentProfile .profileImg > img,
.sharePost .postForm .commentProfile .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 40px;
  height: 40px;
}
.newPost .postForm .preview,
.editPost .postForm .preview,
.sharePost .postForm .preview {
  padding: 10px;
  height: 110px;
  clear: both;
}
.newPost .postForm .preview img,
.editPost .postForm .preview img,
.sharePost .postForm .preview img,
.newPost .postForm .preview video,
.editPost .postForm .preview video,
.sharePost .postForm .preview video {
  max-height: 100px;
  float: left;
}
.newPost .postForm .preview:empty,
.editPost .postForm .preview:empty,
.sharePost .postForm .preview:empty {
  padding: 0;
  height: 0;
}
.newPost .postForm .preview .remove,
.editPost .postForm .preview .remove,
.sharePost .postForm .preview .remove {
  float: left;
  margin-left: 10px;
  text-align: center;
  width: 24px;
  height: 24px;
  cursor: pointer;
  border: 1px solid #6d0015;
  border-radius: 50%;
  background: #9b2621;
  color: #fff;
}
.newPost .postForm .sending,
.editPost .postForm .sending,
.sharePost .postForm .sending {
  height: 22px;
  margin-top: -30px;
  line-height: 20px;
  text-align: center;
  color: #333;
  background: transparent;
  font-size: 12px;
  font-weight: 500;
  opacity: 0.7;
  transform-origin: bottom;
  transition: transform 0.2s;
  transform: scaleY(0);
}
.newPost .postForm .sending.active,
.editPost .postForm .sending.active,
.sharePost .postForm .sending.active {
  transform: scaleY(1);
}
.newPost .postForm .commentInput,
.editPost .postForm .commentInput,
.sharePost .postForm .commentInput {
  width: auto;
  float: none;
  display: flex;
}
.newPost .postForm .commentInput .commentField,
.editPost .postForm .commentInput .commentField,
.sharePost .postForm .commentInput .commentField {
  position: relative;
  width: calc( 100% - 160px );
  transition: 0.1s all;
}
.newPost .postForm .commentInput .commentField .comment,
.editPost .postForm .commentInput .commentField .comment,
.sharePost .postForm .commentInput .commentField .comment {
  text-align: left;
  border-radius: 20px;
  border: 1px solid #ccc;
  overflow: hidden;
  width: 100%;
  height: 40px;
  outline: 0;
  resize: none;
  padding: 8px 30px 8px 12px;
  margin-bottom: -8px;
}
.newPost .postForm .commentInput .commentField .comment:focus,
.editPost .postForm .commentInput .commentField .comment:focus,
.sharePost .postForm .commentInput .commentField .comment:focus {
  border-color: #9b2621;
}
.newPost .postForm .commentInput .commentField .comment.blink,
.editPost .postForm .commentInput .commentField .comment.blink,
.sharePost .postForm .commentInput .commentField .comment.blink {
  border-color: #9b2621;
  -webkit-animation: blink 0.4s;
          animation: blink 0.4s;
  -webkit-animation-iteration-count: 3;
          animation-iteration-count: 3;
}
@-webkit-keyframes blink {
  100% {
    border-color: #fff;
  }
}
@keyframes blink {
  100% {
    border-color: #fff;
  }
}
.newPost .postForm .commentInput .commentField .buttonEmoji,
.editPost .postForm .commentInput .commentField .buttonEmoji,
.sharePost .postForm .commentInput .commentField .buttonEmoji {
  display: inline-block;
  position: absolute;
  border: none;
  cursor: pointer;
  top: 0;
  right: 0;
  border-radius: 50%;
  color: #666;
  background-color: transparent;
  width: 40px;
  height: 40px;
  transition: 0.1s all;
}
.newPost .postForm .commentInput .commentField .buttonEmoji:hover,
.editPost .postForm .commentInput .commentField .buttonEmoji:hover,
.sharePost .postForm .commentInput .commentField .buttonEmoji:hover {
  background: #eee;
}
.newPost .postForm .commentInput .commentField .buttonEmoji i.i,
.editPost .postForm .commentInput .commentField .buttonEmoji i.i,
.sharePost .postForm .commentInput .commentField .buttonEmoji i.i {
  display: inline-block;
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
}
.newPost .postForm .commentInput .commentField .buttonEmoji i.i::before,
.editPost .postForm .commentInput .commentField .buttonEmoji i.i::before,
.sharePost .postForm .commentInput .commentField .buttonEmoji i.i::before {
  height: 40px;
  width: 40px;
  line-height: 40px;
}
.newPost .postForm .commentInput .commentButtons,
.editPost .postForm .commentInput .commentButtons,
.sharePost .postForm .commentInput .commentButtons {
  float: right;
  width: 160px;
  transition: 0.1s all;
}
.newPost .postForm .commentInput .commentButtons div.button,
.editPost .postForm .commentInput .commentButtons div.button,
.sharePost .postForm .commentInput .commentButtons div.button {
  display: inline-block;
  right: 0;
  position: relative;
  border: none;
  cursor: pointer;
  color: #666;
  background-color: transparent;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  transition: 0.1s all;
}
.newPost .postForm .commentInput .commentButtons div.button:hover,
.editPost .postForm .commentInput .commentButtons div.button:hover,
.sharePost .postForm .commentInput .commentButtons div.button:hover {
  background: #eee;
}
.newPost .postForm .commentInput .commentButtons div.button i.i,
.editPost .postForm .commentInput .commentButtons div.button i.i,
.sharePost .postForm .commentInput .commentButtons div.button i.i {
  display: inline-block;
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
}
.newPost .postForm .commentInput .commentButtons div.button i.i::before,
.editPost .postForm .commentInput .commentButtons div.button i.i::before,
.sharePost .postForm .commentInput .commentButtons div.button i.i::before {
  height: 40px;
  width: 40px;
  line-height: 40px;
}
.newPost .postForm .commentInput .commentButtons div.button input[type=file],
.editPost .postForm .commentInput .commentButtons div.button input[type=file],
.sharePost .postForm .commentInput .commentButtons div.button input[type=file] {
  width: 40px;
  height: 40px;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  font-size: 0;
  opacity: 0;
}
.newPost .postForm .commentInput .commentButtons div.button.buttonSubmit button,
.editPost .postForm .commentInput .commentButtons div.button.buttonSubmit button,
.sharePost .postForm .commentInput .commentButtons div.button.buttonSubmit button {
  outline: 0;
  width: 40px;
  height: 40px;
  padding: 0;
  border: none;
  cursor: pointer;
  top: 0;
  right: 0;
  border-radius: 50%;
  color: #666;
  background: transparent;
  transition: 0.1s all;
}
.newPost .postForm .commentInput .commentButtons div.button.buttonSubmit button:hover,
.editPost .postForm .commentInput .commentButtons div.button.buttonSubmit button:hover,
.sharePost .postForm .commentInput .commentButtons div.button.buttonSubmit button:hover {
  background: #eee;
}
.newPost .postForm .commentInput .commentButtons div.button .actionsMenu,
.editPost .postForm .commentInput .commentButtons div.button .actionsMenu,
.sharePost .postForm .commentInput .commentButtons div.button .actionsMenu {
  top: 40px;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  z-index: 50;
  font-size: 12px;
}
.newPost .postForm .commentInput .commentButtons div.button .buttonIcon,
.editPost .postForm .commentInput .commentButtons div.button .buttonIcon,
.sharePost .postForm .commentInput .commentButtons div.button .buttonIcon {
  display: inline-block;
  right: 0;
  position: relative;
  border: none;
  cursor: pointer;
  color: #666;
  background-color: transparent;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  transition: 0.1s all;
}
.newPost .postForm .commentInput .commentButtons div.button .buttonIcon.left,
.editPost .postForm .commentInput .commentButtons div.button .buttonIcon.left,
.sharePost .postForm .commentInput .commentButtons div.button .buttonIcon.left {
  right: unset;
  left: 0;
}
.newPost .postForm .commentInput .commentButtons div.button .buttonIcon.abs,
.editPost .postForm .commentInput .commentButtons div.button .buttonIcon.abs,
.sharePost .postForm .commentInput .commentButtons div.button .buttonIcon.abs {
  position: absolute;
}
.newPost .postForm .commentInput .commentButtons div.button .buttonIcon:hover,
.editPost .postForm .commentInput .commentButtons div.button .buttonIcon:hover,
.sharePost .postForm .commentInput .commentButtons div.button .buttonIcon:hover {
  background: #eee;
}
.newPost .postForm .commentInput .commentButtons div.button .buttonIcon i.i,
.editPost .postForm .commentInput .commentButtons div.button .buttonIcon i.i,
.sharePost .postForm .commentInput .commentButtons div.button .buttonIcon i.i {
  display: inline-block;
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
}
.newPost .postForm .commentInput .commentButtons div.button .buttonIcon i.i::before,
.editPost .postForm .commentInput .commentButtons div.button .buttonIcon i.i::before,
.sharePost .postForm .commentInput .commentButtons div.button .buttonIcon i.i::before {
  height: 40px;
  width: 40px;
  line-height: 40px;
}
.newPost .postForm .commentInput .commentButtons div.button .buttonIcon.small,
.editPost .postForm .commentInput .commentButtons div.button .buttonIcon.small,
.sharePost .postForm .commentInput .commentButtons div.button .buttonIcon.small {
  width: 30px;
  height: 30px;
}
.newPost .postForm .commentInput .commentButtons div.button .buttonIcon.small i.i,
.editPost .postForm .commentInput .commentButtons div.button .buttonIcon.small i.i,
.sharePost .postForm .commentInput .commentButtons div.button .buttonIcon.small i.i {
  height: 30px;
  width: 30px;
  line-height: 20px;
  text-align: center;
}
.newPost .postForm .commentInput .commentButtons div.button .buttonIcon.small i.i::before,
.editPost .postForm .commentInput .commentButtons div.button .buttonIcon.small i.i::before,
.sharePost .postForm .commentInput .commentButtons div.button .buttonIcon.small i.i::before {
  font-size: 18px;
  height: 30px;
  width: 30px;
  line-height: 30px;
}
.newPost .postForm .commentInput .comment,
.editPost .postForm .commentInput .comment,
.sharePost .postForm .commentInput .comment {
  text-align: left;
  border-radius: 20px;
  border: 1px solid #ccc;
  overflow: hidden;
  height: 40px;
  outline: 0;
  resize: none;
  padding: 8px 12px;
  margin-bottom: -8px;
}
.newPost .postForm .commentInput .comment:focus,
.editPost .postForm .commentInput .comment:focus,
.sharePost .postForm .commentInput .comment:focus {
  border-color: #9b2621;
}
.newPost .postForm .commentInput.fullWidth,
.editPost .postForm .commentInput.fullWidth,
.sharePost .postForm .commentInput.fullWidth {
  display: block;
  float: left;
  width: calc(100% - 50px);
}
.newPost .postForm .commentInput.fullWidth .commentField,
.editPost .postForm .commentInput.fullWidth .commentField,
.sharePost .postForm .commentInput.fullWidth .commentField {
  position: relative;
  width: 100%;
}
.newPost .postForm .commentInput.fullWidth .commentButtons,
.editPost .postForm .commentInput.fullWidth .commentButtons,
.sharePost .postForm .commentInput.fullWidth .commentButtons {
  margin-top: 2px;
}
.newPost .postForm.noMedia .commentInput .commentField,
.editPost .postForm.noMedia .commentInput .commentField,
.sharePost .postForm.noMedia .commentInput .commentField {
  position: relative;
  width: calc( 100% - 40px );
}
.newPost .postForm.noMedia .commentInput .commentField .comment,
.editPost .postForm.noMedia .commentInput .commentField .comment,
.sharePost .postForm.noMedia .commentInput .commentField .comment {
  text-align: left;
  border-radius: 20px;
  border: 1px solid #ccc;
  overflow: hidden;
  width: 100%;
  height: 40px;
  outline: 0;
  resize: none;
  padding: 8px 30px 8px 12px;
  margin-bottom: -8px;
}
.newPost .postForm.noMedia .commentInput .commentField .comment:focus,
.editPost .postForm.noMedia .commentInput .commentField .comment:focus,
.sharePost .postForm.noMedia .commentInput .commentField .comment:focus {
  border-color: #9b2621;
}
.newPost .postForm.noMedia .commentInput .commentField .buttonEmoji,
.editPost .postForm.noMedia .commentInput .commentField .buttonEmoji,
.sharePost .postForm.noMedia .commentInput .commentField .buttonEmoji {
  display: inline-block;
  position: absolute;
  border: none;
  cursor: pointer;
  top: 0;
  right: 0;
  border-radius: 50%;
  color: #666;
  background-color: transparent;
  width: 40px;
  height: 40px;
  transition: 0.1s all;
}
.newPost .postForm.noMedia .commentInput .commentField .buttonEmoji:hover,
.editPost .postForm.noMedia .commentInput .commentField .buttonEmoji:hover,
.sharePost .postForm.noMedia .commentInput .commentField .buttonEmoji:hover {
  background: #eee;
}
.newPost .postForm.noMedia .commentInput .commentField .buttonEmoji i.i,
.editPost .postForm.noMedia .commentInput .commentField .buttonEmoji i.i,
.sharePost .postForm.noMedia .commentInput .commentField .buttonEmoji i.i {
  display: inline-block;
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
}
.newPost .postForm.noMedia .commentInput .commentField .buttonEmoji i.i::before,
.editPost .postForm.noMedia .commentInput .commentField .buttonEmoji i.i::before,
.sharePost .postForm.noMedia .commentInput .commentField .buttonEmoji i.i::before {
  height: 40px;
  width: 40px;
  line-height: 40px;
}
.newPost .postForm.noMedia .commentInput .commentButtons,
.editPost .postForm.noMedia .commentInput .commentButtons,
.sharePost .postForm.noMedia .commentInput .commentButtons {
  float: right;
  width: 40px;
}
.taNoWrap {
  overflow-x: scroll;
  white-space: nowrap;
  padding: 0;
}
.newComment,
.editComment {
  clear: both;
}
.newComment .commentButtons,
.editComment .commentButtons {
  display: flex;
}
.newComment .commentButtons .likes,
.editComment .commentButtons .likes,
.newComment .commentButtons .comments,
.editComment .commentButtons .comments,
.newComment .commentButtons .shares,
.editComment .commentButtons .shares {
  line-height: 40px;
  flex: 1;
  text-align: center;
}
.newComment .commentButtons .likes a,
.editComment .commentButtons .likes a,
.newComment .commentButtons .comments a,
.editComment .commentButtons .comments a,
.newComment .commentButtons .shares a,
.editComment .commentButtons .shares a {
  color: #999;
  display: block;
  text-align: center;
}
.newComment .commentForm,
.editComment .commentForm {
  margin: 0;
}
.newComment .commentForm .commentProfile,
.editComment .commentForm .commentProfile {
  width: 50px;
  height: 40px;
  float: left;
}
.newComment .commentForm .commentProfile .profileImg,
.editComment .commentForm .commentProfile .profileImg {
  float: left;
  text-align: left;
  margin-right: 10px;
  border-radius: 50%;
  overflow: hidden;
}
.newComment .commentForm .commentProfile .profileImg > img,
.editComment .commentForm .commentProfile .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 40px;
  height: 40px;
}
.newComment .commentForm .preview,
.editComment .commentForm .preview {
  padding: 10px;
  height: 110px;
}
.newComment .commentForm .preview img,
.editComment .commentForm .preview img,
.newComment .commentForm .preview video,
.editComment .commentForm .preview video {
  max-height: 100px;
  float: left;
}
.newComment .commentForm .preview:empty,
.editComment .commentForm .preview:empty {
  padding: 0;
  height: 0;
}
.newComment .commentForm .preview .remove,
.editComment .commentForm .preview .remove {
  float: left;
  margin-left: 10px;
  text-align: center;
  width: 24px;
  height: 24px;
  cursor: pointer;
  border: 1px solid #6d0015;
  border-radius: 50%;
  background: #9b2621;
  color: #fff;
}
.newComment .commentForm .commentInput,
.editComment .commentForm .commentInput {
  width: auto;
  float: none;
  display: flex;
}
.newComment .commentForm .commentInput .commentField,
.editComment .commentForm .commentInput .commentField {
  position: relative;
  width: calc( 100% - 120px );
  transition: 0.1s all;
}
.newComment .commentForm .commentInput .commentField .comment,
.editComment .commentForm .commentInput .commentField .comment {
  text-align: left;
  border-radius: 20px;
  border: 1px solid #ccc;
  overflow: hidden;
  width: 100%;
  height: 40px;
  outline: 0;
  resize: none;
  padding: 8px 30px 8px 12px;
  margin-bottom: -8px;
}
.newComment .commentForm .commentInput .commentField .comment:focus,
.editComment .commentForm .commentInput .commentField .comment:focus {
  border-color: #9b2621;
}
.newComment .commentForm .commentInput .commentField .buttonEmoji,
.editComment .commentForm .commentInput .commentField .buttonEmoji {
  display: inline-block;
  position: absolute;
  border: none;
  cursor: pointer;
  top: 0;
  right: 0;
  border-radius: 50%;
  color: #666;
  background-color: transparent;
  width: 40px;
  height: 40px;
  transition: 0.1s all;
}
.newComment .commentForm .commentInput .commentField .buttonEmoji:hover,
.editComment .commentForm .commentInput .commentField .buttonEmoji:hover {
  background: #eee;
}
.newComment .commentForm .commentInput .commentField .buttonEmoji i.i,
.editComment .commentForm .commentInput .commentField .buttonEmoji i.i {
  display: inline-block;
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
}
.newComment .commentForm .commentInput .commentField .buttonEmoji i.i::before,
.editComment .commentForm .commentInput .commentField .buttonEmoji i.i::before {
  height: 40px;
  width: 40px;
  line-height: 40px;
}
.newComment .commentForm .commentInput .commentButtons,
.editComment .commentForm .commentInput .commentButtons {
  float: right;
  width: 120px;
  transition: 0.1s all;
}
.newComment .commentForm .commentInput .commentButtons div.button,
.editComment .commentForm .commentInput .commentButtons div.button {
  display: inline-block;
  right: 0;
  position: relative;
  border: none;
  cursor: pointer;
  color: #666;
  background-color: transparent;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  transition: 0.1s all;
}
.newComment .commentForm .commentInput .commentButtons div.button:hover,
.editComment .commentForm .commentInput .commentButtons div.button:hover {
  background: #eee;
}
.newComment .commentForm .commentInput .commentButtons div.button i.i,
.editComment .commentForm .commentInput .commentButtons div.button i.i {
  display: inline-block;
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
}
.newComment .commentForm .commentInput .commentButtons div.button i.i::before,
.editComment .commentForm .commentInput .commentButtons div.button i.i::before {
  height: 40px;
  width: 40px;
  line-height: 40px;
}
.newComment .commentForm .commentInput .commentButtons div.button input[type=file],
.editComment .commentForm .commentInput .commentButtons div.button input[type=file] {
  width: 40px;
  height: 40px;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  font-size: 0;
  opacity: 0;
}
.newComment .commentForm .commentInput .commentButtons div.button.buttonSubmit button,
.editComment .commentForm .commentInput .commentButtons div.button.buttonSubmit button {
  outline: 0;
  width: 40px;
  height: 40px;
  padding: 0;
  border: none;
  cursor: pointer;
  top: 0;
  right: 0;
  border-radius: 50%;
  color: #666;
  background: transparent;
  transition: 0.1s all;
}
.newComment .commentForm .commentInput .commentButtons div.button.buttonSubmit button:hover,
.editComment .commentForm .commentInput .commentButtons div.button.buttonSubmit button:hover {
  background: #eee;
}
.newComment .commentForm .commentInput .comment,
.editComment .commentForm .commentInput .comment {
  text-align: left;
  border-radius: 20px;
  border: 1px solid #ccc;
  overflow: hidden;
  height: 40px;
  outline: 0;
  resize: none;
  padding: 8px 12px;
  margin-bottom: -8px;
}
.newComment .commentForm .commentInput .comment:focus,
.editComment .commentForm .commentInput .comment:focus {
  border-color: #9b2621;
}
.newComment .commentForm .commentInput.noMedia .commentField,
.editComment .commentForm .commentInput.noMedia .commentField {
  position: relative;
  width: calc( 100% - 40px );
}
.newComment .commentForm .commentInput.noMedia .commentButtons,
.editComment .commentForm .commentInput.noMedia .commentButtons {
  float: right;
  width: 40px;
}
.newComment .commentForm .commentInput.fullWidth,
.editComment .commentForm .commentInput.fullWidth {
  display: block;
  float: left;
  width: calc(100% - 50px);
}
.newComment .commentForm .commentInput.fullWidth .commentField,
.editComment .commentForm .commentInput.fullWidth .commentField {
  position: relative;
  width: 100%;
}
.newComment .commentForm .commentInput.fullWidth .commentButtons,
.editComment .commentForm .commentInput.fullWidth .commentButtons {
  margin-top: 2px;
}
.photoslist .photo .actionsButton {
  cursor: pointer;
  opacity: 0.8;
  text-shadow: 0 0 2px #fff;
}
.photoslist .photo .actionsButton.active {
  opacity: 1;
  color: #7f0118;
}
.photoslist .photo:hover .actionsButton {
  opacity: 1;
}
.postLikes {
  margin: 0 -15px;
  padding: 10px;
  background: #f9f9f9;
  border-bottom: 1px solid #f3f3f3;
  border-top: 1px solid #f3f3f3;
  margin-bottom: 10px;
}
.postLikes .like-container {
  display: flex;
}
.postLikes .like-container .reaction,
.postLikes .like-container .comments,
.postLikes .like-container .share {
  position: relative;
  width: 30px;
  height: 30px;
  margin: 0 16px 0 20px;
  cursor: pointer;
  color: #7f0118;
}
.postLikes .like-container .reaction:first-child,
.postLikes .like-container .comments:first-child,
.postLikes .like-container .share:first-child {
  margin: 0 16px 0 10px;
}
.postLikes .like-container .reaction.likeMy,
.postLikes .like-container .comments.likeMy,
.postLikes .like-container .share.likeMy,
.postLikes .like-container .reaction.dislikeMy,
.postLikes .like-container .comments.dislikeMy,
.postLikes .like-container .share.dislikeMy {
  color: #918947;
}
.postLikes .like-container .reaction.likeMy i.i,
.postLikes .like-container .comments.likeMy i.i,
.postLikes .like-container .share.likeMy i.i,
.postLikes .like-container .reaction.dislikeMy i.i,
.postLikes .like-container .comments.dislikeMy i.i,
.postLikes .like-container .share.dislikeMy i.i {
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
}
.postLikes .like-container .reaction:hover i.i,
.postLikes .like-container .comments:hover i.i,
.postLikes .like-container .share:hover i.i {
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
}
.postLikes .like-container .reaction i.i,
.postLikes .like-container .comments i.i,
.postLikes .like-container .share i.i {
  width: 30px;
  height: 30px;
  line-height: 30px;
  transition: all 0.15s;
}
.postLikes .like-container .reaction i.i:before,
.postLikes .like-container .comments i.i:before,
.postLikes .like-container .share i.i:before {
  line-height: 30px;
}
.postLikes .like-container .badge {
  position: relative;
  cursor: default;
  color: #333;
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  background: #fff;
  padding: 0;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  border-radius: 50%;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
  float: right;
  margin-left: -16px;
  transition: transform 0.5s;
  transform-origin: center;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.postLikes .like-container .badge:empty {
  transform: scale(0);
}
.instaLikes {
  position: absolute;
  bottom: 50px;
  padding: 5px;
  background: transparent;
  width: 100%;
  z-index: 20;
  opacity: 0.5;
}
.instaLikes .like-container {
  display: flex;
}
.instaLikes .like-container .rightContainer {
  position: absolute;
  right: 16px;
}
.instaLikes .like-container .reaction,
.instaLikes .like-container .visits,
.instaLikes .like-container .share {
  position: relative;
  width: 30px;
  height: 30px;
  margin: 0 16px 0 20px;
  float: left;
  cursor: pointer;
  color: #fff;
}
.instaLikes .like-container .reaction:first-child,
.instaLikes .like-container .visits:first-child,
.instaLikes .like-container .share:first-child {
  margin: 0 16px 0 10px;
}
.instaLikes .like-container .reaction.likeMy,
.instaLikes .like-container .visits.likeMy,
.instaLikes .like-container .share.likeMy,
.instaLikes .like-container .reaction.dislikeMy,
.instaLikes .like-container .visits.dislikeMy,
.instaLikes .like-container .share.dislikeMy {
  color: #918947;
}
.instaLikes .like-container .reaction.likeMy i.i,
.instaLikes .like-container .visits.likeMy i.i,
.instaLikes .like-container .share.likeMy i.i,
.instaLikes .like-container .reaction.dislikeMy i.i,
.instaLikes .like-container .visits.dislikeMy i.i,
.instaLikes .like-container .share.dislikeMy i.i {
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
}
.instaLikes .like-container .reaction:hover i.i,
.instaLikes .like-container .visits:hover i.i,
.instaLikes .like-container .share:hover i.i {
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
}
.instaLikes .like-container .reaction i.i,
.instaLikes .like-container .visits i.i,
.instaLikes .like-container .share i.i {
  width: 30px;
  height: 30px;
  line-height: 30px;
  transition: all 0.15s;
}
.instaLikes .like-container .reaction i.i:before,
.instaLikes .like-container .visits i.i:before,
.instaLikes .like-container .share i.i:before {
  line-height: 30px;
}
.instaLikes .like-container .badge {
  position: relative;
  cursor: default;
  color: #333;
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  background: #fff;
  padding: 0;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  border-radius: 50%;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
  float: right;
  margin-left: -16px;
  transition: transform 0.5s;
  transform-origin: center;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.instaLikes .like-container .badge:empty {
  transform: scale(0);
}
.likeComment {
  clear: both;
}
.likeComment .commentButtons {
  display: flex;
}
.likeComment .commentButtons .likes,
.likeComment .commentButtons .comments,
.likeComment .commentButtons .shares {
  line-height: 40px;
  flex: 1;
  text-align: center;
}
.likeComment .commentButtons .likes a,
.likeComment .commentButtons .comments a,
.likeComment .commentButtons .shares a {
  color: #999;
  display: block;
  text-align: center;
}
.likeComment .commentForm {
  clear: both;
  padding: 10px;
  margin: 0 -15px 0 -15px;
}
.likeComment .commentForm .commentProfile {
  width: 50px;
  height: 40px;
  float: left;
}
.likeComment .commentForm .commentProfile .profileImg {
  float: left;
  text-align: left;
  margin-right: 10px;
  border-radius: 50%;
  overflow: hidden;
}
.likeComment .commentForm .commentProfile .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 40px;
  height: 40px;
}
.likeComment .commentForm .preview {
  padding: 10px;
  height: 110px;
}
.likeComment .commentForm .preview img,
.likeComment .commentForm .preview video {
  max-height: 100px;
  float: left;
}
.likeComment .commentForm .preview:empty {
  padding: 0;
  height: 0;
}
.likeComment .commentForm .preview .remove {
  float: left;
  margin-left: 10px;
  text-align: center;
  width: 24px;
  height: 24px;
  cursor: pointer;
  border: 1px solid #6d0015;
  border-radius: 50%;
  background: #9b2621;
  color: #fff;
}
.likeComment .commentForm .commentInput {
  width: auto;
  float: none;
}
.likeComment .commentForm .commentInput .comment {
  text-align: left;
  border-radius: 20px;
  border: 1px solid #ccc;
  overflow: hidden;
  height: 40px;
  outline: 0;
  width: calc( 100% - 170px );
  resize: none;
  padding: 8px 30px 8px 12px;
  margin-bottom: -8px;
}
.likeComment .commentForm .commentInput .comment:focus {
  border-color: #9b2621;
}
.likeComment .commentForm .commentInput div.button {
  display: inline-block;
  right: 0;
  position: absolute;
  border: none;
  cursor: pointer;
  background-color: transparent;
  width: 40px;
  height: 40px;
  background-size: 50%;
  background-repeat: no-repeat;
  background-position: center center;
}
.likeComment .commentForm .commentInput div.button input[type=file] {
  width: 40px;
  height: 40px;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  font-size: 0;
  opacity: 0;
}
.likeComment .commentForm .commentInput div.button.attVideo {
  right: 10px;
  background-image: url(/images/video.svg?af5b37b2126f5584b36b1c1c850cff05);
}
.likeComment .commentForm .commentInput div.button.attPhoto {
  right: 50px;
  background-image: url(/images/camera.svg?355544be76e60a465c481330e78e358c);
}
.likeComment .commentForm .commentInput div.button.attEmoji {
  right: 90px;
  background-image: url(/images/sticker.svg?cca37795b0f11d7139d208e5574ac43c);
}
.likeComment .commentForm .commentInput.noAtt .comment {
  width: calc( 100% - 90px );
}
.likeComment .commentForm .commentInput.noAtt div.button.attEmoji {
  right: 10px;
}
.likeComment .commentForm .commentAtt {
  float: right;
  margin-top: -40px;
  position: relative;
}
.likeComment .commentForm .commentAtt div.button {
  display: inline-block;
  border: none;
  cursor: pointer;
  background-color: transparent;
  width: 40px;
  height: 40px;
  background-size: 50%;
  background-repeat: no-repeat;
  background-position: center center;
}
.likeComment .commentForm .commentAtt div.button input[type=file] {
  width: 40px;
  height: 40px;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  font-size: 0;
  opacity: 0;
}
.likeComment .commentForm .commentAtt div.button.attPhoto {
  background-image: url(/images/camera.svg?355544be76e60a465c481330e78e358c);
}
.likeComment .commentForm .commentAtt div.button.attVideo {
  background-image: url(/images/video.svg?af5b37b2126f5584b36b1c1c850cff05);
}
.likeComment .commentForm .commentAtt div.button.attEmoji {
  background-image: url(/images/sticker.svg?cca37795b0f11d7139d208e5574ac43c);
}
.forumslist .forum {
  padding: 5px;
  float: none;
  border-bottom: 1px solid #eee;
}
.forumslist .forum:after {
  content: "";
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
.forumslist .forum:last-child {
  border-bottom: none;
}
.forumslist .forum .forumName {
  text-align: left;
  float: left;
  font-weight: 600;
}
.forumslist .forum .badge {
  position: relative;
  color: #fff;
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  background: #f00;
  padding: 0;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  border-radius: 50%;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
  float: right;
  margin-left: -30px;
  transition: transform 0.5s;
  transform-origin: center;
}
.forumslist .forum .badge:empty {
  transform: scale(0);
}
.forumslist .forum .badge.animate {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
  transform-origin: center bottom;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}
.threadslist .thread {
  padding: 5px;
  float: none;
  border-bottom: 1px solid #eee;
}
.threadslist .thread:after {
  content: "";
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
.threadslist .thread:last-child {
  border-bottom: none;
}
.threadslist .thread .threadDate {
  text-align: right;
  float: right;
  font-size: 12px;
  color: #666;
  width: 100px;
}
.threadslist .thread .threadReplies {
  text-align: right;
  float: right;
  font-size: 12px;
  color: #000;
  margin-right: 10px;
  width: 80px;
}
.threadslist .thread .threadName {
  text-align: left;
  float: left;
  font-weight: 600;
  clear: both;
}
.threadslist .thread .threadUser {
  text-align: right;
  float: right;
  font-size: 12px;
  color: #000;
  margin-right: 10px;
  width: 30px;
}
.threadslist .thread .threadUser .profileAvatar {
  margin-right: 10px;
  margin-bottom: 0;
  float: left;
}
.threadslist .thread .threadUser .profileAvatar .profileImg {
  float: left;
  text-align: left;
  border-radius: 50%;
  overflow: hidden;
}
.threadslist .thread .threadUser .profileAvatar .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 24px;
  height: 24px;
}
.threadContainer .replieslist {
  margin-left: 40px;
}
.threadContainer .replieslist .reply {
  padding: 5px;
  float: none;
  border-bottom: 1px solid #ccc;
}
.threadContainer .replieslist .reply:after {
  content: "";
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
.threadContainer .replieslist .reply:last-child {
  border-bottom: none;
}
.threadContainer .replieslist .reply .replyUser {
  text-align: left;
  float: left;
  font-weight: 600;
}
.threadContainer .replieslist .reply .replyDate {
  text-align: right;
  float: right;
  font-size: 12px;
  color: #666;
}
.threadContainer .replieslist .reply .replyText {
  font-size: 12px;
  color: #000;
  clear: both;
  padding: 5px;
}
.threadContainer .thread .threadUser {
  text-align: left;
  float: left;
  font-weight: 600;
}
.threadContainer .thread .threadDate {
  text-align: right;
  float: right;
  font-size: 12px;
  color: #666;
}
.threadContainer .thread .threadName {
  text-align: left;
  float: left;
  font-weight: 600;
  clear: both;
}
.threadContainer .thread .threadText {
  font-size: 12px;
  color: #000;
  clear: both;
  padding: 5px;
}
.card {
  margin-bottom: 20px;
  border: none;
  box-shadow: 0px 1px 3px -1px rgba(0, 0, 0, 0.2);
}
.card.hilite {
  box-shadow: 0px 0px 5px 0px rgba(127, 0, 0, 0.8);
}
.card .card-header {
  padding: 0.75rem 0.75rem;
  border-bottom: none;
}
.card .card-header .genderIcon {
  margin-bottom: -8px;
}
.card .card-header .addButton {
  margin: -7px;
  float: right;
}
.card .card-body {
  padding: 15px;
}
.card .cardCollapse {
  float: right;
  outline: 0;
  border: none;
  width: 30px;
  height: 30px;
  text-align: center;
  padding: 0;
  line-height: 30px;
  margin: 0px -7px -7px 10px;
  background: #9b2621;
  color: #fff;
}
.card .cardCollapse i.i.mdi::before {
  transition: transform 0.2s;
}
.card .cardCollapse.collapsed {
  background: transparent;
  color: #9B2621;
}
.card .cardCollapse.collapsed i.i.mdi::before {
  transform: rotate(-180deg);
}
.searchGender label {
  width: 32px;
  height: 32px;
  border: 1px solid #fff;
  border-radius: 6px;
  line-height: 32px;
  text-align: center;
  padding: 3px;
  cursor: pointer;
  margin-right: 8px;
  margin-left: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}
.searchGender label:hover {
  border-color: #DEB2BA;
}
.searchGender input[type=radio]:checked + label,
.searchGender input[type=checkbox]:checked + label {
  border: 1px solid #DEB2BA;
  background-color: #FFF6F8;
  box-shadow: none;
}
.searchIcon label {
  width: 40px;
  height: 40px;
  border: 1px solid #6d0015;
  border-radius: 6px;
  line-height: 40px;
  text-align: center;
  padding: 4px;
  cursor: pointer;
  margin-right: 16px;
}
.searchIcon input[type=radio]:checked + label,
.searchIcon input[type=checkbox]:checked + label {
  border: 1px solid #6d0015;
  background-color: #6d0015;
}
.searchIcon input[type=radio]:checked + label .genderIcon,
.searchIcon input[type=checkbox]:checked + label .genderIcon {
  filter: contrast(0);
}
.selectGift {
  display: flex;
  flex-wrap: wrap;
}
.selectGift .giftBuySelect {
  display: flex;
}
.selectGift label {
  border: 1px solid #ccc;
  border-radius: 0.25rem;
  text-align: center;
  padding: 6px;
  cursor: pointer;
  margin-right: 16px;
}
.selectGift .giftImg {
  max-width: 150px;
  height: 100px;
}
.selectGift .giftImg > img {
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
  height: 100%;
  max-height: 100px;
}
.selectGift .giftName {
  font-weight: 300;
  font-size: 16px;
  color: #6d0015;
}
.selectGift .giftPrice {
  font-weight: 700;
  font-size: 16px;
  color: #666;
}
.selectGift .giftPrice .priceOriginal {
  font-weight: 400;
  font-size: 11px;
  color: #999;
  text-decoration: line-through;
}
.selectGift .giftPrice .priceWithDiscount {
  font-weight: 400;
  font-size: 16px;
  color: #333;
}
.selectGift input[type=radio]:checked + label,
.selectGift input[type=checkbox]:checked + label {
  border: 1px solid #9b2621;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(155, 38, 33, 0.25);
}
.selectGift input[type=radio]:checked + label .genderIcon,
.selectGift input[type=checkbox]:checked + label .genderIcon {
  filter: contrast(0);
}
.giftDetail .giftImg {
  max-width: 100%;
  max-height: 300px;
}
.giftDetail .giftImg > img {
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
  height: 100%;
  max-height: 300px;
}
.giftDetail .giftName {
  font-weight: 700;
  text-align: center;
  font-size: 16px;
  color: #6d0015;
  padding: 15px 0;
}
.giftDetail .giftDescription {
  font-size: 14px;
  color: #333;
}
.giftDetail .giftPrice {
  font-weight: 700;
  font-size: 16px;
  color: #666;
}
.twocards {
  display: flex;
}
@media (max-width: 576px) {
  .twocards {
    display: block;
  }
}
.twocards .card {
  width: calc( 50% - 10px );
  margin-right: 10px;
  float: left;
}
.twocards .card:nth-of-type(even) {
  float: none;
  margin-left: 10px;
  margin-right: 0;
}
@media (max-width: 576px) {
  .twocards .card {
    width: 100%;
    margin-right: 0;
    float: none;
  }
  .twocards .card:nth-of-type(even) {
    margin-left: 0;
  }
}
.loading {
  width: 100%;
  padding: 20px;
  text-align: center;
  clear: both;
}
.loading.inline {
  display: inline-block;
  width: auto;
  padding: 0;
  text-align: left;
  clear: none;
}
.rgroup {
  padding-top: 7px;
  font-size: 0.8rem;
}
.welcomeTop {
  margin: 0 auto;
  height: 350px;
  margin-top: -1.5rem;
}
.adminActions {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
}
.adminActions button {
  padding: 2px 6px;
  border: 1px solid #666;
  background-color: #999;
  border-radius: 3px;
}
.giftsSummary > div {
  float: left;
  margin-right: 5px;
  position: relative;
}
.giftsSummary > div > img {
  height: 20px;
  width: 20px;
  -o-object-fit: contain;
     object-fit: contain;
}
.pagePart {
  margin: 0 auto;
  background-color: #fff;
}
.pagePart .pagePartHeader {
  max-width: 1200px;
  margin: 0 auto;
  padding: 30px 0;
  text-align: center;
  font-size: 40px;
  font-weight: 300;
  letter-spacing: 2px;
}
.pagePart .pagePartContent {
  max-width: 1200px;
  margin: 0 auto;
  padding: 60px 0;
  text-align: unset;
  line-height: 30px;
  font-size: 16px;
  font-weight: 300;
  padding: 30px 20px;
}
.pagePart.pagePartEventCarousel {
  background-color: #f2f2f2;
}
.pagePart.pagePartEventCarousel .pagePartContent {
  padding: 30px 0;
}
.pagePart.pagePartCards .welcomeCards {
  max-width: 1200px;
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
  padding: 10px 0;
}
.pagePart.pagePartCards .welcomeCards .pagePartCard {
  width: 100%;
  text-align: center;
  padding: 10px;
  position: relative;
}
@media (min-width: 320px) {
  .pagePart.pagePartCards .welcomeCards .pagePartCard {
    width: 50%;
  }
}
@media (min-width: 600px) {
  .pagePart.pagePartCards .welcomeCards .pagePartCard {
    width: 25%;
  }
}
.pagePart.pagePartCards .welcomeCards .pagePartCard a {
  background-color: #fff;
  color: #000;
  text-align: center;
  display: block;
  height: 100%;
  position: relative;
  padding: 10px;
  border-radius: 10px;
  transition: box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1), transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.pagePart.pagePartCards .welcomeCards .pagePartCard a:hover {
  text-decoration: none;
  box-shadow: 0 0 4px 0 rgba(46, 62, 72, 0.12), 0 4px 12px 0 rgba(46, 62, 72, 0.12);
  transform: translateY(-1px);
}
.pagePart.pagePartCards .welcomeCards .pagePartCard .cardIcon {
  width: 102px;
  height: 64px;
  background-repeat: no-repeat;
  margin: 20px auto;
  text-align: center;
}
.pagePart.pagePartCards .welcomeCards .pagePartCard .cardIcon i.i {
  font-size: 64px;
  line-height: 64px;
  color: #60000a;
}
.pagePart.pagePartCards .welcomeCards .pagePartCard .cardIcon i.i.mdi:before {
  font-size: 64px;
}
.pagePart.pagePartCards .welcomeCards .pagePartCard .cardTitle {
  color: #000;
  font-size: 22px;
  font-weight: 400;
}
.pagePart.pagePartCards .welcomeCards .pagePartCard .cardText {
  color: #333;
  font-size: 13px;
  padding: 10px;
  line-height: 24px;
}
.pagePart.pagePartDonors .pagePartContent {
  margin: 0 auto;
  text-align: unset;
  line-height: 30px;
  font-size: 16px;
  font-weight: 300;
  padding: 0 20px;
}
.pagePart.pagePartDonors table {
  width: 80%;
  max-width: 300px;
  margin: 0 auto;
}
.pagePart.pagePartDonors table td {
  width: 50%;
}
.pagePart.pagePartDonors table td:nth-child(2) {
  text-align: right;
}
.pagePart.pagePartDonors .donorsList {
  padding: 10px;
  text-align: center;
}
.cardIconPreview {
  width: 102px;
  height: 64px;
  background-repeat: no-repeat;
  margin: 20px auto;
  text-align: center;
}
.cardIconPreview i.i {
  font-size: 64px;
  line-height: 64px;
  color: #60000a;
}
.cardIconPreview i.i.mdi:before {
  font-size: 64px;
}
.adminList {
  width: 100%;
}
.adminList .adminHeader {
  background-color: #eee;
  font-size: 12px;
  border-bottom: 1px solid #ccc;
}
.adminList .adminHeader th {
  font-weight: 500;
  padding: 2px;
}
.adminList .adminItem:nth-child(odd) {
  background-color: #f3f3f3;
}
.adminList .adminItem:hover {
  background-color: #eee;
}
.adminList .adminItem td {
  padding: 2px;
}
.adminList .adminItem .itemHandle {
  width: 40px;
  color: #666;
  font-size: 12px;
}
.adminList .adminItem .itemHandle i.i.mdi:before {
  font-size: 24px;
  line-height: 30px;
}
.adminList .adminItem .itemId {
  width: 40px;
  color: #666;
  font-size: 12px;
}
.adminList .adminItem .itemImage {
  width: 140px;
  max-height: 70px;
  max-width: 140px;
  display: block;
}
.adminList .adminItem .itemImage a {
  display: inline-block;
  height: 60px;
}
.adminList .adminItem .itemImage img {
  max-width: 100%;
  max-height: 100%;
}
.adminList .adminItem .itemType {
  font-size: 11px;
}
.adminList .adminItem .itemSmall {
  font-size: 11px;
}
.adminList .adminItem .itemIcon {
  font-size: 11px;
}
.adminList .adminItem .itemIcon i.i.mdi:before {
  font-size: 18px;
  line-height: 14px;
}
.adminList .adminItem .itemValue.green {
  background-color: #6f6;
}
.adminList .adminItem .itemValue.red {
  background-color: #f66;
}
.adminList .itemActions {
  text-align: right;
}
.adminList .itemActions button,
.adminList .itemActions button.button,
.adminList .itemActions a.button,
.adminList .itemActions span.button {
  border: 1px solid transparent;
  border-radius: 0.25rem;
  width: 30px;
  height: 30px;
  line-height: 30px;
  outline: 0;
  display: inline-block;
  text-align: center;
  cursor: pointer;
  padding: 0;
  margin: 0;
  font-size: 18px;
}
.adminList .itemActions button i.i,
.adminList .itemActions button.button i.i,
.adminList .itemActions a.button i.i,
.adminList .itemActions span.button i.i {
  width: 30px;
  height: 30px;
  line-height: 30px;
  display: inline-block;
  text-align: center;
  font-size: 20px;
}
.adminList .itemActions button i.i.mdi:before,
.adminList .itemActions button.button i.i.mdi:before,
.adminList .itemActions a.button i.i.mdi:before,
.adminList .itemActions span.button i.i.mdi:before {
  font-size: 18px;
  line-height: 30px;
}
.adminList .itemActions button i.i.fa:before,
.adminList .itemActions button.button i.i.fa:before,
.adminList .itemActions a.button i.i.fa:before,
.adminList .itemActions span.button i.i.fa:before {
  font-size: 14px;
  line-height: 28px;
}
.adminList .itemActions button i.i:before,
.adminList .itemActions button.button i.i:before,
.adminList .itemActions a.button i.i:before,
.adminList .itemActions span.button i.i:before {
  line-height: 30px;
}
.adminList .itemActions button:hover,
.adminList .itemActions button.button:hover,
.adminList .itemActions a.button:hover,
.adminList .itemActions span.button:hover {
  border-color: #ccc;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.summaryTable {
  width: 100%;
}
.summaryTable .summaryHeader {
  background-color: #fff;
  font-size: 14px;
}
.summaryTable .summaryHeader th {
  font-weight: 500;
  padding: 5px 10px;
}
.summaryTable .summarySection td {
  font-size: 16px;
  font-weight: 300;
  padding: 20px 10px 10px 10px;
  border-bottom: 1px solid #eee;
}
.summaryTable .summaryItem:nth-child(odd) {
  background-color: #f9f9f9;
}
.summaryTable .summaryItem:hover {
  background-color: #f6f6f6;
}
.summaryTable .summaryItem td {
  padding: 5px 10px;
}
.summaryTable .summaryItem .itemImage {
  width: 140px;
  max-height: 70px;
  max-width: 140px;
  display: block;
}
.summaryTable .summaryItem .itemImage a {
  display: inline-block;
  height: 60px;
}
.summaryTable .summaryItem .itemImage img {
  max-width: 100%;
  max-height: 100%;
}
.summaryTable .summaryItem .itemType {
  font-size: 11px;
}
.summaryTable .summaryItem .itemSmall {
  font-size: 11px;
}
.summaryTable .summaryItem .itemIcon {
  font-size: 11px;
}
.summaryTable .summaryItem .itemIcon i.i.mdi:before {
  font-size: 18px;
  line-height: 14px;
}
.summaryTable .summaryItem .itemIcon.green {
  color: #418641;
}
.summaryTable .summaryItem .itemIcon.red {
  color: #f8a4a4;
}
.summaryTable .summaryItem .itemValue {
  font-weight: bold;
  font-size: 12px;
  color: #666;
}
.summaryTable .summaryItem .itemValue.green {
  background-color: #6f6;
}
.summaryTable .summaryItem .itemValue.red {
  background-color: #f66;
}
.adminForm .wallBannerImage {
  padding: 10px;
}
.adminForm .wallBannerImage img {
  max-width: 100%;
  max-height: 100%;
}
.buttonNew {
  border: 1px solid #ccc;
  background-color: #6d0015;
  color: #fff;
  border-radius: 0.25rem;
  margin-top: 20px;
  padding: 5px 10px;
  outline: 0;
  display: inline-block;
  text-align: center;
}
.buttonNew:hover {
  text-decoration: none;
  color: #fff;
}
.checkSelect {
  border: 1px solid #eee;
  border-radius: 0.25rem;
  display: inline-block;
  text-align: center;
  margin: 0;
  cursor: pointer;
  font-weight: normal;
  padding: 5px 5px 5px 5px;
  font-size: 13px;
}
.checkSelect input[type=checkbox] {
  vertical-align: middle;
  margin-right: 5px;
}
.checkSelect span {
  margin: 0 5px;
}
.pac-container {
  z-index: 10000;
}
.footer {
  background-color: #6f0014;
  background: #6f0014;
  background: -webkit-gradient(left bottom, left top, color-stop(0%, #6f0014), color-stop(78%, #9b031f), color-stop(100%, #9b031f));
  background: linear-gradient(to top, #6f0014 0%, #9b031f 78%, #9b031f 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(endColorstr="#6f0014", startColorstr="#9b031f", GradientType=0);
  margin-top: 0;
  padding: 10px;
  border-top-width: 1px;
  margin-bottom: 0;
  color: #fff;
  position: relative;
  z-index: 10;
}
.footer .footerLinks {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
  font-size: 13px;
  text-align: center;
}
.footer .footerLinks a {
  color: #fff;
}
.footer .footerLinks .dropdown-menu a {
  color: #000;
}
.footer .footerLinks .footerLang {
  display: inline-block;
  /*background-color: #8a1229;
            padding: 5px;
            border-radius: 3px;
            margin-left: 20px;*/
}
.footer .footerLinks .footerLang a:hover {
  text-decoration: none;
}
.userProfileLink {
  display: none;
}
.userProfileLink a {
  display: flex;
  align-items: center;
  min-height: 40px;
  min-width: 150px;
  padding: 0 9px;
}
.userProfileLink a img {
  width: 30px;
  height: 30px;
  margin-right: 7px;
  float: left;
  /* border-radius: 5px;*/
  border-radius: 50%;
}
.userProfileLink a span {
  color: #FFF;
  font-weight: 600;
  font-size: 16px;
}
.verifiedIcon {
  background-image: url(/images/verified-icon.png?cb21c7491ba2a2811cae8f9aef05493d);
  background-color: #6d0015;
  border-radius: 50%;
  background-size: contain;
  height: 40px;
  width: 40px;
  position: absolute;
  right: -3px;
  top: -3px;
}
.avatar {
  text-align: center;
  display: inline-block;
  width: 40px;
  height: 40px;
  border: none;
  padding: 0;
  position: relative;
}
.avatar.small {
  width: 24px;
  height: 24px;
}
.avatar.micro {
  width: 16px;
  height: 16px;
  vertical-align: bottom;
}
.avatar > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  float: left;
  aspect-ratio: 1;
}
.avatar > .verifiedIcon {
  position: absolute;
  top: 0;
  right: 0;
  width: 16px;
  height: 16px;
}
.avatar .flagIcon {
  position: absolute;
  top: 0;
  left: 0;
  width: 16px;
  height: 16px;
}
.avatar .onlineIcon {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 6px;
  height: 6px;
  border-radius: 50px;
  border: 1px solid transparent;
  overflow: hidden;
}
.avatar .onlineIcon.offline {
  background: transparent;
}
.avatar .onlineIcon.online {
  background: #090;
}
.avatar .genderIcon {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 16px;
  height: 16px;
}
.avat {
  text-align: center;
  display: inline-block;
  width: 50px;
  height: 50px;
  padding: 0;
  position: relative;
  border: 2px solid transparent;
  border-radius: 50%;
  float: left;
}
.avat:hover {
  border-color: #eee;
}
.avat.rainbow {
  border: 2px solid transparent;
  background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);
  background-size: 300% 300%;
}
.avat.rainbow.animated,
.avat.rainbow:hover {
  -webkit-animation: animatedgradient 1s ease alternate infinite;
          animation: animatedgradient 1s ease alternate infinite;
}
@keyframes animatedgradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
.avat.small {
  width: 24px;
  height: 24px;
}
.avat .avatCont {
  display: block;
  position: relative;
  float: left;
  background: #ccc;
  border: 2px solid #fff;
  border-radius: 50%;
  cursor: pointer;
  width: 100%;
  height: 100%;
}
.avat .avatImg {
  width: 100%;
  height: 100%;
}
.avat .avatImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
  aspect-ratio: 1;
}
.avat .verifiedIcon {
  position: absolute;
  top: -5px;
  right: -5px;
  width: 16px;
  height: 16px;
  border: 1px solid #fff;
  box-sizing: content-box;
}
.avat .flagIcon {
  position: absolute;
  top: -5px;
  left: -5px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
}
.avat .onlineIcon {
  position: absolute;
  bottom: -2px;
  right: -2px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1px solid transparent;
  overflow: hidden;
}
.avat .onlineIcon.offline {
  background: transparent;
}
.avat .onlineIcon.online {
  background: #090;
  border-color: #fff;
}
.avat .genderIcon {
  position: absolute;
  bottom: -5px;
  left: -5px;
  width: 16px;
  height: 16px;
}
.popupContainer {
  position: relative;
}
@media (max-width: 380px) {
  .popupContainer {
    width: 20px;
  }
}
.popupContainer .dropdown_caret {
  left: 50%;
  left: auto;
  margin-left: -10px;
  position: absolute;
  top: -10px;
  width: 18px;
  right: 11px;
  height: 10px;
}
.popupContainer .dropdown_caret .caret_inner {
  border-bottom: 10px solid #FFF;
  top: 1px;
  border-bottom: 10px solid #E1E2E3;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  height: auto;
  left: 0;
  top: 0;
  position: absolute;
  width: auto;
}
.popupContainer .dropdown_caret .caret_inner {
  border-bottom: 10px solid #E1E2E3;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  height: auto;
  left: 0;
  top: 0;
  position: absolute;
  width: auto;
}
.popupContainer .popupTop {
  background-color: #fff;
  color: #000;
  border: 1px solid #E1E2E3;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.25);
  position: absolute;
  z-index: 30;
  top: 41px;
  margin-left: -141px;
  width: 260px;
  font-size: 12px;
  border-radius: 0.25rem;
  transform: scaleY(0);
  opacity: 0;
  transform-origin: top;
  transition: all 0.15s;
}
.popupContainer .popupTop.right {
  right: 0;
}
@media (max-width: 380px) {
  .popupContainer .popupTop.right {
    right: -20px;
  }
}
.popupContainer .popupTop.active {
  display: block;
  transform: scaleY(1);
  opacity: 1;
}
.popupContainer .popupTop .popupHeader {
  border-bottom: 1px solid #E1E2E3;
  padding: 10px;
  font-weight: 700;
  font-size: 12px;
  color: #000;
}
.popupContainer .popupTop .popupHeader a {
  display: block;
}
.popupContainer .popupTop ul {
  padding: 5px 0;
  margin: 0;
  border-top: 1px solid #E1E2E3;
}
.popupContainer .popupTop ul:first-child {
  border-top: none;
}
.popupContainer .popupTop ul li {
  font-size: 12px;
  padding: 0;
  list-style: none;
}
.popupContainer .popupTop ul li a {
  color: #000;
  display: block;
  padding: 4px 10px;
  font-size: 12px;
  line-height: 200%;
}
.popupContainer .popupTop ul li a:hover {
  text-decoration: none;
}
.popupContainer .popupTop ul li span.buttonlink {
  color: #000;
  display: inline-block;
  padding: 4px 10px;
  font-size: 12px;
  line-height: 200%;
}
.popupContainer .popupTop ul li .custom-switch {
  float: right;
  margin-top: 4px;
}
.popupContainer .popupTop .popupContent {
  max-height: 400px;
  overflow-y: auto;
}
.popupContainer.left .dropdown_caret {
  right: calc( 50% - 9px );
  height: 10px;
}
.popupContainer.left .popupTop {
  margin-left: -110px;
}
.popupContainer.popupTopSearchPopup .dropdown_caret {
  right: 61px;
}
.popupContainer.popupTopSearchPopup .popupTop.right {
  right: -50px;
}
@media (max-width: 380px) {
  .popupContainer.popupTopSearchPopup .dropdown_caret {
    right: 61px;
  }
  .popupContainer.popupTopSearchPopup .popupTop.right {
    right: -70px;
  }
}
.popupMessagesContent {
  clear: both;
  max-height: 540px;
  overflow: auto;
}
.popupMessagesContent .profileAvatar {
  margin-right: 5px;
  margin-bottom: 0;
  float: left;
}
.popupMessagesContent .profileAvatar .profileImg {
  float: left;
  text-align: left;
  border-radius: 50%;
  overflow: hidden;
}
.popupMessagesContent .profileAvatar .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 24px;
  height: 24px;
}
.popupMessagesContent .mess {
  clear: both;
  font-size: 11px;
  padding: 5px;
}
.popupMessagesContent .mess .messDate {
  color: #999;
  font-size: 10px;
  /* display: none; */
  position: relative;
  padding: 2px 6px;
  background: #fff;
  /* border-radius: 8px; */
  /* border: 1px solid #999; */
  /* margin-top: -16px; */
  /* margin-bottom: -40px; */
  margin-left: 34px;
  /* margin-right: -200px; */
  float: left;
  /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); */
}
.popupMessagesContent .mess .messText {
  border-radius: 5px;
  padding: 2px 5px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;
  max-height: 60px;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
}
.popupMessagesContent .mess .messText .messPhoto {
  margin: 0;
}
.popupMessagesContent .mess .messText .messPhoto img {
  max-height: 60px;
  max-width: 60px;
}
.popupMessagesContent .mess .messText .messVideo {
  margin: 0;
}
.popupMessagesContent .mess .messText .messVideo video {
  max-height: 60px;
  max-width: 60px;
}
.popupMessagesContent .mess .messText a {
  color: #000;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;
}
.popupMessagesContent .mess .messText a:hover {
  text-decoration: none;
}
.popupMessagesContent .mess.from {
  float: left;
}
.popupMessagesContent .mess.from .messText {
  background: #ccc;
  border: 1px solid #aaa;
  margin-left: 30px;
}
.popupMessagesContent .mess:hover .messDate {
  display: block;
}
.popupNotifsContent,
.popupNudgesContent,
.popupFriendsContent,
.popupClubsContent {
  clear: both;
  max-height: 540px;
  overflow: auto;
}
.popupNotifsContent .profileAvatar,
.popupNudgesContent .profileAvatar,
.popupFriendsContent .profileAvatar,
.popupClubsContent .profileAvatar {
  margin-right: 5px;
  margin-bottom: 0;
  float: left;
}
.popupNotifsContent .profileAvatar .profileImg,
.popupNudgesContent .profileAvatar .profileImg,
.popupFriendsContent .profileAvatar .profileImg,
.popupClubsContent .profileAvatar .profileImg {
  float: left;
  text-align: left;
  border-radius: 50%;
  overflow: hidden;
}
.popupNotifsContent .profileAvatar .profileImg > img,
.popupNudgesContent .profileAvatar .profileImg > img,
.popupFriendsContent .profileAvatar .profileImg > img,
.popupClubsContent .profileAvatar .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 24px;
  height: 24px;
}
.popupNotifsContent .notif,
.popupNudgesContent .notif,
.popupFriendsContent .notif,
.popupClubsContent .notif {
  clear: both;
  font-size: 11px;
  padding: 5px;
}
.popupNotifsContent .notif .notifUser,
.popupNudgesContent .notif .notifUser,
.popupFriendsContent .notif .notifUser,
.popupClubsContent .notif .notifUser {
  color: #333;
  font-size: 11px;
  font-weight: bold;
}
.popupNotifsContent .notif .notifUser.m,
.popupNudgesContent .notif .notifUser.m,
.popupFriendsContent .notif .notifUser.m,
.popupClubsContent .notif .notifUser.m {
  color: #4272e5;
}
.popupNotifsContent .notif .notifUser.f,
.popupNudgesContent .notif .notifUser.f,
.popupFriendsContent .notif .notifUser.f,
.popupClubsContent .notif .notifUser.f {
  color: #e649bc;
}
.popupNotifsContent .notif .notifUser.mf,
.popupNudgesContent .notif .notifUser.mf,
.popupFriendsContent .notif .notifUser.mf,
.popupClubsContent .notif .notifUser.mf,
.popupNotifsContent .notif .notifUser.fm,
.popupNudgesContent .notif .notifUser.fm,
.popupFriendsContent .notif .notifUser.fm,
.popupClubsContent .notif .notifUser.fm {
  color: #aa49e6;
}
.popupNotifsContent .notif .notifDate,
.popupNudgesContent .notif .notifDate,
.popupFriendsContent .notif .notifDate,
.popupClubsContent .notif .notifDate {
  color: #999;
  font-size: 10px;
  /* display: none; */
  position: relative;
  background: #fff;
  /* border-radius: 8px; */
  /* border: 1px solid #999; */
  /* margin-top: -16px; */
  /* margin-bottom: -40px; */
  margin-left: 30px;
  float: right;
  /* margin-right: -200px; */
  /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); */
}
.popupNotifsContent .notif .notifText,
.popupNudgesContent .notif .notifText,
.popupFriendsContent .notif .notifText,
.popupClubsContent .notif .notifText {
  border-radius: 5px;
  padding: 2px 5px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;
  max-height: 60px;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
}
.popupNotifsContent .notif .notifText a,
.popupNudgesContent .notif .notifText a,
.popupFriendsContent .notif .notifText a,
.popupClubsContent .notif .notifText a {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;
  display: inline-block;
}
.popupNotifsContent .notif .notifText a:hover,
.popupNudgesContent .notif .notifText a:hover,
.popupFriendsContent .notif .notifText a:hover,
.popupClubsContent .notif .notifText a:hover {
  text-decoration: none;
}
.popupNotifsContent .notif .notifIcon,
.popupNudgesContent .notif .notifIcon,
.popupFriendsContent .notif .notifIcon,
.popupClubsContent .notif .notifIcon {
  display: inline-block;
  float: left;
  line-height: 24px;
  color: #999;
}
.popupNotifsContent .notif .notifIcon i.i.mdi:before,
.popupNudgesContent .notif .notifIcon i.i.mdi:before,
.popupFriendsContent .notif .notifIcon i.i.mdi:before,
.popupClubsContent .notif .notifIcon i.i.mdi:before {
  font-size: 16px;
}
.popupContent .empty {
  text-align: center;
  padding: 20px;
  font-size: 12px;
  color: #666;
  line-height: 20px;
  height: 60px;
}
.popupContent .loading {
  text-align: center;
  padding: 20px;
  font-size: 12px;
  color: #666;
  line-height: 20px;
  height: 60px;
}
.uploadForm .preview {
  padding: 10px;
  height: 110px;
}
.uploadForm .preview img,
.uploadForm .preview video {
  max-height: 100px;
  float: left;
}
.uploadForm .preview:empty {
  padding: 0;
  height: 0;
}
.uploadForm .preview .remove {
  float: left;
  margin-left: 10px;
  text-align: center;
  width: 24px;
  height: 24px;
  cursor: pointer;
  border: 1px solid #6d0015;
  border-radius: 50%;
  background: #9b2621;
  color: #fff;
}
.tags .tag {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  line-height: 16px;
  padding: 2px 8px;
  border-radius: 0.25rem;
  background: #9b2621;
  color: #fff;
}
.markedUsers {
  clear: both;
}
.markedUsers .markedTitle {
  display: inline-block;
  font-size: 11px;
  line-height: 16px;
  padding: 2px 8px;
  border-radius: 0.25rem;
  background: transparent;
  color: #666;
}
.markedUsers .marked {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  line-height: 16px;
  padding: 2px 8px;
  border-radius: 0.25rem;
  background: #fff;
  color: #9b2621;
}
.markedUsers .marked:hover {
  text-decoration: none;
}
/*!
 * Start Bootstrap - Simple Sidebar (https://startbootstrap.com/templates/simple-sidebar)
 * Copyright 2013-2020 Start Bootstrap
 * Licensed under MIT (https://github.com/StartBootstrap/startbootstrap-simple-sidebar/blob/master/LICENSE)
 */
#wrapper {
  overflow-x: hidden;
}
#sidebar-wrapper {
  min-height: 100vh;
  margin-left: -15rem;
  transition: margin 0.25s ease-out;
}
#sidebar-wrapper .sidebar-heading {
  padding: 0.875rem 1.25rem;
  font-size: 1.2rem;
}
#sidebar-wrapper .list-group {
  width: 15rem;
}
#page-content-wrapper {
  min-width: 100vw;
}
#wrapper.toggled #sidebar-wrapper {
  margin-left: 0;
}
@media (min-width: 770px) {
  #sidebar-wrapper {
    margin-left: 0;
  }
  #page-content-wrapper {
    min-width: 0;
    width: 100%;
  }
  #wrapper.toggled #sidebar-wrapper {
    margin-left: -15rem;
  }
}
.emptyList {
  text-align: center;
  padding: 10px 0 20px 0;
  font-size: 12px;
  color: #999;
}
.notAllowedPlaceholder {
  text-align: center;
  padding: 5px 0 5px 0;
  font-size: 12px;
  color: #999;
}
.dropdown {
  z-index: 1000;
}
.tab {
  margin-bottom: 20px;
}
.tab .nav-tabs {
  background-color: #e4e4e4;
  border-radius: 0.25rem;
  border: none;
  padding: 0 3px;
}
.tab .nav-tabs .nav-item {
  margin-bottom: 0;
  overflow: hidden;
  font-size: 12px;
  font-weight: 400;
}
.tab .nav-tabs .nav-link {
  border: none;
  color: #000;
  padding: 8px 8px;
  border-radius: 0.25rem;
  outline: 0;
  font-size: 12px;
  background: transparent;
  text-align: center;
}
.tab .nav-tabs .nav-link:hover {
  color: #6d0015;
}
.tab .nav-tabs .nav-link.active {
  background-color: #89021b;
  color: #fff;
}
.tab.tabmenu .nav-tabs {
  position: relative;
}
.tab.tabmenu .nav-tabs.-primary {
  display: flex;
}
.tab.tabmenu .nav-tabs.-primary > li {
  flex-grow: 1;
}
.tab.tabmenu .nav-tabs .-secondary {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  z-index: 1000;
}
.tab.tabmenu .nav-tabs .-secondary .nav-link {
  text-align: left;
}
.tab.tabmenu .nav-tabs .\--hidden {
  display: none;
}
.tab.tabmenu .nav-tabs .-more i.i {
  display: inline-block;
  margin-left: -6px;
}
.tab.tabmenu .nav-tabs .-more i.i.mdi:before {
  width: 10px;
  font-size: 24px;
  line-height: 10px;
}
.tab.tabmenu.\--show-secondary .-secondary {
  display: block;
}
.tab.tabmenu:not(.\--jsfied) {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.content {
  padding-left: 15px;
  padding-right: 15px;
}
.content.errorNotExist .card {
  border: 1px solid #9b2621;
  box-shadow: 0 2px 6px rgba(192, 0, 0, 0.5);
  overflow: hidden;
}
.content.errorNotExist .card .card-header {
  background: #9b2621;
  color: #fff;
}
.content.errorNotExist .card .card-body {
  font-size: 16px;
  font-weight: 400;
  background: #FFF6F8;
}
.sidebar {
  padding-left: 0;
  padding-right: 0;
  position: fixed;
  z-index: 11;
  background-color: #efefef;
  top: 53px;
  left: 0;
  min-width: 180px;
  height: calc( 100% - 40px );
  transition: transform 0.15s;
  transform-origin: left;
  transform: scaleX(1);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}
.sidebar .sideHeader {
  color: #fff;
  background: #6f0014;
  background: -webkit-gradient(left top, left bottom, color-stop(0%, #6f0014), color-stop(78%, #9b031f), color-stop(100%, #9b031f));
  background: linear-gradient(to bottom, #6f0014 0%, #9b031f 78%, #9b031f 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#6f0014", endColorstr="#9b031f", GradientType=0);
  padding: 0 5px;
  height: 53px;
  z-index: 100;
  margin-left: -5px;
  width: calc(100% + 5px);
}
.sidebar .sideHeader .menu-toggler {
  width: 40px;
  height: 53px;
  line-height: 58px;
  color: #ccc;
  cursor: pointer;
  float: left;
}
.sidebar .sideHeader .navbar-brand {
  background: url(/images/logo.png?43f50b63e5a771fa647d74a14216fe93) no-repeat;
  width: calc( 100% - 40px );
  height: 53px;
  background-size: contain;
  background-position: center;
  float: left;
  padding: 0;
  margin: 0;
}
@media (max-width: 768px) {
  .sidebar .sideHeader .navbar-brand {
    height: 53px;
  }
}
.sidebar.right {
  transform-origin: right;
  z-index: 8;
}
.sidebar:not(.show) {
  transform: scaleX(0);
  display: block;
}
.advSearch {
  transition: transform 0.15s;
  transform-origin: top;
  margin-bottom: 80px;
}
.advSearch.hidden {
  transform: scaleY(0);
  height: 0;
  overflow: hidden;
  margin-bottom: 0;
}
.orderStatus {
  /*
            case 2:
                return __('orderstatus.unpayed');
            case 3:
                return __('orderstatus.payed');
            case 4:
                return __('orderstatus.sent');
            case 5:
                return __('orderstatus.delivered');
            case 6:
                return __('orderstatus.canceled');
            case 7:
                return __('orderstatus.returned');
            case 8:
                return __('orderstatus.archived');*/
}
.orderStatus.status-1 {
  color: #000066;
}
.orderStatus.status-2 {
  color: #660000;
}
.orderStatus.status-3 {
  color: #006600;
}
.orderStatus.status-4 {
  color: #666600;
}
.orderStatus.status-5 {
  color: #006600;
}
.orderStatus.status-6 {
  color: #660000;
}
.orderStatus.status-7 {
  color: #666600;
}
.orderStatus.status-8 {
  color: #006666;
}
.statusBadge {
  display: inline-block;
  padding: 2px 6px;
  border-radius: 0.25rem;
}
.statusBadge.orderStatus {
  color: #fff;
  font-weight: 700;
  font-size: 11px;
}
.statusBadge.orderStatus.status-1 {
  background: #6969ac;
}
.statusBadge.orderStatus.status-2 {
  background: #ac6969;
}
.statusBadge.orderStatus.status-3 {
  background: #69ac69;
}
.statusBadge.orderStatus.status-4 {
  background: #acac69;
}
.statusBadge.orderStatus.status-5 {
  background: #69ac69;
}
.statusBadge.orderStatus.status-6 {
  background: #ac69ac;
}
.statusBadge.orderStatus.status-7 {
  background: #69acac;
}
.statusBadge.orderStatus.status-8 {
  background: #696969;
}
@media (max-width: 500px) {
  .container {
    max-width: 100%;
  }
}
/*@media (min-width: 500px) {
    .container {
        //width: 100%;
        max-width: 100%;
    }
}*/
@media (min-width: 576px) {
  .userProfileLink {
    display: inline-block;
  }
  .container {
    max-width: 100%;
  }
}
@media (min-width: 770px) {
  .container {
    width: 100%;
    max-width: 100%;
  }
}
@media (max-width: 768px) {
  .container > .row > .col-md-8 {
    width: calc( 100% - 180px );
  }
  .container .sidebar {
    padding-left: 5px;
    top: 0;
    z-index: 101;
    height: calc(100% - 0px);
  }
  .container .sidebar.right {
    left: unset;
    transform-origin: right;
    right: 0;
    z-index: unset;
    transform: scaleX(1);
    max-width: 180px;
    top: 53px;
    height: unset;
    box-shadow: none;
    padding-left: unset;
    padding-right: 5px;
  }
  .container .lmenu {
    max-height: calc(100vh - 53px);
  }
  .container .lmenu.sticky-top {
    top: 0;
  }
  .container .lmenu .sideHeader {
    display: block;
  }
  .container.tabletfull > .row > .col-md-8 {
    width: 100%;
  }
  .container.tabletfull .sidebar.right {
    transform: scaleX(0);
  }
}
@media (max-width: 760px) {
  .container > .row > .col-md-8 {
    width: 100%;
  }
  .container .sidebar.right {
    left: unset;
    transform-origin: right;
    right: 0;
    z-index: 20;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  }
  .container .sidebar.right:not(.show) {
    transform: scaleX(0);
  }
}
@media (max-width: 1200px) {
  /*.container {
        max-width: 1140px;
    }*/
}
@media (min-width: 770px) {
  .container {
    max-width: 1140px;
  }
  .navbar .navbar-brand {
    display: inline-block;
  }
  .memberProfileTop .py-2 {
    display: flex;
  }
  .memberProfileTop .memberProfile {
    clear: none;
  }
  .sidebar {
    position: relative;
    z-index: unset;
    background-color: transparent;
    top: unset;
    left: unset;
    width: unset;
    min-width: unset;
    height: unset;
    overflow: unset;
    transition: transform 0.15s;
    transform-origin: left;
    transform: scaleX(1);
    box-shadow: none;
  }
  .sidebar .sideHeader {
    display: none;
  }
  .sidebar.right {
    transform-origin: right;
  }
  .sidebar:not(.show) {
    transition: none;
    transform: scaleX(1);
  }
  .memberProfileTop .memberProfileInfo {
    clear: none;
    padding-top: 0;
    margin-left: 230px;
    width: calc( 100% - 230px );
  }
  .memberProfileTop .memberProfileClubInfo {
    clear: none;
    padding-top: 0;
    margin-left: 320px;
    width: calc( 100% - 320px );
  }
}
@media (min-width: 700px) {
  .navbar form#topSearchForm {
    width: 300px;
  }
  .navbar .popupTopSearchPopup {
    display: none;
  }
  .navbar input.topSearch,
  .navbar button.topSearch {
    display: unset;
  }
}
/*img {
    object-fit: cover;

    height: 100%;
    width: 100%;
}*/
.wallCarousel {
  height: 0;
  overflow: hidden;
  padding-top: 50%;
  background: white;
  position: relative;
}
.wallCarousel .carousel-control-prev,
.wallCarousel .carousel-control-next {
  z-index: 10;
}
.wallCarousel .carousel-inner {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.wallCarousel .carousel-item {
  height: 100%;
}
.wallCarousel .carousel-item img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  width: 100%;
  max-height: 100%;
}
.wallCarousel .carousel-caption {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  text-align: left;
  color: initial;
  padding: 0;
}
.wallCarousel .carousel-caption h3 {
  max-width: 60%;
  font-size: 26px;
  line-height: 30px;
  text-transform: none;
  font-weight: 600;
  letter-spacing: 0;
}
@media (min-width: 1100px) {
  .wallCarousel .carousel-caption h3 {
    font-size: 40px;
    line-height: 46px;
  }
}
.wallCarousel .carousel-caption a {
  text-decoration: none;
}
.wallCarousel .carousel-caption p {
  text-transform: none;
}
.wallSharePreview {
  width: 100%;
}
.wallSharePreview .postPhoto {
  padding: 10px 20px;
  height: 300px;
  overflow: hidden;
}
.wallSharePreview .postPhoto .photoImg {
  height: 100%;
}
.wallSharePreview .postPhoto .photoImg img {
  -o-object-fit: contain;
     object-fit: contain;
  height: 100%;
  width: 100%;
}
.wallRooms {
  overflow-x: auto;
  overflow-y: hidden;
  height: auto;
}
.wallRooms .createRoomButton {
  height: 40px;
  line-height: 40px;
  border-radius: 20px;
  background: #ccc;
  box-shadow: none;
  outline: 0;
  color: #333;
  float: left;
  padding: 0 10px;
  margin-right: 10px;
  cursor: pointer;
  transform-origin: center;
  transition: 0.2s all;
}
.wallRooms .createRoomButton i.i {
  margin-right: 10px;
  float: left;
}
.wallRooms .createRoomButton i.i.mdi:before {
  line-height: 40px;
}
.wallRooms .createRoomButton:hover {
  color: #fff;
  background: #999;
}
.wallRooms .roomList {
  /* height: 40px; */
  display: flex;
  flex-direction: row;
}
.wallRooms .roomList .room {
  float: left;
  margin-right: 5px;
  position: relative;
}
.wallRooms .roomList .room a {
  display: block;
  height: 40px;
  width: 40px;
}
.wallRooms .roomList .room a img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.wallRooms .roomList .room .countBadge {
  top: 0;
  right: 0;
}
.wallRooms .roomList .empty {
  line-height: 40px;
  color: #999;
}
.sharePost {
  margin-bottom: 10px;
}
.carousel-fade .carousel-item {
  opacity: 0;
  transition-duration: 0.6s;
  transition-property: opacity;
  display: block;
  height: 350px;
}
.carousel-fade .carousel-item img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 100%;
  width: 100%;
}
.carousel-fade .carousel-item .carousel-caption {
  left: 5%;
  right: 5%;
  top: 10%;
  bottom: 10%;
  text-align: left;
}
.carousel-fade .carousel-item .carousel-caption h3 {
  max-width: 60%;
  font-size: 32px;
  line-height: 68px;
  text-transform: none;
  font-weight: 500;
  letter-spacing: 0;
}
@media (min-width: 1100px) {
  .carousel-fade .carousel-item .carousel-caption h3 {
    font-size: 54px;
  }
}
.carousel-fade .carousel-item .carousel-caption p {
  font-size: 18px;
  line-height: 40px;
  text-transform: none;
  font-weight: 400;
}
.carousel-fade .carousel-item.active,
.carousel-fade .carousel-item-next.carousel-item-left,
.carousel-fade .carousel-item-prev.carousel-item-right {
  opacity: 1;
}
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-right {
  opacity: 0;
}
.carousel-fade .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-prev {
  transform: translateX(0);
  transform: translate3d(0, 0, 0);
}
/*! =======================================================
                      VERSION  11.0.2
========================================================= */
/*! =========================================================
 * bootstrap-slider.js
 *
 * Maintainers:
 *		Kyle Kemp
 *			- Twitter: @seiyria
 *			- Github:  seiyria
 *		Rohit Kalkur
 *			- Twitter: @Rovolutionary
 *			- Github:  rovolution
 *
 * =========================================================
 *
 * bootstrap-slider is released under the MIT License
 * Copyright (c) 2019 Kyle Kemp, Rohit Kalkur, and contributors
 *
 * Permission is hereby granted, free of charge, to any person
 * obtaining a copy of this software and associated documentation
 * files (the "Software"), to deal in the Software without
 * restriction, including without limitation the rights to use,
 * copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the
 * Software is furnished to do so, subject to the following
 * conditions:
 *
 * The above copyright notice and this permission notice shall be
 * included in all copies or substantial portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
 * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
 * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
 * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
 * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
 * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
 * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
 * OTHER DEALINGS IN THE SOFTWARE.
 *
 * ========================================================= */
.slider {
  display: inline-block;
  vertical-align: middle;
  position: relative;
}
.slider.slider-horizontal {
  width: 210px;
  height: 20px;
}
.slider.slider-horizontal .slider-track {
  height: 10px;
  width: 100%;
  margin-top: -5px;
  top: 50%;
  left: 0;
}
.slider.slider-horizontal .slider-selection,
.slider.slider-horizontal .slider-track-low,
.slider.slider-horizontal .slider-track-high {
  height: 100%;
  top: 0;
  bottom: 0;
}
.slider.slider-horizontal .slider-tick,
.slider.slider-horizontal .slider-handle {
  margin-left: -10px;
}
.slider.slider-horizontal .slider-tick.triangle,
.slider.slider-horizontal .slider-handle.triangle {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  border-width: 0 10px 10px 10px;
  width: 0;
  height: 0;
  border-bottom-color: #036fa5;
  margin-top: 0;
}
.slider.slider-horizontal .slider-tick-container {
  white-space: nowrap;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.slider.slider-horizontal .slider-tick-label-container {
  white-space: nowrap;
  margin-top: 20px;
}
.slider.slider-horizontal .slider-tick-label-container .slider-tick-label {
  display: inline-block;
  text-align: center;
}
.slider.slider-horizontal.slider-rtl .slider-track {
  left: initial;
  right: 0;
}
.slider.slider-horizontal.slider-rtl .slider-tick,
.slider.slider-horizontal.slider-rtl .slider-handle {
  margin-left: initial;
  margin-right: -10px;
}
.slider.slider-horizontal.slider-rtl .slider-tick-container {
  left: initial;
  right: 0;
}
.slider.slider-vertical {
  height: 210px;
  width: 20px;
}
.slider.slider-vertical .slider-track {
  width: 10px;
  height: 100%;
  left: 25%;
  top: 0;
}
.slider.slider-vertical .slider-selection {
  width: 100%;
  left: 0;
  top: 0;
  bottom: 0;
}
.slider.slider-vertical .slider-track-low,
.slider.slider-vertical .slider-track-high {
  width: 100%;
  left: 0;
  right: 0;
}
.slider.slider-vertical .slider-tick,
.slider.slider-vertical .slider-handle {
  margin-top: -10px;
}
.slider.slider-vertical .slider-tick.triangle,
.slider.slider-vertical .slider-handle.triangle {
  border-width: 10px 0 10px 10px;
  width: 1px;
  height: 1px;
  border-left-color: #036fa5;
  margin-left: 0;
}
.slider.slider-vertical .slider-tick-label-container {
  white-space: nowrap;
}
.slider.slider-vertical .slider-tick-label-container .slider-tick-label {
  padding-left: 4px;
}
.slider.slider-vertical.slider-rtl .slider-track {
  left: initial;
  right: 25%;
}
.slider.slider-vertical.slider-rtl .slider-selection {
  left: initial;
  right: 0;
}
.slider.slider-vertical.slider-rtl .slider-tick.triangle,
.slider.slider-vertical.slider-rtl .slider-handle.triangle {
  border-width: 10px 10px 10px 0;
}
.slider.slider-vertical.slider-rtl .slider-tick-label-container .slider-tick-label {
  padding-left: initial;
  padding-right: 4px;
}
.slider.slider-disabled .slider-handle {
  background-color: #cfcfcf;
  background-image: linear-gradient(to bottom, #DFDFDF, #BEBEBE);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#DFDFDF', endColorstr='#BEBEBE', GradientType=0);
}
.slider.slider-disabled .slider-track {
  background-color: #e7e7e7;
  background-image: linear-gradient(to bottom, #E5E5E5, #E9E9E9);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E5E5E5', endColorstr='#E9E9E9', GradientType=0);
  cursor: not-allowed;
}
.slider input {
  display: none;
}
.slider .tooltip-inner {
  white-space: nowrap;
  max-width: none;
}
.slider .bs-tooltip-top .tooltip-inner,
.slider .bs-tooltip-bottom .tooltip-inner {
  position: relative;
  left: -50%;
}
.slider.bs-tooltip-left .tooltip-inner,
.slider.bs-tooltip-right .tooltip-inner {
  position: relative;
  top: -100%;
}
.slider .tooltip {
  pointer-events: none;
}
.slider .tooltip.bs-tooltip-top .arrow,
.slider .tooltip.bs-tooltip-bottom .arrow {
  left: -0.4rem;
}
.slider .tooltip.bs-tooltip-top {
  margin-top: -44px;
}
.slider .tooltip.bs-tooltip-bottom {
  margin-top: 2px;
}
.slider .tooltip.bs-tooltip-left,
.slider .tooltip.bs-tooltip-right {
  margin-top: -14px;
}
.slider .tooltip.bs-tooltip-left .arrow,
.slider .tooltip.bs-tooltip-right .arrow {
  top: 8px;
}
.slider .hide {
  display: none;
}
.slider-track {
  background-color: #f7f7f7;
  background-image: linear-gradient(to bottom, #F5F5F5, #F9F9F9);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F5F5F5', endColorstr='#F9F9F9', GradientType=0);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  position: absolute;
  cursor: pointer;
}
.slider-selection {
  background-color: #f7f7f7;
  background-image: linear-gradient(to bottom, #F9F9F9, #F5F5F5);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F9F9F9', endColorstr='#F5F5F5', GradientType=0);
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  box-sizing: border-box;
  border-radius: 4px;
  position: absolute;
}
.slider-selection.tick-slider-selection {
  background-color: #46c1fe;
  background-image: linear-gradient(to bottom, #52c5ff, #3abcfd);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#52c5ff', endColorstr='#3abcfd', GradientType=0);
}
.slider-track-low,
.slider-track-high {
  box-sizing: border-box;
  border-radius: 4px;
  position: absolute;
  background: transparent;
}
.slider-handle {
  background-color: #0478b2;
  background-image: linear-gradient(to bottom, #0480BE, #036fa5);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0480BE', endColorstr='#036fa5', GradientType=0);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
  position: absolute;
  top: 0;
  width: 20px;
  height: 20px;
  background-color: #0480BE;
  border: 0px solid transparent;
}
.slider-handle:hover {
  cursor: pointer;
}
.slider-handle.round {
  border-radius: 20px;
}
.slider-handle.triangle {
  background: transparent none;
}
.slider-handle.custom {
  background: transparent none;
}
.slider-handle.custom::before {
  line-height: 20px;
  font-size: 20px;
  content: '\2605';
  color: #726204;
}
.slider-tick {
  background-color: #f7f7f7;
  background-image: linear-gradient(to bottom, #F5F5F5, #F9F9F9);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F5F5F5', endColorstr='#F9F9F9', GradientType=0);
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  box-sizing: border-box;
  position: absolute;
  cursor: pointer;
  width: 20px;
  height: 20px;
  filter: none;
  opacity: 0.8;
  border: 0px solid transparent;
}
.slider-tick.round {
  border-radius: 50%;
}
.slider-tick.triangle {
  background: transparent none;
}
.slider-tick.custom {
  background: transparent none;
}
.slider-tick.custom::before {
  line-height: 20px;
  font-size: 20px;
  content: '\2605';
  color: #726204;
}
.slider-tick.in-selection {
  background-color: #46c1fe;
  background-image: linear-gradient(to bottom, #52c5ff, #3abcfd);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#52c5ff', endColorstr='#3abcfd', GradientType=0);
  opacity: 1;
}
/*!
 * bootstrap-star-rating v4.0.6
 * http://plugins.krajee.com/star-rating
 *
 * Author: Kartik Visweswaran
 * Copyright: 2013 - 2019, Kartik Visweswaran, Krajee.com
 *
 * Licensed under the BSD 3-Clause
 * https://github.com/kartik-v/bootstrap-star-rating/blob/master/LICENSE.md
 */
.rating-loading {
  width: 25px;
  height: 25px;
  font-size: 0;
  color: #fff;
  background: transparent url(/images/vendor/bootstrap-star-rating/loading.gif?13630905267b809161e71d0f8a0c017b) top left no-repeat;
  border: none;
}
/*
 * Stars & Input
 */
.rating-container .rating-stars {
  position: relative;
  cursor: pointer;
  vertical-align: middle;
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
}
.rating-container .rating-input {
  position: absolute;
  cursor: pointer;
  width: 100%;
  height: 1px;
  bottom: 0;
  left: 0;
  font-size: 1px;
  border: none;
  background: none;
  opacity: 0;
  padding: 0;
  margin: 0;
}
.rating-container.is-display-only .rating-input,
.rating-container.is-display-only .rating-stars {
  cursor: default;
}
.rating-disabled .rating-input,
.rating-disabled .rating-stars {
  cursor: not-allowed;
}
.rating-container .star {
  display: inline-block;
  margin: 0 2px;
  text-align: center;
}
.rating-container .empty-stars {
  color: #aaa;
}
.rating-container .filled-stars {
  position: absolute;
  left: 0;
  top: 0;
  margin: auto;
  color: #fde16d;
  white-space: nowrap;
  overflow: hidden;
  -webkit-text-stroke: 1px #777;
  text-shadow: 1px 1px #999;
}
.rating-rtl {
  float: right;
}
.rating-animate .filled-stars {
  transition: width 0.25s ease;
}
.rating-rtl .filled-stars {
  left: auto;
  right: 0;
  transition: none;
  transform: matrix(-1, 0, 0, 1, 0, 0);
}
.rating-rtl.is-star .filled-stars {
  right: 0.06em;
}
.rating-rtl.is-heart .empty-stars {
  margin-right: 0.07em;
}
/**
 * Clear
 */
.rating-container .clear-rating {
  color: #aaa;
  cursor: not-allowed;
  display: inline-block;
  vertical-align: middle;
  font-size: 60%;
}
.clear-rating-active {
  cursor: pointer !important;
}
.clear-rating-active:hover {
  color: #843534;
}
.rating-container .clear-rating {
  padding-right: 5px;
}
/**
 * Caption
 */
/* extend support to BS4 */
.rating-container .caption .label {
  display: inline-block;
  padding: 0.25em 0.4em;
  line-height: 1;
  text-align: center;
  vertical-align: baseline;
  border-radius: 0.25rem;
}
.rating-container .caption {
  color: #999;
  display: inline-block;
  vertical-align: middle;
  line-height: 1;
}
.rating-container .caption {
  margin-left: 5px;
  margin-right: 0;
}
.rating-rtl .caption {
  margin-right: 5px;
  margin-left: 0;
}
/**
 * Print
 */
@media print {
  .rating-container .clear-rating {
    display: none;
  }
}
/**
 * Sizes
 */
.rating-xl {
  font-size: 48px;
}
.rating-lg {
  font-size: 40px;
}
.rating-md {
  font-size: 32px;
}
.rating-sm {
  font-size: 24px;
}
.rating-xs {
  font-size: 16px;
}
.rating-xl .caption {
  font-size: 20px;
}
.rating-lg .caption {
  font-size: 18px;
}
.rating-md .caption {
  font-size: 16px;
}
.rating-sm .caption {
  font-size: 14px;
}
.rating-xs .caption {
  font-size: 12px;
}
.ratingStars {
  display: inline-block;
  float: left;
  line-height: 26px;
  color: #9b2621;
}
.ratingStars.small i.i.mdi:before {
  font-size: 16px;
}
.ratingCount {
  display: inline-block;
  margin-left: 5px;
  line-height: 20px;
  float: left;
}
.slider-track {
  background: #ccc;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  position: absolute;
  cursor: pointer;
}
.slider.slider-horizontal .slider-track {
  height: 6px;
  width: 100%;
  margin-top: -5px;
  top: 50%;
  left: 0;
}
.slider-handle {
  background: #9b2621;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
  position: absolute;
  top: 0;
  width: 16px;
  height: 16px;
  border: 3px solid #fff;
}
.slider-selection {
  background: #C77584;
}
.slider-tick {
  background: #ccc;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  box-sizing: border-box;
  position: absolute;
  cursor: pointer;
  width: 16px;
  height: 16px;
  filter: none;
  opacity: 0.8;
  border: 3px solid #fff;
}
.slider-tick.in-selection {
  background: #9b2621;
  opacity: 1;
  filter: none;
}
.slider-selection.tick-slider-selection {
  background: #C77584;
  filter: none;
}
.slider.slider-horizontal {
  max-width: 100%;
  width: 100%;
}
.slider-sm .slider.slider-horizontal {
  width: 160px;
}
.sliderContainer {
  display: flex;
  line-height: 32px;
}
.sliderContainer .sliderMin {
  width: 30px;
  text-align: right;
  position: relative;
  z-index: 1;
}
.sliderContainer .sliderMax {
  width: 30px;
  text-align: left;
  position: relative;
  z-index: 1;
}
.sliderContainer .sliderMax.max2 {
  width: 60px;
}
.sliderContainer .sliderInput {
  width: calc(100% - 60px);
  position: relative;
  z-index: 2;
  padding: 0 15px;
}
.sliderContainer .sliderInput.max2 {
  width: calc(100% - 90px);
}
.partner .slider-sm .slider.slider-horizontal {
  width: 80px;
}
.genderHeader {
  text-align: center;
  margin-top: 10px;
}
.genderHeader .gIcon {
  border-radius: 6px;
  width: 32px;
  height: 32px;
  margin-bottom: 10px;
  padding: 4px;
  display: inline-block;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}
.genderBlock {
  border: 1px solid #ccc;
  border-radius: 10px;
  padding: 10px;
}
.genderBlock .row {
  margin-right: 0;
  margin-left: 0;
}
.genderBlock .col-form-label {
  padding-left: 0;
  padding-right: 0;
  line-height: 1.2;
  padding-top: calc(0.275rem + 1px);
}
.genderBlock.mf {
  border-color: #aa49e6;
}
.genderBlock.mf .col-form-label {
  color: #aa49e6;
}
.genderBlock.m {
  border-color: #4272e5;
}
.genderBlock.m .col-form-label {
  color: #4272e5;
}
.genderBlock.f {
  border-color: #e649bc;
}
.genderBlock.f .col-form-label {
  color: #e649bc;
}
.btn-group {
  border: none;
  border-radius: 0.25rem;
  max-width: 100%;
  display: inline;
}
.btn-group .btn {
  line-height: 1.4;
  padding: 0.15rem 0.15rem;
}
.btn-group .btn.btn-icon {
  padding: 0.15rem 0;
}
.btn-group .btn i.i.mdi:before {
  line-height: 10px;
}
.btn {
  font-size: 13px;
}
.col-form-label {
  line-height: 1.4;
  padding-top: calc(0.275rem + 1px);
}
label {
  font-size: 13px;
}
.form-group {
  margin-bottom: 0.5rem;
}
.multiselect-container > li > a > label {
  padding-left: 5px;
  white-space: nowrap;
}
.profileForm .btn-secondary.btn-check,
.filterForm .btn-secondary.btn-check {
  background-color: #fff;
  border-color: #9b2621;
  color: #333;
}
.profileForm .btn-secondary.btn-check.active,
.filterForm .btn-secondary.btn-check.active {
  background-color: #9b2621;
  border-color: #9b2621;
  color: #fff;
}
#memberSearchForm .btn-secondary,
#eventSearchForm .btn-secondary,
#clubSearchForm .btn-secondary,
#advertSearchForm .btn-secondary,
.eventSearch .btn-secondary {
  background-color: #fff;
  color: #333;
  border-color: #fff;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
  margin: 1px;
  border-radius: 0.25rem;
}
#memberSearchForm .btn-secondary:hover,
#eventSearchForm .btn-secondary:hover,
#clubSearchForm .btn-secondary:hover,
#advertSearchForm .btn-secondary:hover,
.eventSearch .btn-secondary:hover {
  border-color: #DEB2BA;
}
#memberSearchForm .btn-secondary.btn-icon,
#eventSearchForm .btn-secondary.btn-icon,
#clubSearchForm .btn-secondary.btn-icon,
#advertSearchForm .btn-secondary.btn-icon,
.eventSearch .btn-secondary.btn-icon {
  color: #9b2621;
}
#memberSearchForm .btn-secondary.active,
#eventSearchForm .btn-secondary.active,
#clubSearchForm .btn-secondary.active,
#advertSearchForm .btn-secondary.active,
.eventSearch .btn-secondary.active {
  box-shadow: none;
  background-color: #C77584;
  border-color: #6d0015;
}
#memberSearchForm .btn-secondary.active:hover,
#eventSearchForm .btn-secondary.active:hover,
#clubSearchForm .btn-secondary.active:hover,
#advertSearchForm .btn-secondary.active:hover,
.eventSearch .btn-secondary.active:hover {
  border-color: #9b2621;
}
#memberSearchForm .btn-secondary.active.btn-icon,
#eventSearchForm .btn-secondary.active.btn-icon,
#clubSearchForm .btn-secondary.active.btn-icon,
#advertSearchForm .btn-secondary.active.btn-icon,
.eventSearch .btn-secondary.active.btn-icon {
  color: #FFF6F8;
}
#messagesContainer {
  position: fixed;
  bottom: 0;
  text-align: right;
  width: 100%;
  padding: 0 10px;
}
#messagesContainer .message {
  text-align: left;
  border: 1px solid #ccc;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  background: #f3f3f3;
  display: inline-block;
  width: 200px;
}
#messagesContainer .message .title {
  padding: 4px 6px;
  font-size: 13px;
  font-weight: bold;
}
.editSectionHeader {
  text-align: center;
  padding: 10px 0;
  font-weight: 700;
  color: #666;
}
.marker {
  display: table;
  width: 50px;
  height: 50px;
  background-color: #fff;
  border: 3px solid #ccc;
  border-radius: 50%;
  color: #fff;
  font-weight: bold;
  text-align: center;
  overflow: hidden;
}
.marker img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 50px;
  height: 50px;
}
.marker span {
  display: table-cell;
  vertical-align: middle;
}
.marker-pin {
  width: 30px;
  height: 30px;
  border-radius: 50% 50% 50% 0;
  background: #9b031f;
  position: absolute;
  transform: rotate(-45deg);
  left: 50%;
  top: 50%;
  margin: -15px 0 0 -15px;
}
.marker-pin.m,
.marker-pin.mm {
  background: #4272e5;
}
.marker-pin.f,
.marker-pin.ff {
  background: #e649bc;
}
.marker-pin.mf {
  background: #aa49e6;
}
.marker-pin::after {
  content: '';
  width: 24px;
  height: 24px;
  margin: 3px 0 0 3px;
  background: transparent;
  position: absolute;
  border-radius: 50%;
}
.custom-div-icon i.i {
  position: absolute;
  width: 22px;
  font-size: 22px;
  left: 0;
  right: 0;
  margin: 8px auto;
  text-align: center;
  color: #fff;
}
.custom-div-icon i.i.fa {
  margin: 12px auto;
  font-size: 17px;
}
.custom-div-icon i.i.mdi {
  font-size: 18px;
}
.custom-div-icon i.i.mdi::before {
  font-size: 18px;
}
.mapProfileInfo {
  width: 200px;
  height: 100px;
  position: relative;
}
.mapProfileInfo .mapImg {
  position: absolute;
}
.mapProfileInfo .mapImg img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100px;
  height: 100px;
  overflow: hidden;
  border-radius: 50%;
}
.mapProfileInfo .mapProfile {
  position: absolute;
  top: 0;
  left: 100px;
  padding: 0 10px;
}
.mapProfileInfo .mapProfile a {
  font-size: 14px;
  font-weight: 700;
  text-align: left;
  color: #000;
}
.mapProfileInfo .mapProfile .mapSummary {
  font-size: 10px;
  font-weight: 500;
  text-align: left;
  margin-top: 5px;
  color: #fff;
}
.mapProfileInfo .mapProfile .mapSummary .admin {
  color: #f00;
}
.mapProfileInfo .mapProfile .mapSummary .seller {
  color: #666;
}
.mapProfileInfo .mapProfile .mapSummary .m {
  color: #4272e5;
}
.mapProfileInfo .mapProfile .mapSummary .f {
  color: #e649bc;
}
.addressCheck {
  transition: opacity 0.2s;
  opacity: 0;
  overflow: hidden;
  background: transparent;
  height: auto;
  font-size: 10px;
  padding: 2px 0;
}
.addressCheck.active {
  transition: opacity 0.2s;
  opacity: 1;
}
input:focus ~ .addressCheck {
  opacity: 1;
  height: auto;
}
.addressInput {
  position: relative;
}
.addressInput .addressCountry {
  position: absolute;
  height: 100%;
  top: 0;
  left: 0;
  display: inline-block;
  padding: 7px 4px;
}
.addressInput .addressInfo {
  position: absolute;
  height: 100%;
  top: 0;
  right: 0;
  display: inline-block;
  padding: 5px 4px;
  font-size: 10px;
  line-height: 21px;
  color: #666;
}
.addressInput .addressInfo i.i {
  font-size: 14px;
}
.addressInput input {
  padding-left: 24px;
}
.myReviewTitle {
  float: left;
}
.myReview {
  font-weight: 400;
  font-size: 16px;
  clear: both;
  /*  padding-bottom: 20px;
      margin-bottom: 20px;
      border-bottom: 1px solid #ccc;*/
}
.adminRatings {
  width: 100%;
}
.adminRatings .card.rating {
  width: calc( 33.3% - 10px );
  float: left;
  margin: 5px;
}
.adminRatings .card.rating .walllist .wall {
  padding: 10px 5px 30px 5px;
}
.adminRatings .card.rating .profileAvatar .profileImg > img {
  width: 30px;
  height: 30px;
}
.adminRatings .card.rating .postList .postHeader .postInfo {
  width: calc(100% - 40px);
}
.adminRatings .card.rating .postList .postHeader .postInfo .postUser {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.adminRatings .card.rating .postList .postActions {
  top: 46px;
  right: 5px;
}
.adminRatings .card.rating .postList .postActions.second {
  right: 40px;
  opacity: 1;
  top: 50px;
}
@media (max-width: 550px) {
  .adminRatings .card.rating {
    width: calc( 50% - 10px );
  }
}
.buttonIcon {
  display: inline-block;
  right: 0;
  position: relative;
  border: none;
  cursor: pointer;
  color: #666;
  background-color: transparent;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  transition: 0.1s all;
}
.buttonIcon.left {
  right: unset;
  left: 0;
}
.buttonIcon.abs {
  position: absolute;
}
.buttonIcon:hover {
  background: #eee;
}
.buttonIcon i.i {
  display: inline-block;
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
}
.buttonIcon i.i::before {
  height: 40px;
  width: 40px;
  line-height: 40px;
}
.buttonIcon.small {
  width: 30px;
  height: 30px;
}
.buttonIcon.small i.i {
  height: 30px;
  width: 30px;
  line-height: 20px;
  text-align: center;
}
.buttonIcon.small i.i::before {
  font-size: 18px;
  height: 30px;
  width: 30px;
  line-height: 30px;
}
.buttonIcon.active {
  color: #fff;
  background: #9b2621;
}
.buttonIcon.active:hover {
  color: #fff;
  background: #9b2621;
}
.buttonIcon.disabled {
  color: #999;
  cursor: not-allowed;
}
.buttonIcon.disabled:hover {
  color: #999;
  background: transparent;
}
.buttonIcon.sep {
  width: 10px;
  color: transparent !important;
  background: transparent !important;
  cursor: default;
}
.buttonIcon.sep i.i {
  width: 10px;
}
.buttonIcon.sep i.i::before {
  content: '-';
  color: transparent;
}
.buttonIcon.sep.small {
  width: 10px;
}
.buttonIcon.sep.small i.i {
  width: 10px;
}
.buttonIcon.sep:hover {
  color: transparent !important;
  background: transparent !important;
}
.buttonText {
  display: inline-block;
  right: 0;
  position: relative;
  border: none;
  cursor: pointer;
  color: #999;
  background-color: transparent;
  width: auto;
  height: 40px;
  border-radius: 20px;
  transition: 0.1s all;
  white-space: nowrap;
  line-height: 40px;
}
.buttonText.left {
  right: unset;
  left: 0;
}
.buttonText.abs {
  position: absolute;
}
.buttonText:hover {
  background: #eee;
  text-decoration: none;
}
.buttonText i.i {
  display: inline-block;
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
}
.buttonText i.i::before {
  height: 40px;
  width: 40px;
  line-height: 40px;
}
.buttonText > span {
  display: inline-block;
  line-height: 40px;
  padding-right: 15px;
  vertical-align: top;
  font-weight: 600;
}
.buttonText.small {
  height: 30px;
  border-radius: 15px;
  line-height: 30px;
}
.buttonText.small i.i {
  height: 30px;
  width: 30px;
  line-height: 20px;
  text-align: center;
}
.buttonText.small i.i::before {
  font-size: 18px;
  height: 30px;
  width: 30px;
  line-height: 30px;
}
.buttonText.small > span {
  line-height: 30px;
  padding-right: 15px;
}
.buttonText.active {
  color: #fff;
  background: #9b2621;
}
.buttonText.active:hover {
  color: #fff;
  background: #9b2621;
}
.buttonText.disabled {
  color: #999;
  cursor: default;
}
.buttonText.disabled:hover {
  color: #999;
  background: transparent;
}
.buttonMenu {
  background: #fff;
  border-raduis: 20px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.actionsButton {
  position: absolute;
  top: 10px;
  right: 10px;
}
.actionsButton.noPos {
  position: relative;
  top: unset;
  right: unset;
}
.actionsButton.noTop {
  top: unset;
}
.actionsButton.inline {
  display: inline-block;
}
@media (max-width: 768px) {
  .actionsButton {
    opacity: 1;
  }
}
.actionsButton .button {
  cursor: pointer;
}
.actionsButton > .buttonIcon,
.actionsButton > .buttonText {
  color: #999;
}
.actionsButton > .buttonIcon:hover,
.actionsButton > .buttonText:hover {
  color: #333;
  background: #eee;
}
.actionsButton > .buttonIcon.active,
.actionsButton > .buttonText.active {
  opacity: 1;
  color: #fff;
  background: #9b2621;
}
.actionsButton > .buttonIcon.active:hover,
.actionsButton > .buttonText.active:hover {
  color: #fff;
  background: #9b2621;
}
.actionsButton > .buttonIcon.selected,
.actionsButton > .buttonText.selected {
  opacity: 1;
  background: #ccc;
}
.actionsButton > .buttonIcon.btnGreen,
.actionsButton > .buttonText.btnGreen {
  color: #009900;
  background: #ccffcc;
}
.actionsButton > .buttonIcon.btnGreen.active,
.actionsButton > .buttonText.btnGreen.active {
  color: #fff;
  background: #009900;
}
.actionsButton > .buttonIcon.btnGreen.disabled:hover,
.actionsButton > .buttonText.btnGreen.disabled:hover {
  background: transparent;
}
.actionsButton > .buttonIcon.btnYellow,
.actionsButton > .buttonText.btnYellow {
  color: #999900;
  background: #ffffcc;
}
.actionsButton > .buttonIcon.btnYellow.active,
.actionsButton > .buttonText.btnYellow.active {
  color: #fff;
  background: #999900;
}
.actionsButton > .buttonIcon.btnYellow.disabled:hover,
.actionsButton > .buttonText.btnYellow.disabled:hover {
  background: transparent;
}
.actionsButton > .buttonIcon.btnRed,
.actionsButton > .buttonText.btnRed {
  color: #990000;
  background: #ffcccc;
}
.actionsButton > .buttonIcon.btnRed.active,
.actionsButton > .buttonText.btnRed.active {
  color: #fff;
  background: #990000;
}
.actionsButton > .buttonIcon.btnRed.disabled:hover,
.actionsButton > .buttonText.btnRed.disabled:hover {
  background: transparent;
}
.actionsButton > .buttonIcon.btnBlue,
.actionsButton > .buttonText.btnBlue {
  color: #000099;
  background: #ccccff;
}
.actionsButton > .buttonIcon.btnBlue.active,
.actionsButton > .buttonText.btnBlue.active {
  color: #fff;
  background: #000099;
}
.actionsButton > .buttonIcon.btnBlue.disabled:hover,
.actionsButton > .buttonText.btnBlue.disabled:hover {
  background: transparent;
}
.actionsButton .actionsMenu {
  display: none;
  position: absolute;
  top: 30px;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  z-index: 2;
  flex-direction: column;
  overflow: hidden;
}
.actionsButton .actionsMenu.up {
  position: absolute;
  top: unset;
  bottom: 30px;
  right: 0;
}
.actionsButton .actionsMenu.right {
  right: 0;
}
.actionsButton .actionsMenu .buttonIcon {
  display: inline-block;
  float: left;
}
.actionsButton .actionsMenu .buttonTitle {
  line-height: 30px;
  white-space: nowrap;
  padding: 0 10px;
}
.actionsButton .actionsMenu .buttonTitle:empty {
  padding: 0;
}
.actionsButton .actionsMenu .menuItem {
  width: auto;
  height: 30px;
  border-radius: 15px;
  display: inline-flex;
  cursor: pointer;
}
.actionsButton .actionsMenu .menuItem:hover {
  color: #666;
  background: #eee;
}
.actionsButton .actionsMenu .menuItem:hover .buttonIcon {
  color: #666;
  background: transparent;
}
.actionsButton .actionsMenu .menuItem:active,
.actionsButton .actionsMenu .menuItem:focus,
.actionsButton .actionsMenu .menuItem.active {
  color: #fff;
  background: #9b2621;
  outline: none;
}
.actionsButton .actionsMenu .menuItem:active .buttonIcon,
.actionsButton .actionsMenu .menuItem:focus .buttonIcon,
.actionsButton .actionsMenu .menuItem.active .buttonIcon {
  color: #fff !important;
  background: transparent;
}
.actionsButton.active {
  opacity: 1;
}
.actionsButton.active > .buttonIcon {
  color: #fff;
  background: #9b2621;
}
.actionsButton.active .actionsMenu {
  display: flex;
}
.actionsButton.collision .actionsMenu {
  flex-direction: column-reverse;
  top: unset;
  bottom: 30px;
}
.userSubSummary {
  display: inline-block;
  white-space: nowrap;
}
.userSubSummary .a {
  display: inline-block;
}
.userSubSummary .h {
  display: inline-block;
}
.userSubSummary .w {
  display: inline-block;
}
.userSubSummary .b {
  display: inline-block;
}
.messages {
  /*.usersTop, .searchUserTop {
        height: 60px;
        width: 100%;
        clear: both;
        border-bottom: 1px solid #f3f3f3;
        padding: 14px 4px;

        .form-control {
            font-size: 12px;
        }
    }*/
}
.messages .tab {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: 10px;
}
@media (max-width: 550px) {
  .messages .tab i.i {
    display: inline;
  }
}
.messages .tab i.i.mdi:before {
  font-size: 18px;
}
@media (max-width: 550px) {
  .messages .tab .nav-link > span {
    display: none;
  }
}
.messages .groupNotice {
  padding: 40px 0;
  text-align: center;
}
.messages .usersContainer .usersTop {
  height: 70px;
  width: 100%;
  padding: 2px;
  clear: both;
  border-bottom: 1px solid #f3f3f3;
}
.messages .usersContainer .usersTop .form-control {
  font-size: 12px;
}
.messages .usersContainer .usersTop .usersButtonClose {
  display: none;
  cursor: pointer;
}
.messages .usersContainer .usersTop .userFilter {
  margin-top: 2px;
}
.messages .usersContainer .usersTop .userFilter .btn-group {
  border: none;
}
.messages .usersContainer .usersTop .userFilter .btn-secondary.btn-check {
  background-color: #fff;
  border-color: #fff;
  color: #666;
}
.messages .usersContainer .usersTop .userFilter .btn-secondary.btn-check.active {
  background-color: #9b2621;
  border-color: #9b2621;
  color: #fff;
}
.messages .usersContainer .usersTop .userFilter label {
  border: 1px solid #ccc;
  text-align: center;
  cursor: pointer;
  margin-right: 0;
}
.messages .usersContainer .usersTop .userFilter label:focus {
  box-shadow: none;
}
.messages .usersContainer .usersTop .userFilter input[type=radio]:checked + label,
.messages .usersContainer .usersTop .userFilter input[type=checkbox]:checked + label {
  border: 1px solid #9b2621;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(155, 38, 33, 0.25);
}
.messages .usersContainer .usersTop .userFilter input[type=radio]:checked + label .genderIcon,
.messages .usersContainer .usersTop .userFilter input[type=checkbox]:checked + label .genderIcon {
  filter: contrast(0);
}
.messages .messagesContainer .conversationTop {
  height: 70px;
  width: 100%;
  clear: both;
  border-bottom: 1px solid #f3f3f3;
}
.messages .messagesContainer .conversationTop .messagesUserMenu {
  position: absolute;
  top: 20px;
  right: 10px;
}
.messages .messagesContainer .conversationTop .messagesUserMenu.sec {
  right: 40px;
}
.messages .messagesContainer .conversationTop .messagesUserMenu .actionsButton {
  top: 0;
}
.messages .messagesContainer .conversationTop .usersButtonOpen {
  display: none;
  cursor: pointer;
}
.messages .messagesContainer .sending {
  height: 22px;
  margin-top: -22px;
  line-height: 20px;
  text-align: center;
  color: #333;
  background: transparent;
  font-size: 12px;
  font-weight: 500;
  opacity: 0.7;
  transform-origin: bottom;
  transition: transform 0.2s;
  transform: scaleY(0);
}
.messages .messagesContainer .sending.active {
  transform: scaleY(1);
}
.messages .messagesContainer .typing {
  height: 34px;
  margin-top: -34px;
  line-height: 20px;
  text-align: center;
  color: #333;
  background: transparent;
  font-size: 12px;
  font-weight: 700;
  transform-origin: bottom;
  transition: transform 0.2s;
  transform: scaleY(0);
}
.messages .messagesContainer .typing.active {
  transform: scaleY(1);
}
.messages .messagesContainer .typing .typingIcon {
  display: inline-block;
  width: 56px;
  height: 28px;
  /* position: relative; */
  padding: 10px;
  /* margin-left: 5px; */
  background: #e6e6e6;
  border-radius: 20px;
}
.messages .messagesContainer .typing .typingDot {
  float: left;
  width: 8px;
  height: 8px;
  margin: 0 2px;
  background: #8d8c91;
  border-radius: 50%;
  opacity: 0;
  -webkit-animation: loadingFade 1s infinite;
          animation: loadingFade 1s infinite;
}
.messages .messagesContainer .typing .typingDot:nth-child(1) {
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
}
.messages .messagesContainer .typing .typingDot:nth-child(2) {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}
.messages .messagesContainer .typing .typingDot:nth-child(3) {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}
@-webkit-keyframes loadingFade {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0;
  }
}
@keyframes loadingFade {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0;
  }
}
.messages .usersContainer {
  width: 25%;
  transition: transform 0.2s;
  transform-origin: left;
}
.messages .messagesContainer {
  width: 75%;
  transition: transform 0.2s;
  transform-origin: right;
}
@media (max-width: 768px) {
  .messages .usersContainer {
    width: 33.3%;
  }
  .messages .messagesContainer {
    width: 66.6%;
  }
}
@media (max-width: 550px) {
  .messages .usersContainer {
    width: 100%;
    margin-right: -100%;
    position: relative;
    z-index: 2;
    background: #fff;
    transform: scaleX(0);
  }
  .messages .usersContainer .usersTop .usersButtonClose {
    display: block;
    height: 70px;
    width: 40px;
    text-align: center;
    float: right;
    line-height: 70px;
  }
  .messages .usersContainer .usersTop .userFilter {
    width: calc( 100% - 40px );
  }
  .messages .messagesContainer {
    width: 100%;
    position: relative;
    z-index: 1;
    background: #fff;
  }
  .messages .messagesContainer .conversationTop .usersButtonOpen {
    display: block;
    height: 70px;
    width: 40px;
    text-align: center;
    float: left;
    line-height: 70px;
  }
  .messages .messagesContainer .conversationTop .userInfo {
    width: calc( 100% - 40px );
  }
  .messages.usersactive .usersContainer {
    transform: scaleX(1);
  }
}
.messages .userInfo {
  padding: 10px 5px;
}
.messages .userInfo .profileAvatar {
  margin-right: 10px;
  margin-bottom: 5px;
}
.messages .userInfo .profileAvatar .profileImg > img {
  width: 30px;
  height: 30px;
}
.messages .userInfo .userUser {
  font-weight: bold;
  float: left;
  max-width: calc( 100% - 50px );
}
.messages .userInfo .userDescription {
  font-size: 11px;
  font-weight: 400;
  color: #666;
  max-height: 36px;
  max-width: 100%;
  background: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
  z-index: 1;
}
.messages .userInfo .userDescription:hover,
.messages .userInfo .userDescription:focus,
.messages .userInfo .userDescription:active {
  max-height: 300px;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
  border-radius: 2px;
}
.messages .userInfo .genderReq {
  display: inline-block;
  margin-left: 10px;
}
.messages .userInfo .genderReq .genderIcon {
  width: 16px;
  height: 16px;
}
.messages .userInfo .messagesUserMenu {
  position: relative;
  float: right;
}
.messages .empty {
  text-align: center;
  padding: 40px;
  font-size: 12px;
  color: #666;
}
.messages .userList {
  clear: both;
  max-height: 570px;
  /*min-height: 540px;*/
  overflow: hidden;
  z-index: 2;
  /* position: relative; */
  overflow: auto;
  font-size: 12px;
}
.messages .userList.nouser {
  max-height: 540px;
}
.messages .userList.nouser .empty {
  text-align: center;
  padding: 20px 0;
  color: #999;
}
.messages .userList .user,
.messages .userList .group {
  display: block;
  padding: 2px 10px;
  border-radius: 0.25rem;
  line-height: 26px;
  clear: both;
  position: relative;
}
.messages .userList .user .avatar,
.messages .userList .group .avatar {
  margin-right: 5px;
  margin-bottom: 0;
  float: left;
}
.messages .userList .user a,
.messages .userList .group a,
.messages .userList .user span.a,
.messages .userList .group span.a {
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  position: relative;
}
.messages .userList .user a:hover,
.messages .userList .group a:hover,
.messages .userList .user span.a:hover,
.messages .userList .group span.a:hover {
  text-decoration: none;
}
.messages .userList .user a span.admin,
.messages .userList .group a span.admin,
.messages .userList .user span.a span.admin,
.messages .userList .group span.a span.admin {
  color: #999;
}
.messages .userList .user a span.admin .mdi:before,
.messages .userList .group a span.admin .mdi:before,
.messages .userList .user span.a span.admin .mdi:before,
.messages .userList .group span.a span.admin .mdi:before {
  font-size: 18px;
  line-height: 18px;
}
.messages .userList .user .actionsButton,
.messages .userList .group .actionsButton {
  top: 0;
  right: 0;
}
.messages .userList .user .actionsButton .buttonIcon.small i.i::before,
.messages .userList .group .actionsButton .buttonIcon.small i.i::before {
  line-height: 29px;
}
.messages .userList .user:hover .actionsButton .buttonIcon.small,
.messages .userList .group:hover .actionsButton .buttonIcon.small {
  color: #000;
}
.messages .userList .user .counts,
.messages .userList .group .counts {
  display: block;
  font-size: 10px;
  color: #fff;
  background: #9b2621;
  width: 16px;
  height: 16px;
  text-align: center;
  white-space: nowrap;
  line-height: 16px;
  border-radius: 50%;
  padding: 0px 3px;
  position: absolute;
  top: 4px;
  right: 0;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
}
.messages .userList .user:hover,
.messages .userList .group:hover {
  text-decoration: none;
  background: #ccc;
}
.messages .userList .user.active,
.messages .userList .group.active {
  color: #fff;
  background: #9b2621;
}
.messages .userList .user.active a,
.messages .userList .group.active a {
  color: #fff;
}
.messages .userList .user.active a:hover,
.messages .userList .group.active a:hover {
  text-decoration: none;
}
.messages .userList .user.active .counts,
.messages .userList .group.active .counts {
  background: #fff;
  color: #000;
}
.messages .users,
.messages .groups {
  /*min-height: 540px;*/
  overflow: hidden;
  z-index: 2;
  /* position: relative; */
}
.messages .conversation {
  position: relative;
  min-height: 510px;
  border-left: 1px solid #eee;
}
.messages .conversation .messList {
  position: absolute;
  bottom: 0;
  width: 100%;
  display: flex;
  flex-direction: column-reverse;
  clear: both;
  max-height: 508px;
  overflow: auto;
}
.messages .conversation .messList .profileAvatar {
  margin-right: 10px;
  margin-bottom: 0;
  float: left;
}
.messages .conversation .messList .profileAvatar .profileImg {
  float: left;
  text-align: left;
  border-radius: 50%;
  overflow: hidden;
}
.messages .conversation .messList .profileAvatar .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 24px;
  height: 24px;
}
.messages .conversation .messList .mess {
  clear: both;
  font-size: 11px;
  padding: 10px;
  position: relative;
}
.messages .conversation .messList .mess .messReply {
  display: inline-block;
  line-height: 16px;
  cursor: pointer;
  font-size: 11px;
  font-weight: 600;
  margin: 2px 10px;
  color: #999;
}
.messages .conversation .messList .mess .messDate {
  color: #999;
  font-size: 10px;
  /* display: none; */
  position: relative;
  padding: 2px 6px;
  background: #fff;
  /* border-radius: 8px; */
  /* border: 1px solid #999; */
  /* margin-top: -16px; */
  /* margin-bottom: -40px; */
  margin-left: 34px;
  /* margin-right: -200px; */
  float: left;
  clear: both;
  /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); */
}
.messages .conversation .messList .mess .messActions {
  position: absolute;
  top: 10px;
  right: 10px;
  opacity: 0;
}
@media (max-width: 768px) {
  .messages .conversation .messList .mess .messActions {
    opacity: 1;
  }
}
.messages .conversation .messList .mess .messActions .buttonIcon {
  color: #ccc;
}
.messages .conversation .messList .mess .messActions .buttonIcon:hover {
  color: #666;
  background: #eee;
}
.messages .conversation .messList .mess .messActions .buttonIcon:focus {
  color: #fff;
  background: #9b2621;
}
.messages .conversation .messList .mess .messActions .actionsMenu {
  display: none;
  position: absolute;
  top: 30px;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  z-index: 2;
  flex-direction: column;
}
.messages .conversation .messList .mess .messActions .actionsMenu .buttonIcon {
  display: inline-block;
  float: left;
}
.messages .conversation .messList .mess .messActions.active {
  opacity: 1;
}
.messages .conversation .messList .mess .messActions.active > .buttonIcon {
  color: #fff;
  background: #9b2621;
}
.messages .conversation .messList .mess .messActions.active .actionsMenu {
  display: flex;
}
.messages .conversation .messList .mess .messActions.collision .actionsMenu {
  flex-direction: column-reverse;
  top: unset;
  bottom: 30px;
}
.messages .conversation .messList .mess .messText {
  border-radius: 10px;
  padding: 5px 10px;
  min-height: 30px;
  min-width: 30px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  -webkit-user-select: text;
     -moz-user-select: text;
      -ms-user-select: text;
          user-select: text;
  -webkit-user-select: contain;
     -moz-user-select: contain;
      -ms-user-select: element;
          user-select: contain;
}
.messages .conversation .messList .mess .messText .messPhoto {
  margin: 10px 5px;
}
.messages .conversation .messList .mess .messText .messPhoto img {
  max-width: 100%;
}
.messages .conversation .messList .mess .messText .messVideo {
  margin: 10px 5px;
}
.messages .conversation .messList .mess .messText .messVideo video {
  max-width: 100%;
}
.messages .conversation .messList .mess .messText .messPhotoMulti {
  display: flex;
  place-items: center;
  flex-flow: wrap;
}
.messages .conversation .messList .mess .messText .messPhotoMulti .messPhoto {
  float: left;
  width: calc( 33.3% - 10px );
  margin: 10px 5px;
  border-radius: 0.25rem;
  overflow: hidden;
}
.messages .conversation .messList .mess .messText .messPhotoMulti .messPhoto img {
  max-width: 100%;
}
.messages .conversation .messList .mess.from {
  float: left;
}
.messages .conversation .messList .mess.from .messText {
  background: #ccc;
  border: 1px solid #aaa;
  margin-right: 40px;
  margin-left: 34px;
}
.messages .conversation .messList .mess.from .messText a {
  color: #ff0c45;
}
.messages .conversation .messList .mess.from .messText .gmessUser a {
  margin-left: 0;
  font-size: 11px;
  font-weight: 600;
  color: #6d0015;
  text-decoration: none;
  cursor: pointer;
}
.messages .conversation .messList .mess.from .messText.reply {
  background: #ddd;
  border: 1px solid #bbb;
  margin: 5px -5px 5px -5px;
}
.messages .conversation .messList .mess.to {
  float: right;
}
.messages .conversation .messList .mess.to .messReply {
  display: none;
}
.messages .conversation .messList .mess.to .messDate {
  float: right;
  margin-left: -200px;
  margin-right: 10px;
}
.messages .conversation .messList .mess.to .messActions {
  position: absolute;
  top: 10px;
  right: unset;
  left: 10px;
}
.messages .conversation .messList .mess.to .messText {
  color: #fff;
  background: #C37171;
  border: 1px solid #ab5a5a;
  margin-left: 40px;
  margin-right: 10px;
  float: right;
}
.messages .conversation .messList .mess.to .messText a {
  color: #ffdbe3;
  text-decoration: underline;
}
.messages .conversation .messList .mess.to .messText.reply {
  color: #fff;
  background: #d09090;
  border: 1px solid #ab5a5a;
  margin: 5px -5px 5px -5px;
  float: none;
}
.messages .conversation .messList .mess.to .messText.reply .gmessUser a {
  margin-left: 0;
  font-size: 11px;
  font-weight: 600;
  color: #6d0015;
  text-decoration: none;
  cursor: pointer;
}
.messages .conversation .messList .mess.to .messStatus {
  position: absolute;
  top: 10px;
  right: 0;
  color: #ccc;
}
.messages .conversation .messList .mess.to .messStatus i.i {
  font-size: 16px;
}
.messages .conversation .messList .mess.to .messStatus i.i::before {
  font-size: 16px;
}
.messages .conversation .messList .mess.to .messStatus.readed {
  color: #999;
}
.messages .conversation .messList .mess.replying {
  background: #fcfcfc;
}
.messages .conversation .messList .mess.replying .messText {
  background: #89cc99;
  border: 1px solid #6ea47b;
  margin-right: 40px;
  margin-left: 34px;
}
.messages .conversation .messList .mess.replying .messReply {
  color: #006d02;
}
.messages .conversation .messList .mess:hover .messDate {
  display: block;
}
.messages .conversation .messList .mess:hover .messActions {
  opacity: 1;
}
.messages .conversation .messList .mess.messType .messTypeIcon {
  display: inline-block;
  margin: 2px 5px -4px 5px;
}
.messages .conversation .messList .mess.messType.from .messText {
  color: #999;
  background: #eee;
  border: 1px solid #eee;
}
.messages .conversation .messList .mess.messType.from .messText .messTypeIcon {
  float: right;
}
.messages .conversation .messList .mess.messType.to .messText {
  color: #999;
  background: #ecd7d7;
  border: 1px solid #ecd7d7;
}
.messages .conversation .messList .mess.messType.to .messText .messTypeIcon {
  float: left;
}
.messages .messagesControl {
  width: 100%;
  clear: both;
}
.messages .messageForm {
  background-color: #eee;
  padding: 10px;
  margin: 0;
}
.messages .messageForm:empty {
  padding: 0;
}
.messages .messageForm .messagesDisabled {
  color: #666;
  line-height: 40px;
  font-size: 12px;
  text-align: center;
}
.messages .messageForm .commentProfile {
  width: 50px;
  height: 40px;
  float: left;
}
.messages .messageForm .commentProfile .profileImg {
  float: left;
  text-align: left;
  margin-right: 10px;
  border-radius: 50%;
  overflow: hidden;
}
.messages .messageForm .commentProfile .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 40px;
  height: 40px;
}
.messages .messageForm .preview {
  padding: 10px;
  height: 110px;
}
.messages .messageForm .preview img,
.messages .messageForm .preview video {
  max-height: 100px;
  float: left;
}
.messages .messageForm .preview:empty {
  padding: 0;
  height: 0;
}
.messages .messageForm .preview .remove {
  float: left;
  margin-left: 10px;
  text-align: center;
  width: 24px;
  height: 24px;
  cursor: pointer;
  border: 1px solid #6d0015;
  border-radius: 50%;
  background: #9b2621;
  color: #fff;
}
.messages .messageForm .commentInput {
  width: auto;
  float: none;
  display: flex;
  /*div.button {
                display: inline-block;
                right: 0;
                position: absolute;
                border: none;
                cursor: pointer;
                background-color: transparent;
                width: 40px;
                height: 40px;
                background-size: 50%;
                background-repeat: no-repeat;
                background-position: center center;

                input[type=file] {
                    width: 40px;
                    height: 40px;
                    cursor: pointer;
                    position: absolute;
                    top: 0;
                    left: 0;
                    z-index: 2;
                    font-size: 0;
                    opacity: 0;
                }

                &.attVideo {
                    right: 10px;
                    background-image: url("../img/video.svg");
                }

                &.attPhoto {
                    right: 50px;
                    background-image: url("../img/camera.svg");
                }

                &.attEmoji {
                    right: 90px;
                    background-image: url("../img/sticker.svg");
                }
            }*/
}
.messages .messageForm .commentInput .commentField {
  position: relative;
  width: calc( 100% - 120px );
  transition: 0.1s all;
}
.messages .messageForm .commentInput .commentField .comment {
  text-align: left;
  border-radius: 20px;
  border: 1px solid #ccc;
  overflow: hidden;
  width: 100%;
  height: 40px;
  outline: 0;
  resize: none;
  padding: 8px 30px 8px 12px;
  margin-bottom: -8px;
}
.messages .messageForm .commentInput .commentField .comment:focus {
  border-color: #9b2621;
}
.messages .messageForm .commentInput .commentField .comment.blink {
  border-color: #9b2621;
  -webkit-animation: blink 0.4s;
          animation: blink 0.4s;
  -webkit-animation-iteration-count: 3;
          animation-iteration-count: 3;
}
@keyframes blink {
  100% {
    border-color: #fff;
  }
}
.messages .messageForm .commentInput .commentField .buttonEmoji {
  display: inline-block;
  position: absolute;
  border: none;
  cursor: pointer;
  top: 0;
  right: 0;
  border-radius: 50%;
  color: #666;
  background-color: transparent;
  width: 40px;
  height: 40px;
  transition: 0.1s all;
}
.messages .messageForm .commentInput .commentField .buttonEmoji:hover {
  background: #ccc;
}
.messages .messageForm .commentInput .commentField .buttonEmoji i.i {
  display: inline-block;
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
}
.messages .messageForm .commentInput .commentField .buttonEmoji i.i::before {
  height: 40px;
  width: 40px;
  line-height: 40px;
}
.messages .messageForm .commentInput .commentButtons {
  float: right;
  width: 120px;
  display: flex;
  transition: 0.1s all;
}
.messages .messageForm .commentInput .commentButtons div.button {
  display: inline-block;
  right: 0;
  position: relative;
  border: none;
  cursor: pointer;
  color: #666;
  background-color: transparent;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  transition: 0.1s all;
  /*&.buttonVideo {
                        right: 10px;
                        background-image: url("../img/video.svg");
                    }

                    &.buttonPhoto {
                        right: 50px;
                        background-image: url("../img/camera.svg");
                    }*/
}
.messages .messageForm .commentInput .commentButtons div.button:hover {
  background: #ccc;
}
.messages .messageForm .commentInput .commentButtons div.button i.i {
  display: inline-block;
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
}
.messages .messageForm .commentInput .commentButtons div.button i.i::before {
  height: 40px;
  width: 40px;
  line-height: 40px;
}
.messages .messageForm .commentInput .commentButtons div.button input[type=file] {
  width: 40px;
  height: 40px;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  font-size: 0;
  opacity: 0;
}
.messages .messageForm .commentInput .commentButtons div.button.buttonSubmit button {
  outline: 0;
  width: 40px;
  height: 40px;
  padding: 0;
  border: none;
  cursor: pointer;
  top: 0;
  right: 0;
  border-radius: 50%;
  color: #666;
  background: transparent;
  transition: 0.1s all;
}
.messages .messageForm .commentInput .commentButtons div.button.buttonSubmit button:hover {
  background: #ccc;
}
.messages .messageForm .commentInput .comment {
  text-align: left;
  border-radius: 20px;
  border: 1px solid #ccc;
  overflow: hidden;
  height: 40px;
  outline: 0;
  resize: none;
  padding: 8px 12px;
  margin-bottom: -8px;
}
.messages .messageForm .commentInput .comment:focus {
  border-color: #9b2621;
}
.messages .messageForm .commentInput.fullWidth {
  display: block;
  float: none;
  width: 100%;
}
.messages .messageForm .commentInput.fullWidth .commentField {
  position: relative;
  width: 100%;
}
.messages .messageForm .commentInput.fullWidth .commentButtons {
  margin-top: 2px;
}
.messages .messageForm .commentInput.fullWidth:after {
  content: "";
  clear: both;
  display: table;
}
.messages .messageForm .commentAtt {
  float: right;
  margin-top: -40px;
  position: relative;
}
.messages .messageForm .commentAtt div.button {
  display: inline-block;
  border: none;
  cursor: pointer;
  background-color: transparent;
  width: 40px;
  height: 40px;
  background-size: 50%;
  background-repeat: no-repeat;
  background-position: center center;
}
.messages .messageForm .commentAtt div.button input[type=file] {
  width: 40px;
  height: 40px;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  font-size: 0;
  opacity: 0;
}
.messages .messageForm .commentAtt div.button.attPhoto {
  background-image: url(/images/camera.svg?355544be76e60a465c481330e78e358c);
}
.messages .messageForm .commentAtt div.button.attVideo {
  background-image: url(/images/video.svg?af5b37b2126f5584b36b1c1c850cff05);
}
.messages .messageForm .commentAtt div.button.attEmoji {
  background-image: url(/images/sticker.svg?cca37795b0f11d7139d208e5574ac43c);
}
.messages .messageForm .replyInfo {
  display: none;
  padding: 0 10px;
  margin: -10px 0 0 0;
  font-size: 11px;
  color: #666;
}
.messages .messageForm .replyInfo.active {
  display: block;
}
.messages .messageForm .replyInfo .replyCancel {
  padding-left: 20px;
  font-weight: 700;
  cursor: pointer;
  display: inline-block;
  padding: 5px 0 5px 20px;
}
.messages.nouser .messageForm {
  padding: 0;
}
.messages.gmessages .userListTitle {
  display: block;
  height: 30px;
  color: #999;
  font-size: 12px;
  padding: 5px 0;
  font-weight: 600;
  text-align: center;
}
.messages.gmessages .userList {
  /*height: 270px;
            max-height: 270px;
            border-bottom: 1px solid #eee;
            &:last-child {
                border-bottom: none;
            }*/
}
.messages .groupList .user .counts {
  right: 20px;
}
.comment {
  clear: both;
  max-height: 540px;
  padding: 10px 0 0 0;
}
.comment .profileAvatar {
  margin-right: 10px;
  margin-bottom: 0;
  float: left;
}
.comment .profileAvatar .profileImg {
  float: left;
  text-align: left;
  border-radius: 50%;
  overflow: hidden;
}
.comment .profileAvatar .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 24px;
  height: 24px;
}
.comment .empty {
  text-align: center;
  padding: 40px;
  font-size: 12px;
  color: #666;
}
.comment .commentContent {
  width: auto;
  float: left;
  margin-right: 10px;
  margin-left: 10px;
  max-width: 85%;
}
.comment .commentContent .commentUser a {
  margin-left: 0;
  font-size: 11px;
  font-weight: 600;
  color: #6d0015;
}
.comment .commentContent a {
  color: #ff0c45;
}
.comment .commentContent .commentDateOld {
  font-size: 11px;
  display: none;
  position: relative;
  padding: 2px 6px;
  background: #fff;
  border-radius: 8px;
  border: 1px solid #999;
  margin-top: 0px;
  margin-bottom: -40px;
  margin-left: 0;
  margin-right: -200px;
  float: left;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}
.comment .commentContent .commentDate {
  display: block;
  color: #999;
  font-size: 10px;
  /* display: none; */
  position: relative;
  padding: 2px 6px;
  background: #fff;
  /* border-radius: 8px; */
  /* border: 1px solid #999; */
  /* margin-top: -16px; */
  /* margin-bottom: -40px; */
  margin-left: 6px;
  /* margin-right: -200px; */
  /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); */
}
.comment .commentContent:hover .commentDate {
  display: block;
}
.comment .commentContent .commentText {
  font-size: 12px;
  border-radius: 10px;
  padding: 2px 6px;
  background: #eee;
  border: 1px solid #ccc;
}
.comment .commentContent .commentText .commentPhoto {
  margin: 20px;
}
.comment .commentContent .commentText .commentPhoto img {
  max-height: 250px;
  max-width: 350px;
}
.comment .commentLikeComment {
  clear: both;
  margin-left: 40px;
}
.comment .commentLikeComment span.action {
  cursor: pointer;
  font-size: 12px;
  font-weight: 500;
  margin: 2px 10px;
}
.comment .commentLikeComment span.action:hover {
  text-decoration: underline;
}
.reply {
  clear: both;
  padding: 4px 0;
  position: relative;
}
.reply .profileAvatar {
  margin-right: 10px;
  margin-bottom: 0;
  float: left;
}
.reply .profileAvatar .profileImg {
  float: left;
  text-align: left;
  border-radius: 50%;
  overflow: hidden;
}
.reply .profileAvatar .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 24px;
  height: 24px;
}
.reply .empty {
  text-align: center;
  padding: 40px;
  font-size: 12px;
  color: #666;
}
.reply .replyContent {
  width: auto;
  float: left;
  font-size: 14px;
  border-radius: 10px;
  padding: 2px 6px;
  background: #eee;
  border: 1px solid #ccc;
  margin-right: 10px;
  margin-left: 10px;
  max-width: calc(100% - 90px);
}
.reply .replyContent.hilite {
  border: 1px solid #9b2621;
}
.reply .replyContent.editing {
  width: 100%;
  background: #fff;
  border: 1px solid #eee;
}
.reply .replyContent .replyUser a {
  margin-left: 0;
  font-size: 11px;
  font-weight: 600;
  color: #6d0015;
}
.reply .replyContent a {
  color: #ff0c45;
}
.reply .replyContent:hover .replyDate {
  display: block;
}
.reply .replyContent .replyText .replyPhoto {
  margin: 20px;
}
.reply .replyContent .replyText .replyPhoto img {
  max-height: 250px;
  max-width: 350px;
}
.reply .replyDate {
  display: inline-block;
  color: #999;
  font-size: 10px;
  /* display: none; */
  position: relative;
  padding: 2px 6px;
  background: #fff;
  /* border-radius: 8px; */
  /* border: 1px solid #999; */
  /* margin-top: -16px; */
  /* margin-bottom: -40px; */
  margin-left: 6px;
  /* margin-right: -200px; */
  /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); */
}
.reply .like-container {
  clear: both;
  margin-left: 40px;
  padding-top: 5px;
  color: #999;
  display: flex;
}
.reply .like-container:hover {
  color: #666;
}
.reply .like-container span.action {
  cursor: pointer;
  font-size: 12px;
  font-weight: 500;
  margin: 2px 6px;
}
.reply .like-container span.action:hover {
  text-decoration: underline;
}
.reply .like-container .reaction {
  display: inline-block;
  line-height: 17px;
  margin: 2px 6px;
  vertical-align: text-top;
  cursor: pointer;
}
.reply .like-container .reaction i.i:before {
  font-size: 14px;
}
.reply .like-container .reaction:hover {
  color: #333;
}
.reply .like-container .replies {
  display: inline-block;
  line-height: 16px;
  cursor: pointer;
  font-size: 11px;
  font-weight: 600;
  margin: 2px 10px;
}
.reply .like-container .replies:hover {
  text-decoration: underline;
  color: #333;
}
.reply .like-container .badge {
  position: relative;
  color: #333;
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  background: #fff;
  padding: 0;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  border-radius: 50%;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
  cursor: default;
  float: right;
  margin-top: -5px;
  transition: transform 0.5s;
  transform-origin: center;
}
.reply .like-container .badge:empty {
  display: inline-block;
  opacity: 0;
}
.reply .replyReplyContainer {
  display: none;
  margin: 0;
}
.reply .replyReplyContainer.active {
  display: block;
  margin: 10px 0 10px 0;
}
.reply .replyReplyContainer.active:focus {
  margin: 0;
  padding: 10px;
  position: fixed;
  bottom: 0;
  z-index: 1000;
  width: 100%;
  background: #fff;
  left: 0;
}
.postRepliesLoadMore .action {
  display: block;
  text-align: center;
  line-height: 26px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
}
.postRepliesLoadMore .action:hover {
  background: #f3f3f3;
}
.uploading {
  height: 34px;
  line-height: 34px;
  text-align: center;
  color: #333;
  background: transparent;
  font-size: 12px;
  font-weight: 700;
}
.emoji {
  color: transparent;
  display: inline-block;
  font-size: 18px;
  font-style: normal;
  height: 25px;
  width: 25px;
}
.emoji::-moz-selection {
  background-color: highlight;
  color: transparent;
}
.emoji::selection {
  background-color: highlight;
  color: transparent;
}
.emoji-image {
  font-size: 14px;
  line-height: 28px;
}
.emoji-editor {
  -moz-appearance: textfield-multiline;
  -webkit-appearance: textarea;
  border: 1px solid #ccc;
  border-radius: 3px;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  box-sizing: border-box;
  cursor: text;
  font: medium -moz-fixed;
  font: -webkit-small-control;
  -webkit-font-smoothing: antialiased;
  height: 100px;
  overflow: auto;
  padding: 5px;
  resize: both;
  width: 100%;
}
.emoji-picker {
  background-color: #fff;
  border: 1px solid #ccc;
  position: absolute;
  width: 210px;
  z-index: 2000;
}
.emoji-picker .tab-content > .tab-pane {
  display: grid;
}
.emoji-picker .nav {
  flex-wrap: unset;
}
.emoji-picker a {
  cursor: pointer;
  display: inline-block;
  font-size: 20px;
  padding: 3px;
}
.emoji-picker a:hover {
  text-decoration: none;
}
.emoji-selector {
  border-bottom: 1px solid #ccc;
  display: flex;
}
.emoji-selector li {
  margin: 5px;
}
.emoji-group {
  display: grid;
  grid-template-columns: repeat(6, 16.66667%);
  height: 200px;
  overflow-y: scroll;
  padding: 3px;
}
[data-picker-type="unicode"] {
  font-family: "Noto Color Emoji", "Apple Color Emoji", "Segoe UI Emoji", Times, Symbola, Aegyptus, Code2000, Code2001, Code2002, Musica, serif, LastResort;
}
.reaction-container {
  max-width: 100%;
  padding: 0;
  position: relative;
}
.reaction-btn {
  font-weight: bold;
  color: #7f7f7f;
  position: relative;
  cursor: pointer;
  padding: 20px 20px 0 0;
}
.reaction-btn:hover {
  text-decoration: underline;
}
.like-btn-default {
  background-repeat: no-repeat;
  background-size: auto;
}
.reaction-btn-emo {
  display: inline-block;
  margin: 0 6px -3px 0;
  width: 16px;
  height: 16px;
}
.remojies-box {
  height: 64px;
  width: 354px;
  padding: 10px;
  position: absolute;
  top: -43px;
  left: -14px;
  background: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  border-radius: 44px 44px;
  display: none;
}
.remoji {
  list-style-type: none;
  cursor: pointer;
  display: inline-block;
  width: 48px;
  height: 48px;
  position: absolute;
  top: 8px;
  opacity: 0;
  transform: scale(1, 1);
  transition: opacity 0.5s ease-in-out 1s, transform 0.07s ease-in-out 0s, top 0.07s ease-in-out 0s;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}
.reaction-btn:hover .remojies-box {
  display: block;
}
.remo-like {
  left: 10px;
  background-image: url(/images/reactions_like.png?c667549a4c9a753921770c4b6ccc036f);
}
.remo-love {
  left: 68px;
  background-image: url(/images/reactions_love.png?d3e8698e25a2a0ddb862480130810c3c);
}
.remo-haha {
  left: 126px;
  background-image: url(/images/reactions_haha.png?26f66a392b639468df40b867da74bf2d);
}
.remo-wow {
  left: 184px;
  background-image: url(/images/reactions_wow.png?0d2478d73b949c67d7e4adb498170781);
}
.remo-sad {
  left: 242px;
  background-image: url(/images/reactions_sad.png?4ae2ad57c752f71dc7089c4d4dde63f2);
}
.remo-angry {
  left: 300px;
  background-image: url(/images/reactions_angry.png?8e346dec3a1a82109f4ae3ce33fa9400);
}
.reaction-btn:hover .remoji {
  opacity: 1;
  -webkit-animation-name: reaction_delay;
          animation-name: reaction_delay;
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s;
}
@-webkit-keyframes reaction_delay {
  0% {
    width: 48px;
    height: 48px;
    top: 60px;
  }
  48% {
    width: 56px;
    height: 56px;
    top: 5px;
  }
  100% {
    width: 48px;
    height: 48px;
    top: 8px;
  }
}
@keyframes reaction_delay {
  0% {
    width: 48px;
    height: 48px;
    top: 60px;
  }
  48% {
    width: 56px;
    height: 56px;
    top: 5px;
  }
  100% {
    width: 48px;
    height: 48px;
    top: 8px;
  }
}
.reaction-btn:hover .remo-like {
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
}
.reaction-btn:hover .remo-love {
  -webkit-animation-delay: 0.05s;
          animation-delay: 0.05s;
}
.reaction-btn:hover .remo-haha {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s;
}
.reaction-btn:hover .remo-wow {
  -webkit-animation-delay: 0.15s;
          animation-delay: 0.15s;
}
.reaction-btn:hover .remo-sad {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}
.reaction-btn:hover .remo-angry {
  -webkit-animation-delay: 0.25s;
          animation-delay: 0.25s;
}
.remoji:hover {
  transform: scale(1.3, 1.3);
  top: 2px;
}
.remoji::before {
  display: inline-block;
  color: #ffffff;
  text-align: center;
  line-height: 17px;
  font-size: 0.7em;
  width: 80%;
  height: 17px;
  margin-left: 10%;
  background-color: rgba(0, 0, 0, 0.6);
  border-radius: 20px;
  position: absolute;
  top: -25px;
  opacity: 0;
  transition: opacity 0.2s ease-in-out 0s;
}
.remoji:hover::before {
  opacity: 1;
}
.remo-like::before {
  content: 'Like';
}
.remo-love::before {
  content: 'Love';
}
.remo-haha::before {
  content: 'Haha';
}
.remo-wow::before {
  content: 'Wow';
}
.remo-sad::before {
  content: 'Sad';
}
.remo-angry::before {
  content: 'Angry';
}
.like-stat {
  margin-top: 10px;
}
.like-btn-like {
  background-image: url(/images/reaction-small.png?1d4775d9bdaa80bd0c5363dae2f7c230);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: -17px -151px;
}
.like-btn-love {
  background-image: url(/images/reaction-small.png?1d4775d9bdaa80bd0c5363dae2f7c230);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: 0 -168px;
}
.like-btn-haha {
  background-image: url(/images/reaction-small.png?1d4775d9bdaa80bd0c5363dae2f7c230);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: 0 -151px;
}
.like-btn-wow {
  background-image: url(/images/reaction-small.png?1d4775d9bdaa80bd0c5363dae2f7c230);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: -17px -185px;
}
.like-btn-sad {
  background-image: url(/images/reaction-small.png?1d4775d9bdaa80bd0c5363dae2f7c230);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: -17px -168px;
}
.like-btn-angry {
  background-image: url(/images/reaction-small.png?1d4775d9bdaa80bd0c5363dae2f7c230);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: -17px -117px;
}
.reaction-btn-text-like {
  color: #5890ff;
}
.reaction-btn-text-wow,
.reaction-btn-text-haha,
.reaction-btn-text-sad {
  color: #f0ba15;
}
.reaction-btn-text-love {
  color: #f25268;
}
.reaction-btn-text-angry {
  color: #f7714b;
}
.like-emo > span {
  display: inline-block;
  margin: 0 -3px -3px 0px;
  width: 16px;
  height: 16px;
  border: 1px solid #EEE;
  border-radius: 50%;
}
.like-details {
  margin-left: 10px;
  color: #9197a3;
  font-size: 12px;
}
.video {
  --plyr-color-main: #9b2621;
}
.video video {
  width: 100%;
}
@-webkit-keyframes bounceIn {
  0%,
  20%,
  40%,
  60%,
  80%,
  100% {
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 1;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  20% {
    transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
    transform: scale3d(0.9, 0.9, 0.9);
  }
  60% {
    opacity: 1;
    transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
    transform: scale3d(0.97, 0.97, 0.97);
  }
  100% {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
}
@keyframes bounceIn {
  0%,
  20%,
  40%,
  60%,
  80%,
  100% {
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 1;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  20% {
    transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
    transform: scale3d(0.9, 0.9, 0.9);
  }
  60% {
    opacity: 1;
    transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
    transform: scale3d(0.97, 0.97, 0.97);
  }
  100% {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
}
.tt-dataset {
  background: #fff;
  border: 1px solid #ccc;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
.tt-dataset.tt-dataset-user .tt-suggestion {
  padding: 2px 6px;
}
#notifSound {
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  font-size: 0;
  opacity: 0;
}
.jodit-popup {
  z-index: 1100;
}
.cardHeaderButtons {
  float: right;
}
.cardHeaderButtons .button {
  margin: -10px 0;
  display: inline-block;
  padding: 5px;
  color: #000;
  border: 1px solid #ccc;
  background: #eee;
  border-radius: 0.25rem;
  transition: all 0.2s;
}
.cardHeaderButtons .button:hover {
  text-decoration: none;
  border: 1px solid #999;
  background: #ccc;
}
.cardHeaderButtons .button:last-child {
  margin: -10px -5px -10px 0;
}
.cardHeaderButtons .button.active {
  background: #ccc;
  border: 1px solid #999;
}
#notifSound,
#videoCallSound,
#videoDialSound {
  display: none;
}
.videoCall {
  /*.modal-dialog {
        width: 100%;
        max-width: none;
        height: 100%;
        margin: 0;
    }

    .modal-content {
        height: 100%;
        border: 0;
        border-radius: 0;
    }

    .modal-body {
        overflow-y: auto;
    }*/
}
.videoCall .videos {
  position: relative;
  text-align: center;
}
.videoCall .remoteVideo {
  width: 100%;
  display: none;
}
.videoCall .localVideo {
  width: 100%;
  border: 2px solid #fff;
}
.videoCall .remotePlaceholder {
  display: none;
  height: 200px;
  background: #fff;
  color: #ccc;
}
.videoCall .remotePlaceholder i.i {
  font-size: 60px;
  line-height: 200px;
  vertical-align: bottom;
}
.videoCall .remotePlaceholder i.i.mdi::before {
  font-size: 60px;
}
.videoCall .localPlaceholder {
  display: none;
  height: 50px;
  background: #fff;
  color: #ccc;
}
.videoCall .localPlaceholder i.i {
  font-size: 40px;
  line-height: 50px;
  vertical-align: bottom;
}
.videoCall .localPlaceholder i.i.mdi::before {
  font-size: 40px;
}
.videoCall .mutedPlaceholder {
  display: none;
  width: 50px;
  height: 50px;
  color: #ccc;
}
.videoCall .mutedPlaceholder i.i {
  font-size: 40px;
  line-height: 50px;
  vertical-align: bottom;
}
.videoCall .mutedPlaceholder i.i.mdi::before {
  font-size: 40px;
}
.videoCall.activeCall .remoteVideo {
  display: block;
}
.videoCall.activeCall .localVideo {
  width: 100px;
  position: absolute;
  right: 0;
  bottom: 0;
}
.videoCall.activeCall.noRemote .remoteVideo {
  display: none;
}
.videoCall.activeCall.noRemote .remotePlaceholder {
  display: block;
}
.videoCall.activeCall.noLocal .localVideo {
  display: none;
}
.videoCall.activeCall.noLocal .localPlaceholder {
  display: block;
  width: 100px;
  position: absolute;
  right: 0;
  bottom: 0;
}
.videoCall.activeCall.noMic .mutedPlaceholder {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
}
.videoCall .remoteProfile {
  padding: 10px;
}
.videoCall .remoteProfile:empty {
  padding: 0;
}
.videoCall .videoCallProfile {
  margin-bottom: 10px;
  text-align: center;
}
.videoCall .videoCallProfile > a {
  display: inline-block;
}
.videoCall .videoCallProfile .profileImg {
  float: left;
  text-align: left;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 10px;
  width: 50px;
}
.videoCall .videoCallProfile .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 50px;
  height: 50px;
}
.videoCall .videoCallProfile .profileName {
  font-size: 16px;
  font-weight: 700;
  text-align: left;
  float: left;
  margin-top: 5px;
  color: #9b2621;
}
.videoCall .modal-title .videoCallProfile {
  margin-bottom: 0;
}
.videoCall .modal-title .videoCallProfile .profileImg {
  float: left;
  text-align: left;
  border-radius: 50%;
  overflow: hidden;
  margin: 0 10px 0 0;
  width: 30px;
}
.videoCall .modal-title .videoCallProfile .profileImg > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 30px;
  height: 30px;
}
.videoCall .modal-title .videoCallProfile .profileName {
  font-size: 16px;
  font-weight: 700;
  text-align: left;
  float: left;
  margin-top: 5px;
  color: #9b2621;
}
/* Extra small devices (less than 768px) */
@media (max-width: 767px) {
  .modal-fullscreen-xs-down {
    padding: 0 !important;
  }
  .modal-fullscreen-xs-down .modal-dialog {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
  }
  .modal-fullscreen-xs-down .modal-content {
    height: auto;
    min-height: 100%;
    border: 0 none;
    border-radius: 0;
    box-shadow: none;
  }
}
/* Small devices (less than 992px) */
@media (max-width: 991px) {
  .modal-fullscreen-sm-down {
    padding: 0 !important;
  }
  .modal-fullscreen-sm-down .modal-dialog {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
  }
  .modal-fullscreen-sm-down .modal-content {
    height: auto;
    min-height: 100%;
    border: 0 none;
    border-radius: 0;
    box-shadow: none;
  }
}
/* Medium devices (less than 1200px) */
@media (max-width: 1199px) {
  .modal-fullscreen-md-down {
    padding: 0 !important;
  }
  .modal-fullscreen-md-down .modal-dialog {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
  }
  .modal-fullscreen-md-down .modal-content {
    height: auto;
    min-height: 100%;
    border: 0 none;
    border-radius: 0;
    box-shadow: none;
  }
}
.carouselMulti {
  /*
        code by Iatek LLC 2018 - CC 2.0 License - Attribution required
        code customized by Azmind.com
    */
  /* MD */
  /* LG */
}
@media (min-width: 768px) and (max-width: 991px) {
  .carouselMulti {
    /* Show 4th slide on md if col-md-4*/
  }
  .carouselMulti .carousel-inner .active.col-md-4.carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: absolute;
    top: 0;
    right: -33.3333%;
    /*change this with javascript in the future*/
    z-index: -1;
    display: block;
    visibility: visible;
  }
}
@media (min-width: 576px) and (max-width: 768px) {
  .carouselMulti {
    /* Show 3rd slide on sm if col-sm-6*/
  }
  .carouselMulti .carousel-inner .active.col-sm-6.carousel-item + .carousel-item + .carousel-item {
    position: absolute;
    top: 0;
    right: -50%;
    /*change this with javascript in the future*/
    z-index: -1;
    display: block;
    visibility: visible;
  }
}
@media (min-width: 576px) {
  .carouselMulti {
    /* show 2 items */
    /* left or forward direction */
    /* farthest right hidden item must be also positioned for animations */
    /* right or prev direction */
  }
  .carouselMulti .carousel-item {
    margin-right: 0;
  }
  .carouselMulti .carousel-inner .active + .carousel-item {
    display: block;
  }
  .carouselMulti .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
  .carouselMulti .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item {
    transition: none;
  }
  .carouselMulti .carousel-inner .carousel-item-next {
    position: relative;
    transform: translate3d(0, 0, 0);
  }
  .carouselMulti .active.carousel-item-left + .carousel-item-next.carousel-item-left,
  .carouselMulti .carousel-item-next.carousel-item-left + .carousel-item,
  .carouselMulti .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }
  .carouselMulti .carousel-inner .carousel-item-prev.carousel-item-right {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    visibility: visible;
  }
  .carouselMulti .active.carousel-item-right + .carousel-item-prev.carousel-item-right,
  .carouselMulti .carousel-item-prev.carousel-item-right + .carousel-item,
  .carouselMulti .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(100%, 0, 0);
    display: block;
    visibility: visible;
  }
}
@media (min-width: 768px) {
  .carouselMulti {
    /* show 3rd of 3 item slide */
    /* left or forward direction */
    /* right or prev direction */
  }
  .carouselMulti .carousel-inner .active + .carousel-item + .carousel-item {
    display: block;
  }
  .carouselMulti .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item {
    transition: none;
  }
  .carouselMulti .carousel-inner .carousel-item-next {
    position: relative;
    transform: translate3d(0, 0, 0);
  }
  .carouselMulti .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }
  .carouselMulti .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(100%, 0, 0);
    display: block;
    visibility: visible;
  }
}
@media (min-width: 991px) {
  .carouselMulti {
    /* show 4th item */
    /* Show 5th slide on lg if col-lg-3 */
    /* left or forward direction */
    /* right or prev direction //t - previous slide direction last item animation fix */
  }
  .carouselMulti .carousel-inner .active + .carousel-item + .carousel-item + .carousel-item {
    display: block;
  }
  .carouselMulti .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item + .carousel-item {
    transition: none;
  }
  .carouselMulti .carousel-inner .active.col-lg-3.carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: absolute;
    top: 0;
    right: -25%;
    /*change this with javascript in the future*/
    z-index: -1;
    display: block;
    visibility: visible;
  }
  .carouselMulti .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }
  .carouselMulti .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(100%, 0, 0);
    display: block;
    visibility: visible;
  }
}
.eventsCarousel .carousel-control-prev,
.eventsCarousel .carousel-control-next {
  width: 6%;
  opacity: 1;
}
.eventsCarousel .carousel-control-prev .carousel-control-prev-icon,
.eventsCarousel .carousel-control-next .carousel-control-prev-icon,
.eventsCarousel .carousel-control-prev .carousel-control-next-icon,
.eventsCarousel .carousel-control-next .carousel-control-next-icon {
  background: none;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  opacity: 0.5;
  width: 40px;
  height: 40px;
  transition: all 0.2s;
}
.eventsCarousel .carousel-control-prev .carousel-control-prev-icon i.i.mdi:before,
.eventsCarousel .carousel-control-next .carousel-control-prev-icon i.i.mdi:before,
.eventsCarousel .carousel-control-prev .carousel-control-next-icon i.i.mdi:before,
.eventsCarousel .carousel-control-next .carousel-control-next-icon i.i.mdi:before {
  font-size: 40px;
}
.eventsCarousel .carousel-control-prev .carousel-control-prev-icon:hover,
.eventsCarousel .carousel-control-next .carousel-control-prev-icon:hover,
.eventsCarousel .carousel-control-prev .carousel-control-next-icon:hover,
.eventsCarousel .carousel-control-next .carousel-control-next-icon:hover {
  opacity: 1;
  text-shadow: 0 0 20px rgba(0, 0, 0, 0.9);
}
.eventsCarousel .welcomeEvent {
  background: #fff;
  border-radius: 0.25rem;
  overflow: hidden;
  height: calc( 100% - 5px );
  box-shadow: 0px 1px 3px -1px rgba(0, 0, 0, 0.2);
}
.eventsCarousel .welcomeEvent .eventImg > img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.eventsCarousel .welcomeEvent .eventInfo {
  padding: 10px;
}
.incompleteProfileInfo {
  padding: 20px 10px;
  background-color: #fcc;
  border: 1px solid #f66;
  border-radius: 0.25rem;
  font-weight: 600;
  box-shadow: 0 1px 10px -1px rgba(0, 0, 0, 0.5);
}
.incompleteProfileItems {
  margin-top: 10px;
  padding: 0;
  background-color: #fcc;
  border: 1px solid #f66;
  border-radius: 0.25rem;
  box-shadow: 0 1px 10px -1px rgba(0, 0, 0, 0.25);
  overflow: hidden;
}
.incompleteProfileItems .incompleteProfileItemsHeader {
  padding: 10px 10px;
  background-color: #ddd;
  font-weight: 600;
}
.incompleteProfileItems .incompleteProfileSection {
  padding: 10px 10px;
  background-color: #eee;
  font-weight: 500;
}
.incompleteProfileItems .incompleteProfileSection:hover {
  background-color: #fff;
}
.membershipProfileInfo {
  margin-top: 10px;
  padding: 4px;
  background-color: #f3f3f3;
  border: 1px solid #eee;
  border-radius: 0.25rem;
  font-weight: 600;
  box-shadow: 0 1px 10px -1px rgba(0, 0, 0, 0.25);
}
.membershipProfileInfo .membershipInfoHow {
  padding: 10px 0;
}
.weather .wIcon {
  text-align: center;
  float: left;
}
.weather .wIcon > img {
  width: 64px;
  height: 64px;
}
.weather .wText {
  padding-top: 14px;
  line-height: 18px;
}
.weather .wText .wTemp {
  font-size: 20px;
  font-weight: 900;
  line-height: 20px;
  display: inline-block;
}
.weather .wText .wDesc {
  font-size: 12px;
  margin-left: 5px;
  line-height: 20px;
  display: inline-block;
  vertical-align: text-bottom;
}
.weather .wText .wCity {
  font-size: 12px;
}
.weather .wFore {
  margin-top: 10px;
}
.weather .wFore .wForeItem {
  position: relative;
  line-height: 20px;
  height: 24px;
  padding: 2px;
}
.weather .wFore .wForeItem .wDay {
  position: absolute;
  left: 3px;
  font-size: 10px;
  line-height: 20px;
}
.weather .wFore .wForeItem .wIcon {
  position: absolute;
  right: 70px;
  top: -2px;
}
.weather .wFore .wForeItem .wIcon > img {
  width: 24px;
  height: 24px;
}
.weather .wFore .wForeItem .wTempMax {
  position: absolute;
  right: 35px;
  font-size: 10px;
  font-weight: 900;
  line-height: 20px;
}
.weather .wFore .wForeItem .wTempMin {
  position: absolute;
  right: 3px;
  font-size: 10px;
  line-height: 20px;
}
.bigSuccess {
  text-align: center;
  color: #009900;
  font-size: 96px;
}
.bigSuccess i.i.mdi:before {
  font-size: 96px;
}
.bigFailure {
  text-align: center;
  color: #990000;
  font-size: 96px;
}
.bigFailure i.i.mdi:before {
  font-size: 96px;
}
.shareLocStatus i.i.mdi:before {
  font-size: 14px;
}
.calendar {
  display: flex;
  flex-flow: column;
}
.calendar .header .month-year {
  font-size: 20px;
  font-weight: bold;
  color: #636e73;
  padding: 0;
}
.calendar .days {
  display: flex;
  flex-flow: wrap;
}
.calendar .days .day_name {
  width: calc(100% / 7);
  border-right: 1px solid #2c7aca;
  padding: 0;
  text-transform: uppercase;
  font-size: 10px;
  color: #818589;
  color: #fff;
  background-color: #448cd6;
}
.calendar .days .day_name:nth-child(7) {
  border: none;
}
.calendar .days .day_num {
  display: flex;
  flex-flow: column;
  width: calc(100% / 7);
  border-right: 1px solid #e6e9ea;
  border-bottom: 1px solid #e6e9ea;
  font-weight: bold;
  color: #7c878d;
  cursor: pointer;
  min-height: 40px;
}
.calendar .days .day_num span {
  display: inline-flex;
  width: 30px;
  font-size: 10px;
}
.calendar .days .day_num .event {
  margin-top: 10px;
  font-weight: 500;
  font-size: 12px;
  padding: 3px 6px;
  border-radius: 4px;
  background-color: #f7c30d;
  color: #fff;
  word-wrap: break-word;
  display: block;
}
.calendar .days .day_num .event.green {
  background-color: #51ce57;
}
.calendar .days .day_num .event.blue {
  background-color: #518fce;
}
.calendar .days .day_num .event.red {
  background-color: #ce5151;
}
.calendar .days .day_num:nth-child(7n+1) {
  border-left: 1px solid #e6e9ea;
}
.calendar .days .day_num:hover {
  background-color: #fdfdfd;
}
.calendar .days .day_num.ignore {
  background-color: #fdfdfd;
  color: #ced2d4;
  cursor: inherit;
}
.calendar .days .day_num.selected {
  background-color: #f1f2f3;
  cursor: inherit;
}
.twitter-typeahead .autocompleteItem {
  cursor: default;
}
.twitter-typeahead .autocompleteItem > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 5px;
}
.multiselect-native-select .btn-group {
  max-width: 100%;
}
.multiselect-native-select .multiselect.dropdown-toggle {
  max-width: 100%;
  overflow: hidden;
  border: 1px solid #eee;
}
.multiselect-native-select .multiselect-selected-text {
  display: inline-block;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 95%;
  float: left;
}
.btn:focus,
.btn.focus {
  outline: 0;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}
.icoBdsm {
  display: inline-block;
  height: 16px;
  width: 16px;
  background-color: transparent;
  background-image: url(/images/bdsm.png?88cf536c5cadc107dfbe72d0c4b4736c);
  background-repeat: no-repeat;
  vertical-align: bottom;
  margin-right: 5px;
}
.callIcon i.i.mdi:before {
  line-height: 30px;
}
.callIcon.outgoing.answered {
  color: green;
}
.callIcon.outgoing.missed {
  color: #999;
}
.callIcon.outgoing.declined {
  color: #999;
}
.callIcon.outgoing.ringing {
  color: blue;
}
.callIcon.incoming.answered {
  color: green;
}
.callIcon.incoming.missed {
  color: red;
}
.callIcon.incoming.declined {
  color: #999;
}
.callIcon.incoming.ringing {
  color: blue;
}
.faq .fitem {
  background: #fff;
  border-radius: 1rem;
  overflow: hidden;
  padding: 0px;
  margin-bottom: 10px;
}
.faq .fitem .fquestion {
  padding: 10px;
  clear: both;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.faq .fitem .fquestion:after {
  content: "";
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
.faq .fitem .fquestion h3 {
  float: left;
  clear: none;
  padding: 0 40px 0 10px;
  margin: 0;
  font-size: 18px;
  font-weight: 500;
  line-height: 30px;
}
.faq .fitem .fquestion .expand {
  display: block;
  width: 32px;
  height: 32px;
  float: right;
  margin: 0 0 0 -40px;
  background: #9b2621;
  border-radius: 50%;
  line-height: 32px;
  text-align: center;
  color: #fff;
  transition: all 0.2s;
}
.faq .fitem .fanswer {
  padding: 0 20px;
  clear: both;
  overflow: hidden;
  height: 0;
  transform: scaleY(0);
  transform-origin: top;
  transition: all 0.2s;
}
.faq .fitem.expanded .expand {
  transform: rotate(90deg);
}
.faq .fitem.expanded .fanswer {
  padding: 0 20px;
  height: auto;
  transform: scaleY(1);
}
.card .faq .fitem {
  background: #fcfcfc;
  border-radius: 0.25rem;
}
.poll .pollTitle {
  font-weight: 700;
  font-size: 11px;
  padding: 0 5px;
}
.poll .pollDesc {
  font-weight: 300;
  font-size: 10px;
  padding: 0 5px;
}
.poll .pollStat {
  padding: 0 5px;
  height: 32px;
}
.poll .pollStat .pollVotes {
  float: right;
  font-size: 10px;
}
.poll .pollStat .pollJustVoted {
  font-size: 10px;
  color: #000;
  font-weight: 700;
}
.poll .pollStat .pollAlreadyVoted {
  font-size: 10px;
  color: #999;
}
.poll .pollItems .pollItem {
  cursor: default;
}
.poll .pollItems .pollItem .pollItemBar {
  height: 20px;
  width: 100%;
  position: relative;
  border: 1px solid #ccc;
  background: #fff;
  overflow: hidden;
  border-radius: 0.25rem;
}
.poll .pollItems .pollItem .pollItemBar .pollBarValue {
  height: 18px;
  background: #6d0015;
}
.poll .pollItems .pollItem .pollItemBar .pollBarText {
  position: absolute;
  top: 0;
  width: 100%;
  text-align: center;
  color: #bbb;
  height: 18px;
  line-height: 18px;
  font-size: 10px;
  font-weight: 700;
}
.poll .pollItems .pollItem .pollItemTitle {
  height: 18px;
  font-size: 10px;
  padding: 0 5px;
}
.poll .pollItems .pollItem.selected {
  cursor: default;
  background: #e9e9e9;
}
.poll .pollItems .pollItem.selected .pollItemBar {
  border-color: #ddd;
  background: #eee;
}
.poll .pollItems .pollItem.selected .pollItemBar .pollBarValue {
  background: #9b2621;
}
.poll .pollItems .pollItem.selected .pollItemBar .pollBarText {
  color: #ccc;
}
.poll.votable .pollItems .pollItem {
  cursor: pointer;
}
.poll.votable .pollItems .pollItem:hover {
  background: #e9e9e9;
}
.poll.votable .pollItems .pollItem:hover .pollItemBar {
  border-color: #ddd;
  background: #eee;
}
.poll.votable .pollItems .pollItem:hover .pollItemBar .pollBarValue {
  background: #9b2621;
}
.poll.votable .pollItems .pollItem:hover .pollItemBar .pollBarText {
  color: #ccc;
}
.poll.empty .pollTitle {
  color: #999;
  font-weight: 500;
  font-size: 11px;
  padding: 10px 5px;
  text-align: center;
}
.polls .poll .pollTitle {
  font-weight: 700;
  font-size: 14px;
  padding: 0 5px;
}
.polls .poll .pollDesc {
  font-weight: 300;
  font-size: 12px;
  padding: 0 5px 10px 5px;
}
.polls .poll .pollStat {
  padding: 0 5px;
}
.polls .poll .pollStat .pollVotes {
  float: right;
  font-size: 12px;
}
.polls .poll .pollStat .pollJustVoted {
  font-size: 12px;
  color: #000;
  font-weight: 700;
}
.polls .poll .pollStat .pollAlreadyVoted {
  font-size: 12px;
  color: #999;
}
.polls .poll .pollItems .pollItem {
  cursor: default;
}
.polls .poll .pollItems .pollItem .pollItemBar {
  height: 20px;
  width: 100%;
  position: relative;
  border: 1px solid #ccc;
  background: #fff;
  overflow: hidden;
  border-radius: 0.25rem;
}
.polls .poll .pollItems .pollItem .pollItemBar .pollBarValue {
  height: 18px;
  background: #6d0015;
}
.polls .poll .pollItems .pollItem .pollItemBar .pollBarText {
  position: absolute;
  top: 0;
  width: 100%;
  text-align: center;
  color: #bbb;
  height: 18px;
  line-height: 18px;
  font-size: 12px;
  font-weight: 700;
}
.polls .poll .pollItems .pollItem .pollItemTitle {
  height: 18px;
  font-size: 12px;
  padding: 0 5px;
}
.polls .poll .pollItems .pollItem.selected {
  cursor: default;
  background: transparent;
}
.polls .poll .pollItems .pollItem.selected .pollItemBar {
  border-color: #ddd;
  background: #eee;
}
.polls .poll .pollItems .pollItem.selected .pollItemBar .pollBarValue {
  background: #9b2621;
}
.polls .poll .pollItems .pollItem.selected .pollItemBar .pollBarText {
  color: #ccc;
}
.polls .poll.votable .pollItems .pollItem {
  cursor: pointer;
}
.polls .poll.votable .pollItems .pollItem:hover {
  background: #f9f9f9;
}
.polls .poll.votable .pollItems .pollItem:hover .pollItemBar {
  border-color: #ddd;
  background: #eee;
}
.polls .poll.votable .pollItems .pollItem:hover .pollItemBar .pollBarValue {
  background: #9b2621;
}
.polls .poll.votable .pollItems .pollItem:hover .pollItemBar .pollBarText {
  color: #ccc;
}
.tooltipster-sidetip.tooltipster-shadow.tooltipster-top .tooltipster-box {
  overflow: hidden;
}
.tooltipster-sidetip.tooltipster-shadow .tooltipster-content {
  max-height: 400px;
  overflow: auto;
}
.loader {
  display: block;
  position: relative;
  width: 50px;
  height: 50px;
  margin: 0 auto;
  border-radius: 50%;
  border: 2px solid transparent;
  border-top-color: #9370DB;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}
.loader:before {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  right: 2px;
  bottom: 2px;
  border-radius: 50%;
  border: 2px solid transparent;
  border-top-color: #BA55D3;
  -webkit-animation: spin 3s linear infinite;
  animation: spin 3s linear infinite;
}
.loader:after {
  content: "";
  position: absolute;
  top: 6px;
  left: 6px;
  right: 6px;
  bottom: 6px;
  border-radius: 50%;
  border: 2px solid transparent;
  border-top-color: #FF00FF;
  -webkit-animation: spin 1.5s linear infinite;
  animation: spin 1.5s linear infinite;
}
.loader.small {
  width: 30px;
  height: 30px;
  border-width: 1px;
}
.loader.small:before {
  top: 1px;
  left: 1px;
  right: 1px;
  bottom: 1px;
  border-width: 1px;
}
.loader.small:after {
  top: 3px;
  left: 3px;
  right: 3px;
  bottom: 3px;
  border-width: 1px;
}
@-webkit-keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
body.childMode .postList .postContent .postPhoto .photoImg,
body.childMode .photoslist .photo .photoImg,
body.childMode .albumslist .album .albumImg,
body.childMode .videoslist .video .videoImg {
  overflow: hidden;
}
body.childMode .postList .postContent .postPhoto .photoImg img,
body.childMode .photoslist .photo .photoImg img,
body.childMode .albumslist .album .albumImg img,
body.childMode .videoslist .video .videoImg img {
  filter: blur(100px);
}
body.childMode .instaStoriesList .instaStoryPhoto,
body.childMode .instaStoriesList .instaStoryVideo {
  overflow: hidden;
}
body.childMode .instaStoriesList .instaStoryPhoto img,
body.childMode .instaStoriesList .instaStoryVideo img {
  filter: blur(100px);
}
body.childMode .memberProfileTop .memberProfilePhoto .profileImg,
body.childMode .memberslist .member .profileImg {
  overflow: hidden;
}
body.childMode .memberProfileTop .memberProfilePhoto .profileImg img,
body.childMode .memberslist .member .profileImg img {
  filter: blur(10px);
}
body.childMode .profileAvatar .profileImg img {
  filter: blur(2px);
}
body.childMode .video {
  overflow: hidden;
}
body.childMode .video video {
  filter: blur(100px);
}
body.childMode .video .plyr__poster {
  filter: blur(100px);
}
body.guestMode .postList .postContent .postPhoto .photoImg,
body.guestMode .photoslist .photo .photoImg,
body.guestMode .albumslist .album .albumImg,
body.guestMode .videoslist .video .videoImg {
  overflow: hidden;
}
body.guestMode .postList .postContent .postPhoto .photoImg img,
body.guestMode .photoslist .photo .photoImg img,
body.guestMode .albumslist .album .albumImg img,
body.guestMode .videoslist .video .videoImg img {
  filter: blur(20px);
}
body.guestMode .postList .postContent .postPhoto .photoImg.club img,
body.guestMode .photoslist .photo .photoImg.club img,
body.guestMode .albumslist .album .albumImg.club img,
body.guestMode .videoslist .video .videoImg.club img {
  filter: none;
}
body.guestMode .memberslist .member .profileImg {
  overflow: hidden;
}
body.guestMode .memberslist .member .profileImg img {
  filter: blur(10px);
}
body.guestMode .memberProfileTop .memberProfilePhoto .profileImg {
  overflow: hidden;
}
body.guestMode .video {
  overflow: hidden;
}
body.guestMode .video video {
  filter: blur(100px);
}
body.guestMode .video .plyr__poster {
  filter: blur(100px);
}
body.guestMode .instaStoriesList .instaStoryClass {
  background: #ccc;
}
body.guestMode .instaStoriesList .instaStoryPhoto img,
body.guestMode .instaStoriesList .instaStoryVideo img {
  filter: blur(20px);
}
.nonPwaHide {
  display: none !important;
}
#nprogress {
  display: none;
}
.lazyImg img {
  opacity: 1;
  transition: background 0.2s, opacity 0.2s, transform 0.2s;
}
.lazyImgError img,
.lazyImgWaiting img {
  opacity: 0;
  transition: none;
}
.lazyImgWaiting img {
  opacity: 0;
  transition: none;
}
/*.lazyImgWaiting {
	&:before {
		content: "";
		position: absolute;
		//padding-top:33%;
		width: 10px;
		height: 10px;
		top: 33%;
		left: 33%;
		border-radius: 50%;
		border: 5px solid transparent;
		border-top-color: rgba(186, 85, 211, 0.5);
		border-bottom-color: rgba(147, 112, 219, 0.5);
		-webkit-animation: spin 3s linear infinite;
		animation: spin 3s linear infinite;
	}
}*/
.pwaRightMenu {
  position: fixed;
  top: 103px;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #fff;
  box-shadow: none;
  transform: scaleX(0);
  opacity: 0;
  transform-origin: right;
  transition: all 0.15s;
}
.pwaRightMenu.active {
  display: block;
  transform: scaleX(1);
  opacity: 1;
}
.pwaRightMenu .popupHeader {
  border-bottom: 1px solid #E1E2E3;
  padding: 10px;
  font-weight: 700;
  font-size: 12px;
  color: #000;
}
.pwaRightMenu .popupHeader a {
  display: block;
}
.pwaRightMenu .menuProfile a {
  display: block;
  padding: 10px;
}
.pwaRightMenu .menuProfile a .profileName {
  padding: 0;
  margin: 0;
}
.pwaRightMenu .menuProfile .profileEdit {
  float: right;
  padding: 2px;
}
.pwaRightMenu .menuProfile .profileEdit i.i {
  color: #999;
  margin-right: 6px;
  vertical-align: middle;
}
.pwaRightMenu .menuProfile .profileEdit i.i.mdi::before {
  font-size: 18px;
}
.pwaRightMenu ul {
  padding: 5px 0;
  margin: 0;
  border-top: 1px solid #E1E2E3;
  clear: both;
}
.pwaRightMenu ul:first-child {
  border-top: none;
}
.pwaRightMenu ul li {
  font-size: 12px;
  padding: 0;
  list-style: none;
}
.pwaRightMenu ul li a {
  color: #000;
  display: block;
  padding: 4px 14px;
  font-size: 12px;
  line-height: 200%;
}
.pwaRightMenu ul li a:hover {
  text-decoration: none;
}
.pwaRightMenu ul li span.buttonlink {
  color: #000;
  display: inline-block;
  padding: 4px 14px;
  font-size: 12px;
  line-height: 200%;
}
.pwaRightMenu ul li .buttonlink i.i {
  color: #999;
  margin-right: 10px;
  vertical-align: middle;
}
.pwaRightMenu ul li .buttonlink i.i.mdi::before {
  font-size: 18px;
}
.pwaRightMenu ul li .custom-switch {
  float: right;
  margin-top: 4px;
}
.pwaShow {
  display: none;
}
.pwaShowFx {
  display: none;
}
.pwaNewMenu {
  display: none;
}
body.pwa .container {
  padding-right: 4px;
  padding-left: 4px;
}
body.pwa .row {
  margin-right: -4px;
  margin-left: -4px;
}
body.pwa .content {
  padding-left: 4px;
  padding-right: 4px;
  max-width: 100%;
  /* width: 100%; */
  flex: 0 0 100%;
}
body.pwa .footer {
  display: none;
}
body.pwa .main {
  margin-top: 103px;
  min-height: calc(100vh - 103px);
}
body.pwa .navbar {
  z-index: 110;
}
body.pwa .navbar.navbar-sec {
  display: flex;
  z-index: 102;
}
body.pwa .navbar.navbar-sec .navbar-icon {
  border-bottom: 4px solid transparent;
}
body.pwa .navbar.navbar-sec .navbar-icon.active {
  border-bottom-color: #9b031f;
}
body.pwa .navbar .navbar-icon {
  outline: 0;
  border: none;
  background: transparent;
  padding: 0;
}
body.pwa .navbar .navbar-icon img {
  border-radius: 50%;
  width: 30px;
  height: 30px;
  margin-top: 5px;
}
body.pwa .navbar .popupTopSearchPopup {
  right: 50px;
  position: absolute;
  z-index: 1;
  left: 0;
  top: 5px;
  display: block;
}
body.pwa .navbar .popupTopSearchPopup #popupSearchToggle {
  position: absolute;
  right: 0;
}
body.pwa .navbar .popupTopSearchPopup .popupTop {
  top: 0;
  right: 40px;
  /* left: 0; */
  position: absolute;
  width: calc(100% - 50px);
  background: transparent;
  border: none;
  box-shadow: none;
  transform-origin: right;
  transform: scaleX(0);
  margin-left: -330px;
  width: 330px;
}
body.pwa .navbar .popupTopSearchPopup .popupTop.active {
  display: block;
  transform: scaleX(1);
}
body.pwa .navbar .popupTopSearchPopup .popupTop .dropdown_caret {
  display: none;
}
body.pwa .navbar .popupTopSearchPopup .popupTop.right {
  right: 40px;
}
body.pwa .pwaHide {
  display: none !important;
}
body.pwa .pwaShow {
  display: unset !important;
}
body.pwa .nonPwaHide {
  display: unset !important;
}
body.pwa .sidebar {
  top: 103px;
  height: calc( 100% - 103px );
  background-color: #fff;
  box-shadow: none;
}
body.pwa .sidebar .sideHeader {
  display: none;
}
body.pwa .sidebar .lmenu .menuProfile {
  display: none;
}
body.pwa .sidebar.right {
  display: none !important;
}
body.pwa .sidebar .sideClose {
  float: right;
  height: 32px;
  line-height: 32px;
  margin-bottom: -32px;
  position: fixed;
  top: 0;
  right: 0;
}
body.pwa .sidebar .sideClose .menu-toggler {
  width: 32px;
  height: 32px;
  line-height: 32px;
  text-align: center;
}
body.pwa .leftmenu .menuheader {
  padding: 10px 5px 5px 5px;
  color: #999;
  font-size: 12px;
}
body.pwa .leftmenu .menuitem a,
body.pwa .leftmenu .menuitem span.a {
  font-size: 14px;
  color: #000;
  font-weight: 400;
  padding: 3px 3px 3px 10px;
}
body.pwa .leftmenu .menuitem a i.i,
body.pwa .leftmenu .menuitem span.a i.i {
  font-size: 18px;
  margin-right: 16px;
  width: 20px;
  height: 20px;
  line-height: 20px;
}
body.pwa .leftmenu .menuitem a i.i.mdi:before,
body.pwa .leftmenu .menuitem span.a i.i.mdi:before {
  font-size: 24px;
  line-height: 18px;
}
body.pwa .leftmenu .menuitem .menusubitems a {
  font-size: 12px;
  line-height: 20px;
}
body.pwa .instaStoriesList {
  overflow-x: auto;
  overflow-y: hidden;
  height: auto;
}
body.pwa .instaStoriesList .instaStory {
  min-width: 120px;
  min-height: 190px;
}
@media (max-width: 768px) {
  body.pwa .container .sidebar {
    top: 103px;
    z-index: 1000;
    position: fixed;
  }
  body.pwa .container .sidebar.right {
    display: none;
    left: unset;
    transform-origin: right;
    right: 0;
    z-index: unset;
    transform: scaleX(1);
    max-width: 180px;
    top: 53px;
    height: unset;
    box-shadow: none;
    padding-left: unset;
    padding-right: 5px;
  }
  body.pwa .container .lmenu {
    max-height: calc(100vh - 103px);
  }
  body.pwa .container .lmenu.sticky-top {
    position: relative;
    top: 0;
  }
  body.pwa .container .lmenu .sideHeader {
    display: block;
  }
  body.pwa .container.tabletfull > .row > .col-md-8 {
    width: 100%;
  }
  body.pwa .container.tabletfull .sidebar.right {
    transform: scaleX(0);
  }
}
@media (max-width: 760px) {
  body.pwa .container .sidebar {
    top: 103px;
    z-index: 1000;
    position: fixed;
  }
  body.pwa .container .sidebar.right {
    display: none;
    left: unset;
    transform-origin: right;
    right: 0;
    z-index: 20;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  }
  body.pwa .container .sidebar.right:not(.show) {
    transform: scaleX(0);
  }
}
@media (min-width: 770px) {
  body.pwa .container {
    width: 100%;
    max-width: 100%;
  }
  body.pwa .container > .row > .col-md-8 {
    width: 100%;
    max-width: 100%;
  }
  body.pwa .container .sidebar {
    top: 103px;
    z-index: 1000;
    position: fixed;
  }
  body.pwa .container .sidebar:not(.show) {
    transform: scaleX(0);
  }
  body.pwa .container .sidebar.right {
    display: none;
    left: unset;
    transform-origin: right;
    right: 0;
    z-index: 20;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  }
  body.pwa .container .sidebar.right:not(.show) {
    transform: scaleX(0);
  }
}
body.pwa #nprogress {
  display: unset !important;
}
body.pwa .pwaShowFx {
  display: flex !important;
}
body.pwa .pwaShowFx.erase {
  display: none !important;
}
body.pwa .card {
  width: 100%;
}
body.pwa .container .sidebar {
  height: calc(100% - 103px);
  width: 100%;
  z-index: 90;
}
body.pwa .container .sidebar .lmenu {
  overflow: auto;
  height: 100vh;
  max-height: calc(100vh - 120px);
  width: 100vw;
}
body.pwa .popupContainer {
  position: relative !important;
  width: auto;
}
body.pwa .navbar-sec {
  z-index: 102 !important;
}
body.pwa body .main.top {
  margin-top: 48px;
  z-index: 90;
}
body.pwa .menuheader {
  font-size: 11px;
}
body.pwa .navbar .popupTopSearchPopup .popupTop.active {
  width: 200px;
}
body.pwa .pwaNewMenu {
  background: #F1F2F6;
  display: block;
  box-sizing: border-box;
  padding: 15px;
  height: 100vh;
}
body.pwa .pwaNewMenu .menuProfile {
  display: block !important;
}
body.pwa .pwaNewMenu .line.top {
  padding-bottom: 10px;
  border-bottom: 1px solid #E1E1E1;
}
body.pwa .pwaNewMenu .line.top .col .menuProfile a .profileName {
  color: #575757;
}
body.pwa .pwaNewMenu .line.top .col .settingPwa a {
  color: #575757;
}
body.pwa .pwaNewMenu .line.top .col .popupTopSearchPopup {
  display: inline-block;
  margin-left: 10px;
}
body.pwa .pwaNewMenu .line.top .col .popupTopSearchPopup .navbar-icon i {
  color: #575757;
}
body.pwa .pwaNewMenu .line.underTop .row {
  padding: 13px 0;
}
body.pwa .pwaNewMenu .line.underTop .row:first-of-type {
  padding-bottom: 0;
}
body.pwa .pwaNewMenu .line.underTop .row .col {
  height: 20px;
  align-items: center;
  display: flex;
  padding: 0 5px;
}
body.pwa .pwaNewMenu .line.underTop .row .col:nth-child(2) {
  justify-content: flex-end;
}
body.pwa .pwaNewMenu .line.underTop .row .col .all {
  font-size: 11px;
  min-width: 87px;
  line-height: 32px;
  margin-left: 5px;
}
body.pwa .pwaNewMenu .line.underTop .row .col > .onlineusers {
  display: flex;
}
body.pwa .pwaNewMenu .line.underTop .row .col > .onlineusers .onlineusers {
  display: flex;
  width: 77px;
  overflow: hidden;
}
body.pwa .pwaNewMenu .line.underTop .row .col > .onlineusers .onlineusers .avatar {
  min-width: 24px;
}
body.pwa .pwaNewMenu .line.online {
  margin-bottom: 10px;
}
body.pwa .pwaNewMenu .line.online .online-box {
  background: #fff;
  box-sizing: border-box;
  padding: 10px 20px;
  border-radius: 10px;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1);
}
body.pwa .pwaNewMenu .line.online .online-box .menuheader {
  font-weight: 700;
  color: #575757;
}
body.pwa .pwaNewMenu .line.online .online-box .menuheader i {
  display: inline-block;
  margin-right: 10px;
  color: #9b2621;
}
body.pwa .pwaNewMenu .line.online .online-box .menuheader-right {
  clear: both;
  padding: 5px;
  text-align: right;
  color: #666;
  font-size: 12px;
  padding-right: 0;
}
body.pwa .pwaNewMenu .line.online .online-box .row .col {
  padding: 0;
}
body.pwa .pwaNewMenu .line.online .online-box .row .col:first-of-type {
  display: flex;
  align-items: center;
}
body.pwa .pwaNewMenu .line.tiles {
  position: relative;
  height: 324px;
  overflow: hidden;
  transition-duration: 0.2s;
}
body.pwa .pwaNewMenu .line.tiles .row .col {
  padding: 0 5px;
}
body.pwa .pwaNewMenu .line.tiles .row .col .tile {
  background: #fff;
  box-sizing: border-box;
  padding: 14px 20px;
  border-radius: 10px;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1);
  height: 71px;
  width: 100%;
  margin-bottom: 10px;
}
body.pwa .pwaNewMenu .line.tiles .row .col .tile a,
body.pwa .pwaNewMenu .line.tiles .row .col .tile .a {
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: 700;
  color: #575757;
  width: 100%;
  height: 100%;
}
body.pwa .pwaNewMenu .line.tiles .row .col .tile a i,
body.pwa .pwaNewMenu .line.tiles .row .col .tile .a i {
  display: inline-flex;
  margin-right: 10px;
  color: #9b2621;
}
body.pwa .pwaNewMenu .line.tiles .row .col .tile.list {
  height: auto;
}
body.pwa .pwaNewMenu .line.tiles .row .col .tile.list .menusubitems * {
  margin-bottom: 10px;
}
body.pwa .pwaNewMenu .line.tiles .row .col .tile.list .menusubitems *:last-of-type {
  margin-bottom: 0;
}
body.pwa .pwaNewMenu .line.tiles .row.collapse {
  display: none;
}
body.pwa .pwaNewMenu .line.tiles .row.collapse.show {
  display: flex;
}
body.pwa .pwaNewMenu .line.tiles.opHeight {
  height: 546px;
}
body.pwa .pwaNewMenu .line.tiles.open {
  height: auto;
}
body.pwa .pwaNewMenu .line.list {
  margin-top: 20px;
}
body.pwa .pwaNewMenu .line.list .list-item {
  box-sizing: border-box;
  padding: 10px 0;
  border-bottom: 1px solid #E1E1E1;
}
body.pwa .pwaNewMenu .line.list .list-item a {
  display: flex;
  align-items: center;
  color: #575757;
  font-size: 14px;
  font-weight: 700;
}
body.pwa .pwaNewMenu .line.list .list-item a i {
  display: inline-flex;
  margin-right: 10px;
  color: #9b2621;
}
body.pwa .pwaNewMenu .line.list .list-item:first-of-type {
  border-top: 1px solid #E1E1E1;
}
body.pwa .pwaNewMenu .moreTiles {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 33px;
  background: #E5E6EB;
  border-radius: 5px;
}
body.pwa .pwaNewMenu .moreTiles span {
  color: #575757;
  font-size: 14px;
  font-weight: 700;
}
body.pwa .pwaNewMenu .moreTiles span.noview {
  display: none;
}
body.pwa .pwaNewMenu .moreTiles.active span.view {
  display: none;
}
body.pwa .pwaNewMenu .moreTiles.active span.noview {
  display: inline;
}
body.pwa .pwaRightMenu {
  top: 103px;
  box-sizing: border-box;
  padding: 20px;
  z-index: 102;
  border-top: 1px solid #E1E1E1;
  border-top-width: 1px;
  border-top-style: solid;
  border-top-color: #e1e1e1;
  overflow: auto;
}
body.pwa .pwaRightMenu.open {
  display: block;
  opacity: 1;
  transform: scaleX(1);
}
body.pwa .pwaRightMenu .title {
  border-bottom: 1px solid #E1E1E1;
  padding-bottom: 10px;
}
body.pwa .pwaRightMenu .title .col {
  display: flex;
  align-items: center;
}
body.pwa .pwaRightMenu .title .col a {
  color: #000;
  text-decoration: none;
}
body.pwa .pwaRightMenu .title .col a i {
  display: inline-flex;
  margin-right: 10px;
  color: #000;
}
body.pwa .pwaRightMenu .title .col h3 {
  font-size: 14px;
  font-weight: 700;
  color: #575757;
  margin-top: 0;
  margin-bottom: 6px;
}
body.pwa .pwaRightMenu .menuProfile {
  height: 33px;
}
body.pwa .pwaRightMenu .menuProfile .profileEdit {
  float: unset;
  padding: 2px 0;
}
body.pwa .pwaRightMenu .menuProfile .profileEdit a {
  font-size: 14px !important;
  font-weight: 700;
  color: #575757 !important;
}
body.pwa .pwaRightMenu .menuProfile .profileEdit a i {
  color: #9b2621 !important;
  margin-right: 11px !important;
  margin-left: 4px;
}
body.pwa .pwaRightMenu .menuProfile .profileEdit a i:before {
  font-size: 22px !important;
}
body.pwa .pwaRightMenu ul {
  padding: 0;
  border-top: 0;
}
body.pwa .pwaRightMenu ul li {
  border-top: 1px solid #E1E1E1;
}
body.pwa .pwaRightMenu ul li .buttonlink {
  display: flex;
  align-items: center;
  padding: 6px 14px !important;
  font-size: 14px !important;
  font-weight: 700;
  color: #575757 !important;
}
body.pwa .pwaRightMenu ul li .buttonlink i {
  color: #9b2621 !important;
  display: inline-flex;
  align-self: center;
}
body.pwa .pwaRightMenu ul li .buttonlink i.pwaShow {
  display: inline-flex;
}
body.pwa .pwaRightMenu ul li .buttonlink i:before {
  font-size: 22px !important;
}
body.pwa .pwaRightMenu ul li .buttonlink.accordion {
  position: relative;
  display: flex;
  width: 100%;
}
body.pwa .pwaRightMenu ul li .buttonlink.accordion .arr {
  position: absolute;
  top: 0;
  right: 10px;
  bottom: 0;
  margin: auto;
  height: 14px;
  color: #707070 !important;
}
body.pwa .pwaRightMenu ul li .buttonlink.accordion .arr:before {
  font-size: 30px !important;
}
body.pwa .pwaRightMenu ul li .buttonlink.accordion.open .arr {
  transform: rotate(180deg);
}
body.pwa .pwaRightMenu ul li.collapse {
  display: none;
  background: #F1F2F6;
}
body.pwa .pwaRightMenu ul li.collapse.show {
  display: list-item;
}
body.pwa .pwaRightMenu ul li.collapse .rowss {
  display: block;
  width: 100%;
}
body.pwa .pwaRightMenu ul li.collapse .rowss ul li {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  border-top: 0;
}
body.pwa .pwaRightMenu ul li.collapse .rowss ul li .buttonlink {
  font-weight: 400;
}
body.pwa .pwaRightMenu ul li.collapse .rowss ul li .buttonlink i {
  color: #575757 !important;
}
body.pwa .pwaRightMenu ul li.collapse .rowss ul li .custom-switch {
  margin-top: 0;
}
body.pwa .searchGender {
  display: flex;
  justify-content: center;
}
body.pwa .topGen {
  justify-content: center;
}
body.pwa #filterBody .mb-0 .text-center .btn {
  margin-top: 0 !important;
}
body.pwa .Pwarow {
  flex-wrap: nowrap;
}
body.pwa #memberSearchForm .btn-secondary.active,
body.pwa #eventSearchForm .btn-secondary.active,
body.pwa .eventSearch .btn-secondary.active {
  background-color: #9b2621;
}
body.pwa #memberSearchForm .btn-secondary.btn-icon,
body.pwa #eventSearchForm .btn-secondary.btn-icon,
body.pwa .eventSearch .btn-secondary.btn-icon {
  padding: 5px 3px;
}
body.pwa .pwaFxnew {
  display: flex;
}
body.pwa .pwaFxnew .sortField {
  flex-wrap: nowrap;
}
body.pwa .pwaFxnew .sortField .col-3 {
  min-width: 70px;
}
body.pwa .card {
  box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
  -webkit-border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  -moz-border-radius-topleft: 5px;
  -moz-border-radius-topright: 5px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
body.pwa .card .card-header {
  background: #fff;
  box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
}
body.pwa .card .card-header .cardCollapse {
  width: 140px;
  display: flex;
  align-items: center;
  border: 1px solid #9b2621;
  justify-content: center;
  border-radius: 5px;
  margin: 0 0 0 0;
}
body.pwa .card .card-header .cardCollapse i {
  display: inline-flex;
  align-items: center;
}
body.pwa .card .card-header.pwaShow {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
}
body.pwa .card .card-header.pwaShow h2 {
  margin-bottom: 0;
}
body.pwa .card .card-body {
  padding: 15px 5px;
}
body.pwa .card .card-body .form-group .px-1 .sliderContainer .sliderMin {
  width: 14px;
}
body.pwa .card .card-body #multiForm .form-group .col-form-label {
  padding-left: 0;
}
body.pwa #filterButtNew span {
  font-size: 14px;
}
body.pwa #filterButtNew .text2 {
  display: none;
}
body.pwa #filterButtNew img {
  display: inline-block;
  margin-left: 10px;
  transform: rotate(180deg);
}
body.pwa #filterButtNew.open .text1 {
  display: none;
}
body.pwa #filterButtNew.open .text2 {
  display: inline-block;
}
body.pwa #filterButtNew.open img {
  transform: rotate(0deg);
  filter: brightness(10);
}
body.pwa #multiForm .form-group.pwaShow {
  width: 50%;
}
body.pwa #multiForm .form-group.pwaShow > div {
  width: 100%;
  max-width: 100%;
}
body.pwa #multiForm .form-group.pwaShow .btn-secondary {
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}
body.pwa #multiForm .form-group.pwaShow .btn-secondary img {
  display: inline-flex;
  margin-left: 10px;
}
body.pwa #multiForm .form-group.pwaShow .btn-secondary.active {
  background-color: #fff;
}
body.pwa #multiForm .form-group.pwaShow .btn-secondary.active img {
  transform: rotate(0deg);
}
body.pwa .headerActionPwa h2 {
  font-weight: 700;
  font-size: 14px;
  line-height: 19px;
  color: #575757;
}
body.pwa .headerActionPwa .addButton .btn-secondary {
  height: 30px;
  padding: 0 0.5rem;
  color: #9b2621 !important;
  display: flex;
  align-items: center;
  font-size: 11px;
}
body.pwa .headerActionPwa .addButton .btn-secondary i {
  display: inline-flex;
  color: #9b2621;
  margin-left: 5px;
  font-size: 12px;
}
body.pwa .headerActionPwa .addButton .btn-secondary i:before {
  top: 0;
}
body.pwa .eventBody .form-group {
  margin-bottom: 20px;
}
body.pwa .eventBody .form-group.top-filter {
  justify-content: center;
}
body.pwa .select-width {
  max-width: 200px;
}
body.pwa .eventslist.list .event.pwaShow {
  display: flex !important;
  flex-direction: column;
  margin: auto;
  margin-bottom: 30px;
  border-radius: 5px;
  box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
  overflow: visible;
}
body.pwa .eventslist.list .event.pwaShow .eventImg {
  width: 100%;
  height: 198px;
}
body.pwa .eventslist.list .event.pwaShow .eventImg img {
  height: 100%;
  max-height: 198px;
}
body.pwa .eventslist.list .event.pwaShow .eventInfo {
  width: 100%;
  box-sizing: border-box;
  padding: 0 15px;
  margin-top: 15px;
}
body.pwa .eventslist.list .event.pwaShow .eventInfo .row {
  max-width: 399px;
  margin: auto;
}
body.pwa .eventslist.list .event.pwaShow .eventInfo .row .col-6 {
  padding: 0;
}
body.pwa .eventslist.list .event.pwaShow .eventInfo .row .col-6:last-of-type {
  padding-left: 30px;
}
body.pwa .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventDate {
  font-weight: 400;
  font-size: 14px;
  line-height: 19px;
  color: #575757;
  margin-top: 0;
  margin-bottom: 10px;
}
body.pwa .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventName > a {
  display: inline-block;
  font-weight: 700;
  font-size: 14px;
  line-height: 19px;
  color: #9B2621;
  margin-top: 0;
  margin-bottom: 10px;
}
body.pwa .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventDetail .eventClub a {
  display: block;
  font-weight: 400;
  font-size: 14px;
  line-height: 19px;
  color: #9B2621;
  margin-top: 0;
}
body.pwa .eventslist.list .event.pwaShow .eventInfo .row .col-6 label {
  font-weight: 400;
  font-size: 14px;
  line-height: 19px;
  color: #575757;
}
body.pwa .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventAttending {
  width: 100%;
  display: flex;
  float: unset;
  margin-top: 10px;
}
body.pwa .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventAttending .att {
  display: flex;
  flex-direction: column;
  margin-right: 20px;
}
body.pwa .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventAttending .att .genderIcon {
  float: unset;
}
body.pwa .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventAttending .att .count {
  text-align: center;
  width: 24px;
  margin-top: 5px;
  float: unset;
}
body.pwa .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventAttending .att:last-of-type {
  margin-right: 0;
}
body.pwa .eventslist.list .event.pwaShow .eventDownButton {
  display: flex;
  align-items: center;
  padding: 15px;
  box-sizing: border-box;
  width: 100%;
  max-width: 500px;
  margin: auto;
}
body.pwa .eventslist.list .event.pwaShow .eventDownButton a.new-button {
  font-weight: 400;
  font-size: 12px;
  line-height: 17px;
  color: #000;
  background-color: #DBDBDB;
  box-sizing: border-box;
  padding: 0 10px;
  width: 100%;
  max-width: 150px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  margin-right: 12px;
}
body.pwa .eventslist.list .event.pwaShow .eventDownButton a.new-button i {
  display: inline-flex;
  margin-left: 10px;
  font-size: 16px;
}
body.pwa .eventslist.list .event.pwaShow .eventDownButton a.new-button:hover {
  text-decoration: none;
  background-color: #9B2621;
  color: #fff;
}
body.pwa .eventslist.list .event.pwaShow .eventDownButton a.new-button-small {
  font-size: 16px;
  color: #000;
  background-color: #DBDBDB;
  box-sizing: border-box;
  padding: 0 15px;
  height: 30px;
  display: flex;
  align-items: center;
  border-radius: 5px;
}
body.pwa .eventslist.list .event.pwaShow .eventDownButton a.new-button-small i {
  display: flex;
}
body.pwa .eventslist.list .event.pwaShow .eventDownButton a.new-button-small:hover {
  text-decoration: none;
  background-color: #9B2621;
  color: #fff;
}
body.pwa .top-filter .btn-secondary {
  height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 0 0.75rem;
}
body.pwa .top-filter .btn-secondary.active {
  color: #fff !important;
}
body.pwa select,
body.pwa select.form-control {
  height: 30px;
  border: 1px solid #eee;
  box-shadow: 0 0 5px rgb(0 0 0%);
  max-width: 200px;
}
body.pwa .addressInput input {
  max-width: 200px;
}
body.pwa .Pwawidth > div {
  flex: unset;
  max-width: unset;
}
body.pwa .fcenter {
  display: flex;
  justify-content: center;
}
body.pwa .country label.checkSelect {
  position: relative;
  padding: 0;
  border: 0;
}
body.pwa .country label.checkSelect > span {
  position: relative;
  box-sizing: border-box;
  padding: 8px 3px;
  background-color: #fff;
  box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
  z-index: 1;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #fff;
  border-radius: 10px;
}
body.pwa .country label.checkSelect input[type="checkbox"] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: 2;
}
body.pwa .country label.checkSelect input[type="checkbox"]:checked + span {
  border: 1px solid #9b2621;
}
body.pwa .eventProfileButtons button.btnGreen {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: #0DD549 !important;
  width: 100% !important;
  border-radius: 5px;
  color: #fff !important;
}
body.pwa .eventProfileButtons button.btnGreen i {
  display: inline-flex;
  margin-right: 10px;
}
body.pwa .eventProfileButtons button.btnYellow {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: #F9AF03 !important;
  width: 100% !important;
  border-radius: 5px;
  color: #fff !important;
}
body.pwa .eventProfileButtons button.btnYellow i {
  display: inline-flex;
  margin-right: 10px;
}
body.pwa .eventProfileButtons button.btnRed {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: #E24343 !important;
  width: 100% !important;
  border-radius: 5px;
  color: #fff !important;
}
body.pwa .eventProfileButtons button.btnRed i {
  display: inline-flex;
  margin-right: 10px;
}
body.pwa .eventProfileButtons button.btnGrey {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: #DBDBDB !important;
  width: 100% !important;
  border-radius: 5px;
  color: #000 !important;
  border: 1px solid #ddd !important;
}
body.pwa .eventProfileButtons button.btnGrey i {
  display: inline-flex;
  margin-right: 10px;
}
body.pwa .eventProfileButtons .actionsButton {
  width: 100%;
}
body.pwa .eventProfileButtons.two {
  margin-top: 17px;
}
body.pwa .memberProfileButtons.pwaShow {
  display: block !important;
  min-height: 120px;
}
body.pwa .newAccordionTitle {
  position: relative;
  width: 100%;
  height: 30px;
  font-size: 14px;
  line-height: 19px;
  color: #575757;
  box-sizing: border-box;
  padding: 0 18px;
  background: #fff;
  border-radius: 5px;
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.16);
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
body.pwa .newAccordionTitle img {
  max-height: 10px;
}
body.pwa .newAccordionContent {
  color: #575757;
  box-sizing: border-box;
  padding: 18px;
  background: #fff;
  border-radius: 5px;
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.16);
  margin-bottom: 15px;
}
body.pwa .newAccordionContent .contop .memberProfileInfo .row {
  margin-bottom: 11px;
}
body.pwa .newAccordionContent .contop .memberProfileInfo .row .rowlabel {
  font-weight: 700;
  font-size: 14px;
  line-height: 19px;
  color: #575757;
  min-width: 100px;
}
body.pwa .newAccordionContent .contop .memberProfileInfo .row .row-value {
  font-weight: 400;
  font-size: 14px;
  line-height: 19px;
  color: #575757;
}
body.pwa .newAccordionContent .contop .memberProfileInfo .eventAttending {
  display: flex;
  align-items: center;
  margin-bottom: 11px;
  margin-right: -4px;
  margin-left: -4px;
}
body.pwa .newAccordionContent .contop .memberProfileInfo .eventAttending .attHeader {
  font-weight: 700;
  font-size: 14px;
  line-height: 19px;
  color: #575757;
  min-width: 100px;
}
body.pwa .newAccordionContent .contop .memberProfileInfo .eventAttending .attBody {
  display: flex;
}
body.pwa .newAccordionContent .contop .memberProfileInfo .eventAttending .attBody .att .genderIcon {
  display: none;
}
body.pwa .newAccordionContent .contop .memberProfileInfo .eventAttending .attBody .att .count {
  width: 30px;
}
body.pwa .filterFotoHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
body.pwa .filterFotoHeader h2 {
  font-weight: 700;
  font-size: 14px;
  line-height: 19px;
  color: #575757;
  margin-top: 0;
  margin-bottom: 0;
}
body.pwa .filterFotoHeader .addButton {
  float: unset !important;
  margin: 0 !important;
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.16);
}
body.pwa .filterFotoHeader .addButton .btn {
  background-color: #fff;
  color: #9b2621;
  padding: 0 0.75rem;
  height: 30px;
  display: flex;
  align-items: center;
}
body.pwa .switchRow {
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
  margin-top: 20px;
}
body.pwa .switchRow .switchRowContent {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #9B2621;
  border-radius: 5px;
  box-sizing: border-box;
  padding: 5px 0;
  background: #fff;
}
body.pwa .switchRow .switchRowContent.active {
  background-color: #9B2621;
}
body.pwa .switchRow .switchRowContent.active a {
  color: white;
}
body.pwa .switchRow .switchRowContent a {
  font-weight: 400;
  font-size: 14px;
  line-height: 19px;
  color: #646464;
  box-sizing: border-box;
  padding: 0 14px;
}
body.pwa #filterFoto,
body.pwa #filterVideo {
  background-color: #fff;
  margin-top: 5px;
  margin-bottom: 10px;
  box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
  -webkit-border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  -moz-border-radius-topleft: 5px;
  -moz-border-radius-topright: 5px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
body.pwa #filterFoto .newRow,
body.pwa #filterVideo .newRow {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
}
body.pwa #filterFoto .newRow .col-form-label,
body.pwa #filterVideo .newRow .col-form-label {
  display: inline-flex;
  max-width: 85px;
}
body.pwa #filterFoto .newRow .searchGender,
body.pwa #filterVideo .newRow .searchGender {
  justify-content: flex-start;
}
body.pwa #filterFoto .newRow2,
body.pwa #filterVideo .newRow2 {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  margin-bottom: 20px;
}
body.pwa #filterFoto .newRow2 .row,
body.pwa #filterVideo .newRow2 .row {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  max-width: 50% !important;
}
body.pwa #filterFoto .newRow2 .row label,
body.pwa #filterVideo .newRow2 .row label {
  padding: 0 10px;
}
body.pwa #filterFoto .newRow2 .row .col-sm-4,
body.pwa #filterVideo .newRow2 .row .col-sm-4 {
  padding: 0;
}
body.pwa #filterFoto .newFilterAlbum,
body.pwa #filterVideo .newFilterAlbum {
  margin-top: 20px;
  margin-bottom: 20px;
}
body.pwa #filterFoto .newFilterAlbum .row .btn-group .btn,
body.pwa #filterVideo .newFilterAlbum .row .btn-group .btn {
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.16);
  border-color: #fff;
  color: #AFAFAF;
  font-size: 14px;
  line-height: 19px;
  border-radius: 5px;
  margin-right: 5px;
  padding: 5px;
  margin-bottom: 5px;
}
body.pwa #filterFoto .newFilterAlbum .row .btn-group .btn.active,
body.pwa #filterVideo .newFilterAlbum .row .btn-group .btn.active {
  color: #fff;
}
body.pwa .privacy form .card .card-body .row,
body.pwa .clubs form .card .card-body .row,
body.pwa .advertfil form .card .card-body .row,
body.pwa .datin form .card .card-body .row {
  display: flex;
  flex-wrap: nowrap;
}
body.pwa .privacy form .card .card-body .row.ml-3,
body.pwa .clubs form .card .card-body .row.ml-3,
body.pwa .advertfil form .card .card-body .row.ml-3,
body.pwa .datin form .card .card-body .row.ml-3 {
  margin-left: 0 !important;
}
body.pwa .privacy form .card .card-body .row .searchIcon label,
body.pwa .clubs form .card .card-body .row .searchIcon label,
body.pwa .advertfil form .card .card-body .row .searchIcon label,
body.pwa .datin form .card .card-body .row .searchIcon label {
  width: 32px;
  height: 32px;
  border: 1px solid #fff;
  border-radius: 6px;
  line-height: 32px;
  text-align: center;
  padding: 3px;
  cursor: pointer;
  margin-right: 16px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
body.pwa .privacy form .card .card-body .row .searchIcon label .datingSexIcon,
body.pwa .clubs form .card .card-body .row .searchIcon label .datingSexIcon,
body.pwa .advertfil form .card .card-body .row .searchIcon label .datingSexIcon,
body.pwa .datin form .card .card-body .row .searchIcon label .datingSexIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
}
body.pwa .privacy form .card .card-body .row .searchIcon label .datingSexIcon i.i,
body.pwa .clubs form .card .card-body .row .searchIcon label .datingSexIcon i.i,
body.pwa .advertfil form .card .card-body .row .searchIcon label .datingSexIcon i.i,
body.pwa .datin form .card .card-body .row .searchIcon label .datingSexIcon i.i {
  height: 20px;
  width: 20px;
  line-height: 20px;
}
body.pwa .privacy form .card .card-body .row .searchIcon label .datingSexIcon i.i:before,
body.pwa .clubs form .card .card-body .row .searchIcon label .datingSexIcon i.i:before,
body.pwa .advertfil form .card .card-body .row .searchIcon label .datingSexIcon i.i:before,
body.pwa .datin form .card .card-body .row .searchIcon label .datingSexIcon i.i:before {
  height: 20px;
  width: 20px;
  line-height: 20px;
  font-size: 16px;
}
body.pwa .privacy form .card .card-body .row50,
body.pwa .clubs form .card .card-body .row50,
body.pwa .advertfil form .card .card-body .row50,
body.pwa .datin form .card .card-body .row50 {
  width: 50%;
}
body.pwa .parties form .card .card-body .row {
  flex-wrap: nowrap;
}
body.pwa .parties form .card .card-body .row .slider {
  width: 50%;
}
body.pwa .parties form .card .card-body .row .labelHide {
  display: none;
}
body.pwa .parties form .card .card-body .row .btn-group .btn {
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.16);
  border-color: #fff;
  color: #AFAFAF;
  font-size: 14px;
  line-height: 19px;
  border-radius: 5px;
  margin-right: 5px;
  padding: 5px;
  margin-bottom: 5px;
}
body.pwa .parties form .card .card-body .row .btn-group .btn.active {
  color: #fff !important;
}
body.pwa .label2 {
  max-width: 26%;
}
body.pwa .country-label {
  max-width: 67px;
}
body.pwa .addressInput input {
  padding-left: 20px;
}
@media all and (display-mode: standalone) {
  .container {
    padding-right: 4px;
    padding-left: 4px;
  }
  .row {
    margin-right: -4px;
    margin-left: -4px;
  }
  .content {
    padding-left: 4px;
    padding-right: 4px;
    max-width: 100%;
    /* width: 100%; */
    flex: 0 0 100%;
  }
  .footer {
    display: none;
  }
  .main {
    margin-top: 103px;
    min-height: calc(100vh - 103px);
  }
  .navbar {
    z-index: 110;
  }
  .navbar.navbar-sec {
    display: flex;
    z-index: 102;
  }
  .navbar.navbar-sec .navbar-icon {
    border-bottom: 4px solid transparent;
  }
  .navbar.navbar-sec .navbar-icon.active {
    border-bottom-color: #9b031f;
  }
  .navbar .navbar-icon {
    outline: 0;
    border: none;
    background: transparent;
    padding: 0;
  }
  .navbar .navbar-icon img {
    border-radius: 50%;
    width: 30px;
    height: 30px;
    margin-top: 5px;
  }
  .navbar .popupTopSearchPopup {
    right: 50px;
    position: absolute;
    z-index: 1;
    left: 0;
    top: 5px;
    display: block;
  }
  .navbar .popupTopSearchPopup #popupSearchToggle {
    position: absolute;
    right: 0;
  }
  .navbar .popupTopSearchPopup .popupTop {
    top: 0;
    right: 40px;
    /* left: 0; */
    position: absolute;
    width: calc(100% - 50px);
    background: transparent;
    border: none;
    box-shadow: none;
    transform-origin: right;
    transform: scaleX(0);
    margin-left: -330px;
    width: 330px;
  }
  .navbar .popupTopSearchPopup .popupTop.active {
    display: block;
    transform: scaleX(1);
  }
  .navbar .popupTopSearchPopup .popupTop .dropdown_caret {
    display: none;
  }
  .navbar .popupTopSearchPopup .popupTop.right {
    right: 40px;
  }
  .pwaHide {
    display: none !important;
  }
  .pwaShow {
    display: unset !important;
  }
  .nonPwaHide {
    display: unset !important;
  }
  .sidebar {
    top: 103px;
    height: calc( 100% - 103px );
    background-color: #fff;
    box-shadow: none;
  }
  .sidebar .sideHeader {
    display: none;
  }
  .sidebar .lmenu .menuProfile {
    display: none;
  }
  .sidebar.right {
    display: none !important;
  }
  .sidebar .sideClose {
    float: right;
    height: 32px;
    line-height: 32px;
    margin-bottom: -32px;
    position: fixed;
    top: 0;
    right: 0;
  }
  .sidebar .sideClose .menu-toggler {
    width: 32px;
    height: 32px;
    line-height: 32px;
    text-align: center;
  }
  .leftmenu .menuheader {
    padding: 10px 5px 5px 5px;
    color: #999;
    font-size: 12px;
  }
  .leftmenu .menuitem a,
  .leftmenu .menuitem span.a {
    font-size: 14px;
    color: #000;
    font-weight: 400;
    padding: 3px 3px 3px 10px;
  }
  .leftmenu .menuitem a i.i,
  .leftmenu .menuitem span.a i.i {
    font-size: 18px;
    margin-right: 16px;
    width: 20px;
    height: 20px;
    line-height: 20px;
  }
  .leftmenu .menuitem a i.i.mdi:before,
  .leftmenu .menuitem span.a i.i.mdi:before {
    font-size: 24px;
    line-height: 18px;
  }
  .leftmenu .menuitem .menusubitems a {
    font-size: 12px;
    line-height: 20px;
  }
  .instaStoriesList {
    overflow-x: auto;
    overflow-y: hidden;
    height: auto;
  }
  .instaStoriesList .instaStory {
    min-width: 120px;
    min-height: 190px;
  }
  #nprogress {
    display: unset !important;
  }
  .pwaShowFx {
    display: flex !important;
  }
  .pwaShowFx.erase {
    display: none !important;
  }
  .card {
    width: 100%;
  }
  .container .sidebar {
    height: calc(100% - 103px);
    width: 100%;
    z-index: 90;
  }
  .container .sidebar .lmenu {
    overflow: auto;
    height: 100vh;
    max-height: calc(100vh - 120px);
    width: 100vw;
  }
  .popupContainer {
    position: relative !important;
    width: auto;
  }
  .navbar-sec {
    z-index: 102 !important;
  }
  body .main.top {
    margin-top: 48px;
    z-index: 90;
  }
  .menuheader {
    font-size: 11px;
  }
  .navbar .popupTopSearchPopup .popupTop.active {
    width: 200px;
  }
  .pwaNewMenu {
    background: #F1F2F6;
    display: block;
    box-sizing: border-box;
    padding: 15px;
    height: 100vh;
  }
  .pwaNewMenu .menuProfile {
    display: block !important;
  }
  .pwaNewMenu .line.top {
    padding-bottom: 10px;
    border-bottom: 1px solid #E1E1E1;
  }
  .pwaNewMenu .line.top .col .menuProfile a .profileName {
    color: #575757;
  }
  .pwaNewMenu .line.top .col .settingPwa a {
    color: #575757;
  }
  .pwaNewMenu .line.top .col .popupTopSearchPopup {
    display: inline-block;
    margin-left: 10px;
  }
  .pwaNewMenu .line.top .col .popupTopSearchPopup .navbar-icon i {
    color: #575757;
  }
  .pwaNewMenu .line.underTop .row {
    padding: 13px 0;
  }
  .pwaNewMenu .line.underTop .row:first-of-type {
    padding-bottom: 0;
  }
  .pwaNewMenu .line.underTop .row .col {
    height: 20px;
    align-items: center;
    display: flex;
    padding: 0 5px;
  }
  .pwaNewMenu .line.underTop .row .col:nth-child(2) {
    justify-content: flex-end;
  }
  .pwaNewMenu .line.underTop .row .col .all {
    font-size: 11px;
    min-width: 87px;
    line-height: 32px;
    margin-left: 5px;
  }
  .pwaNewMenu .line.underTop .row .col > .onlineusers {
    display: flex;
  }
  .pwaNewMenu .line.underTop .row .col > .onlineusers .onlineusers {
    display: flex;
    width: 77px;
    overflow: hidden;
  }
  .pwaNewMenu .line.underTop .row .col > .onlineusers .onlineusers .avatar {
    min-width: 24px;
  }
  .pwaNewMenu .line.online {
    margin-bottom: 10px;
  }
  .pwaNewMenu .line.online .online-box {
    background: #fff;
    box-sizing: border-box;
    padding: 10px 20px;
    border-radius: 10px;
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1);
  }
  .pwaNewMenu .line.online .online-box .menuheader {
    font-weight: 700;
    color: #575757;
  }
  .pwaNewMenu .line.online .online-box .menuheader i {
    display: inline-block;
    margin-right: 10px;
    color: #9b2621;
  }
  .pwaNewMenu .line.online .online-box .menuheader-right {
    clear: both;
    padding: 5px;
    text-align: right;
    color: #666;
    font-size: 12px;
    padding-right: 0;
  }
  .pwaNewMenu .line.online .online-box .row .col {
    padding: 0;
  }
  .pwaNewMenu .line.online .online-box .row .col:first-of-type {
    display: flex;
    align-items: center;
  }
  .pwaNewMenu .line.tiles {
    position: relative;
    height: 324px;
    overflow: hidden;
    transition-duration: 0.2s;
  }
  .pwaNewMenu .line.tiles .row .col {
    padding: 0 5px;
  }
  .pwaNewMenu .line.tiles .row .col .tile {
    background: #fff;
    box-sizing: border-box;
    padding: 14px 20px;
    border-radius: 10px;
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1);
    height: 71px;
    width: 100%;
    margin-bottom: 10px;
  }
  .pwaNewMenu .line.tiles .row .col .tile a,
  .pwaNewMenu .line.tiles .row .col .tile .a {
    display: flex;
    align-items: center;
    font-size: 14px;
    font-weight: 700;
    color: #575757;
    width: 100%;
    height: 100%;
  }
  .pwaNewMenu .line.tiles .row .col .tile a i,
  .pwaNewMenu .line.tiles .row .col .tile .a i {
    display: inline-flex;
    margin-right: 10px;
    color: #9b2621;
  }
  .pwaNewMenu .line.tiles .row .col .tile.list {
    height: auto;
  }
  .pwaNewMenu .line.tiles .row .col .tile.list .menusubitems * {
    margin-bottom: 10px;
  }
  .pwaNewMenu .line.tiles .row .col .tile.list .menusubitems *:last-of-type {
    margin-bottom: 0;
  }
  .pwaNewMenu .line.tiles .row.collapse {
    display: none;
  }
  .pwaNewMenu .line.tiles .row.collapse.show {
    display: flex;
  }
  .pwaNewMenu .line.tiles.opHeight {
    height: 546px;
  }
  .pwaNewMenu .line.tiles.open {
    height: auto;
  }
  .pwaNewMenu .line.list {
    margin-top: 20px;
  }
  .pwaNewMenu .line.list .list-item {
    box-sizing: border-box;
    padding: 10px 0;
    border-bottom: 1px solid #E1E1E1;
  }
  .pwaNewMenu .line.list .list-item a {
    display: flex;
    align-items: center;
    color: #575757;
    font-size: 14px;
    font-weight: 700;
  }
  .pwaNewMenu .line.list .list-item a i {
    display: inline-flex;
    margin-right: 10px;
    color: #9b2621;
  }
  .pwaNewMenu .line.list .list-item:first-of-type {
    border-top: 1px solid #E1E1E1;
  }
  .pwaNewMenu .moreTiles {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 33px;
    background: #E5E6EB;
    border-radius: 5px;
  }
  .pwaNewMenu .moreTiles span {
    color: #575757;
    font-size: 14px;
    font-weight: 700;
  }
  .pwaNewMenu .moreTiles span.noview {
    display: none;
  }
  .pwaNewMenu .moreTiles.active span.view {
    display: none;
  }
  .pwaNewMenu .moreTiles.active span.noview {
    display: inline;
  }
  .pwaRightMenu {
    top: 103px;
    box-sizing: border-box;
    padding: 20px;
    z-index: 102;
    border-top: 1px solid #E1E1E1;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #e1e1e1;
    overflow: auto;
  }
  .pwaRightMenu.open {
    display: block;
    opacity: 1;
    transform: scaleX(1);
  }
  .pwaRightMenu .title {
    border-bottom: 1px solid #E1E1E1;
    padding-bottom: 10px;
  }
  .pwaRightMenu .title .col {
    display: flex;
    align-items: center;
  }
  .pwaRightMenu .title .col a {
    color: #000;
    text-decoration: none;
  }
  .pwaRightMenu .title .col a i {
    display: inline-flex;
    margin-right: 10px;
    color: #000;
  }
  .pwaRightMenu .title .col h3 {
    font-size: 14px;
    font-weight: 700;
    color: #575757;
    margin-top: 0;
    margin-bottom: 6px;
  }
  .pwaRightMenu .menuProfile {
    height: 33px;
  }
  .pwaRightMenu .menuProfile .profileEdit {
    float: unset;
    padding: 2px 0;
  }
  .pwaRightMenu .menuProfile .profileEdit a {
    font-size: 14px !important;
    font-weight: 700;
    color: #575757 !important;
  }
  .pwaRightMenu .menuProfile .profileEdit a i {
    color: #9b2621 !important;
    margin-right: 11px !important;
    margin-left: 4px;
  }
  .pwaRightMenu .menuProfile .profileEdit a i:before {
    font-size: 22px !important;
  }
  .pwaRightMenu ul {
    padding: 0;
    border-top: 0;
  }
  .pwaRightMenu ul li {
    border-top: 1px solid #E1E1E1;
  }
  .pwaRightMenu ul li .buttonlink {
    display: flex;
    align-items: center;
    padding: 6px 14px !important;
    font-size: 14px !important;
    font-weight: 700;
    color: #575757 !important;
  }
  .pwaRightMenu ul li .buttonlink i {
    color: #9b2621 !important;
    display: inline-flex;
    align-self: center;
  }
  .pwaRightMenu ul li .buttonlink i.pwaShow {
    display: inline-flex;
  }
  .pwaRightMenu ul li .buttonlink i:before {
    font-size: 22px !important;
  }
  .pwaRightMenu ul li .buttonlink.accordion {
    position: relative;
    display: flex;
    width: 100%;
  }
  .pwaRightMenu ul li .buttonlink.accordion .arr {
    position: absolute;
    top: 0;
    right: 10px;
    bottom: 0;
    margin: auto;
    height: 14px;
    color: #707070 !important;
  }
  .pwaRightMenu ul li .buttonlink.accordion .arr:before {
    font-size: 30px !important;
  }
  .pwaRightMenu ul li .buttonlink.accordion.open .arr {
    transform: rotate(180deg);
  }
  .pwaRightMenu ul li.collapse {
    display: none;
    background: #F1F2F6;
  }
  .pwaRightMenu ul li.collapse.show {
    display: list-item;
  }
  .pwaRightMenu ul li.collapse .rowss {
    display: block;
    width: 100%;
  }
  .pwaRightMenu ul li.collapse .rowss ul li {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    border-top: 0;
  }
  .pwaRightMenu ul li.collapse .rowss ul li .buttonlink {
    font-weight: 400;
  }
  .pwaRightMenu ul li.collapse .rowss ul li .buttonlink i {
    color: #575757 !important;
  }
  .pwaRightMenu ul li.collapse .rowss ul li .custom-switch {
    margin-top: 0;
  }
  .searchGender {
    display: flex;
    justify-content: center;
  }
  .topGen {
    justify-content: center;
  }
  #filterBody .mb-0 .text-center .btn {
    margin-top: 0 !important;
  }
  .Pwarow {
    flex-wrap: nowrap;
  }
  #memberSearchForm .btn-secondary.active,
  #eventSearchForm .btn-secondary.active,
  .eventSearch .btn-secondary.active {
    background-color: #9b2621;
  }
  #memberSearchForm .btn-secondary.btn-icon,
  #eventSearchForm .btn-secondary.btn-icon,
  .eventSearch .btn-secondary.btn-icon {
    padding: 5px 3px;
  }
  .pwaFxnew {
    display: flex;
  }
  .pwaFxnew .sortField {
    flex-wrap: nowrap;
  }
  .pwaFxnew .sortField .col-3 {
    min-width: 70px;
  }
  .card {
    box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
  }
  .card .card-header {
    background: #fff;
    box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
  }
  .card .card-header .cardCollapse {
    width: 140px;
    display: flex;
    align-items: center;
    border: 1px solid #9b2621;
    justify-content: center;
    border-radius: 5px;
    margin: 0 0 0 0;
  }
  .card .card-header .cardCollapse i {
    display: inline-flex;
    align-items: center;
  }
  .card .card-header.pwaShow {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
  }
  .card .card-header.pwaShow h2 {
    margin-bottom: 0;
  }
  .card .card-body {
    padding: 15px 5px;
  }
  .card .card-body .form-group .px-1 .sliderContainer .sliderMin {
    width: 14px;
  }
  .card .card-body #multiForm .form-group .col-form-label {
    padding-left: 0;
  }
  #filterButtNew span {
    font-size: 14px;
  }
  #filterButtNew .text2 {
    display: none;
  }
  #filterButtNew img {
    display: inline-block;
    margin-left: 10px;
    transform: rotate(180deg);
  }
  #filterButtNew.open .text1 {
    display: none;
  }
  #filterButtNew.open .text2 {
    display: inline-block;
  }
  #filterButtNew.open img {
    transform: rotate(0deg);
    filter: brightness(10);
  }
  #multiForm .form-group.pwaShow {
    width: 50%;
  }
  #multiForm .form-group.pwaShow > div {
    width: 100%;
    max-width: 100%;
  }
  #multiForm .form-group.pwaShow .btn-secondary {
    min-height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #multiForm .form-group.pwaShow .btn-secondary img {
    display: inline-flex;
    margin-left: 10px;
  }
  #multiForm .form-group.pwaShow .btn-secondary.active {
    background-color: #fff;
  }
  #multiForm .form-group.pwaShow .btn-secondary.active img {
    transform: rotate(0deg);
  }
  .headerActionPwa h2 {
    font-weight: 700;
    font-size: 14px;
    line-height: 19px;
    color: #575757;
  }
  .headerActionPwa .addButton .btn-secondary {
    height: 30px;
    padding: 0 0.5rem;
    color: #9b2621 !important;
    display: flex;
    align-items: center;
    font-size: 11px;
  }
  .headerActionPwa .addButton .btn-secondary i {
    display: inline-flex;
    color: #9b2621;
    margin-left: 5px;
    font-size: 12px;
  }
  .headerActionPwa .addButton .btn-secondary i:before {
    top: 0;
  }
  .eventBody .form-group {
    margin-bottom: 20px;
  }
  .eventBody .form-group.top-filter {
    justify-content: center;
  }
  .select-width {
    max-width: 200px;
  }
  .eventslist.list .event.pwaShow {
    display: flex !important;
    flex-direction: column;
    margin: auto;
    margin-bottom: 30px;
    border-radius: 5px;
    box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
    overflow: visible;
  }
  .eventslist.list .event.pwaShow .eventImg {
    width: 100%;
    height: 198px;
  }
  .eventslist.list .event.pwaShow .eventImg img {
    height: 100%;
    max-height: 198px;
  }
  .eventslist.list .event.pwaShow .eventInfo {
    width: 100%;
    box-sizing: border-box;
    padding: 0 15px;
    margin-top: 15px;
  }
  .eventslist.list .event.pwaShow .eventInfo .row {
    max-width: 399px;
    margin: auto;
  }
  .eventslist.list .event.pwaShow .eventInfo .row .col-6 {
    padding: 0;
  }
  .eventslist.list .event.pwaShow .eventInfo .row .col-6:last-of-type {
    padding-left: 30px;
  }
  .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventDate {
    font-weight: 400;
    font-size: 14px;
    line-height: 19px;
    color: #575757;
    margin-top: 0;
    margin-bottom: 10px;
  }
  .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventName > a {
    display: inline-block;
    font-weight: 700;
    font-size: 14px;
    line-height: 19px;
    color: #9B2621;
    margin-top: 0;
    margin-bottom: 10px;
  }
  .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventDetail .eventClub a {
    display: block;
    font-weight: 400;
    font-size: 14px;
    line-height: 19px;
    color: #9B2621;
    margin-top: 0;
  }
  .eventslist.list .event.pwaShow .eventInfo .row .col-6 label {
    font-weight: 400;
    font-size: 14px;
    line-height: 19px;
    color: #575757;
  }
  .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventAttending {
    width: 100%;
    display: flex;
    float: unset;
    margin-top: 10px;
  }
  .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventAttending .att {
    display: flex;
    flex-direction: column;
    margin-right: 20px;
  }
  .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventAttending .att .genderIcon {
    float: unset;
  }
  .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventAttending .att .count {
    text-align: center;
    width: 24px;
    margin-top: 5px;
    float: unset;
  }
  .eventslist.list .event.pwaShow .eventInfo .row .col-6 .eventAttending .att:last-of-type {
    margin-right: 0;
  }
  .eventslist.list .event.pwaShow .eventDownButton {
    display: flex;
    align-items: center;
    padding: 15px;
    box-sizing: border-box;
    width: 100%;
    max-width: 500px;
    margin: auto;
  }
  .eventslist.list .event.pwaShow .eventDownButton a.new-button {
    font-weight: 400;
    font-size: 12px;
    line-height: 17px;
    color: #000;
    background-color: #DBDBDB;
    box-sizing: border-box;
    padding: 0 10px;
    width: 100%;
    max-width: 150px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    margin-right: 12px;
  }
  .eventslist.list .event.pwaShow .eventDownButton a.new-button i {
    display: inline-flex;
    margin-left: 10px;
    font-size: 16px;
  }
  .eventslist.list .event.pwaShow .eventDownButton a.new-button:hover {
    text-decoration: none;
    background-color: #9B2621;
    color: #fff;
  }
  .eventslist.list .event.pwaShow .eventDownButton a.new-button-small {
    font-size: 16px;
    color: #000;
    background-color: #DBDBDB;
    box-sizing: border-box;
    padding: 0 15px;
    height: 30px;
    display: flex;
    align-items: center;
    border-radius: 5px;
  }
  .eventslist.list .event.pwaShow .eventDownButton a.new-button-small i {
    display: flex;
  }
  .eventslist.list .event.pwaShow .eventDownButton a.new-button-small:hover {
    text-decoration: none;
    background-color: #9B2621;
    color: #fff;
  }
  .top-filter .btn-secondary {
    height: 30px;
    display: inline-flex;
    align-items: center;
    padding: 0 0.75rem;
  }
  .top-filter .btn-secondary.active {
    color: #fff !important;
  }
  select,
  select.form-control {
    height: 30px;
    border: 1px solid #eee;
    box-shadow: 0 0 5px rgb(0 0 0%);
    max-width: 200px;
  }
  .addressInput input {
    max-width: 200px;
  }
  .Pwawidth > div {
    flex: unset;
    max-width: unset;
  }
  .fcenter {
    display: flex;
    justify-content: center;
  }
  .country label.checkSelect {
    position: relative;
    padding: 0;
    border: 0;
  }
  .country label.checkSelect > span {
    position: relative;
    box-sizing: border-box;
    padding: 8px 3px;
    background-color: #fff;
    box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
    z-index: 1;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #fff;
    border-radius: 10px;
  }
  .country label.checkSelect input[type="checkbox"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 2;
  }
  .country label.checkSelect input[type="checkbox"]:checked + span {
    border: 1px solid #9b2621;
  }
  .eventProfileButtons button.btnGreen {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    background: #0DD549 !important;
    width: 100% !important;
    border-radius: 5px;
    color: #fff !important;
  }
  .eventProfileButtons button.btnGreen i {
    display: inline-flex;
    margin-right: 10px;
  }
  .eventProfileButtons button.btnYellow {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    background: #F9AF03 !important;
    width: 100% !important;
    border-radius: 5px;
    color: #fff !important;
  }
  .eventProfileButtons button.btnYellow i {
    display: inline-flex;
    margin-right: 10px;
  }
  .eventProfileButtons button.btnRed {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    background: #E24343 !important;
    width: 100% !important;
    border-radius: 5px;
    color: #fff !important;
  }
  .eventProfileButtons button.btnRed i {
    display: inline-flex;
    margin-right: 10px;
  }
  .eventProfileButtons button.btnGrey {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    background: #DBDBDB !important;
    width: 100% !important;
    border-radius: 5px;
    color: #000 !important;
    border: 1px solid #ddd !important;
  }
  .eventProfileButtons button.btnGrey i {
    display: inline-flex;
    margin-right: 10px;
  }
  .eventProfileButtons .actionsButton {
    width: 100%;
  }
  .eventProfileButtons.two {
    margin-top: 17px;
  }
  .memberProfileButtons.pwaShow {
    display: block !important;
    min-height: 120px;
  }
  .newAccordionTitle {
    position: relative;
    width: 100%;
    height: 30px;
    font-size: 14px;
    line-height: 19px;
    color: #575757;
    box-sizing: border-box;
    padding: 0 18px;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.16);
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
  }
  .newAccordionTitle img {
    max-height: 10px;
  }
  .newAccordionContent {
    color: #575757;
    box-sizing: border-box;
    padding: 18px;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.16);
    margin-bottom: 15px;
  }
  .newAccordionContent .contop .memberProfileInfo .row {
    margin-bottom: 11px;
  }
  .newAccordionContent .contop .memberProfileInfo .row .rowlabel {
    font-weight: 700;
    font-size: 14px;
    line-height: 19px;
    color: #575757;
    min-width: 100px;
  }
  .newAccordionContent .contop .memberProfileInfo .row .row-value {
    font-weight: 400;
    font-size: 14px;
    line-height: 19px;
    color: #575757;
  }
  .newAccordionContent .contop .memberProfileInfo .eventAttending {
    display: flex;
    align-items: center;
    margin-bottom: 11px;
    margin-right: -4px;
    margin-left: -4px;
  }
  .newAccordionContent .contop .memberProfileInfo .eventAttending .attHeader {
    font-weight: 700;
    font-size: 14px;
    line-height: 19px;
    color: #575757;
    min-width: 100px;
  }
  .newAccordionContent .contop .memberProfileInfo .eventAttending .attBody {
    display: flex;
  }
  .newAccordionContent .contop .memberProfileInfo .eventAttending .attBody .att .genderIcon {
    display: none;
  }
  .newAccordionContent .contop .memberProfileInfo .eventAttending .attBody .att .count {
    width: 30px;
  }
  .filterFotoHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .filterFotoHeader h2 {
    font-weight: 700;
    font-size: 14px;
    line-height: 19px;
    color: #575757;
    margin-top: 0;
    margin-bottom: 0;
  }
  .filterFotoHeader .addButton {
    float: unset !important;
    margin: 0 !important;
    box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.16);
  }
  .filterFotoHeader .addButton .btn {
    background-color: #fff;
    color: #9b2621;
    padding: 0 0.75rem;
    height: 30px;
    display: flex;
    align-items: center;
  }
  .switchRow {
    display: flex;
    justify-content: center;
    margin-bottom: 20px;
    margin-top: 20px;
  }
  .switchRow .switchRowContent {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #9B2621;
    border-radius: 5px;
    box-sizing: border-box;
    padding: 5px 0;
    background: #fff;
  }
  .switchRow .switchRowContent.active {
    background-color: #9B2621;
  }
  .switchRow .switchRowContent.active a {
    color: white;
  }
  .switchRow .switchRowContent a {
    font-weight: 400;
    font-size: 14px;
    line-height: 19px;
    color: #646464;
    box-sizing: border-box;
    padding: 0 14px;
  }
  #filterFoto,
  #filterVideo {
    background-color: #fff;
    margin-top: 5px;
    margin-bottom: 10px;
    box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
  }
  #filterFoto .newRow,
  #filterVideo .newRow {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
  }
  #filterFoto .newRow .col-form-label,
  #filterVideo .newRow .col-form-label {
    display: inline-flex;
    max-width: 85px;
  }
  #filterFoto .newRow .searchGender,
  #filterVideo .newRow .searchGender {
    justify-content: flex-start;
  }
  #filterFoto .newRow2,
  #filterVideo .newRow2 {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    margin-bottom: 20px;
  }
  #filterFoto .newRow2 .row,
  #filterVideo .newRow2 .row {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    max-width: 50% !important;
  }
  #filterFoto .newRow2 .row label,
  #filterVideo .newRow2 .row label {
    padding: 0 10px;
  }
  #filterFoto .newRow2 .row .col-sm-4,
  #filterVideo .newRow2 .row .col-sm-4 {
    padding: 0;
  }
  #filterFoto .newFilterAlbum,
  #filterVideo .newFilterAlbum {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  #filterFoto .newFilterAlbum .row .btn-group .btn,
  #filterVideo .newFilterAlbum .row .btn-group .btn {
    box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.16);
    border-color: #fff;
    color: #AFAFAF;
    font-size: 14px;
    line-height: 19px;
    border-radius: 5px;
    margin-right: 5px;
    padding: 5px;
    margin-bottom: 5px;
  }
  #filterFoto .newFilterAlbum .row .btn-group .btn.active,
  #filterVideo .newFilterAlbum .row .btn-group .btn.active {
    color: #fff;
  }
  .privacy form .card .card-body .row,
  .clubs form .card .card-body .row,
  .advertfil form .card .card-body .row,
  .datin form .card .card-body .row {
    display: flex;
    flex-wrap: nowrap;
  }
  .privacy form .card .card-body .row.ml-3,
  .clubs form .card .card-body .row.ml-3,
  .advertfil form .card .card-body .row.ml-3,
  .datin form .card .card-body .row.ml-3 {
    margin-left: 0 !important;
  }
  .privacy form .card .card-body .row .searchIcon label,
  .clubs form .card .card-body .row .searchIcon label,
  .advertfil form .card .card-body .row .searchIcon label,
  .datin form .card .card-body .row .searchIcon label {
    width: 32px;
    height: 32px;
    border: 1px solid #fff;
    border-radius: 6px;
    line-height: 32px;
    text-align: center;
    padding: 3px;
    cursor: pointer;
    margin-right: 16px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .privacy form .card .card-body .row .searchIcon label .datingSexIcon,
  .clubs form .card .card-body .row .searchIcon label .datingSexIcon,
  .advertfil form .card .card-body .row .searchIcon label .datingSexIcon,
  .datin form .card .card-body .row .searchIcon label .datingSexIcon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
  }
  .privacy form .card .card-body .row .searchIcon label .datingSexIcon i.i,
  .clubs form .card .card-body .row .searchIcon label .datingSexIcon i.i,
  .advertfil form .card .card-body .row .searchIcon label .datingSexIcon i.i,
  .datin form .card .card-body .row .searchIcon label .datingSexIcon i.i {
    height: 20px;
    width: 20px;
    line-height: 20px;
  }
  .privacy form .card .card-body .row .searchIcon label .datingSexIcon i.i:before,
  .clubs form .card .card-body .row .searchIcon label .datingSexIcon i.i:before,
  .advertfil form .card .card-body .row .searchIcon label .datingSexIcon i.i:before,
  .datin form .card .card-body .row .searchIcon label .datingSexIcon i.i:before {
    height: 20px;
    width: 20px;
    line-height: 20px;
    font-size: 16px;
  }
  .privacy form .card .card-body .row50,
  .clubs form .card .card-body .row50,
  .advertfil form .card .card-body .row50,
  .datin form .card .card-body .row50 {
    width: 50%;
  }
  .parties form .card .card-body .row {
    flex-wrap: nowrap;
  }
  .parties form .card .card-body .row .slider {
    width: 50%;
  }
  .parties form .card .card-body .row .labelHide {
    display: none;
  }
  .parties form .card .card-body .row .btn-group .btn {
    box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.16);
    border-color: #fff;
    color: #AFAFAF;
    font-size: 14px;
    line-height: 19px;
    border-radius: 5px;
    margin-right: 5px;
    padding: 5px;
    margin-bottom: 5px;
  }
  .parties form .card .card-body .row .btn-group .btn.active {
    color: #fff !important;
  }
  .label2 {
    max-width: 26%;
  }
  .country-label {
    max-width: 67px;
  }
  .addressInput input {
    padding-left: 20px;
  }
}
@media all and (display-mode: standalone) and (max-width: 768px) {
  .container .sidebar {
    top: 103px;
    z-index: 1000;
    position: fixed;
  }
  .container .sidebar.right {
    display: none;
    left: unset;
    transform-origin: right;
    right: 0;
    z-index: unset;
    transform: scaleX(1);
    max-width: 180px;
    top: 53px;
    height: unset;
    box-shadow: none;
    padding-left: unset;
    padding-right: 5px;
  }
  .container .lmenu {
    max-height: calc(100vh - 103px);
  }
  .container .lmenu.sticky-top {
    position: relative;
    top: 0;
  }
  .container .lmenu .sideHeader {
    display: block;
  }
  .container.tabletfull > .row > .col-md-8 {
    width: 100%;
  }
  .container.tabletfull .sidebar.right {
    transform: scaleX(0);
  }
}
@media all and (display-mode: standalone) and (max-width: 760px) {
  .container .sidebar {
    top: 103px;
    z-index: 1000;
    position: fixed;
  }
  .container .sidebar.right {
    display: none;
    left: unset;
    transform-origin: right;
    right: 0;
    z-index: 20;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  }
  .container .sidebar.right:not(.show) {
    transform: scaleX(0);
  }
}
@media all and (display-mode: standalone) and (min-width: 770px) {
  .container {
    width: 100%;
    max-width: 100%;
  }
  .container > .row > .col-md-8 {
    width: 100%;
    max-width: 100%;
  }
  .container .sidebar {
    top: 103px;
    z-index: 1000;
    position: fixed;
  }
  .container .sidebar:not(.show) {
    transform: scaleX(0);
  }
  .container .sidebar.right {
    display: none;
    left: unset;
    transform-origin: right;
    right: 0;
    z-index: 20;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  }
  .container .sidebar.right:not(.show) {
    transform: scaleX(0);
  }
}
.colFx {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.rotate-180 {
  transform: rotate(180deg);
}
.fx {
  display: flex;
}
.fxc {
  justify-content: center;
}
.contentTopPwa {
  display: flex;
}
.contentTopPwa .popupTopSearchPopup {
  position: relative !important;
  top: 0 !important;
  right: 0 !important;
  width: 40px;
  margin-left: 10px;
}
.contentTopPwa .popupTopSearchPopup .navbar-icon {
  position: relative !important;
}