@import"https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap";*{margin:0;padding:0;box-sizing:border-box}main{margin:auto auto 260px}@keyframes typing{0%{width:0}to{width:100%}}@keyframes blink-caret{0%,to{border-color:transparent}50%{border-color:orange}}@keyframes fadeInUp{0%{opacity:0;transform:translate3d(0,100%,0)}to{opacity:1;transform:translateZ(0)}}@keyframes reverseFadeInUp{0%{opacity:1;transform:translateZ(0)}to{opacity:0;transform:translate3d(0,100%,0)}}@keyframes fadeInLeft{0%{opacity:0;transform:translate3d(-100%,0,0)}to{opacity:1;transform:translateZ(0)}}@keyframes fadeInRight{0%{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}@keyframes zoom{0%{transform:scale(1)}to{transform:scale(1.1)}}@keyframes transition_levitar{0%{transform:translate(50%)}50%{transform:translate(300%,-50px)}to{transform:translate(50%)}}@keyframes transitionY{0%{transform:translate(0)}50%{transform:translateY(15px)}to{transform:translate(0)}}.sticky{position:fixed;top:0;left:50%;transform:translateX(-50%);margin:0;width:1200px;z-index:1000}.sticky .navbar{border-radius:0 0 30px 30px!important}header{width:1200px;margin:auto;position:relative;top:50px;z-index:1000}header .navbar{width:100%;height:80px;border-radius:30px;background-color:transparent;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:10px 10px 20px 5px hsla(0,0%,76%,.3)}header .navbar .container{display:grid;grid-template-columns:32% 65%;grid-gap:3%;gap:3%}header .navbar .container .imageContent{grid-column-start:1;grid-column-end:span 1}header .navbar .container .imageContent img{width:300px;height:auto;object-fit:contain;display:block;margin:5px auto}header .navbar .container .navContent{max-width:800px;grid-column-start:2;grid-column-end:span 3}header .navbar .container .navContent ul{max-width:90%;height:80px;display:flex;justify-content:space-between;margin:auto}header .navbar .container .navContent ul li{list-style:none;margin:auto}header .navbar .container .navContent ul li a{outline:none;text-decoration:none;color:#2b2c2d;font-family:Roboto,sans-serif}header .navbar .container .navContent ul li a:hover{padding:28px 0;color:#0c6eff;border-bottom:solid #0c6eff;transition:height .3s ease}header .navbar .container .nav-mobile{display:none}@media screen and (max-width:500px){header{width:100%!important;margin:auto;position:fixed!important;top:0!important}header .navbar{border-radius:0!important;box-shadow:none}header .navbar .container{display:grid;grid-template-columns:65% 32%;grid-gap:3%;gap:3%}header .navbar .container .imageContent img{height:auto;width:260px;object-fit:contain;display:block;margin:10px auto}header .navbar .container .navContent{display:none!important}header .navbar .container .nav-mobile{transition:width .2s ease!important;position:absolute;z-index:1000;width:0;height:100vh;display:block!important;background:#fff;box-shadow:5px 5px 10px 2.5px hsla(0,0%,76%,.3)}header .navbar .container .nav-mobile .menu-wrapper{width:100%;height:100%}header .navbar .container .nav-mobile .menu-wrapper .menu-contain img{display:none}header .navbar .container .nav-button{display:block;right:6%;background-image:url(https://firebasestorage.googleapis.com/v0/b/albalonweb.appspot.com/o/Identidad%20Grafica%2Fmenu.png?alt=media&token=41c285f2-0099-45d9-a6f0-50a945d9b988);width:35px;height:35px}header .navbar .container .nav-button,header .navbar .container .nav-button-close{position:absolute;margin-top:5%;background-repeat:no-repeat;background-size:contain;z-index:100}header .navbar .container .nav-button-close{display:none;right:4%;width:40px;height:40px;background-image:url(https://firebasestorage.googleapis.com/v0/b/albalonweb.appspot.com/o/Identidad%20Grafica%2Farrow.png?alt=media&token=2378edd3-f605-40b5-9ad3-b20782c406d1)}header .navbar .container ul,header .navbar .open .nav-button{display:none!important}header .navbar .open .nav-button-close{display:block!important}header .navbar .open .nav-mobile{transition:width .2s ease!important;width:85%}header .navbar .open .nav-mobile .menu-wrapper .menu-contain{height:100%}header .navbar .open .nav-mobile .menu-wrapper .menu-contain img{width:260px;object-fit:contain;display:block;margin:10px;height:auto}header .navbar .open .nav-mobile .menu-wrapper .menu-contain ul{display:block!important;margin:50px auto;padding-bottom:30px;border-bottom:.5px solid #0c6eff}header .navbar .open .nav-mobile .menu-wrapper .menu-contain ul li{text-align:left;padding:10px 10%!important;list-style:none;margin:auto}header .navbar .open .nav-mobile .menu-wrapper .menu-contain ul li a{outline:none;text-decoration:none;color:#2b2c2d;font-family:Roboto,sans-serif;font-size:1.5rem}}.home-section{width:100%;min-width:1200px;position:relative;z-index:100;height:auto;min-height:600px}.home-section .gridContainer{max-width:1200px;margin:150px auto 40px;display:grid;grid-template-columns:1fr 1.5fr;grid-gap:3%;gap:3%}.home-section .gridContainer .textSection{padding-left:40px;height:300px;display:block;margin:auto;visibility:visible;animation-name:fadeInUp;animation-duration:.8s;animation-delay:1.5s;animation-fill-mode:both}.home-section .gridContainer .textSection h2{font-family:Roboto,sans-serif;font-size:2.5rem;color:#193a6b;padding-bottom:20px}.home-section .gridContainer .textSection p{color:#000;font-size:1.25rem;font-family:Roboto,sans-serif}.home-section .gridContainer .textSection button{display:block;width:-moz-fit-content;width:fit-content;padding:10px 15px;background-color:#0c6eff;color:#fff;border:none;border-radius:20px;font-size:18px;box-shadow:5px 5px 10px 2.5px hsla(0,0%,76%,.3);margin:30px 0;cursor:pointer}.home-section .gridContainer .textSection button:hover{background-color:#193a6b;animation:zoom 1s infinite}.home-section .gridContainer .imageSection{width:100%;height:auto}.home-section .gridContainer .imageSection .webSite{width:60%;display:block;margin:auto;object-fit:cover;height:auto}.home-section .gridContainer .imageSection #red{position:absolute;width:60px;right:190px;top:70px;height:auto;animation:transitionY 2.7s infinite}.home-section .gridContainer .imageSection #leaves{position:absolute;width:97px;left:60%;bottom:90px;height:auto;visibility:visible;animation-name:fadeInUp;animation-duration:.5s;animation-delay:1s;animation-fill-mode:both}.home-section .gridContainer .imageSection .CloudImageContainer{position:absolute;top:30px;width:100%;height:150px}.home-section .gridContainer .imageSection .CloudImageContainer img{width:60px;height:auto;animation:transition_levitar 20.7s infinite}.home-section .gridContainer .imageSection .developmentIdioms{position:absolute;width:80px;object-fit:cover;top:155px;left:50%}.home-section .gridContainer .imageSection .developmentIdioms img{position:relative;width:100%;height:auto}.home-section .gridContainer .imageSection .developmentIdioms img:hover{width:120%;cursor:pointer}.home-section .gridContainer .imageSection .developmentIdioms #HtmlImage{visibility:visible;animation-name:fadeInLeft;animation-duration:.5s;animation-delay:.7s;animation-fill-mode:both}.home-section .gridContainer .imageSection .developmentIdioms #CssImage{bottom:20px;visibility:visible;animation-name:fadeInLeft;animation-duration:.5s;animation-delay:.9s;animation-fill-mode:both}.home-section .gridContainer .imageSection .developmentIdioms #CImage{bottom:40px;visibility:visible;animation-name:fadeInLeft;animation-duration:.5s;animation-delay:1.1s;animation-fill-mode:both}.home-section .gridContainer .imageSection .developmentIdioms #dev{bottom:60px;width:100px;right:15px;visibility:visible;animation-name:fadeInLeft;animation-duration:.5s;animation-delay:1.2s;animation-fill-mode:both}.home-section .gridContainer .imageSection .developmentIdioms #dev:hover{width:120px}@media screen and (max-width:500px){.home-section{min-width:300px}.home-section .gridContainer{max-width:1200px;margin:150px auto 40px;display:grid;grid-template-columns:1fr;grid-gap:30px;gap:30px}.home-section .gridContainer .textSection{padding:0 20px;grid-row-start:2}.home-section .gridContainer .textSection h2{font-size:2rem}.home-section .gridContainer .textSection p{font-size:1rem}.home-section .gridContainer .imageSection .CloudImageContainer img{width:40px}.home-section .gridContainer .imageSection #red{width:45px;right:80px;top:30px}.home-section .gridContainer .imageSection .developmentIdioms{top:100px;width:45px;left:53px}.home-section .gridContainer .imageSection .developmentIdioms #CssImage{bottom:17px}.home-section .gridContainer .imageSection .developmentIdioms #CImage{bottom:33px}.home-section .gridContainer .imageSection .developmentIdioms #dev{right:10px;bottom:45px;width:60px}.home-section .gridContainer .imageSection #leaves{width:50px;left:149px;bottom:55%}}.servicesSection{width:100%;min-width:1200px;height:auto;margin:30px auto}.servicesSection .headContainer{width:100%;margin:50px auto;padding:0 30px}.servicesSection .headContainer h3{font-size:3.5rem;color:#2b2c2d;text-align:center;margin:20px 0}.servicesSection .headContainer h3 span{color:#0c6eff}.servicesSection .headContainer p{text-align:center;margin-top:70px;font-size:1.25rem}.servicesSection .scroll #product-1{visibility:visible;animation-name:fadeInLeft;animation-duration:.8s;animation-delay:1s;animation-fill-mode:both}.servicesSection .scroll #product-2{visibility:visible;animation-name:fadeInUp;animation-duration:.8s;animation-delay:1s;animation-fill-mode:both}.servicesSection .scroll #product-3{visibility:visible;animation-name:fadeInLeft;animation-duration:1.6s;animation-delay:1.6s;animation-fill-mode:both}.servicesSection .scroll #product-4{visibility:visible;animation-name:fadeInUp;animation-duration:1.6s;animation-delay:1.6s;animation-fill-mode:both}.servicesSection .gridContainer{display:grid;grid-template-columns:1fr 1fr;grid-gap:5%;gap:5%;max-width:1200px;height:auto;margin:auto}.servicesSection .gridContainer #product-1{background-color:#0c6eff}.servicesSection .gridContainer #product-1 h3{font-family:Roboto,sans-serif;font-size:1.75rem;color:#fff!important;padding-bottom:20px}.servicesSection .gridContainer #product-1 p{color:#fff!important;font-size:1.25rem;font-family:Roboto,sans-serif}.servicesSection .gridContainer #product-1 a{display:block;width:-moz-fit-content;width:fit-content;padding:10px 15px;margin:auto;background-color:#fff;color:#0c6eff;border:none;border-radius:20px;font-size:18px}.servicesSection .gridContainer #product-2{margin-top:120px;background-color:#f5f5f5}.servicesSection .gridContainer #product-3{background-color:#f5f5f5}.servicesSection .gridContainer #product-4{margin-top:120px;background-color:#0c6eff}.servicesSection .gridContainer #product-4 h3{font-family:Roboto,sans-serif;font-size:1.75rem;color:#fff!important;padding-bottom:20px}.servicesSection .gridContainer #product-4 p{color:#fff!important;font-size:1.25rem;font-family:Roboto,sans-serif}.servicesSection .gridContainer #product-4 a{display:block;width:-moz-fit-content;width:fit-content;padding:10px 15px;margin:auto;background-color:#fff;color:#0c6eff;border:none;border-radius:20px;font-size:18px}.servicesSection .gridContainer .serviceItem{position:relative;width:100%;height:600px;padding:50px;border-radius:30px;box-shadow:8px 8px 16px 4px hsla(0,0%,76%,.3);visibility:visible;animation-name:reverseFadeInUp;animation-duration:.5s;animation-delay:.5s;animation-fill-mode:both}.servicesSection .gridContainer .serviceItem h3{font-family:Roboto,sans-serif;font-size:1.75rem;color:#193a6b;padding-bottom:20px}.servicesSection .gridContainer .serviceItem p{color:#000;font-size:1.25rem;font-family:Roboto,sans-serif;margin-bottom:45px}.servicesSection .gridContainer .serviceItem img{position:absolute;bottom:0;left:10%;width:80%;height:auto;object-fit:cover}.servicesSection .gridContainer .serviceItem a{display:block;width:-moz-fit-content;width:fit-content;padding:10px 15px;margin:auto;background-color:#0c6eff;color:#fff;border:none;border-radius:20px;font-size:18px;cursor:pointer;text-decoration:none}.servicesSection .gridContainer .serviceItem a:hover{background-color:#193a6b;animation:zoom 1s infinite}@media screen and (max-width:500px){.servicesSection{min-width:300px;margin:auto}.servicesSection .headContainer{width:100%;margin:50px auto;padding:0 30px}.servicesSection .headContainer h3{font-size:2rem}.servicesSection .headContainer h3 span{color:#0c6eff}.servicesSection .headContainer p{margin-top:30px;font-size:1rem}.servicesSection .gridContainer{display:grid;grid-template-columns:1fr;grid-gap:3%;gap:3%;max-width:90%;height:auto}.servicesSection .gridContainer #product-2,.servicesSection .gridContainer #product-4{margin-top:0}}.ContactForm{position:fixed;top:0;left:0;width:100vw;height:100vh;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);z-index:3000;display:flex;align-items:center;justify-content:center}.ContactForm .gridConten{position:relative;top:20px;width:70%;height:auto;max-height:100vh;flex-direction:row;background-color:#fff;border-radius:30px;padding:50px;box-shadow:10px 10px 20px 5px hsla(0,0%,76%,.3);display:grid;grid-template-columns:1fr 1.5fr;grid-gap:4%;gap:4%}.ContactForm .gridConten .infoContactFrom h4{font-family:Roboto,sans-serif;font-size:1.5rem;color:#193a6b}.ContactForm .gridConten .infoContactFrom p{font-size:1rem;color:#2b2c2d;margin:20px 0}.ContactForm .gridConten .infoContactFrom .send-ok{display:block!important}.ContactForm .gridConten .infoContactFrom .send{position:absolute;bottom:110px;width:200px;display:none}.ContactForm .gridConten .infoContactFrom .send p{font-size:1rem;font-weight:600;color:#0c6eff}.ContactForm .gridConten form label{display:grid;margin:10px auto;color:#2b2c2d;font-family:Bebas Neue,sans-serif}.ContactForm .gridConten form input,.ContactForm .gridConten form textarea{margin-top:10px;border:none;border-radius:10px;padding:10px;font-family:Roboto,sans-serif;box-shadow:3px 3px 6px 1.5px hsla(0,0%,76%,.3)}.ContactForm .gridConten form button{background-color:#0c6eff;font-size:18px;margin:30px 0 0}.ContactForm #close-button,.ContactForm .gridConten form button{display:block;width:-moz-fit-content;width:fit-content;padding:10px 15px;color:#fff;border:none;border-radius:20px;box-shadow:5px 5px 10px 2.5px hsla(0,0%,76%,.3);cursor:pointer}.ContactForm #close-button{position:absolute;top:30px;right:30px;margin:auto;background-color:#2b2c2d;font-size:14px}@media screen and (max-width:500px){.gridConten{display:block!important}.gridConten .infoContactFrom span{display:none}.gridConten .infoContactFrom .send-ok{display:block!important;right:25px!important;bottom:25px!important;width:130px!important}.gridConten .infoContactFrom .send-ok p{font-size:15px!important;font-weight:400!important}}footer{width:100%;height:auto;background:#0c6eff}footer .gridContainer{width:100%;height:100%;display:grid;grid-template-rows:repeat(3,1fr);grid-gap:5px;gap:5px}footer .gridContainer .navItem{width:70%;margin:auto;padding:20px}footer .gridContainer .navItem ul{max-width:90%;height:80px;display:flex;justify-content:space-between;margin:auto}footer .gridContainer .navItem ul li{list-style:none;margin:auto}footer .gridContainer .navItem ul li a{outline:none;text-decoration:none;color:#fff;font-family:Roboto,sans-serif}footer .gridContainer .navItem ul li a:hover{padding:28px 0;color:#fff;border-bottom:solid #fff;transition:height .3s ease}footer .gridContainer .mainSection{width:60%;margin:auto;padding:50px 0;border-top:.2px solid #639df3;border-bottom:.2px solid #639df3}footer .gridContainer .mainSection .social{width:80%;margin:auto;display:flex;justify-content:space-around}footer .gridContainer .mainSection .social img{width:40px;height:auto}footer .gridContainer .credits p{padding-top:60px;font-size:1.25rem;text-align:center;color:#fff}@media screen and (max-width:500px){footer .gridContainer{grid-template-rows:300px 150px 150px}footer .gridContainer .navItem{width:90%;padding:20px 50px 0}footer .gridContainer .navItem ul{display:block!important;margin:auto;height:auto!important}footer .gridContainer .navItem ul li{text-align:center;padding:10px 10%!important;list-style:none;margin:auto}footer .gridContainer .navItem ul li a{outline:none;text-decoration:none;color:#fff;font-family:Roboto,sans-serif;font-size:1rem}footer .gridContainer .mainSection{width:90%}footer .gridContainer .mainSection .social{width:80%;margin:auto;display:flex;justify-content:space-around}footer .gridContainer .mainSection .social img{width:30px}footer .gridContainer .credits{width:80%;margin:auto}footer .gridContainer .credits p{padding-top:10px;font-size:.9rem}}