@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");
*{
box-sizing: border-box;
padding: 0;
margin: 0;
font-family: 'Apollo Flama Basic';
}

@font-face {
    font-family: 'Bw Gradual';
    src: url('../webfonts/BWGradual/BwGradual-ExtraBoldItalic.woff2') format('woff2'),
        url('../webfonts/BWGradual/BwGradual-ExtraBoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bw Gradual';
    src: url('../webfonts/BWGradual/BwGradual-ThinItalic.woff2') format('woff2'),
        url('../webfonts/BWGradual/BwGradual-ThinItalic.woff') format('woff');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bw Gradual';
    src: url('../webfonts/BWGradual/BwGradual-MediumItalic.woff2') format('woff2'),
        url('../webfonts/BWGradual/BwGradual-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bw Gradual';
    src: url('../webfonts/BWGradual/BwGradual-LightItalic.woff2') format('woff2'),
        url('../webfonts/BWGradual/BwGradual-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bw Gradual';
    src: url('../webfonts/BWGradual/BwGradual-BlackItalic.woff2') format('woff2'),
        url('../webfonts/BWGradual/BwGradual-BlackItalic.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bw Gradual';
    src: url('../webfonts/BWGradual/BwGradual-BoldItalic.woff2') format('woff2'),
        url('../webfonts/BWGradual/BwGradual-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bw Gradual';
    src: url('../webfonts/BWGradual/BwGradual-RegularItalic.woff2') format('woff2'),
        url('../webfonts/BWGradual/BwGradual-RegularItalic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}


@font-face {
    font-family: 'Apollo Flama Basic';
    src: url('../webfonts/apollo-tyres-flama/ApolloFlama-BasicItalic.woff2') format('woff2'),
        url('../webfonts/apollo-tyres-flama/ApolloFlama-BasicItalic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Apollo Flama Basic';
    src: url('../webfonts/apollo-tyres-flama/ApolloFlama-Basic.woff2') format('woff2'),
        url('../webfonts/apollo-tyres-flama/ApolloFlama-Basic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Apollo Flama';
    src: url('../webfonts/apollo-tyres-flama/ApolloFlama-Bold.woff2') format('woff2'),
        url('../webfonts/apollo-tyres-flama/ApolloFlama-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Apollo Flama';
    src: url('../webfonts/apollo-tyres-flama/ApolloFlama-MediumItalic.woff2') format('woff2'),
        url('../webfonts/apollo-tyres-flama/ApolloFlama-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Apollo Flama Book';
    src: url('../webfonts/apollo-tyres-flama/ApolloFlama-BookItalic.woff2') format('woff2'),
        url('../webfonts/apollo-tyres-flama/ApolloFlama-BookItalic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Apollo Flama Book';
    src: url('../webfonts/apollo-tyres-flama/ApolloFlama-Book.woff2') format('woff2'),
        url('../webfonts/apollo-tyres-flama/ApolloFlama-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Apollo Flama';
    src: url('../webfonts/apollo-tyres-flama/ApolloFlama-BoldItalic.woff2') format('woff2'),
        url('../webfonts/apollo-tyres-flama/ApolloFlama-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Apollo Flama';
    src: url('../webfonts/apollo-tyres-flama/ApolloFlama-Medium.woff2') format('woff2'),
        url('../webfonts/apollo-tyres-flama/ApolloFlama-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}




audio,
canvas,
embed,
iframe,
img,
object,
svg,
video {
display: block;
height: auto;
max-width: 100%;
width: 100%;
}

summary {
display: list-item;
}

body,
html {
height: 100%;
}

html {
font-size: 100%;
scroll-behavior: smooth;
}


p { 
font-size: 15px;
color: #1c1c1c;
line-height: 1.55;
margin-bottom: 1rem;
font-weight: 500;
}
a, a:hover, a:focus, button:hover, button:focus, input:focus{outline:none!important; text-decoration: none !important;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {color: #000;  }

.container{ max-width: 440px;padding: 0px;}
.hero_section{border: solid 1px #e5e5e5;}
.hero_section img{ width: 100%; }
.section_aplo{ }
.apollo_offer{color: #FFF;
text-align: center;
font-family: "Bw Gradual";
font-size: 18px;
font-style: italic;
font-weight: 700;
line-height: 20px; /* 111.111% */
text-transform: uppercase;background: #5C2D93;padding: 10px 0px;}

/* mid strt  */
.mid_sectionmain{background: linear-gradient(0deg, rgba(234, 233, 233, 0.80) 0%, rgba(234, 233, 233, 0.80) 100%), url('../images/bg-from.png') lightgray 50% / contain no-repeat;
             min-height: 53vh;
            align-items:start;
            padding: 30px 14px 0;
            background-size: cover;
            background-position: center;}

            .mid_main{background: linear-gradient(180deg, rgba(212, 220, 255, 0.28) 0%, rgba(255, 255, 255, 0.28) 100%); width: 100%;}
            .mid_top{border-radius: 12px 12px 0 0;
background: rgba(255, 255, 255, 0.62);
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.07);color: #000;
text-align: left;
font-family: "Bw Gradual";
font-size: 16px;
font-style: italic;
font-weight: 800;
line-height: normal;
padding: 15px 10px;
    display: flex;
    align-items: center;
    gap: 9px;}
.mid_top img{max-width: 39px;}
.tyre_boxmainsection{ padding: 30px 15px; margin-bottom: 0px;}
.tyre_bike_main { transition: transform 0.3s ease;}
 .tyre_bike_main:hover {
            transform: translateY(-3px);
        }
.tyre_bike_main a{ display: flex;border-radius: 8px;
background: #FFF;gap: 15px;
    margin-bottom: 20px;
    color: #000;
text-align: center;
font-family: "Bw Gradual";
font-size: 20px;
font-style: italic;
font-weight: 500;
line-height: normal;
text-transform: uppercase; align-items: center;}
.trye_icon{border-radius: 8px 0 0 8px;
background: #F15A21;padding: 12px;transition: all 0.3s ease;}
.tyre_bike_main a.active {
            background-color: #5C2D93;
            box-shadow: 0 6px 15px rgba(58, 87, 232, 0.2); color: #fff;border-radius: 10px;
        }

.terms_cont{color: #4C4C4C;
font-size: 14px;
font-style: normal;
font-weight: 550;
line-height: 20px; text-align: center; padding: 10px 0;background: #e5e4e4;}
.terms_cont span{color: #FF0D0D;}
.terms_cont a{color: #5C2D93;}
.form-check-label a{color: #5C2D93;}
/* mid strt  */


.quction_section{}
.quction_section h1{color: #000;
font-family: "Bw Gradual";
font-size: 16px;
font-style: italic;
font-weight: 800;
line-height: normal;
text-transform: uppercase;}
.quction_section p{color: #000;
font-family: "Apollo Flama";
font-size: 14px;
font-style: normal;
font-weight: 600;
line-height: normal;margin-top: 14px;}
.quction_section .form-check-label{color: #000;
font-size: 14px;
font-style: normal;
font-weight: 550;
line-height: 24x; /* 285.714% */}
.quction_section .form-check { margin-top: 10px;}
.tyre_boxmainsection .btn-primary{border-radius: 8px;background: #F15A21;color: #FFF; border-color: #F15A21;
font-family: "Bw Gradual";
font-size: 16px;
font-style: italic;
font-weight: 700;
line-height: 20px; /* 125% */
text-transform: uppercase; padding: 10px 15px; margin-top: 20px;}
.tyre_boxmainsection .btn-primary:hover{background: #F7835A;border-color: #F7835A;}

.quction_section .btn-outline-secondary{background: #F7835A;color: #FFF;
font-size: 14px;
font-style: normal;
font-weight: 550;
line-height: normal; border: none;}
.quction_section .form-control{color: #333;
font-size: 14px;
font-style: normal;
font-weight: 550;
line-height: normal; height: 48px;}

 .invoice-upload-box {
           
            border-radius: 8px;
            padding: 15px 20px;
            text-align: center;
            cursor: pointer;
            transition: all 0.3s ease;
            background-color: #fff;
            margin-bottom: 20px;
            position: relative;
        }
        
        /* .invoice-upload-box:hover {
            border-color: #3498db;
            background-color: #f0f7ff;
            transform: translateY(-5px);
        } */
        
        .upload-image {
            width: 50px;
            height: 50px;
            margin-bottom: 20px;
            opacity: 0.7;
            transition: all 0.3s;
            display: inline-block;
        }
        
        .invoice-upload-box:hover .upload-image {
            opacity: 1;
            transform: scale(1.05);
        }
        
        .upload-text {
            display: block;
            color: #333;
            font-size: 20px;
            font-weight: 600;
            margin-bottom: 10px;
        }
        
        .upload-hint {
            color: #333;
            font-size: 14px;
            margin-top: 5px;
        }
        
        .camera-hint {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            margin-top: 15px;
            color: #3498db;
            font-size: 14px;
            font-weight: 500;
        }
.thanku_mains{display: flex; align-items: center;}
.thanku_mess{ text-align: center;    padding: 34px;}
.thanku_mess img{ width: auto; display: inline-block; margin-bottom: 10px;}
.thanku_mess p{color: #000;
text-align: center;
font-family: "Apollo Flama";
font-size: 22px;
font-style: italic;
font-weight: 775;
line-height: 33px; /* 150% */}

/* footer strt  */
.footer_main{color: #FFF;
text-align: center;
font-size: 14px;
font-style: normal;
font-weight: 550;
line-height: 20px; /* 142.857% */background: #5C2D93;padding: 10px 0px;}


.form-check-input:focus {
    box-shadow: 0 0 0 .07rem rgb(132 98 174);
}

.form-check-input:checked {
    background-color: #8462AE;
    border-color: #8462AE;
}


.terms_conditions_main h2{font-family: "Bw Gradual";font-size: 18px; font-weight: 600;}
.terms_conditions_main p{ text-align: justify;font-size: 13px;line-height: 24px;font-family: "Apollo Flama";font-weight: 400;}
.terms_conditions_main p i{ text-align: justify;font-size: 13px;line-height: 24px;font-family: "Apollo Flama";font-weight: 400;}
.terms_conditions_main p strong{ font-weight: 700;font-family: "Apollo Flama";}
.terms_conditions_main h4{font-family: "Bw Gradual";font-size: 16px; font-weight: 600;}
.terms_conditions_main ul{ margin: 0px 0 0 15px; padding: 0;}
.terms_conditions_main li{font-size: 13px;line-height: 24px;font-family: "Apollo Flama";font-weight: 400;}
.terms_conditions_main li a{ color: #5C2D93;font-weight: 700;font-family: "Apollo Flama";}
.terms_conditions_main p a{ color: #5C2D93;font-weight: 700;font-family: "Apollo Flama";}
.terms_conditions_main li p{font-size: 13px;line-height: 24px;font-family: "Apollo Flama";font-weight: 400; margin: 0;}
.terms_conditions_main li p ul{margin: 0px 0 0 15px; padding: 0;}
.terms_conditions_main li p ul li{font-size: 13px;line-height: 24px;font-family: "Apollo Flama";font-weight: 400;}
.terms_conditions_main li p ul li strong{font-weight: 700;font-family: "Apollo Flama";}
.terms_conditions_main ul ul ul{margin: 0px 0 0 15px; padding: 0; list-style: none;}
.terms_conditions_main li p ul li ul li{font-size: 13px;line-height: 24px;font-family: "Apollo Flama";font-weight: 400;}
.terms_conditions_main li p ul li ul li strong{font-weight: 700;font-family: "Apollo Flama";}

/* footer end  */

 @media (max-width: 480px) {
                        
            .invoice-upload-box {
                padding: 40px 15px;
            }
            
            .upload-text {
                font-size: 18px;
            }
        }