/* ------ Table of Content ------
1. Reset
2. Clearing Floats
3. HTML 5 element
4. Typography
5. Basic Layout
6. Pages
7. All Hack
8. Font Icons
*/

/* 4. Typography
***************************************************************/

@font-face {
    font-family: 'ProximaNovaA-Regular';
    src: url('../fonts/ProximaNovaA-Regular.eot');
    src: url('../fonts/ProximaNovaA-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/ProximaNovaA-Regular.woff') format('woff'), url('../fonts/ProximaNovaA-Regular.ttf') format('truetype'), url('../fonts/ProximaNovaA-Regular.svg#ProximaNovaA-Regular') format('svg');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
 unicode-range: U+0008-2026;
}
@font-face {
  font-family: 'ProximaNovaT-Thin';
  src: url('../fonts/ProximaNovaT-Thin.woff') format('woff'),
       url('../fonts/ProximaNovaT-Thin.ttf') format('truetype'),
       url('../fonts/ProximaNovaT-Thin.svg#ProximaNovaT-Thin') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
    font-family: 'proximanovalight';
    src: url('../fonts/proximanovalight.eot');
    src: local('proximanovalight'), url('../fonts/proximanovalight.woff') format('woff'), url('../fonts/proximanovalight.ttf') format('truetype');
}


/* 1. Reset
***************************************************************/
* {
	border: 0 none;
	outline: 0;
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	-webkit-appearance: value;
	-moz-appearance: value;
	appearance: value;
}
html, body, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, span, strike, strong, sub, sup, tt, var, b, u, i, center, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, fieldset, {
margin:0px auto;
padding:0px;
border:0;
outline:0;
font-size:100%;
}
a, img a {
	text-decoration: none;
	border: 0;
	outline: 0 !important;
	transition: all ease-in .3s;
	-moz-transition: all ease-in .3s;
	-ms-transition: all ease-in .3s;
	-o-transition: all ease-in .3s;
	-webkit-transition: all ease-in .3s;
}
a, button, input {
	transition: all ease-in .3s;
	-moz-transition: all ease-in .3s;
	-ms-transition: all ease-in .3s;
	-o-transition: all ease-in .3s;
	-webkit-transition: all ease-in .3s;
}
:focus {
	outline: 0px;
}
table {
	border-collapse: collapse;
	border-spacing: 0px;
}
ol, ul, li {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
.fa {
	display: inline-block;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* 2. Clearing Floats
***************************************************************/
.clear {
	clear: both;
}
.clearfix:after {
	clear: both;
}
.clearfix:before, .clearfix:after {
	content: " ";
	display: table;
}
.full-height {
	height: 100%;
}
/* 3. HTML 5 element
***************************************************************/

aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, article {
	display: block;
	margin: 0;
	padding: 0;
}
html, body {
	height: 100%;
    font-family: 'ProximaNovaA-Regular';
}
body {
    background-size: cover;
    color: #000;
    font-size: 0.875em;
    font-weight: 400;
    height: 100%;
    width: 100%;
    font-family: 'ProximaNovaA-Regular';
    background: #e5e5e5;
    text-rendering: optimizeLegibility;
}


.verticle-table {
	display: table;
	width: 100%;
	height: 100%;
}
.verticle-table-cell {
	display: table-cell;
	vertical-align: middle;
}

input[type="file"] {
    display: none;
}
input[type="text"], input[type="password"], textarea {
    margin: 0 0 0px;
    padding: 5px 8px;
    border: 1px solid #c6c4c4;
    width: 100%;
    transition: all ease-in .3s;
    -moz-transition: all ease-in .3s;
    -ms-transition: all ease-in .3s;
    -o-transition: all ease-in .3s;
    -webkit-transition: all ease-in .3s;
    font-size: 16px;
    border-radius: 3px;
    width: 100%;
}
    



        input[type="text"]:hover,
        textarea:hover,
        input[type="text"]:focus,
        textarea:focus {
            border-color: #86c440;
        }
        
        input[type="text"]:focus,
        textarea:focus {
            box-shadow: 0 0 5px #86c440 !important;
            -moz-box-shadow: 0 0 5px #86c440 !important;
            -ms-box-shadow: 0 0 5px #86c440 !important;
            -o-box-shadow: 0 0 5px #86c440 !important;
            -webkit-box-shadow: 0 0 5px #86c440 !important;
        }

input[type="checkbox"] {
    display: none;
}

input[type="checkbox"] + label > span {
    background: rgba(0, 0, 0, 0) url(../images/uncheck.png) no-repeat;
    cursor: pointer;
    display: inline-block;
    height: 35px;
    margin: -1px 6px 0 0;
    position: relative;
    vertical-align: middle;
    width: 45px;
}
input[type="checkbox"]:checked + label > span {
    background: url(../images/check.png) no-repeat;
    width: 45px;
    height: 35px;
}



input[type="radio"] {
    display: none;
}

input[type="radio"] + label > span {
    background: rgba(0, 0, 0, 0) url(../images/uncheck-radio.png) no-repeat;
    cursor: pointer;
    display: inline-block;
    height: 16px;
    margin: 0px 6px 0 0;
    position: relative;
    vertical-align: middle;
    width: 16px;
}
input[type="radio"]:checked + label > span {
    background: url(../images/check-radio.png) no-repeat;
    width: 16px;
   }
/* 5. Basic Layout
***************************************************************/

.body{
    margin: 0;
    padding: 0;
    font-family: 'ProximaNovaA-Regular';
    background-color: #e5e5e5;
}
.p-sm{
    padding: 15px;
}
.p-lg{
    padding: 30px;
}
.p-b-lg{
    padding-bottom: 30px;
}
.p-xs-lg{
    padding: 60px;
}
.m-t-sm{
    margin-top: 15px;
}
.m-t-lg{
    margin-top: 30px;
}
.m-b-sm{
    margin-bottom: 15px;
}
.m-b-xlg {
    margin-bottom: 50px;
}
.wrap{
    width: 100%;
}
.commn-pad{
    padding: 0 !important;
}
.center{
    text-align: center;
}
.data-wrap{
    position: relative;
    min-height: 100%;
    width: 100%;
}


.mob-toggle-wrap {
    float: left;
    display: none;
}
span.circle-bar {
    display: block;
    background: #fff;
    height: 8px;
    width: 8px;
    border-radius: 50%;
    margin: 6px 15px 0 0;
}
.brand-side{
    float: left;
    margin: 0 0 0 44px;
}

.brand-name {
    font-size: 34px;
    color: #fff;
    display: inline-block;
    padding: 9px;
}
.brand-side .brand-wrap img{

}

.account-setting-wrap {
    float: right;
    margin: 16px 20px 0 0;
}

.noti-bell-wrap {
    float: left;
    position: relative;
    cursor: pointer;
}
.noti-digit {
    font-size: 11px;
    background: #f00;
    border-radius: 50%;
    padding: 3px;
    color: #fff;
    margin: 0;
    border: 0;
    position: absolute;
    top: 0;
    right: 19px;
    border: 1px solid tan;
    box-shadow: none;
}


.noti-bell-wrap span {
    position: relative;
    display: block;
    padding: 4px 28px;
    font-size: 25px;
    color: #fff; 
    border-right: 1px solid #fff;
}

.notification-wrap {
    position: absolute;
    top: 50px;
    background: #fff;
    width: 400px;
    display: block;
    right: 2px;
    border-radius: 5px;
    box-shadow: 5px 5px 8px rgba(204, 204, 204, 0.48);
    display: none;
}
.notification-wrap:before {
    content: "";
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-bottom: 28px solid #fff;
    position: absolute;
    top: -12px;
    right: 19px;
}
.active-circle {
    display: inline-block;
    font-size: 6px;
    color: #f00;
    display: none;
}


.noti-head {
    font-size: 18px;
    padding: 10px 16px;
    border-bottom: 1px solid #e0e0e0;
}

.noti-list-img img {
    width: 100%;
    height: 60px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

.noti-list-img {
    width: 60px;
    height: 60px;
    overflow: hidden;
    border-radius: 50%;
}
.notification-label {
    color: #000000;
    font-size: 16px;
    display: inline-block;
}

.notification-note {
    font-size: 14px;
    color: #aeacac;
    font-weight: normal;
    display: inline-block;
}

.notification-time {
    font-size: 16px;
    font-weight: normal;
    color: #aaa;
    display: block;
}

.inner-notification-wrap ul li a:active .notification-note,.inner-notification-wrap ul li a.active .notification-note{
    color: #000;
} 

.inner-notification-wrap ul li a:active .active-circle,.inner-notification-wrap ul li a.active .active-circle{
    display: inline-block;
}


.wrap-noti-content {
    margin: 9px 0 0 14px;
}





.inner-notification-wrap {
    margin: 0;
    padding: 0;
    height: 250px;
}
.mCSB_inside>.mCSB_container {
    margin-right: 0px;
}
.inner-notification-wrap ul {
    margin: 0;
    padding: 5px 13px;
}
.inner-notification-wrap ul li {
    display: list-item;
    margin: 0;
    padding: 0;
    background: transparent;
}
.inner-notification-wrap ul li a {
    font-size: 15px;
    text-align: left !important;
    text-decoration: none;
    border-bottom: 1px solid #c9c9c9;
    color: #6f868b;
    display: block;
    position: relative;
    padding: 15px 26px;
}
.inner-notification-wrap ul li a .dot {
    position: absolute;
    left: 11px;
    color: #6f868b;
    font-size: 11px;
    top: 43%;
}
.view-all {
    font-size: 20px;
    text-align: center;
    padding: 15px 0;
    background: #15d48c;
    color: #fff;
    cursor: pointer;
    border-radius: 0 0 5px 5px;
}


.my-account {
    float: right;
    position: relative;
    cursor: pointer;
}

.my-account span {
    font-size: 20px;
    display: block;
    padding: 5px 19px 0 23px;
    color: #fff;
}
.acc-setting-wrap {
    position: absolute;
    top: 52px;
    right: 0;
    background: #f7f7f7;
    border-radius: 4px;
    padding:0;
    box-shadow: 2px 2px 6px #ccc;
    width: 180px;
    display: none;
}
.acc-setting-wrap ul{
    margin: 0;
    padding:0; 
}

.acc-setting-wrap ul li{
    margin: 0;
    padding:0; 
}

.acc-setting-wrap ul li a {
    font-size: 16px;
    text-decoration: none;
    color: #262626;
    margin: 0;
    padding: 8px 11px;
    display: block;
    border-bottom: 1px solid #eaeaea;
}
.acc-setting-wrap ul li a:hover{
    color: #86c440;
}


.left-user-block {
    padding: 15px 10px;
    margin: 100px 0 0 0;
}
.left-user-block span {
    text-align: center;
    display: block;
}



.left-menu ul{
    margin: 0;
    padding: 0;
}
.left-menu ul li{
    margin: 0;
    padding: 0;
    display: list-item;
}
.left-menu ul li{
    margin: 0;
    padding: 0;
}

.left-menu ul li a label.nav-txt{
    display: inline-block;
    transition: 1s !important;
    font-weight: normal;
}


.left-menu ul li a span {
    margin: 5px 5px;
    display: inline-block;
    vertical-align: middle;
    width: 30px;
    height: 30px;
}
.left-menu ul li a span.home{
    background-image: url("../images/home.png");
    background-repeat: no-repeat;
}
.left-menu ul li a span.add-pet{
    background-image: url("../images/add-pet.png");
    background-repeat: no-repeat;
}
.left-menu ul li a span.feeds{
    background-image: url("../images/feeds.png");
    background-repeat: no-repeat;
}
.left-menu ul li a span.my-firend{
    background-image: url("../images/my-firend.png");
    background-repeat: no-repeat;
}
.left-menu ul li a span.chat{
    background-image: url("../images/chat.png");
    background-repeat: no-repeat;
}


.left-menu ul li a span.pets{
    background-image: url("../images/pet.png");
    background-repeat: no-repeat;
}

.left-menu ul li a span.alert{
    background-image: url("../images/alert.png");
    background-repeat: no-repeat;
}


.left-menu ul li a:hover span.home, .left-menu ul li a.active span.home{
    background-image: url("../images/home-w.png");
    background-repeat: no-repeat;
}
.left-menu ul li a:hover span.add-pet, .left-menu ul li a.active span.add-pet{
    background-image: url("../images/add-pet-w.png");
    background-repeat: no-repeat;
}
.left-menu ul li a:hover span.feeds, .left-menu ul li a.active span.feeds{
    background-image: url("../images/feeds-w.png");
    background-repeat: no-repeat;
}
.left-menu ul li a:hover span.my-firend, .left-menu ul li a.active span.my-firend{
    background-image: url("../images/my-firend-w.png");
    background-repeat: no-repeat;
}
.left-menu ul li a:hover span.chat, .left-menu ul li a.active span.chat{
    background-image: url("../images/chat-w.png");
    background-repeat: no-repeat;
}

.left-menu ul li a:hover span.pets, .left-menu ul li a.active span.pets{
    background-image: url("../images/pet-w.png");
    background-repeat: no-repeat;
}

.left-menu ul li a:hover span.alert, .left-menu ul li a.active span.alert{
    background-image: url("../images/alert-w.png");
    background-repeat: no-repeat;
}


.right-panel {
    margin: 0 0 0 220px;
    padding: 105px 0 0 0;
}
.inner-right-panel {
    padding: 15px;
}
.white-wrapper{
    background-color: #fff;
}

.cover-pic-wrap {
    height: 225px;
    width: 100%;
    background: #cde5f6;
    position: relative;
    overflow: hidden;
}

.cover-pic-wrap figure img {
    width: 100%;
}


.cover-pic-wrap span {
    font-size: 28px;
    color: #989696;
    text-align: center;
    display: block;
    text-align: center;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

.pet-profile-wrap {
    width: 100px;
    height: 100px;
    background: #cde5f6;
    border-radius: 50%;
    overflow: hidden;
    margin: -39px 0 0 7px;
    border: 5px solid #fff;
}
.pet-profile-wrap figure img {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    padding: 0;
}

.select-wrap .bootstrap-select:not([class*="span"]):not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
    width: 100%;
}
.select-wrap button.btn.dropdown-toggle.selectpicker.btn-default {
    padding: 5px;
    font-size: 16px;
    background: #f3f3f3;
    border-radius: 2px;
    border: 1px solid #cfcfcf;
    -webkit-appearance: none;
}
.select-wrap .bootstrap-select.btn-group .btn .caret {
    background-image: url(../images/caret.png);
    width: 13px;
    height: 8px;
    background-repeat: no-repeat;
    background-size: contain;
    border: navajowhite;
    top: 15px;
}
.custom-textarea{
    resize: none;
    height: 100px;
}

.upload-wrap{
    position: relative;
}

.upload-wrap label.pet-profile-up-btn {
    background: #4fcaa8;
    color: #fff;
    font-size: 21px;
    padding: 7px 0 0 0;
    border-radius: 50%;
    /* display: block; */
    font-weight: normal;
    position: absolute;
    right: 16%;
    top: 63%;
    height: 40px;
    width: 40px;
    text-align: center;
}
.pet-content-col{
    padding: 10px;
}
.pet-profile-step{
    padding: 0;
    margin: 0;
    text-align: center;
}

.pet-profile-step ul{
    padding: 0;
    margin: 0;
}

.pet-profile-step ul li{
    padding: 0;
    margin: 0;
    display: inline-block;
}

.pet-profile-step ul li a{
    padding: 0;
    text-decoration: none;
    color: #fff;
    margin: 0;
    display: block;
    background-color: #50ce9f;
    font-size: 20px;
    padding: 14px;
    position: relative;
}
.pet-profile-step ul li:first-child a{
    background-color: #31a87c;
    border-radius: 5px 0 0 5px;
}

.pet-profile-step ul li:first-child a:after {
    border-top: 28px solid transparent;
    border-bottom: 30px solid transparent;
    border-left: 27px solid #31a87c;
    content: "";
    position: absolute;
    z-index: 9;
    top: -1px;
    right: -27px;
}

.pet-profile-step ul li:last-child a {
    width: 100%;
    padding: 14px 14px 14px 40px;
}

.pet-profile-step ul li:last-child a:after{
    border-top: 28px solid transparent;
    border-bottom: 28px solid transparent;
    border-left: 27px solid #50ce9f;
    content: "";
    position: absolute;
    z-index: 9;
    top: 0;
    right: -27px;
}

label.admin-label {
    font-size: 17px;
    color: #a4a4a4;
    font-weight: normal;
}
.radio-label{
    font-size: 17px;
    color: #a4a4a4;
    font-weight: normal;
    display: inline-block;
}

.out-line-btn {
    width: 100%;
    border: 2px solid #50ce9f;
    color: #50ce9f;
    background-color: transparent;
    font-size: 26px;
    padding: 10px 0;
    border-radius: 3px;
}

.pet-differ-pic-wrap{
    margin: 0;
    padding: 0;
    text-align: center;
}

.pet-differ-pic-wrap ul{
    margin: 0;
    padding: 0;
}

.pet-differ-pic-wrap ul li {
    margin: 0;
    padding: 0;
    display: inline-block;
    margin: 0 11px 0 0;
}
.pet-differ-pic-wrap ul li a {
    text-decoration: none;
    display: block;
    width: 80px;
    height: 80px;
    overflow: hidden;
    border: 1px solid #cde5f6;
}

.pet-differ-pic-wrap ul li a img {
    width: 100%;
    height: 76px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}
.form-field-wrap {
    position: relative;
}

label.paper-pin {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 23px;
    background: #50ce9f;
    color: #fff;
    padding: 0 5px 1px 5px;
    text-align: center;
}

.step-2{
    display: none;
}

.diseases-y{
    display: none;
}

.white-wrapper.pet-content-col.step-2 {
    height: 670px;
}

label.pet-name {
    font-size: 26px;
    margin: 0;
}
label.pet-breed-label {
    font-size: 16px;
    color: #2a89cb;
    font-weight: normal;
}

p.commn-para {
    font-size: 18px;
    margin: 0;
}
label.show-label {
    font-size: 16px;
}

label.top-label {
    font-size: 22px;
}

.top-wrap {
    margin: -21px -15px 10px -36px;
    background: #fff;
}
.green-bg {
    background-color: #4dc2b8;
    margin: -21px -15px 20px -36px;
    border-top: 5px solid #6aede2;
}
.differ-pets-wrap{
    text-align: center;
    margin: 0 0 0 0;
    padding: 20px 0;
}

.differ-pets-wrap ul{
    margin: 0;
    padding: 0;
}
.differ-pets-wrap ul li{
    display: inline-block;
    margin: 0 0 0 10px;
    padding: 0;
}

.differ-pets-wrap ul li a{
    display: block;
    border-radius: 50%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    width: 100px;
    height: 100px;
    background-color: #ccc;
    border:3px solid transparent;
    transform: scale(1.0); 
}

.differ-pets-wrap ul li a img{
    width: 100%;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    height: 100%;
}
.differ-pets-wrap ul li a:active,.differ-pets-wrap ul li a:hover, .differ-pets-wrap ul li a.active{
    border:3px solid #50ce9f;  
    transform: scale(1.1); 
}

.my-firend-tab-wrap{
    margin: 0;
    padding: 0;
}

.my-firend-tab-wrap ul{
    margin: 0;
    padding: 0;
}

.my-firend-tab-wrap ul li{
    margin: 0;
    padding: 0;
    display: inline-block;
}

.my-firend-tab-wrap ul li a {
    text-decoration: none;
    color: #a4a4a4;
    font-size: 20px;
    margin: 0 30px 0 0;
    padding: 10px 10px 10px 0;
}

.my-firend-tab-wrap ul li a:active,.my-firend-tab-wrap ul li a:hover,.my-firend-tab-wrap ul li a.active{
    color: #50ce9f;
}

.hide-tab{
    display: none;
}
.show-tab{
        display: block;
}
.commn-frnd-block{
    background-color: #fff;
    border: 1px solid #e5e5e5;
    padding: 13px;
    margin: 5px;
}
.brd {
    border-left: 1px solid #e5e5e5;
    padding: 0 0 0 34px;
}
figure.my-firend-img-wrap {
    border-radius: 50%;
    overflow: hidden;
    width: 140px;
    height: 140px;
    border: 2px solid #efefef;
    margin: 30px auto;
}
figure.my-firend-img-wrap img {
    width: 100%;
}

label.frnd-name {
    font-size: 24px;
    display: block;
}
label.frnd-location {
    font-size: 20px;
    font-weight: normal;
    color: #818181;
}
.frnd-action-wrap{
    margin: 0 ;
    padding: 0;
}
.frnd-action-wrap ul{
    margin: 0;
    padding: 0;
}
.frnd-action-wrap ul li{
    display: inline-block;
    margin: 0;
    padding: 0;
}

.frnd-action-wrap ul li a {
    display: block;
    padding: 0;
    margin: 0 25px 0 0;
}


.fd-ban {
    width: 47px;
    height: 29px;
    display: inline-block;
    background-image: url(../images/ban.png);
    background-size: contain;
    background-repeat: no-repeat;
}
.fd-block{
    width: 47px;
    height: 29px;
    display: inline-block;
    background-image: url(../images/block.png);
    background-size: contain;
    background-repeat: no-repeat;
}
.fd-report {
    width: 47px;
    height: 29px;
    display: inline-block;
    background-image: url(../images/report.png);
    background-size: cover;
    background-repeat: no-repeat;
}

.fd-cancel {
    width: 47px;
    height: 29px;
    display: inline-block;
    background-image: url(../images/unfrnd.png);
    background-size: cover;
    background-repeat: no-repeat;
}

.fd-confirm {
    width: 47px;
    height: 29px;
    display: inline-block;
    background-image: url(../images/add-frnd.png);
    background-size: cover;
    background-repeat: no-repeat;
}
.fd-confirm:hover {
    background-image: url(../images/add-frnd-g.png);
}

.fd-reject {
    width: 47px;
    height: 29px;
    display: inline-block;
    background-image: url(../images/unfrnd.png);
    background-size: cover;
    background-repeat: no-repeat;
}

.fd-reject:hover {
    background-image: url(../images/un-frnd-g.png);
}

.fd-request {
    width: 47px;
    height: 29px;
    display: inline-block;
    background-image: url(../images/pending-request.png);
    background-size: cover;
    background-repeat: no-repeat;
}
.block-wrap{
    background-color: #f5f5f5;
    height: 500px;
}
.block-pad{
    padding: 30px;
}

.mind-wrap {
    width: 100%;
    background: #f9f9f9;
    padding: 10px 4px;
    overflow: hidden;
}
.userpic-wrap{
    float: left;
    width: 10%;
}
.userpic-wrap figure{
    width: 80px;
    height: 80px;
    overflow: hidden;
    border-radius: 50%;
    border: 2px solid #fff;
    overflow: hidden;
    margin: 0 0 0 10px;
}

.userpic-wrap figure img {
    width: 100%;
}
.mind-content-wrap {
    float: left;
    width: 90%;
    position: relative;
}
.post-textarea {
    border: 0;
    background: transparent;
    font-size: 18px;
    position: relative;
    padding: 0 54px 0 0;
}
.post-textarea:focus{
    border:none;
    box-shadow: none !important;
}

button.photo-bttn {
    font-size: 20px;
    padding: 6px 22px;
    background: #f4f4f4;
    border-radius: 5px;
}

button.photo-video {
    font-size: 20px;
    padding: 6px 22px;
    background: #f4f4f4;
    border-radius: 5px;
}

.photo-video-wrap {
    padding: 17px 5px;
    border-top: 1px solid #eeeeee;
    margin: 2px 0;
}
.main-v-p-wrapper {
    border: 1px solid #eeeeee;
}

button.post-bttn {
    font-size: 20px;
    padding: 5px 41px;
    border-radius: 5px;
    background: transparent;
    border: 3px solid #50ce9f;
    color: #50ce9f;
}
.owner-nametime-wrap {

    overflow: hidden;
}
.post-wrapper {
    background: #f5f5f5;
    padding: 8px;
    margin: 14px 0 0 0;
}
.post-user-wrap {
    float: left;
    margin: 0 10px 0 4px;
}
.post-upload-user-pic figure{
    width: 60px;
    height: 60px;
    overflow: hidden;
    border-radius: 50%;
    border:3px solid #50ce9f;
    margin: 0 auto;
}
.post-upload-user-pic figure img{
    width: 100%;
}

span.upload-owner-name {
    font-size: 19px;
    color: #50ce9f;
}
.details-action-para {
    font-size: 18px;
    display: inline;
}
label.owner-p-time {
    display: block;
    font-size: 18px;
    font-weight: normal;
    margin: 0;
    color: #a4a4a4;
}

.pet-post-video-img {
    margin: 15px 0 0 0;
}

.pet-post-video-img figure img {
    width: 100%;
}
.pet-post-para p {
    font-size: 20px;
    color: #000;
}
.see-more{
    color: #50ce9f;
    cursor: pointer;
}
.pet-post-para-alert {
    padding: 15px 0;
}
.pet-post-para-alert p{
    font-size: 20px;
    color: #f00;
}
.pet-post-like-coment {
    margin: 0;
    padding: 0 0 20px 0;
    border-bottom: 1px solid #f5f5f5;
}
.pet-post-like-coment ul{
    margin: 0;
    padding: 0;
}

.pet-post-like-coment ul li{
    display: inline-block;
    font-size: 18px;
}

.pet-post-like-coment ul li a {
    padding: 1px;
    margin: 0 24px 0 0;
    text-decoration: none;
    color: #000;
}
.pet-post-commnet-list {
    margin: 0;
    padding: 0;
}
label.view-more-cmmnt {
    font-size: 20px;
    padding: 20px 0;
    margin: 0;
}
.pet-post-commnet-list ul{
    margin: 0;
    padding: 0;
}
.pet-post-commnet-list ul li {
    margin: 0;
    padding: 21px 0;
    border-bottom: 1px solid #f5f5f5;
}

.comment-user-pic {
    float: left;
    margin: 0 15px 0 0;
}
.comment-user-pic figure {
    width: 60px;
    height: 60px;
    overflow: hidden;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid #e9e9e9;
}

.comment-user-pic figure img{
    width: 100%;
    height: 60px;
}
.comment-content-wrap {
    overflow: hidden;
}

.comment-content-wrap span {
    font-size: 20px;
    font-weight: 600;
}
.comment-content-wrap p {
    font-size: 18px;
}

span.post-time {
    font-size: 15px;
    color: #a4a4a4;
    font-weight: normal;
}
.hash-name{
    color: #50ce9f !important;
    cursor: pointer;
}
span.send-icon {
    font-size: 21px;
    position: absolute;
    color: rgb(80, 206, 159);
    top: 18px;
    right: 9px;
    cursor: pointer;
}
.inner-pic-wrap figure {
    width: 150px;
    height: 150px;
    overflow: hidden;
    border-radius: 50%;
    background: #ccc;
    margin: 0 auto;
    border: 4px solid #fff;
}
.profile-pic-bg {
    width: 100%;
    position: relative;
    overflow: hidden;
    padding: 0 15px;
    /* background: #ccc; */
}

.profile-pic-wrap {
    background: #50ce9f;
    padding: 10px;
}

.inner-pic-wrap {
    width: 150px;
    height: 150px;
    margin: 0 auto;
    position: relative;
}

label.camera {
    position: absolute;
    background: #fff;
    padding: 7px;
    /* top: 0; */
    border-radius: 50%;
    bottom: 0;
    right: 0;
    display:none;
}
.txt-filed-wrap {
    width: 200px;
    margin: 4px auto;
    background: #20b37b;
    padding: 5px;
    border-radius: 5px;
    text-align: center;
}

button.cancel-btn {
    background: #f9f9f9;
    font-size: 18px;
    padding: 7px 17px;
    color: #a4a4a4;
    border-radius: 5px;
    border: 1px solid #e5e5e5;
    display: none;
}

button.save-btn {
    background: #f9f9f9;
    font-size: 18px;
    padding: 7px 17px;
    color: #a4a4a4;
    border-radius: 5px;
    border: 1px solid #e5e5e5;
    display: none;
}
.edit-btn{
    background: #f9f9f9;
    font-size: 18px;
    padding: 7px 17px;
    color: #a4a4a4;
    border-radius: 5px;
    border: 1px solid #e5e5e5;
}
.profile-txt-box{
    background-color: transparent !important;
    border:none !important;
    color: #fff;
    text-align: center;
}
.profile-txt-box:focus{
    box-shadow: 0!important;
    border:none !important;
}
.admin-input{
    border:none !important;
}


input.admin-input.focus {
    background-color: #50ce9f !important;
    color: #fff;
}

textarea.admin-input.focus {
    background-color: #50ce9f;
    color: #fff;
}
.top-heading {
    font-size: 22px;
}

.search-listing {
    background-color: #fff;
    padding: 0 10px;
    /* margin: 23px 0 0 0; */
    height: 600px;
}
.search-listing ul {
    margin: 0;
    padding: 0;
}

.search-listing ul li {
    margin: 0;
    padding: 20px 0;
    border-bottom: 1px solid #e4e4e4;
}
.search-listing ul li:first-child span.notification-label, span.notification-note:active, .search-listing ul li:first-child span.notification-label, span.notification-note.active {
    color: #000;
}
.search-list-img {
    width: 100px;
    height: 100px;
    overflow: hidden;
    border-radius: 50%;
    margin: 0 auto;
}

.search-list-img img {
    width: 100%;
    height: 100px;
}
span.notification-label {
    font-size: 20px;
    color: #5a5a5a;
    font-weight: 600;
    letter-spacing: 1px;
}
.notification-note {
    font-size: 18px;
    color: #5a5a5a;
}
span.notification-time {
    color: #aaaaaa;
    font-size: 20px;
    font-weight: normal;
}

button.commn-btn {
    font-size: 18px;
    background: #d2d2d2;
    padding: 6px 16px;
    border-radius: 5px;
    border: 1px solid #e5e5e5;
    color: rgba(0,0,0,0.65);
}
.inner-pet-lost-wrap {
    background: #f5f5f5;
    padding: 10px;
    margin: 15px 0 0 0;
}
.lost-pet-col {
    padding: 5px;
    border-radius: 5px;
    border: 1px solid #e5e5e5;
}

.lots-pet-user {
    float: left;
    margin: 0 15px 0 26px;
}

.lost-pet-content-top {
    overflow: hidden;
}

.lots-pet-user figure {
    width: 60px;
    height: 60px;
    overflow: hidden;
    border-radius: 50%;
    border: 2px solid #4fc7ad;
}

.lots-pet-user figure img {
    width: 100%;
}

.lost-pet-wrap-pic {
    width: 100%;
    overflow: hidden;
    height: 250px;
    padding: 0px 20px 14px;
}
.black-srtip {
    background: #000;
    font-size: 34px;
    text-align: center;
    color: #fff;
    margin: 0 5px;
}

.lost-pet-wrap-pic figure img{
    width: 100%;
}

.lost-heading {
    font-size: 22px;
    font-weight: 600;
    text-align: center;
    margin: 8px 0;
    padding: 0;
}

.pet-lost-details {
    font-size: 18px;
    text-align: center;
}

span.high-light {
    font-weight: 600;
    font-size: 20px;
}


/************/
.body-bg{
    background-color: #000;
    position: relative;
}

.wrap-login-form {
    /* width: 350px; */
    position: absolute;
    left: 40%;
    width: 300px;
    top: 20%;
}
.login-logo{
    width: 100%;
    text-align: center;
}
.login-logo img{
    width: 150px;
}
label.login-label {
    font-size: 18px;
    color: #666666;
}
button.log-bttn {
    width: 100%;
    font-size: 23px;
    border-radius: 5px;
    padding: 8px 0;
    background: #86c440;
    color: #161616;
    text-transform: uppercase;
    margin: 20px 0 0 0;
}
span.forgot {
    font-size: 18px;
    display: block;
    text-align: right;
    color: #393939;
    cursor: pointer;
}


.wrap-login-form input[type="text"], .wrap-login-form input[type="password"], .wrap-login-form textarea {    margin: 0 0 0px;    padding: 5px 8px;    border: 1px solid #eee;    width: 100%;    transition: all ease-in .3s;    -moz-transition: all ease-in .3s;    -ms-transition: all ease-in .3s;    -o-transition: all ease-in .3s;    -webkit-transition: all ease-in .3s;    font-size: 18px;    border-radius: 3px;    width: 100%;    background: transparent;    border: none;    border-bottom: 1px solid #666;    border-radius: 0 !important;    color: #fff;    font-family: 'proximanovalight';    letter-spacing: 1px;}
   .wrap-login-form input[type="text"]:hover,
        textarea:hover,
        input[type="text"]:focus,
        textarea:focus {
            border-bottom-color: #86c440;
        }
        
        .wrap-login-form input[type="text"]:focus,
        textarea:focus {
            box-shadow:  0 1px 0px #86c440 !important;
            -moz-box-shadow:  0 1px 0px #86c440 !important;
            -ms-box-shadow:  0 1px 0px #86c440 !important;
            -o-box-shadow: 0 1px 0px #86c440 !important;
            -webkit-box-shadow:  0 1px 0px #86c440 !important;
        }

h2.b-heading {
    font-size: 20px;
    text-align: center;
    color: #fff;
}

.field-wrap .commn-para {
    font-size: 18px;
    margin: 0;
    color: #fff;
    text-align: -webkit-center;
    
    font-family: 'proximanovalight';
}


header{
    width: 100%;
    position: fixed;
    top: 0;
    padding: 10px;
    z-index: 99;
    background-color: #262626;

}
.brand-side .brand-wrap img {
    width: 125px;
}

aside {
    width: 220px;
    transition: 1s;
    position: fixed;
    left: 0;
    height: 100%;
    background: #262626;
    border-right: 1px solid #2d2d2d;
}

.left-menu ul li a:active, .left-menu ul li a:hover, .left-menu ul li a.active {
    color: #fff;
    background: #86c440;
}

.left-menu ul li a {
    font-size: 18px;
    color: #a7a7a7;
    display: block;
    text-decoration: none;
    padding: 15px 0 15px 10px;
    position: relative;
    border-bottom: 1px solid #313131;
}


.user-image {
    border-radius: 50%;
    width: 100px;
    height: 100px;
    overflow: hidden;
    margin: 0 auto;
    background: #86c440;
}
.user-image img {
    width: 100%;
    /* height: 60px; */
    min-height: 100%;
    min-width: 100%;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
}
span.dr-name {
    font-size: 24px;
    /* text-transform: uppercase; */
    margin: 9px 0 0 0px;
    display: block;
    color: #fff;
}
span.dr-desgnation {
    font-size: 16px;
    color: #818181;
    color: #ccc;
}


.table-responsive table thead th {
    background: #86c440;
    font-size: 15px;
    font-weight: normal;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    border-right: 1px solid #88d334 !important;
    padding: 10px !important;
    border-bottom: none !important;
}

.table-responsive table tbody td {
    font-size: 15px;
    color: #3d3d3d;
    text-align: center;
    border-right: 1px solid #cacfd4 !important;
}

.modal-para {
    font-size: 17px;
    text-align: center;
}
.trash-modal-icon {
    font-size: 31px;
    display: block;
    text-align: center;
    color: #f00;
}
.commn-bg {
    background: #8BC34A !important;
    color: #fff !important;
}
.sort-ascen {
    display: inline-block;
    height: 20px;
    background: transparent;
    position: relative;
    left: 5px;
    top: 4px;
    cursor: pointer;
}

.sort-ascen:before {
    font-family: FontAwesome;
    content: "\f0dd";
    position: absolute;
    left: 0;
}
.sort-dscen{
    display: inline-block;
    height: 20px;
    background: transparent;
    position: relative;
    left: 5px;
    top: 4px;
    cursor: pointer;
}


.sort-both{
    display: inline-block;
    height: 20px;
    background: transparent;
    position: relative;
    left: 5px;
    top: 4px;
    cursor: pointer;
}


.sort-both:after{
    font-family: FontAwesome;
    content: "\f0dc";
    position: absolute;
    left: 0;
}

.sort-dscen:after {
    font-family: FontAwesome;
    content: "\f0de";
    position: absolute;
    left: 0;
}

.paination-wraper {
    margin: 0;
    padding: 5px;
}

.paination-wraper ul {
    margin: 0;
    padding: 0;
}
.paination-wraper ul li {
    margin: 0;
    display: inline-block;
    padding: 0;
    float: left;
}
/*.paination-wraper ul li:first-child a {
    border-left: 1px solid #dde1e3;
    border-radius: 5px 0 0 5px;
}*/

/*.paination-wraper ul li a {
    margin: 0;
    display: block;
    padding: 10px 15px;
    font-size: 18px;
    text-decoration: none;
    color: #4e4e4e;
    border-top: 1px solid #dde1e3;
    border-right: 1px solid #dde1e3;
    border-bottom: 1px solid #dde1e3;
}*/
.paination-wraper ul li a:hover{
    background-color: #86c440;
    color: #fff;
}
a.disable {
    background: rgba(204, 204, 204, 0.35);
    color: #262626 !important;
    cursor: no-drop !important;

}
a.disable:hover{
    background: rgba(204, 204, 204, 0.35) !important;
    color: #262626 !important;
}

.paination-wraper ul li:last-child a {
    border-left: 1px solid #dde1e3;
    border-radius: 0px 5px 5px 0px;
}

.big-user-image{
    border-radius: 50%;
    width: 150px;
    height: 150px;
    overflow: hidden;
    margin: 50px auto;
    background: #86c440;
}

.big-user-image img {
    width: 100%;
    /* height: 60px; */
    min-height: 100%;
    min-width: 100%;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
}

.modal-heading {
    font-size: 19px;
    text-align: center;
    color: green;
}

.form-filed-wrap {
    position: relative;
}

label.upload-icon {
    position: absolute;
    top: 29px;
    right: 0;
    font-size: 19px;
    background: #8bc34a;
    color: #fff;
    padding: 6px 5px 0;
    border-radius: 0 4px 3px 0;
    cursor: pointer;
}

.field-wrap {
    margin-bottom: 26px;
}


.content-tab {
    margin: 10px auto;
    padding: 0;
    display: table;
    text-align: center;
}

.content-tab ul{
    margin: 0;
    padding: 0;
}

.content-tab ul li {
    display: inline-block;
    margin: 0;
    padding: 0;
    float: left;
    /* display: table; */
    margin: 0 auto;
}

.content-tab ul li a {
    font-size: 18px;
    padding: 10px 30px;
    display: block;
    text-decoration: none;
    color: #fff;
    background: #86c440;
    border-right: 1px solid #a3d374;
}

.content-tab ul li a:active,.content-tab ul li a:hover,.content-tab ul li a.active{
    background-color: #579719;
}

.content-tab ul li:first-child a{
    border-radius: 5px 0 0 5px;
}

.content-tab ul li:last-child a{
    border-radius: 0px 5px 5px 0px;
    border:none;
}
.error{
    border:0px; 
    color:red; 
    font-size: 12px;
    display : block;
}
span.sort {    display: inline-block;    width: 8px;    height: 21px;    position: relative;    padding: 0 0 0 0;    top: 7px;    left: 7px;}Sent on:5:44 pmFrom:Salil Trivedia .fa-sort-asc {    position: absolute;    margin: 0;    padding: 0;    top: 2px;}
.paination-wraper a {font-size: 18px;margin: 5px 5px;background: #86c440;padding: 4px 8px;color: #fff;}
.paination-wraper strong {font-size: 18px;margin: 5px 5px;background: #86c440;padding: 4px 8px;color: #fff;}
.custom-breadcrumb ul li {
    display: inline-block;
    margin: 0;
    padding: 0;
}

.custom-breadcrumb ul li a {
    font-size: 15px;
    display: block;
    margin: 0 10px;
    color: #fff;
    position: relative;
}

.custom-breadcrumb ul li a:after {
    position: absolute;
    content: ">";
    right: -15px;
    top: 0;
}

.custom-breadcrumb ul li:last-child a:after {
    content: "";
}
.form-fiel-wrap {position: relative;}
.search-box {/ background-image: url(../images/search-icon.png); /    background-position: 98% center;    background-repeat: no-repeat;    background-color: #a9b3bd;    color: #fff;    font-style: italic;    border-radius: 5px !important;    padding: 8px !important;    font-size: 17px;    border: none !important;    margin: 0 !important;}
.srch {position: absolute; top: 0; right: 0;  font-size: 25px;  background: #4ec038;    display: block;    width: 38px;    height: 40px;    text-align: center;    color: #fff;    cursor: pointer;}
.srch1 {position: absolute; top: 0; right: 0;  font-size: 25px; background: #4ec038;    display: block;    width: 38px;    height: 40px;    text-align: center;    color: #fff;    cursor: pointer;}
.srch {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 25px;
    background: #86c440;
    display: block;
    width: 38px;
    height: 38px;
    text-align: center;
    color: #fff;
    cursor: pointer;
}
 .mce-notification.mce-has-close {
    padding-right: 15px;
    display: none;
}
label.camera {
        position: absolute;
        background: #fff;
        /* padding: 7px; */
        bottom: 0;
        /* border-radius: 50%; */
        right: 43px;
        height: 20px;
        width: 20px;
        border-radius: 5px;
        background: rgba(255, 255, 255, 0.62);
        font-size: 21px;
        padding: 14px;
        overflow: hidden;
        text-align: center;
        cursor: pointer;
    }
    label.camera .fa.fa-camera {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
    }
    figure.commn-user-pic img {
        width: 100%;
        height:100%;
    }
    figure.commn-user-pic {
        width: 120px;
        height: 120px;
        overflow: hidden;
        border-radius: 50%;
        background-color: #86c440;
        position: relative;
        margin: 0 auto;
    }
    figure.commn-user-pic {
        background-size: cover;
        background-position: 50% 50%;
        background-repeat: no-repeat;
    }
    .form-bottom-btn-group.onModal {
        padding: 20px;
    }
    .custom-breadcrumb ul li:last-child a {    text-decoration: none;    cursor: default;}
     .term_wrapper {
    min-height: 100%;
    width: 100%;
    background: #1e1e1e;
    color: #fff;
    margin: 0;
}