@import url(assets/css/global.css);
@import url(assets/css/animations.css);
* { padding: 0; margin: 0; outline: none !important; font-family: var(--ff_body); }
body { font-weight: 400; font-size: var(--fs_body); color: var(--color_black); }
a { text-decoration: none; font-family: var(--ff_heading); }
img { max-width: 100%; }
ul, p { margin: 0; padding: 0; }
h2 { font-size: var(--fs_title); font-weight: 500; }
h1, h2, h3, h4, h5, h6 { font-family: var(--ff_heading); font-weight: 400; }
.sec { padding: 50px 0; overflow: hidden; position: relative; }
.sec_head { font-weight: 700; }
.sec_title h2 { font-size: 30px; color: var(--color_secondary); }
.sec_title h5 { position: relative; color: var(--color_black); display: inline-block; padding: 0 40px; }
.sec_title h5:before, .sec_title h5:after { content: ""; position: absolute; width: 20px; height: 30px; background: url(assets/images/sec_head_arrow.png) no-repeat center; background-size: contain; top: -2px; }
.sec_title h5:before { left: 0; animation: title_animate 1.5s infinite alternate; }
.sec_title h5:after { right: 0; animation: title_animate_r 1.5s infinite alternate }
.main_btn { background: var(--color_gradient); color: var(--color_white); border: none; padding: 8px 18px; display: inline-block; font-size: var(--fs_body); }
.main_btn:hover { background: var(--color_main); color: var(--color_white); }
.main_btn_outline { padding: 8px 30px; font-size: var(--fs_body); color: var(--color_main); border: 1px solid var(--color_main); }
.main_btn_outline:hover { background: var(--color_secondary); color: var(--color_white); border: 1px solid var(--color_white); }

/*header*/
header { width: 100%; position: absolute; z-index: 2; padding: 20px 0 0; transition: cubic-bezier(0.65, 0.05, 0.36, 1) .1s; }
header .row { align-items: center; }
.head_mid a.nav-link { color: var(--color_white); padding: 0 18px !important; font-family: var(--ff_heading); }
.head_right { text-align: right; }
.head_right ul li { display: inline-block; }
.head_right ul li a { padding: 0px 10px; color: var(--color_white); }
.head_right ul li:last-child { margin-left: 20px; }
.dropdown-menu { width: 200px; padding: 0; }
.dropdown-menu li a { padding: 5px 15px; display: block; border-bottom: 1px solid var(--color_secondary); background: var(--color_main); color: var(--color_white); font-size: 14px; text-transform: capitalize; }
.dropdown-menu li a:hover { background: var(--color_secondary); color: var(--color_white); }

/*banner*/
#particles-js { width: 100%; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; }
.h_banner { width: 100%; background: url(assets/images/ban_bg.png) no-repeat center; background-size: cover; color: var(--color_white); padding: 200px 0 80px; position: relative; }
.ban_left h1 { font-size: 42px; font-weight: 700; }
.ban_left h5 { margin: 20px 0; }
.ban_left a { color: var(--color_white); text-transform: uppercase; font-weight: 500; margin: 30px 0 30px; display: inline-block; }
.ban_left a span { margin-left: 20px; font-size: 17px; }
.h_banner:before, .h_banner:after { content: ""; top: 0; bottom: 0; position: absolute; background-size: contain; }
.h_banner:before { right: 360px; width: 621px; background: url(assets/images/ban_img2.png) no-repeat center; background-size: contain; z-index: 1; }
.h_banner:after { left: 0; right: 0; background: url(assets/images/ban_img3.png) no-repeat center right; }
.ban_bg { position: absolute; left: 0; right: 0; bottom: 0; top: 0; background: linear-gradient(45deg, #2dc1d5d9, #005e98c4); background-size: cover; z-index: 1; }
.ban_left { position: relative; z-index: 1; }
.ban_arrow a { position: relative; z-index: 2; color: var(--color_white); text-align: center; display: inline-block; }
.ban_arrow a span { display: block; margin: 10px 0 0; }
.ban_arrow { text-align: center; position: relative; top: 50px; }
.ban_arrow img { animation: down_arrow 1.5s infinite; }
.ban_right { position: relative; z-index: 1; }
.ban_right img { animation: up_down linear 2s infinite alternate; }
.innr_banner:before, .innr_banner:after { display: none; }

/*section 1*/
.h_sec1:before { content: ""; width: 202px; height: 72px; background: url(assets/images/s1_img1.png) no-repeat center; background-size: contain; position: absolute; top: 0; left: 0; }
.s1_box { position: relative; padding: 7px 0 0 40px; }
.s1_box img { position: absolute; left: 0; top: 0; }
.s1_box p { color: var(--color_black); }
.innr_s1_top h2 { color: var(--color_secondary); font-size: 30px; text-transform: uppercase; margin: 20px 0; }

/*section 2*/
.s2_top h2 { color: var(--color_secondary); }
.s2_bot .nav-link img { margin-right: 10px; }
.s2_bot ul li { display: block; width: 100%; }
.s2_bot ul li  .nav-link { background: var(--color_accent); margin: 5px 0 0; display: block; width: 100%; text-align: left; color: var(--color_black); }
.s2_bot ul li .nav-link.active { background: var(--color_gradient); }
.s2_tab_box h4 { color: var(--color_secondary); font-size: var(--fs_sub_title); margin: 15px 0; }
.s2_tab_box_list { color: var(--color_black); line-height: 32px; font-weight: 500; }
.s2_tab_box h5 { font-weight: 400; color: var(--color_black); }
.s2_tab_box p { margin: 20px 0; }
.h_sec2 { position: relative; }
.s2_top h5 { color: var(--color_black); font-size: 20px; display: inline-block; padding: 0 40px; }
.h_sec2:before, .h_sec2:after { content: ""; position: absolute; }
.h_sec2:before { animation: circle_shape 2.5s infinite alternate; width: 100px; height: 100px; background: var(--color_secondary); border-radius: 100px; top: 100px; left: 30px; }
.h_sec2:after { animation: up_down_move 2.5s infinite alternate; right: -50px; top: -90px; width: 250px; bottom: 0; background: url(assets/images/s2_img2.png) no-repeat right center; background-size: contain; }
.s2_tab_btns { margin: 20px 0 0; }
.s2_tab_btns a:first-child { margin-right: 10px; }
.s2_bot ul li .nav-link.active img { filter: invert(1); }
.s2_tab_box img { animation: up_down linear 2s infinite alternate; }

/*section 3*/
.h_sec3:before, .h_sec3:after { content: ""; position: absolute; }
.h_sec3:before { animation: rotate 5.5s infinite alternate; width: 150px; height: 350px; background: url(assets/images/s3_img2.png) no-repeat center; background-size: contain; border-radius: 100px; right: 0; bottom: -60px; }
.h_sec3:after { left: -50px; top: -90px; width: 250px; bottom: 0; transform: rotate(180deg); background: url(assets/images/s2_img3.png) no-repeat right center; background-size: contain; z-index: -1; }
.s3_left h2 { color: var(--color_secondary); font-size: 30px; margin: 20px 0; }

/*section 4*/
.h_sec4:before, .h_sec4:after { content: ""; position: absolute; }
.h_sec4:before { left: -50px; top: -90px; transform: rotate(180deg); width: 250px; bottom: 0; background: url(assets/images/s2_img3.png) no-repeat right center; background-size: contain; }
.h_sec4:after { right: -50px; top: -90px; width: 250px; bottom: 0; background: url(assets/images/s2_img3.png) no-repeat right center; background-size: contain; }
.s4_top h2 { color: var(--color_main); }

/*section 5*/
.h_sec5:before { animation: rotate 5.5s infinite alternate; z-index: -1; content: ""; position: absolute; width: 150px; height: 350px; background: url(assets/images/s3_img2.png) no-repeat center; background-size: contain; border-radius: 100px; transform: rotate(180deg); left: 0; bottom: -40px; }
.s5_left h2 { color: var(--color_secondary); font-weight: 400; margin: 10px 0 0; }
.s5_left h2 span { font-weight: 500; color: var(--color_main); }
.s5_rbox h4 { font-size: var(--fs_title); font-weight: 500; color: var(--color_main); }
.s5_rbox  p { font-size: 20px; color: var(--color_secondary); }
.s5_rbox { position: relative; text-align: center; }
.s5_rbox:before { content: ""; position: absolute; width: 380px; height: 175px; bottom: 0; top: -45px; left: -22px; background-size: contain; border-radius: 150px; }
.s5:nth-child(1) .s5_rbox:before { background: url(assets/images/s5_img1.png) no-repeat center; background-size: contain; }
.s5:nth-child(2) .s5_rbox:before { background: url(assets/images/s5_img1.png) no-repeat center; background-size: contain; transform: rotateX(180deg) rotateY(180deg); }
.s5:nth-child(3) .s5_rbox:before { display: none; }

/*section 6*/
.s6_box { text-align: center; padding: 30px; margin: 0 1px; background: var(--color_gradient); border: 1px solid var(--color_secondary); }
.s6_box img { width: 60px !important; margin: 0 auto 10px auto; filter: invert(1); }
.s6_box p { font-size: 18px; color: var(--color_white); font-weight: 400; }
.s6_box:hover { background: var(--color_white); border-color: var(--color_main); }
.s6_box:hover p { color: var(--color_black); }
.s6_box:hover img { filter: none; }

/*section 7*/
.h_sec7:before, .h_sec7:after { content: ""; position: absolute; }
.h_sec7:before { left: -50px; top: -90px; transform: rotate(180deg); width: 250px; bottom: 0; background: url(assets/images/s2_img3.png) no-repeat right center; background-size: contain; }
.h_sec7:after { animation: up_down_move 2.5s infinite alternate; right: -50px; top: -90px; width: 250px; bottom: 0; background: url(assets/images/s2_img3.png) no-repeat right center; background-size: contain; }
.s7_top h2 { color: var(--color_main); }
.s7_box { background: #E6F1F5; border-radius: 20px; padding: 0 0 20px; z-index: 1; position: relative; }
.s7_box_head { background: var(--color_gradient); padding: 20px 30px 35px; color: var(--color_white); border-radius: 20px; }
.s7_box_head h4 { margin: 0; font-size: 20px; }
.s7_box_head { }
.s7_box_body { background: #fff; border-radius: 20px; margin: -20px 0 0 20px; padding: 20px; }
.s7_box_body span.offer { display: inline-block; padding: 10px 20px; background: var(--color_gradient); position: relative; z-index: 1; left: -20px; color: var(--color_white); font-weight: 600; border-radius: 0  20px 20px 0; }
.s7_box_body ul { padding: 0; list-style: none; height: 200px; overflow-x: hidden; margin: 10px 0 20px; display: block; }
.s7_box_body ul li { font-size: 15px; margin: 3px 0; padding: 0 0 0 20px; position: relative; }
.s7_box_body ul::-webkit-scrollbar { width: 3px; }
.s7_box_body ul::-webkit-scrollbar-track { background: #f1f1f1; }
.s7_box_body ul::-webkit-scrollbar-thumb { background: #888; border-radius: 10px; }
.s7_box_body ul li:before { content: "\f00c"; position: absolute; font-family: fontawesome; left: 0; color: var(--color_main); }
.s7_box_cta .s7_box_link span { font-size: 13px; display: block; margin: 0 0 -3px; }
.s7_box_cta .s7_box_link { color: var(--color_black); font-size: 16px; font-weight: 500; }
.s7_box_cta .main_btn { border-radius: 30px; font-size: 14px; padding: 10px 15px; }
.s7_box_cta { border-top: 1px solid var(--color_main); padding: 20px 0 0; }

/*section 8*/
.h_sec8:before { content: ""; position: absolute; }
.h_sec8:before { width: 150px; height: 350px; background: url(assets/images/s3_img2.png) no-repeat center; background-size: contain; border-radius: 100px; right: 0; bottom: -60px; }
.s8_box_img { animation: full_rotate 1.5s infinite alternate; display: inline-block; position: absolute; left: 0; top: 0; overflow: hidden; border-radius: 100px; background: var(--color_gradient); padding: 15px; }
.s8_box { padding: 30px 20px 30px 170px; position: relative; box-shadow: 5px 5px 10px 0 #00000030; border-radius: 100px; margin: 0 20px 20px; background: var(--color_white); }
.s8_box_img img { width: 120px; animation: full_rotate_reverse 1.5s infinite alternate; }
.s8_top h2 { color: var(--color_secondary); }
.s8_box_text h3 { color: var(--color_main); font-size: 22px; }
.s8_box_text h3 span { font-size: 14px; display: block; color: var(--color_black); font-weight: 400; }

/*section 9*/
.h_sec9 { background: url(assets/images/s9_bg.png) no-repeat center; background-size: cover; }
.h_sec9 .row { align-items: center; }
.s9_left h3, .s9_left p { color: #fff; }
.s9_right img { animation: up_down linear 2s infinite alternate; }
.s9_form .form-control { border: none; color: var(--color_main); font-size: 18px; }
.s9_form button { padding: 10px 40px; font-weight: 500; font-size: 18px; color: var(--color_main); }

/*section 10*/
.s10_box { text-align: center; }
.s10_box img { height: 50px; margin: auto; width: auto !important; }

/*footer*/
footer { position: relative; }
.ftr_top { background: var(--color_black) url(assets/images/ftr_bg.png) no-repeat center; background-size: cover; padding: 50px 0; color: #fff; }
.ftr_shape { width: 500px; overflow: hidden; position: absolute; right: 0; bottom: 0; z-index: -1; }
.ftr_box img { height: 60px; margin: 0 0 20px; }
.ftr_box h5 { font-size: 18px; margin: 0 0 20px; font-weight: 500; }
.ftr_box ul { list-style: none; margin: 0; padding: 0; }
.ftr_box ul li a { color: var(--color_white); text-transform: capitalize; font-size: 14px; }
.ftr_box ul li { line-height: 30px; }
.ftr_box p { color: var(--color_white); font-size: 14px; }
.ftr_form input.form-control { padding: 10px; border-radius: 0; }
.ftr_form button#button-addon2 { padding: 0 20px; border-radius: 0; border: none; background: linear-gradient(0, #0086aa, #005995); color: #fff; font-size: 20px; }
.ftr_bot { background: var(--color_gradient); padding: 10px 0 10px; color: var(--color_white); }
.ftr_bright ul { list-style: none; margin: 0; padding: 0; }
.ftr_bright ul li { display: inline-block; }
.ftr_bright ul li a { font-size: 14px; margin: 0 5px; color: var(--color_white); }
.ftr_bot .row { display: flex; align-items: center; }

/*modal start*/
.modal-body { padding: 40px; background: linear-gradient(to left, var(--color_secondary) 50%, var(--color_white) 50%); position: relative; }
.modal-body:before { content: ""; position: absolute; right: 0; width: 240px; transform: rotate(180deg); top: 0; bottom: 0; background: url(assets/images/ban_img2.png) no-repeat center; background-size: contain; z-index: 0; filter: opacity(0.5); }
.lf_left { padding-right: 20px; z-index: 1; position: relative; }
.lf_right { position: relative; padding-left: 30px; }
.lf_right h3 { margin: 20px 0 20px; color: var(--color_white); font-size: 24px; }
.lf_right .form-control { border: none; border-radius: 5px; padding: 8px 15px; }
.lf_right button.btn { width: 100%; display: block; background: var(--color_main); color: var(--color_white); padding: 10px; border: none; font-size: 16px; font-family: var(--ff_heading); }
.lf_right button.btn-close { position: absolute; right: -25px; top: -45px; }

/*modal end*/

/*inner pages*/
.inner_banner { text-align: center; padding: 100px 0 30px; background: var(--color_gradient); color: var(--color_white); }
.inner_banner h1 { margin: 0 0 10px; font-weight: 500; }
.inner_banner p { font-size: 18px; }
.innr_sec4 { background: var(--color_gradient); }
.innr_s4_left h2 { font-size: 24px; }
.innr_s4_left { color: var(--color_white); }
.innr_sec4 .row { align-items: center; }
.innr_sec4 a.main_btn { background: var(--color_white); color: var(--color_black); padding: 15px 30px; }

/*section 5*/
.innr_s5_box { padding: 0 0 150px; position: relative; transition: .3s; }
.innr_s5_box span { font-size: 80px; position: relative; color: var(--color_secondary); display: block; margin: 0 auto; text-align: center; }
.innr_s5_box h3, .innr_s5_box p { display: none; }
.innr_s5_box:hover { position: relative; padding: 0 0 180px; }
.innr_s5_top:hover h2 { color: var(--color_secondary); }
.innr_s5_box:hover span { font-size: 35px; position: absolute; right: 2px; top: 2px; width: 60px; height: 60px; border-radius: 100px; display: flex; justify-content: center; align-items: center; background: var(--color_white); }
.innr_s5_box:hover h3 { background: var(--color_secondary); font-size: 18px; color: var(--color_white); padding: 10px 80px 10px 20px; border-radius: 0 50px 50px 0; display: block; }
.innr_s5_box:hover p { font-size: 14px; padding: 10px 50px 0; display: block; }
.innr_s5_box:before { position: absolute; left: 0; top: 0; bottom: 0; right: 0; background: url(assets/images/innr_s5_img1.png)no-repeat center; background-size: contain; content: ""; z-index: -1; }
.innr_s5:nth-child(even) .innr_s5_box:before { background: url(assets/images/innr_s5_img2.png)no-repeat center; background-size: contain; }
.innr_s5:nth-child(even) h3 { background: var(--color_main); }
.innr_s5:nth-child(even) span { color: var(--color_main); }
.innr_s5_box p { color: var(--color_black); }

/*section 6*/
.innr_s6_box { padding: 20px; background: var(--color_accent); border-radius: 10px; position: relative; }
.innr_s6_box h4 { padding: 10px  0 0; font-size: 16px; color: var(--color_main); font-weight: 600; }
.innr_s6_box p { color: var(--color_black); font-size: 15px; }

/*section 7*/
.innr_s7_right { color: var(--color_main); }
.innr_sec7 { background: #E6F1F5; margin-top: 50px; }
.innr_sec7 .row { align-items: center; }
.innr_s7_left { margin: -50px 0 -50px; position: relative; z-index: 1; }

/*section 8*/
.innr_s8_box ul { text-align: left; margin: 20px 0 20px 20px; font-size: 16px; color: var(--color_black); }
.innr_s8_box ul li { margin: 4px 0 0; }
.s8_bot .owl-carousel .owl-item img { border: 1px solid #1b9cc1; border-radius: 100px; }

/*erp page*/
.innr_erp_sec3 { background: url(assets/images/erp_s3_img1.png) no-repeat center; background-size: cover; }
.innr_erp_sec3 h2 { font-size: 30px; }

/*pos page*/
.innr_pos_sec4 .row { align-items: center; }
.pos_s4_right p { font-size: 20px; color: var(--color_secondary); }
.innr_pos_sec6 .row { align-items: center; }
.innr_pos_sec6 .container { background: var(--color_main); }
.pos_s6_left { color: var(--color_white); }
.pos_s6_left p { color: var(--color_white); }
.pos_s6_left h5 { color: var(--color_white); }
.pos_s6_left .sec_title h5:before, .pos_s6_left .sec_title h5:after { filter: sepia(1); }
.pos_s6_right img { width: 100%; }
.pos_s6 { padding: 0; }

/*seo page*/
.innr_seo_s1_box { background: var(--color_white); border: 2px solid var(--color_main); border-radius: 0; transition: .3s; }
.innr_seo_s1_box:hover { background: linear-gradient(to bottom, #2DC1D5, #005E98); border-color: var(--color_white); }
.innr_seo_s1_box:hover img { filter: invert(1); }
.innr_seo_s1_box:hover h4, .innr_seo_s1_box:hover p { color: var(--color_white); }
.innr_s6_box.innr_seo_s1_box { }
.innr_seo_s1_box:hover .main_btn { background: var(--color_white); color: var(--color_black); }
.innr_seo_sec8 { background: #1daeeb; }
.seo_s8_right h2 { color: var(--color_white); margin: 0 0 20px; }
.seo_s8_right { color: var(--color_white); }

/*seo section 4*/
.innr_seo_sec4 .row { align-items: center; }
.seo_s4_left p { font-size: 20px; color: var(--color_secondary); }
.seo_s4_box { padding: 30px; color: var(--color_main); background: var(--color_accent); border-radius: 10px; transition: .3s; }
.seo_s4_box h3 { font-size: 70px; font-weight: 400; }
.seo_s4_box h3 span { margin-right: 5px; }
.seo_s4_box:hover { background: var(--color_gradient); color: var(--color_white); }

/*section 5*/
.innr_seo_sec5 { background: var(--color_accent); }
.s5_box_img { position: relative; }
.s5_box_img img { height: 150px; }
.s5_box_img h3 { position: relative; text-align: center; font-size: 45px; color: var(--color_main); font-weight: 400; margin: -101px 0 60px; }
.s5-box p { margin: 20px 0 0; color: var(--color_black); font-size: 18px; }
.s5-box { text-align: center; }

/*about page*/
.about_s1_box { background: #E6F1F5; padding: 20px 50px; text-align: center; }
.about_s1_box img { margin: 0 0 10px; }
.about_sec2:before { display: none; }

/*contact page*/
.contact_s1_left ul li a { font-size: 18px; padding: 6px 0; display: inline-block; color: var(--color_black); }
.contact_s1_left ul li { list-style: none; }
.contact_s1_left ul li span { color: var(--color_white); width: 30px; height: 30px; display: inline-block; background: var(--color_secondary); text-align: center; border-radius: 50px; font-size: 16px; padding: 4px 0 0 0; }
.contact_s1_right .form-control { padding: 10px 15px; border: 2px solid var(--color_main); font-size: 17px; margin: 5px 0; }
.contact_s1_right .btn { background: var(--color_gradient); padding: 10px 19px; color: var(--color_white); width: 100%; font-size: 18px; }
.contact_form .mb-3 { margin: 0 !important; }

/*back to top*/
#backtotop { display: inline-block; background: linear-gradient(135deg, #00abbc, #005794); width: 50px; height: 50px; text-align: center; border-radius: 4px; position: fixed; bottom: 30px; right: 30px; transition: background-color .3s, opacity .5s, visibility .5s; opacity: 0; visibility: hidden; z-index: 1000; }
#backtotop::after { content: "\f106"; font-family: FontAwesome; font-weight: normal; font-style: normal; font-size: 2em; line-height: 50px; color: #fff; }
#backtotop:hover { cursor: pointer; background-color: #333; }
#backtotop:active { background-color: #555; }
#backtotop.show { opacity: 1; visibility: visible; }

/*sticky header*/
.sticky { position: fixed; top: 0; z-index: 11; background: var(--color_gradient); padding: 5px 0; }
.sticky .logo img { height: 40px; }
.sticky .head_mid a.nav-link { font-size: 14px; }
.sticky  .head_right ul li a { font-size: 14px; }
.sticky .head_right ul li:last-child a img { height: 14px; }
.sticky .dropdown-menu li a { font-size: 13px; }

/*offset menu*/
.offcanvas-title { color: var(--color_black); text-transform: uppercase; font-size: 18px; font-weight: 600; }
.offcanvas-body ul li span { width: 30px; height: 30px; display: flex; background: var(--color_main); color: var(--color_white); text-align: center; border-radius: 30px; position: absolute; left: 0; top: 0; align-items: center; justify-content: center; }
.offcanvas-body ul li { margin: 10px 0 0; list-style: none; padding: 5px 0 10px 40px; position: relative; color: var(--color_black); }
.offcanvas-header { border-bottom: 1px solid #ededed; }
/*thankyou page*/

.thanks i {font-size: 56px; }

