/*--------------- BEGIN:purple color   -------------------- */
.InputIcon .fa {color: #4b0082;}
.my-form header {color: #ffffff;}
.my-form a {color: #4b0082; text-decoration: none;}
.my-form .toggle i::before {background-color: #4b0082;}
.my-form .button {background-color: #4b0082;/* box-shadow: 0px 0px 21px #FFF; */border: 1px solid rgba(175, 175, 175, 0.91);}
.my-form .rating input + label:hover, .my-form .rating input + label:hover ~ label {color: #4b0082;}
.my-form .radio input + i::after { background-color: #4b0082;}
.my-form .checkbox input + i::after {color: #4b0082;}
.my-form .radio input:checked + i, .my-form .checkbox input:checked + i, .my-form .toggle input:checked + i {border-color: #4b0082;}
.my-form .rating input:checked ~ label {color: #4b0082;}
.fa.fa-arrow-circle-down, .fa.fa-arrow-circle-up {color:#4b0082;}
span.form_link {color: #4b0082;}
.my-form .input input, .my-form .select select, .my-form .textarea textarea, .my-form .radio i, .my-form .checkbox i, .my-form .toggle i, .my-form .icon-append, .my-form .icon-prepend {border-color: #4b0082;}
.my-form .icon-append, .my-form .icon-prepend {color: #4b0082;}
.my-form .input:hover input, .my-form .select:hover select, .my-form .textarea:hover textarea, .my-form .radio:hover i, .my-form .checkbox:hover i, .my-form .toggle:hover i {border-color: #4b0082;}
.my-form .input input:focus, .my-form .select select:focus, .my-form .textarea textarea:focus, .my-form .radio input:focus + i, .my-form .checkbox input:focus + i, .my-form .toggle input:focus + i {box-shadow: 0 0px 10px #4b0082;}
.my-form .input input, .my-form .select select, .my-form .textarea textarea, .my-form .radio i, .my-form .checkbox i, .my-form .toggle i, .my-form .icon-append, .my-form .icon-prepend {border-color: #4b0082;}
.my-form .icon-append, .my-form .icon-prepend {color: #4b0082;}
.my-form .input:hover input, .my-form .select:hover select, .my-form .textarea:hover textarea, .my-form .radio:hover i, .my-form .checkbox:hover i, .my-form .toggle:hover i {border-color: #4b0082;}
.color_picker_button,.color_picker_box {border: 1px solid #4b0082 !important;}
.divider {background-color: rgba(77, 176, 226, 0.13);}
.input.state-disabled {background-color: rgba(77, 176, 226, 0.13);}
i.icon-circle-arrow-left, i.icon-home, i.icon-cog {color: rgb(255, 255, 255);}
i.icon-circle-arrow-left:hover {color: #4b0082;}
i.icon-home:hover {color: #4b0082;}
i.icon-cog:hover {color: #4b0082;}
.my-form footer {color: #4b0082;}
td.smrecordstitle {background-color: #4b0082;}
.my-form {background:rgba(75, 0, 130, 0.51);}
.pattern {background-color: rgba(75, 0, 130, 0.45);}
.pagerCurrent {border: 1px solid;background-color: black;color: #4b0082;}
.pagerDefault:hover {border: 1px solid;background-color: #4b0082; color: white;}
.pagerCurrent{border: 1px  solid #4b0082;background-color: rgb(159, 160, 160);color: #4b0082;font-size: 12px;font-family: Verdana;padding: 5px;text-decoration: none;cursor: default;display: block;float: left;}
.pagerDefault{border: 1px  solid #c1c1c1;background-color: #ffffff;color: #4b0082;margin-right: 2px;font-size: 12px;font-family: Verdana;padding: 5px;text-decoration: none;cursor: pointer;display: block;float: left;}
.pagerDefault:link{border: 1px  solid #c1c1c1;background-color: #ffffff;color: #4b0082;margin-right: 2px;font-size: 12px;font-family: Verdana;padding: 5px;text-decoration: none;cursor: pointer;display: block;float: left;}
.pagerDefault:visited{border: 1px  solid #c1c1c1;background-color: #ffffff;color: #4b0082;margin-right: 2px;font-size: 12px;font-family: Verdana;padding: 5px;text-decoration: none;cursor: pointer;display: block;float: left;}
.pagerDefault:hover{border: 1px  solid #4b0082;background-color: #4b0082;color: #ffffff;font-size: 12px;font-family: Verdana;padding: 5px;text-decoration: none;cursor: pointer;}
.ticket_word {border-right: 1px solid rgba(75, 0, 130, 0.21);}
.ticket_content {border-bottom: 1px solid rgba(75, 0, 130, 0.21);}
.client_reply {background: rgba(75, 0, 130, 0.21);}
/*--------------- End:purple color -------------------- */.bg-red {
  background-color: #198754 !important;
}
a {text-decoration: none !important;}
.cus-menu-li a {
	color: #198754 !important;
	border-top: ;
}

#logo:link, #logo:visited {

    color: #ffffff;
    text-align: center;
    font-size: 53px;
    font-weight: bold;
}

#logo:hover {
color:#EB1E00 ;
}

#logo > img {
    max-width: 600px;
}


/* service package */

.spbody,
.spbutton,
.spfieldname,
.spfieldinput,
.spinstructions {
    font-family: Trebuchet MS;
    font-size: 16px;
    color: #333;
}

.spbutton {
    background-color: #0d6efd;
    text-transform: capitalize;
    border-radius: 6px;
    line-height: 30px;
    font-weight: bold;
    font-size: 14px;
    color: #fff;
}

.spbody {
    background-color: transparent !important;
    width: 100% !important;
    padding: 2%;
    border: 1px solid #dee2e6 !important;
    box-sizing: border-box;
    border-radius: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='32' viewBox='0 0 16 32'%3E%3Cg fill='%23c9d1cb' fill-opacity='0.16'%3E%3Cpath fill-rule='evenodd' d='M0 24h4v2H0v-2zm0 4h6v2H0v-2zm0-8h2v2H0v-2zM0 0h4v2H0V0zm0 4h2v2H0V4zm16 20h-6v2h6v-2zm0 4H8v2h8v-2zm0-8h-4v2h4v-2zm0-20h-6v2h6V0zm0 4h-4v2h4V4zm-2 12h2v2h-2v-2zm0-8h2v2h-2V8zM2 8h10v2H2V8zm0 8h10v2H2v-2zm-2-4h14v2H0v-2zm4-8h6v2H4V4zm0 16h6v2H4v-2zM6 0h2v2H6V0zm0 24h2v2H6v-2z'/%3E%3C/g%3E%3C/svg%3E");
    background-attachment: fixed;
    background-repeat: repeat;
    background-size: auto;

    & #PaymentForm {
        font-weight: bold !important;
        font-family: Trebuchet MS !important;
        color: black !important;
    }
}

/* /service package */


/* classified */

.classifiedbody,
.classifiedheading,
.classifiedcategory,
.classifiedbody a {
    font-family: Trebuchet MS !important;
    font-size: 16px !important;
    color: #333 !important;
}

.classifiedbody a {
    font-weight: bold !important;
    color: #0d6efd !important;
}

body.classifiedbody {
    background-color: transparent !important;
    width: 100% !important;
    padding: 2%;
    border: 1px solid #dee2e6 !important;
    box-sizing: border-box;
    border-radius: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='32' viewBox='0 0 16 32'%3E%3Cg fill='%23c9d1cb' fill-opacity='0.16'%3E%3Cpath fill-rule='evenodd' d='M0 24h4v2H0v-2zm0 4h6v2H0v-2zm0-8h2v2H0v-2zM0 0h4v2H0V0zm0 4h2v2H0V4zm16 20h-6v2h6v-2zm0 4H8v2h8v-2zm0-8h-4v2h4v-2zm0-20h-6v2h6V0zm0 4h-4v2h4V4zm-2 12h2v2h-2v-2zm0-8h2v2h-2V8zM2 8h10v2H2V8zm0 8h10v2H2v-2zm-2-4h14v2H0v-2zm4-8h6v2H4V4zm0 16h6v2H4v-2zM6 0h2v2H6V0zm0 24h2v2H6v-2z'/%3E%3C/g%3E%3C/svg%3E");
    background-attachment: fixed;
    background-repeat: repeat;
    background-size: auto;

    &>table {
        background: #fff;
        padding: 3%;
        box-sizing: border-box;
        border: 1px solid #dee2e6;
        border-radius: 5px;
    }
}

.classifiedcategory {
    background: transparent !important;

    & td {
        padding: 10px 0;
    }
}

.classifiedbutton {
    background-color: #0d6efd;
    text-transform: capitalize;
    border-radius: 6px;
    line-height: 28px;
    font-weight: bold;
    font-size: 14px;
    color: #fff;
    transform: translateY(-2px);
}

.classifiedheading td {
    border-bottom: 2px solid #b0b0b0 !important;
    margin-bottom: 8px;
}

.classifiedheading b {
    font-size: 20px;
    line-height: 40px;
    margin-bottom: 30px;
    width: 100%;
}

#SKeyword {
    border: 1px solid gray;
    border-radius: 5px;
    line-height: 30px;
    padding: 4px;
    box-sizing: border-box;
    font-family: Trebuchet MS;
    font-weight: normal !important;
    font-size: 15px;
}

.classifiedbody #form1 {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    margin-top: 15px;
    padding: 20px 0px !important;
    box-sizing: border-box;
    font-weight: bold;
    font-size: 17px;
    color: #555;
}

div.classifiedbody {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 5px;
    width: 100%;
    float: left;
    margin-bottom: 30px;
    box-sizing: border-box;

    & .classifiedheading {
        font-size: 20px !important;
        color: #0d6efd !important;
    }

    &.classifiedheading+div,
    & .classifiedruler+div {
        width: 100%;
        float: left;
        color: #555;
    }

    & .classifiedheading+div b,
    & .classifiedruler+div b {
        color: #fff;
        background: gray;
        padding: 7px 10px;
        display: inline-block;
        border-radius: 5px;
    }
}

.classifiedruler {
    float: left;
    width: 100%;
    margin-top: 15px;
    margin-bottom: 10px;
}

.custom_classified_image {
    max-width: 300px !important;
    max-height: none !important;
    padding-right: 0 !important;
    margin-right: 10px;
    cursor: zoom-in;
}

/* /classified */


/* dark-theme */

.vr {
    display: inline-block;
    align-self: stretch;
    width: 1px;
    min-height: 1rem;
    background-color: currentcolor;
    opacity: .25;
}

.user-none {
    user-select: none;
}

html[data-theme="dark"] {

    & body,
    & .bg-body {
        background-color: #212529 !important;
    }

    & .text-black,
    & .polls1question {
        color: #fff !important;
    }

    & .border,
    & .border-gray {
        border-color: rgba(255, 255, 255, .1) !important;
    }

    .border-light,
    & .border-gray {
        border-color: #000 !important;
    }
    & .cus-active-menu {
        border-color: #b0b0b0 !important;
    }

    & .text-dark {
        color: #f0e6e6 !important;
    }

    & .dropdown-menu {
        background-color: #535455;
    }

    & .text-muted {
        color: #9b9898 !important;
    }

    & .btn-primary {
        background-color: #000;
        border-color: #000;
    }
    & vr.bg-secodary {
        background: #fff !important;
    }

    & div[style="background-color:#f3f3f3;"] {
        background-color: #131313 !important;
    }

}

/* /dark-theme */@media screen and (max-width:992px) {
.hpe-logo a img {
	width: 98%;
}
    .pagebody .pagephoto {
        max-width: 100%;
    }
}



.bg-theme {
  background-color: #222a33 !important;
}


/*-- BEGIN: SECTION LAYOUT SOCIAL ICON -- */
.iconshare_directory {
z-index: 1;
  position: relativ;
  left: 10px;
  top: 10px;
}



.icon-share div .fa {
    color: #fff !important;
}
.iconshare {
	z-index: 1;
	position: relative;
	left: 2%;
	top: 3%;
}
.iconshare:hover .icon-share div {
  display: indivne-block;
  -webkit-animation: animate 1s forwards;
          animation: animate 1s forwards;
}

.iconshare::before {
	content: "\f1e0";
	font-family: 'FontAwesome';
	display: block;
	width: 35px;
	height: 35px;
	background-color: #19875482;
	text-adivgn: center;
	divne-height: 35px;
	border-radius: 50px;
	color: #FFF;
	font-szie: 1.2em;
	position: absolute;
	top: 16px;
	left: 0;
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
	left: 0;
	top: 0;
	bottom: 0;
}


.icon-share div {
  divst-style: none;
  display: indivne-block;
  width: 34px;
  height: 35px;
  background-color: silver;
  text-adivgn: center;
  divne-height: 35px;
  border-radius: 50px;
  -webkit-animation: notHover .6s forwards;
          animation: notHover .6s forwards;
  margin-left: 5px !important;
}

.icon-share div:nth-child(1) {
    background-color: #3b5998;
    margin-left: 20px !important;
}
.icon-share div:nth-child(2) {
  background-color: #1da1f2;
}

.icon-share div:nth-child(3) {
  background-color: #833ab4;
}

.icon-share div:nth-child(4) {
  background-color: #dd4b39;
}

.icon-share div a {
  color: #FFF;
}
.icon-share {
  float: left;
  width: 100%;
}

.icon-share div {
  float: left;
  margin-top: 0px;
  margin-left: 16px;
  transform: translate(10px,10px10px);
  display: flex;
  justify-content: center;
  align-items: center;
}

@-webkit-keyframes animate {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 0;
  }
  
  to {
    -webkit-transform: translateX(30px);
            transform: translateX(30px);
    opacity: 1;
    margin-left: 30px;
  }
}


@keyframes animate {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 0;
  }
  
  to {
    -webkit-transform: translateX(30px);
            transform: translateX(30px);
    opacity: 1;
    margin-left: 30px;
  }
}

@-webkit-keyframes notHover {
  from {
    -webkit-transform: translateX(30px);
            transform: translateX(30px);
    opacity: 1;
  }
  
  to {
    -webkit-transform: translateX(-70px);
            transform: translateX(-70px);
    opacity: 0;
  }
}

@keyframes notHover {
  from {
    -webkit-transform: translateX(30px);
            transform: translateX(30px);
    opacity: 1;
  }
  
  to {
    -webkit-transform: translateX(-70px);
            transform: translateX(-70px);
    opacity: 0;
  }
}


/*-- BEGIN: SECTION LAYOUT  SOCIAL ICON -- */

#blbodymain {
	background-color: #f2f2f2;
}


#top_bar_social_icons {
  float: left;
  width: 100%;
}
.social-icon li {
	float: left;
	margin-right: 10px;
	margin-left: 10px;
}
.social-icon li a fa {
  color: white !important;
  font-size: 25px !important;
}

.copyright a {
	color: white !important;
	font-size: 16px;
}