/* profile overlay css is in app_playroom.css */
.guide-wrapper{
    width:1200px;
    height:800px;
    padding:30px 80px;
    background:rgba(0,0,0,.8);
    border:2px solid var(--main-color);
    border-radius:50px;
    position: relative;
}
.color-bold{
    color: var(--main-color);
    font-weight: bold;
}
.close-overlay-wrapper,.close-popup-wrapper{
    position: absolute;
    width:100px;
    height:100px;
    top:0;
    right:0;
    background:var(--main-color);
    border-radius:0 45px 0 45px;
    display:flex;
    align-items: center;
    justify-content: center;
}
.guide-content{
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color:white;
    text-align: center;
    margin:0 30px;
}
.guide-content .guide-title, .carousel-title{
    font-family: 'Poppins Bold';
    font-size:35px;
    color:white;
    text-align: center;
}
#firstShine .guide-title{
    margin-bottom:45px;
}
/* testing for awards desktop */
.guide-content.update .guide-top-logo{
    height: 135px;
    width:auto;
}
.welcome-line{
    width:100%;
    margin:30px 0;
}
#firstShine .guide-content.update .guide-top-logo{
    height: 120px;
}
.guide-content.update .big-bg{
    height: 600px;
    width: 100%;
}
.guide-content.approach2.update .big-bg{
    height: 700px;
}
.guide-content.update .text-margin.single{
    margin-top:12rem;
}
.guide-content.update .text-margin.many-text{
    margin-top:7rem;
}
.guide-content.update .text-margin{
    margin-top:10rem;
    padding:0 30px;
}
.close-overlay-wrapper.update{
    background:var(--main-color);
}
#secondShine .carousel-title{
    margin-bottom:50px;
    margin-top:60px;
}
#thirdShine .carousel-title{
    margin-top:40px;
}
#thirdShine  .guide-img{
    margin-top:35px;
    height:500px;
}
.carousel-text{
    font-size:18px;
    font-family: 'Poppins';
    color:white;
    text-align: center;
}
.carousel-info{
    margin:30px 0;
}
#thirdShine .carousel-info .carousel-text{
    margin-bottom:5px;
}
#thirdShine .carousel-info .carousel-text:last-child{
    margin-bottom:0;
}
.guide-content .guide-gap{
    margin-bottom:25px;
}
.guide-content .guide-text{
    font-size:25px;
    font-family: 'Poppins Light';
    text-align: justify;
}
.guide-content .guide-small{
    font-size: 20px;
    font-family: 'Poppins';
    font-weight: 300;
    text-align: justify;
}
.guide-content .guide-small.disclaimer{
    font-size:18px;
}
.guide-content .protector{
    width:100%;
    display:flex;
    justify-content: center;
    margin:0;
}
.guide-content .owl-title{
    font-size:20px;
    font-family: 'Poppins Bold';
}
.guide-content .guide-img{
    background-size:contain;
    background-repeat: no-repeat;
    background-position: center;
    width:900px;
    height:500px;
}
.awards-img{
    width:100%;
    height:290px;
}
.awards-detail{
    display:flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}
.awards-detail .awards-text{
    font-size: 23px;
    font-family: 'Poppins Bold';
    text-align: left;
}
#fourthShine .awards-margin{
    margin-top:8rem;
    width:100%;
}
.owl-wrapper{
    opacity:0;
    visibility: hidden;
    transition:all 1s ease;
}
.owl-wrapper.active{
    opacity: 1;
    visibility: visible;
}
.owl-wrapper .guide-content .guide-title{
    margin-top:80px;
}
.owl-wrapper .approach2 .text-margin{
    margin-top:70px;
}
.owl-wrapper .owl-nav{
    position: absolute;
    width: 100%;
    top: calc(50%);
    transform: translateY(-50%);
    margin-top:0!important;
}
#thirdShine .owl-wrapper .owl-nav{
    top:50%;
}
.logo-wrapper{
    width: 900px;
    height:550px;
    background:white;
    border-radius:30px;
    font-family: 'Poppins Bold';
}
.logo-wrapper .logo-content{
    max-height:500px;
    overflow-y:auto;
    overflow-x:hidden;
    margin:20px 30px;
    padding-right:30px;
}
.logo-wrapper .logo-title{
    font-size:25px;
    text-align: start;
    padding-bottom:5px;
    text-transform: uppercase;
    font-family: 'Poppins Bold';
    color:black;
    border-bottom:1px solid black;
}
.logos{
    display:grid;
    grid-template-columns: repeat(5, minmax(10px,1fr));
    grid-row-gap: 20px;
    grid-column-gap: 10px;
    margin:30px -20px;
}
.logo-img#weChat{
    max-width: 65px;
}
.logos .logo-img{
    height:auto;
    max-width:120px;
    margin:auto;
}
.logo-img.media1{
    max-width:110px;
}
.logo-img.media2{
    max-width:90px;
}
.logo-img.media3{
    max-width:140px;
}
#contactOverlay .guide-content{
    width:100%;
}
#contactOverlay .guide-wrapper{
    padding:30px 50px;
    height:600px;
}
/* #contactOverlay .close-overlay-wrapper{
    width:75px;
    height:75px;
}
#contactOverlay .close-overlay-wrapper svg{
    width:30px;
    height:30px;
} */
.guide-top-logo{
    height:100px;
    width:auto;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.guide-top-wrapper{
    border-bottom:1px solid var(--main-color);
    padding-bottom:30px;
    width:100%;
}
.guide-top-wrapper .guide-title{
    font-size:30px;
    line-height: 1.5em;
}
.contact-wrapper .contact-box{
    display:flex;
    flex-direction: column;
    padding:0 30px;
}
.contact-wrapper .row{
    margin:0 -30px;
}
.contact-wrapper .contact-box .contact-detail{
    margin-top:20px;
    font-family: 'Poppins';
    text-align: start;
    font-size:15px;
    min-height:135px;
}
.contact-wrapper .contact-box .flag{
    width:100%;
    max-width:80px;
    height:auto;
}
#contactOverlay .guide-title{
    font-size:26px;
    text-align: left;
}
#contactOverlay .contact-overlay-text{
    max-width:90%;
}
.contact-wrapper .contact-box .contact-detail .company{
    font-size:13px;
    font-family: 'Poppins Bold';
}
.contact-wrapper .contact-box .contact-detail :is(.company-reg,.company-address){
    font-size:12px;
}
.contact-wrapper .represent-box{
    margin-top:20px;
    font-size:17px;
    font-family: 'Poppins';
}
.guide-title.innovate{
    margin-bottom:5px;
}
.contact-wrapper .represent-box .represent{
    font-family: 'Poppins Bold';
    text-align: left;
}
.contact-wrapper .represent-box .represent-link{
    color:white;
    margin-left:10px;
}
.owl-carousel .owl-nav button.owl-prev{
    position: absolute;
    left: -50px;
}
#interactive .owl-carousel .owl-nav button.owl-prev{
    left:-100px;
}
#interactive .info-img{
    width:900px;
}
.owl-carousel .owl-nav button.owl-next{
    position: absolute;
    right: -50px;
}
#interactive .owl-carousel .owl-nav button.owl-next{
    right:-100px;
}
.owl-wrapper .arrow-icon{
    display:flex;
}
.owl-wrapper .arrow-icon img{
    width:20px;
    height:45px;
}
.owl-wrapper .owl-nav [class*=owl-]:not(.disabled):hover {
    opacity: 1;
}
.owl-wrapper .owl-nav [class*=owl-]:hover {
    background:transparent!important;
    transform:scale(1)!important;
}
.arrow-icon img{
    position:relative;
}
.owl-wrapper .owl-nav [class*=owl-]:not(.disabled) .arrow-icon img.left1{
    animation:left1 1s infinite;
}
.owl-wrapper .owl-nav [class*=owl-]:not(.disabled) .arrow-icon img.left2{
    animation:left2 1s infinite;
}

.owl-wrapper .owl-nav [class*=owl-]:not(.disabled) .arrow-icon img.right1{
    animation:right1 1s infinite;
}
.owl-wrapper .owl-nav [class*=owl-]:not(.disabled) .arrow-icon img.right2{
    animation:right2 1s infinite;
}
.owl-wrapper .owl-nav [class*=owl-]:hover .arrow-icon :is(img.left1,img.left2,img.right1,img.right2){
    animation: none;
}
.owl-theme .owl-nav [class*=owl-]:hover {
    background:transparent!important;
}
/* full modal */
.full-modal{
    background-size: cover;
    background-position: center;
}
.full-modal::before{
    content:'';
    position: absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,.5);
}
.full-modal .full-modal-content{
    width:100%;
    max-width:80%;
    margin-top:130px;
    height:calc(100% - 130px);
    z-index:1;
}
/* info popup */
.info-popup-content{
    width:1300px;
    height:800px;
}
.info-popup .guide-wrapper{
    display:flex;
    align-items: center;
}
.info-popup .guide-content{
    margin:0;
}
.info-popup .text-wrapper{
    padding:0 40px;
}
.info-img-wrapper{
    width:100%;
    max-width:80%;
    margin:50px auto 0;
}
.info-img{
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    width:100%;
    height:180px;
}
.info-icon:hover{
    animation: pulse 1s infinite;
}
/* face popup */
#facePopup .vr-info .guide-gap{
    margin-bottom:25px;
}
#facePopup .vr-info .guide-gap.more-gap{
    margin-bottom:40px;
}
/* vr info popup */
.guide-wrapper.vr-info{
    justify-content: center;
}
.vr-info .guide-content{
    text-align: left;
}
.vr-info .guide-content .guide-gap {
    margin-bottom:30px;
}
/* interactive */
#interactive.full-modal{
    background-image:url('../../image/playroom2/interactive-bg.jpg');
}
.ceiling{
    background-image: url('../../image/playroom2/ceiling.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width:100%;
    height:175px;
    position: absolute;
    top:0;
}
.ceiling-wrapper{
    display:flex;
    align-items: center;
    justify-content: center;
    color:white;
    margin:55px 0 20px;
}
.ceiling-title{
    font-family: 'Poppins Bold';
    font-size:45px;
    margin-right:20px;
}
.highlight-wrapper{
    margin-top:80px;
}
.carousel-info.text-only{
    margin:120px 0 30px;
}
.highlight{
    background-size:contain;
    background-repeat: no-repeat;
    background-position: center;
    width:100%;
    height:350px;
    position: relative;
}
.explore-wrapper{
    position: absolute;
    left:50%;
    top:45%;
    transform:translate(-50%);
}
.explore-btn{
    background:var(--gold-gradient);
    font-size:25px;
    font-family: 'Poppins Bold';
    color:white!important;
    display:flex;
    align-items: center;
    justify-content: center;
    border-radius:30px;
}
.explore-btn.interactive{
    width:400px;
    height:65px;
}
.explore-btn:hover{
    color:white;
    animation:pulse 1s infinite
}
.others-wrapper{
    display:flex;
    flex-direction: column;
    align-items: center;
    margin-top: 20px;
}
.others-box{
    width:100%;
    max-width:600px;
    margin:0 auto;
}
.others-title{
    font-size:30px;
    font-family: 'Poppins Bold';
    color:var(--main-color);
    margin-bottom:20px;
    z-index:1;
}
.other{
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height:150px;
    width:150px;
    margin:0 auto;
}
.info-icon{
    z-index: 10;
}
.full-modal-content .owl-theme .owl-nav [class*=owl-]:hover {
    transform: scale(1);
    color:black;
}
.full-modal-content .owl-theme .owl-nav{
    margin:0;
    position: absolute;
    width:100%;
    top:25%;
}
.gold-arrow{
    background:var(--gold-gradient);
    width:50px;
    height:50px;
    border-radius: 50%;
    display:flex;
    align-items: center;
    justify-content: center;
}
.gold-arrow.left::before{
    content: "\f104";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size:35px;
}
.gold-arrow.right::before{
    content: "\f105";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size:35px;
}
/* augmented */
#augmented.full-modal{
    background-image:url('../../image/playroom2/augmented-bg.jpg');
}
.augmented-wrapper{
    margin-top:60px;
    display:flex;
    align-items: center;
    position: relative;
}
.augmented{
    width:100%;
    height:600px;

}
.explore-btn.augmented{
    position: absolute;
    background:var(--gold-gradient2);
    left:75%;
    top:50%;
    transform: translate(-50%);
    width:280px;
    height:65px;
    text-shadow: 2px 2px 2px rgba(0,0,0,.75);
}
.explore-btn.augmented:hover{
    animation: pulseTranslate 1s infinite;
}
/* crowd */
#crowd.full-modal{
    background-image:url('../../image/playroom2/crowd-bg.jpg');
}
#crowd .vr-info .guide-gap{
    margin-bottom:10px!important;
}
/* remove when gott video */
#crowd .guide-wrapper.no-video-wrapper{
    width: 900px;
    height: 450px;
    display: flex;
    justify-content: center;
    align-items: center;
}
#crowd .guide-wrapper.no-video-wrapper .guide-title{
    font-size:30px;
}
#crowd .full-modal-content.removeNow{
    display:flex;
    align-items: center;
    justify-content: center;
    margin-top:0;
}
#crowd .full-modal-content.removeNow .scrollBarHere{
    max-height: 200px;
    padding-right:10px;
    overflow: auto;
}
#crowd .guide-wrapper.no-video-wrapper .guide-content .guide-small:last-child{
    margin:0;
}
#crowd .guide-wrapper.no-video-wrapper .guide-content .guide-small{
    text-align: justify;
    font-size: 16px;
}
#crowdPopup .vr-info .guide-gap{
    margin-bottom:30px!important;
}
#crowd .play-btn{
    animation: pulseTranslate 2s infinite;
}
ul > .guide-small{
    padding-left:25px;
}
.crowd-wrapper{
    display:flex;
    align-items: center;
    justify-content: center;
}
.video-wrapper{
    width:1100px;
    height:550px;
    border-radius:60px;
    margin-top:50px;
    border:3px solid var(--main-color);
    position: relative;
}
.play-btn{
    position: absolute;
    top:35%;
    left:50%;
    width:150px;
    height:150px;
    border-radius: 50%;
    transform:translate(-50%);
    transition:.5s ease;
}
.play-icon{
    width:100%;
    height:100%;
}
.play-btn:hover{
    box-shadow: 0 0 40px 20px #fff;
}
.thumbnail{
    background-size:cover;
    background-position: top;
    width:100%;
    height:100%;
    border-radius:57px;
}
#crowdDashboard .guide-wrapper{
    justify-content: center;
    text-align: center;
}
#crowdDashboard .guide-content .guide-small{
    text-align: center;
    font-size:28px;
    margin-bottom:35px;
}
.explore-btn.crowd{
    width:300px;
    height:50px;
    text-transform: capitalize;
    margin:25px auto 0;
}
/* automated */
.automated-wrapper{
    width:1200px;
    height:600px;
    display:flex;
    flex-direction: column;
    align-items: center;
}
.automated-title-wrapper{
    background-image: url('../../image/playroom2/automated-title.svg');
    background-position: bottom;
    width:80%;
    height:90px;
    display:flex;
    align-items: flex-end;
    justify-content: center;
    position: relative;
    bottom:-2px;
}
.automated-title-wrapper .title{
    font-size:28px;
    font-family: 'Poppins Bolder';
    margin-bottom:12px;
}
.automated-title-wrapper .hidden-close{
    position: absolute;
    right: 2%;
    top: 28%;
    width: 50px;
    height: 50px;
    opacity: 0;
}
.automated-wrapper .videos-wrapper{
    border-radius:30px;
    border:2px solid var(--main-color);
    height:100%;
    width:100%;
    padding:30px 70px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.automated-wrapper .videos-wrapper .video{
    height:450px;
    width:100%;
}
.automated-interested{
    display:none;
}
.automated-interested.active{
    display:block;
}
#automatedThank .guide-wrapper{
    width:700px;
    height:400px;
}
#automatedThank .close-overlay-wrapper{
    width:75px;
    height: 75px;
}
#automatedThank .close-overlay-wrapper .close-overlay svg{
    height:30px;
    width:30px;
}
#automatedThank .guide-title{
    font-size:30px;
    line-height: 1.5em;
}
.explore-btn.automated{
    width:150px;
    margin:0 auto;
    height:50px;
    margin-top:35px;
}
.video .play-btn{
    top:40%;
    width:100px;
    height:100px;
    animation:pulseTranslate 2s infinite;
}
.automated-wrapper .videos-wrapper .owl-theme .owl-nav{
    top:40%;
}
.automated-arrow{
    width:35px;
    height:50px;
    position: relative;
}
.automated-arrow.left{
    background-image: url('../../image/playroom2/automated/left.svg');

}
.owl-nav [class*=owl-]:not(.disabled) .automated-arrow.left{
    animation:left1 1s infinite;
}
.automated-arrow.right{
    background-image: url('../../image/playroom2/automated/right.svg');
}
.owl-nav [class*=owl-]:not(.disabled) .automated-arrow.right{
    animation:right1 1s infinite;
}
/* automated Popup */
#automatedPopup{
    z-index:1001;
}
#automatedPopup .guide-content .guide-small {
    font-size:20px;
}
#automatedPopup .guide-content .guide-gap {
    margin-bottom: 20px;
}
.automated-popup-text-wrap{
    margin:20px 0 10px;
}
.automated-text-wrap{
    padding:0 15px;
}
/* breakthrough */
.breakthrough-wrapper{
    width:1400px;
    height:500px;
    display:flex;
    flex-direction: column;
    align-items: center;
    border:2px solid var(--main-color);
    border-radius:40px;
    padding:50px 80px;
    color:white;
    position: relative;
    background:rgba(0,0,0,.8);
}
.breakthrough-video .video{
    height:350px;
    width:100%;
    border:3px solid var(--main-color);
    border-radius:30px;
}
.breakthrough-video .video-detail .video-title{
    font-size:23px;
    font-family: 'Poppins Bold';
    margin-bottom:20px;
}
.breakthrough-video .video-detail .video-title:first-child{
    margin-bottom:5px;
    letter-spacing: 1px;
}
.breakthrough-video .video-detail .video-text{
    font-size:20px;
    font-family: 'Poppins';
    text-align: justify;
    margin-bottom:10px;
}
.breakthrough-wrapper .owl-theme .owl-nav{
    top:40%;
}
.breakthrough-wrapper .owl-theme .owl-dots{
    position: absolute;
    transform:translateX(-50%);
    left: 50%;
    bottom: -16%;
}
.breakthrough-wrapper .owl-theme .owl-dots .owl-dot span{
    width:20px;
    height:20px;
    background:transparent;
    border:2px solid var(--main-color);
}
.breakthrough-wrapper .automated-arrow{
    height:35px;
}
.breakthrough-wrapper .owl-theme .owl-dots .owl-dot.active span,
.breakthrough-wrapper .owl-theme .owl-dots .owl-dot:hover span{
    background:var(--gold-gradient);
    border:none;
}
.breakthrough-wrapper .breakthrough-close{
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    background:white;
    border:2px solid var(--main-color);
    width:80px;
    height:80px;
    top: -2px;
    right: -1px;
    border-radius: 0 40px 0 45px;
    border-top: none;
    border-right: none;
}
#breakthrough .video .play-btn{
    top:35%;
}
/* breakthrough popup */
#breakthroughPopup,#webinarGallery{
    z-index:1001;
}
/* breakthrough gallery */
#webinarGallery{
    background-color: rgba(0,0,0,.95);
}
#webinarGallery .gallery-wrapper{
    width:100%;
    margin:0 auto;
    display:flex;
    align-items: center;
    padding:0 60px;
}
#webinarGallery .close-popup-wrapper{
    background:transparent;
    background-image:url('../../image/playroom2/close-btn.png');
    background-size: cover;
    background-position: center;
    border-radius: 0px;
    width:62px;
    height:62px;
    top: 10px !important;
    right: 18px !important;
    z-index:10;
}
#webinarGallery .gallery-wrapper .webinar-gallery,
#webinarGallery .owl-carousel .owl-stage,
#webinarGallery .owl-carousel.owl-drag .owl-item{
    height:100%;
}
#webinarGallery .owl-carousel .owl-nav button.owl-prev{
    left:0;
}
#webinarGallery .owl-carousel .owl-nav button.owl-next{
    right:0;
}
#webinarGallery .owl-carousel .owl-stage-outer{
    height:calc(100% - 40px);
}
#webinarGallery .gallery-wrapper .owl-nav{
    position: absolute;
    top:45%;
    width:100%;
    transform: translateY(-50%);
}
#webinarGallery .owl-theme{
    height:100vh;
    padding:50px 0;
}
#webinarGallery .owl-theme .owl-dots .owl-dot span{
    width:15px;
    height:15px;
    background:transparent;
    border:2px solid var(--main-color);
}
#webinarGallery .owl-theme .owl-dots .owl-dot.active span,
#webinarGallery .owl-theme .owl-dots .owl-dot:hover span{
    background: var(--gold-gradient);
    border: none;
}
#webinarGallery .owl-theme .owl-dots{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
}
.guide-gap.more-gap{
    margin-bottom:40px;
}
/* :where(#thirdShine,#secondShine) .guide-content .guide-text{
    font-size:30px;
} */
#thirdShine .carousel-title{
    margin:40px 0 0;
}
/* instruction page */
#instructionPopup.modal.info-popup.show-popup{
    z-index: 1001;
}
.navi-icon-wrapper{
    width:100%;
    height:100%;
}
.automated-wrapper.instruction .title{
    color:black;
}
.navi-icon.left{
    animation:left3 2s infinite;
}
.navi-icon.right{
    animation: right3 2s infinite;
}
.navi-icon-wrapper .navi-icon.hand{
    width:100px;
    height:120px;
    margin-top:-10px;
}
.navi-icon-wrapper .navi-icon{
    width:100px;
    height:50px;
    position: relative;
}
.navi-arrow-wrap{
    width:25%;
    display:flex;
    justify-content: space-between;
}
.automated-wrapper.instruction{
    height:500px;
    color:white;
    margin:0;
}
#instructionPopup .guide-content .guide-title{
    font-family: 'Poppins';
    margin-top:35px;
}
#instructionPopup .videos-wrapper{
    background:rgba(0,0,0,.8)
}
@keyframes left1 {
    0%{
        left:-5px;
    }
    50%{
        left:-10px;
    }
    75%{
        left:-5px;
    }
    100%{
        left:0;
    }
}
@keyframes left2 {
    0%{
        left:-5px;
    }
    50%{
        left:-10px;
    }
    75%{
        left:-5px;
    }
    100%{
        left:0;
    }
}
@keyframes right1 {
    0%{
        right:-5px;
    }
    50%{
        right:-10px;
    }
    75%{
        right:-5px;
    }
    100%{
        right:0;
    }
}
@keyframes right2 {
    0%{
        right:-5px;
    }
    50%{
        right:-10px;
    }
    75%{
        right:-5px;
    }
    100%{
        right:0;
    }
}
@keyframes left3 {
    0%{
        left:0;
    }
    50%{
        left:-20px;
    }
    100%{
        left:0;
    }
}
@keyframes right3 {
    0%{
        right:0;
    }

    50%{
        right:-20px;
    }
    100%{
        right:0;
    }
}
@keyframes pulse {
    0%{
        transform:scale(1)
    }
    50%{
        transform:scale(1.1);
    }
    100%{
        transform:scale(1);
    }
}
@keyframes pulseTranslate {
    0%{
        transform:scale(1) translate(-50%);
    }
    50%{
        transform:scale(1.1) translate(-50%);
    }
    100%{
        transform:scale(1) translate(-50%);
    }
}
/* mobile */
@media only screen and (max-width:920px) and (orientation:landscape){
    .owl-wrapper .owl-nav [class*=owl-]:hover .arrow-icon img.left1{
        animation: left1 1s infinite;
    }
    .owl-wrapper .owl-nav [class*=owl-]:hover .arrow-icon img.left2{
        animation: left2 1s infinite;
    }
    .owl-wrapper .owl-nav [class*=owl-]:hover .arrow-icon img.right1{
        animation: right1 1s infinite;
    }
    .owl-wrapper .owl-nav [class*=owl-]:hover .arrow-icon img.right2{
        animation: right2 1s infinite;
    }
    .close-overlay-wrapper,.close-popup-wrapper{
        width:45px;
        height: 40px;
        border-radius: 0 18px 0 18px;
    }
    .close-overlay-wrapper svg,.close-popup-wrapper svg{
        width:15px;
        height:15px;
    }
    .owl-wrapper{
        margin:0 50px;
    }
    .owl-wrapper .approach2 .text-margin{
        margin-top:20px;
    }
    .owl-wrapper .guide-content .guide-title {
        margin-top:20px;
    }
    #firstShine .guide-title{
        margin-bottom:20px;
    }
    #firstShine .guide-content.update .guide-top-logo{
        height:60px;
    }
    .welcome-line{
        margin:10px 0;
    }
    #crowdDashboard .guide-content .guide-small{
        font-size:14px;
        margin-bottom:15px;
    }
    #crowd .full-modal-content{
        justify-content:flex-start;
    }
    #crowd .crowd-wrapper{
        height: 200px;
        width: 100%;
    }
    #crowd .video-wrapper{
        width: 100%;
        height: 100%;
        margin-top:0;
        border-radius: 28px;
    }
    #crowd .thumbnail{
        border-radius: 25px;
    }
    #crowd .play-btn,
    #crowd .play-btn .play-icon svg{
        width:65px;
        height: 65px;
    }
    /* testing for awards mobile */
    .guide-content.update .text-margin.many-text{
        margin-top:0;
    }
    #fourthShine .owl-wrapper{
        padding:0 30px;
    }
    #fourthShine .awards-margin{
        margin-top:0;
    }
    .awards-img{
        height: 145px;
    }
    .awards-detail .awards-text{
        font-size:13px;
    }
    .guide-content.update .guide-top-logo{
        height: 70px;
    }
    .guide-content.update .text-margin.single{
        margin-top:3rem;
    }
    .guide-content.update .text-margin{
        margin-top:2rem;
        padding:0;
    }
    .guide-content.approach2{
        margin:0;
    }
    .guide-content.update .big-bg{
        height: 160px;
    }
    .guide-content.approach2.update .big-bg{
        height: 230px;
    }
    .guide-content .guide-img {
        width:350px;
        height:160px;
    }
    .guide-content .guide-small.disclaimer{
        font-size: 10px;
    }
    .guide-content .guide-img.consumer {
        width:400px;
        height:200px;
    }
    .owl-wrapper .arrow-icon {
        transform: scale(0.7);
    }
    .owl-wrapper .arrow-icon img{
        height:35px;
        width:20px;
    }
    .owl-wrapper .owl-nav {
        top:45%;
    }
    .guide-wrapper{
        width: 700px;
        height: 260px;
        padding:10px 30px;
        border-radius:25px;
    }
    .logos{
        margin:10px -20px;
    }
    .guide-content .guide-gap{
        margin-bottom:10px;
    }
    .guide-content .guide-title,.carousel-title{
        font-size:16px;
    }
    #thirdShine .carousel-title {
        margin-bottom:3px;
        margin-top:0;
    }
    #thirdShine .guide-img{
        margin-top:10px;
        height:200px
    }
    #thirdShine .owl-wrapper .owl-nav {
        top: 50%;
    }
    .guide-content .guide-text{
        font-size:12px;
    }
    .carousel-text{
        font-size:14px;
        margin-top:35px;
    }
    .guide-content .guide-small{
        font-size:10px;
    }
    .logo-wrapper {
        width: 500px;
        height: 190px;
    }
    .logo-wrapper .logo-title {
        font-size:14px;
        padding-bottom:5px;
    }
    .logo-wrapper .logo-content {
        max-height: 160px;
    }
    .logos {
        display: grid;
        grid-template-columns: repeat(3, minmax(10px,1fr));
    }
    .logos .logo-img {
        height: auto;
        max-width:50px;
    }
    .carousel-info{
        margin:5px 0;
    }
    .carousel-info.text-only{
        margin:30px 0;
    }
    .carousel-info.text-only .guide-text{
        margin-bottom:10px;
    }
    .guide-top-logo{
        height: 30px;
    }
    .guide-top-wrapper {
        padding-bottom:5px;
    }
    .contact-wrapper .contact-box {
        padding: 0 5px;
    }
    .contact-wrapper .contact-box .contact-detail {
        font-size:10px;
        margin-top:5px;
        min-height: 90px;
    }
    .guide-top-wrapper .guide-title {
        font-size: 10px;
        line-height: 100%;
    }
    #contactOverlay .guide-content{
        margin:0;
    }
    #contactOverlay .guide-wrapper {
        padding:20px 20px;
        height:260px;
    }
    #contactOverlay .guide-top-wrapper{
        padding-bottom:15px;
    }
    #contactOverlay .guide-title{
        font-size: 10px;
    }
    #contactOverlay .contact-overlay-text{
        max-width: 70%;
    }
    /* #contactOverlay .close-overlay-wrapper{
        width:45px;
        height:40px;
    }
    #contactOverlay .close-overlay-wrapper svg{
        width:15px;
        height:15px;
    } */
    .contact-wrapper .contact-box .contact-detail :is(.company-reg,.company-address) {
        font-size:8px;
    }
    .contact-wrapper .contact-box .contact-detail .company {
        font-size:7px;
    }
    .contact-wrapper{
        margin:0;
    }
    .contact-wrapper .row {
        margin:0;
    }
    .contact-wrapper .represent-box {
        margin-top: 5px;
        font-size: 8px;
    }
    .contact-wrapper .contact-box .flag {
        max-width: 40px;
    }
    .contact-wrapper .contact-box {
        padding: 0 20px;
    }
    /* ceiling mobile */
    .ceiling{
        height:70px;
        top:-20px;
    }
    .ceiling-wrapper{
        margin:25px 0 0;
    }
    .ceiling-title{
        font-size:16px;
    }
    .full-modal .full-modal-content{
        margin:0;
        position: relative;
        top:-30px;
    }
    .ceiling-wrapper .info-icon .info-popup-icon{
        width:25px;
        height:25px;
    }
    .augmented{
        height:160px;
    }
    .explore-btn.augmented{
        width:100px;
        height:25px;
        left:70%;
    }
    /* info larger mobile */
    .info-img-wrapper{
        margin:20px auto 0;
    }
    .info-img {
        height:70px;
    }
    #interactive .info-img{
        width:530px;
    }
    #facePopup .vr-info .guide-gap{
        margin-bottom:5px;
    }
    #facePopup .vr-info .guide-gap.more-gap{
        margin-bottom:10px;
    }
    .automated-wrapper{
        width:700px;
        height:245px;
        margin-top: 30px;
    }
    .automated-wrapper.instruction{
        height:260px;
    }
    .automated-title-wrapper{
        height:50px;
    }
    .automated-title-wrapper .title {
        font-size:16px;
        margin-bottom:8px;
    }
    .navi-icon-wrapper .navi-icon{
        height:25px;
        width:auto;
    }
    .guide-content .guide-title, .carousel-title{
        font-size:16px;
    }
    .navi-icon-wrapper .navi-icon.hand{
        height:70px;
    }
    .navi-arrow-wrap{
        width:30%;
    }
    /* automated mobile */
    .automated-wrapper .videos-wrapper .video{
        height:150px;
    }
    .automated-wrapper .play-icon svg,
    .video .play-btn{
        width:30px;
        height:30px;
    }
    .automated-arrow{
        height:30px;
    }
    #automatedPopup .guide-content .guide-gap{
        margin-bottom:5px;
    }
    .automated-popup-text-wrap{
        margin:10px 0 5px;
    }
    #automatedPopup .guide-content .guide-small{
        font-size:9px;
    }
    .info-popup .text-wrapper{
        padding:0;
    }
    #automatedThank .guide-wrapper{
        height:180px;
        width:400px;
    }
    #automatedThank .close-overlay-wrapper{
        width:45px;
        height:40px;
    }
    #automatedThank .close-overlay-wrapper .close-overlay svg{
        width:15px;
        height:15px;
    }
    #automatedThank .guide-title{
        font-size:16px;
    }
    .explore-btn.automated {
        width: 130px;
        margin: 0 auto;
        height: 30px;
        margin-top: 25px;
        font-size: 18px;
    }
    #automatedThank .guide-content .guide-small{
        font-size:12px;
    }
    /* crowd mobile */
    #crowd .guide-wrapper.no-video-wrapper{
        height:200px;
        margin-top:45px;
        width:550px;
    }
    #crowd .guide-content{
        margin:0;
    }
    #crowd .guide-wrapper.no-video-wrapper .guide-title{
        font-size:18px;
    }
    #crowd .full-modal-content.removeNow .scrollBarHere{
        max-height: 100px;
    }
    #crowd .guide-wrapper.no-video-wrapper .guide-content .guide-small{
        font-size:10px;
    }
    .explore-btn.crowd{
        width:150px;
        height: 25px;
        margin: 15px auto 0;
        font-size:10px;
    }
    #crowdPopup .vr-info .guide-gap{
        font-size:13px;
    }
    #crowd .full-modal-content.removeNow .scrollBarHere{
        max-height: 100px;;
    }
    #crowdPopup .vr-info .guide-title{
        font-size:16px;
    }
    /* breakthrough */
    .breakthrough-wrapper{
        width:700px;
        height: 250px;
        padding:10px 40px;
        border-radius:20px;
        margin-top:50px;
        justify-content: center;
    }
    #breakthrough .video .play-btn{
        top:32%;
    }
    .breakthrough-video .video{
        height:180px;
    }
    .breakthrough-video .video .play-btn .play-icon svg{
        width:75px;
        height:75px;
    }
    .breakthrough-video .video .play-btn{
        width:75px;
        height:75px;
    }
    .breakthrough-wrapper .breakthrough-close{
        border-radius: 0 20px 0 20px;
        width:35px;
        height:35px;
    }
    .breakthrough-wrapper .breakthrough-close svg{
        width:15px;
        height:15px;
    }
    .breakthrough-video .video-detail .video-title{
        font-size:12px;
    }
    .breakthrough-wrapper .automated-arrow{
        height:20px;
        width:20px;
    }
    .breakthrough-video .video-detail .video-text{
        font-size:10px;
    }
    #breakthrough .owl-carousel .owl-nav button.owl-prev{
        left:-30px;
    }
    #breakthrough .owl-carousel .owl-nav button.owl-next{
        right:-30px;
    }
    .breakthrough-wrapper .owl-theme .owl-dots{
        position: relative;
        transform: none;
        bottom:0;
        margin-top: 10px;
        height:20px;
        left:auto;
    }
    .breakthrough-wrapper .owl-theme .owl-dots .owl-dot span{
        width:12px;
        height:12px;
    }
    /* interactive mobile */
    .explore-wrapper{
        top:41%;
    }
    .explore-btn{
        font-size:9px;
    }
    .explore-btn.interactive {
        width: 135px;
        height: 25px;
        font-size: 10px;
    }
    .highlight-wrapper{
        margin:0 auto;
        max-width:400px;
        width:100%;
    }
    .others-title{
        font-size:14px;
        margin-bottom: 5px;
    }
    .other{
        height:65px;
        width:auto;
    }
    .others-wrapper{
        margin-top:0;
        width:100%;
    }
    .others-box{
        max-width: 380px;
    }
    .gold-arrow{
        width:25px;
        height:25px;
    }
    #interactive .owl-carousel .owl-nav button.owl-prev{
        left:-35px;
    }
    #interactive .owl-carousel .owl-nav button.owl-next{
        right:-35px;
    }
    .gold-arrow.left::before,
    .gold-arrow.right::before{
        font-size:20px;
    }
    .highlight{
        height:100px;
    }
    /* ar larger mobile */
    .augmented-wrapper{
        margin-top:20px;
        width:100%;
    }
    .augmented{
        height:53vh;
    }

    /* TESTING HERE */
    /* #interactive.full-modal .full-modal-content{ */
    #crowd .guide-wrapper.no-video-wrapper{
        margin-top:0!important;
    }
    .full-modal .full-modal-content{
        top:0;
        height:auto;
        display:flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        margin-top:0;
    }
    .modal .full-modal-content{
        height: calc(100% - 80px);
        margin-top: 35px;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
    :where(#interactive,#augmented) .full-modal-content{
        margin-top:0!important;
    }
    :where(#automatedDigital,#automatedInteractive) .automated-wrapper{
        margin-top:0!important;
    }
    .augmented-wrapper{
        margin-top:0!important;
    }
    .breakthrough-wrapper{
        margin-top:0!important;
    }
    #webinarGallery .close-popup-wrapper{
        width:30px;
        height:30px;
    }
    #webinarGallery .owl-theme{
        height:85vh;
        padding:20px 0;
    }
}
/* small mobile */
@media only screen and (max-device-height: 380px) and (orientation:landscape){
    /* interactive small mobile */
    .explore-wrapper{
        top:41%;
    }
    .explore-btn{
        font-size:9px;
    }
    .explore-btn.interactive {
        width: 90px;
        height: 15px;
        font-size:8px;
    }
    .others-title{
        font-size:14px;
        margin-bottom: 10px;;
    }
    .other{
        height:50px;
        width:auto;
    }
    .others-wrapper{
        max-width: 350px;
        margin: 5px auto 0;
    }
    .others-box{
        max-width: 400px;
    }
    .gold-arrow{
        width:25px;
        height:25px;
    }
    #interactive .owl-carousel .owl-nav button.owl-prev{
        left:-35px;
    }
    #interactive .owl-carousel .owl-nav button.owl-next{
        right:-35px;
    }
    .gold-arrow.left::before,
    .gold-arrow.right::before{
        font-size:20px;
    }
    .highlight{
        height:60px;
    }
    /* AR */
    .augmented-wrapper{
        margin-top:15px;
    }
    .augmented{
        height:50vh;
    }
    /* automated small mobile*/
    :where(#automatedDigital,#automatedInteractive) .automated-wrapper{
        height:210px;
        margin-top:35px;
    }
    :where(#automatedDigital,#automatedInteractive) .automated-title-wrapper{
        height:25px;
    }
    :where(#automatedDigital,#automatedInteractive) .automated-wrapper .videos-wrapper{
        padding:10px 50px;
    }
    :where(#automatedDigital,#automatedInteractive) .automated-wrapper .videos-wrapper .video{
        height:135px;
    }
    :where(#automatedDigital,#automatedInteractive) .automated-title-wrapper .title{
        font-size:14px;
        margin-bottom:2px;
    }
    :where(#automatedDigital,#automatedInteractive) .automated-arrow{
        height:25px;
        width:25px;
    }
    :where(#automatedDigital,#automatedInteractive) .owl-carousel .owl-nav button.owl-next{
        right:-30px;
    }
    :where(#automatedDigital,#automatedInteractive) .owl-carousel .owl-nav button.owl-prev{
        left:-30px;
    }
    .automated-title-wrapper .hidden-close{
        right:21.5%;
        top:-3%;
    }
    /* crowd small mobile */
    #crowd .guide-wrapper.no-video-wrapper{
        height:150px;
        padding:10px 20px;
    }
    #crowd .guide-wrapper.no-video-wrapper .guide-title{
        font-size:16px;
    }
    #crowd .full-modal-content.removeNow .scrollBarHere{
        max-height: 52px;
    }
    /* breakthrough sm,all mobile */
    .breakthrough-wrapper{
        height:210px;
        margin-top:45px;
    }
    .breakthrough-video .video{
        height:150px;
    }
    .breakthrough-video .video-detail .video-title{
        margin-bottom:10px;
    }
    .breakthrough-video .video-detail .video-text{
        margin-bottom:0;
    }
    .breakthrough-wrapper .owl-theme .owl-dots{
        margin-top:5px;
    }
    #breakthrough .owl-carousel .owl-nav button.owl-next{
        right:-30px;
    }
    #breakthrough .owl-carousel .owl-nav button.owl-prev{
        left:-30px;
    }
    #breakthrough .video .play-btn{
        top:30%;
    }
    .breakthrough-video .video .play-btn{
        width:65px;
        height:65px;
    }
    .breakthrough-video .video .play-btn .play-icon svg {
        width:65px;
        height:65px;
    }
    /* instruction small mobile */
    #instructionPopup .automated-title-wrapper{
        height:30px;
    }
    #instructionPopup .navi-arrow-wrap{
        width:25%;
    }
    #instructionPopup .automated-wrapper.instruction{
        height:200px;
    }
    #instructionPopup .automated-title-wrapper .title{
        font-size:14px;
        margin-bottom:2px;
    }
    #instructionPopup .guide-content .guide-title{
        margin-top:20px;
    }
    #instructionPopup .videos-wrapper{
        padding:15px 70px;
    }
}
/* @media only screen and (min-device-height: 381px) and (max-device-height:900px) and (orientation:landscape){
    .explore-wrapper{
        top:41%;
    }
    .explore-btn{
        font-size:9px;
    }
    .explore-btn.interactive {
        width: 135px;
        height: 25px;
        font-size: 10px;
    }
    .highlight-wrapper{
        margin:0 auto;
        max-width:400px;
        margin-top:20px;
    }
    .others-title{
        font-size:14px;
        margin-bottom: 10px;;
    }
    .other{
        height:75px;
        width:auto;
    }
    .others-wrapper{
        margin-top:5px;
    }
    .others-box{
        max-width: 380px;
    }
    .gold-arrow{
        width:25px;
        height:25px;
    }
    #interactive .owl-carousel .owl-nav button.owl-prev{
        left:-35px;
    }
    #interactive .owl-carousel .owl-nav button.owl-next{
        right:-35px;
    }
    .gold-arrow.left::before,
    .gold-arrow.right::before{
        font-size:20px;
    }
    .highlight{
        height:100px;
    }
    .augmented-wrapper{
        margin-top:20px;
    }
    .augmented{
        height:55vh;
    }
} */

/*  laptop  */
@media (min-height:600px) and (max-height:960px) {
    .close-overlay-wrapper,.close-popup-wrapper{
        width:65px;
        height:65px;
        border-radius: 0 45px 0 40px;
    }
    .close-overlay-wrapper svg,.close-popup-wrapper svg{
        width:25px;
        height:25px;
    }
    .automated-text-wrap{
        padding:0 10px;
    }
    #firstShine .guide-content.update .guide-top-logo{
        height:80px;
    }
    .welcome-line{
        margin:15px 0;
    }
    /* testing for awards laptop */
    .guide-content.update .text-margin.many-text{
        margin-top:1rem;
    }
    .guide-content.update .guide-top-logo{
        height: 100px;
    }
    .guide-content.update .big-bg{
        height: 280px;
    }
    #fourthShine .owl-wrapper{
        padding:0 20px;
    }
    #fourthShine .awards-margin{
        margin-top:2rem;
    }
    .awards-detail .awards-text{
        font-size:14px;
    }
    .awards-img{
        height:200px;
    }
    .guide-content.update .text-margin{
        margin-top:3rem;
        padding:0;
    }
    .guide-content.update .text-margin.single{
        margin-top:5rem;
    }
    .guide-content.approach2.update .big-bg{
        height: 375px;
    }
    .guide-wrapper{
        width: 810px;
        height: 450px;
        padding: 30px 50px 30px;
    }
    .guide-content .guide-small.disclaimer{
        font-size:11px;
    }
    .guide-content .guide-gap{
        margin-bottom:20px;
    }
    .guide-content .guide-title{
        font-size:22px;
    }
    #breakthrough .video .play-btn{
        top:30%;
    }
    #automatedThank .guide-title{
        font-size:26px;
    }
    .owl-wrapper .guide-content .guide-title{
        margin-top:20px;
        margin-bottom:40px;
    }
    .carousel-info.text-only {
        margin: 60px 0 30px;
    }
    .carousel-info{
        margin:20px 0;
    }
    .info-img{
        height: 130px;
    }
    #thirdShine .guide-img{
        width:650px;
        height:300px;
        margin:0;
    }
    .info-img-wrapper{
        margin:20px auto 0;
    }
    .owl-wrapper .approach2 .text-margin{
        margin-top:25px;
    }
    .automated-popup-text-wrap,
    .face-text-wrapper{
        max-height: 200px;
        overflow:hidden;
        overflow-y:auto;
        padding-right:20px;
    }
    .face-text-wrapper{
        margin:10px 0;
    }
    #secondShine .carousel-title{
        margin:20px 0;
    }
    #firstShine .guide-title{
        margin-bottom:25px;
    }
    .guide-content .guide-text{
        font-size:16px;
    }
    .guide-content .guide-small{
        font-size:14px;
    }
    .guide-content .guide-img {
        width:500px;
        height:280px;
    }
    .guide-gap.more-gap{
        margin-bottom:28px;
    }
    .owl-wrapper{
        margin:0 20px;
    }
    .owl-theme .owl-nav [class*=owl-]{
        transform:scale(0.8);
    }
    .owl-theme .owl-nav [class*=owl-]:hover {
        transform:scale(0.8)!important;
    }
    .carousel-title{
        font-size:25px;
        margin-bottom:10px;
    }
    .carousel-text {
        font-size:13px;
    }
    .augmented-wrapper{
        margin-top:15px;
    }
    #thirdShine .carousel-title{
        margin:0 0 20px;
    }
    .logo-wrapper .logo-content {
        max-height:230px;
        margin:10px;
    }

    .logo-wrapper {
        width: 600px;
        height: 270px;
        padding:20px;
    }
    .logo-wrapper .logo-title {
        font-size:20px;
    }
    .logos{
        grid-template-columns: repeat(4, minmax(10px,1fr));
        grid-row-gap: 15px;
        margin:15px -20px;
    }
    .logos .logo-img {
        height: auto;
        max-width:75px;
    }
    .logo-img#weChat{
        max-width: 45px;
    }
    .logos :is(.media2,.media5,.media6,.media7){
        max-width:65px;
    }
    .logos .media3{
        max-width:100px;
    }
    .guide-top-logo {
        height:60px;
    }
    .guide-title.innovate{
        margin-bottom:5px;
    }
    #crowdDashboard .guide-content .guide-small{
        font-size:18px;
        margin-bottom:25px;
    }
    #contactOverlay .guide-wrapper {
        padding:30px 25px;
        height:450px;
    }
    #contactOverlay .guide-content{
        margin:0;
    }
    .contact-wrapper .row {
        margin:0 -20px;
    }
    .guide-top-wrapper{
        padding-bottom: 20px;
    }
    .contact-wrapper .contact-box {
        padding:0 15px;
    }
    .contact-wrapper .contact-box .flag {
        max-width: 65px;
    }
    #contactOverlay .guide-title {
        font-size: 14px;
        margin-bottom:5px;
    }
    .contact-wrapper .contact-box .contact-detail {
        margin-top:10px;
        font-size:13px;
        min-height:130px;
    }
    .contact-wrapper .represent-box {
        margin-top: 10px;
        font-size: 12px;
    }
    .contact-wrapper .contact-box .contact-detail .company{
        font-size:10px;
    }
    .contact-wrapper .contact-box .contact-detail :is(.company-reg,.company-address){
        font-size:10px;
    }
    /* full modal */
    .ceiling{
        height:110px;
    }
    .ceiling-title{
        font-size:30px;
    }
    .ceiling-wrapper{
        margin:35px 0 20px;
    }
    .info-icon svg{
        width:30px;
        height:30px;
    }
    /* interactive */
    .highlight-wrapper{
        margin-top: 10px;
    }
    .highlight{
        height:240px;
    }
    .full-modal .full-modal-content {
        transform:scale(0.75);
        margin-top:0;
    }
    .explore-wrapper{
        top:40%;
    }
    .explore-btn.interactive{
        width: 300px;
        height: 50px;
        font-size: 20px;
    }
    #interactive .info-img{
        width:650px;
    }
    .highlight-wrapper{
        max-width:100%;
    }
    .others-box{
        max-width:600px;
    }
    .other{
        height:150px;
        width:150px;
    }
    .gold-arrow{
        width:50px;
        height:50px;
    }
    .others-title{
        margin-bottom:20px;
        font-size:30px;
    }
    #interactive .owl-carousel .owl-nav button.owl-prev{
        left:-100px;
    }
    #interactive .owl-carousel .owl-nav button.owl-next{
        right:-100px;
    }
    .gold-arrow.left::before, .gold-arrow.right::before{
        font-size:35px;
    }
    .explore-btn{
        font-size:25px;
    }
    /* ar */
    .augmented{
        height:80vh;
    }
    .explore-btn.augmented {
        width:235px;
        height:55px;
        left:80%
    }
    /* crowd analytic */
    .video-wrapper {
        width: 950px;
        height: 450px;
        margin-top: 25px;
    }
    /* automated */
    .automated-wrapper{
        width:900px;
        height:450px;
        margin-top:30px;
    }
    .automated-wrapper .videos-wrapper .video{
        height:320px;
    }
    .automated-title-wrapper .title {
        font-size: 24px;
        margin-bottom: 8px;
    }
    .automated-title-wrapper .hidden-close {
        position: absolute;
        right: 2%;
        top: 40%;
        width: 35px;
        height: 35px;
    }
    #automatedThank .guide-wrapper{
        width:565px;
        height:350px;
    }
    #automatedThank .close-overlay-wrapper{
        width:65px;
        height:65px;
    }
    .explore-btn.automated{
        width: 120px;
        font-size: 22px;
        height: 40px;
        margin-top:45px;
    }
    /* vr info popup */
    .vr-info .guide-content .guide-gap {
        margin-bottom: 10px!important;
    }
    .vr-info .guide-content .guide-small {
        font-size: 14px!important;
    }
    .vr-info .info-img{
        height:130px!important;
    }
    /* breakthrough */
    .breakthrough-wrapper {
        width: 1000px;
        height: 430px;
    }
    .breakthrough-video .video {
        height: 250px;
    }
    .breakthrough-video .video-detail .video-title{
        font-size:16px;
        margin-bottom:15px;
    }
    .breakthrough-video .video-detail .video-text{
        font-size:14px;
    }
    .breakthrough-wrapper .breakthrough-close{
        width:65px;
        height: 65px;
        border-radius: 0 40px 0 35px;
    }
    .breakthrough-wrapper .breakthrough-close svg{
        width:25px;
        height:25px;
    }
    #breakthrough .full-modal-content{
        margin-top:100px;
    }
    .breakthrough-wrapper .owl-theme .owl-dots{
        bottom:-35%;
    }
    .breakthrough-wrapper .owl-theme .owl-dots .owl-dot span,
    #webinarGallery .owl-theme .owl-dots .owl-dot span{
        width:15px;
        height:15px;
    }
    /* breakthrough popup */
    #breakthroughPopup .info-img{
        height: 90px;
    }
    /* face popup */
    #facePopup .vr-info .guide-gap{
        margin-bottom:15px!important;
    }
    #facePopup .vr-info .guide-gap.more-gap{
        margin-bottom:25px!important;
    }
    .info-popup-icon{
        width:30px;
        height:30px;
    }
    /* instruction */
    #instructionPopup .automated-wrapper{
        width:800px;
    }
    .automated-wrapper.instruction{
        height:375px;
    }
    .navi-arrow-wrap{
        width:25%;
    }
    .navi-icon-wrapper .navi-icon.hand{
        width:100px;
        height:90px;
        margin-top:-10px;
    }
    .navi-icon-wrapper .navi-icon{
        width:100px;
        height:30px;
    }
}
