:root {
    --jetly-font: 'DM Sans', sans-serif;
    --jetly-reey-font: "reeyregular";
    --jetly-gray: #79817c;
    --jetly-gray-rgb: 121, 129, 124;
    --jetly-white: #ffffff;
    --jetly-white-rgb: 255, 255, 255;
    --jetly-base: #a79132;
    --jetly-base-rgb: 167, 145, 50;
    --jetly-black: #123821;
    --jetly-black-rgb: 18, 56, 33;
    --jetly-primary: #f8f7f1;
    --jetly-primary-rgb: 248, 247, 241;
    --jetly-letter-spacing: -0.04em;
  
  }
  body, h1, h2, h3, h4, h5, h6
  {
    font-family:var(--jetly-font);
  }  

a:focus {outline: none;}

/*button CSS Start*/
.thm-btn {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    -webkit-appearance: none;
    outline: none !important;
    background-color: var(--jetly-black);
    color: var(--jetly-white);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 15px 60px 15px;
    border-radius: 30px;
    transition: all 0.5s linear;
    z-index: 1;
}
.benefits-one__btn {
    background-color: var(--jetly-base);
}
.thm-btn::before {
    position: absolute;
    top: -1px;
    left: -1px;
    bottom: -1px;
    right: -1px;
    background-color: var(--jetly-base);
    content: "";
    border-radius: 30px;
    transform: scaleY(0.0) rotateX(0deg);
    -webkit-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    z-index: -1;
}
.thm-btn:hover {
    color: var(--jetly-white);
}
.thm-btn:hover:before {
    transform: scaleY(1.0) rotateX(0deg);
    -webkit-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    transition: all 0.4s linear;
}
.benefits-one__btn:before {
    background-color: var(--jetly-black);
}
.feature-two__btn {
    background-color: var(--jetly-white);
    color: var(--jetly-black);
}
.feature-two__btn:before {
    background-color: var(--jetly-black);
}

/*button CSS END*/
/* Header CSS STart */
.site-header.header-one .bottom-header.header-image-wrap {
    height: auto;padding: 10px 0;
}
/* Header CSS END */
/*-- Desktop Navigation CSS Start --*/
.nav-navigation {background: var(--jetly-black);padding: 10px 0;}
ul.menu-list {
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: center;
    margin: 0 auto;
}
ul.menu-list li {margin: 0 25px 0 0;}
ul.menu-list li a {color: #fff;}
ul.menu-list li a:hover {color: var(--jetly-base);}
/*-- Desktop Navigation CSS END --*/
/*-- Responsive NAvigation CSS Start --*/
.mobile-nav__wrapper.expanded {
    opacity: 1;
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    visibility: visible;
    -webkit-transition: visibility 500ms ease 0ms, -webkit-transform 500ms ease 0ms;
    transition: visibility 500ms ease 0ms, -webkit-transform 500ms ease 0ms;
    transition: transform 500ms ease 0ms, visibility 500ms ease 0ms;
    transition: transform 500ms ease 0ms, visibility 500ms ease 0ms, -webkit-transform 500ms ease 0ms;
}
.mobile-nav__wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 999;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transform-origin: left center;
    transform-origin: left center;
    -webkit-transition: visibility 500ms ease 500ms, -webkit-transform 500ms ease 500ms;
    transition: visibility 500ms ease 500ms, -webkit-transform 500ms ease 500ms;
    transition: transform 500ms ease 500ms, visibility 500ms ease 500ms;
    transition: transform 500ms ease 500ms, visibility 500ms ease 500ms, -webkit-transform 500ms ease 500ms;
    visibility: hidden;
}
.mobile-nav__overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #000000;
    opacity: 0.5;
    cursor: pointer;
}
.mobile-nav__wrapper.expanded .mobile-nav__content {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: opacity 500ms ease 500ms, visibility 500ms ease 500ms, -webkit-transform 500ms ease 500ms;
    transition: opacity 500ms ease 500ms, visibility 500ms ease 500ms, -webkit-transform 500ms ease 500ms;
    transition: opacity 500ms ease 500ms, visibility 500ms ease 500ms, transform 500ms ease 500ms;
    transition: opacity 500ms ease 500ms, visibility 500ms ease 500ms, transform 500ms ease 500ms, -webkit-transform 500ms ease 500ms;
}
.mobile-nav__content {
    width: 300px;
    background-color: var(--jetly-black);
    z-index: 10;
    position: relative;
    height: 100%;
    overflow-y: auto;
    padding-top: 30px;
    padding-bottom: 30px;
    padding-left: 15px;
    padding-right: 15px;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: opacity 500ms ease 0ms, visibility 500ms ease 0ms, -webkit-transform 500ms ease 0ms;
    transition: opacity 500ms ease 0ms, visibility 500ms ease 0ms, -webkit-transform 500ms ease 0ms;
    transition: opacity 500ms ease 0ms, visibility 500ms ease 0ms, transform 500ms ease 0ms;
    transition: opacity 500ms ease 0ms, visibility 500ms ease 0ms, transform 500ms ease 0ms, -webkit-transform 500ms ease 0ms;
}
.mobile-nav__close {
    position: absolute;
    top: 20px;
    right: 15px;
    font-size: 18px;
    color: var(--jetly-white);
    cursor: pointer;
}
.mobile-nav__container {
    margin-top: 50px;
} 
.mobile-nav__toggler {
    color: var(--jetly-base);
    cursor: pointer;
    -webkit-transition: 500ms;
    transition: 500ms;
    border: 2px solid var(--jetly-base);
    display: inline-block;
    border-radius: 4px;
    line-height: 22px;
    padding: 3px 5px;
    font-size: 32px;
}
span.navbar-toggler-icon {
    width: 22px;
    height: 2px;
    background: var(--jetly-base);
    margin: 4px 0;
    display: block;
    border-radius: 2px;
}
/*-- Responsive NAvigation CSS END --*/
/* Footer CSS Start */
.bottom-footer {    
    background-color: #0d2b19;
    padding: 20px 0;    
}
/* Footer CSS END */
/*** All Posts page CSS Start ***/
.site-content {background: var(--jetly-primary);padding:50px 0 10px;}
.site-content .list-post .featured-image {width: 100%;}
.post .featured-image > a, .page .featured-image > a{display: block;}
.site-content .list-post .entry-content {width: 100%;padding-left: 0;}
.site-content .content-area .list-post {background: #fff;height: calc(100% - 40px);padding: 0 0 20px;border-bottom: none;}
.site-content .content-area .list-post .entry-content {padding: 20px;}
.site-content #primary [class*=col-]:last-child .list-post, .site-content #primary [class*=col-]:last-child .single-post {
    border-bottom: none;margin-bottom: 40px;padding-bottom: 20px;
}
.site-content .content-area .post .entry-meta span {
    background: var(--jetly-base);
    border-radius: 12px;
    margin-right: 5px;
    padding: 3px 10px 0;
}
.site-content .content-area .post .entry-meta span a {
    display: inline-block;
    color: #fff;
}
.site-content .content-area .post .entry-meta span a:before, .single .entry-container .cat-links:before
 {color: var(--jetly-black);}
.list-post .entry-header .entry-title a {
    color: var(--jetly-black);
    font-size: 30px;
    font-weight: 700;
}
.list-post .entry-header .entry-title a:hover{color:var(--jetly-base);}
.list-post .entry-header .entry-title {margin: 0 0 5px;}
.read-more-link {margin: 10px 0 0;}
.read-more-link a.thm-btn {padding: 10px 18px;}
/*** All Posts page CSS END ***/
/*--** Single Page CSS Start **--*/
.wrap-detail-page .page-title.entry-title {
    font-size: 40px;
    font-weight: 700;
    padding: 0 0 10px;
    border-bottom: 1px solid var(--jetly-base);
    color: var(--jetly-black);
}
.wrap-ralated-posts .post .entry-content .entry-title a {color: var(--jetly-black);}
.entry-content ul {
    padding: 0;
    list-style: none;
    margin-left: 0;
}
.entry-content ul li {
    position: relative;
    padding-left: 22px;
    margin-bottom: 5px;
}
.entry-content ul li:before {
    content: '\f058';
    position: absolute;
    left: 0;
    top: 1px;
    font-family: "Font Awesome 5 Free";
    color: var(--jetly-black);
}
.section-ralated-post .section-title:before {background-color: var(--jetly-base);}
.post .entry-meta, .attachment .entry-meta, .banner-content .entry-meta {   
    margin-left: 0;
    margin-right: 0;

}
/*--** Single Page CSS END **--*/
/*---- SIdebar CSS Start ----*/
.sidebar-quote {
    background: var(--jetly-base);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
}
.sidebar .widget {margin-bottom: 35px;}
.widget.recent-posts-widget-with-thumbnails {
    background: #fff;
    padding: 20px;
}
.rpwwt-widget span.rpwwt-post-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--jetly-black);
}
.rpwwt-widget ul li a:hover .rpwwt-post-title {color: var(--jetly-base);}
.widget .rpwwt-widget .rpwwt-post-excerpt-more {color: var(--jetly-base);font-weight: 700;}
.sidebar .widget h2 {font-size: 24px;}
.widget .rpwwt-widget ul li a {display: inline;}
/*---- SIdebar CSS END ----*/
/* Popup CSS Start */
.modal {z-index: 9999;}
.modal-header{position: relative;background:linear-gradient(270deg, rgb(167, 145, 50) 0%, rgb(18, 56, 33) 51%);}
.modal-header .modal-title {
    flex: 1;
    font-weight: 700;
    font-size: 24px;
    color: #fff;
}
.modal-header .close {
    position: absolute;
    right: 0;
    top: 0;
    opacity: 1;
    border-radius: 50%;
    background-color: #fff;
    width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.modal-header .close span {display: inline-block;font-size: 40px;margin: -3px 0 0 0;font-weight: 400;}
.modal-body.form-fields input, .modal-body.form-fields select {width: 100%;}
.modal-body.form-fields .field1 {
    background: #fff;
    border: 1px solid #303030;
    margin-bottom: 10px;
}
.fields-error-msg {display: none;}
input.form-next-btn {background:var(--jetly-base);color: #fff;border: none;padding: 10px;font-size: 16px;}
input.form-next-btn:hover {background:var(--jetly-black);text-decoration: none;}
/* Popup CSS END */

@media only screen and (max-width: 991px)
{
    .nav-navigation {display: none;}
    ul.menu-list {flex-direction: column;}
    .mobile-nav__overlay.mobile-nav__toggler, .mobile-nav__close.mobile-nav__toggler{border: none;border-radius: 0;}
    ul.menu-list li {
        margin: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
    ul.menu-list li a {padding: 10px 0;display: inline-block;}
    .header-one .site-branding {text-align: left;}
    header.site-header .site-branding > a, header.site-header.sticky-header .site-branding > a {
        max-width: 100%;
        display: inline-block;
        margin: 0;
    }

}