html,body,#root{margin:0;width:100%;height:100%;font-family:Arial,Helvetica,sans-serif;font-size:10pt;background:#f5f8fa}:focus{outline:none}header{width:100%;height:60px;line-height:60px;background:#fff;position:sticky;top:0;z-index:1000;display:flex;justify-content:space-between}header .logo,footer .f1 .c1 .logo{margin-left:15px;display:flex;align-items:center;font-size:16pt;color:#ed3237;font-weight:700;cursor:pointer}header .logo img,footer .f1 .c1 .logo img{height:24px;margin-right:5px}header ul{list-style:none;margin:0;padding:0;display:flex;font-size:10pt}header ul li{margin:0 15px;cursor:pointer;transition:font-size .5s ease}header ul li:hover{font-size:11pt}header .menu{display:none;font-size:20pt;margin-right:15px}footer{width:100%;height:auto;background:linear-gradient(180deg,#0a2052,#11317a);color:#fff}footer .f1{width:calc(100% - 40px);padding:20px;min-height:200px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:100px}footer .f1 .c1 .logo{color:#fff}footer .f1 .c1 span{font-size:8pt;margin-left:18px}footer .f1 .c1 .address div{margin-top:30px;display:flex;align-items:center}footer .f1 .c1 .address div img{margin:0 5px 0 15px;height:24px}footer .f1 .c1 .address span{margin-left:45px}footer .f1 .c1 .address p{margin:30px 0 0 20px;display:flex;align-items:center}footer .f1 .c1 .address p img{height:20px;margin-left:10px}footer .f1 .c2,.c3{display:flex;flex-direction:column;justify-content:center;align-items:center}footer .f1 .c2 .lh,.c3 .lh{width:100%;margin:0 0 19px;color:#fff;font-size:12pt}footer .f1 .c2 .lt,.c3 .lt{width:100%;padding:0 0 10px;margin-bottom:10px;border-bottom:1px #9f9f9f solid;line-height:16px}footer .f2{width:100%;min-height:40px;font-size:7pt;border-top:1px solid #fff;display:flex;justify-content:space-between}footer .f2 div{margin:15px}.app{width:100%}.app section{scroll-margin-top:70px;width:100%;min-height:450px}.app .appcontent #sec0 .slider{width:100%;height:450px;overflow:hidden}.app .appcontent #sec0 .slider .slides{width:100%;height:100%;display:flex;transition:transform .5s ease-in-out}.app .appcontent #sec0 .slider .slides .slide{width:100%;height:450px;background-size:100% 100%;flex-shrink:0}.app .appcontent #sec0 .slider .slides .slide.s1{background-image:url(../1.jpg)}.app .appcontent #sec0 .slider .slides .slide.s2{background-image:url(../1.jpg)}.app .appcontent #sec0 .slider .slides .slide.s3{background-image:url(../1.jpg)}.app .appcontent #sec0 .slider .slides .slide.s4{background-image:url(../1.jpg)}.app .appcontent #sec0 .slider .dots{position:relative;bottom:30px;display:flex;justify-content:center;align-items:center;gap:8px}.app .appcontent #sec0 .slider .dots .dot{width:10px;height:10px;border-radius:50%;background:#bbb;cursor:pointer;transition:background .3s ease,transform .3s ease}.app .appcontent #sec0 .slider .dots .dot:hover{transform:scale(1.2)}.app .appcontent #sec0 .slider .dots .dot.active{background:#ed3237}.app .appcontent #sec0 .slider .slides .slide .overlay{width:100%;height:100%;color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;background:#000c}.app .appcontent #sec0 .slider .slides .slide .overlay h1,.app .appcontent #sec0 .slider .slides .slide .overlay p{max-width:600px;margin:5px;opacity:0;transform:translate(-50px)}.app .appcontent #sec0 .slider .slides .slide.active .overlay h1{font-size:30pt;animation:slideInLeft .8s ease forwards;animation-delay:.5s}.app .appcontent #sec0 .slider .slides .slide.active .overlay p{font-size:12pt;animation:slideInLeft .8s ease forwards;animation-delay:.7s;text-align:justify}.app .appcontent #sec1{width:100%}.app .appcontent #sec1 .aboutdiv{padding:20px}.app .appcontent #sec1 .about{width:calc(100% - 40px);border-radius:10px;background:#fff;padding:20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;box-shadow:0 0 20px #b9d8f8}app .appcontent #sec1 .about .card{display:flex;flex-direction:column;align-items:center}.app .appcontent #sec1 .about .card h1{margin:0 0 10px;color:#ed3237}.app .appcontent #sec1 .about .card label{font-size:11pt;display:block;text-align:justify;margin-bottom:15px}.app .appcontent #sec1 .about .card .items{margin-top:30px;display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:5px}.app .appcontent #sec1 .about .card .items div{background:#f5f5f5;border-radius:10px;width:120px;padding:5px;text-align:center}.app .appcontent #sec1 .about .card .items div h1{color:#007db2}.app .appcontent #sec1 .about .card img{width:100%;height:100%;border-radius:10px}.app .appcontent #sec1 .infodiv{margin-top:20px;background:linear-gradient(90deg,#00f,purple);color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px}.app .appcontent #sec1 .infodiv h1{font-size:18pt;margin:10px;text-align:center}.app .appcontent #sec1 .infodiv h3{margin:10px;text-align:center;font-weight:400}.app .appcontent #sec2{width:100%}.app .appcontent #sec2 .title,#sec3 .title{margin:30px 0 5px;font-size:16pt;font-weight:700;text-align:center}.app .appcontent #sec2 .services,.app .appcontent #sec3 .tech{padding:20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px}.app .appcontent #sec2 .services .card{background:#fff;border-radius:10px;padding:10px;text-align:justify;box-shadow:0 0 20px #b9d8f8;cursor:pointer;transition:transform .5s ease}.app .appcontent #sec2 .services .card:hover{transform:translateY(-8px)}.app .appcontent #sec2 .services .card h1{margin-top:0}.app .appcontent #sec3{width:100%}.app .appcontent #sec3 span{display:block;padding:20px;font-size:11pt;text-align:center}.app .appcontent #sec3 .tech .card{background:linear-gradient(135deg,#00f,#764ba2);border-radius:10px;color:#fff;padding:10px;display:flex;justify-content:flex-start;align-items:center;cursor:pointer;transition:transform .5s ease}.app .appcontent #sec3 .tech .card:hover{transform:translateY(-8px)}.app .appcontent #sec3 .tech .card img{height:50px;margin-right:10px}.app .appcontent #sec4{width:100%}.app .appcontent #sec4 .contact{margin:20px;background:#fff;border-radius:12px;box-shadow:0 4px 15px #0000001a;display:grid;grid-template-columns:1fr 1fr;overflow:hidden}.app .appcontent #sec4 .contact .contactinfo{background:linear-gradient(180deg,#0a2052,#11317a);color:#fff;padding:40px}.app .appcontent #sec4 .contact .contactinfo h2{font-size:28px;margin-bottom:20px}.app .appcontent #sec4 .contact .contactinfo p{margin:15px 0;line-height:1.6}.app .appcontent #sec4 .contact .contactinfo p strong{display:block;margin-bottom:5px}.app .appcontent #sec4 .contact .contactform{padding:40px}.app .appcontent #sec4 .contact .contactform h2{font-size:28px;margin-bottom:0;color:#004e92}.app .appcontent #sec4 .contact .contactform{display:flex;flex-direction:column;gap:20px}.app .appcontent #sec4 .contact .contactform input,.app .appcontent #sec4 .contact .contactform textarea{height:40px;border:1px solid #ddd;border-radius:5px;font-size:11px;transition:border .3s}.app .appcontent #sec4 .contact .contactform textarea{height:100px}.app .appcontent #sec4 .contact .contactform input:focus,.app .appcontent #sec4 .contact .contactform textarea:focus{border:1px solid #004e92}.app .appcontent #sec4 .contact .contactform .err{border:1px solid red}.app .appcontent #sec4 .contact .contactform button{background:#004e92;color:#fff;height:45px;border:none;border-radius:5px;cursor:pointer;font-size:12px;transition:background .3s ease}.app .appcontent #sec4 .contact .contactform button:hover{background:#036}@media (max-width: 768px){header .menu{display:block}header ul{display:none;position:absolute;top:50px;left:0;background:#fff;width:100%;z-index:999}header ul.active{display:block}header ul li{background:#f2f4f8;padding-left:15px;margin:2px 0 0;transition:none}footer .f1{gap:0}footer .f1 .c2,.c3{padding:20px}.app section{min-height:250px}.app .appcontent #sec0 .slider,.slide,.overlay,.app .appcontent #sec0 .slider .slides .slide .overlay{height:300px}.app .appcontent #sec0 .slider .slides .slide .overlay h1,.app .appcontent #sec0 .slider .slides .slide.active .overlay p{max-width:300px}.app .appcontent #sec0 .slider .slides .slide.active .overlay h1{font-size:25pt}.app .appcontent #sec0 .slider .slides .slide.active .overlay p{font-size:10pt}footer .f2{flex-direction:column;justify-content:center;align-items:center}footer .f2 div{margin:5px}.app .appcontent #sec4 .contact{grid-template-columns:1fr}.app .appcontent #sec4 .contact .contactinfo{text-align:center}}@keyframes slideInLeft{0%{opacity:0;transform:translate(0)}to{opacity:1;transform:translate(50px)}}:root{--dark: #34495E;--light: #ffffff;--success: #0ABF30;--error: #E24D4C;--warning: #E9BD0C;--info: #3498DB}.notifications{position:fixed;top:40px;right:20px;width:300px;z-index:999}.notifications :where(.toast,.column){display:flex;align-items:center}.notifications .toast{margin-top:10px;width:300px;box-shadow:5px 5px 10px #888;position:relative;list-style:none;border:1px solid silver;border-radius:4px;padding:10px;background:var(--light);animation:show_toast .3s ease forwards}@keyframes show_toast{0%{transform:translate(100%)}40%{transform:translate(-5%)}80%{transform:translate(0)}to{transform:translate(-10px)}}.notifications .toast .hide{animation:hide_toast .3s ease forwards}@keyframes hide_toast{0%{transform:translate(-10px)}40%{transform:translate(0)}80%{transform:translate(-5%)}to{transform:translate(calc(100% + 20px))}}.toast:before{position:absolute;content:"";height:3px;width:100%;bottom:0;left:0;animation:progress 5s linear forwards}@keyframes progress{to{width:0%}}.toast.success:before{background:var(--success)}.toast.error:before{background:var(--error)}.toast.warning:before{background:var(--warning)}.toast.info:before{background:var(--info)}.toast .column i{font-size:1.75rem}.toast.success .column i{color:var(--success)}.toast.error .column i{color:var(--error)}.toast.warning .column i{color:var(--warning)}.toast.info .column i{color:var(--info)}.toast .column span{font-size:9pt;margin-left:10px}.toast i:last-child{position:fixed;right:10px;font-size:16pt;color:#aeb0d7;cursor:pointer}.toast i:last-child:hover{color:var(--dark)}
