/*###################### Generally used START ########################*/
.cursorPointer { cursor: pointer;}
.cursorDefault { cursor: default;}
.fileSizeBadge {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0.8;
}

.mos-bg-red-dark {
    background-color: rgba(91, 8, 16, 1) !important;
}

.footer-extra a {
    color: #909090 !important;
}
.footer-extra a:hover {
    color: #d0a518 !important;
}

/*###################### Generally used end ########################*/

/*###################### Icon Settings Start ########################*/
.xxs { font-size: 10px; }
.xs { font-size: 12px; }
.s { font-size: 18px; }
.m { font-size: 20px; }
.l { font-size: 24px; }

.light { color: #f0f0f0; }
.red { color: #db4a37; }
.pink { color: hotpink; }
.blue { color: #007bff; }
.dark { color: #343a40; }
.green { color: #04c12e; }
.grey { color: #666666; }
.dark-red { color: #5b0810; }
.amber { color: #FFBF00}
/*###################### Icon Settings End ########################*/

/*###################### Layer START ########################*/
.box_show_data {
    display: block;
    position:absolute;
    overflow:hidden;
    top:50%;
    background-color: rgb(255, 255, 255);
    opacity:0.7;
    color:#000000;
    font-weight:bold;
    font-size:11px;
    z-index:5;
}
.box_show_data a {
    color:#000000;
    text-decoration:underline;
}
.box_show_data a:hover {
    color:#000000;
    text-decoration: underline;
}
/*###################### Layer END ########################*/

/*###################### Counter Start ########################*/
.counter {
    text-align: center;
}
.counter-count {
    font-size: 18px;
    position: relative;
    color: #ffffff;
    text-align: center;
    line-height: 92px;
    width: 92px;
    height: 92px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    display: inline-block;
}
.counter-title {
    sfont-size: 24px;
    color: #000000;
    sline-height: 34px;
}
/*###################### Counter End ########################*/

/*###################### Side nav start ########################*/
.sisdev-sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1050;
    top: 0;
    left: 0;
    background-color: #343a40;
    overflow-x: hidden;
    transition: 0.5s;
    opacity: 0.9;
    padding-top: 40px;
}

.sisdev-sidenav a {
    padding: 8px;
    text-decoration: none;
    font-size: 12px;
    color: #f0f0f0;
    display: block;
    transition: 0.3s;
}

.sisdev-sidenav a:hover {
    color: #f1f1f1;
}

.sisdev-closebtn {
    position: absolute;
    top: 10px;
    right: 14px;
}
/*###################### Side nav end ########################*/

.showOnlineDot {
    display: block;
    position: absolute;
    right: 5px;
    top: 1px;
}
/*###################### Map End   ########################*/

/*###################### pages   ########################*/
.page_cover {
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 250px;
    padding-bottom: 0 !important;
    background-position: center;
}

.avatar-container{
    height: 250px;
}
.avatar{
    border-radius: 6px;
    background-repeat: no-repeat;
    background-size: cover;
    width: 120px;
    height: 120px;
    background-position: center;
}
/*###################### end pages  ########################*/

/*###################### start dialogs  ########################*/
.dialog_user_pic {
    display: block;
    width: 50px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.dimmed {
    content: " ";
    z-index: 10;
    display: block;
    position: absolute;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.5);
}

/*###################### end dialogs  ########################*/



.user_pic_30 {
    display: block;
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.user_pic_50 {
    display: block;
    width: 50px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.user_pic_80 {
    display: block;
    width: 80px;
    height: 80px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

/*###################### start payment plans  ########################*/
.paymentPlan{text-align:center}
.paymentPlan .pricingTable-header{padding:30px 0;background:#4d4d4d;position:relative;transition:all .3s ease 0s}
.paymentPlan:hover .pricingTable-header{background:#09b2c6}
.paymentPlan .pricingTable-header:after,.paymentPlan .pricingTable-header:before{content:"";width:16px;height:16px;border-radius:50%;border:1px solid #d9d9d8;position:absolute;bottom:12px}
.paymentPlan .pricingTable-header:before{left:40px}
.paymentPlan .pricingTable-header:after{right:40px}
.paymentPlan .heading{font-size:20px;color:#fff;text-transform:uppercase;letter-spacing:2px;margin-top:0}
.paymentPlan .price-value{display:inline-block;position:relative;font-size:55px;font-weight:700;color:#09b1c5;transition:all .3s ease 0s}
.paymentPlan:hover .price-value{color:#fff}
.paymentPlan .currency{font-size:30px;font-weight:700;position:absolute;top:6px;left:-19px}
.paymentPlan .pricing-content{padding-top:30px;background:#fff;position:relative;text-align: left;}
.paymentPlan .pricing-content:after,.paymentPlan .pricing-content:before{content:"";width:16px;height:16px;border-radius:50%;border:1px solid #7c7c7c;position:absolute;top:12px}
.paymentPlan .pricing-content:before{left:40px}
.paymentPlan .pricing-content:after{right:40px}
.paymentPlan .pricing-content ul{padding:0 20px;margin:0;list-style:none}
.paymentPlan .pricing-content ul:after,.paymentPlan .pricing-content ul:before{content:"";width:8px;height:46px;border-radius:3px;background:linear-gradient(to bottom,#818282 50%,#727373 50%);position:absolute;top:-22px;z-index:1;box-shadow:0 0 5px #707070;transition:all .3s ease 0s}
.paymentPlan:hover .pricing-content ul:after,.paymentPlan:hover .pricing-content ul:before{background:linear-gradient(to bottom,#40c4db 50%,#34bacc 50%)}
.paymentPlan .pricing-content ul:before{left:44px}
.paymentPlan .pricing-content ul:after{right:44px}
.paymentPlan .pricing-content ul li{font-size:15px;font-weight:700;color:#777473;padding:10px 0;border-bottom:1px solid #d9d9d8}
.paymentPlan .pricing-content ul li:last-child{border-bottom:none}
.paymentPlan .read{display:inline-block;font-size:16px;color:#fff;text-transform:uppercase;background:#d9d9d8;padding:8px 25px;margin:30px 0;transition:all .3s ease 0s}
.paymentPlan .read:hover{text-decoration:none}
.paymentPlan:hover .read{background:#09b1c5}
@media screen and (max-width:990px){.paymentPlan{margin-bottom:25px}
}
/*###################### end payment plans  ########################*/