@font-face {
    font-family: 'Roboto-Black';
    src: url('../fonts/Roboto-Black.eot');
    src: url('../fonts/Roboto-Black.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-Black.woff2') format('woff2'),
        url('../fonts/Roboto-Black.woff') format('woff'),
        url('../fonts/Roboto-Black.ttf') format('truetype'),
        url('../fonts/Roboto-Black.svg#Roboto-Black') format('svg');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto-BlackItalic';
    src: url('../fonts/Roboto-BlackItalic.eot');
    src: url('../fonts/Roboto-BlackItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-BlackItalic.woff2') format('woff2'),
        url('../fonts/Roboto-BlackItalic.woff') format('woff'),
        url('../fonts/Roboto-BlackItalic.ttf') format('truetype'),
        url('../fonts/Roboto-BlackItalic.svg#Roboto-BlackItalic') format('svg');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto-ThinItalic';
    src: url('../fonts/Roboto-ThinItalic.eot');
    src: url('../fonts/Roboto-ThinItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-ThinItalic.woff2') format('woff2'),
        url('../fonts/Roboto-ThinItalic.woff') format('woff'),
        url('../fonts/Roboto-ThinItalic.ttf') format('truetype'),
        url('../fonts/Roboto-ThinItalic.svg#Roboto-ThinItalic') format('svg');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto-Medium';
    src: url('../fonts/Roboto-Medium.eot');
    src: url('../fonts/Roboto-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-Medium.woff2') format('woff2'),
        url('../fonts/Roboto-Medium.woff') format('woff'),
        url('../fonts/Roboto-Medium.ttf') format('truetype'),
        url('../fonts/Roboto-Medium.svg#Roboto-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto-Bold';
    src: url('../fonts/Roboto-Bold.eot');
    src: url('../fonts/Roboto-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-Bold.woff2') format('woff2'),
        url('../fonts/Roboto-Bold.woff') format('woff'),
        url('../fonts/Roboto-Bold.ttf') format('truetype'),
        url('../fonts/Roboto-Bold.svg#Roboto-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto-Light';
    src: url('../fonts/Roboto-Light.eot');
    src: url('../fonts/Roboto-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-Light.woff2') format('woff2'),
        url('../fonts/Roboto-Light.woff') format('woff'),
        url('../fonts/Roboto-Light.ttf') format('truetype'),
        url('../fonts/Roboto-Light.svg#Roboto-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto-LightItalic';
    src: url('../fonts/Roboto-LightItalic.eot');
    src: url('../fonts/Roboto-LightItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-LightItalic.woff2') format('woff2'),
        url('../fonts/Roboto-LightItalic.woff') format('woff'),
        url('../fonts/Roboto-LightItalic.ttf') format('truetype'),
        url('../fonts/Roboto-LightItalic.svg#Roboto-LightItalic') format('svg');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto-BoldItalic';
    src: url('../fonts/Roboto-BoldItalic.eot');
    src: url('../fonts/Roboto-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-BoldItalic.woff2') format('woff2'),
        url('../fonts/Roboto-BoldItalic.woff') format('woff'),
        url('../fonts/Roboto-BoldItalic.ttf') format('truetype'),
        url('../fonts/Roboto-BoldItalic.svg#Roboto-BoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto-Italic';
    src: url('../fonts/Roboto-Italic.eot');
    src: url('../fonts/Roboto-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-Italic.woff2') format('woff2'),
        url('../fonts/Roboto-Italic.woff') format('woff'),
        url('../fonts/Roboto-Italic.ttf') format('truetype'),
        url('../fonts/Roboto-Italic.svg#Roboto-Italic') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto-Thin';
    src: url('../fonts/Roboto-Thin.eot');
    src: url('../fonts/Roboto-Thin.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-Thin.woff2') format('woff2'),
        url('../fonts/Roboto-Thin.woff') format('woff'),
        url('../fonts/Roboto-Thin.ttf') format('truetype'),
        url('../fonts/Roboto-Thin.svg#Roboto-Thin') format('svg');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto-Regular';
    src: url('../fonts/Roboto-Regular.eot');
    src: url('../fonts/Roboto-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-Regular.woff2') format('woff2'),
        url('../fonts/Roboto-Regular.woff') format('woff'),
        url('../fonts/Roboto-Regular.ttf') format('truetype'),
        url('../fonts/Roboto-Regular.svg#Roboto-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto-MediumItalic';
    src: url('../fonts/Roboto-MediumItalic.eot');
    src: url('../fonts/Roboto-MediumItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-MediumItalic.woff2') format('woff2'),
        url('../fonts/Roboto-MediumItalic.woff') format('woff'),
        url('../fonts/Roboto-MediumItalic.ttf') format('truetype'),
        url('../fonts/Roboto-MediumItalic.svg#Roboto-MediumItalic') format('svg');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}
*{margin:0px;padding:0px;}
body {font-family: 'Roboto-Regular';margin:0px; padding:0px;}

*{margin:0px;padding:0px;}
body{margin:0px; padding:0px; background-color:#ffffff;font-family: 'Roboto-Regular'; font-size:16px;color:#333333; line-height:1.5; overflow-x:hidden;}
p{margin-bottom:20px; margin-top:0px; line-height:26px; font-size:16px; font-family: 'Roboto-Regular';}
a{text-decoration:none;color:#ee6123;}
a:hover{text-decoration:underline; color:#000000;}
.main-container{max-width:1170px; width:96%; margin:auto;}
.main-container-full-width{width:100%; margin:auto;}
section, header, footer{width: 100%;float: left; box-sizing: border-box;}

h1, h2, h3, h4, h5, h6{font-weight: normal;font-family: 'Roboto-Medium';}

.img-responsive{max-width:100%;height:auto;}
.text-left{text-align:left;}
.text-right{text-align:right;}
.text-center{text-align:center;}
.bold-text{font-family: 'Roboto-Bold';}
.top-headline-font { font-family: 'Roboto-Regular'; font-size: 18px;}


/*Extra Styles*/
.heading-font-size-45{font-size:40px; line-height:50px;}
.heading-font-size-25{font-size:25px; line-height:35px;}
.services-heading-font-size-35{font-size:35px; font-family: 'Roboto-Medium'; line-height:45px;}
.max-width-550 {max-width: 500px;width: 100%;}
.font-22 p{font-size:22px;line-height:32px;}
.font-size-30{font-size:30px;line-height:40px;}
.font-size-15{font-size:15px;line-height:25px; text-transform:uppercase;}

.m-0{margin:0px !important;}
.p-0{padding:0px !important;}
.mt-0{margin-top:0px;}
.mt-1{margin-top:10px;}
.mt-2{margin-top:20px;}
.mt-3{margin-top:30px;}
.mt-4{margin-top:40px;}
.mt-5{margin-top:50px;}
.mt-6{margin-top:60px;}
.mt-7{margin-top:70px;}
.mt-8{margin-top:80px;}

.mb-0{margin-bottom:0px;}
.mb-1{margin-bottom:10px;}
.mb-2{margin-bottom:20px;}
.mb-3{margin-bottom:30px;}
.mb-4{margin-bottom:40px;}
.mb-5{margin-bottom:50px;}
.mb-6{margin-bottom:60px;}
.mb-7{margin-bottom:70px;}
.mb-8{margin-bottom:80px;}

.mr-0{margin-right:0px;}
.mr-1{margin-right:10px;}
.mr-2{margin-right:20px;}
.mr-3{margin-right:30px;}
.mr-4{margin-right:40px;}
.mr-5{margin-right:50px;}
.mr-6{margin-right:60px;}
.mr-7{margin-right:70px;}
.mr-8{margin-right:80px;}

.ml-0{margin-left:0px;}
.ml-1{margin-left:10px;}
.ml-2{margin-left:20px;}
.ml-3{margin-left:30px;}
.ml-4{margin-left:40px;}
.ml-5{margin-left:50px;}
.ml-6{margin-left:60px;}
.ml-7{margin-left:70px;}
.ml-8{margin-left:80px;}

.pt-0{padding-top:0px;}
.pt-1{padding-top:10px;}
.pt-2{padding-top:20px;}
.pt-3{padding-top:30px;}
.pt-4{padding-top:40px;}
.pt-5{padding-top:50px;}
.pt-6{padding-top:60px;}
.pt-7{padding-top:70px;}
.pt-8{padding-top:80px;}

.pb-0{padding-bottom:0px;}
.pb-1{padding-bottom:10px;}
.pb-2{padding-bottom:20px;}
.pb-3{padding-bottom:30px;}
.pb-4{padding-bottom:40px;}
.pb-5{padding-bottom:50px;}
.pb-6{padding-bottom:60px;}
.pb-7{padding-bottom:70px;}
.pb-8{padding-bottom:80px;}

.pr-0{padding-right:0px;}
.pr-1{padding-right:10px;}
.pr-2{padding-right:20px;}
.pr-3{padding-right:30px;}
.pr-4{padding-right:40px;}
.pr-5{padding-right:50px;}
.pr-6{padding-right:60px;}
.pr-7{padding-right:70px;}
.pr-8{padding-right:80px;}

.pl-0{padding-left:0px;}
.pl-1{padding-left:10px;}
.pl-2{padding-left:20px;}
.pl-3{padding-left:30px;}
.pl-4{padding-left:40px;}
.pl-5{padding-left:50px;}
.pl-6{padding-left:60px;}
.pl-7{padding-left:70px;}
.pl-8{padding-left:80px;}
.flex-box {
    display: flex;
}
.between_space{justify-content: space-between;}
.orange_color{color:#ee6123;}
.alert-success {color: #155724; background-color: #d4edda; border-color: #c3e6cb; position: relative; padding: .75rem 1.25rem; margin-bottom: 1rem; border: 1px solid transparent; border-radius: .25rem; text-align: center;}
.alert-error{color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; position: relative; padding: .75rem 1.25rem; margin-bottom: 1rem; border: 1px solid transparent; border-radius: .25rem; text-align:center;}
	
/*Top Bar*/
.top_bar{background-color:#cedafa; padding:10px 0px;}
.top_bar p {margin: 0px; text-align: center; font-family: 'Roboto-Medium'; font-size: 18px; line-height: 28px;}

/*Header Part*/
header{background-color:#031f39; padding:15px 0px;}
.logo-box h1 {font-family: "Style Script", cursive;color: #ee6123; font-weight: 900; font-size: 40px; line-height: 40px; letter-spacing: 1px; padding-top: 5px;}
.navigation_bar {align-items: center; display: flex;}
.navigation_bar ul {display: inline-block;}
.navigation_bar ul li {display: inline-block;color: #fff; font-family: 'Roboto-Medium'; font-size: 16px; padding: 0px 10px;text-transform: capitalize;}
.dashboard_link_box {align-items: center;display: flex;}
.dashboard_link_box ul {display: inline-block;}
.dashboard_link_box ul li {display: inline-block;color: #fff;font-family: 'Roboto-Medium';font-size: 16px;padding: 0px 10px;text-transform: capitalize;}
.navigation_bar a, .dashboard_link_box a {color: #fff;}
.navigation_bar a:hover, .dashboard_link_box a:hover {color: #ee6123;}
a.btn {background-color: #fff; padding: 10px; color: #031f39; border-radius: 5px;}
a.btn:hover {background-color: #ee6123; padding: 10px; color: #fff; border-radius: 5px; text-decoration:none;}

/*Banner Area*/
section.banner_area {background-color: #031f39; padding: 90px 0px; color: #fff;}
.banner_area h2 {font-size: 45px; text-align: center; margin-bottom: 0px; font-family: 'Roboto-Black';}
.banner_area p {font-size: 18px; line-height: 28px; text-align: center; max-width: 900px; margin: 25px auto 35px;}
.button_box .flex-box {justify-content: center; gap: 20px;}
.button_box a {border: 2px solid #fff; color: #fff; padding: 15px 35px; font-family: 'Roboto-Medium'; text-transform: uppercase; border-radius: 10px;}
.button_box a:hover {background-color:#ee6123;border: 2px solid #ee6123; text-decoration:none;}

/*Banner Area Inner*/
section.banner_area_inner {background-color: #031f39; padding: 40px 0px; color: #fff;}
.banner_area_inner h2 {font-size: 45px; text-align: center; margin-bottom: 0px; font-family: 'Roboto-Black';}

/*After Banner Section*/
section.links_genrated {background-color: #f7f5f1; padding: 50px 0px;}
.links_genrated .stat-box{width:25%; text-align:left; display: flex; gap: 15px;}
.stat-box p {margin-bottom: 0px;}
.links_genrated .stat-box .icon {font-size: 50px; color:#031f39; line-height: 60px;}
.icon_side h3 {font-size: 35px; line-height: 40px; font-family: 'Roboto-Bold';}

/*Integration Section*/
.integration-image {width: 50%;}
.integration-text {width: 50%;}
.integration-image img{max-width:100%;}
.box_gap{gap:20px;}
.details_part {padding: 80px 0px;}
.integration-text h2 {font-size: 40px; line-height: 45px; font-family: 'Roboto-Black'; color: #031f39; margin-bottom: 25px;}
.integration-text p {font-size: 19px; line-height: 29px; margin-bottom:35px;}
a.integration-btn {border: 2px solid #ee6123; color: #ee6123; padding: 15px 35px; font-family: 'Roboto-Medium';text-transform: uppercase;display: inline-block;    border-radius: 10px;}
a.integration-btn:hover {border: 2px solid #ee6123; color: #fff; background-color:#ee6123; text-decoration:none;}

/*Personalize Short Links*/
.cta_section {background-color: #f7f5f1; padding: 90px 0px; text-align: center; background-image: url(../images/vector_bg02.svg);}
.cta_section h2 {font-size: 55px; max-width: 600px; line-height: 65px; margin: 0px auto 30px; text-transform: capitalize;}
span.lines {background-image: url(../images/lines.svg);background-repeat: no-repeat; background-position: bottom;}
.cta_section p {font-size: 25px; line-height: 30px; margin: 0px auto 30px;}
.cta_button_box .flex-box {justify-content: center;}
.cta_button_box .flex-box a {background-color: #333; color: #fff; padding: 15px 35px; text-transform: uppercase; border-radius:10px;}
.cta_button_box .flex-box a:hover{background-color:#ee6123; text-decoration:none;}

/*Four Boxes*/
.four-boxes {padding: 60px 0px;}
.section-header {text-align: center; margin-bottom: 40px;}
.section-header h4 {color: #ee6123; font-size: 14px; margin-bottom: 0px; letter-spacing: 1px;}
.section-header h2 {font-size: 32px; font-weight: bold; color: #222;}
.services-grid {display: grid; grid-template-columns: 1fr 1fr; gap: 30px;}
.service-box {background-color: #fff; border: 1px solid #eee; border-radius: 8px; padding: 30px 25px; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05); transition: transform 0.3s ease;display: flex; gap: 15px;}
.service-box:hover {transform: translateY(-5px);}
.service_icon_set i {font-size: 45px; line-height: 50px; margin-bottom: 0px; color: #ee6123;}
.service-box h3 {font-size: 25px; margin-bottom: 5px; color: #333; font-family: 'Roboto-Bold';}
.service-box p {font-size: 16px; line-height: 1.5; color: #666; margin: 0px;}

/*Footer*/
footer {background-color: #2C2C2C; color: #fff; padding: 60px 0px;}
footer h1{font-family: "Style Script", cursive; color: #ee6123; font-weight: 900; font-size: 40px; line-height: 40px; letter-spacing: 1px; padding-top: 5px; margin-bottom:15px;}
.my-flex-box {display: flex;gap:25px;}
.footer_common_box:first-child {width: 40%;}
.footer_common_box {width: 20%;}
.footer_common_box ul li {list-style: none;line-height: 40px; font-size: 14px;}
.footer_common_box ul li a{font-size: 14px;color:#fff;}
.footer_common_box ul li a:hover{font-size: 14px;color: #ee6123;}
.footer_common_box h3 {font-size: 18px;text-transform: uppercase; margin-bottom:10px;}

/*Copyrite footer*/
.footer_bottom {background-color: #222222; color: #fff; text-align: center; padding:20px 0px;}
.footer_bottom p {margin-bottom: 0px; line-height: 24px; font-size: 14px;}

/*Login Page*/
.login_register_flex_box {display: flex; gap: 2rem; justify-content: center;}
.login_box {width: 50%; padding: 25px; border: 1px solid #e3e3e3; border-radius: 8px; background-color: #f7f7f7;}
.register_box {width: 50%; padding: 25px;}
.social-login {margin-top: 35px;}
.social-btn {display: inline-block; margin: 5px 10px 0 0; padding: 8px 12px; border-radius: 4px; text-decoration: none; color: #fff; font-size: 14px;}
.social-btn:hover{color:#fff; text-decoration:none;}
.fb { background-color: #3b5998;}
.google { background-color: #db4437; }
.twitter { background-color: #1da1f2; }
.social-btn i {margin-right: 6px;}
.inner_block {padding: 60px 0px;}
.login_box h2, .register_box h2 {font-family: 'Roboto-Black'; position: relative; margin-bottom: 25px;}
.login_box h2:after, .register_box h2:after {content: ''; width: 20px; height: 3px; background-color: #ee6123; display: block; position: absolute; bottom: -10px;}
.login_box .form-group label {display: block; font-size: 14px; font-weight: bold; color: #000; margin-bottom: 0px;}
.login_box .form-group input[type="email"], .login_box .form-group input[type="password"] {width: 100%; padding: 10px; box-sizing: border-box; background-color: #fff; border: 1px solid #ccc; margin-bottom: 20px;}
.login_box button {background-color: #000; color: #fff; border: 0px; padding: 15px 30px; max-width: 200px; width: 100%; text-transform: uppercase; font-weight: bold; display: inline-block; cursor:pointer;border-radius:5px;box-sizing:border-box;}
.login_box button:hover{background-color: #ee6123;}
.social-login p {margin-bottom: 5px;font-weight: bold; font-family: 'Roboto-Black';}
.register_box a.btn {background-color: #000; color: #fff; border: 0px; padding: 15px 30px; max-width: 200px; width: 100%; text-transform: uppercase; font-weight: bold; display: inline-block; text-align:center; cursor:pointer; border-radius:5px;box-sizing:border-box;}
.register_box a.btn:hover {background-color: #ee6123;}

/*Register Page*/
.register_form {max-width: 700px; width:100%; margin: 0 auto;}
.form-row {display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: 20px;}
.form-group {flex: 1; display: flex; flex-direction: column;}
.form-group label {display: block; font-size: 14px; font-weight: bold; color: #000; margin-bottom: 0px;}
.form-group input {width: 100%; padding: 10px; box-sizing: border-box; background-color: #fff; border: 1px solid #ccc; margin-bottom: 20px;}
.submit-btn {background-color: #000; color: #fff; border: 0px; padding: 15px 30px; max-width: 200px; width: 100%; text-transform: uppercase; font-weight: bold; display: inline-block; cursor:pointer;border-radius:5px;box-sizing:border-box;}
.submit-btn:hover{background-color: #ee6123;}

/*Verify OTP*/
.verify_otp_box {max-width: 380px; margin: auto; width: 100%;}

/*Dashboard Styles*/
.dashboard_flex_box {display: flex;gap: 20px;}
.left_block {width: 200px;}
.right_block {width: calc(100% - 200px);}
ul.left_menu {list-style: none;}
ul.left_menu li a {
    width: 100%;
    background-color: #f3f3f3;
    padding: 10px;
    font-size: 16px;
    display: block;
    text-decoration: none;
    margin-bottom: 1px;
    box-sizing: border-box;
}
ul.left_menu li a:hover {background-color: #ee6123; color:#fff;}