* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Abril Fatface', cursive;
}

/* font family  */
/* @font-face {
    font-family: 'Abril Display BL';
    src: url('../font/AbrilDisplay-BlackItalic.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Display BL';
    src: url('../font/AbrilDisplay-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Display';
    src: url('../font/AbrilDisplay-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Display';
    src: url('../font/AbrilDisplay-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Display EB';
    src: url('../font/AbrilDisplay-ExtraBoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Display EB';
    src: url('../font/AbrilDisplay-ExtraBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Display';
    src: url('../font/AbrilDisplay-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Display SB';
    src: url('../font/AbrilDisplay-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Display';
    src: url('../font/AbrilDisplay-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Display SB';
    src: url('../font/AbrilDisplay-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Fatface';
    src: url('../font/AbrilFatface-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Fatface';
    src: url('../font/AbrilFatface-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Text';
    src: url('../font/AbrilText-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Text';
    src: url('../font/AbrilText-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Text EB';
    src: url('AbrilText-ExtraBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Text EB';
    src: url('AbrilText-ExtraBoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Text';
    src: url('AbrilText-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Text';
    src: url('AbrilText-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Text SB';
    src: url('AbrilText-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Abril Text SB';
    src: url('AbrilText-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
} */


/* font family  */






/* header css  */
.main-logo img {
    width: 40%;
    margin-top: 3%;
}

.container .menu-btn {
    width: 50px;
    height: 50px;
    position: fixed;
    z-index: 10;
    top: 30px;
    right: 48px;
    cursor: pointer;
    transition: transform 0.3s ease-in-out;
    /* background: #383838; */
    color: #fff;
}

.container .menu-btn:hover span {
    background-color: #e74d09;
}

.container .menu-btn.active {
    transform: rotate(180deg);
}

.container .menu-btn.active span {
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.container .menu-btn.active span.top {
    transform: rotate(45deg);
    transform-origin: left center;
    top: 9px;
    left: 11.25px;
}

ul.nav-inner li {
    list-style: none;
}

.container .menu-btn.active span.mid {
    opacity: 0;
    left: 11.25px;
}

.container .menu-btn.active span.bot {
    transform: rotate(-45deg);
    transform-origin: left center;
    top: 37px;
    left: 11.25px;
}

.container .menu-btn span {
    display: block;
    width: 40px;
    height: 4px;
    background-color: #ffffff;
    position: absolute;
    top: 23px;
    left: 5px;
    border-radius: 2px;
    transition: background-color 0.3s ease-in-out;
}

.container .menu-btn span.top {
    top: 11px;
}

.container .menu-btn span.bot {
    top: 35px;
}

.container #nav {
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    z-index: -1;
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.container #nav.leftslide {
    width: 100%;
    height: 100vh;
    background-color: #ffffff;
    position: fixed;
    top: 0;
    left: 0;
    transform: translate3d(-300px, 0px, 0px);
    background: radial-gradient(circle, rgb(100 76 89) 22%, rgba(28, 25, 23, 1) 64%);
}

.container #nav.fadein {
    width: 100%;
    height: 100vh;
    background-color: #ffffff;
    position: fixed;
    top: 0;
    left: 0;
    text-align: center;
}

.container #nav.topslide {
    width: 100%;
    height: 100vh;
    background-color: #ffffff;
    position: fixed;
    top: 0;
    left: 0;
    transform: translate3d(0px, -100%, 0px);
    text-align: center;
}

.container #nav.pushslide {
    width: 250px;
    height: 100vh;
    background-color: #ffffff;
    position: fixed;
    top: 0;
    left: 0;
    transform: translate3d(0px, 0px, 0px);
}

.container #nav.open {
    transform: translate3d(0px, 0px, 0px);
    opacity: 1;
    z-index: 5;
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.container #nav.open .nav-inner li {
    animation: fadeInRight 0.4s ease forwards;
    animation-delay: 0.3s;
}

.container #nav.open .nav-inner li:nth-of-type(1) {
    animation-delay: 0.35s;
}

.container #nav.open .nav-inner li:nth-of-type(2) {
    animation-delay: 0.4s;
}

.container #nav.open .nav-inner li:nth-of-type(3) {
    animation-delay: 0.45s;
}

.container #nav.open .nav-inner li:nth-of-type(4) {
    animation-delay: 0.5s;
}

.container #nav.open .nav-inner li:nth-of-type(5) {
    animation-delay: 0.55s;
}

.container #nav .nav-inner li {
    position: relative;
    margin-bottom: 30px;
    opacity: 0;
    transition: transform 0.3s ease-in-out;
}

.container #nav .nav-inner li a {
    display: inline-block;
    height: 100%;
    text-decoration: none;
    color: #f2520a;
    font-size: 30px;
    text-transform: capitalize;
    letter-spacing: 1px;
    font-weight: 800;
    padding: 4px 8px;
    transition: all 0.2s ease-in-out;
}

.container #nav .nav-inner li a:before {
    content: "";
    position: absolute;
    left: -30px;
    top: 50%;
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #e74d09;
    opacity: 0;
    transition: all 0.3s ease-in-out;
}

.container #nav .nav-inner li a:hover {
    background-color: #e74d09;
    color: #ffffff;
    transform: translate3d(15px, 0, 0);
}

.container #nav .nav-inner li a:hover:before {
    content: "";
    left: -15px;
    opacity: 1;
}

.container #style-box {
    width: 100%;
    height: 100vh;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjIuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA4MDAgODIzLjQiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDgwMCA4MjMuNDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiM0MDQxNEI7fQo8L3N0eWxlPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNTUuMiwxNjljLTAuNCwwLTAuOCwwLTEuMi0wLjFjLTIuMy0wLjMtNC4zLTEuNS01LjctMy4zbC04LjktMTEuN2MtMS40LTEuOC0yLTQuMS0xLjctNi4zCgljMC4zLTIuMywxLjUtNC4zLDMuMy01LjdsMTEuNy04LjljMS44LTEuNCw0LjEtMiw2LjMtMS43YzIuMywwLjMsNC4zLDEuNSw1LjcsMy4zbDguOSwxMS43YzEuNCwxLjgsMiw0LjEsMS43LDYuMwoJYy0wLjMsMi4zLTEuNSw0LjMtMy4zLDUuN2wtMTEuNyw4LjlDNTguOSwxNjguNCw1Ny4xLDE2OSw1NS4yLDE2OXogTTU4LDEzNy4yYy0wLjYsMC0xLjEsMC4yLTEuNiwwLjVsLTExLjcsOC45CgljLTAuNSwwLjQtMC45LDEtMSwxLjdjLTAuMSwwLjcsMC4xLDEuNCwwLjUsMS45bDguOSwxMS43YzAuNCwwLjUsMSwwLjksMS43LDFjMC43LDAuMSwxLjQtMC4xLDEuOS0wLjVsMTEuNy04LjlsMCwwCgljMC41LTAuNCwwLjktMSwxLTEuN3MtMC4xLTEuNC0wLjUtMS45TDYwLDEzOC4yYy0wLjQtMC41LTEtMC45LTEuNy0xQzU4LjIsMTM3LjIsNTguMSwxMzcuMiw1OCwxMzcuMnoiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTYwNC43LDUzMi4yYy0wLjUsMC0xLjEtMC4xLTEuNi0wLjJsMCwwbC0xNC41LTIuOGMtNC42LTAuOS03LjctNS40LTYuOC0xMGwyLjgtMTQuNWMwLjktNC42LDUuNC03LjcsMTAtNi44CglsMTQuNSwyLjhjMi4yLDAuNCw0LjIsMS43LDUuNSwzLjZjMS4zLDEuOSwxLjgsNC4yLDEuMyw2LjRsLTIuOCwxNC41Yy0wLjQsMi4yLTEuNyw0LjItMy42LDUuNUM2MDgsNTMxLjcsNjA2LjQsNTMyLjIsNjA0LjcsNTMyLjJ6CgkgTTYwNC4yLDUyNi4xYzAuNywwLjEsMS40LDAsMS45LTAuNGMwLjYtMC40LDEtMSwxLjEtMS42bDIuOC0xNC41YzAuMS0wLjcsMC0xLjQtMC40LTEuOWMtMC40LTAuNi0xLTEtMS42LTEuMWwtMTQuNS0yLjgKCWMtMS40LTAuMy0yLjcsMC42LTMsMmwtMi44LDE0LjVjLTAuMywxLjQsMC42LDIuNywyLDNMNjA0LjIsNTI2LjF6Ii8+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0xMDEuNyw2MDEuOWMtMS43LDAtMy40LTAuNS00LjktMS42Yy0xLjktMS4zLTMuMS0zLjMtMy41LTUuNUw4OCw1NjQuN2MtMC44LTQuNywyLjMtOS4xLDctOS45bDcuNi0xLjMKCWMyLjMtMC40LDQuNSwwLjEsNi40LDEuNGMxLjksMS4zLDMuMSwzLjMsMy41LDUuNWw1LjMsMzAuMWMwLjgsNC43LTIuMyw5LjEtNyw5LjloMGwtNy42LDEuM0MxMDIuNyw2MDEuOCwxMDIuMiw2MDEuOSwxMDEuNyw2MDEuOXoKCSBNMTEwLjMsNTk3LjVMMTEwLjMsNTk3LjVMMTEwLjMsNTk3LjV6IE0xMDQsNTU5LjNjLTAuMSwwLTAuMywwLTAuNSwwbC03LjYsMS4zYy0xLjQsMC4yLTIuMywxLjYtMi4xLDNsNS4zLDMwLjEKCWMwLjEsMC43LDAuNSwxLjMsMS4xLDEuN2MwLjYsMC40LDEuMiwwLjUsMS45LDAuNGw3LjYtMS4zYzEuNC0wLjIsMi4zLTEuNiwyLjEtM2wtNS4zLTMwLjFjLTAuMS0wLjctMC41LTEuMy0xLjEtMS43CglDMTA1LjEsNTU5LjUsMTA0LjUsNTU5LjMsMTA0LDU1OS4zeiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNzIwLDc0Ny41Yy03LjcsMC0xMy45LTYuMy0xMy45LTEzLjlzNi4zLTEzLjksMTMuOS0xMy45czEzLjksNi4zLDEzLjksMTMuOVM3MjcuNyw3NDcuNSw3MjAsNzQ3LjV6CgkgTTcyMCw3MjUuNmMtNC40LDAtNy45LDMuNi03LjksNy45czMuNiw3LjksNy45LDcuOXM3LjktMy42LDcuOS03LjlTNzI0LjQsNzI1LjYsNzIwLDcyNS42eiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNMjcxLjUsODIuMmMtMTIuMiwwLTIyLTkuOS0yMi0yMnM5LjktMjIsMjItMjJzMjIsOS45LDIyLDIyUzI4My42LDgyLjIsMjcxLjUsODIuMnogTTI3MS41LDQ0LjEKCWMtOC44LDAtMTYsNy4yLTE2LDE2YzAsOC44LDcuMiwxNiwxNiwxNmM4LjgsMCwxNi03LjIsMTYtMTZDMjg3LjUsNTEuMywyODAuMyw0NC4xLDI3MS41LDQ0LjF6Ii8+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik03NTMuMiwzNjQuMWMtMS4zLDAtMi40LTAuOC0yLjktMi4xYy0zLjctMTEuNCwyLjUtMjMuOCwxNC0yNy41YzExLjQtMy43LDIzLjgsMi41LDI3LjUsMTQKCWMwLjUsMS42LTAuMywzLjMtMS45LDMuOGMtMS42LDAuNS0zLjMtMC4zLTMuOC0xLjljLTIuNy04LjMtMTEuNi0xMi44LTE5LjktMTAuMWMtOC4zLDIuNy0xMi44LDExLjYtMTAuMSwxOS45CgljMC41LDEuNi0wLjMsMy4zLTEuOSwzLjhDNzUzLjksMzY0LDc1My42LDM2NC4xLDc1My4yLDM2NC4xeiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNMjUzLjQsNzE1LjZjLTAuNiwwLTEuMy0wLjItMS44LTAuNmMtMS4zLTEtMS42LTIuOS0wLjYtNC4yYzIuNS0zLjQsMy42LTcuNSwzLTExLjdjLTAuNi00LjItMi44LTcuOS02LjItMTAuNAoJYy0zLjQtMi41LTcuNS0zLjYtMTEuNy0zYy00LjIsMC42LTcuOSwyLjgtMTAuNCw2LjJjLTEsMS4zLTIuOSwxLjYtNC4yLDAuNmMtMS4zLTEtMS42LTIuOS0wLjYtNC4yYzMuNS00LjcsOC42LTcuNywxNC40LTguNQoJYzUuOC0wLjgsMTEuNSwwLjcsMTYuMiw0LjJjNC43LDMuNSw3LjcsOC42LDguNSwxNC40YzAuOCw1LjgtMC43LDExLjUtNC4yLDE2LjJDMjU1LjIsNzE1LjIsMjU0LjMsNzE1LjYsMjUzLjQsNzE1LjZ6Ii8+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00NzMuNCwzMDEuMWMtMC45LDAtMS44LTAuNC0yLjMtMS4xbC0xOC45LTIzLjdjLTAuOC0wLjktMC45LTIuMy0wLjMtMy4zbDE0LjYtMjYuNWMwLjUtMC45LDEuNC0xLjUsMi40LTEuNQoJYzEtMC4xLDIsMC4zLDIuNiwxLjFsMTguOSwyMy43YzAuOCwwLjksMC45LDIuMywwLjMsMy4zbC0xNC42LDI2LjVjLTAuNSwwLjktMS40LDEuNS0yLjQsMS41QzQ3My42LDMwMS4xLDQ3My41LDMwMS4xLDQ3My40LDMwMS4xegoJIE00NTguMiwyNzQuMWwxNC44LDE4LjZsMTEuNS0yMC44bC0xNC44LTE4LjZMNDU4LjIsMjc0LjF6Ii8+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0xNTAuMywzNTguN2MtMC41LDAtMC45LTAuMS0xLjQtMC4zYy0xLjEtMC42LTEuNy0xLjctMS42LTNsNC00Mi43YzAuMS0xLDAuNy0xLjksMS42LTIuNAoJYzAuOS0wLjUsMS45LTAuNSwyLjgsMGwyOCwxNC43YzAuOSwwLjUsMS41LDEuMywxLjYsMi4zYzAuMSwxLTAuMywyLTEsMi42bC0zMiwyOEMxNTEuOCwzNTguNSwxNTEsMzU4LjcsMTUwLjMsMzU4Ljd6IE0xNTYuOSwzMTcuOAoJbC0yLjksMzAuN2wyMy0yMC4yTDE1Ni45LDMxNy44eiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNzgxLjgsNTQ5LjRjLTAuMSwwLTAuMiwwLTAuMywwbC0zMS40LTMuMmMtMS0wLjEtMS45LTAuNy0yLjMtMS42cy0wLjUtMS45LDAtMi44bDE5LjMtMzcuOQoJYzAuNi0xLjEsMS43LTEuNywzLTEuNmMxLjIsMC4xLDIuMywxLDIuNiwyLjFsMTIuMSw0MS4xYzAuMywxLDAuMSwyLTAuNiwyLjhDNzgzLjUsNTQ5LDc4Mi42LDU0OS40LDc4MS44LDU0OS40eiBNNzU1LDU0MC42CglsMjIuNiwyLjNsLTguNy0yOS42TDc1NSw1NDAuNnoiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTU4My4xLDM3NS42bDcuMiw5LjZjMS4yLDEuNiwzLjgsMS4yLDQuNC0wLjdsNC0xMS43YzAuNi0xLjgtMS0zLjYtMi44LTMuM2wtMTEuMSwyLjEKCUM1ODIuOSwzNzEuOSw1ODIsMzc0LjEsNTgzLjEsMzc1LjZ6Ii8+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00NzcuNSw3NTMuNGMtMC45LDAtMS43LTAuNC0yLjMtMS4xTDQ1NSw3MjguMWMtMC42LTAuOC0wLjktMS44LTAuNi0yLjdzMS0xLjcsMS45LTJsMjgtOS41CgljMS0wLjQsMi4yLTAuMSwzLDAuNmMwLjgsMC43LDEuMiwxLjgsMC45LDIuOWwtNy44LDMzLjhjLTAuMywxLjEtMS4xLDItMi4yLDIuMkM0NzgsNzUzLjQsNDc3LjgsNzUzLjQsNDc3LjUsNzUzLjR6IE00NjIuNCw3MjcuNgoJbDEzLjYsMTYuM2w1LjItMjIuNkw0NjIuNCw3MjcuNnoiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTM4MC4zLDU0Ni4xSDM0NWMtMS43LDAtMy0xLjMtMy0zczEuMy0zLDMtM2gzMi4zdi0zMC4zYzAtMS43LDEuMy0zLDMtM3MzLDEuMywzLDN2MzMuMwoJQzM4My4zLDU0NC43LDM4Miw1NDYuMSwzODAuMyw1NDYuMXoiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTcwMi4zLDEwMC43SDY3N2MtMS4xLDAtMi4xLTAuNi0yLjYtMS42Yy0wLjUtMS0wLjUtMi4xLDAuMS0zLjFsMjUuMy00MGMwLjctMS4xLDIuMS0xLjYsMy40LTEuMwoJYzEuMywwLjQsMi4yLDEuNSwyLjIsMi45djQwQzcwNS4zLDk5LjQsNzA0LDEwMC43LDcwMi4zLDEwMC43eiBNNjgyLjUsOTQuN2gxNi45VjY4LjFMNjgyLjUsOTQuN3oiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTY2My43LDI2MC4xYy0xLjQsMC0yLjctMS0yLjktMi40bC04LTQxLjNjLTAuMy0xLjYsMC43LTMuMiwyLjQtMy41YzEuNi0wLjMsMy4yLDAuNywzLjUsMi40bDgsNDEuMwoJYzAuMywxLjYtMC43LDMuMi0yLjQsMy41QzY2NCwyNjAsNjYzLjksMjYwLjEsNjYzLjcsMjYwLjF6Ii8+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00NzEuMywxMjMuNGMtMC42LDAtMS4xLTAuMi0xLjctMC41bC0zNC4zLTIyLjdjLTEuNC0wLjktMS44LTIuOC0wLjgtNC4yYzAuOS0xLjQsMi44LTEuOCw0LjItMC44bDM0LjMsMjIuNwoJYzEuNCwwLjksMS44LDIuOCwwLjgsNC4yQzQ3My4yLDEyMi45LDQ3Mi4zLDEyMy40LDQ3MS4zLDEyMy40eiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNMzUzLjIsMzk0LjRsLTcuNS0zLjFjLTEuNi0wLjctMi40LTIuNS0xLjctNC4xbDMuMS03LjVjMC43LTEuNiwyLjUtMi40LDQuMS0xLjdsNy41LDMuMQoJYzEuNiwwLjcsMi40LDIuNSwxLjcsNC4xbC0zLjEsNy41QzM1Ni42LDM5NC4zLDM1NC44LDM5NSwzNTMuMiwzOTQuNHoiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTUwMSw2MDQuMmwtNi44LDQuNGMtMS40LDAuOS0zLjQsMC41LTQuMy0wLjlsLTQuNC02LjhjLTAuOS0xLjQtMC41LTMuNCwwLjktNC4zbDYuOC00LjQKCWMxLjQtMC45LDMuNC0wLjUsNC4zLDAuOWw0LjQsNi44QzUwMi45LDYwMS4zLDUwMi41LDYwMy4yLDUwMSw2MDQuMnoiLz4KPGNpcmNsZSBjbGFzcz0ic3QwIiBjeD0iMjk4IiBjeT0iMjA1LjIiIHI9IjcuNCIvPgo8Y2lyY2xlIGNsYXNzPSJzdDAiIGN4PSI0MC4zIiBjeT0iNzUwLjQiIHI9IjcuNCIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNjgxLDY3OC43Yy0wLjgsMC0xLjYtMC4zLTIuMi0wLjlsLTI1LjMtMjYuN2MtMS4xLTEuMi0xLjEtMy4xLDAuMS00LjJjMS4yLTEuMSwzLjEtMS4xLDQuMiwwLjFsMjUuMywyNi43CgljMS4xLDEuMiwxLjEsMy4xLTAuMSw0LjJDNjgyLjUsNjc4LjQsNjgxLjcsNjc4LjcsNjgxLDY3OC43eiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNMTYuMywyODIuN2MtMS40LDAtMi43LTEtMy0yLjVjLTAuMy0xLjYsMC44LTMuMiwyLjUtMy41bDI0LTRjMS42LTAuMywzLjIsMC44LDMuNSwyLjUKCWMwLjMsMS42LTAuOCwzLjItMi41LDMuNWwtMjQsNEMxNi43LDI4Mi43LDE2LjUsMjgyLjcsMTYuMywyODIuN3oiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTEzNS43LDQ0LjFjLTEuNywwLTMtMS4zLTMtM1YxN2MwLTEuNywxLjMtMywzLTNzMywxLjMsMywzdjI0QzEzOC43LDQyLjgsMTM3LjMsNDQuMSwxMzUuNyw0NC4xeiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNMTkzLjcsNTAyYy0wLjgsMC0xLjctMC4zLTIuMi0xYy0xLjEtMS4yLTEtMy4xLDAuMy00LjJsMjkuMy0yNmMxLjItMS4xLDMuMS0xLDQuMiwwLjNjMS4xLDEuMiwxLDMuMS0wLjMsNC4yCglsLTI5LjMsMjZDMTk1LjEsNTAxLjgsMTk0LjQsNTAyLDE5My43LDUwMnoiLz4KPC9zdmc+Cg=="), linear-gradient(90deg, #6f58ee 0%, #7434f3 100%);
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 3;
    transition: transform 0.3s ease-in-out;
}

.container #style-box.leftslide:before, .container #style-box.fadein:before, .container #style-box.topslide:before, .container #style-box.pushslide:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5;
    background-color: rgba(0, 0, 0, 0.3);
}

.container #style-box.pushslide {
    transform: translate3d(250px, 0, 0);
    transition: transform 0.3s ease-in-out;
    z-index: 5;
}

.container #style-box .box-inner h1 {
    margin-top: 0;
    padding: 10px;
    text-transform: uppercase;
    color: #ffffff;
}

.container #style-box .box-inner h1 span {
    font-style: italic;
    font-size: 20px;
}

.container #style-box .box-inner ul li {
    display: inline-block;
    padding: 10px 15px;
    margin-right: 10px;
    margin-bottom: 10px;
    background-color: #e74d09;
    text-transform: capitalize;
    border-radius: 4px;
    cursor: pointer;
    color: #ffffff;
    border: 2px solid #e74d09;
    transition: background-color 0.2s ease-in;
}

.container #style-box .box-inner ul li:last-child {
    margin-right: 0;
}

.container #style-box .box-inner ul li:hover, .container #style-box .box-inner ul li.now {
    background-color: transparent;
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        left: 30px;
    }

    100% {
        opacity: 1;
        left: 0px;
    }
}

/* header css  */
/* banner css  */
.banner {
    background: rgb(128, 43, 89);
    background: radial-gradient(circle, rgba(128, 43, 89, 1) 22%, rgba(28, 25, 23, 1) 64%);
    padding: 20% 0;
    margin-top: -11%;
    z-index: -1;
    padding-bottom: 4%;
}

.slide-para p {
    font-size: 14px;
    color: #fff;
    font-weight: 100;
    margin-top: 16%;
    max-width: 80%;
}

.slider-banner{
    position: relative;
}

a.main-btn {
    background: #F3520A;
    color: #fff;
    text-decoration: none;
    font-size: 15px;
    padding: 45px 33px;
    border-radius: 50%;
}

.slide-btn {
    z-index: 111;
    position: absolute;
    top: 20%;
    left: 72%;
}

.slider-banner {
    position: relative;
}

.slide-btn2 {
    margin-top: 29%;
}

.slide-btn2 a {
    padding: 58px 11px;
}

.col-md-5.slider-col {
    position: relative;
}
/* .col-md-5.slider-col {
    padding: 0;
} */

.slider-col .wrapper .carousel .slick-list {
    padding: 0 !important;
    height: 485px;
}

/* .slider-col .wrapper .carousel .slick-list .slider-banner.slick-slide {
    width: 479px !important;
} */

.custom-pagination {
    position: absolute;
    top: -18%;
    left: 8%;
}

.custom-pagination .counter {
    font-size: 60px;
    color: #fff;
}

.slider-col .wrapper .carousel .slick-dots li.slick-active {
    border: 1px solid #f3520a;
    width: 25px;
    height: 25px;
    border-radius: 50%;
}

.slider-col .wrapper .carousel .slick-dots li.slick-active button:before {
    color: #f3520a;
}

.slider-col .wrapper .carousel .slick-dots li button:before {
    top: 2px;
    left: 2px;
    color: #fff;
    opacity: unset;
}

.slider-col .wrapper .carousel .slick-dots {
    bottom: -64px;
    text-align: left;
}

.baner-heading h1 {
    font-size: 55px;
    text-align: center;
    text-transform: uppercase;
    color: #fff;
    line-height: 1.1;
}

.baner-heading h2 {
    -webkit-text-stroke: 1px #fff;
    -webkit-text-fill-color: transparent;
    font-size: 34px;
    text-transform: uppercase;
    margin-left: 3%;
    font-family: 'Abril Fatface';
    font-weight: 100;
}

.banner .col-md-7 {
    position: relative;
    z-index: 2;
}

.banner .col-md-7::after {
    position: absolute;
    content: "";
    background-image: url(../images/banner.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 60%;
    height: 600px;
    top: -40%;
    right: 0;
    z-index: -1;
}

/* banner css  */
/* ABOUT US CSS */
.about {
    background: rgb(105, 47, 21);
    background: radial-gradient(circle, rgba(105, 47, 21, 1) 0%, rgba(28, 25, 23, 1) 57%);
    padding: 10% 0;
}

/* text fill css  */
.headto {
    font-size: 50px;
    cursor: pointer;
    -webkit-text-stroke: 1px #fff;
    -webkit-text-fill-color: transparent;
}

#test {
    background: linear-gradient(#ffffff, #ffffff) left no-repeat;
    background-size: 0% 100%;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: 1s ease-in-out;
}

#test:hover {
    background-size: 100% 100%;
}

div#test {
    font-size: 140px;
    width: 86%;
    height: 168px;
}

/* text fill css  */
.text-fill {
    position: relative;
}

.text-fill:after {
    position: absolute;
    content: "";
    border-top: 1px solid #fff;
    width: 170px;
    top: 68%;
    right: 10%;
}

.about-para h3 {
    font-size: 51px;
    text-transform: uppercase;
    color: #fff;
    font-size: 57px;
}

.about-para h5 {
    font-size: 52px;
    text-transform: uppercase;
    -webkit-text-stroke: 1px #a8a8a8;
    -webkit-text-fill-color: transparent;
}

a.golbal-btn {
    color: #f3520a;
    text-decoration: none;
    border: 1px solid #f3520a;
    padding: 50px 40px;
    border-radius: 50%;
    transition: all 700ms linear;
}

a.golbal-btn:hover {
    background: #f3520a;
    border: 1px solid #f3520a;
    color: #fff;
}

.main-buton {
    margin-top: 10%;
    text-align: end;
    margin-right: 14%;
}

.about-img img {
    width: 100%;
    margin-top: 13%;
}

.last-para p {
    font-size: 20px;
    color: #fff;
    max-width: 50%;
    display: block;
    margin: 0 auto;
    margin-top: 31%;
}

.after-div img {
    width: 30%;
    margin-top: 6%;
    margin-left: 16%;
}

.row.about-last-row {
    margin-top: -8%;
}

/* ABOUT US CSS */
/* WHY CHOOSE UP CSS  */
section.why-us {
    background: #1c1917;
    padding: 5% 0;
}

section.why-us .text-fill div#test {
    font-size: 63px;
    height: 104px;
}

section.why-us .text-fill:after {
    display: none;
}

.why-img p {
    font-size: 20px;
    color: #fff;
    max-width: 50%;
    display: block;
    margin: 0 auto;
    margin-top: 14px;
}

.buton-2 {
    text-align: end;
}

.about-para h5 {
    font-size: 52px;
    text-transform: uppercase;
    -webkit-text-stroke: 1px #a8a8a8;
    -webkit-text-fill-color: transparent;
}

.buton-2 a.golbal-btn {
    color: #ffffff;
    text-decoration: none;
    border: 1px solid #f3520a;
    padding: 63px 13px;
    border-radius: 50%;
    transition: all 700ms linear;
}

.why-img img {
    WIDTH: 70%;
}

/* WHY CHOOSE UP CSS  */
/* CONTACT US CSS  */
section.contact {
    background: #1c1917;
    padding: 5% 0;
}

.contact-para {
    margin-top: 20%;
}

.contact-para h6 {
    color: #f3520a;
}

.contact-para h1 {
    font-size: 30px;
    color: #fff;
    line-height: 1.4;
}

.contact-para a {
    text-decoration: none;
}

/* CONTACT US CSS */
/* MEMEBER CSS */
.memeber {
    background: rgb(105, 47, 21);
    background: radial-gradient(circle, rgba(105, 47, 21, 1) 0%, rgba(28, 25, 23, 1) 57%);
    padding: 10% 0;
}

.member-card img {
    width: 100%;
    margin-bottom: -10%;
    transition: all 600ms linear;
    height: 170px;
}

.member-card h3 {
    font-size: 26px;
    color: #fff;
    /* display: block; */
    TEXT-ALIGN: end;
    text-transform: uppercase;
}

.member-card p {
    text-align: end;
    color: #e74d09;
    font-size: 16px;
}

.member-card {
    position: relative;
}

.hide-buton {
    position: absolute;
    top: 30%;
    left: 30%;
    display: none;
}

.hide-buton a {
    color: #fff;
    border: 1px solid #fff;
    opacity: unset;
}

.member-card:hover {
    opacity: 0.30;
}

.member-card:hover .hide-buton {
    display: block;
    opacity: unset;
}

/* MEMEBER CSS */
/* FOR NEW css */
.for-new {
    background: rgb(105, 47, 21);
    background: radial-gradient(circle, rgba(105, 47, 21, 1) 0%, rgba(28, 25, 23, 1) 57%);
    padding: 5% 0;
    background: #1c1917;
}

.for-new-para h1 {
    font-size: 60px;
    color: #fff;
    margin-left: 12%;
    position: revert;
}

.for-new-para h1 span {
    position: absolute;
    left: 5%;
    -webkit-text-stroke: 1px #fff;
    -webkit-text-fill-color: transparent;
}

.for-new-para {
    position: relative;
}

.for-new-para:after {
    position: absolute;
    content: "";
    border-top: 1px solid #fff;
    width: 170px;
    top: 50%;
    right: 25%;
}

.last-buton a {
    background: #f3520a;
    color: #fff !important;
}

.last-buton a:hover {
    background: transparent;
    border: 1px solid #f3520a;
}

.last-buton {
    margin-top: 26%;
}

/* FOR NEW css */
/* FOOTER CSS  */
footer.footer {
    background: #1c1917;
    padding: 3% 0;
}

ul.footer-list li {
    display: inline;
    font-size: 14px;
    color: #7c7c7c;
}

ul.footer-list li a {
    color: #7c7c7c;
    text-decoration: none;
    margin: 0 14px;
}

ul.footer-list {
    margin-top: 7%;
}

ul.footer-ladt li {
    display: inline;
}

ul.footer-ladt li a {
    font-size: 14px;
    color: #ffffff;
    text-decoration: none;
    margin: 0 30px;
    transition: all 500ms linear;
}

ul.footer-ladt li a:hover {
    color: #f2520a;
}

ul.footer-ladt {
    margin-top: 15%;
}

/* FOOTER CSS  */