a,
body,
button,
div,
h1,
h2,
html,
img,
p,
span,
strong {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline
}

body{
    background-color: #a8a8a8;
}
main {
    display: block
}

:focus {
    outline: 0
}

img {
    border: 0
}

strong {
    font-style: normal;
    font-weight: 400
}

h1,
h2 {
    font-size: 100%;
    font-weight: 400
}

.mfp-hide {
    display: none !important
}

button::-moz-focus-inner {
    padding: 0;
    border: 0
}

*,
:after,
:before {
    box-sizing: border-box
}

html {
    font: 600 14px/1.3 'Open Sans', sans-serif;
    -webkit-text-size-adjust: none
}

@media (min-width:768px) {
    html {
        font-size: 16px
    }
}

@media (min-width:1200px) {
    html {
        font-size: 18px
    }
}

.js-play-btn,
button {
    cursor: pointer
}

button {
    -webkit-appearance: none
}

a {
    text-decoration: none
}

.inner {
    max-width: 106.6em;
    margin: 0 auto;
    padding: 0 1.25em
}

@media (max-width:767px) {
    .inner.cams-ctn,
    .video-steps .inner {
        max-width: 31em
    }
}

@media (min-width:768px) {
    .inner {
        padding: 0 3.2em
    }
}

@media (min-width:1200px) {
    .inner {
        padding: 0 4.3em
    }
}

.main-title {
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    text-shadow: 0 0 .4em rgba(0, 0, 0, .4);
    line-height: 1.2
}

.main-title,
.main-title strong {
    font-weight: 800
}

.main-title strong {
    text-shadow: none;
    box-shadow: 0 0 .4em rgba(0, 0, 0, .4);
    border-radius: .2em;
    padding: 0 .1em;
    line-height: 1;
    display: inline-block;
    background-color: #fff;
    color: #18ae02
}

.btn {
    background-color: #18ae02;
    color: #fff;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 1.2em;
    border-radius: 6px;
    transition: background-color .2s ease-in;
    display: block
}

.btn.join-btn {
    background-color: #ea8002
}

.btn.join-btn:hover,
.btn:hover {
    background-color: #021429
}

.icon {
    height: 1.3em;
    width: 1.3em;
    vertical-align: top
}

.logo {
    max-width: 17.5em;
    width: 70%
}

@media (min-width:992px) {
    .logo {
        max-width: 19.5em
    }
}

.logo img {
    vertical-align: top;
    width: 100%
}

.template-header {
    background-color: #a8a8a8;
    padding: 1.3em 0;
    border-bottom: 1px solid #e8e8e8
}

@media (min-width:768px) {
    .template-header {
        padding: 1em 0
    }
}

.template-header .inner {
    display: -webkit-flex;
    display: flex;
    align-items: center
}

@media (max-width:767px) {
    .template-header .inner {
        flex-wrap: wrap
    }
}

.template-header .logo {
    margin: -.4em auto 0 0
}

@media (max-width:767px) {
    .template-header .logo {
        margin-left: auto
    }
}

.template-header .btn-header {
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 1em
}

.template-header .btn-header:hover {
    background-color: #021429
}

@media (max-width:767px) {
    .template-header .btn-header {
        margin-top: 1.1em;
        width: 100%;
        flex: 1 0 auto;
        padding: .7em 0
    }
}

@media (min-width:768px) {
    .template-header .btn-header {
        padding: .8em 3em
    }
}

.template-header .btn-header .icon {
    fill: #fff;
    margin-right: .7em
}

.title {
    color: #021429;
    font-size: 1.45em;
    text-transform: uppercase;
    text-align: center;
    padding: 0 1em;
    margin: 1.2em .5em
}

@media (min-width:768px) {
    .title {
        font-size: 1.9em
    }
}

@media (min-width:1200px) {
    .title {
        font-size: 2.7em
    }
}

.title,
.title strong {
    font-weight: 800
}

.title strong {
    color:#23a80a
}

.template-footer {
    padding-top: 2em;
    padding-bottom: 2em
}

@media (max-width:767px) {
    .template-footer {
        text-align: center
    }
}

.template-footer a {
    color: #021429
}

.template-footer .copyright {
    font-size: 12px
}

@media (min-width:768px) {
    .template-footer .copyright-imgs {
        float: left
    }
}

@media (min-width:768px) and (max-width:1199px) {
    .template-footer .copyright-imgs {
        width: 40px
    }
}

@media (min-width:768px) {
    .template-footer .copyright-details {
        margin-left: 50px
    }
}

@media (min-width:1200px) {
    .template-footer .copyright-details {
        margin-left: 100px
    }
}

.template-footer .logo {
    margin: 0 auto 2em
}

@media (min-width:768px) {
    .template-footer .logo {
        margin-left: 1em;
        float: right
    }
}

.player-ctn {
    background: url(/static/bg-header.jpeg) center center no-repeat;
    background-size: cover;
    position: relative;
    overflow: hidden
}

.player-ctn .inner {
    position: relative;
    padding-top: 3em;
    padding-bottom: 1em
}

@media (min-width:992px) {
    .player-ctn .inner {
        padding-top: 1em
    }
}

.player-ctn:before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background-color: rgba(2, 20, 41, .76);
    opacity: 0;
    transition: opacity .2s ease-in
}

.video-outer {
    width: 100%;
    max-width: 64em;
    padding: 0;
    margin: 0 auto;
    position: relative;
    font-size: 1.7vw
}

@media (min-width:992px) {
    .video-outer {
        font-size: 1.3vw
    }
}

@media (min-width:1200px) {
    .video-outer {
        font-size: .9vw
    }
}

@media (min-width:1920px) {
    .video-outer {
        font-size: .95em
    }
}

.video-ctn {
    padding-top: 56.25%;
    position: relative
}

.video-start {
    font-size: 1.7vw;
    position: absolute;
    left: 1.25rem;
    right: 0;
    top: 0;
    bottom: 0
}

@media (min-width:768px) {
    .video-start {
        left: 3.2rem;
        right: 0
    }
}

@media (min-width:992px) {
    .video-start {
        font-size: 1vw
    }
}

@media (min-width:1200px) {
    .video-start {
        left: 4.3rem;
        right: 0
    }
}

@media (min-width:1920px) {
    .video-start {
        font-size: 1.06em
    }
}

.video-text-ctn {
    position: absolute;
    left: 0;
    width: 29.5em;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.video-title {
    color: #021429;
    text-transform: uppercase;
    text-align: left;
    font: 700 5.2em/1 Montserrat, 'Open Sans', sans-serif
}

.video-title strong {
    font-weight: 700;
    color: #18ae02;
    white-space: nowrap
}

.play-btn {
    color: #021429;
    background-color: #fff;
    display: inline-block;
    padding: .5em 1em;
    font: 700 2em/1.6em Montserrat, 'Open Sans', sans-serif;
    text-transform: uppercase;
    border-radius: .7em;
    box-shadow: 0 0 2em .5em rgba(0, 0, 0, .16);
    margin-top: 2em;
    transition: color .1s ease-in
}

.play-btn:hover {
    color: #ea8002
}

@media (min-width:992px) {
    .play-btn {
        font-size: 1.7em
    }
}

@media (min-width:1200px) {
    .play-btn {
        font-size: 1.3em
    }
}

.play-btn .icon {
    fill: #ea8002;
    width: 1.6em;
    height: 1.6em;
    margin-right: .9em
}

.img-ctn {
    position: absolute;
    bottom: 0;
    height: 95%;
    max-height: 616px
}

.img-ctn img {
    height: 100%;
    vertical-align: top
}

@media (max-width:991px) {
    .img-ctn {
        width: 11em;
        right: 8em
    }
    .img-ctn .img {
        vertical-align: bottom;
        position: absolute;
        height: 100%;
        opacity: 0
    }
    .img-ctn .img.img-1 {
        -webkit-animation: img-fade 20s infinite;
        animation: img-fade 20s infinite
    }
    .img-ctn .img.img-2 {
        -webkit-animation: img-fade 20s 5s infinite;
        animation: img-fade 20s 5s infinite
    }
    .img-ctn .img.img-3 {
        -webkit-animation: img-fade 20s 10s infinite;
        animation: img-fade 20s 10s infinite
    }
    .img-ctn .img.img-4 {
        -webkit-animation: img-fade 20s 15s infinite;
        animation: img-fade 20s 15s infinite
    }
}

@media (min-width:992px) {
    .img-ctn {
        right: 5em;
        display: -webkit-flex;
        display: flex;
        width: 0;
        opacity: 0;
        transform: translateX(13em);
        -webkit-animation: img-slide-in 2s .75s forwards;
        animation: img-slide-in 2s .75s forwards
    }
    .img-ctn .img {
        position: relative;
        width: 24%
    }
    .img-ctn .img-2 {
        transform: translateX(-2.2em)
    }
    .img-ctn .img-3 {
        transform: translateX(2em)
    }
}

@keyframes img-slide-in {
    0% {
        opacity: 0;
        width: 0;
        transform: translateX(13em)
    }
    80% {
        opacity: 1
    }
    100% {
        opacity: 1;
        width: 54em;
        transform: translateX(0)
    }
}

@-webkit-keyframes img-slide-in {
    0% {
        opacity: 0;
        width: 0;
        transform: translateX(13em)
    }
    80% {
        opacity: 1
    }
    100% {
        opacity: 1;
        width: 54em;
        transform: translateX(0)
    }
}

@keyframes img-fade {
    0%,
    100%,
    30% {
        opacity: 0
    }
    10%,
    20% {
        opacity: 1
    }
}

@-webkit-keyframes img-fade {
    0%,
    100%,
    30% {
        opacity: 0
    }
    10%,
    20% {
        opacity: 1
    }
}

.video-steps {
    background-color: #5a5a59;
    padding: 1em 0;
    font-size: .9em
}

@media (min-width:768px) {
    .video-steps {
        font-size: 1em;
        padding: 1.7em 0
    }
}

@media (min-width:992px) {
    .video-steps {
        font-size: 1.75vw
    }
}

@media (min-width:1200px) {
    .video-steps {
        font-size: 1vw
    }
}

@media (min-width:1920px) {
    .video-steps {
        font-size: 1em
    }
}

.video-steps .inner {
    counter-reset: vsteps
}

@media (min-width:768px) {
    .video-steps .inner {
        display: -webkit-flex;
        display: flex;
        justify-content: space-between
    }
}

.video-steps p,
.video-steps p strong {
    font-weight: 800
}


@media (min-width:1200px) {
    .video-steps p {
        font-size: 1.4em
    }
}

.video-steps p {
    color: #fff
}
.video-steps p strong {
    font-size: 1.1em;
    color: #18ae02;
}

.rating {
    margin: auto
}

.rating,
.rating div {
    background: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iMjAwIiBoZWlnaHQ9IjE3MyIgdmlld0JveD0iMCAwIDIwMCAxNzMiIGlkPSJzdGFyIj48c3R5bGU+cG9seWdvbntmaWxsOiNjM2MzYzM7fTwvc3R5bGU+PHBvbHlnb24gcG9pbnRzPSIxMDAsMCAxMjguMSw1Ni45IDE5MSw2Ni4xIDE0NS41LDExMC40IDE1Ni4yLDE3MyAxMDAsMTQzLjQgNDMuOCwxNzMgNTQuNSwxMTAuNCA5LDY2LjEgNzEuOSw1Ni45Ii8+PC9zdmc+) left center repeat-x;
    height: 1.55em;
    background-size: 1.5em 1.5em;
    width: 7.5em
}

.rating div {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iMjAwIiBoZWlnaHQ9IjE3MyIgdmlld0JveD0iMCAwIDIwMCAxNzMiIGlkPSJzdGFyIj48c3R5bGU+cG9seWdvbntmaWxsOiMxOGFlMDI7fTwvc3R5bGU+PHBvbHlnb24gcG9pbnRzPSIxMDAsMCAxMjguMSw1Ni45IDE5MSw2Ni4xIDE0NS41LDExMC40IDE1Ni4yLDE3MyAxMDAsMTQzLjQgNDMuOCwxNzMgNTQuNSwxMTAuNCA5LDY2LjEgNzEuOSw1Ni45Ii8+PC9zdmc+)
}

.description {
    font-size: .9em;
    overflow: hidden;
    position: relative;
    line-height: 1.5em;
    max-height: 6em;
    margin-right: 0;
    padding-right: 1.2em;
    text-align: left;
    font-weight: 400
}

.description:before {
    content: '...';
    position: absolute;
    right: 0;
    bottom: 0;
    width: 1.2em;
    text-align: right;
    background-image: -webkit-linear-gradient(left, transparent 0, #fff 50%);
    background-image: linear-gradient(to right, transparent 0, #fff 50%)
}

.description:after {
    content: '';
    position: absolute;
    right: 0;
    width: 1em;
    height: 1em;
    margin-top: .2em;
    background: #fff
}

@media (max-width:991px) {
    .cams-ctn .title {
        margin: 1.2em .5em .5em
    }
}

@media (min-width:768px) {
    .cams-ctn .content {
        display: -webkit-flex;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .cams-ctn .content .card {
        padding: 0 1em 1em
    }
}

@media (min-width:768px) and (max-width:991px) {
    .cams-ctn .content .card {
        width: 48%;
        margin-top: 1.3em
    }
}

@media (min-width:992px) {
    .cams-ctn .content .card {
        width: 24%;
        margin-top: 1.3em
    }
}

@media (max-width:767px) {
    .cams-ctn {
        padding: 0
    }
    .cams-ctn .card {
        margin: 1em 1.25em
    }
}

.card {
    padding: .5em;
    background-color: #fff;
    border-radius: 1em;
    box-shadow: 0 0 1.5em rgba(0, 0, 0, .2);
    background-color: #343434;
}

.card img {
    margin: 0 auto;
    display: block;
    width: 100%;
    vertical-align: top;
    border-radius: 1em;
}

.card .name {
    font-size: 1.1em;
    margin: .8em 0;
    font-weight: 700;
    text-align: center;
    display: block;
    text-transform: uppercase;
    color: #fff;
}

.card .btn {
    width: 100%;
    display: block;
    padding: .5em 0;
    border-radius: 1em;
}

.card .description {
    margin-bottom: 2.4em
}

.card-header {
    padding: 1em 0;
    font-size: .9em;
    display: -webkit-flex;
    display: flex;
    align-items: center
}

.card-header .private {
    margin-left: 1em
}

.card-header .users {
    margin-right: auto
}

.info {
    min-height: 1.2em;
    text-transform: uppercase;
    background: left center no-repeat;
    background-size: 1.2em;
    padding-left: 1.5em
}

.info.private {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iMjAwIiBoZWlnaHQ9IjE3MyIgdmlld0JveD0iMCAwIDIwMCAxNzMiIGlkPSJzdGFyIj48c3R5bGU+cG9seWdvbntmaWxsOiMwMjE0Mjk7fTwvc3R5bGU+PHBvbHlnb24gcG9pbnRzPSIxMDAsMCAxMjguMSw1Ni45IDE5MSw2Ni4xIDE0NS41LDExMC40IDE1Ni4yLDE3MyAxMDAsMTQzLjQgNDMuOCwxNzMgNTQuNSwxMTAuNCA5LDY2LjEgNzEuOSw1Ni45Ii8+PC9zdmc+);
    margin-left: 1em
}

.info.users {
    padding-left: 2.3em;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iMjAwIiBoZWlnaHQ9IjExMiIgdmlld0JveD0iMCAwIDIwMCAxMTIiIGlkPSJ1c2VycyI+PHN0eWxlPnBhdGh7ZmlsbDojZDkzOTMzO308L3N0eWxlPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0xMDAsMEMzNC40LDAsMCw0OC4zLDAsNTZjMCw3LjcsMzQuNCw1NiwxMDAsNTZjNjUuNiwwLDEwMC00OC4zLDEwMC01NkMyMDAsNDguMywxNjUuNiwwLDEwMCwweiBNMTAwLDk5LjEgYy0yNC41LDAtNDQuNC0xOS4zLTQ0LjQtNDMuMVM3NS41LDEyLjksMTAwLDEyLjlzNDQuNCwxOS4zLDQ0LjQsNDMuMVMxMjQuNSw5OS4xLDEwMCw5OS4xeiBNMTIyLjIsNTZjMCwxMS45LTEwLDIxLjUtMjIuMiwyMS41IGMtMTIuMywwLTIyLjItOS42LTIyLjItMjEuNXM5LjktMjEuNSwyMi4yLTIxLjVjNi42LDAtNC4xLDE3LjEsMCwyMS41QzEwMy41LDU5LjgsMTIyLjIsNTAuNSwxMjIuMiw1NnoiLz48L3N2Zz4=);
    background-size: 1.7em 1.2em;
    color: #d93933
}

.status {
    position: relative;
    padding-left: 1.2em
}

.status:before {
    content: '';
    border-radius: 100%;
    background-color: #18ae02;
    height: .8em;
    width: .8em;
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.featured-ctn {
    text-align: center;
    margin-top: 2em
}

@media (max-width:767px) {
    .featured-ctn {
        padding: 0
    }
}

@media (min-width:768px) {
    .featured-ctn {
        margin-top: 4em
    }
}

.featured-ctn,
.featured-ctn .text-ctn {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover
}

@media (max-width:767px) {
    .featured-ctn .text-ctn {
        margin: 0 -1.25em;
        padding-top: 72%;
        position: relative
    }
    .featured-ctn .text-ctn .main-title {
        position: absolute;
        top: 50%;
        left: 10%;
        width: 80%;
        margin: auto;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        max-width: 28em;
        font-size: 7vw
    }
}

@media (min-width:1200px) {
    .featured-ctn .text-ctn {
        order: 2;
        text-align: left
    }
}

.featured-ctn .text-ctn .btn {
    display: table
}

@media (min-width:1200px) {
    .featured-ctn .text-ctn .btn {
        margin-top: 1em
    }
}

@media (max-width:1199px) {
    .featured-ctn .text-ctn .btn {
        display: none
    }
}

.featured-ctn .main-title {
    font-size: 2.1em
}

@media (min-width:768px) {
    .featured-ctn .main-title {
        font-size: 2.8em
    }
}

@media (min-width:1200px) {
    .featured-ctn .main-title {
        font-size: 4em;
        text-align: left
    }
}

@media (min-width:768px) {
    .featured-ctn .inner {
        padding-top: 2.5em;
        padding-bottom: 2.5em
    }
}

@media (min-width:1200px) {
    .featured-ctn .inner {
        padding-top: 3.8em;
        padding-bottom: 3.8em;
        display: -webkit-flex;
        display: flex;
        align-items: center
    }
}

@media (min-width:1200px) and (max-width:1920px) {
    .featured-ctn .inner {
        font-size: .9vw
    }
}

.featured-ctn .card {
    margin: auto
}

@media (max-width:767px) {
    .featured-ctn .card {
        margin: 0 -1.25em;
        border-radius: 0
    }
}

@media (min-width:768px) {
    .featured-ctn .card {
        max-width: 28.6em
    }
}

@media (min-width:768px) and (max-width:1199px) {
    .featured-ctn .card {
        margin: 1.8em auto
    }
}

@media (min-width:1200px) {
    .featured-ctn .card {
        flex: 1 0 auto;
        margin-right: 9.3em
    }
}

@media (min-width:1200px) {
    .featured-ctn .card .card-header {
        margin-bottom: .5em;
        padding: 1.8em 0
    }
}

@media (min-width:1200px) {
    .featured-ctn .card .name {
        margin: .6em 0;
        font-size: 1.3em
    }
}

.featured-ctn .card .rating {
    margin-bottom: 1em
}

.featured-ctn .card img {
    border-radius: 100%;
    max-width: 200px;
    width: 9em
}

@media (min-width:1200px) {
    .featured-ctn .card img {
        width: 11em
    }
}

.featured-ctn .card .tip {
    line-height: 1.1;
    padding-left: 5em;
    position: relative
}

@media (max-width:767px) {
    .featured-ctn .card .tip {
        display: -webkit-flex;
        display: flex;
        min-height: 5em;
        align-items: center
    }
}

.featured-ctn .card .tip .icon-ctn {
    padding: .7em;
    border-radius: 100%;
    box-shadow: 0 0 1em rgba(0, 0, 0, .3);
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.featured-ctn .card .tip .icon {
    height: 2em;
    width: 2em;
    fill: #18ae02
}

.featured-ctn .card .btn {
    flex: 1 0 auto;
    width: auto;
    margin-left: 1em;
    padding: .7em 1em;
    font-size: 1.4em
}

@media (max-width:767px) {
    .featured-ctn .card .btn {
        margin: 1em auto 0
    }
}

.featured-ctn .featured-info {
    font-weight: 800;
    text-transform: uppercase;
    text-align: left;
    font-size: .85em
}

@media (min-width:768px) {
    .featured-ctn .featured-info {
        display: -webkit-flex;
        display: flex;
        min-height: 5em;
        align-items: center
    }
}

.go-btn {
    line-height: 1.3em;
    padding: .7em 0;
    border-radius: 1em
}

.main-title+.go-btn {
    padding: .8em 1.5em;
    font-size: 1.5em
}

.go-btn .icon {
    height: 1.3em;
    width: 1.3em;
    fill: #fff;
    margin-left: .8em
}

.featured-ctn .card+.go-btn {
    margin: 1em auto 0;
    padding: .7em 2em
}

@media (max-width:767px) {
    .featured-ctn .card+.go-btn {
        width: 100%
    }
}

@media (min-width:1200px) {
    .featured-ctn .card+.go-btn {
        display: none
    }
}

.chat-viewer {
    background-color: #fff;
    max-width: 85.5em;
    margin: auto
}

@media (max-width:767px) {
    .chat-viewer {
        margin-top: 2.5em
    }
}

@media (min-width:768px) {
    .chat-viewer {
        font-size: 1.9vmin;
        overflow: hidden;
        border-radius: 1em;
        display: -webkit-flex;
        display: flex;
        flex-wrap: wrap
    }
}

.chat-viewer .chat-header {
    display: -webkit-flex;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #c3c3c3;
    width: 100%;
    padding-left: 1em;
    position: relative
}

@media (max-width:767px) {
    .chat-viewer .chat-header {
        padding: .5em 1em
    }
}

@media (min-width:768px) {
    .chat-viewer .chat-header {
        padding-left: 2em
    }
}

.chat-viewer .close {
    padding: 1.5em;
    font-weight: 800;
    margin-left: 1em
}

@media (max-width:767px) {
    .chat-viewer .close {
        padding: .5em 1em;
        position: absolute;
        bottom: 100%;
        right: 0;
        border-top-left-radius: 1em;
        border-bottom: 1px solid #c3c3c3
    }
}

@media (min-width:768px) {
    .chat-viewer .close {
        border-left: 1px solid #c3c3c3
    }
    #lbtn{
        margin-left: 7px;
    }
}

.chat-viewer .status {
    margin-left: auto
}

@keyframes crescendo {
    0% {
        transform: scale(.9);
    }
    100% {
        transform: scale(1.07);
    }
}

.all-niche-cams{
    display: flex;justify-content: center;margin-top: 1.3em;
    margin-bottom: 1em;
}

.cams-bg{
    background-color: #a8a8a8;
}

.live-label {
    background-color: #DB4A38;
    color: #fff;
    border-radius: 1em;
    font-size: 20px;
    padding-left: 5px;
    padding-right: 5px;
    font-weight: 700;
    position: absolute;
    margin-top: 7px;
    margin-left: 5px;
    animation: blinker 1.5s linear infinite;
}

@keyframes blinker {
    50% {
      opacity: .5;
    }
  }

  @media (max-width:1200px) {
    .main-menu{
        display: none;
    }
}

#lbtn{
        border: #e8f712 solid 4px;
        font-weight: bold;
}