:root{--primary:#002b73;--primary1:#111827;--secondary:#2563eb;--highlight:#f4a300;--background:#fff;--background-secondary:#f9fafb;--text-gray:#3a3a3a;--text-color:#000;--text-lightgray:#9ca3af;--border-color:#ddd;--box-shadow:#b9d8f8;--error:red;--green:#02cd02}html,body{background-color:var(--background-secondary);width:100%;height:100%;color:var(--text-color);margin:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:10pt}:focus{outline:1px solid var(--primary)}.app{width:100%;height:100%}.app .app-content{width:100%}.app .app-content #sec1{background:#ff0;width:100%}.app .app-content section{width:100%;min-height:450px;scroll-margin-top:100px}.app .app-footer{background:var(--primary1);width:calc(100% - 60px);min-height:150px;padding:30px}.app .app-footer .app-footer-content{color:var(--text-lightgray);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:30px;padding:10px;display:grid}.app .app-footer .app-footer-content div{text-align:justify}.app .app-footer .app-footer-content div h2,h3{color:var(--background)}.app .app-footer .app-footer-copyright{color:var(--text-lightgray);border-top:1px solid var(--border-color);text-align:center;padding-top:10px;font-size:8pt}.app .app-content section{width:100%}.app .app-content section .slider{width:100%;height:500px;overflow:hidden}.app .app-content section .slider .slides{width:100%;height:100%;transition:transform .5s ease-in-out;display:flex}.app .app-content section .slider .slides .slide{background-size:cover;flex-shrink:0;width:100%;height:100%}.app .app-content section .slider .slides .slide.s1{background-image:url(/b001.jpg)}.app .app-content section .slider .slides .slide.s2{background-image:url(/b003.jpg)}.app .app-content section .slider .slides .slide.s3{background-image:url(/b001.jpg)}.app .app-content section .slider .slides .slide.s4{background-image:url(/b003.jpg)}.app .app-content section .slider .dots{justify-content:center;align-items:center;gap:8px;display:flex;position:relative;bottom:30px}.app .app-content section .slider .dots .dot{background:var(--text-lightgray);cursor:pointer;border-radius:50%;width:10px;height:10px;transition:background .3s,transform .3s}.app .app-content section .slider .dots .dot:hover{transform:scale(1.2)}.app .app-content section .slider .dots .dot.active{background:var(--secondary)}.app .app-content section .slider .slides .slide .overlay{color:#fff;background:#0009;flex-direction:column;justify-content:center;align-items:flex-start;width:100%;height:100%;display:flex}.app .app-content section .slider .slides .slide .overlay h1,.app .app-content section .slider .slides .slide .overlay p{color:var(--background);opacity:0;max-width:600px;margin:5px;transform:translate(-50px)}.app .app-content section .slider .slides .slide.active .overlay h1{font-size:30pt;animation:.8s .5s forwards slideInLeft}.app .app-content section .slider .slides .slide.active .overlay p{color:var(--text-lightgray);text-align:justify;font-size:12pt;animation:.8s .7s forwards slideInLeft}.app .app-content section .aboutdiv{padding:20px}.app .app-content section .about{width:calc(100% - 40px);box-shadow:0 0 20px var(--box-shadow);background:#fff;border-radius:10px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;padding:20px;display:grid}app .app-content section .about .card{flex-direction:column;align-items:center;display:flex}.app .app-content section .about .card h1{color:var(--primary);margin:0 0 10px}.app .app-content section .about .card h1 span{color:var(--secondary);margin:0 0 10px}.app .app-content section .about .card label{text-align:justify;margin-bottom:15px;font-size:11pt;display:block}.app .app-content section .about .card .items{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:5px;margin-top:30px;display:grid}.app .app-content section .about .card .items div{text-align:center;width:120px;color:var(--primary);background:#f5f5f5;border-radius:10px;padding:5px}.app .app-content section .about .card .items div h1{color:var(--secondary)}.app .app-content section .about .card img{border-radius:10px;width:100%;height:100%}.app .app-content section .infodiv{background:linear-gradient(90deg, var(--secondary), var(--primary));color:var(--background);flex-direction:column;justify-content:center;align-items:center;margin-top:20px;padding:20px;display:flex}.app .app-content section .info .info-content h1,.app .app-content section .infodiv h1{text-align:center;margin:10px;font-size:18pt}.app .app-content section .info .info-content h3,.app .app-content section .infodiv h3{text-align:center;margin:10px;font-weight:400}.app .app-content section .panel{grid-template-columns:700px auto;display:grid}.app .app-content section .panel .panel-left,.app .app-content section .panel .panel-right{padding:50px}.app .app-content section .panel .panel-left{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;display:grid}.app .app-content section .panel .panel-left div{background:var(--background);width:160px;height:160px;box-shadow:0 0 20px var(--box-shadow);flex-direction:column;align-items:center;padding:10px;transition:transform .3s;display:flex}.app .app-content section .panel .panel-left div:hover{transform:translateY(-8px)}.app .app-content section .panel .panel-left div img{width:100px;height:100px}.app .app-content section .panel .panel-left div label{font-weight:600}.app .app-content section .panel .panel-left div span{color:var(--text-gray)}.app .app-content section .panel .panel-right p{color:var(--text-gray);text-align:justify}.app .app-content section .info{background-image:url(/b004.jpg);margin-top:20px}.app .app-content section .info .info-content{color:var(--background);background:#0009;flex-direction:column;justify-content:center;align-items:center;padding:20px;display:flex}@media (width<=768px){.app .app-content section{min-height:250px}.app .app-content section .slider{height:250px}.app .app-content section .slider,.slide,.overlay,.app .app-content section .slider .slides .slide .overlay{height:300px}.app .app-content section .slider .slides .slide .overlay h1,.app .app-content section .slider .slides .slide.active .overlay p{max-width:300px}.app .app-content section .slider .slides .slide.active .overlay h1{font-size:25pt}.app .app-content section .slider .slides .slide.active .overlay p{font-size:10pt}.app .app-content section .panel{flex-direction:column;display:flex}.app .app-content section .panel .panel-left{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));padding:20px;display:grid}.app .app-content section .panel .panel-left div{width:150px;height:150px}}@keyframes slideInLeft{0%{opacity:0;transform:translate(0)}to{opacity:1;transform:translate(50px)}}.header{z-index:1000;background:var(--background);width:100%;height:75px;box-shadow:0 0 5px var(--box-shadow);line-height:75px;position:sticky;top:0}.header .header-content{justify-content:space-between;align-items:center;display:flex}.header .header-content .logo{align-items:center;gap:5px;font-size:18pt;font-weight:700;display:flex}.header .header-content .logo img{cursor:pointer;height:40px;margin-bottom:7px;margin-left:20px}.header .header-content .logo label{color:var(--primary);cursor:pointer}.header .header-content .logo label span{color:var(--secondary)}.header .header-content ul{align-items:center;margin:0;padding:0;font-size:10pt;list-style:none;display:none}.header .header-content ul li{cursor:pointer;margin:0 15px;transition:font-size .5s}.header .header-content button,.header .header-content ul button{border:1px solid var(--secondary);height:30px;color:var(--secondary);background:0 0;border-radius:4px;margin-right:20px}.header .header-content button:hover,.header .header-content ul button:hover{cursor:pointer;opacity:.8}.header .header-content ul li:hover{font-size:11pt}.header .header-content .menu{color:var(--secondary);margin-right:20px;display:none}.header .search{width:400px;position:absolute;top:20px;left:280px}.header .search div{border:1px solid var(--text-lightgray);border-radius:4px;grid-template-columns:auto 70px;width:100%;height:35px;display:grid;overflow:hidden}.header .search div input{border:none;height:100%}.header .search div button{background:var(--secondary);height:100%;color:var(--background);border:none}.header .search div button:hover{opacity:.8;cursor:pointer}@media (width<=768px){.header{height:95px}.header .header-content .logo img{height:30px;margin-left:10px}.header .header-content .logo{font-size:14pt}.header .header-content .menu{align-items:center;display:none}.header .header-content .menu span{margin-bottom:2px;font-size:18pt}.header .header-content button{height:25px;margin-right:10px;display:block}.header .header-content .menu button{border:1px solid var(--secondary);height:25px;color:var(--secondary);background:0 0;border-radius:4px;margin-right:10px}.header .header-content ul{z-index:999;background:#fff;width:100%;display:none;position:absolute;top:50px;left:0}.header .header-content ul.active{display:block}.header .header-content ul li{background:var(--box-shadow);height:40px;margin:2px 0 0;padding-left:15px;line-height:40px;transition:none}.header .header-content ul button{display:none}.header .search{width:95%;top:55px;left:10px}.header .search div{height:30px}}.footer{background:var(--primary1);width:calc(100% - 60px);min-height:150px;padding:30px}.footer .footer-content{color:var(--text-lightgray);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:30px;padding:10px;display:grid}.footer .footer-content div{text-align:justify}.footer .footer-content div h2,h3{color:var(--background)}.footer .footer-copyright{color:var(--text-lightgray);border-top:1px solid var(--border-color);text-align:center;padding-top:10px;font-size:8pt}.courses{width:100%;min-height:400px}.courses .courses-content{color:var(--text-color);flex-direction:column;padding:20px;display:flex}.courses .courses-content h1{color:var(--secondary);margin:0}.courses .courses-content h3{color:var(--text-gray);margin:0 0 30px;font-weight:600}.courses .courses-content .course-list{grid-template-columns:repeat(auto-fit,270px);justify-content:center;gap:30px;display:grid}.courses .courses-content .course-list .course-card{background:var(--background);width:270px;height:400px;box-shadow:0 0 20px var(--box-shadow);border-radius:10px;transition:transform .3s;overflow:hidden}.courses .courses-content .course-list .course-card:hover{box-shadow:0 0 20px var(--text-lightgray);transform:translateY(-8px)}.courses .courses-content .course-list .course-card img{width:100%;height:200px}.courses .courses-content .course-list .course-card .course-info{height:calc(100% - 260px);padding:10px}.courses .courses-content .course-list .course-card .course-info h3{margin:5px 0}.courses .courses-content .course-list .course-card .course-info p{color:var(--text-gray);grid-template-columns:100px auto;display:grid}.courses .courses-content .course-list .course-card .course-enroll{grid-template-columns:auto auto;height:40px;padding:0 10px;display:grid}.courses .courses-content .course-list .course-card .course-enroll h2{margin:0}.courses .courses-content .course-list .course-card .course-enroll button{background:var(--green);width:80px;height:30px;color:var(--background);border:none;border-radius:4px;justify-self:end}.courses .courses-content .course-list .course-card .course-enroll button:hover{cursor:pointer;opacity:.6}