awebkit-scrollbar {
    display: none;
}




html {
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
  background: #000000;
}

body {
  background: #000000;
  color: #ffffff;
  margin: 0;
  font-family: "Open Sans",sans-serif;
  font-weight: 300;
  font-size: 1em;
  -webkit-tap-highlight-color: transparent;

  -ms-overflow-style: none;  // IE 10+
  overflow: -moz-scrollbars-none;  // Firefox

-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */


}

.hidden {
    display: none;
}


.minimized {
  transition: transform .2s ease-out;
  transform: scale(.1);
}

.maximized {
  transition: transform .2s ease-out;
  transform: scale(1);
}


::-webkit-scrollbar {
  width: 0px;
  background: transparent;
}


button:focus {outline:0;}



/* vietnamese */
@font-face {
  font-family: 'Exo';
  font-style: normal;
  font-weight: 100;
  src: local('Exo Thin'), local('Exo-Thin'), url(https://fonts.gstatic.com/s/exo/v6/4UaMrEtFpBIaEE6u0Dfe5g.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Exo';
  font-style: normal;
  font-weight: 100;
  src: local('Exo Thin'), local('Exo-Thin'), url(https://fonts.gstatic.com/s/exo/v6/4UaMrEtFpBIaEE6v0Dfe5g.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Exo';
  font-style: normal;
  font-weight: 100;
  src: local('Exo Thin'), local('Exo-Thin'), url(https://fonts.gstatic.com/s/exo/v6/4UaMrEtFpBIaEE6h0Dc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Exo';
  font-style: normal;
  font-weight: 200;
  src: local('Exo ExtraLight'), local('Exo-ExtraLight'), url(https://fonts.gstatic.com/s/exo/v6/4UaDrEtFpBIavF-2-BLj36w.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Exo';
  font-style: normal;
  font-weight: 200;
  src: local('Exo ExtraLight'), local('Exo-ExtraLight'), url(https://fonts.gstatic.com/s/exo/v6/4UaDrEtFpBIavF-2-RLj36w.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Exo';
  font-style: normal;
  font-weight: 200;
  src: local('Exo ExtraLight'), local('Exo-ExtraLight'), url(https://fonts.gstatic.com/s/exo/v6/4UaDrEtFpBIavF-29xLj.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Exo';
  font-style: normal;
  font-weight: 400;
  src: local('Exo Regular'), local('Exo-Regular'), url(https://fonts.gstatic.com/s/exo/v6/4UaOrEtFpBISfH6jyDM.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Exo';
  font-style: normal;
  font-weight: 400;
  src: local('Exo Regular'), local('Exo-Regular'), url(https://fonts.gstatic.com/s/exo/v6/4UaOrEtFpBISfX6jyDM.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Exo';
  font-style: normal;
  font-weight: 400;
  src: local('Exo Regular'), local('Exo-Regular'), url(https://fonts.gstatic.com/s/exo/v6/4UaOrEtFpBISc36j.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


.vertical_middle {
  display: table-cell;
  vertical-align: middle;
}




#div_main {
  background: #000000;
  color: #ffffff;
  margin-right: auto;
  margin-left: auto;
  padding-left: 0px;
  padding-right: 0px;


}


#flash_test {
 display:none;

}


.video_fit_height {
height:100%; position: relative; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); -moz-transform: translateX(-50%); transform: translateX(-50%); touch-action: none;
}

.video_fit_width {
width:100%; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); touch-action: none;
}



#div_top {
  z-index:10000;
  background: #000000;
  color: #ffffff;
  width: 100%;
  margin-right: 0px;
  margin-left: 0px;
  padding-left: 0px;
  padding-right: 0px;
  min-height: 50px;
  max-height: 50px;
  position:fixed;
  top: 0px;
  left: 0px;
  background:rgba(0,0,0,0.75);
  //box-shadow: 0px 2px 3px 0px rgba(14,14,14,0.1);
  transition: all 0.5s;
  overflow: hidden;
}


.scrollUp {
  transform: translateY(-50px);
}





.top_left {
  display:block;
  height:100%;
  width: auto;
  color: #ffffff;
  //position: relative;
  margin-top: 2px;
  float: left;
}


.top_middle {
  display:block;
  height:100%;
  width: auto;
  color: #ffffff;
  position: relative;
  top: 2px;
  text-align: center;
  float: left;
}


.top_right {
  display:block;
  height:100%;
  width: auto;
  color: #ffffff;
  position: relative;
  top: 0px;
  float: right;
  overflow: hidden;

}

.logo{
  cursor:pointer;
  margin-left: 4px;

}

.logo_text {
  position: absolute;
  color: #ffffff;
  font-weight: 200;
  font-size: 0.75em;
  display: block;
  top: 31px;
  padding: 0;
  margin-left: 54px;
  cursor:default;
  opacity: 0.8;
}

.perfomers_nr {
  color: #de6fb5;
  font-weight: 400;
  cursor:default;
}






#div_middle {
  background: #212121;
  color: #ffffff;
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-left: 0px;
  padding-right: 0px;
  margin-top: 50px;
  overflow:hidden;
}




#div_bottom {
  background: #000000;
  color: #ffffff;
  opacity: 0.8;
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding: 10px;
  text-align: center;
  font-weight: 300;
  font-size: .8em;
}



.perfcard_subaccount {
  display: none;
  height:220px;
  position:relative;
  float: left;
  transition: background-image 1s ease-in-out;
  -webkit-transition: background-image 1s ease-in-out;
  -moz-transition: background-image 1s ease-in-out;
  -o-transition: background-image 1s ease-in-out;
}


.perfcard_subaccount_wrapper {
    position: relative;
    opacity: 0.7;
    left:1%;
    top:1.5%;
    width:98%;
    height:97%;
    border: 1px solid rgba(255,255,255,0.07);
    background: rgba(0,0,0,0.17);
    transition: all 0.2s;
}

.perfcard_subaccount_wrapper:hover {
    position: relative;
    border: 1px solid rgba(255,255,255,0.14);
    background: rgba(0,0,0,0.22);
    transition: all 0.2s;
}

.perfcard_subaccount_username {
    position: absolute;
    width:100%;
    top:26px;
    font-family: 'Exo', sans-serif;
    font-size: 1.5em;
    font-weight: 450;
    text-align: center;
}


.perfcard_subaccount_name {
    position: absolute;
    width:100%;
    top:65px;
    font-family: 'Exo', sans-serif;
    font-size: 1.3em;
    font-weight: 350;
    text-align: center;
}

.perfcard_subaccount_credit {
    position: absolute;
    width:100%;
    top:100px;
    font-family: 'Exo', sans-serif;
    font-size: 1.3em;
    font-weight: 350;
    text-align: center;
}

.perfcard_subaccount_buttons {
    position: absolute;
    width:100%;
    top:160px;
    text-align: center;
}

.perfcard_subaccount_add_1 {
    position: absolute;
    width:100%;
    top:40px;
    font-family: 'Exo', sans-serif;
    font-size: 0.9em;
    font-weight: 350;
    text-align: center;
}

.perfcard_subaccount_add_2 {
    position: absolute;
    width:100%;
    top:150px;
    font-family: 'Exo', sans-serif;
    font-size: 0.9em;
    font-weight: 350;
    text-align: center;
}



.perfcard_favorite {
  display: none;
  height:200px;
  position:relative;
  float: left;
  overflow: hidden;
  transition: background-image 1s ease-in-out;
  -webkit-transition: background-image 1s ease-in-out;
  -moz-transition: background-image 1s ease-in-out;
  -o-transition: background-image 1s ease-in-out;
}


.perfcard_alert {
  display: none;
  height:200px;
  position:relative;
  float: left;
  overflow: hidden;
  transition: background-image 1s ease-in-out;
  -webkit-transition: background-image 1s ease-in-out;
  -moz-transition: background-image 1s ease-in-out;
  -o-transition: background-image 1s ease-in-out;
}


.perfcard_banned {
  display: none;
  height:200px;
  position:relative;
  float: left;
  overflow: hidden;
  transition: background-image 1s ease-in-out;
  -webkit-transition: background-image 1s ease-in-out;
  -moz-transition: background-image 1s ease-in-out;
  -o-transition: background-image 1s ease-in-out;
}


.perfcard_lastvisited {
  display: none;
  height:200px;
  position:relative;
  float: left;
  overflow: hidden;
  transition: background-image 1s ease-in-out;
  -webkit-transition: background-image 1s ease-in-out;
  -moz-transition: background-image 1s ease-in-out;
  -o-transition: background-image 1s ease-in-out;
}

.perfcard_favorite_wrapper {
    position: relative;
    left:1%;
    top:1.5%;
    width:98%;
    height:97%;
    border: 1px solid rgba(255,255,255,0.07);
    background: rgba(0,0,0,0.17);
    transition: all 0.2s;
}

.perfcard_favorite_wrapper:hover {
    position: relative;
    border: 1px solid rgba(255,255,255,0.14);
    background: rgba(0,0,0,0.22);
    transition: all 0.2s;
}

.perfcard_favorite_bg0 {
    position: absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    opacity: 0.3;
    transition: all 0.2s;
}


.perfcard_favorite_bg1 {
    position: absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    opacity: 0.9;
    transition: all 0.2s;
}




.perfcard_favorite_username {
    position: absolute;
    width:100%;
    top:155px;
    font-family: 'Exo', sans-serif;
    font-size: 1.2em;
    font-weight: 350;
    text-align: center;
    opacity: 0.8;
}


.perfcard_favorite_info {
    position: absolute;
    width:100%;
    top:220px;
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 350;
    text-align: center;
    opacity: 0;
}

.perfcard_favorite_info2 {
    position: absolute;
    width:100%;
    top:260px;
    font-family: 'Exo', sans-serif;
    font-size: 1.3em;
    font-weight: 350;
    text-align: center;
    opacity: 0;
}

.button_perf_live0 {
    display:none;
}

.button_perf_live1 {
    display:inline-block;
}


.button_perf_message0 {
    display:inline-block;
}

.button_perf_message1 {
    display:none;
}

.button_perf_info0 {
    display:inline-block;
}

.button_perf_info1 {
    display:none;
}

.perfcard_favorite_buttons {
    position: absolute;
    width:100%;
    top:340px;
    text-align: center;
    opacity: 0;
}





.perfcard_banned_bg {
    position: absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    opacity: 0.4;
    transition: all 0.2s;
}

.perfcard_banned_bg:hover {
    position: absolute;
    opacity: 0.6;
    transition: all 0.2s;
}





.perfcard {
  display: none;
  position:relative;
  background: #000000;
  box-shadow: 0px -1px 0px rgba(255,255,255,0.1) inset, 0px 1px 0px rgba(255,255,255,0.1) inset, -1px 0px 0px rgba(255,255,255,0.1) inset, 1px 0px 0px rgba(255,255,255,0.1) inset;
  float: left;
  transition: background-image 1s ease-in-out;
  -webkit-transition: background-image 1s ease-in-out;
  -moz-transition: background-image 1s ease-in-out;
  -o-transition: background-image 1s ease-in-out;
}



.perfcard:after {
  position:relative;
  display: inline-block;
  padding-top: 56.25%;
  content: '';
}


.perfcard_performer_name {
  width:100%;
  text-align: center;
  line-height: 1em;
  margin: 0;
  position: absolute;
  bottom:0;
  padding-top: 0.3em;
  padding-bottom: 0.3em;
  background-color: #000000;
  background:rgba(0,0,0,0.3);
  transition: all 0.5s;

}


.perfcard_performer_name_text {
  background:rgba(255,255,255,0);
  font-size: 90%
  font-weight: 500;
  cursor:default;
}



.perfcard:hover {
  box-shadow: 0px 10px 20px rgba(12,12,12,0.3), 0px 6px 6px rgba(12,12,12,0.45), 0px -1px 0px rgba(255,255,255,0.4) inset, 0px 1px 0px rgba(255,255,255,0.4) inset, -1px 0px 0px rgba(255,255,255,0.4) inset, 1px 0px 0px rgba(255,255,255,0.4) inset;
  z-index: 50;
  overflow: hidden;
  -webkit-transition: all 140ms ease-in;
  -webkit-transform: scale(1.05);
  -ms-transition: all 140ms ease-in;
  -ms-transform: scale(1.05);
  -moz-transition: all 140ms ease-in;
  -moz-transform: scale(1.05);
  transition: all 140ms ease-in;
  transform: scale(1.05);
}



.perfcard:hover .perfleft{
  opacity: 1;
}


.perfcard:hover .perfright{
  opacity: 1;
}

.insideborder {
  box-shadow: 0px -1px 0px rgba(255,255,255,0.4) inset, 0px 1px 0px rgba(255,255,255,0.4) inset, -1px 0px 0px rgba(255,255,255,0.4) inset, 1px 0px 0px rgba(255,255,255,0.4) inset;
}





.perfleft{
  position: absolute;
  top: 0;
  left:0;
  margin-top: 1em;
  margin-left: 1.2em;
  width: 30px;
  text-align: left;
  text-shadow: 2px 3px 3px rgba(0,0,0,0.3);
  -webkit-text-stroke: 1px rgba(0,0,0,0.2);
  opacity: 0;
  -webkit-transition: .6s ease;
  -moz-transition: .6s ease;
  -ms-transition: .6s ease;
  -o-transition: .6s ease;
  transition: .6s ease;
}


.perfright{
  position: absolute;
  top: 0;
  right:0;
  margin-top: 1em;
  margin-right: 1.2em;
  width: 30px;
  height:100%;
  text-align: right;
  text-shadow: 2px 3px 3px rgba(0,0,0,0.3);
  -webkit-text-stroke: 1px rgba(0,0,0,0.2);
  opacity: 0;
  -webkit-transition: .6s ease;
  -moz-transition: .6s ease;
  -ms-transition: .6s ease;
  -o-transition: .6s ease;
  transition: .6s ease;
}





.button_perf{
  font-size: 1.4em;
  opacity: 0.7;
  cursor: pointer;
  margin-bottom:10px;
  background: rgba(0, 0, 0, 0.07);
  border-radius: .7rem .7rem .7rem .7rem;
}



.button_perf:hover {
    opacity: 1;
  -webkit-transition: all 140ms ease-in;
  -webkit-transform: scale(1.3);
  -ms-transition: all 140ms ease-in;
  -ms-transform: scale(1.3);
  -moz-transition: all 140ms ease-in;
  -moz-transform: scale(1.3);
  transition: all 140ms ease-in;
  transform: scale(1.2);
}




#performerinfo_1 {
  color: #ffffff;
  background: rgba(0, 0, 0, 0.3);
  text-align:left;
}

#performerinfo_2 {
  color: #ffffff;
  background: rgba(0, 0, 0, 0.4);
  text-align:left;
}




.flex_centered {
  width:100%; height:100%; display:flex; justify-content: center; align-items: center;
}


.translate_centered {
  width:100%; margin: 0;  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);
}


.translate_centered_top {
  width:100%; margin: 0;  position: absolute;  top: 40%;  left: 50%;  transform: translate(-50%, -40%);
}





@media all and (min-width: 1800px) {
    .account_status_row {
        font-size: 1.1em;
    }
    .sectiontitle{
        font-size: 1em;
    }
    .button_webcam{
        font-size: 1em;
    }
    .perfcard, .perfcard_subaccount, .perfcard_favorite, .perfcard_alert, .perfcard_banned, .perfcard_lastvisited{
        width: 20%;
    }
    .formtype2 .colmarginleft{
        margin-left:40px;
    }
    .dashboard_item{
      width:24%;
    }
    .dashboard_item.optional{
      display:inline-block;
    }
    .dashboard_bottom {
        display: flex;
    }
    .floating_half{
      width: 49.5%;
    }
    .floating_centered_inside {
       margin: 0;  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);
    }
    .floating_half_container{
      display:flex;
    }
    .floating_half_justified_right
    {
      justify-content: flex-end;
    }
    .floating_half_justified_left
    {
      justify-content: flex-start;
    }

    .imagecontainer{
      width: 16.66%;
    }

    .menutextclass{
      display: none;
    }
    .top_button_class{
      display: inline;
    }

    #performerinfo_1 {
      width:55%;
      max-width:55%;
    }

    #performerinfo_2 {
      width:44%;
      max-width:44%;
      margin-left:1%;
      margin-top:0;
    }
    #performerinfo_2_description {
      flex: 1.2 1 auto;
    }
    #performerinfo_2_comments {
      flex: 5 1 auto;
    }

}


@media all and (max-width: 1799px) {
    .account_status_row {
        font-size: 1.1em;
    }
    .sectiontitle{
        font-size: 1em;
    }
    .button_webcam{
        font-size: 1em;
    }
    .perfcard, .perfcard_subaccount, .perfcard_favorite, .perfcard_alert, .perfcard_banned, .perfcard_lastvisited{
        width: 25%;
    }
    .formtype2 .colmarginleft{
        margin-left:30px;
    }
    .dashboard_item{
      width:32%;
    }
    .dashboard_item.optional{
      display:inline-block;
    }
    .dashboard_bottom {
        display: flex;
    }
    .floating_half{
      width: 49.5%;
    }
    .floating_centered_inside {
       margin: 0;  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);
    }
    .floating_half_container{
      display:flex;
    }
    .floating_half_justified_right
    {
      justify-content: flex-end;
    }
    .floating_half_justified_left
    {
      justify-content: flex-start;
    }

    .imagecontainer{
      width: 20%;
    }

    #performerinfo_1 {
      width:55%;
      max-width:55%;
    }

    #performerinfo_2 {
      width:44%;
      max-width:44%;
      margin-left:1%;
      margin-top:0;
    }
    #performerinfo_2_description {
      flex: 1.2 1 auto;
    }
    #performerinfo_2_comments {
      flex: 5 1 auto;
    }

}


@media all and (min-width: 1300px) {

    .account_status_row {
        font-size: 1.1em;
    }
    .sectiontitle{
        font-size: 1em;
    }
    .button_webcam{
        font-size: 1em;
    }

    .dashboard_item{
      width:24%;
    }
    .dashboard_item.optional{
      display:inline-block;
    }
    .dashboard_bottom {
        display: flex;
    }

}

@media all and (max-width: 1199px) {
    .account_status_row {
        font-size: 1.1em;
    }
    .sectiontitle{
        font-size: 1em;
    }
    .button_webcam{
        font-size: 1em;
    }

    .perfcard, .perfcard_subaccount, .perfcard_favorite, .perfcard_alert, .perfcard_banned, .perfcard_lastvisited{
        width: 33.33333333%;
    }
    .formtype2 .colmarginleft{
        margin-left:20px;
    }
    .dashboard_item{
      width:32%;
    }
    .dashboard_item.optional{
      display:inline-block;
    }
    .dashboard_bottom {
        display: flex;
    }
    .floating_half{
      width: 49.5%;
    }
    .floating_centered_inside {
       margin: 0;  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);
    }
    .floating_half_container{
      display:flex;
    }
    .floating_half_justified_right
    {
      justify-content: flex-end;
    }
    .floating_half_justified_left
    {
      justify-content: flex-start;
    }

    .imagecontainer{
      width: 25%;
    }
    #performerinfo_1 {
      width:55%;
      max-width:55%;
    }
    #performerinfo_2 {
      width:44%;
      max-width:44%;
      margin-left:1%;
      margin-top:0;
    }
    #performerinfo_2_description {
      flex: 1.2 1 auto;
    }
    #performerinfo_2_comments {
      flex: 5 1 auto;
    }
}


@media all and (max-width: 1000px) {

    .account_status_row {
        font-size: 1em;
    }
    .sectiontitle{
        font-size: 1em;
    }
    .button_webcam{
        font-size: 1em;
    }

    .formtype2 .colmarginleft{
        margin-left:10px;
    }
    .dashboard_item{
      width:49%;
    }
    .dashboard_item.optional{
      display:none;
    }
    .dashboard_bottom {
        display: none;
    }

}


@media all and (max-width: 767px) {
    .account_status_row {
        font-size: 1.1em;
    }
    .sectiontitle{
        font-size: 1em;
    }
    .button_webcam{
        font-size: 1em;
    }
    .perfcard, .perfcard_subaccount, .perfcard_favorite, .perfcard_alert, .perfcard_banned, .perfcard_lastvisited{
        width: 50%;
    }
    .formtype2 .colmarginleft{
        margin-left:30px;
    }
    .dashboard_item{
      width:32%;
    }
    .dashboard_item.optional{
      display:inline-block;
    }
    .dashboard_bottom {
        display: flex;
    }
    .floating_half{
      display: inline-block;
      width: 100%;
      margin: 0 auto;
    }
    .floating_centered_inside {
       margin: 0;  position: relative;  top: 0;  left: 0;  transform: none ;
    }
    .floating_half_container{
      display:block;
    }
    .floating_half_justified_right
    {
      justify-content: center;
    }
    .floating_half_justified_left
    {
      justify-content: center;
    }

    .imagecontainer{
      width: 33.33%;
    }
    #performerinfo_1 {
      width:100%;
      max-width:100%;
    }
    #performerinfo_2 {
      width:100%;
      max-width:100%;
      margin-left:0;
      margin-top:8px;
    }
    #performerinfo_2_description {
      flex: 4 1 auto;
    }
    #performerinfo_2_comments {
      flex: 5 1 auto;
    }
}


@media all and (max-width: 500px) {
    .account_status_row {
        font-size: 0.9em;
    }
    .sectiontitle{
        font-size: 0.9em;
    }
    .button_webcam{
        font-size: 0.9em;
    }
    .perfcard, .perfcard_subaccount, .perfcard_favorite, .perfcard_alert, .perfcard_banned, .perfcard_lastvisited{
        width: 100%;
    }
    .formtype2 .colmarginleft{
        margin-left:5px;
    }
    .dashboard_item{
      width:49%;
    }
    .dashboard_item.optional{
      display:none;
    }
    .dashboard_bottom {
        display: none;
    }
    .floating_half{
      display: inline-block;
      position:relative;
      width: 100%;
      margin: 0 auto;
      margin-bottom: 8px;
    }
    .floating_centered_inside {
       margin: 0;  position: relative;  top: 0;  left: 0;  transform: none ;
    }
    .floating_half_container{
      display:block;
    }
    .floating_half_justified_right
    {
      justify-content: center;
    }
    .floating_half_justified_left
    {
      justify-content: center;
    }

    .imagecontainer{
      width: 50%;
    }
    #performerinfo_1 {
      width:100%;
      max-width:100%;
    }
    #performerinfo_2 {
      width:100%;
      max-width:100%;
      margin-left:0;
      margin-top:8px;
    }
    #performerinfo_2_description {
      flex: 4 1;
    }
    #performerinfo_2_comments {
      flex: 5 1;
    }
}


@media all and (max-width: 300px) {




    .imagecontainer{
      width: 100%;;
    }

    .dashboard_item{
      width:99%;
    }
}






@media screen and (min-width: 768px) {
    .material-card .img-container .md-status {
        border: 2px solid #f4f4f4;
    }
}



.stop-scrolling {
    overflow:hidden;
    height: 100%;
}


#video #pvideo{
   will-change: transform;
}

#video #cvideo{
   will-change: transform;
}


/* overlay */

#overlay_main {
   display: none;
   position: fixed;
   top:0;
   left:0;
   bottom: 0;
   width:100%;
   height: 100vh;
   z-index:9000;
   background: rgba(0,0,0, 0.75);
}


#overlay_modal {
   position: relative;
   text-align:center;
   margin: 0 auto;
   width:100%;
   height: 100vh;
   z-index:9100;
   overflow-x: hidden;
   overflow-y: scroll;
   -webkit-overflow-scrolling: touch;
   display: flex;
}




#overlay_modal_message {
     display: none;
     margin: 0;
     position: fixed;
     top: 40%;
     left: 50%;
     transform: translate(-50%, -40%);
     z-index:20100;
     background: rgba(0,0,0, 0.75);
     overflow-x: hidden;
     overflow-y: scroll;
     -webkit-overflow-scrolling: touch;

     border: 1px solid rgba(255, 255, 255, .1);
     border-radius: .5rem .5rem .5rem .5rem;
}





#chat_div, #pchat_div{
  display: none;
  position: absolute;
  width: 100px;
  height: 100px;
  top:0;
  left:0;
  bottom: 0;
  overflow: hidden;

  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);

}


#pchat_div{
  background:  rgba(0,0,0, .2);
}

#pchat_div{
  background:  rgba(0,0,0, .8);
}


#preview_div{
  display: none;
  position: absolute;
  width: 100px;
  height: 100px;
  top:0;
  left:0;
  bottom: 0;
  background:  rgba(0,0,0, .2);
  overflow: hidden;
}




#chat_overlay_border {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  top:0;
  left:0;
  overflow: hidden;
  box-shadow: 0px -1px 0px rgba(255,255,255,0.4) inset, 0px 1px 0px rgba(255,255,255,0.4) inset, -1px 0px 0px rgba(255,255,255,0.4) inset, 1px 0px 0px rgba(255,255,255,0.4) inset;
}


#chat_overlay {
  display: none;
  position: absolute;
  width: 100%;
  height: 1300px;
  top:0;
  left:0;

  -ms-transform-origin: top left;
  -webkit-transform-origin: top left;
  transform-origin: top left;

}


#chat_overlay_top {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  overflow: hidden;
  color: #ffffff;
  font-weight: 400;
  font-size: 1.1em;
  padding: 10px 10px 10px 10px;
  cursor:default;
  text-shadow: 2px 2px 2px rgba(0,0,0,0.2);
}

#chat_overlay_top_left {
  float: left;
}

#chat_overlay_top_right {
  float: right;
}

#chat_name_secondary {
  position: relative;
  left: -2px;
  color: #C1C1C1;
  font-weight: 300;
  font-size: 0.9em;
  padding: 3px 3px 3px 3px;
  cursor:default;
  background: rgba(0,0,0,0.2);
}


.live_sign {
  display:none;
  position: absolute;
  top: 17px;
  left: 25px;
  color: #ffffff;
  font-weight: 300;
  font-size: 1em;
  padding: 0px 3px 0px 3px;
  cursor:default;
  background: rgba(0,0,0,0.2);

  -webkit-animation: pulse1 1s linear infinite;
  -moz-animation: pulse1 1s linear infinite;
  -ms-animation: pulse1 1s linear infinite;
  animation: pulse1 1s linear infinite;

}

.no_preview {
  display:none;
  margin: 0;  position: absolute;  top: 45%;  left: 50%;  transform: translate(-50%, -45%);
  color: #ffffff;
  font-family: 'Exo', sans-serif;
  font-size: 1em;
  font-weight: 350;
  font-size: 1.1em;
  padding: 0px 3px 0px 3px;
  cursor:default;
  background: rgba(0,0,0,0.2);
}


.no_preview_fav {
  color: #ffffff;
  font-family: 'Exo', sans-serif;
  font-size: 1em;
  font-weight: 350;
  font-size: 1.1em;
  padding: 0px 3px 0px 3px;
  cursor:default;
  background: rgba(0,0,0,0.4);
}


#chat_overlay_bottom {
  position: absolute;
  bottom: 0px;
  width: 100%;
  overflow: hidden;
  color: #ffffff;
  font-weight: 400;
  font-size: 1.2em;
  padding: 10px;
  cursor:default;
}


#chat_overlay_right {
  position: absolute;
  bottom: 0px;
  right: 0px;
  width: 100px;
  color: #ffffff;
  cursor:default;
  padding: 10px 0px 10px 0px;
  z-index:21000;
  /*background:  rgba(0,0,0, .5);*/
}



#chat_close {
  position: absolute;
  top: -2px;
  right: 15px;
  font-family: 'Exo', sans-serif;
  font-size: 1.8em;
  font-weight: 550;
  cursor: pointer;
}

#chat_minimize {
  position: absolute;
  top: -2px;
  right: 45px;
  font-family: 'Exo', sans-serif;
  font-size: 1.8em;
  font-weight: 550;
  cursor: pointer;
}

#chat_prev {
  position: absolute;
  top: 3px;
  right: 125px;
  font-family: 'Exo', sans-serif;
  font-size: 1.8em;
  font-weight: 250;
  cursor: pointer;
}

#chat_next {
  position: absolute;
  top: 3px;
  right: 95px;
  font-family: 'Exo', sans-serif;
  font-size: 1.8em;
  font-weight: 250;
  cursor: pointer;
}


#search_close {
  position: absolute;
  top: 2px;
  right: 10px;
  font-family: 'Exo', sans-serif;
  font-size: 1.5em;
  font-weight: 450;
  cursor: pointer;
}

#chat_maximize {
  font-size: 1.2em;
  cursor: pointer;
}


.chatbutton {
  display:block;
  min-width: 1.8em;
  text-align: center;
  position: relative;
  float:right;
  margin-right:10px;
  margin-top:10px;
  padding: 5px 5px 5px 5px;
  font-size: 1.8em;
  cursor: pointer;
  opacity: 0.8;
  background: rgba(0,0,0,0.2);
  border-radius: .5rem .5rem .5rem .5rem;


}

.chatbutton:hover {
  background: rgba(0,0,0,0.3);
  opacity: 1;
}






#chatarea {
  display: block;

  width: 80%;
  min-width: 40%;
  max-width: 650px;

  height: 40vh;
  min-height: 100px;
  max-height: 60vh;

  overflow-x: hidden;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
  overflow: -moz-scrollbars-none;
  scrollbar-width: none;


}


.withgradient {
    -webkit-mask-image: -webkit-linear-gradient(top,rgba(0,0,0,0) 0,rgba(0,0,0,0.8) 80%);
}




.msg-wrapper {
  display: block;
  position: relative;
  left:0px;
  width: 100%;
}


.msg-text {
  display: inline-block;
  position: relative;
  margin-top: 1px;
  margin-left: 2px;
  margin-right: 2px;
  width: auto;
  padding :0px 8px 0px 8px;
  font-family: 'Exo', sans-serif;
  font-size: .9em;
  font-weight: 400;
  color: #ffffff;
  text-align: left;
  word-wrap: break-word;
  background: rgba(0,0,0,0.5);
  border-radius: .5rem .5rem .5rem .5rem;
}

.msg-textIE {
  display: inline-block;
  position: relative;
  margin-top: 3px;
  margin-left: 5px;
  margin-right: 5px;
  width: auto;
  padding :0px 8px 0px 8px;
  font-weight: 500;
  font-size: 0.9em;
  color: #ffffff;
  text-align: left;
  word-wrap: break-word;
  background: rgba(0,0,0,0.35);
  border-radius: .5rem .5rem .5rem .5rem;
}


.msg-performer {
  color: #F9C2FF;
}

.msg-self {
  color: #F5F890;
}

.msg-system {
  background: rgba(234,0,207,0.3);

}



.chatbutton_user {
    display:block;
    min-width:30px;
    padding:2px;
    margin-right:3px;
    text-align: center;
    opacity: .6;
    background: rgba(0,0,0,0.3);
    cursor:pointer;
    border: 1px solid rgba(255,255,255,0.2);
    transition: all .2s ease-out !important;
}

.chatbutton_user:hover {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -ms-transition: all 140ms ease-in;
    -ms-transform: scale(1.1);
    -moz-transition: all 140ms ease-in;
    -moz-transform: scale(1.1);
    transition: all 140ms ease-in;
    transform: scale(1.1);
    border: 1px solid rgba(255,255,255,0.3);
    transition: all .2s ease-out !important;
}


#chat_user_buttons {
  display:block;
  width:100%;
  height:34px;
  background: rgba(0,0,0,0.0);
}




#chat_users_list {
  display:block;
  width:100%;
  height:100%;

  overflow-x: hidden;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
  overflow: -moz-scrollbars-none;
  scrollbar-width: none;

  padding: 2px 3px 3px 3px;
  opacity: 1;
  background: rgba(0,0,0,0.0);
  border-radius: .5rem .5rem .5rem .5rem;

  transition: all .2s ease-out !important;
}

.chat_username {
  display:block;
  width:100%;
  padding: 0px 5px 0px 5px;
  margin-top:4px;
  background: rgba(0,0,0,0.6);
  opacity: 0.5;
  border-radius: .2rem .2rem .2rem .2rem;
  font-family: 'Exo', sans-serif;
  font-size: .9em;
  font-weight: 400;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: .5rem .5rem .5rem .5rem;
}

.chat_username:hover {
    opacity: 1;
    border: 1px solid rgba(255,255,255,0.3);
}

.chat_username_selected {
    opacity: 1;
    border: 1px solid rgba(255,255,255,0.3);
}


.unread_chat {
    display:none;
    float:right;
    margin-top:5px;
    margin-right:3px;
}






#textarea_container {
  display: block;
  position: relative;
  left:0px;
  width: 80%;
  min-width: 40%;
  max-width: 450px;
  overflow: hidden;
}


#textarea_clone {
  display: none;
  z-index:-100;
  position: relative;
  left:0px;
  height: 1.5em;
  font-family: 'Exo', sans-serif;
  font-size: .9em;
  font-weight: 400;
  width: auto;
  overflow: hidden;
}


#textarea {
  position: relative;
  left:0px;

  width: 150px;
  height: 1.5em;

  margin-top: 10px;
  margin-left: 3px;
  margin-right: 3px;
  padding :0px 8px 0px 8px;
  font-family: 'Exo', sans-serif;
  font-size: .9em;
  font-weight: 400;
  color: #ffffff;

  word-wrap: break-word;
  text-align: left;
  vertical-align: top;


  background: rgba(0,0,0,0.35);
  border-radius: .5rem .5rem .5rem .5rem;
  border: 1px solid rgba(255, 0255, 255, .1);

  outline: none;

  resize: none;

  overflow: auto;
  overflow-y: hidden;


}



#textarea:focus {

  background: rgba(0,0,0,0.5);
  border: 1px solid rgba(255, 255, 255, .3);

}








#keyboard_container {
  display: none;
  position: relative;
  margin-top: 15px;
  margin-bottom: 0px;
  margin-right: 100px;
  width:100%;
  left:0px;
  width: 80%;
  min-width: 40%;
  max-width: 450px;
  height: 160px;
  z-index:20000;
}

#keyboard {

  width:100%;
  height:100%;
  margin: 0px;

}

.keyboard_row {
  display: table;
  position: relative;
  width:100%;
  height:24.0%;
  margin-top: 0px;;
  margin-bottom: 0.4%;

  float: left;
}


.key_wrapper {
  display: table;
  width: 9.5%;
  height: 100%;
  overflow: hidden;
  text-align: center;
  position: relative;
  float: left;
  margin-left: 0.5%;
  font-weight: 500;
  font-size: 1.2em;
  color: #ffffff;
  background: rgba(0,0,0,0.3);
  border-radius: .4rem .4rem .4rem .4rem;
  cursor: pointer;
}


.keypressed {
  -webkit-transition: all 40ms;
  -webkit-transform: scale(1.2);
  -ms-transition: all 40ms;
  -ms-transform: scale(1.2);
  -moz-transition: all 40ms;
  -moz-transform: scale(1.2);
  transition: all 40ms;
  transform: scale(1.2);
}





.key_spacer {
  display: table;
  width: 4.75%;
  height: 100%;
  overflow: hidden;
  text-align: center;
  position: relative;
  float: left;
  margin-left: 0.5%;
  padding: 2px;
  font-weight: 500;
  font-size: 1.2em;
  color: #ffffff;
  background: rgba(0,0,0,0);
}


.key_wrapper:hover {
  background: rgba(0,0,0,0.4);

}


.key {
  display: table-cell;
  vertical-align: middle;
  width:100%;
  margin: 0px;

}

.wide {
  width: 14.25%;
}

.widespace {
  width: 49.4%;
}

.uppercase {
  text-transform:uppercase;
}





#menu_horizontal {
  display: block;
  position:relative;
  //top:10px;
  padding-top: 10px;
  height:100%;
  left: 0px;
  padding-right:10px;
  float: right;
  overflow: hidden;
}

#menu_horizontal_bar {
  font-size: 1.3em;
}



.menu_horizontal_tab {
  color: rgba(255,255,255,0.8);
  margin-left: 15px;
  font-size: 1em;
  font-weight: 200;
  display: inline-block;
  cursor: pointer;
  line-height:1.2em;
}

.menu_horizontal_tab:hover {
  color: rgba(255,255,255,1);
  -webkit-transition: all 80ms ease-in;
  -webkit-transform: scale(1.1);
  -ms-transition: all 80ms ease-in;
  -ms-transform: scale(1.1);
  -moz-transition: all 80ms ease-in;
  -moz-transform: scale(1.1);
  transition: all 80ms ease-in;
  transform: scale(1.1);
}

.menu_horizontal_tab.tbottom {
  font-size: 1.2em;
  margin-left: 7px;
}





#menu_vertical {
  display: block;
  position:fixed;
  width:100%;
  top: 20vh;
  left: 101vw;
  text-align: center;
  overflow: hidden;
  z-index: 100001;
}

#menu_vertical_bar {
}


.menu_vertical_tab {
  color: rgba(255,255,255,0.8);

  font-family: 'Exo', sans-serif;
  font-size: 1.4em;
  font-weight: 400;

  display: inline-block;
  cursor: pointer;
  padding: 4px;
  margin-top: 3px;
  width: 400px;
  max-width: 80vw;
  background: rgba(0,0,0,0.3);
  border-radius: .5rem .5rem .5rem .5rem;
}

.menu_vertical_tab:hover {
  color: rgba(255,255,255,1);
  -webkit-transition: all 80ms ease-in;
  -webkit-transform: scale(1.1);
  -ms-transition: all 80ms ease-in;
  -ms-transform: scale(1.1);
  -moz-transition: all 80ms ease-in;
  -moz-transform: scale(1.1);
  transition: all 80ms ease-in;
  transform: scale(1.1);
}











::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #ffffff;
    opacity:  .6;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #ffffff;
   opacity:  .6;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #ffffff;
   opacity:  .6;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #ffffff;
}
::-ms-input-placeholder { /* Microsoft Edge */
   color:    #ffffff;
   opacity:  .6;
}

::placeholder { /* Most modern browsers support this now. */
   color:    #ffffff;
   opacity:  .6;
}




/* animated menu button */


.menu-button {
  border: 0;
  margin: 0;
  padding: 0;
  outline: 0;
}

.menu-icon {
  font-size: 10px;
  width: 3.2em;
  height: 3.2em;
  background-color: transparent;
  position: relative;
}

.menu-icon-wing {
  -webkit-transition: -webkit-transform 0.1s linear;
  -moz-transition: -moz-transform 0.1s linear;
  transition: transform 0.1s linear;
  position: absolute;
  width: 1.1em;
  height: 0.2em;
  background-color: white;
}
.menu-icon-wing--m {
  transform-origin: 1.1em 0.1em;
  top: 50%;
  left: 0.5em;
  width: 2.2em;
  margin-top: -0.1em;
}
.menu-icon-wing--tl {
  transform-origin: 0.4em 0.1em;
  top: 0.8em;
  left: 0.5em;
}
.menu-icon-wing--tr {
  transform-origin: 0.7em 0.1em;
  top: 0.8em;
  right: 0.5em;
}
.menu-icon-wing--br {
  transform-origin: 0.7em 0.1em;
  bottom: 0.8em;
  right: 0.5em;
}
.menu-icon-wing--bl {
  transform-origin: 0.4em 0.1em;
  bottom: 0.8em;
  left: 0.5em;
}

.menu-icon[data-menu-state="on"] .menu-icon-wing--m {
  -webkit-transform: scale(0, 1);
  -moz-transform: scale(0, 1);
  -ms-transform: scale(0, 1);
  -o-transform: scale(0, 1);
  transform: scale(0, 1);
}
.menu-icon[data-menu-state="on"] .menu-icon-wing--tl {
  -webkit-transform: rotate(45deg) translate(0.3em, 0);
  -moz-transform: rotate(45deg) translate(0.3em, 0);
  -ms-transform: rotate(45deg) translate(0.3em, 0);
  -o-transform: rotate(45deg) translate(0.3em, 0);
  transform: rotate(45deg) translate(0.3em, 0);
}
.menu-icon[data-menu-state="on"] .menu-icon-wing--tr {
  -webkit-transform: rotate(-45deg) translate(-0.3em, 0);
  -moz-transform: rotate(-45deg) translate(-0.3em, 0);
  -ms-transform: rotate(-45deg) translate(-0.3em, 0);
  -o-transform: rotate(-45deg) translate(-0.3em, 0);
  transform: rotate(-45deg) translate(-0.3em, 0);
}
.menu-icon[data-menu-state="on"] .menu-icon-wing--br {
  -webkit-transform: rotate(45deg) translate(-0.3em, 0);
  -moz-transform: rotate(45deg) translate(-0.3em, 0);
  -ms-transform: rotate(45deg) translate(-0.3em, 0);
  -o-transform: rotate(45deg) translate(-0.3em, 0);
  transform: rotate(45deg) translate(-0.3em, 0);
}
.menu-icon[data-menu-state="on"] .menu-icon-wing--bl {
  -webkit-transform: rotate(-45deg) translate(0.3em, 0);
  -moz-transform: rotate(-45deg) translate(0.3em, 0);
  -ms-transform: rotate(-45deg) translate(0.3em, 0);
  -o-transform: rotate(-45deg) translate(0.3em, 0);
  transform: rotate(-45deg) translate(0.3em, 0);
}



/* animated loader */

 .loader-wrapper {
  position: relative;
  width: 100%;
  height: 600px;
  z-index: 1000;
}

.loader {
  display: block;
  position: relative;
  left: 50%;
  top: 50%;
  width: 150px;
  height: 150px;
  margin: -75px 0 0 -75px;
  border: 3px solid transparent;
  border-top-color: #f18af1;
  z-index: 1001;
  border-radius: 50%;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}
.loader:before {
  content: "";
  position: absolute;
  top: 5px;
  right: 5px;
  bottom: 5px;
  left: 5px;
  border: 3px solid transparent;
  border-top-color: #ffffff;
  border-radius: 50%;
  -webkit-animation: spin 3s linear infinite;
  animation: spin 3s linear infinite;
}

.loader:after {
  content: "";
  position: absolute;
  top: 15px;
  right: 15px;
  bottom: 15px;
  left: 15px;
  border: 3px solid transparent;
  border-top-color: #fca4d1;
  border-radius: 50%;
  -webkit-animation: spin 1.5s linear infinite;
  animation: spin 1.5s linear infinite;
}

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    /* Chrome, Opera 15+, Safari 3.1+ */
    -ms-transform: rotate(0deg);
    /* IE 9 */
    transform: rotate(0deg);
    /* Firefox 16+, IE 10+, Opera */
  }
  100% {
    -webkit-transform: rotate(360deg);
    /* Chrome, Opera 15+, Safari 3.1+ */
    -ms-transform: rotate(360deg);
    /* IE 9 */
    transform: rotate(360deg);
    /* Firefox 16+, IE 10+, Opera */
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    /* Chrome, Opera 15+, Safari 3.1+ */
    -ms-transform: rotate(0deg);
    /* IE 9 */
    transform: rotate(0deg);
    /* Firefox 16+, IE 10+, Opera */
  }
  100% {
    -webkit-transform: rotate(360deg);
    /* Chrome, Opera 15+, Safari 3.1+ */
    -ms-transform: rotate(360deg);
    /* IE 9 */
    transform: rotate(360deg);
    /* Firefox 16+, IE 10+, Opera */
  }
}
.loader-wrapper .loader-section {
  position: relative;
  top: 0;
  width: 51%;
  height: 100%;
  background-color: #222;
  z-index: 1000;
}

.loader-wrapper .loader-section.section-left {
  left: 0;
}

.loader-wrapper .loader-section.section-right {
  right: 0;
}

/* Loaded */
.loaded .loader-wrapper .loader-section.section-left, .loaded .loader-wrapper .loader-section.section-right {
  -webkit-transition: all 0.3s 0.3s ease-out;
  transition: all 0.3s 0.3s ease-out;
}

.loaded .loader-wrapper .loader-section.section-left {
  -webkit-transform: translateX(-100%);
  /* Chrome, Opera 15+, Safari 3.1+ */
  -ms-transform: translateX(-100%);
  /* IE 9 */
  transform: translateX(-100%);
  /* Firefox 16+, IE 10+, Opera */
}

.loaded .loader-wrapper .loader-section.section-right {
  -webkit-transform: translateX(100%);
  /* Chrome, Opera 15+, Safari 3.1+ */
  -ms-transform: translateX(100%);
  /* IE 9 */
  transform: translateX(100%);
  /* Firefox 16+, IE 10+, Opera */
}

.loaded .loader-wrapper {
  visibility: hidden;
  -webkit-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition: all 0.3s 0.6s ease-out;
  transition: all 0.3s 0.6s ease-out;
}

.loaded .loader {
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}






.pulse1 {
  -webkit-animation: pulse1 1.5s linear infinite;
  -moz-animation: pulse1 1.5s linear infinite;
  -ms-animation: pulse1 1.5s linear infinite;
  animation: pulse1 1.5s linear infinite;
}

@keyframes "pulse1" {
 0% {
    color: rgba(255, 255, 255, 1);
 }
 90% {
    color: rgba(255,255,255,0.2);
 }
 100% {
    color: rgba(255,255,255,1.0);
 }

}

@-moz-keyframes pulse1 {
 0% {
   color: rgba(255,255,255, 1);
 }
 90% {
   color: rgba(255,255,255,0.2);
 }
 100% {
   color: rgba(255,255,255,1.0);
 }

}

@-webkit-keyframes "pulse1" {
 0% {
   color: rgba(255,255,255, 1);
 }
 90% {
   color: rgba(255,255,255,0.2);
 }
 100% {
   color: rgba(255,255,255,1.0);
 }

}

@-ms-keyframes "pulse1" {
 0% {
   color: rgba(255,255,255, 1);
 }
 90% {
   color: rgba(255,255,255,0.2);
 }
 100% {
   color: rgba(255,255,255,1.0);
 }

}






@keyframes shake {
  2% {
    transform: translate(-4px, 2px) rotate(-2.5deg); }
  4% {
    transform: translate(-7px, 9px) rotate(-1.5deg); }
  6% {
    transform: translate(0px, 4px) rotate(-2.5deg); }
  8% {
    transform: translate(9px, -4px) rotate(-1.5deg); }
  10% {
    transform: translate(6px, 4px) rotate(1.5deg); }
  12% {
    transform: translate(-6px, -9px) rotate(-0.5deg); }
  14% {
    transform: translate(9px, -9px) rotate(-0.5deg); }
  16% {
    transform: translate(-2px, 2px) rotate(-2.5deg); }
  18% {
    transform: translate(8px, -2px) rotate(-1.5deg); }
  20% {
    transform: translate(-2px, -8px) rotate(1.5deg); }
  22% {
    transform: translate(3px, 8px) rotate(-2.5deg); }
  24% {
    transform: translate(2px, 10px) rotate(0.5deg); }
  26% {
    transform: translate(-3px, 8px) rotate(-0.5deg); }
  28% {
    transform: translate(10px, 0px) rotate(-1.5deg); }
  30% {
    transform: translate(7px, 5px) rotate(2.5deg); }
  32% {
    transform: translate(7px, 6px) rotate(1.5deg); }
  34% {
    transform: translate(0px, 9px) rotate(0.5deg); }
  36% {
    transform: translate(10px, -8px) rotate(0.5deg); }
  38% {
    transform: translate(-1px, 9px) rotate(3.5deg); }
  40% {
    transform: translate(-6px, 2px) rotate(2.5deg); }
  42% {
    transform: translate(-1px, -8px) rotate(-1.5deg); }
  44% {
    transform: translate(-9px, 4px) rotate(1.5deg); }
  46% {
    transform: translate(-8px, -6px) rotate(1.5deg); }
  48% {
    transform: translate(-2px, 8px) rotate(-2.5deg); }
  50% {
    transform: translate(3px, 9px) rotate(-2.5deg); }
  52% {
    transform: translate(7px, -9px) rotate(3.5deg); }
  54% {
    transform: translate(-6px, 4px) rotate(-2.5deg); }
  56% {
    transform: translate(2px, -4px) rotate(-2.5deg); }
  58% {
    transform: translate(4px, -9px) rotate(2.5deg); }
  60% {
    transform: translate(-1px, 4px) rotate(-1.5deg); }
  62% {
    transform: translate(-8px, -5px) rotate(-1.5deg); }
  64% {
    transform: translate(-5px, -6px) rotate(-2.5deg); }
  66% {
    transform: translate(9px, -7px) rotate(2.5deg); }
  68% {
    transform: translate(-6px, -3px) rotate(-0.5deg); }
  70% {
    transform: translate(6px, -8px) rotate(1.5deg); }
  72% {
    transform: translate(9px, 8px) rotate(0.5deg); }
  74% {
    transform: translate(7px, 1px) rotate(2.5deg); }
  76% {
    transform: translate(-9px, -4px) rotate(1.5deg); }
  78% {
    transform: translate(-8px, 0px) rotate(-0.5deg); }
  80% {
    transform: translate(6px, -7px) rotate(1.5deg); }
  82% {
    transform: translate(8px, -2px) rotate(2.5deg); }
  84% {
    transform: translate(4px, -5px) rotate(1.5deg); }
  86% {
    transform: translate(6px, 5px) rotate(-1.5deg); }
  88% {
    transform: translate(-2px, -2px) rotate(-1.5deg); }
  90% {
    transform: translate(-3px, 4px) rotate(-0.5deg); }
  92% {
    transform: translate(-6px, -4px) rotate(-0.5deg); }
  94% {
    transform: translate(6px, -7px) rotate(2.5deg); }
  96% {
    transform: translate(-5px, -3px) rotate(3.5deg); }
  98% {
    transform: translate(5px, 9px) rotate(-2.5deg); }
  0%, 100% {
    transform: translate(0, 0) rotate(0); } }

.shake {
  animation-name: shake;
  animation-duration: 100ms;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;

  }



  @keyframes popped {
      0% {
         transform: scale(1);
      }
      50% {
         transform: scale(1.3);
      }
      100% {
         transform: scale(1);
      }

  }

  @-moz-keyframes popped {
      0% {
         transform: scale(1);
      }
      50% {
         transform: scale(1.3);
      }
      100% {
         transform: scale(1);
      }

  }

  @-webkit-keyframes popped {
      0% {
         transform: scale(1);
      }
      50% {
         transform: scale(1.3);
      }
      100% {
         transform: scale(1);
      }

  }

  @-ms-keyframes popped {
      0% {
         transform: scale(1);
      }
      50% {
         transform: scale(1.3);
      }
      100% {
         transform: scale(1);
      }

  }





  @keyframes popping_dashboard {
      0% {
         transform: scale(1) translateY(-50%);
      }
      50% {
         transform: scale(1.3) translateY(-40%);
      }
      100% {
         transform: scale(1) translateY(-50%);
      }

  }

  @-moz-keyframes popping_dashboard {
      0% {
         transform: scale(1) translateY(-50%);
      }
      50% {
         transform: scale(1.3) translateY(-40%);
      }
      100% {
         transform: scale(1) translateY(-50%);
      }

  }

  @-webkit-keyframes popping_dashboard {
      0% {
         transform: scale(1) translateY(-50%);
      }
      50% {
         transform: scale(1.3) translateY(-40%);
      }
      100% {
         transform: scale(1) translateY(-50%);
      }

  }

  @-ms-keyframes popping_dashboard {
      0% {
         transform: scale(1) translateY(-50%);
      }
      50% {
         transform: scale(1.3) translateY(-40%);
      }
      100% {
         transform: scale(1) translateY(-50%);
      }

  }




  @keyframes popped_big {
      0% {
         transform: scale(1);
      }
      50% {
         transform: scale(3.15) translateX(30%);
      }
      100% {
         transform: scale(1);
      }

  }

  @-moz-keyframes popped_big {
      0% {
         transform: scale(1);
      }
      50% {
         transform: scale(3.15) translateX(30%);
      }
      100% {
         transform: scale(1);
      }

  }

  @-webkit-keyframes popped_big {
      0% {
         transform: scale(1);
      }
      50% {
         transform: scale(3.15) translateX(30%);
      }
      100% {
         transform: scale(1);
      }

  }

  @-ms-keyframes popped_big {
      0% {
         transform: scale(1);
      }
      50% {
         transform: scale(3.15) translateX(30%);
      }
      100% {
         transform: scale(1);
      }

  }



  @keyframes popped_big_left {
      0% {
         transform: scale(1);
      }
      50% {
         transform: scale(3.15) translateX(-10%);
      }
      100% {
         transform: scale(1);
      }

  }

  @-moz-keyframes popped_big_left {
      0% {
         transform: scale(1);
      }
      50% {
         transform: scale(3.15) translateX(-10%);
      }
      100% {
         transform: scale(1);
      }

  }

  @-webkit-keyframes popped_big_left {
      0% {
         transform: scale(1);
      }
      50% {
         transform: scale(3.15) translateX(-10%);
      }
      100% {
         transform: scale(1);
      }

  }

  @-ms-keyframes popped_big_left {
      0% {
         transform: scale(1);
      }
      50% {
         transform: scale(3.15) translateX(-10%);
      }
      100% {
         transform: scale(1);
      }

  }



.popped {
    animation-name: popped;
    animation-duration: 200ms;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

.popping_dashboard {
    animation-name: popping_dashboard;
    animation-duration: 400ms;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

.popped_big {
    animation-name: popped_big;
    animation-duration: 400ms;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

.popped_big_left {
    animation-name: popped_big_left;
    animation-duration: 400ms;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

.popped_slow {
    animation-name: popped;
    animation-duration: 700ms;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}



#menu_horizontal {
    animation-fill-mode: forwards;

}
.bounceleft {
    animation: bounceleft .3s;
    animation-timing-function: ease-out;
    animation-iteration-count: 1;
}
@keyframes bounceleft {
    0% {
        left: 60px);
    }
    20% {
        left: -60px;
    }
    40% {
        left: 15px;
    }
    60% {
        left: -8px;
    }
    80% {
        left: 5px;
    }
    100% {
        left: 0px;
    }
}



#div_login {
    animation-fill-mode: forwards;

}

.bouncebottom {
    animation: bouncebottom .3s;
    animation-timing-function: ease-out;
    animation-iteration-count: 1;
}
@keyframes bouncebottom {
    0% {
        margin-top: -60px);
    }
    20% {
        margin-top: 60px;
    }
    40% {
        margin-top: -15px;
    }
    60% {
        margin-top: 8px;
    }
    80% {
        margin-top: -5px;
    }
    100% {
        margin-top: 0px;
    }
}




#terms {
  cursor: pointer;
}


#usc {
  cursor: pointer;
}


#.pointer {
  cursor: pointer;
}


.fade-in {
  visibility: visible;
  opacity: 1;
  transition: opacity 1s linear;
}

.fade-out {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s 1s, opacity 1s linear;
}


.blurred {
  filter: blur (1px);
  -webkit-filter: blur(1px);
}



.none {
  -webkit-filter: none;
  filter: none;
}
.blur {
  -webkit-filter: blur(3px);
  filter: blur(3px);
}
.grayscale {
  -webkit-filter: grayscale(1);
  filter: grayscale(1);
}
.invert {
  -webkit-filter: invert(1);
  filter: invert(1);
}
.sepia {
  -webkit-filter: sepia(1);
  filter: sepia(1);
}




.modal_div_small {
  color: #ffffff;
  font-size: 1.2em;
  font-weight: 600;
  margin: 0 auto;
  padding: 10px;
  width: 460px;
  max-width: 95vw;
  background: rgba(0,0,0,0.5);
  border: 1px solid rgba(255, 255, 255, .0);
  border-radius: .5rem .5rem .5rem .5rem;

}



.modal_div_medium {
  color: #ffffff;
  font-size: 1.2em;
  font-weight: 600;
  margin: 0 auto;
  padding: 10px;
  width: 900px;
  max-width: 95vw;
  background: rgba(0,0,0,0.5);
  border: 1px solid rgba(255, 255, 255, .0);
  border-radius: .5rem .5rem .5rem .5rem;
  position: relative;
  margin: auto auto;

}


.modal_div_big {
  color: #ffffff;
  font-size: 1.2em;
  font-weight: 600;
  margin: 0 auto;
  padding: 10px;
  width: 1200px;
  max-width: 100vw;
  background: rgba(0,0,0,0.5);
  border: 1px solid rgba(255, 255, 255, .0);
  border-radius: .5rem .5rem .5rem .5rem;
  position: relative;
  margin: auto auto;

}



#div_login, #div_register, #div_recover, #div_confirm {

  position: relative;
  margin: auto auto;

}


.formtype1 input[type=text]{
        width: 250px;
	max-width: 95%;
	height: 30px;
	background: transparent;
        background-color: none !important;
	border: 1px solid rgba(255,255,255,0.6);
	border-radius: 2px;
	color: #fff;
	font-family: 'Exo', sans-serif;
	font-size: 16px;
	font-weight: 400;
	padding: 4px;
	margin-bottom: 10px;
}

.formtype1 input[type=password]{
	width: 250px;
	max-width: 95%;
	height: 30px;
	background: transparent;
	border: 1px solid rgba(255,255,255,0.6);
	border-radius: 2px;
	color: #fff;
	font-family: 'Exo', sans-serif;
	font-size: 16px;
	font-weight: 400;
	padding: 4px;
	margin-bottom: 10px;
}

.formtype1 select{
	width: 250px;
	max-width: 95%;
	height: 30px;
	background: transparent;
	border: 1px solid rgba(255,255,255,0.6);
	border-radius: 2px;
	color: #fff;
	font-family: 'Exo', sans-serif;
	font-size: 16px;
	font-weight: 400;
	padding: 4px;
	margin-bottom: 10px;
        background-color: transparent !important;
        -webkit-appearance: none;
        -moz-appearance: none;
}


.formtype1 select option{
    color: #ffffff;
    background: #000000;
}

.formtype1 select:focus{
  outline:none;
}



.formtype1 input[type=button]{
	min-width: 250px;
	max-width: 95%;
	height: 35px;
	background: rgba(134, 88, 112, 0.18);
	border: 1px solid rgba(162, 151, 157, 0.3);
	cursor: pointer;
	border-radius: 2px;
	color: #ffffff;
	font-family: 'Exo', sans-serif;
	font-size: 16px;
	font-weight: 400;
	padding: 6px;
    margin-bottom: 10px;
    transition: all .2s ease-out !important;
}

.formtype1 input[type=checkbox]{
	width: 18px;
	height: 18px;
	vertical-align: middle;
}

.formtype1 input[type=button]:hover{
	background: rgb(113, 58, 87);
    transition: all .2s ease-out !important;
}

.formtype1 input[type=button]:active{
	opacity: 0.6;
}

.formtype1 input[type=text]:focus{
	outline: none;
	border: 1px solid rgba(255,255,255,0.9);
}

.formtype1 input[type=password]:focus{
	outline: none;
	border: 1px solid rgba(255,255,255,0.9);
}

.formtype1 input[type=button]:focus{
	outline: none;
}

.formtype1 ::-webkit-input-placeholder{
   color: rgba(255,255,255,0.6);
}

.formtype1 ::-moz-input-placeholder{
   color: rgba(255,255,255,0.6);
}

.formtype1 .form_text{
    color: #ffffff;
    font-family: 'Exo', sans-serif;
    font-size: .9em;
    font-weight: 400;
    margin-top:2px;
}

.form_text_small{
    color: #ffffff;
    font-family: 'Exo', sans-serif;
    font-size: .8em;
    font-weight: 200;
    margin-top:2px;
}






.formtype2 input[type=text]{
        width: 220px;
	max-width: 95%;
	height: 30px;
	background: transparent;
        background-color: none !important;
	border: 1px solid rgba(255,255,255,0.3);
	border-radius: 2px;
	color: #fff;
	font-family: 'Exo', sans-serif;
	font-size: 16px;
	font-weight: 400;
	padding: 4px;
	margin-bottom: 10px;
}


.formtype2 textarea{
	background: transparent;
        background-color: none !important;
	border: 1px solid rgba(255,255,255,0.2);
	border-radius: 2px;
	color: #fff;
	font-family: 'Exo', sans-serif;
	font-size: 16px;
	font-weight: 400;
	padding: 4px;
	margin-bottom: 10px;
	resize: none;
}

.formtype2 input[type=password]{
	width: 220px;
	max-width: 95%;
	height: 30px;
	background: transparent;
	border: 1px solid rgba(255,255,255,0.3);
	border-radius: 2px;
	color: #fff;
	font-family: 'Exo', sans-serif;
	font-size: 16px;
	font-weight: 400;
	padding: 4px;
	margin-bottom: 10px;
}

.formtype2 select{
	width: 220px;
	max-width: 95%;
	height: 30px;
	background: transparent;
	border: 1px solid rgba(255,255,255,0.3);
	border-radius: 2px;
	color: #fff;
	font-family: 'Exo', sans-serif;
	font-size: 16px;
	font-weight: 400;
	padding: 4px;
	margin-bottom: 10px;
        background-color: transparent !important;
        -webkit-appearance: none;
        -moz-appearance: none;
}


.formtype2 select option{
    color: #ffffff;
    background: #212121;
}

.formtype2 select:focus{
  outline:none;
}



.formtype2 input[type=button]{
	min-width: 250px;
	max-width: 95%;
	height: 35px;
	background: rgba(134, 88, 112, 0.18);
	border: 1px solid rgba(162, 151, 157, 0.3);
	cursor: pointer;
	border-radius: 2px;
	color: #ffffff;
	font-family: 'Exo', sans-serif;
	font-size: 16px;
	font-weight: 400;
	padding: 6px;
    margin-bottom: 10px;
    transition: all .2s ease-out !important;
}

.formtype2 input[type=checkbox]{
	width: 18px;
	height: 18px;
	vertical-align: middle;
}

.formtype2 input[type=button]:hover{
	background: rgb(113, 58, 87);
    transition: all .2s ease-out !important;
}

.formtype2 input[type=button]:active{
	opacity: 0.6;
}

.formtype2 input[type=text]:focus{
	outline: none;
	border: 1px solid rgba(255,255,255,0.7);
}

.formtype2 input[type=password]:focus{
	outline: none;
	border: 1px solid rgba(255,255,255,0.7);
}

.formtype2 input[type=button]:focus{
	outline: none;
}

.formtype2 ::-webkit-input-placeholder{
   color: rgba(255,255,255,0.6);
}

.formtype2 ::-moz-input-placeholder{
   color: rgba(255,255,255,0.6);
}

.formtype2 .form_text{
    color: #ffffff;
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 400;
    margin-top:2px;
}




.formtype3 input[type=button]{
	min-width: 150px;
	max-width: 95%;
	height: 35px;
	background: rgba(134, 88, 112, 0.6);
	border: 1px solid rgba(162, 151, 157, 0.3);
	cursor: pointer;
	border-radius: 2px;
	color: #ffffff;
	font-family: 'Exo', sans-serif;
	font-size: 16px;
	font-weight: 400;
	padding: 6px;
    margin-bottom: 10px;
    transition: all .2s ease-out !important;
}

.formtype3 input[type=button]:hover{
	background: rgb(113, 58, 87);
    transition: all .2s ease-out !important;
}

.formtype3 input[type=button]:active{
	opacity: 0.8;
}

.formtype3 input[type=button]:focus{
	outline: none;
}




.modal_message_header div {
    color: #fff;
    font-family: 'Exo', sans-serif;
    font-size: 2em;
    font-weight: 200;
    margin-bottom: 10px;

}

.modal_message_header div span {
    color: rgba(252, 164, 209, 1) !important;
}


.modal_message_content {
    width: 100%
    color: #fff;
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 200;
    margin-bottom: 12px;
}

.modal_message_content a {
  color: rgba(252, 164, 209, 1) !important;
  cursor: pointer;
}



.form_header div {
    color: #fff;
    font-family: 'Exo', sans-serif;
    font-size: 2.2em;
    font-weight: 200;
    margin-bottom: 10px;

}

.form_header div span {
    color: rgba(252, 164, 209, 1) !important;
}

.form_footer {
  margin-top: 20px;
}

.form_footer div {
    width: 100%;
    color: #fff;
    font-family: 'Exo', sans-serif;
    font-size: .7em;
    font-weight: 200;

}

.form_footer span:hover {
  color: rgba(252, 164, 209, 1) !important;
  cursor: pointer;
}


.form_response {
    width: 100%
    color: #fff;
    font-family: 'Exo', sans-serif;
    font-size: .8em;
    font-weight: 200;
    margin-bottom: 12px;
}

.form_response a {
  color: rgba(252, 164, 209, 1) !important;
  cursor: pointer;
}





.form2_header div {
    color: #fff;
    font-family: 'Exo', sans-serif;
    font-size: 25px;
    font-weight: 200;
    margin-bottom: 10px;

}

.form2_header div span {
    color: rgba(252, 164, 209, 1) !important;
}

.form2_footer {
  margin-top: 20px;
}

.form2_footer div {
    width: 100%;
    color: #fff;
    font-family: 'Exo', sans-serif;
    font-size: .8em;
    font-weight: 200;

}

.form2_footer span:hover {
  color: rgba(252, 164, 209, 1) !important;
  cursor: pointer;
}


.form2_response {
    width: 100%
    color: #fff;
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 200;
    margin-bottom: 12px;
}

.form2_response a {
  color: rgba(252, 164, 209, 1) !important;
  cursor: pointer;
}



.form_support {
    width: 100%
    color: #fff;
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 200;
    margin-bottom: 12px;
}

.form_support a {
  color: rgba(252, 164, 209, 1) !important;
  cursor: pointer;
}




.red {
  color: red;
}
.yellow {
  color: yellow;
}
.orange {
  color: orange;
}
.green {
  color: green;
}
.pink {
  color: rgba(252, 164, 209, 1) !important;
}
.light_pink {
  color: rgba(231, 196, 231, 1) !important;
}


.grey {
  color: #212121;
}

.grey_bg {
  background-color: #212121;
}

.grey_bg_tr {
  background-color: rgba(33, 33, 33, .7) !important;
}

.gold {
  color: #d8b300 !important;
}

.silver {
  color: #a3abf9 !important;
}

.bronze {
  color: #a07e54 !important;
}


.form_error {
  color: #ec7575 !important;
}

.form_ok {
  color: #ffd0ed !important;
}





.mySlides {
        display: none;
        animation-fill-mode: forwards;
        }


/* Slideshow  */
.slideshow-container
{
  max-width: 1000px;
  position: relative;
  margin: auto;
}


/* Text */


.text_header
{
  position: absolute;
  color: #ffffff;
  font-weight: 200;
  font-size: 1.5em;
  display: block;

  padding: 0;
  margin-left: 50px;
  cursor:default;
}

.text_body
{

  color: #ffffff;
  font-size: 0.9em;
  margin-left: 50px;
  margin-right: 50px;



}


/* The dots */

.dot-container {
    text-align: center;
    padding: 20px;
   background-color: #212121;
}

.dot
{
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.sactive, .dot:hover
{
  background-color: #717171;
  height: 17px;
  width: 17px
}

/* Fading animation */
.fade
{
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade
{
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade
{
  from {opacity: .4}
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px)
{
  .text {font-size: 11px}
}




.floating_half_container
{
  width:98%;
  margin: 0 auto;
  margin-top: 10px;
  flex-direction: row;
  align-items: stretch;

  justify-content: space-between;


}


.floating_half
{
  margin-bottom: 8px;
  transition: left 0.2s ease 0s, top 0.2s ease 0s, width 0.2s ease 0s, height 0.2s ease 0s !important;
}

.half_left
{
  order: 1;
}

.half_right
{
  order: 2;
}







.shadow
{
  box-shadow: 0px 5px 5px rgba(12,12,12,0.3), 0px 6px 6px rgba(12,12,12,0.15), 0px -1px 0px rgba(255,255,255,0.1) inset, 0px 1px 0px rgba(255,255,255,0.1) inset, -1px 0px 0px rgba(255,255,255,0.1) inset, 1px 0px 0px rgba(255,255,255,0.1) inset;
}


.floating_half_inner
{
  padding:2%;
  width: 100%;

  position:relative;
}

.floating_wide_inner
{
  padding:2%;
  width: 100%;

  position:relative;
}


.panel_shadow_wide
{
  float:left;
  margin-top:8px;
  width: 98%;
  margin-left: 1%;
  margin-bottom: 10px;

  box-shadow: 0px 5px 5px rgba(12,12,12,0.3), 0px 6px 6px rgba(12,12,12,0.15), 0px -1px 0px rgba(255,255,255,0.1) inset, 0px 1px 0px rgba(255,255,255,0.1) inset, -1px 0px 0px rgba(255,255,255,0.1) inset, 1px 0px 0px rgba(255,255,255,0.1) inset;

}







.pop {
  transition: 0.2s;
}

.pop:hover {
  transform: scale(1.15);
}





.imgcontainer div {
      display: flex;
      justify-content: center;
      align-items: center;
      overflow:hidden;
    }




.imageoverlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0);
  transition: background 0.5s ease;
}


.profileimageoverlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  background: rgba(0, 0, 0, 0);
  transition: background 0.5s ease;
}

.profileimageoverlay:hover {
  opacity: 1;
  background: rgba(0, 0, 0, .5);
}


.imagecontainer:hover .imageoverlay {
  display: block;
  background: rgba(0, 0, 0, .4);
}


.imagebutton {
  position: absolute;
  left:auto;
  top: auto;
  text-align: center;
  opacity: 0;
  transition: opacity .35s ease;
}

.imagecontainer:hover .imagebutton {
  opacity: 1;
}

.imgtoreveal{
 transition: transform .2s;
}

.imagecontainer:hover .imgtoreveal {
  transform: scale(1.05);
}

.imgtoreveal_new{
 transition: transform .2s;
}

.imagecontainer:hover .imgtoreveal_new {
  transform: scale(1.05);
}


.translucent_area {
  display:block;
  padding: 5px 10px 5px 10px;
  opacity: 0.8;
  background: rgba(0,0,0,0.25);
  border-radius: .3rem .3rem .3rem .3rem;
}

.translucent_area_slim {
  display:block;
  padding: 0px 5px 0px 5px;
  opacity: 0.8;
  background: rgba(0,0,0,0.25);
  border-radius: .3rem .3rem .3rem .3rem;
}

.translucent_area_dark {
  display:block;
  padding: 5px 10px 5px 10px;
  opacity: 1;
  background: rgba(0,0,0,0.55);
  border-radius: .3rem .3rem .3rem .3rem;
}

.translucent_area_dark_square {
  display:block;
  padding: 5px 10px 5px 10px;
  opacity: 1;
  background: rgba(0,0,0,0.65);
}


.translucent_select{
    border: 1px solid rgba(255,255,255,0.3);
    text-shadow: 2px 3px 3px rgba(0,0,0,0.3);
    padding-left: 5px;
    padding-right: 5px;
    margin: 3px;
    color: #ffffff;
    font-family: 'Exo', sans-serif;
    font-size: 1.19em;
    font-weight: 300;
    background-color: transparent !important;
    //-webkit-appearance: none;
    //-moz-appearance: none;
}


.translucent_select option{
    color: #ffffff;
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 300;
    background: #000000;
}

.translucent_select:focus{
  outline:none;
}


.translucent_select_discrete{
    border: 1px solid rgba(255,255,255,0.2);
    text-shadow: 2px 3px 3px rgba(0,0,0,0.3);
    padding-left: 5px;
    padding-right: 5px;
    margin: 3px;
    color: #ffffff;
    font-size: 16px;
    background-color: transparent !important;
    -webkit-appearance: none;
    -moz-appearance: none;
}


.translucent_select_discrete option{
    color: #ffffff;
    background: #000000;
}

.translucent_select_discrete:focus{
  outline:none;
}


.translucent_edit{
    border: 1px solid rgba(255,255,255,0.3);
    text-shadow: 2px 3px 3px rgba(0,0,0,0.3);
    padding-left: 5px;
    padding-right: 5px;
    margin: 3px;
    color: #ffffff;
    font-family: 'Exo', sans-serif;
    font-size: 1.19em;
    font-weight: 300;
    background-color: transparent !important;
    //-webkit-appearance: none;
    //-moz-appearance: none;
}

.translucent_edit:focus{
  outline:none;
}


.rotating-css {
    animation: rotating 2s linear;
    animation-iteration-count: infinite;
}

@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}



@keyframes fadeinout {
  from { opacity: 0; }
  50% { opacity: 0.35; }
  to { opacity: 0; }
}


.pulsating {
  background: #000000;
  -webkit-animation: fadeinout 1s infinite ease-in-out;
  -o-animation: fadeinout 1s infinite ease-in-out;
  -ms-animation: fadeinout 1s infinite ease-in-out;
  -moz-animation: fadeinout 1s infinite ease-in-out;
  animation: fadeinout 1s infinite ease-in-out;
}


.wrapper_limit{
  max-width: 1600px;
  margin-right: auto;
  margin-left: auto;
}





.test_container{
  width: 90%;
  height: 150px;
  position: relative;
  margin-right: auto;
  margin-left: auto;
}




.test_row {
  display: flex; width:100%
  flex: 1;
  opacity: 0;
}
.test_columns{
  display: flex;
  flex:1;
}
.test_col2{
  flex: 1;
  order: 2;
}
.test_col1{
  min-width: 20%;
  order: 1;

  color: #fff;
  font-family: 'Exo', sans-serif;
  font-size: .9em;
  font-weight: 300;
}
.test_col3{
  width: 10%;
  order: 3;

  color: #fff;
  font-family: 'Exo', sans-serif;
  font-size: 1.1em;
  font-weight: 300;
}

.test_col3_smaller{
  width: 10%;
  order: 3;

  color: #fff;
  font-family: 'Exo', sans-serif;
  font-size: 1em;
  font-weight: 300;
}


.con{
  position: absolute;
  top: 13px;
  left: 5px;
  width: 95%;
  height: 1px;
  background: #fff;
}

.byte1{
  position: relative;
  top: 10px;
  left: 0px;
  height: 9px;
  width: 9px;
  background: #fff;
  border-radius: 360px;
  z-index: 6;
  opacity: 0;
  -webkit-animation: byte_animate 1.0s infinite linear 0.5s;
  -moz-animation: byte_animate 1.0s infinite linear 0.5s;
  -o-animation: byte_animate 1.0s infinite linear 0.5s;
  animation: byte_animate 1.0s infinite linear 0.5s;
}

.byte2{
  position: relative;
  top: 10px;
  left: 0px;
  height: 9px;
  width: 9px;
  background: #fff;
  border-radius: 360px;
  z-index: 6;
  opacity: 0;
  -webkit-animation: byte_animate 1.5s infinite linear 0.5s;
  -moz-animation: byte_animate 1.5s infinite linear 0.5s;
  -o-animation: byte_animate 1.5s infinite linear 0.5s;
  animation: byte_animate 1.5s infinite linear 0.5s;
}

.byte3{
  position: relative;
  top: 10px;
  left: 0px;
  height: 9px;
  width: 9px;
  background: #fff;
  border-radius: 360px;
  z-index: 6;
  opacity: 0;
  -webkit-animation: byte_animate 2s infinite linear 0.5s;
  -moz-animation: byte_animate 2s infinite linear 0.5s;
  -o-animation: byte_animate 2s infinite linear 0.5s;
  animation: byte_animate 2s infinite linear 0.5s;
}



/*Byte Animation*/
@-webkit-keyframes byte_animate{
  0%{
    opacity: 0;
    left: 3%;
  }
  4%{
    opacity: 1;
  }
  46%{
    opacity: 1;
  }
  50%{
    opacity: 0;
    left: 95%;
  }
  54%{
    opacity: 1;
  }
  96%{
    opacity: 1;
  }
  100%{
    opacity: 0;
    left: 3%;
  }
}

@-moz-keyframes byte_animate{
  0%{
    opacity: 0;
    left: 3%;
  }
  4%{
    opacity: 1;
  }
  46%{
    opacity: 1;
  }
  50%{
    opacity: 0;
    left: 95%;
  }
  54%{
    opacity: 1;
  }
  96%{
    opacity: 1;
  }
  100%{
    opacity: 0;
    left: 3%;
  }
}

@-o-keyframes byte_animate{
  0%{
    opacity: 0;
    left: 3%;
  }
  4%{
    opacity: 1;
  }
  46%{
    opacity: 1;
  }
  50%{
    opacity: 0;
    left: 95%;
  }
  54%{
    opacity: 1;
  }
  96%{
    opacity: 1;
  }
  100%{
    opacity: 0;
    left: 3%;
  }
}

@keyframes byte_animate{
  0%{
    opacity: 0;
    left: 3%;
  }
  4%{
    opacity: 1;
  }
  46%{
    opacity: 1;
  }
  50%{
    opacity: 0;
    left: 95%;
  }
  54%{
    opacity: 1;
  }
  96%{
    opacity: 1;
  }
  100%{
    opacity: 0;
    left: 3%;
  }
}


.sectionheader {
  position: relative;
  display: flex;
  top:0;
  left:0;
  width:100%;
  height:30px;
  border: 1px solid #383838;
  padding: 2px;
  background-color: #1f1f1f;
  text-align:left;
}

.sectiontitle {
  text-transform:uppercase;
  display: inline-block;
  margin-left:5px;
  color: #777777;
  font-family: 'Exo', sans-serif;
  font-weight: 400;
  transition: 0.2s;
  flex:2;
}



.dashboard_item {
  position: relative;
  display:inline-block;
  min-height:100px;
  padding: 10px 0px 10px 0px;
  opacity: 0.8;
  background: rgba(0,0,0,0.17);
  border-radius: .4rem .4rem .4rem .4rem;
  margin-top:5px;
  overflow: hidden;
  transition: left 0.2s ease 0s, top 0.2s ease 0s, width 0.2s ease 0s, height 0.2s ease 0s !important;

}

.dashboard_value {
  position: absolute;
  width:100%;
  top: 60%;
  text-align: center;

  transform: translateY(-50%);

  font-family: 'Exo', sans-serif;
  font-size: 2em;
  font-weight: 350;
  transition: all .2s ease-out !important;

}

.dashboard_value:hover{
  transform: scale(1.15) translateY(-45%);
}




.dashboard_title {
  position: relative;
  text-align: center;
  width:100%;
  font-family: 'Exo', sans-serif;
  font-size: .9em;
  font-weight: 300;
  float: left;
}



.dashboard_container {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    height:100%;
}



.dashboard_top {
  position: relative;
  width:100%;
  order: 1;
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;
}

.dashboard_bottom {
    order: 2;
    width:100%;
    flex:1;
    transition: all .2s ease-out !important;
}

.account_status {
  width:100%;
  margin-top:8px;
}

.account_status_row {
  width:100%;

  font-family: 'Exo', sans-serif;
  font-weight: 300;

  display:flex;
  flex-direction: row;
  justify-content: center;

}

.account_status_col_left {
  order: 1;
  min-width: 65%;
  overflow: hidden;
  padding-left:5%;
}

.account_status_col_right {
  order: 2;
  min-width: 25%;
  overflow: hidden;
  transition: all .2s ease-out !important;
}

.account_status_col_right:hover {
    transform: scale(1.2) translateX(+5%);
    transition: all .2s ease-out !important;
}


.account_status_sign {
  font-size: 1.3em;
  position:relative;
  top: 3px;
}

.account_status_spacer {
  width:100%;
  min-height:14px;
  max-height:14px;
}


.button_webcam {
  display:inline-block;
  text-align: center;
  width: 250px;
  max-width:48%;
  padding: 5px 5px 5px 5px;
  font-family: 'Exo', sans-serif;
  font-weight: 350;
  cursor: pointer;
  opacity: 0.9;
  background: rgba(0,0,0,0.2);
  border: 1px solid #423f3f;
  border-radius: .3rem .3rem .3rem .3rem;
  transition: all .2s ease-out !important;
}

.button_webcam:hover {
  opacity: 1;
  background: rgba(82, 67, 77,0.1);
  border: 1px solid #504d4d;

}


.button_form {
  display:inline-block;
  text-align: center;
  width: 250px;
  max-width:48%;
  padding: 5px 5px 5px 5px;
  font-family: 'Exo', sans-serif;
  font-size: 1em;
  font-weight: 350;
  cursor: pointer;
  opacity: 0.9;
  background: rgba(0,0,0,0.2);
  border: 1px solid #423f3f;
  border-radius: .3rem .3rem .3rem .3rem;
  transition: all .2s ease-out !important;
}

.button_form:hover {
  opacity: 1;
  background: rgba(82, 67, 77,0.1);
  border: 1px solid #504d4d;

}


.checkbox_flag {
  opacity: 0.4;
  width:100%;
  position: relative;
  display:inline-block;
  padding: 3px 10px 3px 10px;
  border: 1px solid #3c3c3c;
  border-radius: .2rem .2rem .2rem .2rem;
  margin-top:5px;
  overflow: hidden;
  cursor:pointer;
  transition: visibility 0s 0s, left 0.2s ease 0s, top 0.2s ease 0s, width 0.2s ease 0s, height 0.2s ease 0s, opacity 0.2s ease 0s !important;

}


.checkbox_flag:hover {
  opacity: 1;
  transition: all .2s ease-out !important;
}

.checkbox_checked {
  opacity: 1;
  background: rgba(0,0,0,0.1);
  border: 1px solid #8e8e8e;
}


#vmap {
padding-bottom:10px;
}

.jqvmap-label
{
	position: absolute;
	display: none;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background: #292929;
	color: white;
	font-family: sans-serif, Verdana;
	font-size: smaller;
	padding: 3px;
  pointer-events:none;
}
.jqvmap-pin {
  pointer-events:none;
}
.jqvmap-zoomin, .jqvmap-zoomout
{
	position: absolute;
	left: 10px;
	color: #a0a0a0;
        display:block;
        text-align: center;
        width:35px;
        height:35px;
        padding:-20px 3px 3px 3px;
        font-family: 'Exo', sans-serif;
        font-size: 1.6em;
        font-weight: 450;
        cursor: pointer;
        opacity: 0.7;
        background: rgba(0,0,0,0.2);
        border: 1px solid #423f3f;
        border-radius: .3rem .3rem .3rem .3rem;
        transition: all .2s ease-out !important;


}

.jqvmap-zoomin:hover, .jqvmap-zoomout:hover {
  opacity: 1;
  background: rgba(0,0,0,0.5);
  color: #ffffff;
  border: 1px solid #635f5f;
  transition: all .2s ease-out !important;
}

.jqvmap-zoomin
{
	top: 10px;
}
.jqvmap-zoomout
{
	top: 50px;
}
.jqvmap-region
{
  cursor: pointer;
}
.jqvmap-ajax_response
{
  width: 100%;
  height: 500px;
}

.map_legend {
    padding:5px;
    position: absolute;
    left: 15px;
    bottom:15px;
    background: rgba(0,0,0,0.2);

}

.map_legend_row {

}

.map_color1 {
    display:inline-block;
    position:relative;
    top:3px;
    width: 15px;
    height: 15px;
    background-color: #634e5b;
}

.map_color2 {
    display:inline-block;
    position:relative;
    top:3px;
    width: 15px;
    height: 15px;
    background-color: #ae6894;
}

.map_legend_item {
    color: #a0a0a0;
    font-family: 'Exo', sans-serif;
    font-size: .9em;
    font-weight: 300;
}





.nosignal {
    min-height: 80vh;
    overflow: hidden;
}

nosignal_canvas {
    z-index: 1;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.caps {
    z-index: 2;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    animation: as 8s linear infinite;
}

.caps img {
    display: none;
    width: 100%;
    height: 85%;
}

@keyframes as {
    0% {
        opacity: 0;
    }
    10% {
        opacity: .3;
    }
    20% {
        opacity: .1;
    }
    30% {
        opacity: .5;
    }
    40% {
        opacity: 0;
    }
    50% {
        opacity: .8;
    }
    55% {
        opacity: 0;
    }
    55% {
        opacity: 0;
    }
}

.frame {
    z-index: 3;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: -moz-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 19%, rgba(0, 0, 0, 0.9) 100%); /* FF3.6+ */
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(19%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.9))); /* Chrome,Safari4+ */
    background: -webkit-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 19%, rgba(0, 0, 0, 0.9) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 19%, rgba(0, 0, 0, 0.9) 100%); /* Opera 12+ */
    background: -ms-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 19%, rgba(0, 0, 0, 0.9) 100%); /* IE10+ */
    background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 19%, rgba(0, 0, 0, 0.9) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#00000000', endColorstr = '#e6000000', GradientType = 1); /* IE6-9 fallback on horizontal gradient */

}

.frame div {
    position: absolute;
    left: 0;
    top: -20%;
    width: 100%;
    height: 20%;
    background-color: rgba(0, 0, 0, .12);
    box-shadow: 0 0 10px rgba(0, 0, 0, .3);
    animation: asd 12s linear infinite;
}

.frame div:nth-child(1) {
    animation-delay: 0;
}

.frame div:nth-child(2) {
    animation-delay: 4s;
}

.frame div:nth-child(3) {
    animation-delay: 8s;
}

@keyframes asd {
    0% {
        top: -20%;
    }
    100% {
        top: 100%;
    }
}

.nosignal h1 {
    z-index: 3;
    position: absolute;
    font-family: 'Exo', sans-serif;
    font-size: 12em;
    font-weight: 600;
    left: 50%;
    top: 35%;
    margin-top: -100px;
    width: 100%;
    margin-left: -50%;
    height: 200px;
    text-align: center;
    color: transparent;
    text-shadow: 0 0 30px rgba(0, 0, 0, .5);
    animation: asdd 2s linear infinite;
}


.nosignal h2{
  z-index: 3;
    position: absolute;
    font-family: 'Exo', sans-serif;
    font-size: 8em;
    font-weight: 600;
    left: 50%;
    top: 55%;
    margin-top: -100px;
    width: 100%;
    margin-left: -50%;
    height: 200px;
    text-align: center;
    color: transparent;
    text-shadow: 0 0 30px rgba(0, 0, 0, .5);
    animation: asdd 2s linear infinite;
}

@keyframes asdd {
    0% {
        text-shadow: 0 0 30px rgba(0, 0, 0, .5);
    }
    33% {
        text-shadow: 0 0 10px rgba(0, 0, 0, .4);
    }
    66% {
        text-shadow: 0 0 20px rgba(0, 0, 0, .2);
    }
    100% {
        text-shadow: 0 0 40px rgba(0, 0, 0, .8);
    }
}


#div_fixed_bottom {
   position: fixed;
   bottom: 0;
   max-width: 100vw;
   max-height:70vh;
   overflow: hidden;
   z-index:30000;
   background: rgba(0,0,0, 0.55);
}

.media {
   min-width: 70vw;
   margin-left:20px;
   margin-right:20px;
   margin-top:3px;
   margin-bottom:3px;
   padding-left: 5px;
   padding-right: 5px;
   border: 1px solid rgba(255,255,255,0.3);
   border-radius: .5rem .5rem .5rem .5rem;
}

.showonhover {
   display:none;
   transition: all .2s ease-out !important;
}

.showonhover:hover {
   display:inline-block;
}


#status_contract_signed_row {
  cursor:pointer;
}
#status_docs_uploaded_row {
  cursor:pointer;
}
#status_docs_approved_row {
  cursor:pointer;
}
#status_id_validity_row {
  cursor:pointer;
}
#status_public_profile_row {
  cursor:pointer;
}
#status_payout_information_row {
  cursor:pointer;
}
#status_profile_picture_row {
  cursor:pointer;
}
#status_gallery_pictures_row {
  cursor:pointer;
}
#status_gallery_videos_row {
  cursor:pointer;
}
#status_ref_program_row {
  cursor:pointer;
}


.full_on_hover {
    opacity: 0.4;
    transition: all .2s ease-out !important;
}

.full_on_hover:hover {
    opacity: .9;
    transition: all .2s ease-out !important;
}


.performer_info_username{
    font-family: 'Exo', sans-serif;
    font-size: 1.8em;
    font-weight: 400;
}

.performer_info_age{
    font-family: 'Exo', sans-serif;
    font-size: 1.6em;
    font-weight: 200;
}


.performer_info_description{
    width:100%;
    max-height: 500px;
    padding-top:20px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 10px;
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    font-family: 'Exo', sans-serif;
    font-size: 1.2em;
    font-weight: 100;
}


.performer_info_comments{
    width:100%;
    max-height: 400px;
    padding-top:20px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 100;
}

.performer_info_comment{
      display: inline-block;
      position: relative;
      margin-top: 1px;
      margin-left: 2px;
      margin-right: 2px;
      width: auto;
      padding :3px 3px 3px 7px;
      font-family: 'Exo', sans-serif;
      font-size: 1em;
      font-weight: 300;
      color: #a7a7a7;
      text-align: left;
      word-wrap: break-word;
      background: rgba(0,0,0,.85);
      border: 1px solid rgba(248, 213, 255, 0.2);
      border-radius: .5rem .5rem .5rem .5rem;
}

.performer_info_comment:hover{
    color: #ffffff;
    border: 1px solid rgba(248, 213, 255, 0.4);

}

.performer_info_comment_wrapper {
    width:100%;
    padding-bottom:8px;
}


.performer_info_details{
    width:100%;
    padding-top:10px;
    padding-left: 15px;
    padding-right: 15px;
    font-family: 'Exo', sans-serif;
    font-size: 1.3em;
    font-weight: 400;
}

.performer_info_languages{
    width:100%;
    padding-top:10px;
    padding-left: 15px;
    padding-right: 15px;
    font-family: 'Exo', sans-serif;
    font-size: 1.4em;
    font-weight: 400;
}

.performer_info_flags {
    width:45px;
    height:40px;
    margin-left:7px;
    opacity: 0.8;
    transition: all .2s ease-out !important;
}

.performer_info_flags:hover {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -ms-transition: all 140ms ease-in;
    -ms-transform: scale(1.1);
    -moz-transition: all 140ms ease-in;
    -moz-transform: scale(1.1);
    transition: all 140ms ease-in;
    transform: scale(1.1);

    transition: all .2s ease-out !important;
}


.box_info {
    padding:10px;
    color: rgba(255,255,255, 0.8);
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 200;
    background: rgba(0,0,0, 0.05);
    border: 1px solid rgba(82, 67, 77,0.1);
}

.box_info_small {
    padding:10px;
    color: rgba(255,255,255, 0.6);
    font-family: 'Exo', sans-serif;
    font-size: .8em;
    font-weight: 200;
    background: rgba(0,0,0, 0.03);
    border: 1px solid rgba(82, 67, 77,0.1);
}

.vamiddle {
    vertical-align: middle;
}




.article {
    padding:1%;
    margin:1%;
    color: rgba(255,255,255, 1);
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 200;
    background: rgba(0,0,0, 0.05);
    border: 1px solid rgba(82, 67, 77,0.3);
}


.article_title {
    font-size: 1.6em;
    font-weight: 400;
}

.article_author {
    font-size: 1em;
    font-weight: 300;
}

.article_time {
    font-size: .8em;
    font-weight: 200;
}

.article_content {
    padding-top:15px;

}

.article_content b {
    color: #ffa7de;
}

.article_content a:link, .article_content a:visited, .article_content a:active {
    color: #ffa7de;
    text-decoration: none;
    transition: all 140ms ease-in;
}

.article_content a:hover {
    color: #ffa7de;
    text-decoration: none;
    transition: all 140ms ease-in;
    transform: scale(1.1);
}





.modal_div_credit {
  color: #ffffff;
  font-size: 1.2em;
  font-weight: 600;
  margin: 0 auto;
  padding: 10px;
  width: 950px;
  max-width: 95vw;
  background: rgba(0,0,0,0.6);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: .5rem .5rem .5rem .5rem;
  position: relative;
  margin: auto auto;

}

.modal_div_credit_light {
  color: #ffffff;
  font-size: 1.2em;
  font-weight: 600;
  margin: 0 auto;
  padding: 10px;
  width: 950px;
  max-width: 95vw;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: .5rem .5rem .5rem .5rem;
  position: relative;
  margin: auto auto;

}


.modal_div_work_as_model {
  color: #ffffff;
  font-size: 1.2em;
  font-weight: 600;
  margin: 0 auto;
  padding: 10px;
  width: 950px;
  max-width: 95vw;
  background: rgba(0,0,0,0.5);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: .5rem .5rem .5rem .5rem;
  position: relative;
  margin: auto auto;

}


.modal_div_languages {
  color: #ffffff;
  font-size: 1.2em;
  font-weight: 600;
  margin: 0 auto;
  padding: 10px;
  width: 800px;
  max-width: 95vw;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: .5rem .5rem .5rem .5rem;
  position: relative;
  margin: auto auto;

}

.modal_div_advance_payment {
  color: #ffffff;
  font-size: 1.2em;
  font-weight: 600;
  margin: 0 auto;
  padding: 10px;
  width: 800px;
  max-width: 95vw;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: .5rem .5rem .5rem .5rem;
  position: relative;
  margin: auto auto;

}

.modal_div_referral_invite {
  color: #ffffff;
  font-size: 1.2em;
  font-weight: 600;
  margin: 0 auto;
  padding: 10px;
  width: 800px;
  max-width: 95vw;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: .5rem .5rem .5rem .5rem;
  position: relative;
  margin: auto auto;

}


.modal_div_clients_support {
  color: #ffffff;
  font-size: 1.2em;
  font-weight: 600;
  margin: 0 auto;
  padding: 10px;
  width: 950px;
  max-width: 95vw;
  background: rgba(0,0,0,0.6);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: .5rem .5rem .5rem .5rem;
  position: relative;
  margin: auto auto;

}


.languages_container {

    position: relative;
    width:100%;
    text-align: center;
    padding: 15px;
}


.languages_row {
    width:100%;
    display:flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}


.buy_credit_container {

    position: relative;
    width:100%;
    text-align: center;
    padding: 15px;
}


.work_as_model_container {

    position: relative;
    width:100%;
    text-align: center;
    padding: 15px;

    font-family: 'Exo', sans-serif;
    font-size: 1.1em;
    font-weight: 350;
}

.buy_credit_row {
    width:100%;
    display:flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}


.buy_credit_button {
    width:150px;
    height:150px;
    opacity: 0.8;
    background: rgba(0,0,0,0.6);
    border: 1px solid rgba(255, 255, 255, 0.20);
    border-radius: .5rem .5rem .5rem .5rem;
    cursor:pointer;
    margin: 7px;
    transition: all 0.2s ease-out !important;
}

.buy_credit_button:hover {
    opacity: 1;
    background: rgba(0,0,0,0.75);
    border: 1px solid rgba(255, 255, 255,0.4);
    transition: all 0.2s ease-out !important;
    transform: scale(1.07);
}


.send_gift_button {
    width:150px;
    height:150px;
    opacity: 0.8;
    background: rgba(0,0,0,0.6);
    border: 1px solid rgba(255, 255, 255, 0.20);
    border-radius: .5rem .5rem .5rem .5rem;
    cursor:pointer;
    margin: 7px;
    transition: all 0.2s ease-out !important;
}

.send_gift_button:hover {
    opacity: 1;
    background: rgba(0,0,0,0.75);
    border: 1px solid rgba(255, 255, 255,0.4);
    transition: all 0.2s ease-out !important;
    transform: scale(1.07);
}


.buy_credit_method {
    width:130px;
    height:100px;
    opacity: 0.8;
    background: rgba(0,0,0,0.5);
    border: 1px solid rgba(255, 255, 255, 0.20);
    border-radius: .5rem .5rem .5rem .5rem;
    cursor:pointer;
    margin: 7px;
    transition: all 0.2s ease-out !important;
}

.buy_credit_method:hover {
    opacity: 1;
    background: rgba(0,0,0,0.75);
    border: 1px solid rgba(255, 255, 255,0.4);
    transition: all 0.2s ease-out !important;
    transform: scale(1.07);
}


.language_item {
    width:100px;
    height:90px;
    overflow:hidden;
    opacity: 0.7;
    background: rgba(0,0,0,0.5);
    border: 1px solid rgba(255, 255, 255, 0.20);
    border-radius: .5rem .5rem .5rem .5rem;
    cursor:pointer;
    margin: 7px;
    transition: all 0.2s ease-out !important;
}

.language_item:hover {
    opacity: 1;
    background: rgba(0,0,0,0.75);
    border: 1px solid rgba(255, 255, 255,0.4);
    transition: all 0.2s ease-out !important;
    transform: scale(1.07);
}


.processor_button {
    width:130px;
    height:130px;
    opacity: 0.8;
    background: rgba(0,0,0,0.5);
    border: 1px solid rgba(255, 255, 255, 0.20);
    border-radius: .5rem .5rem .5rem .5rem;
    cursor:pointer;
    margin: 7px;
    transition: all 0.2s ease-out !important;
}

.processor_button:hover {
    opacity: 1;
    background: rgba(0,0,0,0.75);
    border: 1px solid rgba(255, 255, 255,0.4);
    transition: all 0.2s ease-out !important;
    transform: scale(1.07);
}




.buy_credit_minutes {
    position: relative;
    width:100%;
    top:-3px;
    text-align: center;
    font-family: 'Exo', sans-serif;
    font-size: 2.8em;
    font-weight: 350;

}

.buy_credit_text {
    position: relative;
    top:-28px;
    width:100%
    text-align: center;
    font-family: 'Exo', sans-serif;
    font-size: 1.5em;
    font-weight: 200;

}

.buy_credit_description {
    position: relative;
    top:-36px;
    width:100%
    text-align: center;
    font-family: 'Exo', sans-serif;
    font-size: 0.7em;
    font-weight: 150;

}

.buy_credit_price {
    position: relative;
    top:-36px;
    width:100%
    text-align: center;
    font-family: 'Exo', sans-serif;
    font-size: 1.4em;
    font-weight: 350;

}

.buy_credit_vat {
    font-family: 'Exo', sans-serif;
    font-size: 0.6em;
    font-weight: 150;

}


.payment_method_font1 {
    font-size: 60px;
    font-weight: 350;

}

.payment_method_image {
    margin 0 auto;
}

.processor_text {
    position: relative;
    width:100%;
    text-align: center;
    font-family: 'Exo', sans-serif;
    font-size: .7em;
    font-weight: 450;

}

#action_result {
    position: relative;
    width:100%;
    text-align: center;
    font-family: 'Exo', sans-serif;
    font-size: 1.2em;
    font-weight: 350;
}

.buy_credit_row a:link, .buy_credit_row a:visited, .buy_credit_row a:active {
    color: #ffffff;
    text-decoration: none;
}


.send_gift_logo {
    position: relative;
    top:-26px;
    opacity: 0.7;
    width:100%
    text-align: center;
    font-family: 'Exo', sans-serif;
    font-size: 2.1em;

}

.send_gift_image {
    position:relative;
    opacity: 0.7;
    top: -27px;
    margin 0 auto;
}



.language_icon {
    position:relative;
    padding-top:2px;
    padding-left:4px;
    padding-right:4px;
    height: 24px;
    top: 11px;
    opacity: 0.3;
    background: rgba(0,0,0,0.2);
    text-align: center;
    text-transform: uppercase;
    font-size: 0.8em;
    font-weight: 350;
    cursor:pointer;
    transition: all 0.2s ease-out !important;

}

.buzz_icon {
    position:relative;
    padding-top:2px;
    padding-left:4px;
    padding-right:4px;
    height: 24px;
    top: 12px;
    opacity: 0.3;
    background: rgba(0,0,0,0.2);
    text-align: center;
    text-transform: uppercase;
    font-size: 1em;
    font-weight: 350;
    cursor:pointer;
    transition: all 0.2s ease-out !important;

}



.language_icon:hover {
    opacity: 0.8;
    background: rgba(0,0,0,0.2);
    transition: all 0.2s ease-out !important;
    transform: scale(1.07);
}

.buzz_icon:hover {
    opacity: 0.8;
    background: rgba(0,0,0,0.2);
    transition: all 0.2s ease-out !important;
    transform: scale(1.07);
}


.language_flag_image_image {
    margin 0 auto;
}

.language_text {
    position: relative;
    top:-3px;
    width:100%
    text-align: center;
    font-family: 'Exo', sans-serif;
    font-size: 0.8em;
    font-weight: 300;

}


.languages_text {

    padding-top:10px;
    font-family: 'Exo', sans-serif;
    font-size: .9em;
    font-weight: 300;

}


.star_rate {
    font-size: 1.6em;
    padding-top:4px;
    padding-bottom:4px;
    cursor:pointer;
    transition: all 0.2s ease-out !important;
}

.star_rate:hover {
    transform: scale(1.22);
    transition: all 0.2s ease-out !important;
}


.btn_profile {
    font-size: 1.6em;
    padding-top:4px;
    padding-bottom:4px;
    cursor:pointer;
    margin-left:5px;
    transition: all 0.2s ease-out !important;
}

.btn_profile:hover {
    transform: scale(1.22);
    transition: all 0.2s ease-out !important;
}

.stars_text {
    padding-left:8px;
    padding-top:6px;
    padding-bottom:4px;
    font-family: 'Exo', sans-serif;
    font-size: 1.4em;
    font-weight: 300;
}




.table_row {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-content: space-around;
  width:100%;
  min-height: 30px;
  padding: 2px 2px 2px 5px;
  opacity: 0.8;
  background: rgba(0,0,0,0.17);
  margin-bottom: 3px;
  overflow: hidden;
  font-family: 'Exo', sans-serif;
  font-size: 1em;
  font-weight: 300;
  border: 1px solid rgba(255, 255, 255, 0.02);
  transition: left 0.2s ease 0s, top 0.2s ease 0s, width 0.2s ease 0s, height 0.2s ease 0s !important;

}

.table_row:hover {

  opacity: 1;
  background: rgba(0,0,0,0.27);
  border: 1px solid rgba(255, 255, 255, 0.10);
}


.table_column {

}

.no_payments {
    background: rgba(0,0,0,0.05);
    text-align: center;
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 300;
    border: 1px solid rgba(255, 255, 255, 0.04);

}

.no_referrals {
    background: rgba(0,0,0,0.05);
    text-align: center;
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 300;
    border: 1px solid rgba(255, 255, 255, 0.04);

}


#current_payment {
    text-align: center;
    color: #d6d6d6;
    font-family: 'Exo', sans-serif;
    font-size: 0.9em;
    font-weight: 300;
}

#advance_payment {
    text-align: center;
    color: #d6d6d6;
    font-family: 'Exo', sans-serif;
    font-size: 0.9em;
    font-weight: 300;
}


#referral_program {
    text-align: center;
    color: #d6d6d6;
    font-family: 'Exo', sans-serif;
    font-size: 0.9em;
    font-weight: 300;


}

.current_credit {
    font-size: 1em;
    font-weight: 400;
}

.current_credit_big {
    font-size: 1.7em;
    font-weight: 400;
}

.ref_link {
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 300;
    cursor:pointer;
    transition: all 0.2s ease-out !important;
}









#questions_container {

    display: inline-block;
    width:100%;
    max-height:500px;
    margin-top:4px;
    padding-right:15px;
    overflow-y: scroll;
}

#question_expanded {
    position: absolute;
    top:10%;
    left:5%;
    height:80%;
    width: 90%;
    z-index:100;
    background: rgba(27,27,27,0.87);
    border: 1px solid rgba(255,255,255,0.3);

}

#question_close {
  position: absolute;
  top: 5px;
  right:10px;
  font-size: 1.2em;
  cursor: pointer;
}

#question_container {
    width: 100%;
    height:100%;
}

#question_title {
    width: 100%;
    padding:35px 15px 0px 15px;
    font-family: 'Exo', sans-serif;
    font-size: 1.13em;
    font-weight: 400;
    text-align: center;
}

#question_body {
    width: 100%;
    max-height: 80%;
    padding:15px;
    margin-top:5px;
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 300;
    text-align: left;
    overflow-y: scroll;
}

#question_body b{
    color: rgba(252, 164, 209, 1) !important;
    font-weight: 400;
}


.transparent_button{
	width: 250px;
	max-width: 95%;
	height: 35px;
	background: rgba(255, 255, 255, 0);
	border: 1px solid rgba(255, 255, 255, 0.5);
	cursor: pointer;
	border-radius: 2px;
	color: #ffffff;
    text-transform:uppercase;
	font-family: 'Exo', sans-serif;
	font-size: 1.2em;
	font-weight: 350;
	padding: 2px 8px 2px 8px;
    opacity: 0.9;
    transition: all .2s ease-out !important;
}

.transparent_button:hover{
	background: rgb(255, 255, 255, 0);
    border: 1px solid rgba(255, 255, 255, 0.8);
    opacity: 1;
    transition: all .2s ease-out !important;
}

.transparent_button:active{
	opacity: 0.6;
}

.transparent_button:focus{
	outline: none;
}



.button_small{
	width: 200px;
	max-width: 95%;
	height: 25px;
	font-family: 'Exo', sans-serif;
	font-size: 0.9em;
	font-weight: 350;
	padding: 2px 8px 2px 8px;
}

.button_faded{
    opacity: 0.6;
}

.button_faded: hover{
    opacity: 1;
}



.transparent_fbutton{
	width: 250px;
	max-width: 95%;
	height: 35px;
	background: rgba(255, 255, 255, 0);
	border: 1px solid rgba(255, 255, 255, 0.5);
	cursor: pointer;
	border-radius: 2px;
	color: #ffffff;
    text-transform:uppercase;
	font-family: 'Exo', sans-serif;
	font-size: 1.2em;
	font-weight: 350;
	padding: 2px 8px 2px 8px;
    transition: all .2s ease-out !important;
}

.transparent_fbutton:hover{
	background: rgb(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.8);
    transition: all .2s ease-out !important;
}


.transparent_fbutton:focus{
	outline: none;
}


.fbutton_small{
	width: 200px;
	max-width: 95%;
	height: 25px;
	font-family: 'Exo', sans-serif;
	font-size: 1em;
	font-weight: 350;
	padding: 2px 8px 2px 8px;
}

.truncate {
  text-overflow: ellipsis;

  /* Needed to make it work */
  overflow: hidden;
  white-space: nowrap;
}

.pointer {
    cursor: pointer;
}

#div_botom_container {
    padding-top:15px;
    font-family: 'Exo', sans-serif;
    font-size: 0.94em;
    font-weight: 300;
}

.performers_slider {
    position: relative;
    width:100%;
    height:600px;
    background: rgb(33,33,33);
    background: linear-gradient(90deg, rgba(33,33,33,1) 0%, rgba(51,51,51,1) 41%, rgba(51,51,51,1) 68%, rgba(33,33,33,1) 100%);
}

.slider_model {
    opacity:0;
    position:absolute;
    top:0;
    left:70%;
    height:100%;
}

.slider_title {
    opacity:0;
    position: absolute;
    left:0px;
    top:15%;
    font-family: 'Exo', sans-serif;
    font-size: 2.2em;
    font-weight: 500;
    min-width:500px;
}

.slider_text1 {
    opacity:0;
    position: absolute;
    left:0;
    top:26%;
    width:45%;
    min-width:400px;
    max-height:12vw;
    overflow: hidden;
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 300;

}

.slider_buttons {
    opacity:0;
    position: absolute;
    left:2000px;
    bottom:10%;
}

.slider_features {
    opacity:0;
    position: absolute;
    left:0px;
    top:44%;
    text-align:left;
}

.slider_feature {
    opacity:0;
    width:100%;
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 300;
    transform-origin: top left;
    margin-bottom:6px;
}

.invisible {
    opacity:0;
}

.performers_block {
    padding:0px 40px 10px 40px;
    width:100%;
    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 300;
    text-align:center;
}

.performers_block_title {
    padding:00px 40px 10px 40px;
    width:100%;
    font-family: 'Exo', sans-serif;
    font-size: 1.4em;
    font-weight: 400;
    text-align:center;
}

.performers_parallax {
    margin-top:20px;
    position: relative;
    width:100%;
    height:60vh;
    min-height:550px;
    max-height:700px;
    overflow:hidden;
    }



.test img {
  position: absolute;
  top: 100px;
  left: 35%;
  width: 42%;
  transform: translateZ(.25px) scale(.75) translateX(-94%) translateY(-100%) rotate(2deg);
  padding: 10px;
  border-radius: 5px;
  background: rgba(240,230,220, .7);
  box-shadow: 0 0 8px rgba(0, 0, 0, .7);
}

.test img:last-of-type {
  transform: translateZ(.4px) scale(.8) translateX(-104%) translateY(-40%) rotate(-5deg);
}



.test * {
  text-align: center;
  margin: 0;
  padding: 1em 0;

}
.test p {
  background: linear-gradient(90deg, rgba(33,33,33,0.1) 0%, rgba(255,255,255,0.1) 41%, rgba(255,255,255,0.1) 68%, rgba(33,33,33,0.1) 100%);
  letter-spacing: 0.16em;
  padding: 1em 0;
}

.test .feather {
    background: linear-gradient(90deg, rgba(33,33,33,1) 0%, rgba(51,51,51,1) 41%, rgba(51,51,51,1) 68%, rgba(33,33,33,1) 100%);
}


.test h1 {
    letter-spacing: 0.1em;
    padding: 0.5em 0;

}

.terms_wrapper {

    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 250;

}

.terms_performers_wrapper {

    font-family: 'Exo', sans-serif;
    font-size: 1.1em;
    font-weight: 250;

}


#filter_div {
    display:none;
    position:fixed;
    z-index:200;
    right:10px;
    padding-left:100px;
    top: 60px;
    width:450px;
    max-width:95%;

    padding: 5px 10px 5px 10px;
    opacity: 0.8;
    background: rgba(0,0,0,0.8);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: .2rem .2rem .2rem .2rem;

    box-shadow: 0 0 8px rgba(0, 0, 0, .8);

    font-family: 'Exo', sans-serif;
    font-size: 1em;
    font-weight: 350;


}


.filter_line {
    display: flex;
    flex-direction: row;
    align-items: stretch; justify-content: space-between;
    width:96%;
    margin:2px;
    padding: 16px 14px 6px 10px;
    position: relative;
}

.filter_line_left {
    order:1;
    flex:1;
    font-size: 1.3em;
    padding-right:4px;
}

.filter_line_right {
    order:2;
    flex:10;
}

.filter_line_half_left {
    order:1;
    flex:1;
    font-size: 1.1em;
    padding-right:4px;
    overflow:hidden;
}

.filter_line_half_right {
    order:2;
    flex:1;
    font-size: 1.1em;
    padding-right:4px;
    overflow:hidden;
}



#client_webcam_div {
    display:none;
    position:fixed;
    z-index:5100;
    right:10px;
    top: 60px;
    width:30vw;
    height:16.875vw;
    max-width:95%;

    overflow:hidden;

    opacity: 1;
    background: rgba(0,0,0,0.6);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: .2rem .2rem .2rem .2rem;
    box-shadow: 0 0 8px rgba(0, 0, 0, .8);

    font-family: 'Exo', sans-serif;
    font-size: .8em;
    font-weight: 350;


}

#webcam_close {
    position: absolute;
    right:10px;
    top:5px;
    z-index:1000;
    cursor: pointer;
    font-family: "Open Sans",sans-serif;
    font-size: 1.4em;
    font-weight: 450;
}

#webcam_size {
    position: absolute;
    right:35px;
    top:7px;
    z-index:1000;
    cursor: pointer;
    font-family: "Open Sans",sans-serif;
    font-size: 1.1em;
    font-weight: 350;
}

#webcam_minimize {
    position: absolute;
    right:65px;
    top:5px;
    z-index:1000;
    cursor: pointer;
    font-family: "Open Sans",sans-serif;
    font-size: .9em;
    font-weight: 350;
}

#webcam_mute {
    position: absolute;
    right:10px;
    bottom:5px;
    z-index:1000;
    cursor: pointer;
    font-family: "Open Sans",sans-serif;
    font-size: 2.9em;
    font-weight: 350;
    opacity: 0.4;
    transition: all .2s ease-out !important;
}

#webcam_mute:hover {
    opacity: 1;
    transition: all .2s ease-out !important;
}


.offline_model {
    filter: grayscale(100%);
}

.translucent_bg {
    background: rgba(0,0,0,0.5);
    padding: 1px 10px 1px 10px;
}

.centered_message {
    display: inline-block;
	max-width: 95%;
	background: rgba(255, 255, 255, 0);
	border: 1px solid rgba(255, 255, 255, 0.5);
	border-radius: 2px;
	color: #ffffff;
    text-transform:uppercase;
	font-family: 'Exo', sans-serif;
	font-size: 1.5em;
	font-weight: 450;
	padding: 2px 12px 2px 12px;
    opacity: 1;
    transition: all .2s ease-out !important;
}




.modal_div_offline_messages {
  color: #ffffff;
  font-size: 1.1em;
  font-weight: 600;
  margin: 0 auto;
  padding: 20px;
  width: 95vw;
  max-width:1300px;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: .5rem .5rem .5rem .5rem;
  position: relative;
  margin: auto auto;

}

.modal_div_offline_messages_models {
  color: #ffffff;
  font-size: 1.1em;
  font-weight: 600;
  padding: 15px;
  width: 100%;
  position: relative;
  text-align: center;
}



#offline_messages_wrapper {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;

    height:90vh;
    max-height:600px;
    text-align:center;


    margin-right: auto;
    margin-left: auto;
    padding: 20px;

    overflow: hidden;

}

#offline_messages_wrapper_models {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;

    height:90vh;
    max-height:650px;
    text-align:center;


    margin-right: auto;
    margin-left: auto;
    padding: 20px;

    overflow: hidden;

}



#offline_messages_message_wrapper {

    padding-left:4px;

    width:100%;
    height:100%;

    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;

    overflow: hidden;

}


#offline_messages_contacts {

    padding:4px 15px 4px 4px;
    border: 1px solid rgba(255,255,255,0.12);

    font-family: 'Exo', sans-serif;
    font-size: 1.1em;
    font-weight: 400;
    color: #ffffff;

    overflow: hidden;

    background: rgba(0,0,0,0.3);

}


#offline_messages_contacts_models {

    padding:4px 15px 4px 4px;
    border: 1px solid rgba(255,255,255,0.12);

    font-family: 'Exo', sans-serif;
    font-size: 1.1em;
    font-weight: 400;
    color: #ffffff;

    overflow: hidden;

    background: rgba(0,0,0,0.1);

}


#offline_messages_message_top{
    display: block;

    border: 1px solid rgba(255,255,255,0.12);

    text-align: left;
    overflow-y: scroll;

    font-family: 'Exo', sans-serif;
    font-size: 1.1em;
    font-weight: 350;
    padding:20px;

    background: rgba(0,0,0,0.45);

}


#offline_messages_message_top_models{
    display: block;

    border: 1px solid rgba(255,255,255,0.12);

    text-align: left;
    overflow-y: scroll;

    font-family: 'Exo', sans-serif;
    font-size: 1.1em;
    font-weight: 350;
    padding:20px;

    background: rgba(0,0,0,0.1);

}


#offline_messages_message_bottom {

    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;

    margin-top:4px;
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(0,0,0,0.3);

}

#offline_messages_message_bottom_models {

    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;

    margin-top:4px;
    border: 1px solid rgba(255,255,255,0.1);

}

#offline_messages_message_bottom_left {

    display: inline-block;
    position: relative;
    margin: 6px;
    width: auto;
    padding :5px;
    font-family: 'Exo', sans-serif;
    font-size: .9em;
    font-weight: 400;
    color: #ffffff;
    text-align: left;
    word-wrap: break-word;

    border-radius: .5rem .5rem .5rem .5rem;

}

#offline_messages_message_bottom_left_models {

    display: inline-block;
    position: relative;
    margin: 6px;
    width: auto;
    padding :5px;
    font-family: 'Exo', sans-serif;
    font-size: .9em;
    font-weight: 400;
    color: #ffffff;
    text-align: left;
    word-wrap: break-word;
    background: rgba(0,0,0,0.1);
    border-radius: .5rem .5rem .5rem .5rem;

}

#offline_messages_message_bottom_right {



}


.offline_message_row {
    width:100%;
    float:left;
    padding: 10px 5px 10px 5px;
    text-align: center;
}

.offline_message_bubble_left {
    display: inline-block;
    max-width: 90%;
    float: left;
    position: relative;
    margin-top: 1px;
    margin-left: 2px;
    margin-right: 2px;
    width: auto;
    padding :12px;
    font-family: 'Exo', sans-serif;
    font-size: .9em;
    font-weight: 400;
    color: #ffffff;
    text-align: left;
    word-wrap: break-word;
    background: rgba(86,54,71,0.5);
    border-radius: .5rem .5rem .5rem .5rem;
}

.offline_message_bubble_right {
    display: inline-block;
    max-width: 90%;
    float: right;
    position: relative;
    margin-top: 1px;
    margin-left: 2px;
    margin-right: 2px;
    width: auto;
    padding :15px;
    font-family: 'Exo', sans-serif;
    font-size: .9em;
    font-weight: 400;
    color: #ffffff;
    text-align: left;
    word-wrap: break-word;
    background: rgba(56,56,56,0.5);
    border-radius: .5rem .5rem .5rem .5rem;
}

.offline_message_bubble_time {
    display: inline-block;
    width: 100%;
    position: relative;
    margin-top: 1px;
    margin-left: 2px;
    margin-right: 2px;
    width: auto;
    padding-left :5px;
    padding-right :5px;
    font-family: 'Exo', sans-serif;
    font-size: .7em;
    font-weight: 400;
    color: #ffffff;
    text-align: left;
    word-wrap: break-word;
    background: rgba(128,128,128,0.5);
    border-radius: .3rem .3rem .3rem .3rem;
}



#offline_message_button_send{
    position: relative;
    display: block;
    width: 80%;
	height: 70%;
	background: rgba(134, 88, 112, 0.5);
	border: 1px solid rgba(162, 151, 157, 0.3);
	cursor: pointer;
	border-radius: 2px;
	color: #ffffff;
	font-family: 'Exo', sans-serif;
	font-size:1.22em;
	font-weight: 400;
	padding: 6px;
    transition: all .2s ease-out !important;
}



#offline_message_button_send:hover{
	background: rgb(113, 58, 87);
    transition: all .2s ease-out !important;
}

#offline_message_button_send:active{
	opacity: 0.6;
}


#offline_message_button_send:focus{
	outline: none;
}


#textarea_offline {
  position: relative;
  left:0px;

  margin-left: 3px;
  margin-right: 3px;
  padding: 5px 8px 0px 8px;
  font-family: 'Exo', sans-serif;
  font-size: 1.1em;
  font-weight: 400;
  color: #ffffff;

  word-wrap: break-word;
  text-align: left;
  vertical-align: top;


  background: rgba(0,0,0,0.35);
  border-radius: .5rem .5rem .5rem .5rem;
  border: 1px solid rgba(255, 255, 255, .1);

  outline: none;

  resize: none;

  overflow: auto;
  overflow-y: hidden;


}


#textarea_offline_models {
  position: relative;
  left:0px;

  margin-left: 3px;
  margin-right: 3px;
  padding: 5px 8px 0px 8px;
  font-family: 'Exo', sans-serif;
  font-size: 1.1em;
  font-weight: 400;
  color: #ffffff;

  word-wrap: break-word;
  text-align: left;
  vertical-align: top;


  background: rgba(0,0,0,0.1);
  border-radius: .5rem .5rem .5rem .5rem;
  border: 1px solid rgba(255, 255, 255, .1);

  outline: none;

  resize: none;

  overflow: auto;
  overflow-y: hidden;


}


.msg_unread {
    display: inline-block;
    position: relative;
    top:4px;
    margin-right:4px;
    width:1em;
    height:20px;
    border-radius: .5rem .5rem .5rem .5rem;

    background: rgb(113, 58, 87);
    transition: all .2s ease-out !important;
}

.msg_delete{
    position: relative;
    font-family: 'Exo', sans-serif;
    font-size: 0.9em;
    font-weight: 300;
    color: #ffffff;
    padding-right: 3px;
    opacity: 0.3;

}

.msg_delete:hover{

    opacity: 0.8;
}



.selected_contact {
    color: rgba(252, 164, 209, 1) !important;
    opacity: 1;
}


.offline_messages_sepparator {
  margin-top: 24px;
  padding: 0px 0px 2px 8px;
  font-family: 'Exo', sans-serif;
  font-size: .7em;
  font-weight: 300;
  color: rgba(255, 255, 255, .4);
  text-align: left;

  background: rgba(0,0,0,0.1);
}


#happy_hour {
  margin-left: 24px;
}

#happy_hour1 {
  font-family: 'Exo', sans-serif;
  font-size: 1.8em;
  font-weight: 200;
}

#happy_hour2 {
  margin-left: 4px;
  font-family: 'Exo', sans-serif;
  font-size: 1.9em;
  font-weight: 400;
}


#bubble_messages, #bubble_messages2 {

    position: absolute;
    width: 17px;
    height: 17px;
    top: -4px;
    right: -8px;

    padding: 0px;


    font-family: 'Exo', sans-serif;
    font-size: 0.65em;
    font-weight: 500;

    text-align: center;
    vertical-align: middle;

    border-radius: .5rem .5rem .5rem .5rem;
    background: rgba(107, 27, 68, 0.9);

    border: 1px solid rgba(255, 255, 255, .4);

    transition: all .2s ease-out !important;
}

#bubble_messages_inner, #bubble_messages_inner2 {
    position: relative;
    top: -4px;
}


.fadedout
{
    opacity: 0.6;
}