*{
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: 'Open Sans', sans-serif;
  color: #444;
  font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.wrapper{
  height: 100%;
  margin: 15px auto 0;
}
.wrapper .tabs_wrap{
  padding: 15px 0px;
  border-bottom: 1px solid #ebedec;
  display: flex;
  justify-content: space-between;
}

.wrapper .tabs_wrap ul{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.wrapper .tabs_wrap ul li{
    text-align: center;
    background: #e9ecf1;
    border-right: 1px solid #c1c4c9;
    padding: 13px 15px;
    cursor: pointer;
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
ul.main_menu li a {
    display: block !important;
}
ul.main_menu li  {
    display: flex !important;
    justify-content: center;
    align-items: center;
    padding: 0px 15px !important;
}
ul.main_menu {
    padding:0px;
}
.wrapper .tabs_wrap ul li a{
  color: #565e6b;
  text-decoration: none;
  display: grid;
}
.wrapper .tabs_wrap ul li {
    display: grid;
}
.wrapper .tabs_wrap ul li a i {
  margin-right: 5px;
}
.wrapper .tabs_wrap ul li:first-child{
  border-top-left-radius: 25px;
  border-bottom-left-radius: 25px;
}

.wrapper .tabs_wrap ul li:last-child{
  border-right: 0px;
  border-top-right-radius: 25px;
  border-bottom-right-radius: 25px;
}

.wrapper .tabs_wrap ul li:hover,
.wrapper .tabs_wrap ul li.active{
  background: #ffc107;
  color: #fff;
}
.wrapper h2 {
  padding: 30px 20px;
}
.main-cont{
    padding: 0;
    margin: 0;
    top: -215px;
}

.news-row {
  margin: 0;
    margin-top: 50px;
    margin-bottom: 50px;
}

.news-block{
    margin: auto;
    padding: 0;
    background-color: transparent;
    max-width: 1060px;
    min-width: 100px;
    border: 20px solid transparent;
}
.underlay{
  /*display: none;*/
  margin: 0;
  padding: 0;
  max-height: 350px;
  max-width: 340px;
}

.card {
    margin: 0;
    border:0px;
    background-color: transparent;
}
.box {
    text-decoration: none;
}

.card-block{
    padding:50px;
    background-color: transparent;
    background-image: -webkit-gradient(linear,left top, right bottom,from(rgba(255, 255, 255, 0.75)),color-stop(0%, rgba(245, 245, 245, 0.75)),color-stop(16.6%, rgba(245, 245, 245, 0.75)),color-stop(37.8%, rgb(245, 245, 245)),color-stop(48.8%, rgb(245, 245, 245)),color-stop(53.1%, rgb(254, 254, 254)),color-stop(79.4%, rgba(245, 245, 245, 0.75)),color-stop(84.3%, rgba(245, 245, 245, 0.75)));
    background-image: linear-gradient(to bottom right,rgba(255, 255, 255, 0.75) 0%,rgba(245, 245, 245, 0.75) 0%,rgba(245, 245, 245, 0.75) 16.6%,rgb(245, 245, 245) 37.8%,rgb(245, 245, 245) 48.8%,rgb(254, 254, 254) 53.1%,rgba(245, 245, 245, 0.75) 79.4%,rgba(245, 245, 245, 0.75) 84.3%);
    background-repeat: no-repeat;
}
.row .box:first-child .card-block,.row .box:nth-child(10n+1) .card-block{
    background-image: linear-gradient(120deg, #d4fc79 0%, #96e6a1 100%);
}
.row .box:nth-child(2) .card-block,.row .box:nth-child(10n+2) .card-block {
    background-image: linear-gradient(120deg, #ffafbd 0%, #ffc3a0 100%);
}
.row .box:nth-child(3) .card-block,.row .box:nth-child(10n+3) .card-block{
    background-image: linear-gradient(120deg, #06beb6 0%, #48b1bf 100%);
}
.row .box:nth-child(4) .card-block,.row .box:nth-child(10n+4) .card-block{
    background-image: linear-gradient(120deg, #ec6f66  0%, #f3a183 100%);
}
.row .box:nth-child(5) .card-block,.row .box:nth-child(10n+5) .card-block{
    background-image: linear-gradient(120deg, #ba5370  0%,   #f4e2d8 100%);
}
.row .box:nth-child(6) .card-block,.row .box:nth-child(10n+6) .card-block{
    background-image: linear-gradient(120deg, #ff7e5f  0%, #feb47b 100%);
}
.row .box:nth-child(7) .card-block,.row .box:nth-child(10n+7) .card-block{
    background-image: linear-gradient(120deg, #4ca1af   0%,  #c4e0e5 100%);
}
.row .box:nth-child(8) .card-block,.row .box:nth-child(10n+8) .card-block{
    background-image: linear-gradient(120deg, #ffd89b  0%, #19547b 100%);
}
.row .box:nth-child(9) .card-block,.row .box:nth-child(10n+9) .card-block{
    background-image: linear-gradient(120deg, #eacda3  0%, #d6ae7b 100%);
}
.row .box:nth-child(10) .card-block,.row .box:nth-child(10n+10) .card-block{
    background-image: linear-gradient(120deg, #ddd6f3  0%, #faaca8 100%);
}
.card-title {
  padding: 20px 0px;
  text-align: center;
  font-family: 'Anton', sans-serif;
  font-size: 24px;
}
.card-text {
  display: none;
}

.card-img-top{
    width: 300px;
    height: 250px;
    background-color: #fff;
    -webkit-transition: height 0.8s ease;
    transition: height 0.8s ease;
}

@media (max-width: 1120px){
    .bar-cont{
        width: 100%;
    }
    .card:hover{
      margin-right: -20px;
    }
    .card:hover .card-block{
      width: 300px;
    }
}

.thumbnail {
    position: relative;
    padding: 0px;
    margin-bottom: 20px;
}
.thumbnail img {
    width: 80%;
}
.thumbnail .caption{
    margin: 7px;
}
.main-section{
    background-color: #F8F8F8;
}
.dropdown{
    float:right;
    padding-right: 30px;
}
.btn{
    border:0px;
    margin:10px 0px;
    box-shadow:none !important;
}
.dropdown .dropdown-menu{
    padding:20px;
    top:30px !important;
    width:350px !important;
    left:-110px !important;
    box-shadow:0px 5px 30px black;
}
.total-header-section{
    border-bottom:1px solid #d2d2d2;
}
.total-section p{
    margin-bottom:20px;
}
.cart-detail{
    padding:15px 0px;
}
.cart-detail-img img{
    width:100%;
    height:100%;
    padding-left:15px;
}
.cart-detail-product p{
    margin:0px;
    color:#000;
    font-weight:500;
}
.cart-detail .price{
    font-size:12px;
    margin-right:10px;
    font-weight:500;
}
.cart-detail .count{
    color:#C2C2DC;
}
.checkout{
    border-top:1px solid #d2d2d2;
    padding-top: 15px;
}
.checkout .btn-primary{
    border-radius:50px;
    height:50px;
}
.dropdown-menu:before{
    content: " ";
    position:absolute;
    top:-20px;
    right:50px;
    border:10px solid transparent;
    border-bottom-color:#fff;
}
/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */

/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  bottom: 3rem;
  z-index: 10;
}

/* Declare heights because of positioning of img element */

.carousel-item img {
    object-fit: contain;
    max-width: 100%;
    max-height: 500px;
}
.carousel.slide {
    background: darkgray;
}
.carousel-indicators button{
    background-color: #ffc107 !important;
}

.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}

@media (min-width: 768px) {
.bd-placeholder-img-lg {
  font-size: 3.5rem;
}
}

.b-example-divider {
width: 100%;
height: 3rem;
background-color: rgba(0, 0, 0, .1);
border: solid rgba(0, 0, 0, .15);
border-width: 1px 0;
box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}

.b-example-vr {
flex-shrink: 0;
width: 1.5rem;
height: 100vh;
}

.bi {
vertical-align: -.125em;
fill: currentColor;
}

.nav-scroller {
position: relative;
z-index: 2;
height: 2.75rem;
overflow-y: hidden;
}

.nav-scroller .nav {
display: flex;
flex-wrap: nowrap;
padding-bottom: 1rem;
margin-top: -1px;
overflow-x: auto;
text-align: center;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
}

.btn-bd-primary {
--bd-violet-bg: #712cf9;
--bd-violet-rgb: 112.520718, 44.062154, 249.437846;

--bs-btn-font-weight: 600;
--bs-btn-color: var(--bs-white);
--bs-btn-bg: var(--bd-violet-bg);
--bs-btn-border-color: var(--bd-violet-bg);
--bs-btn-hover-color: var(--bs-white);
--bs-btn-hover-bg: #6528e0;
--bs-btn-hover-border-color: #6528e0;
--bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
--bs-btn-active-color: var(--bs-btn-hover-color);
--bs-btn-active-bg: #5a23c8;
--bs-btn-active-border-color: #5a23c8;
}
.bd-mode-toggle {
    z-index: 1500;
}
.media-body p {
    margin: 0px !important;
}
.media-body,.pull-left {
    display: inline-block;
    clear: both;
    margin-right: 10px;
    vertical-align: top;
}
.media {
    margin-bottom: 10px;
}
.orange {
  background: orange;
}

.blue {
  background: blue;
}

.red {
  background: red;
}

.darkmagenta {
  background: darkmagenta;
}

.darkgray {
  background: darkgray;
}

.darkred {
  background: darkred;
}

.lawngreen {
  background: lawngreen;
}

.green {
  background: green;
}

.black {
  background: black;
}
.order_status {
    height: 20px;
    border-radius: 25px;
    width: 20px;
}
.customScrollbar th {
    font-weight: bold;
}
.userOrderStatusInfo.theTable {
    display: table;
    width: 100%;
    border-collapse: separate;
    border-spacing: 5px;
}
.userOrderStatusInfo .theRow {
    display: table-row;
}
.userOrderStatusInfo .box {
    color: #fff;
    font-family: 'Montserrat';
    border-radius: 3px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
    padding: 10px;
    font-size: 1rem;
}
.userOrderStatusInfo .theCell {
    display: table-cell;
    padding: 10px;
    white-space: nowrap;
}
.userOrderStatusInfo .theCell.light {
    color: #414141;
}
input, textarea {
    padding: 10px 14px !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-size: 15px !important;
    height: unset;
}
.section-header {
    margin-bottom: 30px;
}
.form-group {
    margin-bottom: 1rem;
}
.service_total_price, .service_total_price b {
    color: #0dcaf0;
    font-size: 25px;
}
#cartImage_display {
    max-width: 100%;
    max-height: 80px;
}
.cart_image {
    max-width: 100%;
    max-height: 50px;
}
.login-wrap {
    position: relative;
    background: #fff;
    border-radius: 10px;
    -webkit-box-shadow: 0px 10px 34px -15px rgba(0, 0, 0, 0.24);
    -moz-box-shadow: 0px 10px 34px -15px rgba(0, 0, 0, 0.24);
    box-shadow: 0px 10px 34px -15px rgba(0, 0, 0, 0.24);
}
.login-wrap .icon {
    width: 80px;
    height: 80px;
    background: #f2a734;
    border-radius: 50%;
    font-size: 30px;
    margin: 0 auto;
    margin-bottom: 10px;
}
.login-wrap .icon span {
    color: #fff;
}
.login-wrap h3 {
    font-weight: 700;
    font-size: 20px;
    color: #f2a734;
}
.login-wrap .form-control {
    height: 48px;
    background: rgba(0, 0, 0, 0.05);
    color: #000;
    font-size: 16px;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid transparent;
    padding-left: 20px;
    padding-right: 20px;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.rounded-left {
    border-top-left-radius: 0.25rem !important;
    border-bottom-left-radius: 0.25rem !important;
}
.checkbox-primary {
    color: #f2a734;
}
.checkbox-wrap {
    display: block;
    position: relative;
    padding-left: 30px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 16px;
    font-weight: 500;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.checkbox-wrap input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
}
.checkbox-primary input:checked ~ .checkmark:after {
    color: #f2a734;
}
.checkbox-wrap input:checked ~ .checkmark:after {
    display: block;
    content: "\f00c";
    font-family: 'Font Awesome 5 Free';
    color: rgba(0, 0, 0, 0.2);
}

.checkmark:after {
    content: "\f00c";
    font-family: 'Font Awesome 5 Free';
    position: absolute;
    color: rgba(0, 0, 0, 0.1);
    font-size: 20px;
    margin-top: -4px;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}
.login-wrap a {
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
    color: #f2a734;
}
.login-page {
    padding:0px 20px;
}
.login-page .form-group {
    position: relative;
}
.login-page .form-group .submit{
    background: #f2a734 !important;
    border: 1px solid #f2a734 !important;
    color: #fff !important;
    position: absolute;
    top: 20px;
    left: 0;
    right: 0;
    margin: 0 auto;
}
#footer footer {
    padding-bottom: 0px !important;
}
.bg-lightgrey {
    background-color: #f2a734;
}
.toggle-footer {
    padding: 0px;
}
@media (min-width: 768px){
.text-md-right {
    text-align: right !important;
}
}
.mr-4 {
    margin-right:50px;
}
}