html,body{

    margin: 0;

    padding: 0;

}

body{

    height: 100%;

}



.terms-span{

    line-height: 5px;

}

h1,h2,h3,h4,h5,h6,p,span,pre,div,a{

    /*font-family: 'Roboto', 'Helvetica', sans-serif !important;*/
    font-family: Rakkas !important;
    

}



:-ms-input-placeholder { /* Internet Explorer 10-11 */

    color: white !important;

}



::-ms-input-placeholder { /* Microsoft Edge */

    color: white !important;

}



::placeholder {

    color: white !important;

    opacity: 1; /* Firefox */

}



.demo-avatar {

    width: 48px;



    height: 48px;



    border-radius: 24px;

}



.demo-layout .mdl-layout__header .mdl-layout__drawer-button {

    color: rgba(255, 255, 255, 0.8);



    background-color: transparent;



    background: transparent;

}



.mdl-layout__drawer .avatar {

    margin-bottom: 16px;

}



.demo-drawer {

    border: none;

}



/* iOS Safari specific workaround */



.demo-drawer .mdl-menu__container {

    z-index: -1;

}



.demo-drawer .demo-navigation {

    z-index: -2;

}



/* END iOS Safari specific workaround */



.demo-drawer .mdl-menu .mdl-menu__item {

    display: -webkit-flex;



    display: -ms-flexbox;



    display: flex;



    -webkit-align-items: center;



    -ms-flex-align: center;



    align-items: center;

}



.demo-drawer-header {

    box-sizing: border-box;



    display: -webkit-flex;



    display: -ms-flexbox;



    display: flex;



    -webkit-flex-direction: column;



    -ms-flex-direction: column;



    flex-direction: column;



    -webkit-justify-content: flex-end;



    -ms-flex-pack: end;



    justify-content: flex-end;



    padding: 10px;



    height: 100px;



    cursor: pointer;

}



.demo-avatar-dropdown {

    display: -webkit-flex;



    display: -ms-flexbox;



    display: flex;



    position: relative;



    -webkit-flex-direction: row;



    -ms-flex-direction: row;



    flex-direction: row;



    -webkit-align-items: center;



    -ms-flex-align: center;



    align-items: center;



    width: 100%;

}



.demo-navigation {

    -webkit-flex-grow: 1;



    -ms-flex-positive: 1;



    flex-grow: 1;



    z-index: 2;

}



.demo-navigation .mdl-navigation__link .material-icons {

    font-size: 36px;



    color: rgba(255, 255, 255, 1);



    margin-right: 32px;

}



.demo-content {

    max-width: 1080px;

}



.demo-card-image-box {

    overflow: hidden;

}



.mdl-card__title:hover {

    cursor: pointer;



    /*transition: 2s;



background-color: rgba(71, 21, 20, 0.25);*/

}



.no-padding {

    padding: 0px !important;

}



/*.demo-card-image:hover {*/



/*transition: 1s;*/



/*transform: scale(1.01);*/



/*-moz-transform: scale(1.01);*/



/*-webkit-transform: scale(1.01);*/



/*-o-transform: scale(1.01);*/



/*-ms-transform: scale(1.01); !* IE 9 *!*/



/*-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.01, M12=0, M21=0, M22=1.01, SizingMethod='auto expand')"; !* IE8 *!*/



/*filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.01, M12=0, M21=0, M22=1.01, SizingMethod='auto expand'); !* IE6 and 7 *!*/



/*}*/



@media screen and (min-height: 801px) {



    .demo-card-image {

        height: 270px;

    }



    .card-image-pic {

        height: 240px;



        min-height: 0px !important;

    }



    .profile-profile-pic-title {

        height: 287px;

    }



    .profile-profile-pic {

        height: 340px;

        width: 60%;

        margin: auto;

    }



    .cropcircle {

        width: 35px;



        height: 35px;



        border-radius: 100%;



        background: #eee no-repeat center;



        background-size: cover;

    }



    .package-image-header {

        width: 50px;



        height: 50px;

    }



    .package-image-desc {

    }



    .demo-drawer-header {

        height: 150px !important;

    }



    .mdl-layout__header-row {

        height: 80px;

    }

}



@media screen and (max-height: 801px) {

    .mdl-layout__header-row {

        height: 80px;

    }



    .header-row-height {

        height: px;

    }



    .cropcircle {

        width: 25px;



        height: 25px;



        border-radius: 100%;



        background: #eee no-repeat center;



        background-size: cover;

    }



    .package-image-header {

        width: 35px;



        height: 35px;

    }



    .demo-card-image {

        height: 240px;

    }



    .card-image-pic {

        min-height: 0px !important;

    }



    .profile-profile-pic-title {

        height: 100px;

    }



    .profile-profile-pic {

        height: 150px;

    }



    .display-none-for {

        display: none;

    }

}



.demo-card-image > .mdl-card__visits {

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

}



.demo-card-image__filename {

    color: #fff;



    font-size: 14px;



    font-weight: 500;

}



.mdl-layout__drawer {

}



.demo-card-square > .mdl-card__title {

    color: #fff;

}



.flag-lang {

    padding: 1px 3px 1px 3px;



    /* background-color: rgba(255, 255, 255, 0.1); */

}



.flag-lang:hover {

    padding: 1px 3px 1px 3px;



    /* background-color: rgba(0, 0, 0, 0.3); */

}



.login-form {

    padding: 30px;



    margin: 80px;



    margin-top: 340px;

}



.login-input {

    width: 100%;



    font-size: 1em;



    color: #fff;

}



.login-button {

    font-size: 1.5em;

}



.input-label {

    color: rgba(255, 255, 255, 0.5);



    font-weight: normal !important;

}



.singup-form-text {

    color: rgba(255, 255, 255, 0.8);

}



.singup-form {

    color: rgba(255, 255, 255, 0.8);

}



.no-shadow {

    box-shadow: none !important;

}



.transparent {

    background: rgba(16, 16, 16, 0.6);

}



.form-validation {

    color: rgba(255, 73, 49, 0.8);



    font-size: 0.8em;



    font-weight: bold;



    position: absolute;

}



.login-validation {

    color: rgba(255, 73, 49, 0.7);



    font-size: 1em;



    font-weight: bold;



    position: absolute;

}



.form-errors {

    color: rgba(255, 255, 255, 0.6);



    font-size: 1.5em;

}



.small-menu_item {

    font-size: 14px !important;



    line-height: 13px !important;



    height: 13px !important;

}



.header-user-name {

}



.reset-style {

    padding: 0px !important;

}



.member-profile-img-desc {

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

}



.mdl-button.mdl-button--colored {

    color: #fe605d !important;

}



.member-profile-cnt {

}



.member-profile-visits-at {

    color: rgba(255, 255, 255, 0.9);



    font-size: 15px;



    padding: 4px;



    text-align: center;



    vertical-align: 50%;

}



.member-profile-href {

}



.member-icon {

    cursor: default;



    color: rgba(255, 255, 255, 0.5);

}



.member-icon:hover {

    cursor: pointer;



    color: rgba(255, 255, 255, 0.9);



    transition: 1s;

}



.member-fav-icon {

    cursor: default;



    color: rgba(255, 255, 255, 0.3);

}



.member-fav-icon:hover {

    cursor: pointer;



    color: rgba(255, 81, 81, 0.7);



    transition: 1s;

}



.member-fav-add-icon {

    cursor: default;



    color: rgba(255, 81, 81, 0.9);

}



.member-fav-add-icon:hover {

    cursor: pointer;



    transition: 1s;



    color: rgba(255, 81, 81, 0.6);

}



.member-profile-icon {

    cursor: default;



    color: rgba(255, 255, 255, 0.3);

}



.member-profile-icon:hover {

    cursor: pointer;



    color: rgba(94, 158, 255, 0.3);



    transition: 1s;

}



.member-profile-liked {

    cursor: default;



    color: rgba(94, 158, 255, 0.9);

}



.member-profile-liked:hover {

    cursor: pointer;



    transition: 1s;



    color: rgba(94, 158, 255, 0.4);

}



.member-fav-icon {

    cursor: default;



    color: rgba(255, 255, 255, 0.3);

}



.member-fav-icon:hover {

    cursor: pointer;



    color: rgba(253, 80, 104, 0.3);



    transition: 1s;

}



.member-fav-icon-on {

    cursor: default;



    color: rgba(253, 80, 104, 0.9);

}



.member-fav-icon-on:hover {

    cursor: pointer;



    transition: 1s;



    color: rgba(253, 80, 104, 0.4);

}



.flash-button {

    background-color: #606b6e;



    animation-name: flash;



    animation-duration: 2s;



    animation-timing-function: linear;



    animation-iteration-count: infinite;



    -webkit-animation-name: flash;



    -webkit-animation-duration: 2s;



    -webkit-animation-timing-function: linear;



    -webkit-animation-iteration-count: infinite;



    -moz-animation-name: flash;



    -moz-animation-duration: 2s;



    -moz-animation-timing-function: linear;



    -moz-animation-iteration-count: infinite;

}



@keyframes flash {

    0% {

        opacity: 3.0;

    }



    50% {

        opacity: 2;

    }



    100% {

        opacity: 3.0;

    }

}



@-webkit-keyframes flash {

    0% {

        opacity: 3.0;

    }



    50% {

        opacity: 2;

    }



    100% {

        opacity: 3.0;

    }

}



@-moz-keyframes flash {

    0% {

        opacity: 3.0;

    }



    50% {

        opacity: 2;

    }



    100% {

        opacity: 3.0;

    }

}



.singup-select {

}



.singup-option {

    font-size: 14px !important;



    color: rgba(0, 0, 0, .87);

}



.card-title {

    font-weight: 700;



    font-size: 16px;



    line-height: 24px;

}



.card-item {

    font-size: 14px;



    line-height: 32px;

}



.pagination-container {

    margin-top: 0px;



    margin-bottom: 0px;



    margin-left: 16px;



    margin-right: 16px;



    font-weight: 700;



    font-size: 16px;



    line-height: 24px;

}



@media (min-width: 320px) and (max-width: 680px) {



    .pagination-container {

        margin-bottom: 100px !important;

    }



    .cometchat_ccmobiletab_redirect {

        font-size: 14px !important;

    }

}



.pagination-container .pagination {

    margin: 0px 0px 5px 0 !important;

}



.pagination-container a {

    color: #dc4588;



    margin-right: 15px;



    font-weight: bold;

}



.pagination-container span.current {

    margin-right: 15px;

}



.pagination-container span.disabled {

    margin-right: 15px;

}



.footer-container {

    margin-top: 0px;



    margin-bottom: 0px;



    margin-left: 16px;



    margin-right: 16px;



    font-weight: 400;



    font-size: 12px;



    line-height: 10px;

}



.footer-container footer {

    padding: 0px !important;

}



.footer-container a {

    font-weight: 400;



    font-size: 12px;



    line-height: 10px;

}



.mdl-mini-footer {

}



.about-item-chip-title {

    margin-left: 10px;

    padding-right: 5%;

}



.about-item-chip {

    color: #ffffff;



    background-color: #424242;



    font-weight: bold;



    text-align: center;



    float: left;



    padding-bottom: 10px !important;

    margin-top: 0.5px;

}



.about-item-chip-other {

    color: #ffffff;



    background-color: #424242;



    font-weight: bold;



    text-align: center;



    float: right;



    padding-bottom: 10px !important;



    margin-right: 50px !important;

}



.about-item-chip-text {

    font-size: 11px;

}



.set-profile-btn {

    font-size: 10px;



    background-color: rgba(0, 0, 0, 0.6);



    color: rgba(255, 255, 255, 0.7);



    font-weight: bold;



    text-align: center;



    padding: 5px 10px 5px 10px;



    -webkit-border-radius: 5px;



    -moz-border-radius: 5px;



    border-radius: 5px;

}



.set-profile-btn:hover {

    font-size: 10px;



    background-color: rgba(0, 0, 0, 0.8);



    transition: 1s;



    color: rgba(255, 255, 255, 0.9);



    cursor: pointer;

}



.add-more-photos {

    padding: 10px;

}



.about-profile-content {

    padding: 15px;

}



.profile-info-item {

    margin: 6px 2px 6px 2px !important;

}



.user-msg-list .mdl-list__item {

    /* padding: 10px 0px 10px 30px !important; */

}



.user-msg-list .mdl-list__item-avatar {

    height: 60px !important;



    width: 60px !important;

}



.user-msg-list .active {

    font-weight: bold;

}



.user-msg-list .active .text {

    background: #e9ca2d9e;



    border-radius: 5px;



    /* border-bottom-left-radius: 30px;



    border-top-left-radius: 30px; */

}



.message-container {

    margin: 0px !important;



    min-height: 0px !important;



    width: 300px !important;

}



.message-container-item {

    padding: 5px !important;



    margin: 0px !important;



    width: 300px !important;



    height: auto !important;

}



.message-container-item-header a {

    font-size: 13px !important;

}



.message-container-item-header {

    font-size: 12px !important;

}



.message-container-item-text {

    font-size: 12px !important;



    margin-left: 75px;



    margin-top: -25px;



    margin-bottom: 5px;



    overflow: hidden !important;



    width: 500px;

}



.loading-container {

    position: absolute;



    top: 0;



    right: 0;



    bottom: 0;



    left: 0;



    overflow: scroll;



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



    z-index: 9999;



    opacity: 0;



    -webkit-transition: opacity 400ms ease-in;



    -moz-transition: opacity 400ms ease-in;



    transition: opacity 400ms ease-in;

}



.loading-container > div {

    position: relative;



    width: 50px;



    height: 50px;



    margin: 10% auto;



    z-index: 99999;

}



.loading-container > div > div {

    width: 100%;



    height: 100%;

}



#pageTitle {

    font-weight: bold;

}



#pageDesc {

    font-size: medium;



    margin-top: 4px;

}



.package-container {

    padding-left: 15px;



    padding-right: 15px;



    margin-right: 22px;

}



.package a {

}



.package-label {

    font-size: 12px;



    font-weight: bold;



    color: rgba(255, 255, 255, 0.9);

}



.cometchat_tabtitle {

    border-top-left-radius: 0px !important;



    border-top-right-radius: 0px !important;

}



.cometchat_userstabtitle {

    border-top-left-radius: 0px !important;



    border-top-right-radius: 0px !important;

}



.cometchat_tab {

    border-top-left-radius: 0px !important;



    border-top-right-radius: 0px !important;

}



.middlePopup {

    vertical-align: middle;

}



.outerPopup {

    display: none;

    position: absolute;



    width: 100%;



    height: 100%;



    z-index: 10000;



    background-color: rgba(0, 0, 0, 0.5);

}



.on-hover-pointer {

}



.on-hover-pointer:hover {

    cursor: pointer;

}



.chat-with-profile-title {

    font-size: 1.1em;



    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;

}



.chat-with-profile-title span {

    font-size: 1.1em;



    text-shadow: -0.5px 0 grey, 0 -0.5px grey, -0.5px 0 white, 0 -0.5px grey;

}



.member-profile-href span:hover {

    cursor: pointer;



    color: rgba(255, 255, 255, 0.9);



    transition: 1s;

}



.user-pref {

    font-style: italic;

}



.mdl-layout__container {

    /*background: rgba(255, 138, 64, 0.1);*/
    background: #77787857;
    /*padding-bottom: 52px;*/

}



.your-message-input {

    border: 1px solid rgba(0.1, 0.1, 0.1, .5) !important;

    border-bottom: 3px solid rgba(0.1, 0.1, 0.1, .5) !important;

}



.policy-label {

    color: rgba(0, 0, 0, 0.5);

}



.menu-btn-extmenu {

    color: #000;

    margin-top: -5px !important;

}



.menu-btn-phone {

    padding: 20px;

    color: #000;

}



.menu-btn {

    padding: 30px;

    cursor: pointer;

    color: #000;

    font-weight: bold;

    text-transform: uppercase;

}



.menu-btn a {

    color: #000;

    font-weight: bold;

    text-transform: uppercase;

}



.menu-btn a:hover {

    color: #000;

    font-weight: bold;

    text-transform: uppercase;

}



.menu-btn:hover {

    background: rgba(0.1, 0.1, 0.1, .3);

}



#userBtn{

    min-width: 50px !important;

}





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

    .deskContent {

        display: block;

    }

    .phoneContent {

        display: none;

    }

}



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

    .menu-btn{

        padding: 19px;

    }

    .deskContent {

        display: none;

    }

    .phoneContent {

        display: block;

    }

}





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

    .menu-btn{

        padding: 15px;

    }

}



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

    .menu-btn{

        padding: 8px;

    }

}



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

    .menu-btn{

        padding: 7px;

    }

}



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

    .menu-btn{

        padding: 10px;

    }

}



@media all and (min-width: 480px) and (max-width:619px){

    .menu-btn{

        padding: 29px!important;

    }

}



@media (min-width:700px) and (max-width:839px) {

    .spacer-navi{

        width:20%;

    }

}



@media(min-width:1100px) and (max-width:1250px){

    .spacer-navi{

        width:10%;

    }

}



@media(min-width:1250px) and (max-width:1440px){

    .spacer-navi{

        width:24%;

    }

}



@media(min-width:1440px) and (max-width:1650px){

    .spacer-navi{

        width:30%;

    }

}



@media(min-width:1650px) and (max-width:2200px){

    .spacer-navi{

        width:40%;

    }

}







.admin-messages {

    font-size: 14px !important;

}



.admin-messages .mdl-list__item {

    font-size: 14px !important;

}



.admin-messages-user-list li {

    padding-top: 15px;

    border-bottom: 1px solid;

}



.admin-messages-user-list-action {

    background-color: transparent !important;

    background: transparent !important;

}



.admin-messages-selected {

    background-color: rgba(199, 173, 2, 0.66);

}



.admin-messages td {

    height: 30px !important;

}



@media (max-width: 1024px) and (min-width:521px){

    .menu-btn{

        padding: 15px;

    }

 }





 @media(min-width:769px) and (max-width:991px){

    #name-card{

        top: 66.5%!important;

    }

 }

 

 /* width */

::-webkit-scrollbar {

  width: 15px;

}



/* Track */

::-webkit-scrollbar-track {

  background: #f1f1f1; 

}

 

/* Handle */

::-webkit-scrollbar-thumb {

  background: #888; 

}



/* Handle on hover */

::-webkit-scrollbar-thumb:hover {

  background: #555; 

}



.form-control{

    border:2px solid rgba(255, 255, 255, 0.4)!important;

}



.backgroundIndex{

    background-image: url(images/bg3.jpg);

    background-size:cover; 

    background-position: center; 

    height: 100vh!important;

}



@media (min-width:1024px){

    .backgroundIndex{

        background-image: url(/images/wall.jpg);



    }

}

#about-panel,#photos-panel{

    background: #ffffff75;

}



    .about-item {
    font-size: 14px;
    padding: 2px;
    margin-top: 15px;
    margin-bottom: 15px;
    border-radius: 30px;
    background: #cccccc;
    width: 200px;
    margin: 15px auto;

    }

@media (max-width:1024px){
    div.backgroundIndex{
        min-height: 700px !important;
        background-image: none !important; 
    }

    header#home{
        min-height: 700px;
    }

    footer#gray-footer{
        margin-bottom: 0px;
        height: auto !important;
        background: #868686d9 !important;
    }

    div.mdl-layout--fixed-header{
        height: auto !important; 
        overflow: visible !important;
    }

    header#home div.no-shadow div#top-nav-bar {
        background: #8f8135e3 !important;
    }

    .mdl-mini-footer--link-list, .mdl-mini-footer__link-list{
        display: block !important;
        float: none !important;
    }

    .mdl-mini-footer--link-list, .mdl-mini-footer__link-list li{
        display: inline-block !important; 
    }

    

}
