.breadcrumb-area {
    background: #327fc7;
    padding: 40px 0;
}

.breadcrumb-area h2 {
  color: #fff;
  text-transform: uppercase;
  margin-bottom: 10px;
  letter-spacing: 1px;
  font-weight: 600;
}

.breadcrumb-area ul li {
  color: #dddddd;
}

.breadcrumb-area ul li a {
  color: #dddddd;
  text-decoration: none;
}

.breadcrumb-area ul li a:hover {
  color: #fff;
}

.breadcrumb-area ul li i {
  color: #dddddd;
  margin-right: 8px;
}

.contant-section .d-box {
    background-color: #eef8ff;
    background-image: url(../Images/old-map.png);
    transition: background-color 0.3s;
}

/* timeline */

 .timeline-section {
        background-color: #f8f9fa;
        padding: 80px 0;
        font-family: 'Segoe UI', Roboto, sans-serif;
    }

    .section-title {
        color: #327fc7;
        font-weight: 800;
        position: relative;
        margin-bottom: 60px;
        text-transform: uppercase;
        letter-spacing: 2px;
    }

    .section-title::after {
        content: '';
        display: block;
        width: 80px;
        height: 4px;
        background: #3bafc0;
        margin: 15px auto;
    }

    /* The Timeline Line */
    .main-timeline {
        position: relative;
        padding: 20px 0;
    }

    .main-timeline::after {
        content: '';
        position: absolute;
        width: 3px;
        background-color: #dee2e6;
        top: 0;
        bottom: 0;
        left: 50%;
        margin-left: -1.5px;
    }

    /* Timeline Container */
    .timeline-item {
        padding: 10px 40px;
        position: relative;
        background-color: inherit;
        width: 50%;
    }

    /* The Dots */
    .timeline-item::after {
        content: '';
        position: absolute;
        width: 20px;
        height: 20px;
        right: -10px;
        background-color: #fff;
        border: 4px solid #3bafc0;
        top: 20px;
        border-radius: 50%;
        z-index: 1;
        transition: all 0.3s ease;
    }

    .right { left: 50%; }
    .left { left: 0; }

    .right::after { left: -10px; }

    /* Content Cards */
    .timeline-content {
        padding: 25px;
        background: white;
        position: relative;
        border-radius: 12px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.05);
        transition: transform 0.3s ease;
        border-bottom: 4px solid transparent;
    }

    .timeline-content:hover {
        transform: translateY(-5px);
        border-bottom: 4px solid #3bafc0;
    }

    .timeline-content h3 {
        font-size: 1.25rem;
        font-weight: 700;
        color: #327fc7;
        margin-bottom: 10px;
    }

    .year-badge {
        display: inline-block;
        background: #327fc7;
        color: #fff;
        padding: 4px 12px;
        border-radius: 20px;
        font-size: 0.85rem;
        margin-bottom: 10px;
        font-weight: 600;
    }

    /* Responsive adjustments */
    @media screen and (max-width: 768px) {
        .main-timeline::after { left: 31px; }
        .timeline-item {
            width: 100%;
            padding-left: 70px;
            padding-right: 25px;
        }
        .timeline-item::after {
            left: 21px;
            right: auto;
        }
        .right { left: 0%; }
    }

.site-search:hover .icon { color: #878244}
.search-drawer { padding:40px 50px; background-color:#fff; opacity:0; visibility:hidden; position:fixed; top:0; left:0; z-index:9999; text-align:left;
	transform:translate(0,-100%); -webkit-transform:translate(0,-100%); -ms-transform:translate(0,-100%); -o-transform:translate(0,-100%); transition:all .3s ease 0s; -webkit-transition:all .3s ease 0s;
	-ms-transition:all .3s ease 0s; -o-transition:all .3s ease 0s; width:100%; box-shadow:0 0 6px rgba(0,0,0,0.2); -webkit-box-shadow:0 0 6px rgba(0,0,0,0.2);}
.search-drawer .container { position:relative; }
.search-drawer.search-drawer-open { opacity:1; transform:translate(0,0); -webkit-transform:translate(0,0); -ms-transform:translate(0,0); -o-transform:translate(0,0); visibility:visible; }
.search-drawer.search-drawer-open .block { background-color:transparent; padding:0; }
.search-drawer .title { color:#000000; font-size:15px; margin-bottom: 20px; }
.search-drawer .label { border:0; clip:rect(0,0,0,0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; }
.search-drawer .control { border-bottom: 1px solid #ddd; }
.search-drawer .input-text { color:#050000; font-size:13px; padding:5px 50px 5px 0; background:none; border:0 none; }
.search-drawer .action.search { font-size:18px; position:absolute; right:14px; border:0; background:none; cursor:pointer; height:38px; top: 35px; }
.search-drawer .action.search:hover { color:#000000; }
.search-drawer .closeSearch { color:#050000; font-size:18px; position:absolute; top:0; right:25px; cursor:pointer; }
.search-drawer .searchField { display:table; width:100%; }
.search-drawer .search-category { display:table-cell; padding-right:10px; }
.search-drawer .search-category select { font-size:13px; border:0; }
.search-drawer .input-box { display:table-cell; width:87%; }


/* Detail Page */

.product-details{

}

.product-details>h1{
    color: #000;
    font-size: 28px;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.related-title h6 {
    font-weight: 500;
    color: #000;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 3px;
    margin: 0;
    line-height: 18px;
    padding-left: 70px;
    position: relative;
}

.related-title h6::before {
    content: "";
    background: #000;
    width: 60px;
    height: 2px;
    position: absolute;
    bottom: 45%;
    left: 0;
}

.related-title h2 {
    font-size: 28px;
    color: #000;
    letter-spacing: 2px;
    margin-bottom: 15px;
    font-weight: 900;
}

.wrapQtyBtn { float:left; }
.qtyField { display:table; }
.qtyField .qtyBtn, .qtyField .qty { padding:10px 6px; width:50px; height:42px; border-radius:0; float:left; }
.qtyField a { background-color:#eee; color:#000; }
.qtyField a .fa { font-size:12px; line-height:21px; }
.qtyField > a, .qtyField > span, .qtyField input { display:table-cell; line-height:normal; text-align:center; padding:3px 6px; border:1px solid #f5f5f5; }

ul.cboxtags {
    list-style: none;
    padding: 0px;
}
ul.cboxtags li{
  display: inline;
}
ul.cboxtags li label{
    display: inline-block;
    background-color: rgba(255, 255, 255, .9);
    border: 2px solid rgba(139, 139, 139, .3);
    color: #adadad;
    white-space: nowrap;
    margin: 3px 0px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    transition: all .2s;
}

ul.cboxtags li label {
    padding: 6px 10px;
    cursor: pointer;
    width: auto !important;
    line-height: normal !important;
}

ul.cboxtags li input[type="radio"]:checked + label {
    border: 2px solid #000;
    background-color: #000;
    color: #fff;
    transition: all .2s;
}

ul.cboxtags li input[type="radio"] {
  display: absolute;
}
ul.cboxtags li input[type="radio"] {
  position: absolute;
  opacity: 0;
}
ul.cboxtags li input[type="radio"]:focus + label {
  border: 2px solid #000;
}