*{box-sizing:border-box}html,body{overflow:hidden;height:100vh;margin:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;background-color:#0f335f;padding:30px;height:100vh;overflow:auto}@media only screen and (max-width: 480px){#app{padding:0}}[data-carousel=parent]{position:relative;overflow:hidden;cursor:-webkit-grab;cursor:grab}[data-carousel=group]{width:100%;height:100%;position:absolute;transform-style:preserve-3d;transition:transform 1s ease 0s;transform:translateZ(var(--displacement)) rotateY(var(--angle))}[data-carousel=slide]{height:100%;position:absolute;transform:rotateY(var(--angle)) translateZ(var(--displacement))}.carousel__slide{background:lightsteelblue}.carousel__slide .slide__image{height:100%;width:500px;background-size:100%;background-repeat:no-repeat;background-size:cover;float:left}.carousel__slide .details-container{width:calc(100% - 500px);float:left}.carousel__slide .details-container .heading{font-size:25px;color:#1d5095;font-weight:900;margin:10px}.carousel__slide .details-container .action{background:#1d5095;color:#fffc;font-size:16px;font-weight:600;padding:5px 10px;border-radius:3px;border:0;margin:150px 0 0;cursor:pointer;text-transform:uppercase;transition:transform .3s}.carousel__slide .details-container .action:hover{transform:scale(1.01);color:#f5f5f5}.carousel__slide .desc{padding:50px}@media only screen and (max-width: 480px){.carousel__slide .slide__image{width:100%}.carousel__slide .details-container{float:none;position:absolute;bottom:100px;width:100%}.carousel__slide .details-container .action{margin-top:0}.carousel__slide .desc{visibility:hidden;height:0;padding:0}}.nav{position:absolute;bottom:10px;left:50%;transform:translate(-50%);list-style-type:none;z-index:10;padding-left:0}.nav__slide{position:relative;display:inline-block;width:28px;height:28px;border-radius:50%;border:2px solid #fff;margin-left:10px;cursor:pointer}@media screen and (max-width: 480px){.nav__slide{width:16px;height:16px}}@media (hover: hover){.nav__slide:hover:after{transform:translate(-50%,-50%) scale(1);opacity:1}}.nav__slide:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);width:75%;height:75%;border-radius:50%;background-color:#fff;opacity:0;transition:.3s}.nav__slide--1{margin-left:0}.nav-active:after{transform:translate(-50%,-50%) scale(1);opacity:1}.hero-carousel{width:1030px;max-width:100%;height:580px;margin:auto}@media only screen and (max-width: 480px){.hero-carousel{width:100%;height:150vw}}.layout-view{margin:auto}.layout-view .row{text-align:center}.layout-view .col{background-color:#f8f8ff;display:inline-block;width:300px;max-width:calc(100% - 50px);height:150px;margin:20px 30px;position:relative;background-repeat:no-repeat;background-size:contain;overflow:hidden}.layout-view .col:hover .detail-text{color:#0f335f;background-image:linear-gradient(rgba(255,255,255,.1),rgba(255,255,255,.8));transform:scale(1.01) translateY(-5px)}.layout-view .col .detail-text{color:#454545;background-image:linear-gradient(rgba(255,255,255,0),rgba(15,51,95,.7));padding:10px 10px 15px;width:100%;box-sizing:border-box;position:absolute;bottom:-5px;text-transform:capitalize;transition:transform .3s}.layout-view .col a{color:#0f335f;font-weight:600;text-decoration:none;text-transform:uppercase;font-size:12px;position:absolute;right:5px;top:3px;cursor:pointer;transition:transform .3s}.layout-view .col a:hover{transform:translate(2px)}@media only screen and (max-width: 480px){.layout-view .col{margin:5px 0;height:100px;width:100%}}