:root {
    --cta: #f1603f;
    --cta_hover: #f18c3f;
    --dark: #141414;
    --white: #fff;
    --gray: #D9D9D9;
    --d: 2500ms;
	--angle: 90deg;
	--gradX: 100%;
	--gradY: 50%;
    --cta_opec_border:rgb(241 96 63 / 10%);
}
* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.gform_wrapper {
    .gform_validation_errors {
        display: none !important;
    }

    .gform_body {
        .gform_fields {
            row-gap: 32px !important;

            input[type="text"],
            input[type="email"],
            input[type="tel"],
            textarea {
                border: none;
                background: transparent;
                box-shadow: none;
                border-radius: 0;
                border-bottom: 1px solid var(--dark);
                outline: none;
                font-size: 18px;
                padding: 0;
            }
            select{
                border: none;
                background: transparent url('data:image/svg+xml,<svg width="15" height="8" viewBox="0 0 15 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.355471 0.353514L7.10547 7.10351L13.8555 0.353515" stroke="%23F1603F"/></svg>');
                box-shadow: none;
                background-position: right center;
                background-repeat: no-repeat;
                background-size: 16px;
                border-radius: 0;
                border-bottom: 1px solid var(--dark);
                outline: none;
                font-size: 18px;
                padding: 0;
                cursor: pointer;
            }
            input[type="checkbox"], input[type="radio"] {
                width: 20px !important;
                height: 20px !important;
                background: transparent !important;
                border-radius: 0 !important;
                -webkit-appearance: none !important;
                appearance: none !important;
                border: 1px solid var(--dark) !important;
                outline: none;
            }
            input[type="radio"]{
                border-radius: 50% !important;
            }
            input[type="checkbox"]::before {
                color: var(--dark) !important;
            }
            input[type="radio"]::before {
                background-color: var(--dark) !important;
            }
            :is(input[type="radio"],input[type="checkbox"])+label{
                cursor: pointer;
            }
            textarea {
                height: 80px;
            }
            .gform-field-label{
                font-size: 18px;
            }
            .gfield_description{
                font-size: 18px;
                font-style: italic;
            }
            a.chosen-single {
                background: transparent url('data:image/svg+xml,<svg width="15" height="8" viewBox="0 0 15 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.355471 0.353514L7.10547 7.10351L13.8555 0.353515" stroke="%23F1603F"/></svg>');
                box-shadow: none;
                background-position: right center;
                background-repeat: no-repeat;
                background-size: 16px;
                color: var(--dark);
                border: none;
                border-radius: 0 !important;
                border-bottom: 1px solid var(--dark) !important;
                outline: none;
                box-shadow: none;
                padding: 0;
                font-size: 18px;
            }
            .chosen-container{
                width: 100% !important;
            }
            .chosen-container.chosen-with-drop{
                a.chosen-single{
                    background-image: url('data:image/svg+xml,<svg width="15" height="8" viewBox="0 0 15 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.355469 7.10352L7.10547 0.35352L13.8555 7.10351" stroke="%23F1603F"/></svg>');  
                }
            }
            .chosen-drop{
                input.chosen-search-input {
                    outline: none;
                    box-shadow: none;
                    border:1px solid var(--dark)
                }
                .chosen-results{
                    li.result-selected{
                        box-shadow: inset 3px 0 0 var(--cta);
                    }
                }
            }
        }
        .notice_box {
            font-size: 13px;
            margin-top: -1em;
        }
    }

    .gform_footer {
        input[type="submit"] {
            background-color: var(--cta) !important;
            border-radius: 0 !important;
            padding: 20px 46px !important;
            font-size: 1rem !important;
            font-weight: bold !important;
            line-height: 1em !important;
            min-width: 130px !important;
            outline: none;
        }

        input[type="submit"]:hover {
            background-color: var(--cta_hover) !important;
        }
    }
}

.form_white {
    .gform_wrapper {
        .gform_body {
            .gform_fields {

                input[type="text"],
                input[type="email"],
                input[type="tel"],
                select,
                textarea {
                    border-color: var(--gray);
                    color: var(--gray);
                }
                select option{
                    color:var(--dark);
                }
                input[type="checkbox"], input[type="radio"] {
                    border-color: var(--gray) !important;
                }
                input[type="checkbox"]::before {
                    color: var(--gray) !important;
                }
                input[type="radio"]::before {
                    background-color: var(--gray) !important;
                }
                a.chosen-single {
                color: var(--gray);
                border-bottom: 1px solid var(--gray) !important;
            }
            .chosen-drop{
                background: #212121;
                input.chosen-search-input {
                    outline: none;
                    box-shadow: none;
                    border:1px solid var(--gray)
                }
                .chosen-results{
                    li{
                        color: var(--gray);
                    }
                    li.highlighted, li.result-selected{
                        background: var(--dark);
                    }
                    li.no-results {
                        background: transparent;
                    }
                }
            }
            }

            .gform-field-label,
            .gfield_description {
                color: var(--gray);
            }
        }
    }
}




.ginput_container.ginput_container_fileupload input[type="file"]{
    padding:2px !important;
    cursor:pointer;
    position:relative;
    background: transparent;
    border: none;
    color: #fff;
    height: auto;
}

.ginput_container.ginput_container_fileupload input[type="file"]:before {
  position: absolute;
  pointer-events: none;
  top: 50%;
  left: 140px;
  transform: translateY(-50%);
  height: 20px;
  width: 20px;
  content: "";
  background-image: url('data:image/svg+xml,<svg width="13" height="16" viewBox="0 0 13 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 6.81441L6.30263 2L11.6052 6.81441" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/><path d="M6.30273 2V11.8127" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/><path d="M1 14.5938H11.6052" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/></svg>');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.ginput_container.ginput_container_fileupload input[type="file"]::file-selector-button {
    -webkit-appearance: none;
    appearance: none;
    border: 1px solid var(--white) !important;
    color: var(--white);
    background:transparent;
    padding:0 10px;
    height:50px;
    line-height:50px;
    min-width:190px;
    border-radius: 0;
    cursor:pointer;
    font-weight:bold;
    padding: 0 40px 0 20px;
}

.ginput_container.ginput_container_fileupload .gform_fileupload_rules{
    display: none !important;
}


/* Blog Archive */
#ajax-blog-filter{
    .posts-grid{
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
        grid-gap: 60px 20px;
        color:#000;
        margin-bottom: 80px;
        .category_list {
            font-family: inherit;
            font-size: 14.52px;
            font-weight: inherit;
            line-height: 1;
            text-transform: uppercase;
            margin: 24px 0 16px;
            position: relative;
            z-index: 2;
        }
        .post-grid-item{
            position: relative;
            
            a.link_overlay {
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                opacity: 0;
                z-index: 1;
            }
            &:hover{
                h3{
                    color: var(--cta);
                }
            }
        }
        .post_content {
            h3{
                font-size: 24px;
                font-weight: 600;
                line-height: 1.2;
                margin: 0;
                transition: .3s;
            }
            .excerpt {
                font-family: "Public Sans", sans-serif;
                font-size: 18px;
                font-weight: 300;
                line-height: 1.6;
                margin: 10px 0;
            }
            .time {
                font-weight: 300;
                line-height: 1.65;
                color: #808080;
            }
        }
    }
    .no_post_found {
        color: #000;
        text-align: center;
    }
    #posts-container{
        min-height: 200px;
        &.loading{
            position: relative;
        }
        &.loading :is(.posts-list, .no_post_found){
            filter: blur(2px);
        }
        &.loading:after {
            content: '';
            display: block;
            border: 5px solid var(--cta);
            border-radius: 50%;
            border-top: 5px solid #fff;
            width: 75px;
            height: 75px;
            -webkit-animation: spin 2s linear infinite;
            animation: spin 2s linear infinite;
            display: table;
            margin: 0;
            position: absolute;
            top: 60px;
            left: 50%;
            transform: translate(-50%, 0%);
        }
    }
    .filters {
        display: flex;
        justify-content: space-between;
        row-gap: 20px;
        column-gap: 20px;
        flex-wrap: wrap;
        padding-bottom: 50px;
        border-bottom: 1px solid var(--gray);
        margin-bottom: 58px;
    }
    .filter-group{
        &.mr-auto {
            margin-right: auto;
        }
        select{
            height: 42px;
            line-height: 42px;
            color: #000;
            border: 1px solid #c6c6c6;
            appearance: none;
            --webkit-appearance:none;
            background: #fafafa url('data:image/svg+xml,<svg width="15" height="8" viewBox="0 0 15 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.355471 0.353514L7.10547 7.10351L13.8555 0.353515" stroke="%23F1603F"/></svg>');
            padding: 0 30px 0 16px;
            width: 298px;
            max-width: 100%;
            background-repeat: no-repeat;
            background-position: right 16px center;
            background-size: 16px;
            outline: none;
            cursor: pointer;
        }
        input[type="text"] {
            height: 42px;
            line-height: 42px;
            color: #000;
            border: 1px solid #c6c6c6;
            background: #fafafa url('data:image/svg+xml,<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.5 10.5L14.5 14.5M12.5 6.5C12.5 9.81371 9.81371 12.5 6.5 12.5C3.18629 12.5 0.5 9.81371 0.5 6.5C0.5 3.18629 3.18629 0.5 6.5 0.5C9.81371 0.5 12.5 3.18629 12.5 6.5Z" stroke="black"/></svg>');
            width: 298px;
            max-width: 100%;
            outline: none;
            background-repeat: no-repeat;
            background-position: left 16px center;
            padding: 0 16px 0 42px;
        }

    }
    article.post-item {
        display: flex;
        flex-wrap: wrap;
        row-gap: 20px;
        column-gap: 20px;
        color: #000;
        padding-bottom: 46px;
        margin-bottom: 46px;
        border-bottom: 1px solid var(--gray);
        .post-featured {
            width: 298px;
            img{
                width: 100%;
            }
        }
        .post-meta {
            width: 215px;
            color: #808080;
            font-size: 16px;
            .post-author {
                margin-bottom: 8px;
                span {
                    color: var(--cta);
                }
            }
        }
        .post-details {
            width: calc(100% - 560px);
            .post-details-inner{
                max-width: 615px;
            }
            .post-title {
                margin: 0 0 16px 0;
                font-size: 24px;
                line-height: 1.2;
                font-weight: 600;
                a:hover{
                    color: var(--cta);
                }
            }
            .excerpt {
                font-family: "Public Sans", sans-serif;
                line-height: 1.6;
                font-weight: 300;
                p{
                    margin: 0;
                }
            }
        }

    }
    
    .filter-item{
        position: relative;
        color: #000;
        width: 298px;
        max-width: 100%;
        
        .current-filter {
            display: flex;
            background: #fff;
            padding: 5px 10px;
            height: 46px;
            justify-content: space-between;
            align-items: center;
            border: 1px solid #ccc;
            cursor: pointer;
        }
        .filter-list {
            position: absolute;
            width: 100%;
            background: #f6f9fa;
            box-shadow: 0 0 30px rgba(0, 0, 0, .3);
            transition: opacity .3s linear,transform .2s linear;
            visibility: hidden;
            opacity: 0;
            transform: translateY(20px);
            z-index: -9;          
            .list-group{
                padding: 32px 24px 0;
                max-height: 350px;
                overflow: auto;
            }
            .reset_filter {
                font-size: 12px;
                font-weight: bold;
                cursor: pointer;
                color: var(--cta);
                padding: 24px 24px 32px;
            }
        }
        &:hover .filter-list{
            visibility: visible;
            opacity: 1;
            transform: translateY(0);
            z-index: 4;
        }
        .filter-atoms{
            :is(input[type="radio"], input[type="checkbox"]){
                display: none;
            }
            :is(input[type="radio"], input[type="checkbox"])+label{
                cursor: pointer;
                font-size: 16px;
            }
            :is(input[type="radio"], input[type="checkbox"]):checked+label{
                font-weight: bold;
            }
        }
    }
    .ajax-pagination {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        .page-num {
            display: block;
            margin: 0 4px;
            padding: 8px;
            min-width: 38px;
            display: flex;
            justify-content: center;
            align-items: center;
            column-gap: 8px;
            font-weight: 600;
            color: #000;
            &.active{
                background-color: #000;
                color: #fff;
            }
            &.arrow {
                color: #000;
            }
            
        }
    }
    @media (max-width:1024px){
        .filter-group{
            width: 100%;
            select, input[type="text"]{
                width: 100%;
            }
            .filter-item{
                width: 100%;
            }
        }
    }
    @media (max-width:979px){
        article.post-item {
            .post-featured,
            .post-details,
            .post-meta{
                width: 100%;
            }
            .post-details{
                .post-details-inner{
                    max-width: unset;
                }
            }
        }
        
    }
}



/* Rotationg Gradient */

@property --angle {
  syntax: '<angle>';
  initial-value: 90deg;
  inherits: true;
}

@property --gradX {
  syntax: '<percentage>';
  initial-value: 50%;
  inherits: true;
}

@property --gradY {
  syntax: '<percentage>';
  initial-value: 0%;
  inherits: true;
}

.rotating_gradient{
    border: 2px solid !important;
    border-image: conic-gradient(from var(--angle), var(--cta_opec_border), var(--cta) 0.1turn, var(--cta) 0.15turn, var(--cta_opec_border) 0.25turn) 30 !important;
    animation: borderRotate var(--d) linear infinite forwards;
}

.countdown_timer {
    display: flex;
    justify-content: center;
    text-align: center;
    row-gap: 20px;
    column-gap: 20px;
    text-transform: uppercase;
    font-size: 16px;
    .timer_number {
        font-size: 60px;
        font-weight: bold;
        line-height:1em;
    }
    @media (max-width:600px) {
        font-size: 12px;
        row-gap: 10px;
        column-gap: 10px;
        .timer_number{
            font-size: 40px;
        }
    }
}

span.x-scroll-top {
    background: var(--cta);
    border: none;
    color: #fff !important;
    width: 44px;
    height: 44px;
    bottom: 88px;
    margin: 0 !important;
    opacity: 0 !important;
    z-index: -1;
    transform: scale(0) rotate(-360deg);
    transition: .3s linear;
    right: 10px !important;
    box-shadow: 8px 6px 15px rgb(0 0 0 / 20%);
    &.in{
        opacity: 1 !important;
        z-index: 9999;
        transform: scale(1) rotate(0deg);
    }
    @media (max-width:767px){
        right: 5px !important;
        bottom: 36px;
    }
}

@keyframes borderRotate {
	100% {
		--angle: 420deg;
	}
}

@keyframes borderRadial {
	20% {
		--gradX: 100%;
		--gradY: 50%;
	}
	40% {
		--gradX: 100%;
		--gradY: 100%;
	}
	60% {
		--gradX: 50%;
		--gradY: 100%;
	}
	80% {
		--gradX: 0%;
		--gradY: 50%;
	}
	100% {
		--gradX: 50%;
		--gradY: 0%;
	}
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes spin {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(360deg)
    }
}