/*global css*/
body
{
padding:0px;
margin:0px;
box-sizing:border-box;
font-family: 'Titillium Web', sans-serif;
background: #e9f3f8;
}
.col-100
{
width: 100%;
}
.left
{
float: left;
}
p,div
{
font-size: 13px;
font-family: 'Titillium Web', sans-serif;
}
h1,h2,h3,h4,h5,h6
{
font-family: 'Titillium Web', sans-serif;
}
a
{
text-decoration: none !important;
font-family: 'Titillium Web', sans-serif;
color: #1b2834 !important;
margin: 5px 0px !important;
}
.b
{
font-weight: 600;
}
a.green_btn
{
padding: 15px 100px;
background: rgb(236,85,135);
color: #fff !important;
line-height: 75px;
font-size: 20px;
}
a.green_btn:hover
{
color: #fff;
}
.border-red
{
padding: 15px 125px !important;
text-align: center !important;
border: 1px solid #cccaca !important;
border-radius: 0px !important;
font-weight: 600 !important;
}
.box_shadow
{
padding: 20px;
/*box-shadow: 0 2px 50px rgb(173, 173, 173);*/
box-shadow: 0 2px 50px rgba(228, 34, 55, 0.36);
}
input
{
border-radius: 0px !important;
height: 45px !important;
}
.com-pd
{
padding: 100px 0px 0px 0px;
}
.tag_line
{
font-size: 17px;
}
.pd_t93
{
padding-top: 93px !important;
}
.red_btn
{
background: rgb(236,85,135) !important;
color: #fff !important;
padding: 10px !important;
width: 100%;
border-radius: 0px !important;
}
.light_red
{
color: #ff7272;
}
.link
{
color: #337ab7 !important;
}
.chat_btn
{
background: #0000007d;
padding:8px 38px;
border-radius: 100px;
color: #fff !important;
box-shadow: 0px 0px 0px 2px #0000004f;
}

/*global css*/

/*header css start here*/
.header
{
padding: 20px 0px;
/*background: #fff;
box-shadow: 0px 0px 2px 2px #c7c7c7;*/
margin-bottom: 40px;
}
/*header css ends here*/

/*video section*/

/*.home-content-top
{
background-image: url(../images/bg.jpg);
background-repeat: no-repeat;
height:780px;
}*/

.home-content-top
{
padding: 60px;
background: #efdcdf;
}
.content-quality
{
float:left;
width:193px;
}
.content-quality p
{
margin-left:10px;
font-family: 'Titillium Web', sans-serif;
font-size:14px;
font-weight:600;
line-height:17px;
}
.content-quality p span
{
display:block;
}
.video_section
{
height:630px;
padding:15px 10px;
background-color: #fff;
}
.form-top-left h3
{
margin-top: 0px;
text-align: center;
}
.select_language
{
margin-bottom: 20px;
}
.home-content-top .nav-tabs
{
border-bottom: 0px !important;
}

.tabtop li a{
font-family: 'Titillium Web', sans-serif;
font-weight:700;
color:#1b2834;
font-size: 14px;
border-radius:0px;
margin-right:22.008px;
/*border:1px solid #ebebeb !important;*/
}
.nav>li>a:focus, .nav>li>a:hover
{
background-color: #e31837 !important;
}
.tabtop .active a:before
{
content:"";
position:absolute;
top:37px;
left:37%;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid #e31837 ;
}
.tabtop li a:hover
{
color:#fff !important;
text-decoration:none;
}
.tabtop .active a:hover
{
color:#fff !important;
}
.tabtop .active a
{
background-color:#e31837 !important;
color:#FFF !important;
}
.margin-tops
{
margin-top:30px;
}
/*.tabtop li a:last-child
{
padding:10px 22px;
}*/
.center_container
{
width: 80%;
margin: 0 auto;
}
.thbada
{
padding:10px 28px !important;
}
.margin-tops4
{
margin-top:20px;
}
.tabsetting
{
/*border-top:5px solid #ebebeb;*/
padding-top:6px;
}
.services
{
background-color:#d4d4d4;
min-height:710px;
padding:65px 0 27px 0;
}
.services a:hover
{
color:#000;
}
.services h1
{
margin-top:0px !important;
}

.select_language select
{
width:100%;
padding:0px 20px;
margin-bottom: 0px;
font-weight: 600;
color: #1b2834 !important;
border: 0px;
background: transparent !important;
}
select:focus
{
border: 1px solid red;
background: transparent !important;
}
/*owl carousel*/
#video_chat .item img
{
height: 236px;
}
.tab-pane .video_tag
{
padding: 10px 0px;
}
.premium_plan
{
/*background-image: url('../images/bg_back.jpg');*/
background-size: cover;
background-position: center;
height: 100px;
position: relative;
}
.premium_plan_inner
{
background-color: #fff;
height: 330px;

}

.premium_plan_inner ul.total_plan
{
position: relative;
/* top: 25%; */
bottom: 52px;
padding: 0px;
margin: 0px;
width: 100%;
float: left;
}
.premium_plan_inner ul.total_plan li
{
list-style: none;
}
.premium_plan_inner ul.total_plan li .box_plan
{
background: #fff;
box-shadow: 0px 0px 4px 4px #c5c5c5ab;
}
.plan_top
{
background: #fff;
padding: 10px 0px;
}
.plan_mid
{
background: #fff;
}
.active_plan
{
background:#ec5587 !important;
border: 2px solid #EC5587;
}
.active_plan .plan_top
{
background: #EC5587
}
.plan_top h4
{
margin: 0px;
}
.plan_top p
{
margin: 0px;
}
.plan_bottom
{
background: #9c9c9c;
color: #fff;
}

/*message section*/
/* Style the tab */
.tab {
  float: left;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
  width: 30%;
  height: 300px;
}

/* Style the buttons inside the tab */
.tab button {
  display: block;
  background-color: inherit;
  color: black;
  padding:15px 16px;
  width: 100%;
  border: none;
  outline: none;
  text-align: left;
  cursor: pointer;
  transition: 0.3s;
  font-size: 17px;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current "tab button" class */
.tab button.active {
  background-color:#EC5587;
}

/* Style the tab content */
.tabcontent {
  float: left;
  padding: 0px 12px;
  border: 1px solid #ccc;
  width: 70%;
  border-left: none;
  height: 300px;
}
/*message section*/
img{ max-width:100%;}
.inbox_people {
background-image: url(../images/pattern.png);
float: left;
overflow: hidden;
width: 40%;
background-size: contain;
background-position: center;
}
.inbox_msg {
/*  border: 1px solid #c4c4c4;*/
  clear: both;
  overflow: hidden;
}
.file_upload-btn
{
display: inline-block;
position: absolute;
right: 39px;
background: #b9b9b9;
top: 13px;
background: #cecece;
border: 0px;
padding: 7px;
border-radius: 100px;
width: 35px;
}
.file_upload-btn i
{
color: #949494;
}
.top_spac{ margin: 20px 0 0;}
.recent_heading
{
float: left;
width:40%;
}
.srch_bar
{
display: inline-block;
text-align: right;
width: 60%; padding:
}
.headind_srch{
padding:0px 29px 10px 20px;
overflow:hidden;
border-bottom:1px solid #c4c4c469;
background-color: #fff;
}

.recent_heading h4 {
color: #212121;
font-size: 14px;
margin: auto;
font-weight: 600;
}
.srch_bar input
{ 
border:1px solid #cdcdcd;
border-width:0 0 1px 0;
width:80%;
padding:2px 0 4px 6px;
background:none;
height: 25% !important;
background-color: transparent !important;
}

.srch_bar .input-group-addon
{
width: 20%;
float: right;
padding:0px;
border: 0px;
}
.srch_bar .input-group-addon button {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: medium none;
  padding: 0;
  color: #707070;
  font-size: 18px;
}
.srch_bar .input-group-addon { margin: 0 0 0 -27px;}

.chat_ib h5{ font-size:15px; color:#464646; margin:0 0 8px 0;}
.chat_ib h5 span{ font-size:13px; float:right;}
.chat_ib p{ font-size:14px; color:#989898; margin:auto}
.chat_img {
  float: left;
  width: 11%;
}
.chat_ib {
  float: left;
  padding: 0 0 0 15px;
  width: 88%;
}

.chat_people{ overflow:hidden; clear:both;}
.chat_list {
  border-bottom: 1px solid #c4c4c469;
  margin: 0;
  background: #fff;
  padding: 18px 16px 10px;
}
.inbox_chat { height: 337px; overflow-y: scroll;}

.active_chat{ background:#e8e4e4;}

.incoming_msg_img {
  display: inline-block;
  width: 6%;
}
.received_msg {
  display: inline-block;
  padding: 0 0 0 10px;
  vertical-align: top;
  width: 92%;
 }
 .received_withd_msg p {
  background: #ebebeb none repeat scroll 0 0;
  border-radius: 3px;
  color: #646464;
  font-size: 14px;
  margin: 0;
  padding: 5px 10px 5px 12px;
  width: 100%;
}
.time_date {
  color: #747474;
  display: block;
  font-size: 12px;
  margin: 8px 0 0;
}
.received_withd_msg { width: 57%;}
.mesgs {
  float: left;
  padding: 0px 15px 0 25px;
  width: 60%;
  height: 408px;
  overflow: scroll;
}

 .sent_msg p {
  background: #EC5587 none repeat scroll 0 0;
  border-radius: 3px;
  font-size: 14px;
  margin: 0; color:#fff;
  padding: 5px 10px 5px 12px;
  width:100%;
}
.outgoing_msg{ overflow:hidden; margin:26px 0 26px;}
.sent_msg {
  float: right;
  width: 46%;
}
.input_msg_write input {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: medium none;
  color: #4c4c4c;
  font-size: 15px;
  min-height: 48px;
  width: 100%;
}

.type_msg
 {
/*border-top: 1px solid #c4c4c4;
position: relative;*/
border-top: 1px solid #c4c4c4;
position: absolute;
width:35.7%;
top: 86%;
right: 20.4%;
background: #fff;
 }
.msg_send_btn {
  background: #EC5587 none repeat scroll 0 0;
  border: medium none;
  border-radius: 50%;
  color: #fff !important;
  cursor: pointer;
  font-size: 17px;
  height: 33px;
  position: absolute;
  right: 0;
  top: 11px;
  width: 33px;
  padding: 6px;
}
.messaging { padding: 0 0 50px 0;}
.msg_history {
/*  height: 516px;
  overflow-y: auto;*/
}
.chat_history {
background: #fff;
position: absolute;
left: 0px;
right: 0px;
/*opacity: 0;*/
}
.chat_history_inner 
{
width: 60%;
margin: 0 auto;
}
#chat_hist .item img
{
width: 100%;
height: 148px;
}
li.slect_html
{
width: 51%;
float: left;
}
.profile_photo
{
width: 46px;
height: 46px;
border-radius: 100px;
}
.tabtop li.profile_photo  a
{
border: none !important;
padding: 0px;
}
.tabtop li.profile_photo a > img
{
display: block;
border-radius: 100px;
height: 41px;
width: 41px;
text-align: center;
}
ul.tabsetting li a > img
{
max-width: 100% !important;
}
ul.tabtop .active a.profile_photo
{
background: transparent !important;
border: 1px solid #b1adad !important;
}
.tabtop .active a.profile_photo:before
{
	border-top:transparent;
}
/*******************************
* Does not work properly if "in" is added after "collapse".
* Get free snippets on bootpen.com
*******************************/
    .panel-group .panel {
        border-radius: 0;
        box-shadow: none;
        border-color: #EEEEEE;
    }

    .panel-default > .panel-heading {
        padding: 0;
        border-radius: 0;
        color: #212121;
        background-color: #FAFAFA;
        border-color: #EEEEEE;
    }

    .panel-title {
        font-size: 14px;
    }

    .panel-title > a {
        display: block;
        padding: 12px;
        text-decoration: none;
    }

    .more-less {
        float: right;
        color: #212121;
    }

    .panel-default > .panel-heading + .panel-collapse > .panel-body {
        border-top-color: #EEEEEE;
    }
.panel-body select
{
width: 100%;
border-radius: 0px !important;
border: 1px solid #ccc !important;
height: 46px !important;
padding: 0px 5px;
}
.checkbox label:after, 
.radio label:after {
    content: '';
    display: table;
    clear: both;
}

.checkbox .cr,
.radio .cr {
    position: relative;
    display: inline-block;
    border: 1px solid #a9a9a9;
    border-radius: .25em;
    width: 1.3em;
    height: 1.3em;
    float: left;
    margin-right: .5em;
}

.radio .cr {
    border-radius: 50%;
}

.checkbox .cr .cr-icon,
.radio .cr .cr-icon {
    position: absolute;
    font-size: .8em;
    line-height: 0;
    top: 50%;
    left: 20%;
}

.radio .cr .cr-icon {
    margin-left: 0.04em;
}

.checkbox label input[type="checkbox"],
.radio label input[type="radio"] {
    display: none;
}

.checkbox label input[type="checkbox"] + .cr > .cr-icon,
.radio label input[type="radio"] + .cr > .cr-icon {
    transform: scale(3) rotateZ(-20deg);
    opacity: 0;
    transition: all .3s ease-in;
}

.checkbox label input[type="checkbox"]:checked + .cr > .cr-icon,
.radio label input[type="radio"]:checked + .cr > .cr-icon {
    transform: scale(1) rotateZ(0deg);
    opacity: 1;
}

.checkbox label input[type="checkbox"]:disabled + .cr,
.radio label input[type="radio"]:disabled + .cr {
    opacity: .5;
}
#collapseThree .checkbox,#collapseFour .checkbox
{
margin-top: 11px;
}

.upload-button {
    padding: 4px;
    border: 1px solid #d8d6d6;
    border-radius: 5px;
    display: block;
    float: left;
    position: absolute;
    background: #fff;
    width: 50%;
    height: 200px;
    cursor: pointer;
}
.upload-button
{
background-image: url('../images/upload_photo.jpg');
background-position: center;
background-size: cover;
height: 200px;
}

.profile-pic {
    max-width: 200px;
    max-height: 200px;
    display: block;
}

.file-upload {
    display: none;
}
.file_upload_section
{
height: 200px;
}
.logout
{
padding: 20px 0px;
}
#collapseFive .green_btn
{
padding: 20px 29px;
text-align: center;
line-height: 0px;
margin-top: 5px;
border-radius: 0px;
border: 0px;
}
#collapseFive .green_btn:hover
{
background-color: #EC5587;
}
.logout p
{
color: #5096ec;
}
/*video section*/
/*form-section*/
.form-box select
{
height: 45px;
border-radius: 
}
.tab-pane a.green_btn
{
padding: 15px 147px;
text-align: center;
cursor: pointer;
}
#login_form .green_btn,
#forget_form .green_btn,
#registration_form .green_btn
{
width: 100%;
float: left;
padding: 0px;
height: 51px;
line-height: 42px;
}
#login_form .border-red,
#forget_form .border-red,
#registration_form .green_btn
{
width: 100%;
float: left;
padding: 0px;
height: 51px;
line-height:18px;
}
#registration_form,
#forget_form
{
display: none;
}
#registration_form  a.green_btn
{
padding: 15px 138px;
}
/*about us_inner*/
.about_inner
{
padding: 20px;
}
.about_inner h1
{
margin-top: 0px;
font-family: 'Titillium Web', sans-serif;
}
.about_inner p
{
/*font-size: 17px;
line-height: 23px;
margin-top: 20px;*/
font-size: 15px;
line-height: 23px;
margin-top: 20px;
letter-spacing: 1px;
}

/*counting_section*/
.counting
{
background-image: url('../images/map-bg.png');
background-repeat: no-repeat;
height: 500px;
background-position: bottom;
}
.counting ul.block-grid
{
margin: 0px;
padding: 0px;
}
.counting ul.block-grid li
{
list-style: none;
}
.column, .columns {
float: left;
min-height: 1px;
padding: 0 16px;
position: relative;
}
.status {
text-align: center;
position: relative;
bottom: 0px;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}

/**/

.heading_container
{
padding-bottom: 65px;
}

/*footer*/
.footer
{
text-align: center;
}
.footer ul
{ 
padding: 0px;
margin: 0px;
}
.footer ul li
{ 
display: inline-block;
padding: 10px 20px;
text-align: center;
}
.footer ul li a 
{ 
font-size: 11px;
/* font-weight: 600; */
/* font-family: sans-serif; */
color: #c5c5c5f2 !important;
}
.footer p
{
font-size: 11px;
/* font-weight: 600; */
/* font-family: sans-serif; */
color: #c5c5c5f2 !important;
}
.bottom_footer
{
padding: 10px 0px;
text-align: center;
}
/*footer end here*/

@media screen and (max-width: 600px)
{
.tab-pane a.green_btn
{
width: 100%;
float: left;
height: 56px;
line-height:46px !important;
font-size: 21px;
padding: 0px;
}
.border-red
{
width: 100%;
float: left;
height: 56px;
line-height: 54px;
font-size: 21px;
padding: 0px;
}

}
.stepwizard-step p {
    margin-top: 10px;
}

.stepwizard-row {
    display: table-row;
}

.stepwizard {
    display: table;
    width: 100%;
    position: relative;
    display: none;
}

.stepwizard-step button[disabled] {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
}

.stepwizard-row:before {
    top: 14px;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 100%;
    height: 1px;
    background-color: #ccc;
    z-order: 0;

}

.stepwizard-step {
    display: table-cell;
    text-align: center;
    position: relative;
}

.btn-circle {
  width: 30px;
  height: 30px;
  text-align: center;
  padding: 6px 0;
  font-size: 12px;
  line-height: 1.428571429;
  border-radius: 15px;
}

select
{
height: 45px !important;
border-radius: 0px !important;
}
.setup-content {
    padding: 20px 0px;
    width: 100%;
    float: left;
}
.setup-content select
{
font-size: 20px !important;
}
/*form styles*/
#msform {
  width: 400px;
  margin: 50px auto;
  text-align: center;
  position: relative;
}
#msform fieldset {
  background: white;
  border: 0 none;
  border-radius: 3px;
  box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);
  padding: 20px 30px;
  box-sizing: border-box;
  width: 80%;
  margin: 0 10%;
  
  /*stacking fieldsets above each other*/
  position: relative;
}
/*Hide all except first fieldset*/
#msform fieldset:not(:first-of-type) {
  display: none;
}
/*inputs*/
#msform input, #msform textarea {
  padding: 15px;
  border: 1px solid #ccc;
  border-radius: 3px;
  margin-bottom: 10px;
  width: 100%;
  box-sizing: border-box;
  font-family: montserrat;
  color: #2C3E50;
  font-size: 13px;
}
/*buttons*/
#msform .action-button {
  width: 100px;
  background: #27AE60;
  font-weight: bold;
  color: white;
  border: 0 none;
  border-radius: 1px;
  cursor: pointer;
  padding: 10px 5px;
  margin: 10px 5px;
}
#msform .action-button:hover, #msform .action-button:focus {
  box-shadow: 0 0 0 2px white, 0 0 0 3px #27AE60;
}
/*headings*/
.fs-title {
  font-size: 15px;
  text-transform: uppercase;
  color: #2C3E50;
  margin-bottom: 10px;
}
.fs-subtitle {
  font-weight: normal;
  font-size: 13px;
  color: #666;
  margin-bottom: 20px;
}
/*progressbar*/
#progressbar {
  margin-bottom: 30px;
  overflow: hidden;
  /*CSS counters to number the steps*/
  counter-reset: step;
}
#progressbar li {
  list-style-type: none;
  color: white;
  text-transform: uppercase;
  font-size: 9px;
  width: 33.33%;
  float: left;
  position: relative;
}
#progressbar li:before {
  content: counter(step);
  counter-increment: step;
  width: 20px;
  line-height: 20px;
  display: block;
  font-size: 10px;
  color: #333;
  background: white;
  border-radius: 3px;
  margin: 0 auto 5px auto;
}
/*progressbar connectors*/
#progressbar li:after {
  content: '';
  width: 100%;
  height: 2px;
  background: white;
  position: absolute;
  left: -50%;
  top: 9px;
  z-index: -1; /*put it behind the numbers*/
}
#progressbar li:first-child:after {
  /*connector not needed before the first step*/
  content: none; 
}
/*marking active/completed steps green*/
/*The number of the step and the connector before it = green*/
#progressbar li.active:before,  #progressbar li.active:after{
  background: #27AE60;
  color: white;
}


form.upload_form fieldset {
    display: none;
}
.upload_form .checkbox
{
margin-top: 5px !important;
}
.button_container
{
padding:20px 0px;
}
#tab_default_3
{
/*padding: 40px 0px;*/
}

/*gender preference  popup*/
ul.gender_pre
{
padding: 0 0 0 5%;
margin: 160px 0px;
}
ul.gender_pre li
{
border-radius: 100px;
width: 163px;
height: 163px;
margin-right: 107px;
border: 10px solid #b5b5b5;
text-align: center;
background-color: #0000006b;
list-style: none;
}
ul.gender_pre li:nth-child(2n+1):hover
{
background-color: #74b9ff;
border-color: #fff;
}
ul.gender_pre li:nth-child(2n+2):hover
{
background-color: #ea6db3;
border-color: #fff;
}
#gender_preference .modal-header
{
border-bottom: 0px;
}
#gender_preference .modal-dialog
{
height: 100%;
text-align: center;
background-color: #0000009e;
position: absolute;
width: 100%;
margin: 0 auto;
}
#gender_preference .modal-body h3
{
color: #fff;
}
#gender_preference .modal-content
{
background-color: transparent;
-webkit-box-shadow:none;
box-shadow:none;
border: none;
}
/*ul.gender_pre li.active_gender
{
background: #ea6db3;
border-radius: 100px;
width: 163px;
height: 163px;
margin-right: 107px;
box-shadow: 0px 0px 10px 7px #000;
}*/
ul.gender_pre li  h4
{
margin-top: 60px;
color: #f9f7f7;
}
.highlighted_blue
{
background: #74b9ff !important;
box-shadow: 0px 0px 10px 7px #000;
border-color: #fff !important;
}
.highlighted_pink
{
background: #ea6db3 !important;
box-shadow: 0px 0px 10px 7px #000;
border-color: #fff !important;
}
/*gender preference popup*/
ul.form_btns
{
padding: 0px;
margin: 0px;
}
ul.form_btns li
{
list-style: none;
}
.guest_form
{
display: none;
}
.transparent_btn
{
width: 100%;
font-weight: 600 !important;
border-color: #bbbbbb !important;
border-radius: 0px !important;
height: 45px;
line-height: 30px !important;
}

/*live_video_chat*/
.live_video_chat
{
padding: 20px 0px;
height: 657px;
}
.video_inner
{
padding: 20px;
width: 72%;
margin: 0 auto;
}
#live_video
{
display: none;
}
.video_controls 
{
padding: 20px;
position: relative;
bottom: 175px;
height: 165px;
z-index: 99;
/* background-color: #0000002e; */
padding: 10px;
    width: 68.7%;
    left: 15.6%;
    right: 0px;
}
.video_controls_inner
{
/*position: relative;
bottom: 206px;
height: 165px;
z-index: 99;
background-color: #0000002e;
padding: 10px;*/
}

/*gift icon css*/
#floating-button{
  width: 55px;
  height: 55px;
  border-radius: 50%;
  /*background: #db4437;*/
  position: absolute;
  bottom: 18px;
  left: 30px;
  cursor: pointer;
/*  box-shadow: 0px 2px 5px #666;*/
}

.plus{
  color: white;
  position: absolute;
  top: 0;
  display: block;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
  padding: 0;
  margin: 0;
  line-height: 55px;
  font-size: 38px;
  font-family: 'Roboto';
  font-weight: 300;
  animation: plus-out 0.3s;
  transition: all 0.3s;
}

#container-floating{
  position: absolute;
  width: 55px;
  height: 55px;
  top: 30px;
  left:  30px;
  z-index: 50px;
  z-index: 100;
}

#container-floating.is-opened .plus{
  animation: plus-in 0.15s linear;
  animation-fill-mode: forwards;
}

#container-floating.is-opened .close{
  animation: close-in 0.2s;
  animation-delay: 0.1s;
  animation-fill-mode: forwards;
}

@keyframes close-in{
  from {opacity: 0; transform: rotateZ(-70deg);}
  to {opacity: 1; transform: rotateZ(0deg);}
}

@keyframes close-out{
  from {opacity: 1; transform: rotateZ(0deg);}
  to {opacity: 0; transform: rotateZ(-70deg);}
}

@keyframes plus-in{
  from {opacity: 1; transform: rotateZ(0deg);}
  to {opacity: 0; transform: rotateZ(180deg);}
}

@keyframes plus-out{
  from {opacity: 0; transform: rotateZ(180deg);}
  to {opacity: 1; transform: rotateZ(0deg);}
}

.nds{
  width: 40px;
  height: 40px;
  border-radius: 20px;
  position: absolute;
  left: 30px;
  z-index: 300;
  transform:  scale(0);
  transition: width .25s;
  cursor: pointer;
}

.nds.is-opened,
.nds.is-always-opened {
  width: 47px;
}

.nd1{
  background: #00000038;
  right: 40px;
  bottom: 100px;
  animation-delay: 0.2s;
  animation: bounce-out-nds 0.3s linear;
  animation-fill-mode:  forwards;
}

.nd2{
  background:#00000038;
  right: 40px;
  bottom: 150px;
  animation-delay: 0.15s;
  animation: bounce-out-nds 0.15s linear;
  animation-fill-mode:  forwards;
}

.nd3{
  background:#00000038;
  right: 40px;
  bottom: 200px;
  animation-delay: 0.1s;
  animation: bounce-out-nds 0.1s linear;
  animation-fill-mode:  forwards;
}

.nd4{
  background: #00000038;
  right: 40px;
  bottom: 250px;
  animation-delay: 0.08s;
  animation: bounce-out-nds 0.1s linear;
  animation-fill-mode:  forwards;
}

.nds > p
{
position: absolute;
left: 127%;
top: 6px;
color: #fff;
font-size: 20px;
}
@keyframes bounce-nds{
  from {opacity: 0;}
  to {opacity: 1; transform: scale(1);}
}

@keyframes bounce-out-nds{
  from {opacity: 1; transform: scale(1);}
  to {opacity: 0; transform: scale(0);}
}

#container-floating.is-opened .nds{

  animation: bounce-nds 0.1s linear;
  animation-fill-mode:  forwards;
}

#container-floating.is-opened .nd2{
  animation-delay: 0.08s;
}
#container-floating.is-opened .nd3{
  animation-delay: 0.15s;
}
#container-floating.is-opened .nd4{
  animation-delay: 0.2s;
}

.reminder{
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  top: 0;
  bottom: 0;
  line-height: 40px;
  width: 66%;
}
.calling_btn_end
{
padding: 20px 0px;
}
.calling_btn_end ul
{
padding: 0px;
margin: 0px;
text-align: center;
}
.calling_btn_end ul li
{
list-style: none;
}
.calling_btn_end ul li .chat_btn
{
line-height: 53px;
}

.add_friend
{
width: 55px;
background:  #00000038;
height: 55px;
text-align: center;
color: #fff;
border-radius: 100px;
margin: 0 auto;
}
.add_friend i
{
color: #fff;
font-size: 22px;
padding: 16px;
}
.volume
{
margin-top: 24px;
}
.video_chating .type_msg
{
width:100%;
padding: 10px;
position: absolute;
top: 64%;
left: 0.1%;
}
.videos_show
{
position: relative;
}
#open-registration .modal-header
{
background: rgb(236,85,135) !important;
}
#open-registration .modal-header h4
{
color: #fff;
}
#open-registration ul.register_list
{
padding: 0px;
margin: 0px;
}
#open-registration ul.register_list li
{
padding:15px 10px;
list-style: none;
text-align: center;
border: 1px solid #d8d8d8;
margin-bottom: 10px;
}
#open-registration ul.register_list li a
{
font-size: 15px;
}
#open-registration ul.register_list li:hover
{
background-color: #d0d0d099;
}
#open-registration ul.login_as
{
padding: 0px;
margin: 10px 0px 0px 0px;
}
#open-registration ul.login_as li
{
list-style: none;
display: inline-block;
}
/*gift_icon css*/

/*live_video_chat*/

/*popup login form*/
#login_register ul.tab-group
{
padding: 0px;
margin: 0px;
height: 62px;
}
#login_register ul.tab-group li
{
list-style: none;
height: 0px;
}
#login_register ul.tab-group li a
{
display: block;
text-decoration: none;
padding: 15px;
color: red;
/*background-color: #9999;*/
font-size: 20px;
float: left;
width: 100%;
text-align: center;
border-top: 3px solid transparent;
-moz-transition:all 0.4s ease-in-out;
-o-transition:all 0.4s ease-in-out;
-webkit-transition:all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
margin: 0px !important;
}
#login_register .modal-header
{
padding: 0px !important
}
#login_register .tab-group:after
{
content: "";
display: table;
clear: both;
}
#login_register form
{
padding:0px 30px;
}
#login_page .green_btn,
#register_page .green_btn
{
    width: 100%;
    float: left;
    text-align: center;
    height: 48px;
    line-height: 15px;

}
#register_page
{
display: none;
}
.show_form
{
display: block;
}
.active_form
{
border-top: 5px solid rgb(236,85,135);
}
/*popup login form end*/

ul.tab_form
{
padding: 0px;
margin: 0px;
}
ul.tab_form li
{
list-style: none;
display: inline-block;
}
