.slider-sync2 .owl-prev,.slider-sync2 .owl-next{position: absolute; opacity: .8; padding: 5px 4px; color: #000; top: 50%; margin-top: -25px; text-align: center; line-height: 18px;} .slider-sync2 .owl-prev:hover,.slider-sync2 .owl-next:hover{opacity: 1} .slider-sync2 .owl-nav .disabled{background: #ddd!important; opacity: .9} .slider-sync2 .owl-prev{left: 0;} .slider-sync2 .owl-next{right: 0;} .slider-sync2 .owl-prev:before{content: "\f104"; font: 45px/1 FontAwesome} .slider-sync2 .owl-next:before{content: "\f105"; font: 45px/1 FontAwesome} .slider-sync2 .title{} .service{background: #179bd7;} .service .row{margin-left: 0;margin-right: 0;} .service .card:not(.view):hover:before{content: ""; background: rgba(0,0,0,.3); position: absolute; top: 0; left: 0; width: 100%; z-index: 1; height: 100%;} .service .card-name,.service .date{background: rgba(0,0,0,0.6); padding: 5px; line-height: 18px; z-index: 2;} .service .date{position: absolute; top: 10px; right: 10px; color: #fff; width: 50px; text-align: left; padding-left: 10px;} .service .card-name{padding-right: 15px;} .service .card-name a:after{font: 15px/1 FontAwesome; content: "\f105"!important; position: absolute; top: 50%; margin-top: -8px; right: 7px;} .accordion .card-header.active{background: #46a5e5;} .accordion .card-header.active button{color: #fff;} .bottom-message{background: #edeaea;} .footer{background: #ffffff;} .copyright-border .border-top{border-top-color: #007bff !important;} .o_main_navbar{background-color: #0078D7; border-bottom: 2px solid #005A9E;} .o_main_navbar .nav > li > a{color: #FFFFFF; font-weight: bold;} .o_main_navbar .dropdown-menu{display: none; position: absolute; background-color: #FFFFFF; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15); margin-top: 0;} .o_main_navbar .dropdown:hover > .dropdown-menu, .o_main_navbar .dropdown.open > .dropdown-menu{display: block;} .o_main_navbar .dropdown-menu > li > a{color: #333333; padding: 8px 10px; white-space: nowrap;} .o_main_navbar .dropdown-menu > li > a:hover{background-color: #F0F0F0; color: #0078D7;} .o_main_navbar .dropdown-menu .dropdown-menu{left: 100%; top: 0; margin-left: 0; background-color: #F9F9F9;} .o_main_navbar .dropdown-menu > li.dropdown:hover > .dropdown-menu{display: block;} .o_main_navbar .dropdown-toggle::after{border-top: 4px solid #FFFFFF; border-right: 4px solid transparent; border-left: 4px solid transparent; content: ""; display: inline-block; margin-left: 4px; vertical-align: middle;} .table-responsive .o_list_view thead tr:nth-child(1) th{background-color: #fff;} #loading{position:fixed;background: rgba(255,255,255,.7);background-attachment:fixed;top:0;left:0;bottom:0;right:0;z-index:99999} .loading{position:absolute;left:50%;top:50%;margin-top:-31px;margin-left:-31px;border-bottom:2px solid rgba(0,0,0,0.1);border-left:2px solid rgba(0,0,0,0.1);border-right:2px solid rgba(0,0,0,0.1);border-top:2px solid red;border-radius:100%;height:50px;width:50px;animation:rot .6s infinite linear} #goTop{position: fixed;bottom: 20px;right: 10px;cursor: pointer;display: none;z-index: 10000;font-size: 40px;background-color: #ffffff;border-radius: 50%;padding: 5px 10px} @keyframes rot{from{transform:rotate(0deg)}to{transform:rotate(359deg)}} @-webkit-keyframes rot{from{transform:rotate(0deg)}to{transform:rotate(359deg)}} .animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;} @keyframes fadeInDown{from{opacity:0;-webkit-transform:translate3d(0, -100%, 0);transform:translate3d(0, -100%, 0);}100%{opacity:1;-webkit-transform:none;transform:none;}} .fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown;} 

/* /vti_theme/static/src/css/mobile.css defined in bundle 'web.assets_frontend' */
@media only screen and (min-width:1025px){} @media only screen and (max-width:1024px){.ow-navigation .navicon{background-color: rgba(128, 126, 120, 0.6)!important;font-size: 24px;position: absolute;left: 10px;z-index: 100;top: 50%;margin-top: -20px}.navbar-brand{margin: 0;width: 100%;text-align: center}} @media only screen and (min-width:981px){} @media only screen and (max-width:980px){} @media only screen and (max-width:768px){} @media only screen and (max-width:480px){.slider-sync2{width: 60%;text-align: center}.slider-sync2 .card-title{font-size: 15px;}.slider-sync2 .btn-custom{padding: 5px 8px;line-height: 20px;}.slider-sync2 .owl-prev:before, .slider-sync2 .owl-next:before{font-size: 30px;}.card-group .card{width: 100%}} @media only screen and (max-width:380px){} 

/* /vti_theme/static/src/scss/style.scss defined in bundle 'web.assets_frontend' */
 .home-page{z-index: 10; position: absolute;} .bg-menu{position: unset; width: 100%;} .menu-icon{background: #F2F2F2;} 

/* /vti_training_quiz/static/src/scss/website_slides.scss defined in bundle 'web.assets_frontend' */
 .question{width: 100%; font-size: 16px; border: 1px solid #aaa;} .form-question{margin-left: 50px; width: 60%; height: 200px;} .form-question-onepage{margin-left: 50px; width: 80%; height: 200px;} .num-question{width: 100%; height: 50px; background-color: #f5f5f5; font-size: 20px; padding-left: 24px; line-height: 50px;} .header-fixed{position: fixed; top: 1%; padding-top: 6%; background-color: white; margin-right: 17%;} .question-body{padding-top: 19%;} .text-question{width: 100%; background-color: #f5f5f5; border-bottom: 1px solid; border-bottom-color: #dcd1d1; padding-left: 24px; font-size: 20px; line-height: 50px; display: -webkit-box; display: -webkit-flex; display: flex; justify-content: space-between;} .point-question{font-size: 13.5px; margin-right: 2%;} .text-child-question{margin-bottom: 20px; font-size: 18px;} .answer_online{border-top: 1px solid; padding: 2px; border-top-color: #dcd1d1; margin-right: 13px; height: auto; padding: 10px 0px; font-size: 15px; color: #343a40;} .answer_online_name{display: inline;} .answer_online_name p:first-child{display: inline;} .child_answer_online{height: auto; padding: 10px 0px; font-size: 15px; margin-right: 13px; color: #343a40; border-top: 1px solid; border-top-color: #dcd1d1;} .answer_description{margin-left: 15px; font-size: 14.5px; box-sizing: border-box; font-style: italic; font-weight: bold;} .input-answer{margin-top: 10px;} .clock{width: 20%; height: auto; min-height: 150px; border: 1px solid #000000; margin-left: 10%;} .clock-one-page{width: 30%; height: 200px; min-height: 150px; border: 1px solid #000000;} .grid-question{padding: 0px 8px 8px 8px;} .percent{padding: 0px 8px 8px 8px;} .button-next-prev{margin-top: 150px; width: 50px; height: 20px; margin-left: 50px; width: 170px; height: 40px; display: -webkit-box; display: -webkit-flex; display: flex; justify-content: space-around;} .button-next{background-color: #2e65db; width: 45%; height: 100%; max-width: 100px;} .button-finish{height: 45px; width: 70px; margin-left: 20px;} .form-one-page{display: -webkit-box; display: -webkit-flex; display: flex;} .row-custom{display: block; width: 1200px;} .ques{margin-left: 2%;} .main-question{width: 100%; height: auto;} .main-question-one{width: 100%;} .name-question{font-size: 18px; margin-left: 24px; margin-right: 10px; color: #2a2e32; padding: 10px 0px; font-weight: 700;} .name-question p:last-child{margin-bottom: 0;} .input-question{margin-left: 24px;} .que_show{display: block !important; color: black;} .que_active{background-color: #ccc;} .que_answered{background-color: #33cc33;} .training-question-essay-binary-answer{position: relative; margin-left: 35%;} .training-question-essay-textarea-valid{font-size: 14px; text-align: left;} .training-question-essay-binary-files{width: 30%; margin-left: 35%;} .training-question-essay-binary-files .file-block{border-radius: 10px; background-color: rgba(144, 163, 203, 0.2); margin: 5px; color: initial; display: -webkit-inline-box; display: -webkit-inline-flex; display: inline-flex; width: 100%;} .training-question-essay-binary-files .file-block > span.name{padding-right: 10px; width: 80%; display: -webkit-inline-box; display: -webkit-inline-flex; display: inline-flex; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;} .training-question-essay-binary-files .file-delete{display: -webkit-box; display: -webkit-flex; display: flex; width: 24px; color: initial; font-size: large; justify-content: center; margin-right: 3px; cursor: pointer;} .training-question-essay-binary-files .file-delete:hover{background-color: rgba(144, 163, 203, 0.2); border-radius: 10px;} .training-question-essay-binary-files .file-delete > span{transform: rotate(45deg);} .training-question-essay-binary-answer::file-selector-button{border-radius: 4px; padding: 0 10px 0 40px; height: 40px; cursor: pointer; background-color: white; border: 1px solid rgba(0, 0, 0, 0.16); box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.05); margin-right: 16px; transition: background-color 200ms;} .training-question-essay-binary-answer::before{position: absolute; pointer-events: none; top: 10px; left: 15px; height: 20px; width: 20px; content: ""; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230964B0'%3E%3Cpath d='M18 15v3H6v-3H4v3c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2v-3h-2zM7 9l1.41 1.41L11 7.83V16h2V7.83l2.59 2.58L17 9l-5-5-5 5z'/%3E%3C/svg%3E");} .training-view-result-essay{width: 100%; height: 100px; display: -webkit-box; display: -webkit-flex; display: flex; margin-bottom: 50px;} .training-view-result-essay img{width: 100px; height: 100px;} .training-view-result-essay span{color: red; font-style: italic; font-weight: 100; font-size: 40px; margin-left: 20px; font-family: "Times New Roman", Times, serif; width: 88% !important; line-height: 50px;} .sticky::-webkit-scrollbar{width: 5px; height: 5px;} .sticky::-webkit-scrollbar-thumb{background-color: #b5b5b5; border-radius: 4px;} .wrap-width{width: 70%;} .grid-que{border: 1px solid #000; margin-bottom: 4px; background-color: #fbfbfb; width: auto; padding-right: 12px; min-width: 45px;} .sticky{position: fixed; margin-left: 70%; width: 25%; height: 300px; background-color: #FFFFFF; min-width: 300px; overflow: auto; border: 1px solid; float: right; margin-top: 78px;} .sticky .col-md-12{text-align: center;} #divCounter{position: sticky; top: 0px; z-index: 1000; background-color: #FFFFFF;} #progressBar{background-color: #f3f3f3; height: 35px;} .progress-value{display: none !important;} #progressBar div{height: 100%; color: black; text-align: center; line-height: 35px; font-size: 18px; font-weight: bold; width: 0; background-color: #057BBA;} .button-finish-1{width: 100%; height: 50px; position: sticky; bottom: 0px; background-color: #FFFFFF; display: -webkit-box; display: -webkit-flex; display: flex; justify-content: center; padding-top: 10px;} #final_finish{height: 36px; bottom: 0px;} .form-all-one{width: 100%; height: 100%; display: -webkit-box; display: -webkit-flex; display: flex; justify-content: space-between;} .all-in-one{width: 80%;} @media only screen and (max-width: 770px){.mt32{margin-top: 0px !important;}.sticky{position: sticky; margin-left: 0px; height: 200px; top: 70px; z-index: 1000; background-color: #FFFFFF; min-width: calc(100% - 30px);}.form-all-one{-webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; align-items: center;}.re-footer{-webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column;}.re-footer p{font-size: 18px !important;}.wrap-width{width: 100%;}.all-in-one{width: 100%;}} @media (min-width: 576px){.wrap-width .container{max-width: 100%;}} 

/* /vti_training_quiz/static/src/scss/quiz_timer.scss defined in bundle 'web.assets_frontend' */
 .heading-digit{background: #fbfbfb; font-size: 18px; color: black; min-width: 21%; min-height: 40px; text-align: center; margin-bottom: 8px; font-weight: 700; text-transform: uppercase; border: 1px #e8e8e8 solid; border-radius: 0px; margin-right: 10px; display: inline-block; padding-top: 10px;} .re-footer{display: -webkit-box; display: -webkit-flex; display: flex; justify-content: space-between;} .training-exam-one-question-show.question-show-active{display: block;} .training-exam-one-question-show.question-show-no-active{display: none;} .btn-grid-one-que-show.btn-grid-showing{background-color: #357EBD !important; color: #FFFFFF !important;} 

/* /vti_training/static/src/scss/owl.carousel.css defined in bundle 'web.assets_frontend' */
 .test-result{padding-bottom: 0px; height: auto;} .owl-carousel{display: none; width: 100%; -webkit-tap-highlight-color: transparent; position: relative; z-index: 1;} .owl-carousel .owl-stage{position: relative; -ms-touch-action: pan-Y;} .owl-carousel .owl-stage:after{content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} .owl-carousel .owl-stage-outer{position: relative; overflow: hidden; -webkit-transform: translate3d(0px, 0px, 0px);} .owl-carousel .owl-item{position: relative; min-height: 1px; float: left; -webkit-backface-visibility: hidden; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none;} .owl-carousel .owl-item img{display: block; width: 100%; -webkit-transform-style: preserve-3d;} .owl-carousel .owl-nav.disabled, .owl-carousel .owl-dots.disabled{display: none;} .owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-dot{cursor: pointer; cursor: hand; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;} .owl-carousel.owl-loaded{display: block;} .owl-carousel.owl-loading{opacity: 0; display: block;} .owl-carousel.owl-hidden{opacity: 0;} .owl-carousel.owl-refresh .owl-item{display: none;} .owl-carousel.owl-drag .owl-item{-webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;} .owl-carousel.owl-grab{cursor: move; cursor: grab;} .owl-carousel.owl-rtl{direction: rtl;} .owl-carousel.owl-rtl .owl-item{float: right;} .no-js .owl-carousel{display: block;} .owl-carousel .animated{-webkit-animation-duration: 1000ms; animation-duration: 1000ms; -webkit-animation-fill-mode: both; animation-fill-mode: both;} .owl-carousel .owl-animated-in{z-index: 0;} .owl-carousel .owl-animated-out{z-index: 1;} .owl-carousel .fadeOut{-webkit-animation-name: fadeOut; animation-name: fadeOut;} @-webkit-keyframes fadeOut{0%{opacity: 1;}100%{opacity: 0;}} @keyframes fadeOut{0%{opacity: 1;}100%{opacity: 0;}} .owl-height{transition: height 500ms ease-in-out;} .owl-carousel .owl-item .owl-lazy{opacity: 0; transition: opacity 400ms ease;} .owl-carousel .owl-item img.owl-lazy{-webkit-transform-style: preserve-3d; transform-style: preserve-3d;} .owl-carousel .owl-video-wrapper{position: relative; height: 100%; background: #000;} .owl-carousel .owl-video-play-icon{position: absolute; height: 80px; width: 80px; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; background: url("/vti_training/static/src/scss/owl.video.play.png") no-repeat; cursor: pointer; z-index: 1; -webkit-backface-visibility: hidden; transition: -webkit-transform 100ms ease; transition: transform 100ms ease;} .owl-carousel .owl-video-play-icon:hover{-webkit-transform: scale(1.3, 1.3); -ms-transform: scale(1.3, 1.3); transform: scale(1.3, 1.3);} .owl-carousel .owl-video-playing .owl-video-tn, .owl-carousel .owl-video-playing .owl-video-play-icon{display: none;} .owl-carousel .owl-video-tn{opacity: 0; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: contain; transition: opacity 400ms ease;} .owl-carousel .owl-video-frame{position: relative; z-index: 1; height: 100%; width: 100%;} 

/* /vti_training/static/src/scss/lms_common.scss defined in bundle 'web.assets_frontend' */
 .card.card.body:hover{border: 1px solid #057BBA;} .website_lms_h2{font-size: 16px; line-height: 1.4em; color: #413f3f; font-weight: 600; margin: 0;} .website_lms_h2 a{color: #878787;} .website_lms_h2 a:hover{color: #057BBA;} .css-name{height: 24px;} .body-training-material .material-title{background: #057bba; color: #fff; padding-left: 30px;} .body-training-material .material-warning, .material-content{padding: 0 20px;} .material-content .material-content-data .embed-responsive-item{height: 60vh;} .material-content .list-document{margin-top: -26px; height: 60vh;} .list-document .tab-content{height: 100%; overflow-x: auto;} .list-document .media-body a{border: 1px solid rgba(0, 0, 0, 0.1); min-height: 50px;} .css-button{margin-left: 15px;} .css-next{margin-right: 25px;} .course-instructor{padding: 5px 15px 15px; border-bottom: 1px solid #eee; overflow: hidden; line-height: 32px; font-style: italic; display: block; font-size: 14px; color: #888888;} .faculty-img{float: right;} .course-title{padding: 25px 15px 0 15px;} .course-price{padding: 12px 15px; border-bottom: 1px solid #eee; color: #057BBA; font-size: 20px;} .course-student{padding: 12px 15px; overflow: hidden; color: #888888; font-size: 14px;} .course-student .o_rating_card{display: inline-block; float: right;} .course-thumbnail{height: auto;} @media screen and (max-width: 300px){.course-thumbnail{height: 100%;}.learndash_course_review .o_rating_card{right: 32% !important;}} .course-derail-h1{font-size: 50px; margin-bottom: 30px; font-weight: 600; line-height: 1.25;} .nbt-category-name:before{content: "\f007"; display: block; float: left; font-family: 'Fontawesome'; line-height: 1; color: #cfcfcf; border: 1px solid #cfcfcf; padding: 8px; margin-right: 10px; height: 34px;} .nbt-date-price span{font-size: 15px; font-weight: bold; text-transform: uppercase; line-height: 1.5; color: white;} .total-lecture span{font-size: 15px; font-weight: bold; text-transform: uppercase; line-height: 1.5; color: white;} .nbt-date-lang span{font-size: 15px; font-weight: bold; text-transform: uppercase; line-height: 1.5; color: white;} .nbt-date-price:before{content: "\f155"; display: -webkit-box; display: -webkit-flex; display: flex; float: left; font-family: 'Fontawesome'; line-height: 1; color: #cfcfcf; border: 1px solid #cfcfcf; width: 30px; margin-right: 10px; justify-content: center; height: 34px; align-items: center;} .nbt-date-date:before{content: "\f251"; display: block; float: left; font-family: 'Fontawesome'; line-height: 1; color: #cfcfcf; border: 1px solid #cfcfcf; padding: 7px; margin-right: 10px;} .total-lecture:before{content: "\f201"; display: block; float: left; font-family: 'Fontawesome'; line-height: 1; color: #cfcfcf; border: 1px solid #cfcfcf; padding: 7px; margin-right: 10px;} .nbt-date-lang:before{content: "\f1ab"; display: block; float: left; font-family: 'Fontawesome'; line-height: 1; color: #cfcfcf; border: 1px solid #cfcfcf; padding: 7px; margin-right: 10px;} .learndash_course_review:before{content: "\f005"; display: block; float: left; font-family: 'Fontawesome'; line-height: 1; color: #cfcfcf; border: 1px solid #cfcfcf; padding: 7px; margin-right: 10px;} .learndash_course_review .o_rating_star_card .stars{color: white;} .learndash_course_review .o_rating_card{position: relative; right: 18%; padding-top: 5px;} .course-bg{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; justify-content: space-between;} .bg-img-info{display: -webkit-box; display: -webkit-flex; display: flex; justify-content: space-between;} .bg-img{height: 270px;} .learndash_course_info > div{position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; margin-top: 15px; margin-bottom: 15px; font-size: 16px; line-height: 2;} .learndash_course_info > div > span{display: block; font-size: 16px; font-weight: bold; text-transform: uppercase; color: white; overflow: hidden;} .nbt-category-name p{font-size: 15px; font-weight: bold; text-transform: uppercase; line-height: 1.5; color: white;} .category-info{color: #ffffff; display: -webkit-box; display: -webkit-flex; display: flex;} .learndash_course_tabs .nav-tabs.nav-justified > li.active > a{background: #057BBA; color: #fff !important;} .learndash_course_tabs .nav-tabs.nav-justified > li > a{background: #f3f3f3; color: #000; padding: 20px 15px; border-radius: 0; margin: 0 2px 10px;} .learndash_course_tabs .tab-pane{padding: 30px; background: #fafafa; line-height: 1.5;} .learndash_course_tabs .card-default{background: #888; color: #fff; -webkit-border-radius: 0; border-radius: 0; background-clip: padding-box; font-size: 16px; font-weight: 500; padding: 5px;} .learndash_course_tabs .card-default > .card-header{background-color: transparent; border-color: transparent; color: white;} .learndash_course_tabs .card-body{background: white; color: black; padding: 0px;} .learndash_course_tabs .card-body table tr{border-bottom: 1px solid black;} .learndash_course_tabs .card-body table tr td:first-child{padding: 8px; padding-left: 25px;} .learndash_course_tabs .card-body table tr:last-child{border-bottom: 0px;} .course_faculty_ids{border-bottom: 1px solid #888; padding-top: 36px; padding-bottom: 44px;} .course_faculty_ids:last-child{border-bottom: 0px;} .card-title a[data-toggle=collapse]:after{position: absolute; font-family: FontAwesome; left: 66px; line-height: 0; margin-top: 11px; color: #fff;} .card-title a[data-toggle=collapse]:before{position: absolute; content: "\f068"; font-family: FontAwesome; left: 66px; line-height: 0; margin-top: 11px; color: #fff;} .card-title a[data-toggle=collapse]:after{content: "\f067"; transform: scaleY(0); transition: transform .3s ease;} .card-title a[data-toggle=collapse].collapsed:after{transform: scaleY(1);} .learndash_course_tabs .course-detail-tab{white-space: nowrap; overflow: hidden; display: block; text-overflow: ellipsis;} @media screen and (max-width: 300px){.learndash_course_tabs .tab-pane{padding: 0px;}.card-title{font-size: 14px;}.card-title a[data-toggle=collapse]:before{left: 10%;}.card-title a[data-toggle=collapse]:after{left: 10%;}} .suggested-img img{height: auto;} .category-menu__item{cursor: pointer; display: inline-block; float: left; height: 100%; white-space: nowrap;} .category-menu__link--primary{color: rgba(0, 0, 0, 0.55); font-weight: 700; padding: 12px 11px 12px 4px;} .category-menu__link{font-size: 13px; text-decoration: none;} .category-menu__link ul#menu, .category-menu__link ol{height: 32px; max-width: 90%; overflow: hidden;} .category-menu__link ul#menu > li, .category-menu__link ol > li{display: block; float: left; height: 32px; white-space: nowrap; padding: 4px 8px;} .category-menu__link ol{position: relative; right: 0; top: 0; overflow: visible;} .category-menu__link ol > li{min-width: 120px;} .category-menu__link ol li ul > li{list-style: none; border-bottom: 1px solid gray; padding: 4px 8px;} .category-menu__link ol li ul > li:last-child{border-bottom: 0px;} #progressBar{background-color: #f3f3f3; height: 35px;} .progress-value{display: none !important;} #progressBar div{height: 100%; color: black; text-align: center; line-height: 35px; font-size: 18px; font-weight: bold; width: 0; background-color: #057BBA;} .material-right img{position: absolute; right: 10px; top: 18px; color: green; width: 15px; height: 10px;} completed_percentage_course:after{content: "\f295"; position: absolute; font-family: FontAwesome; left: 66px; line-height: 0; margin-top: 11px; color: black;} .img-header{background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; padding-top: 50px; padding-bottom: 50px;} .img-header{position: relative;} .img-header .container{position: relative;} .img-header:before{content: ""; display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(30, 30, 30, 0.36);} .ifram-width iframe{width: 100%; height: 497px;} .ifram-width video{width: 100%; height: 497px;} .ifram-width audio{width: 100%;} .embed-responsive-item audio{width: 100%;} #course-q-and-a .question-block{margin-bottom: 16px;} #course-q-and-a .question-name{font-size: 150%;} #course-q-and-a .question-block{margin-left: 0px;} #course-q-and-a .question-block .label-default{background-color: black;} .dyn-height{max-height: 419px; overflow-y: auto;} .lead__headline{font-size: 21px !important; line-height: 27px !important;} .text-overflow{width: 100%; display: block; overflow: hidden; word-break: break-word; word-wrap: break-word; margin-bottom: 0px;} .btn-overflow{display: none; text-decoration: none; color: #23527c;} .price_view p{font-size: 24px; font-weight: bold;} .page-item a{border: none;} .fa-angle-left:before{content: "\f104";} .fa-angle-right:before{content: "\f105";} .fa-angles-right:before{content: "\f101";} .fa-angles-left:before{content: "\f100";} .dp-none{display: none;} .my_lms_profile{background-color: #f0f0f0 !important; padding: 20px; padding-top: 25px; border-top: 1px solid #F8F8F8;} .my_lms_profile .card-bd-top{border-top: 3px solid #057BBA;} .my_lms_profile .tabs .tab-content{background-color: #FFF; position: relative;} .my_lms_profile .tabs .nav-tabs{background-color: #057BBA; border-bottom: none;} .my_lms_profile .tabs .nav-tabs > li.active > a, .my_lms_profile .tabs .nav-tabs > li.active > a:hover, .my_lms_profile .tabs .nav-tabs > li.active > a:focus{border: none; background: rgba(0, 0, 0, 0.2); color: #FFF;} .my_lms_profile .pd-20{padding: 20px !important;} .my_lms_profile .tabs .nav-tabs > li.active > a .menu-active, .my_lms_profile .tabs .nav-tabs > li.active > a:hover .menu-active, .my_lms_profile .tabs .nav-tabs > li.active > a:focus .menu-active{visibility: visible;} .my_lms_profile .tabs .nav-tabs > li > a .menu-active{width: 100%; position: absolute; bottom: -9px; left: 0; text-align: center; visibility: hidden; font-size: 16px;} .badges_style .content-list .menu-icon{display: block; float: left; width: 16px; text-align: center; font-size: 14px;} .badges_style .content-large .menu-icon{font-size: 24px; width: 100px; height: 100px;} .bg-big-course{background-image: url("/vti_training/static/src/img/bg-course.jpg"); background-size: 100% 100%; background-repeat: no-repeat;} .course-item{font-size: 20px; font-weight: 700;} .info-item{font-size: 16px; margin-left: 4px; line-height: 40px; color: #ffffff;} .list-faculty{display: block;} @media only screen and (max-width: 770px){.bg-big-course{background-color: #0d396a; background-image: none;}.course-derail-h1{font-size: 24px; margin-bottom: 8px; font-weight: 600; margin-left: 13px;}.course-item{font-size: 13px; line-height: 34px;}.info-item{font-size: 13px; color: #ffffff; line-height: 34px;}.learndash_course_info > div > span{font-size: 13px; color: white;}.mt48{margin-top: 16px !important;}.row{display: block;}.row .col{margin-bottom: 8px;}.hidden-document{top: 40px;}} .view-material{width: 100%; height: 100vh; background-color: #000000;} .iframe_viewer{position: relative;} .hidden-video{position: absolute; width: 100%; height: 80%; background-color: transparent; top: 0px;} .hidden-document{position: absolute; width: 100%; height: 20%; background-color: transparent; top: 0px;} .training-iframe-fullscreen{position: fixed !important; z-index: 99999 !important; top: 0px !important; left: 0px !important; margin: 0px !important; width: 100% !important; height: 100% !important;} #training-icon-fullscreen-iframe{position: absolute; z-index: 100000; right: 20px; top: 10px; width: 32px; height: 32px; background-color: transparent;} #training-icon-fullscreen-iframe .icon-open{width: 32px; height: 32px; cursor: pointer;} #training-icon-fullscreen-iframe .icon-open:hover{transform: scale(1.1);} #training-icon-fullscreen-iframe .icon-close{z-index: 100005; position: fixed; width: 32px; height: 32px; cursor: pointer; display: none;} #training-icon-fullscreen-iframe .icon-close{right: 25px; top: 10px;} #training-icon-fullscreen-iframe .icon-close:hover{transform: scale(1.1);} 

/* /website_slides/static/src/scss/website_slides.scss defined in bundle 'web.assets_frontend' */
 .oe_slides_panel_footer .fa, .oe_slide_js_embed_option_link{color: #00A09D; cursor: pointer;} .oe_slide_embed_option{position: absolute; padding: 30px 30px 30px 30px; top: 0px; left: 0px; right: 0px; bottom: 0px; background-color: #FFFFFF; opacity: 1; display: none; overflow-y: auto !important;} .oe_slide_embed_wrapper{position: relative;} section.oe_slides_promote_box{background-color: #f5f5f5; border-bottom: 1px solid #dee2e6; border-top: 1px solid #dee2e6;} img.oe_slides_channel_thumbnail{object-fit: cover; object-position: top; height: 250px; width: 100%;} img.oe_slides_opacity{opacity: .5;} img.oe_slides_promote_image{object-fit: cover; object-position: top; max-height: 300px; width: 100%; overflow: hidden; display: block;} .oe_slides_box_shadow{box-shadow: 0 0 5px #CCC;} .oe_slides_apart_small{object-fit: cover; object-position: top; height: 60px; width: 90px;} .oe_slides_statistics_title{border-bottom: 1px solid #dee2e6; padding-bottom: 5px;} .oe_slides_transcript{overflow-y: auto; max-height: 500px;} .oe_slides_bottom_border{border-bottom: 1px solid #dee2e6;} .oe_slide_js_like, .oe_slide_js_unlike{cursor: pointer; color: #00A09D;} textarea.o_slides_comment{resize: vertical;} .oe_slides_grid_thumbnail{object-fit: cover; object-position: top; height: 200px; width: 100%; overflow: hidden;} .oe_slides_ellipsis{white-space: nowrap; width: 100%; overflow: hidden; text-overflow: ellipsis;} .o_slide_preview{max-height: 160px; overflow: hidden;} .oe_slides_suggestion_caption{position: absolute; top: 0; right: 0; background: rgba(10, 10, 10, 0.75); width: 100%; height: 100%; display: none; text-align: center; color: #fff !important; z-index: 2;} .oe_slides_suggestion_media{margin-top: 10px; position: relative;} .oe_slides_suggestion_media img{height: 33%; width: 100%; overflow: hidden;} .oe_slides_loader{position: relative; width: 100%;} .oe_slides_loader h4{position: absolute; bottom: 20px; left: 0; width: 35%; color: white; background: black; background: rgba(0, 0, 0, 0.7); padding: 10px;} .oe_slides_share_bar{padding: 10px 0;} .oe_slides_panel_footer #page_number{width: 45px;} .oe_show_footer{z-index: 2147483647;} 

/* /website_links/static/src/css/website_links.css defined in bundle 'web.assets_frontend' */
.no-link-style{color: black; text-decoration: none;} .required-form-control{background-color: #CECDFF;} #filters li a, #filters li.active a, #filters li.active a.active, #filters li.active a:hover, #filters li.active a:focus, #filters li a:hover{padding: 0px 5px; border-radius: 0px; border: 0px; border-color: transparent; border-right: 1px solid #999; padding-bottom: 0; background-color: #FFFFFF;} #filters li.active a{color: #999;} #filters li:last-child a, #filters li:last-child a:hover, #filters li:last-child a:focus{border-right: 0px;} .nav-tabs-inline{font-size: 14px;} #o_website_links_recent_links{min-height:30em;} .o_website_links_code_error{display:none; color:red; font-weight:bold;} .truncate_text{white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 500px;} 

/* /mass_mailing/static/src/css/mass_mailing_popup.css defined in bundle 'web.assets_frontend' */
 .editor_enable [data-oe-placeholder]:empty:not(:focus):before{content: " \00a0 " attr(data-oe-placeholder); opacity: 0.4;} .o_popup_animated{-webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both;} @-webkit-keyframes o_popup_bounce_small{0%, 20%, 53%, 80%, 100%{-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}40%, 43%{-webkit-transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -14px, 0); transform: translate3d(0, -14px, 0);}70%{-webkit-transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -8px, 0); transform: translate3d(0, -8px, 0);}90%{-webkit-transform: translate3d(0, -2px, 0); transform: translate3d(0, -2px, 0);}} @keyframes o_popup_bounce_small{0%, 20%, 53%, 80%, 100%{-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}40%, 43%{-webkit-transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -14px, 0); transform: translate3d(0, -14px, 0);}70%{-webkit-transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -8px, 0); transform: translate3d(0, -8px, 0);}90%{-webkit-transform: translate3d(0, -2px, 0); transform: translate3d(0, -2px, 0);}} .o_popup_bounce_small{-webkit-animation-name: o_popup_bounce_small; animation-name: o_popup_bounce_small; -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom;} .o_popup_bounce_del500ms{-webkit-animation-delay: 500ms; animation-delay: 500ms;} #o_newsletter_popup .btn.btn-success{color: #ffffff; background-color: #21b799; border-color: #1da187;} #o_newsletter_popup .btn.btn-success:hover, #o_newsletter_popup .btn.btn-success:focus, #o_newsletter_popup .btn.btn-success.focus, #o_newsletter_popup .btn.btn-success:active, #o_newsletter_popup .btn.btn-success.active, .open > .dropdown-toggle#o_newsletter_popup .btn.btn-success{color: #ffffff; background-color: #198c75; border-color: #146e5c;} #o_newsletter_popup .btn.btn-success:active, #o_newsletter_popup .btn.btn-success.active, .open > .dropdown-toggle#o_newsletter_popup .btn.btn-success{background-image: none;} #o_newsletter_popup .btn.btn-success.disabled, #o_newsletter_popup .btn.btn-success[disabled], fieldset[disabled] #o_newsletter_popup .btn.btn-success, #o_newsletter_popup .btn.btn-success.disabled:hover, #o_newsletter_popup .btn.btn-success[disabled]:hover, fieldset[disabled] #o_newsletter_popup .btn.btn-success:hover, #o_newsletter_popup .btn.btn-success.disabled:focus, #o_newsletter_popup .btn.btn-success[disabled]:focus, fieldset[disabled] #o_newsletter_popup .btn.btn-success:focus, #o_newsletter_popup .btn.btn-success.disabled.focus, #o_newsletter_popup .btn.btn-success[disabled].focus, fieldset[disabled] #o_newsletter_popup .btn.btn-success.focus, #o_newsletter_popup .btn.btn-success.disabled:active, #o_newsletter_popup .btn.btn-success[disabled]:active, fieldset[disabled] #o_newsletter_popup .btn.btn-success:active, #o_newsletter_popup .btn.btn-success.disabled.active, #o_newsletter_popup .btn.btn-success[disabled].active, fieldset[disabled] #o_newsletter_popup .btn.btn-success.active{background-color: #21b799; border-color: #1da187;} #o_newsletter_popup h1, #o_newsletter_popup h2, #o_newsletter_popup h3, #o_newsletter_popup h4, #o_newsletter_popup h5, #o_newsletter_popup h6, #o_newsletter_popup .h1, #o_newsletter_popup .h2, #o_newsletter_popup .h3, #o_newsletter_popup .h4, #o_newsletter_popup .h5, #o_newsletter_popup .h6{font-weight: 300; color: #666; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;} #o_newsletter_popup h1:first-child, #o_newsletter_popup h2:first-child, #o_newsletter_popup h3:first-child, #o_newsletter_popup h4:first-child, #o_newsletter_popup h5:first-child, #o_newsletter_popup h6:first-child, #o_newsletter_popup .h1:first-child, #o_newsletter_popup .h2:first-child, #o_newsletter_popup .h3:first-child, #o_newsletter_popup .h4:first-child, #o_newsletter_popup .h5:first-child, #o_newsletter_popup .h6:first-child{margin-top: 0;} #o_newsletter_popup .o_popup_modal_content{border-radius: 2px; box-shadow: 0 0 20px rgba(255, 255, 255, 0.11); -webkit-box-shadow: 0 0 20px rgba(255, 255, 255, 0.11); border: 1px solid #767676; background: #f2f2f2;} #o_newsletter_popup .o_popup_modal_content:before{content: ""; position: absolute; width: 100%; height: 100%; z-index: 0; background: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 42%, rgba(255, 255, 255, 0) 100%); background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(255, 255, 255, 0.3)), color-stop(42%, rgba(255, 255, 255, 0)), color-stop(100%, rgba(255, 255, 255, 0))); background: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 42%, rgba(255, 255, 255, 0) 100%); background: -o-linear-gradient(-45deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 42%, rgba(255, 255, 255, 0) 100%); background: -ms-linear-gradient(-45deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 42%, rgba(255, 255, 255, 0) 100%); background: linear-gradient(135deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 42%, rgba(255, 255, 255, 0) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#00ffffff', GradientType=1);} #web_editor_inside_iframe #o_newsletter_popup .o_popup_modal_content:before{content: none;} #o_newsletter_popup .o_popup_modal_content .o_popup_modal_header{background: #6c1153; padding: 5px;} #o_newsletter_popup .o_popup_modal_content .o_popup_modal_header .o_popup_modal_title{color: #ffffff;} #o_newsletter_popup .o_popup_modal_content .o_popup_modal_header *{position: relative; z-index: 1;} #o_newsletter_popup .o_popup_modal_content a.o_popup_btn_close{position: absolute; z-index: 99; right: 5px; top: 6px; width: 23px; height: 23px; display: block; text-align: center; border-radius: 100em; background: #6c1153; color: #daa3cb; text-decoration: none; -webkit-transition: all ease 200ms; -moz-transition: all ease 200ms; -ms-transition: all ease 200ms; -o-transition: all ease 200ms;} #o_newsletter_popup .o_popup_modal_content a.o_popup_btn_close:hover{background: #89296e; color: #ffffff;} #o_newsletter_popup .o_popup_modal_content .o_popup_modal_body{padding: 0px 0px 30px; color: #666666;} #o_newsletter_popup .o_popup_modal_content .o_popup_modal_body .o_popup_content_dev{padding-bottom: 15px;} #o_newsletter_popup .o_popup_modal_content .o_popup_modal_body .o_popup_content_dev .o_popup_message{font-size: 3em; position: relative; text-align: left; padding-left: 2em; line-height: 1; margin: .5em; font-weight: 100;} #o_newsletter_popup .o_popup_modal_content .o_popup_modal_body .o_popup_content_dev .o_popup_message font{font-weight: 600; color: #875A7B; font-size: 2.5em; font-style: italic; position: absolute; top: -0.1em; margin-left: -0.65em;} #o_newsletter_popup .o_popup_modal_content .o_popup_modal_body .o_popup_content_dev .o_popup_message strong{color: #875A7B;} #o_newsletter_popup .o_popup_modal_content .o_popup_modal_body .o_popup_content_dev .o_message_paragraph{position: relative;} #o_newsletter_popup .o_popup_modal_content .o_popup_modal_body .input-group{margin-left: auto; margin-right: auto; max-width: 350px;} #o_newsletter_popup .o_popup_modal_content .o_popup_modal_body .input-group input{border-radius: 2px 0 0 2px; border: none; outline: 0; box-shadow: inset 0 -1px #cccccc;} #o_newsletter_popup .o_popup_modal_content .o_popup_modal_body .input-group .btn{border-radius: 0 2px 2px 0; border-width: 0 0 1px; padding-top: 7px; margin-left: -1px; -webkit-transition: all ease 200ms; -moz-transition: all ease 200ms; -ms-transition: all ease 200ms; -o-transition: all ease 200ms;} 

/* /auth_oauth/static/src/scss/auth_oauth.scss defined in bundle 'web.assets_frontend' */
 .o_auth_oauth_providers .fa-facebook-square{color: #3b5998;} .o_auth_oauth_providers .fa-google-plus-square{color: #de564a;} .o_auth_oauth_providers .o_custom_icon{margin: 0 0.15em; width: 1em; height: 1em; border: 3px solid #875A7B; border-radius: 100%; transform: translateY(2px);} 

/* /project/static/src/scss/portal_rating.scss defined in bundle 'web.assets_frontend' */
 .o_portal_project_rating .thumbnail{height: 240px;} .o_portal_project_rating .o_top_partner_rating_image{height: 15px;} .o_portal_project_rating .o_top_partner_image{height: 30px; width: 30px;} .o_portal_project_rating .o_top_partner_feedback{word-wrap: break-word;} .o_portal_project_rating .o_vertical_separator{border-left: 1px solid #eeeeee;} .o_portal_project_rating .o_rating_progress{margin-bottom: 10px;} .o_portal_project_rating .o_rating_count{display: inline-block; min-width: 22px;} .o_portal_project_rating .o_smiley_no_padding_left{padding-left: 0;} .o_portal_project_rating .o_smiley_no_padding_right{padding-right: 0;} .o_portal_project_rating .o_lighter_smileys{opacity: 0.4;} 

/* /payment/static/src/scss/portal_payment.scss defined in bundle 'web.assets_frontend' */
 input#cc_number{background-repeat: no-repeat; background-position: 14px 14px;} div.card_placeholder{background-image: url("/website_payment/static/src/img/placeholder.png"); background-repeat: no-repeat; width: 32px; height: 20px; position: absolute; top: 8px; right: 20px; -webkit-transition: 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955); pointer-events: none;} div.o_card_brand_detail{position: relative;} div.o_card_brand_detail div.card_placeholder{right: 5px;} div.amex{background-image: url("/website_payment/static/src/img/amex.png"); background-repeat: no-repeat;} div.diners{background-image: url("/website_payment/static/src/img/diners.png"); background-repeat: no-repeat;} div.discover{background-image: url("/website_payment/static/src/img/discover.png"); background-repeat: no-repeat;} div.jcb{background-image: url("/website_payment/static/src/img/jcb.png"); background-repeat: no-repeat;} div.mastercard{background-image: url("/website_payment/static/src/img/mastercard.png"); background-repeat: no-repeat;} div.visa{background-image: url("/website_payment/static/src/img/visa.png"); background-repeat: no-repeat;} ul.payment_method_list img.rounded{max-width: 100px; max-height: 40px;} 

/* /payment/static/src/scss/payment_form.scss defined in bundle 'web.assets_frontend' */
 .o_payment_form label > input[type="radio"], .o_payment_form input[type="checkbox"]{vertical-align: middle; margin-right: 5px;} .o_payment_form .payment_option_name{font-size: 14px; font-weight: normal !important; font-family: Helvetica Neue, sans-serif; line-height: 1.3em; color: #4d4d4d;} .o_payment_form label{font-weight: normal; margin-top: 5px;} .o_payment_form .card-body:first-child{border-top: 0px;} .o_payment_form .card{border-radius: 10px;} .o_payment_form .card-footer:last-child{border-bottom-right-radius: 10px !important; border-bottom-left-radius: 10px !important;} .o_payment_form .card-body{border-top: 1px solid #ddd; padding: 1.14em !important;} .o_payment_form .payment_icon_list{position: relative; margin-top: 0px !important; margin-bottom: -5px !important;} .o_payment_form .payment_icon_list li{padding-left: 5px !important; padding-right: 0px !important;} .o_payment_form .payment_icon_list .more_option{position: absolute; top: auto; left: auto; bottom: auto; right: 10px; font-size: 10px;} 

/* /sale/static/src/scss/sale_portal.scss defined in bundle 'web.assets_frontend' */
 .orders_vertical_align{display: -webkit-box; display: -webkit-flex; display: flex; align-items: center;} .orders_label_text_align{vertical-align: 15%;} .sale_tbody .o_line_note{word-break: break-word; word-wrap: break-word; overflow-wrap: break-word;} .sale_tbody input.js_quantity{min-width: 48px; text-align: center;} .sale_tbody input.quantity{padding: 0;} 

/* /vti_training/static/src/scss/fontend.css defined in bundle 'web.assets_frontend' */
.btn-primary-trainning{color: #fff !important; background-color: #007bff; border-color: #007bff;} .btn-primary-trainning:hover{color: #fff !important; background-color: #007bff; border-color: #007bff;} 

/* /vti_training/static/src/scss/forum.css defined in bundle 'web.assets_frontend' */
.forum-container-div{margin-bottom: 10px; margin-top: 10px; height: auto;} .btn-forum-common{background-color: #057BBA; color: #fff;} .question{width: 100%; height: auto;} .ex-one-page{max-width: 50%; margin-left: 10%;} @media only screen and (max-width: 770px){.ex-one-page{max-width: 100%; margin-left: 0px;}} 

/* /vti_training/static/src/scss/carousel_course.css defined in bundle 'web.assets_frontend' */
 .training-banner{padding: 32px 24px 32px 24px; align-items: center; justify-content: center; background: rgb(190,194,195,0.2); max-width: 1200px; margin-bottom: 40px;} .training-banner-title{display: flex; justify-content: space-between;} .training-banner-img{margin: 24px 0} .training-banner-img .img-fluid{width: 100%; height: 280px} .link-learning-path{font-weight: 700; color: #0050AE !important; font-size: 18px;} .lp-title{font-weight: 700; font-size: 24px; color: #222;} .wrapper{align-items: center; justify-content: center; display: flex; max-width: 1200px; position: relative; padding: 0 32px;} .wrapper .arrow__btn{position: absolute; color: #fff; text-decoration: none; font-size: 6em; background:rgb(0,0,0); width: 80px; padding: 20px; text-align: center; z-index: 1;} .wrapper .left-arrow{top:0; bottom:0; left:0; background: linear-gradient(-90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);} .wrapper .training-carousel-icon-row{top: 50%; height: 24px; width: 24px; cursor: pointer; position: absolute; text-align: center; transform: translateY(-50%); transition: transform 0.1s linear;} .wrapper .training-carousel-icon-row:active{transform: translateY(-50%) scale(0.9);} .wrapper .training-carousel-icon-row:hover{background: #f2f2f2;} .wrapper .training-carousel-icon-row:first-child{left: 0px; display: none;} .wrapper .training-carousel-icon-row:last-child{right: 0px;} .wrapper .carousel{font-size: 0px; cursor: pointer; overflow: hidden; scroll-behavior: smooth; display: flex;} .carousel.dragging{cursor: grab; scroll-behavior: auto;} .carousel.dragging .card-body{pointer-events: none;} .carousel .card-body{height: 225px; object-fit: cover; user-select: none; margin-left: 30px; min-width: 242px !important;} .carousel .card-body .course-thumbnail{height: 190px; width: 242px;} .carousel .card-body .course-thumbnail img{height: 100%; width: 100%;} .carousel .card-body .course-title img{height: 100%; width: 100%;} .carousel .card-body:first-child{margin-left: 0px;} @media screen and (max-width: 900px){.carousel img{width: calc(100% / 2);}} @media screen and (max-width: 550px){.carousel img{width: 100%;}} 

/* /vti_training/static/src/scss/icon_social.css defined in bundle 'web.assets_frontend' */
.btn-contact-fixed{position:fixed; z-index:2; bottom:150px; right:24px; display:flex; flex-direction:column;} .btn-call-fixed .icon-wrap{float:left; position:relative; z-index:1; width:32px; height:32px; box-shadow:0 0 0 2px rgba(255,255,255,.8); border-radius:50%;} .btn-call-fixed .icon-wrap img{border-radius:50%;} .btn-call-fixed .btn-text{display:none; float:left; padding:5px 20px; font-size:13px; font-weight:bold; line-height:22px; border-radius:999px; background:#fff; box-shadow:0 0 6px rgba(0,0,0,.1); position:absolute; z-index:1; top:0; right:calc(100%); white-space:nowrap;} .btn-call-fixed:hover .btn-text{display: block;} .btn-call-fixed{margin-bottom:10px; position: relative;} 

/* /vti_it_helpdesk/static/src/css/website_helpdesk.css defined in bundle 'web.assets_frontend' */
.cen-form-rating{margin-top: 50px;} .form-rating{width: 480px; height: 250px; background-color: #FFFFFF; box-shadow: 0px 3px 12px #888888; padding: 30px 40px;} .text-rating{width: 100%;} .text-rating h2{font-size: 24px; font-weight: bold;} .text-form-rating{font-size: 16px;} .checked{color: #ffe000 !important;} .text-ra-star{display: flex; width: 100%; height: auto; margin-bottom: 20px; justify-content: center;} .form-rating .ra-star{height: 50px; display: flex; justify-content: center; margin-bottom: 10px;} .form-rating .ra-star .star-item{display: flex; flex-direction: column; margin-right: 24px; width: auto; justify-content: center; align-items: center;} .star-hd{color:#ccc; font-size: 28px;} 

/* /vti_mypage/static/src/css/style.css defined in bundle 'web.assets_frontend' */


/* /vti_mypage/static/src/css/employee-page.css defined in bundle 'web.assets_frontend' */
.page__container{background-color: #f9f9f9 !important;} .page__body{display: flex; padding: 30px 24px 0 48px;} .left-section{width: 25%; padding-right: 30px;} .right-section{width: 30%; padding-left: 30px; margin-top: -20px;} .main-section{width: 45%;} .main__container{width: 100%; background: #ffffff; border: 1px solid rgba(231, 236, 239, 0.5); border-radius: 6px; padding: 24px 32px;} .header__container{background-color: #0050ae;} .header__container .navbar-nav .nav-item{padding: 0 16px;} .header__logo{padding: 10px 0; margin-left: 54px;} .header__item{border-right: 1px solid #8aa8cb; height: 32px;} .header__text{color: white !important; font-size: 12px; font-weight: 500;} .header__text:hover{color: yellow !important;} .has-sub > a::after{margin-left: 10px; content: "\f107"; font-family: "FontAwesome"; font-style: normal; font-weight: normal; text-decoration: inherit; font-size: 14px; transform: translateY(-50%);} .request{margin: 50px auto; width: 100%;} .request__title{display: flex; align-items: center; padding: 0 3px;} .request__title span{font-size: 16px; font-weight: 700; color: #212529; text-transform: uppercase; margin-left: 16px;} .request__card{background-color: #fff; margin-top: 20px; border: 1px solid rgba(231, 236, 239, 0.5); border-radius: 6px;} .request__card__header{display: flex; align-items: center; border-bottom: 1px solid rgba(231, 236, 239, 0.5);} .request__card__header__element{display: flex; padding: 12px 0; margin-left: 19px; margin-right: 5px;} .request__card__header__element a{display: flex; color: #666666; font-size: 14px; font-weight: 400;} .request__card__header__element a:hover{text-decoration: none;} .request__card__header__element a.active{color: #0391e8; font-weight: 700; position: relative;} .request__card__header__element a.active::after{content: ""; position: absolute; bottom: -12px; width: 100%; height: 2px; background: #0391e8;} .request__card__header__element a div{width: 24px; height: 24px; background: #cccccc; border-radius: 24px; display: flex; justify-content: center; align-items: center; margin-left: 8px;} .request__card__header__element a.active div{background: #0391e8;} .request__card__header__element div span{color: #fff; font-size: 11px; font-weight: 700;} .request__card__body__element{margin: 16px;} .request__card__body__element__content{padding-bottom: 8px;} .request__card__body__element__content__notification{font-size: 14px; color: #121212; font-weight: 400;} .request__card__body__element__content__status-btn{display: inline-block; width: 6px; height: 6px; background-color: #cccccc; border-radius: 100%; margin: 1px;} .request__card__body__element__content__time{font-size: 14px; color: #666666; font-weight: 400;} .request__card__body__element__break-line{width: 100%; padding: 0 3px; height: 1px; background-color: #e7ecef;} .user-info{width: 100%;} .user-info__summary{padding: 0 3px;} .user-info__summary img{max-width: 128px; max-height: 128px; border-radius: 6px;} .user-info__summary__contract__name{font-weight: 700; font-size: 14px; color: #212529;} .user-info__summary__contract__infomation span{margin-left: 8px; font-size: 14px; font-weight: 400; color: #666666;} .btn.user-info__my-info-btn--btn-cusom{width: 100%; line-height: 22px; margin-top: 35px; padding: 13px 0; background: linear-gradient(90.75deg, #0391e8 1.76%, #0050ae 100%); border-radius: 6px; border: none; color: #fff; font-weight: 700; font-size: 14px;} .user-info__my-info-btn--btn-cusom:hover{color: #fff!important;} .overview__container{width: 100%; padding: 0 15px;} .overview__wrapper{background: #ffffff; border: 0.5px solid rgba(231, 236, 239, 0.5); box-shadow: 8px 8px 8px rgba(140, 140, 140, 0.03); border-radius: 8px; overflow: hidden;} .overview__item{padding: 16px 16px 20px 24px; border: 0.5px solid rgba(231, 236, 239, 0.5);} .overview__item-title{font-style: normal; font-weight: 400; font-size: 14px; line-height: 22px; color: #666666;} .overview__arrow-right{margin-top: -2px; margin-left: 8px;} .overview__item-value{font-style: normal; font-weight: 700; font-size: 16px; line-height: 24px; color: #212529;} .notification{margin-top: 32px; background-color: #0391e8; border-radius: 6px; width: 100%; padding: 16px 24px 0 24px; display: flex; justify-content: space-between;} .notification__content{color: #fff;} .notification__content__title{font-size: 16px; font-weight: 700; line-height: 24px;} .notification__content__list{margin: 16px 0; font-size: 14px; line-height: 22px;} .dashboard{margin-top: 32px; width: 100%;} .dashboard__title{color: #0050ae; font-size: 20px; font-weight: 700;} .dashboard__news{margin-top: 32px;} .dashboard__news__content-new1{flex: 0.5;} .dashboard__news__content-new1 img{width: 32px; height: 32px;} .dashboard__news__content-new1 .title{font-size: 14px; color: #666666; font-weight: 400;} .dashboard__news__content-new1 .subtitle{font-weight: 700; color: #212529;} .dashboard__news__content-new2{flex: 0.5;} .dashboard__news__content-new2__lable img{width: 32px; height: 32px;} .dashboard__news__content-new2__lable span{text-transform: capitalize; color: #212529; font-weight: 700; margin-left: 16px;} .dashboard__news__contents-new2__schedule{margin: 12px 0; padding-left: 30px;} .dashboard__news__contents-new2__schedule li{font-size: 14px; color: #212529; text-transform: capitalize;} .dashboard__news__overview-card{width: 100%; background: #f9f9f9; border: 1px solid rgba(231, 236, 239, 0.5); border-radius: 6px; padding: 16px 0; margin-top: 20px;} .dashboard__news__overview-card__element{justify-content: center; flex: 0.333;} .dashboard__news__overview-card__element div .title{color: #666666; font-size: 14px;} .dashboard__news__overview-card__element div .value{font-size: 24px; font-weight: 700; line-height: 22px;} .dashboard__level-skill{margin-top: 32px; width: auto;} .dashboard__level-skill__title{font-weight: 700; line-height: 24px; color: #212529;} .table__container{width: 100%; overflow: hidden;} .table-wrapper{width: 100%; overflow: hidden;} .table-header{background-color: #f9f9f9; padding: 1px 1px 0; border: 1px solid rgba(231, 236, 239, 0.5); border-radius: 6px 6px 0px 0px; overflow: hidden;} .table-wrapper tbody{padding: 0 1px 1px; border: 1px solid rgba(231, 236, 239, 0.5); border-radius: 0px 0px 6px 6px; overflow: hidden;} .table-wrapper td, .table-wrapper th{border: 0.5px solid rgba(231, 236, 239, 0.5); text-align: left; padding: 16px 0; padding-left: 32px; font-size: 14px; line-height: 22px;} .dashboard__chart-rate{margin-top: 32px;} .dashboard__chart-rate__title{font-weight: 700; line-height: 24px;} .group__wrapper{width: 100%; margin-bottom: 0.75rem;} .group__wrapper[aria-expanded="false"]{border-bottom: 1px solid rgba(231, 236, 239, 0.5); padding: 20px 0;} .group__wrapper[aria-expanded="true"]{padding: 20px 0 8px; border: none;} .group__left{text-align: center;} .group__title{margin: 0; padding: 0; font-family: "Inter"; font-style: normal; font-weight: 700; font-size: 14px; line-height: 24px; color: #212529; text-transform: uppercase;} .group__icon-btn{margin-left: 20px; width: 24px; height: 24px; border: none; background-color: transparent;} .group__icon-btn .group__icon-up{display: block;} .group__icon-btn .group__icon-down{display: none;} .group__wrapper[aria-expanded="false"] .group__icon-btn .group__icon-up{display: none;} .group__wrapper[aria-expanded="false"] .group__icon-btn .group__icon-down{display: block;} .services__container{width: 100%; background: #ffffff; border: 1px solid rgba(231, 236, 239, 0.5); box-shadow: 8px 8px 8px rgba(140, 140, 140, 0.03); border-radius: 6px;} .services__wrapper{width: 100%;} .service__container{width: fit-content;} .service__title{font-style: normal; font-weight: 500; font-size: 14px; line-height: 22px; color: #212529; text-align: center;} ::-webkit-scrollbar{width: 5px;} ::-webkit-scrollbar-track{background: #f1f1f1;} ::-webkit-scrollbar-thumb{background: #888;} ::-webkit-scrollbar-thumb:hover{background: #555;} 

/* /vti_mypage/static/src/css/pm_leader-page.css defined in bundle 'web.assets_frontend' */
.page__container{font-family: "Inter", sans-serif;} .page__container{background-color: #f9f9f9 !important;} .page__body{display: flex; padding: 30px 24px 0 48px;} .left-section{width: 25%; padding-right: 30px;} .right-section{width: 30%; padding-left: 30px; margin-top: -20px;} .main-section{width: 45%;} .main__container{width: 100%; background: #ffffff; border: 1px solid rgba(231, 236, 239, 0.5); border-radius: 6px; padding: 24px 32px;} .header__container{background-color: #0050ae;} .header__container .navbar-nav .nav-item{padding: 0 16px;} .header__logo{padding: 10px 0; margin-left: 54px;} .header__item{border-right: 1px solid #8aa8cb; height: 32px;} .header__text{color: white !important; font-size: 12px; font-weight: 500;} .header__text:hover{color: yellow !important;} .has-sub > a::after{margin-left: 10px; content: "\f107"; font-family: "FontAwesome"; font-style: normal; font-weight: normal; text-decoration: inherit; font-size: 14px; transform: translateY(-50%);} .request{margin: 50px auto; width: 100%;} .request__title{display: flex; align-items: center; padding: 0 3px;} .request__title span{font-size: 16px; font-weight: 700; color: #212529; text-transform: uppercase; margin-left: 16px;} .request__card{background-color: #fff; margin-top: 20px; border: 1px solid rgba(231, 236, 239, 0.5); border-radius: 6px;} .request__card__header{display: flex; align-items: center; border-bottom: 1px solid rgba(231, 236, 239, 0.5);} .request__card__header__element{display: flex; padding: 12px 0; margin-left: 19px; margin-right: 5px;} .request__card__header__element a{display: flex; color: #666666; font-size: 14px; font-weight: 400;} .request__card__header__element a:hover{text-decoration: none;} .request__card__header__element a.active{color: #0391e8; font-weight: 700; position: relative;} .request__card__header__element a.active::after{content: ""; position: absolute; bottom: -12px; width: 100%; height: 2px; background: #0391e8;} .request__card__header__element a div{width: 24px; height: 24px; background: #cccccc; border-radius: 24px; display: flex; justify-content: center; align-items: center; margin-left: 8px;} .request__card__header__element a.active div{background: #0391e8;} .request__card__header__element div span{color: #fff; font-size: 11px; font-weight: 700;} .request__card__body{height: auto; max-height: 360px; overflow-y: auto;} .request__card__body__element{margin: 16px;} .request__card__body__element__content{padding-bottom: 8px;} .request__card__body__element__content__notification{font-size: 14px; color: #121212; font-weight: 400;} .request__card__body__element__content__status-btn{display: inline-block; width: 6px; height: 6px; background-color: #cccccc; border-radius: 100%; margin: 1px;} .request__card__body__element__content__time{font-size: 14px; color: #666666; font-weight: 400;} .request__card__body__element__break-line{width: 100%; padding: 0 3px; height: 1px; background-color: #e7ecef;} .task-list__container{margin: 50px auto; width: 100%;} .task-list__title{display: flex; align-items: center; padding: 0 3px;} .task-list__title span{font-size: 16px; font-weight: 700; color: #212529; text-transform: uppercase; margin-left: 16px;} .task-list__body{margin-top: 16px; width: 100%; height: auto; max-height: 342px; overflow-y: auto; background-color: #ffffff; border: 1px solid rgba(231, 236, 239, 0.5); border-radius: 6px;} .task-list__list{padding: 12px 16px 12px 22px;} .task-list__item{padding: 16px 0 12px; border-bottom: 1px solid rgba(231, 236, 239, 0.5);} .task-list__item:last-child{border: none;} .task-list__icon{height: 22px;} .task-list__p{margin-bottom: 0; padding-top: 2px; margin-left: 8px; font-weight: 400; font-size: 14px; line-height: 22px; color: #212529;} .user-info{width: 100%;} .user-info__summary{padding: 0 3px;} .user-info__summary img{max-width: 128px; max-height: 128px; border-radius: 6px;} .user-info__summary__contract__name{font-weight: 700; font-size: 14px; color: #212529;} .user-info__summary__contract__infomation span{margin-left: 8px; font-size: 14px; font-weight: 400; color: #666666;} .btn.user-info__my-info-btn--btn-cusom{width: 100%; line-height: 22px; margin-top: 35px; padding: 13px 0; background: linear-gradient(90.75deg, #0391e8 1.76%, #0050ae 100%); border-radius: 6px; border: none; color: #fff; font-weight: 700; font-size: 14px;} .user-info__my-info-btn--btn-cusom:hover{color: #fff!important;} .overview__container{width: 100%; padding: 0 15px;} .overview__wrapper{background: #ffffff; border: 0.5px solid rgba(231, 236, 239, 0.5); box-shadow: 8px 8px 8px rgba(140, 140, 140, 0.03); border-radius: 8px; overflow: hidden;} .overview__item{padding: 16px 16px 20px 24px; border: 0.5px solid rgba(231, 236, 239, 0.5);} .overview__item-title{font-style: normal; font-weight: 400; font-size: 14px; line-height: 22px; color: #666666;} .overview__arrow-right{margin-top: -2px; margin-left: 8px;} .overview__item-value{font-style: normal; font-weight: 700; font-size: 16px; line-height: 24px; color: #212529;} .notification{margin-top: 32px; background-color: #0391e8; border-radius: 6px; width: 100%; padding: 16px 24px 0 24px; display: flex; justify-content: space-between;} .notification__content{color: #fff;} .notification__content__title{font-size: 16px; font-weight: 700; line-height: 24px;} .notification__content__list{margin: 16px 0; font-size: 14px; line-height: 22px;} .dashboard{margin-top: 32px; width: 100%;} .dashboard-nav{border-bottom: 1px solid #fafafa !important;} .dashboard-nav li a{color: #666666; font-weight: 500; font-size: 14px; line-height: 22px; text-decoration: none; margin-right: 32px;} .dashboard-nav li a.active{color: #0050ae; font-size: 20px; position: relative;} .dashboard-nav li a.active::after{content: ""; position: absolute; bottom: -12px; left: 0; width: 100%; height: 2px; background: #0391e8;} .dashboard__news{margin-top: 32px;} .dashboard__news__content-new1{flex: 0.5;} .dashboard__news__content-new1 img{width: 32px; height: 32px;} .dashboard__news__content-new1 .title{font-size: 14px; color: #666666; font-weight: 400;} .dashboard__news__content-new1 .subtitle{font-weight: 700; color: #212529;} .dashboard__news__content-new2{flex: 0.5;} .dashboard__news__content-new2__lable img{width: 32px; height: 32px;} .dashboard__news__content-new2__lable span{text-transform: capitalize; color: #212529; font-weight: 700; margin-left: 16px;} .dashboard__news__contents-new2__schedule{margin: 12px 0; padding-left: 30px;} .dashboard__news__contents-new2__schedule li{font-size: 14px; color: #212529; text-transform: capitalize;} .dashboard__news__overview-card{width: 100%; background: #f9f9f9; border: 1px solid rgba(231, 236, 239, 0.5); border-radius: 6px; padding: 16px 0; margin-top: 20px;} .dashboard__news__overview-card__element{justify-content: center; flex: 0.333;} .dashboard__news__overview-card__element div .title{color: #666666; font-size: 14px;} .dashboard__news__overview-card__element div .value{font-size: 24px; font-weight: 700; line-height: 22px;} .dashboard__level-skill{margin-top: 32px; width: auto;} .dashboard__level-skill__title{font-weight: 700; line-height: 24px; color: #212529;} .my-department{margin-top: 32px;} .chart-block{display: flex; flex-direction: column;} .chart-block .title{font-weight: 700; line-height: 24px;} .table__container{width: 100%; overflow: hidden;} .table-wrapper{width: 100%; overflow: hidden;} .table-header{background-color: #f9f9f9; padding: 1px 1px 0; border: 1px solid rgba(231, 236, 239, 0.5); border-radius: 6px 6px 0px 0px; overflow: hidden;} .table-wrapper tbody{padding: 0 1px 1px; border: 1px solid rgba(231, 236, 239, 0.5); border-radius: 0px 0px 6px 6px; overflow: hidden;} .table-wrapper td, .table-wrapper th{border: 0.5px solid rgba(231, 236, 239, 0.5); text-align: left; padding: 16px 0; padding-left: 32px; font-size: 14px; line-height: 22px;} .dashboard__chart-rate{margin-top: 32px;} .dashboard__chart-rate__title{font-weight: 700; line-height: 24px;} .group__wrapper{width: 100%; margin-bottom: 0.75rem;} .group__wrapper[aria-expanded="false"]{border-bottom: 1px solid rgba(231, 236, 239, 0.5); padding: 20px 0;} .group__wrapper[aria-expanded="true"]{padding: 20px 0 8px; border: none;} .group__left{text-align: center;} .group__title{margin: 0; padding: 0; font-family: "Inter"; font-style: normal; font-weight: 700; font-size: 14px; line-height: 24px; color: #212529; text-transform: uppercase;} .group__icon-btn{margin-left: 20px; width: 24px; height: 24px; border: none; background-color: transparent;} .group__icon-btn .group__icon-up{display: block;} .group__icon-btn .group__icon-down{display: none;} .group__wrapper[aria-expanded="false"] .group__icon-btn .group__icon-up{display: none;} .group__wrapper[aria-expanded="false"] .group__icon-btn .group__icon-down{display: block;} .services__container{width: 100%; background: #ffffff; border: 1px solid rgba(231, 236, 239, 0.5); box-shadow: 8px 8px 8px rgba(140, 140, 140, 0.03); border-radius: 6px;} .services__wrapper{width: 100%;} .service__container{width: fit-content;} .service__title{font-style: normal; font-weight: 500; font-size: 14px; line-height: 22px; color: #212529; text-align: center;} ::-webkit-scrollbar{width: 5px;} ::-webkit-scrollbar-track{background: #f1f1f1;} ::-webkit-scrollbar-thumb{background: #888; border-radius: 6px;} ::-webkit-scrollbar-thumb:hover{background: #555;} 

/* /vti_survey/static/src/css/custom_css.css defined in bundle 'web.assets_frontend' */
.survey-question-quit-job > p:last-child{display: inline !important;} .js_question-wrapper span{font-weight: 100 !important} .btn-login-auth-required-survey{background: #425cfb; color: #FFF !important; border-radius: 5px; text-align: center; padding: 5px;} 

/* /vti_orgchart/static/src/css/style.css defined in bundle 'web.assets_frontend' */
 #tree{width: 100%; height: 100%;} [data-l-id] path{stroke: #0050AE;} [data-n-id] rect{stroke: #0050AE;} .boc-edit-form-instruments{height: 0px; min-height: 0px !important;} 

/* /vti_training/static/src/scss/learning_path.css defined in bundle 'web.assets_frontend' */
.course-detail-description br:nth-child(odd){display:none;} .right-description br:nth-child(odd){display:none;} .view-more-btn{display: inline; border: none; color: #007bff; background: transparent;} .right-description{display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;} .course-detail-description{display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;} .roadmap-course-detail-description{display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;} .view-more-btn:focus{outline: none;} .lp-nav-link{border-radius: 4px 4px 0px 0px !important; padding: 13px 16px; border: 1px solid #dae2ee; font-size: 16px; line-height: 22px; color: #757575;} .lp-nav-sticky{margin: -3rem 0 0 -20px; padding: 3rem 0 40px 20px; position: sticky; top: 7%; background: #fff; z-index: 1;} .lp-nav-link.active{color: #fff; border-color: transparent; background-color: #0050AE !important;} .lp-path-role-heading{color: #000; font-size: 20px; line-height: 27px; padding-bottom: 16px; font-weight:700;} .lp-info{background-color: #f4f7fa; border-radius: 4px;} .lp-info-heading{color: #000; font-size: 16px; line-height: 22px; margin-bottom: 24px; font-weight: 700;} .lp-info__image-wrapper{width: 100px; height: 100px; margin-right: 40px;} .lp-info__image-wrapper img{object-fit: cover; width: 100%; height: 100%;} .lp-info__title, .lp-info__value{font-size: 14px; line-height: 19px;} .lp-info__title{font-weight: 400;} .lp-info__value{padding-left: 16px; font-weight: 700;} .flow-chart-bg{background-image: url("/vti_training/static/src/img/bg.png"); background-size: cover; background-repeat: no-repeat; height: 879px; overflow: scroll; background-position: center; position: relative;} .flow-chart-content{width: 100%; height: 100%; padding-top: 38px; padding-bottom: 111px;} .flow-chart-content .flow-level{height: -webkit-fill-available; margin-bottom: 20px} .fc-lp-avatar{width: 75px; height: 75px; border-radius: 50%; border: 1px solid var(--light-background-brand-bg-3, #0F548C);} .fc-detail{font-size: 16px; line-height: 18px;} .fc-detail-role{font-size: 20px; font-weight: 700;} .fc-detail-level{font-size: 12px; font-weight: 400;} .fc-detail__you{font-weight: 700; font-size: 16px;} .fc-circle{border-radius: 50%; position: relative; display: flex; justify-content: center; align-items: center; text-align: center;} .fc-circle.main{cursor: pointer;} .fc-circle.fc-info{width: 100px; height: 100px;} .fc-circle--large{width: 80px; height: 80px;} .fc-circle--medium{width: 75px; height: 75px;} .fc-circle--info{width: 100px; height: 100px;} .fc-purple{position: relative;} .fc-purple::before{content: ""; position: absolute; height: 100%; width: 100%; border-radius: 50%; border: 3px solid #9702fe; filter: drop-shadow(0px 0px 4px #9702fe);} .fc-blue--fill{background: #115ea3; color: #fff; position: relative;} .fc-blue--fill::before{content: ""; position: absolute; height: 100%; width: 100%; border-radius: 50%; box-shadow: 0px 0px 6px #115ea3;} .fc-blue{color: #115ea3;} .fc-blue::before{content: ""; position: absolute; height: 100%; width: 100%; border-radius: 50%; border: 2px solid #115ea3; filter: drop-shadow(0px 0px 4px #115ea3);} .fc-blue--info{color: #0F548C; margin-right: 40px !important;} .fc-blue--info::before{content: ""; position: absolute; height: 100%; width: 100%; border-radius: 50%; border: 4px solid #0F548C;} .fc-v-line{width: 2px; height: 80px;} .fc-h-line{width: 80px; height: 2px;} .fc-horizon{position: relative;} .fc-horizon.show .fc-vertical{max-width: 200px; opacity: 1;} .fc-vertical{position: absolute; top: 50%; transform: translateY(-50%); display: flex; align-items: center; max-width: 0%; overflow: hidden; opacity: 0; transition: max-width 0.5s, opacity 0.3s;} .fc-vertical.left{right: 100%;} .fc-vertical.right{left: 100%;} .fc-hexagon{width: 90px; height: 110px; background-image: url("/vti_training/static/src/img/hexagon.svg"); background-size: cover; background-repeat: no-repeat; background-position: center; position: relative; display: flex; justify-content: center; align-items: center; cursor: pointer;} .fc-hex-progress{position: absolute; font-weight: 700; top: calc(100% + 0px); left: 50%; transform: translateX(-50%);} .training-course-detail-nav{position: relative; height: 25px;} .fc-training-course-link, .fc-training-course-link-left{font-size: 18px; color: #0050ae !important; font-weight: 700; line-height: 1; text-decoration: none; display: flex; align-items: center; position: absolute; right: 0;} .fc-training-course-link-left{left: 0; top: -30px;} .fc-training-course-refer-link{font-size: 14px; color: #737070 !important; font-weight: 700; font-style: italic; text-align: right; margin-bottom: 10px;} .fc-training-course-refer-link a{text-decoration: underline; color: #737070 !important;} .fc-training-course-link.active, .fc-training-course-link-left.active{display: none;} .fc-training-course-link img{width: 24px; height: 24px; display: block;} .fc-training-course-link-left img{width: 15px; height: 15px; display: block; margin-right: 10px;} .list-roadmaps{padding-bottom: 30px;} .truncate{display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;} .rm-nav-link{font-size: 16px; color: #757575; padding-left: 16px !important; padding-right: 16px !important;} .rm-nav-link.active{color: #0050ae !important; font-weight: 700 !important; border-bottom: 2px solid #0050ae;} .rm-item{height: 100%; border: 1px solid #dae2ee; text-decoration: none; background: transparent; transition: background 0.2s; position: relative;} .rm-item::before{content: ""; position: absolute; top: -5px; left: -5px; right: -5px; bottom: -5px; border: 5px solid #dae2ee; opacity: 0; visibility: hidden; transition: all 0.2s; border-radius: 4px;} .rm-item:hover{background-image: url("/vti_training/static/src/img/BG-02.png"); background-size: 100% 100%;} .rm-item:hover::before{opacity: 1; visibility: visible;} .rm-item:hover .rm-item__title, .rm-item:hover .rm-item__description{color: #fff;} .rm-item__title{font-size: 18px; font-weight: 700; color: #242424; margin-bottom: 16px;} .rm-item__description{color: #757575; font-size: 14px; margin: 0;} .rm-item__btn{width: 24px; height: 24px; background-image: url("/vti_training/static/src/img/roadmap-btn.svg"); background-size: cover; background-repeat: no-repeat; background-position: center;} .rm-input{height: 48px; border-radius: 4px; border: 1px solid #dae2ee; background: #fff; width: 346px; padding: 13px 56px 13px 16px; font-size: 14px; line-height: 20px;} .rm-search-btn{position: absolute; top: 0; right: 0; width: 48px; height: 48px; border: none; background-color: #0050ae; border-top-right-radius: 4px; border-bottom-right-radius: 4px; display: flex; justify-content: center; align-items: center;} .rm-search-btn img{display: block; width: 20px; height: 20px;} .sidenav{height: 100%; position: fixed; z-index: 100; padding: 80px 32px; top: 0; background-color: #fff; overflow-x: hidden; transition: 0.5s;} .sidenav.left{left: 0; transform: translateX(-100%);} .sidenav.left.show{transform: translateX(0);} .sidenav.right{right: 0; transform: translateX(100%); width: 36%} .sidenav.right.show{transform: translateX(0);} .nav-menu{padding-top: 80px;} .nav-title{color: #222; font-size: 32px; line-height: 1; font-weight: 600;} .closebtn{cursor: pointer;} .overlay{position: fixed; inset: 0; visibility: hidden; opacity: 0; transition: all 0.3s; z-index: 99; background: rgba(0, 0, 0, 0.35);} .overlay.active{opacity: 1; visibility: visible;} .sidenav .certificate-body{width: 100%;} .sidenav .title{font-size: 2rem; font-style: normal; font-weight: 600; line-height: normal;} .sidenav .certificate-type{margin-top: 2rem;} .sidenav .certificate-type span{font-size: 1.25rem; font-style: normal; font-weight: 700; line-height: normal;} .certificate-item{border-radius: 4px 4px 0px 0px !important; min-height: 149px; max-width: 380px; border: solid 1px #dae2ee; margin-top: 1.5rem;} .certificate-item-img{display: flex; flex-direction: column; justify-content: center;} .certificate-item-img img{width: 149px; max-height: 149px;} .sidenav .certificate-item-img img{width: 149px; max-height: 149px;} .sidenav .certificate-item-icon img{width: 1.5rem; height: 1.5rem; position: absolute; top: 5px; right: 10px;} .certificate-item-content-text{align-items: center;} .certificate-item-content{position: relative; height: 100%; width: 52%; margin-left: 16px;} .certificate-item-content-text{height: 100%; width: 100%; padding: 16px 16px 16px 0;} .certificate-item-content-text .lp-info__title{font-size: 18px; font-weight: 700; padding-top: 9%;} .certificate-item-content-text .lp-info__status{font-size: 14px; font-weight: 400; color: #13a10e;} .certificate-item.hide .certificate-item-content-text .lp-info__status{font-size: 14px; font-weight: 400; color: #242424;} .certificate-item.hide .certificate-item-img img{filter: grayscale(1);} .lp-info__request{color: ##0050AE !important; margin-top: 12px;} .lp-info__request .link{font-weight: 700; font-size: 1rem; text-decoration: underline; color: ##0050AE} .lp-info__request .link a{color: #0050AE;} .lp-info__request .char{width: 1.375rem; height: 1.375rem; margin-left: 5px; color: #0050ae; font-weight: 700;} .training-course-type{border: 1px dotted black; border-width: 0 0 0 1px; margin: 2rem 0 6rem 1rem;} .training-course-type .index{font-size: 1.125rem; color: #0050ae; width: 2.5rem; height: 2.5rem; position: relative; left: -1.123em; background: #fff;} .training-course-type .index span{width: 100%; height: 100%; border-radius: 50%; border: 1px solid #0f548c; display: flex; justify-content: center; align-items: center;} .training-course-type .level-title .name{font-size: 1.25rem; font-weight: 700;} .training-course-type .level-title .description{margin-top: 0.5rem; font-size: 0.875rem;} .lp-roadmap-body-items{margin-top: 0; padding-left: 1.5rem; position: relative; margin-top: 3rem;} .lp-roadmap-body-items span{height: 2px; width: 1.5rem; border: dotted black; border-width: 1px 0 1px 0; position: absolute; top: 4rem; left: 0;} .lp-roadmap-body-title{margin-left: -20px; padding-left: 20px; top: 21%; position: sticky; background: #fff; z-index: 100;} .lp-roadmap-course{position: relative; background: #fff;} .lp-roadmap-course-img{height: 8.125rem; display: flex; flex-direction: column; justify-content: center; margin-left: 0.6875rem;} .lp-roadmap-body-items img{width: 8.125rem; max-height: 8.125rem; border: 3px solid #0050AE; filter: drop-shadow(0px 0px 4px #0050AE);} .lp-roadmap-course-info{margin-left: 1rem; width: 66%;} .lp-roadmap-course-info .status{border-radius: 3px; color: #13a10e; font-size: 0.875rem; font-weight: 700; padding: 0.25rem 0.75rem; text-align: center; width: fit-content; margin-bottom: 0.625rem;} .lp-roadmap-course-info .status.not-pass{background: #fbeae4; color: #e26335;} .lp-roadmap-course-info .name{font-size: 1.125rem; font-weight: 700;} .lp-roadmap-course-info .descriptions{font-size: 0.875rem; -webkit-line-clamp: 2;} .lp-roadmap-course-info .descriptions p{margin: 0} .lp-roadmap-course-info .item{margin-top: 1rem; font-size: 0.875rem;} .certificate-main{margin-bottom: 40px;} .certificate-content{display: flex; flex-wrap: nowrap;} .certificate-type .nav-item .nav-link{color: #757575;} .certificate-type{margin: 20px 0 20px 0; font-size: 16px;} .certificate-type .nav-item .nav-link.active{border-radius: 0; border-bottom: 2px solid #0050ae; color: #0050ae; background-color: transparent; font-weight: 700;} .certificate-row{width: 100%;} .certificate-optional, .certificate-required{margin-bottom: 30px;} .certificate-item-icon img{width: 24px; height: 24px; position: absolute; top: 8px; right: 8px;} .lp-info__request .link{width: 61; height: 22px; font-weight: 700;} .lp-info__request .char{width: 22px; height: 22px; margin-left: 5px;} .divider{display: flex; flex-direction: row; flex-flow: row; width: 100%; margin: 30px 0 15px;} .divider > label{align-self: baseline; flex-grow: 2; white-space: nowrap;} .divider > hr{margin-top: 13px; width: 100%; border: 0; height: 1px; background: #DAE2EE; padding: 0;} .divider.left > label{order: 1; padding-right: 5px; font-weight: 700; font-size: 20px; color: #242424;} .divider.left > hr{order: 2; margin-left: 0 1rem;} .divider img{width: 1.5rem; height: 1.5rem; padding-top: 5px; margin-right: 20px; order: 3;} .lp-roadmap-body-title .role{font-size: 1.25rem; font-weight: 700;} .lp-roadmap-body-title ul{margin: 16px 0 32px 16px; font-size: 14px; color: #616161;} .lp-roadmap-body-title ul li{margin-right: 2rem; list-style-type: disc;} .lp-roadmap-body .level{border: 1px dotted black; border-width: 0 0 0 1px; padding-bottom: 4rem;} .lp-roadmap-body .level:last-child{padding-bottom: 0rem; margin-bottom: 3rem;} .level-header .index{font-size: 1.125rem; color: #0050ae; width: 2.5rem; height: 2.5rem; position: relative; left: -1.123em; background: #fff;} .level-header .index span{width: 100%; height: 100%; border-radius: 50%; border: 1px solid #0f548c; display: flex; justify-content: center; align-items: center;} .level-header .index span.level-index-blue{background: #0050AE; color: #fff;} .lp-roadmap-body .level .level-title .name{font-size: 1.25rem; font-weight: 700;} .lp-roadmap-body .level .level-title .description{margin-top: 0.5rem; font-size: 0.875rem;} .fc-h-left, .fc-h-right{padding: 25px 0;} .lp-scroll{overflow-y: scroll; padding-bottom: 4rem; max-height: 29rem;} .lp-hide{visibility: hidden; padding: 0; margin: 0; height: 0;} img.icon-show-more.collapsed{transform: rotate(180deg);} .lp-btn-click{color:white !important; text-decoration:none; letter-spacing:1px; padding: 2px 6px; background-color: #007bff; border-radius:5rem; #box-shadow: 1px 2.9px 16px rgba(27,139,249,0.4); transition:0.6s cubic-bezier(0.01, 1.69, 0.99, 0.94);} .lp-btn-click:hover{box-shadow: 3px 4.9px 16px rgba(27,139,249,0.6); letter-spacing:2px;} .path-roadmap-second:has(#trainingRoadmapCourseDetail.active) .lp-training-roadmaps a{background: #fff !important; color: #757575;} .path-roadmap-second:has(#trainingRoadmapCourseDetail.active) .lp-training-course a{color: #fff; background: #0050AE;} 

/* /vti_training_calendar/static/src/css/button_menu_calendar.css defined in bundle 'web.assets_frontend' */
.training-calendar-web-menu{margin-bottom: 15px;} .training-calendar-web-menu .descriptions{font-size: 22px; font-weight: 900; margin-bottom: 10px;} .button-menu-training-calendar{position: relative; transition: all 0.3s ease-in-out; box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2); padding-block: 0.5rem; padding-inline: 1.25rem; background-color: rgb(0 107 179); border-radius: 9999px; display: flex; align-items: center; justify-content: center; color: #ffff; gap: 10px; font-weight: bold; border: 3px solid #ffffff4d; outline: none; overflow: hidden; font-size: 15px;} .button-menu-training-calendar .icon{width: 24px; height: 24px; transition: all 0.3s ease-in-out;} .button-menu-training-calendar:hover{transform: scale(1.05); border-color: #fff9;} .button-menu-training-calendar:hover .icon{transform: translate(4px);} .button-menu-training-calendar:hover::before{animation: btn-calendar-shine 1.5s ease-out infinite;} .button-menu-training-calendar::before{content: ""; position: absolute; width: 100px; height: 100%; background-image: linear-gradient( 120deg, rgba(255, 255, 255, 0) 30%, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0) 70% ); top: 0; left: -100px; opacity: 0.6;} @keyframes btn-calendar-shine{0%{left: -100px;}60%{left: 100%;}to{left: 100%;}} 

/* /vti_seat_management/static/src/css/style.css defined in bundle 'web.assets_frontend' */
.diagram-content{margin-bottom: 40px;} .diagram-content .horizontal-layout{height: 10.6875rem; align-items: end; margin-bottom: 55px;} .diagram-content .normal-font p{color: #888; text-align: center; font-size: 13px; font-style: normal; font-weight: 400; line-height: normal; margin: 0;} .diagram-content .left-horizontal-layout{height: 6.4rem; border: 2px solid #DEDEDE; border-right: none;} .left-horizontal-layout .stair{padding: 41px 18px; width: 5.375rem; border-right: 2px solid #DEDEDE; background: #F2F2F2;} .left-horizontal-layout .rest-room{padding: 41px 30px; width: 5.3125rem; border-right: 2px solid #DEDEDE; background: #F2F2F2;} .left-horizontal-layout .warehouse{width: 9.0625rem; border-right: 2px solid #DEDEDE; background: #F2F2F2; display: flex;} .warehouse .first-warehouse{border-right: 2px solid #DEDEDE; display: flex;} .warehouse .first-warehouse p, .warehouse .second-warehouse p{align-self: center;} .warehouse .second-warehouse{display: flex;} .diagram-content .room-style p{color: #FFF; text-align: center; font-size: 13px; font-style: normal; font-weight: 600; line-height: normal; margin: 0; padding: 6px; background: #0050AE; border-radius: 8px;} .left-horizontal-layout .it-room{width: 7.6875rem; padding: 8px 12px 8px 10px;} .it-room .contain{margin-bottom: 6px;} .it-room .block-user-right{text-align: right;} .center-horizontal-layout{height: 9rem;} .center-horizontal-layout td{border: 2px solid #DEDEDE; background: #F2F2F2;} .center-horizontal-layout table{height: 100%;} .center-horizontal-layout .electric-room{max-width: 8.875rem; height: 2.57rem;} .center-horizontal-layout .server-room{padding: 31px 15px; max-width: 4.75rem;} .center-horizontal-layout .elevator{padding: 33px 15px; max-width: 4.75rem;} .center-horizontal-layout .stair-center{max-width: 5.3125rem;} .center-horizontal-layout .pump-room{max-width: 4.8125rem; padding: 40px 8px;} .right-horizontal-layout{height: 100%;} .right-horizontal-layout .emergency-staircase{max-width: 9.9375rem; height: 4.5rem; padding: 24px 24px; border: 2px solid #DEDEDE; border-bottom: none; background: #F2F2F2;} .right-horizontal-layout .inner{height: 6.4375rem; border: 2px solid #DEDEDE; border-left: none;} .right-horizontal-layout .cfo-room{display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 10px; border-right: 2px solid #DEDEDE;} .right-horizontal-layout .cfo-room span{color: #0050AE; text-align: center; font-size: 13px; font-style: normal; font-weight: 600; line-height: normal;} .right-horizontal-layout .room-list{width: 12.875rem; padding: 8px 10px 40px; display: flex; border-right: 2px solid #DEDEDE;} .right-horizontal-layout .room-list .block-employee{padding: 0 5px;} .right-horizontal-layout .health-room{width: 4.25rem; padding: 33px 13px; border-right: 2px solid #DEDEDE; background: #F2F2F2;} .right-horizontal-layout .milk-room{width: 3.6875rem; padding: 33px 5px; border-right: 2px solid #DEDEDE; background: #F2F2F2;} .right-horizontal-layout .rest-room-last{width: 6.0625rem; padding: 40px 35px;} .horizontal-layout-second .lobby{height: 13.125rem; width: 16.8125rem; border: 2px solid #DEDEDE;} .horizontal-layout-second{height: 19.6875rem;} .lobby .elevator{width: 4.3125rem; height: 3.7rem; padding: 20px 9px; border-right: 2px solid #DEDEDE; border-bottom: 2px solid #DEDEDE; background: #F2F2F2;} .lobby .hn-room{width: 8.4375rem; height: 9.1875rem; border-left: 2px solid #DEDEDE; border-top: 2px solid #DEDEDE; padding: 48px 14px; background: #F2F2F2;} .lobby .hn-room-inner{text-align: -webkit-right;} .horizontal-layout-second .hcm-room{height: 8.3rem; width: 9.0625rem; background: #F2F2F2; border-top: 2px solid #DEDEDE; border-bottom: 2px solid #DEDEDE; border-right: 2px solid #DEDEDE; padding: 40px 24px;} .employee-group .vms-group{width: 8.8125rem; height: 8.3rem; border-bottom: 2px solid #DEDEDE; border-top: 2px solid #DEDEDE; padding: 6px 15px 5px 15px;} .employee-group .vms-group .left{padding: 26px 9px 0 0px} .diagram-content .area-background{width: 24px; height: 23px; border: 0.01em solid white; margin: 1px; user-select: none;} .seat-icon-container{padding: 2px 4px; width: 100%; height: 100%;} .unoccupied img.user{filter: invert(49%) sepia(86%) saturate(2663%) hue-rotate(101deg) brightness(96%) contrast(96%);} .waiting img.user{filter: invert(34%) sepia(86%) saturate(3983%) hue-rotate(327deg) brightness(91%) contrast(119%);} .block img.user{filter: invert(76%) sepia(6%) saturate(46%) hue-rotate(168deg) brightness(97%) contrast(88%);} .your-seat img.user{filter: invert(66%) sepia(62%) saturate(530%) hue-rotate(335deg) brightness(96%) contrast(98%);} .assigning img.user{filter: invert(2%) sepia(30%) saturate(2000%) hue-rotate(201deg) brightness(150%) contrast(110%);} .your-seat.twinkle{animation: twinkle-your-seat 2s infinite ease-in-out;} @keyframes twinkle-your-seat{0%, 100%{transform: scale(1); opacity: 1;}50%{transform: scale(1.2);}} .dialog-information img{filter: unset} .employee-group .vms-group .center{padding: 0 7px 0 4px; text-align: center;} .employee-group .vms-group .right{padding: 0px 0 5px 9px;} .employee-group .center-group-vms{width: 3.5rem; padding: 6px 9px 0 9px; border-top: 2px solid #DEDEDE; height: 16.5rem; border-bottom: 2px solid #DEDEDE; position: relative;} .employee-group .center-group-vms .span-css{position: absolute; left: 0; width: 2px; background: #E4E4E4; height: 131px; bottom: 0;} .horizontal-layout-second .ga-group{width: 12.5625rem; padding: 5px 10px 20px 11px; display: grid; border: 2px solid #DEDEDE; border-left: none; position: relative;} .horizontal-layout-second .ga-group .span-css{position: absolute; left: 0; width: 2px; background: #E4E4E4; height: 51px; bottom: 0;} .ga-group .ga-row .ga-block:first-child{padding-left: 10px;} .ga-group .ga-row .ga-block:last-child{padding: 0 10px 0 10px;} .horizontal-layout-second .relax-room{width: 4.6875rem; height: 11.3125rem; padding: 72px 20px; border: 2px solid #DEDEDE; border-left: none; background: #F2F2F2;} .horizontal-layout-second .rec-group{width: 16.6rem; height: 8.5rem; border: 2px solid #DEDEDE; border-left: none; border-right: none;} .horizontal-layout-second .rec-group .rec-block{padding: 6px;} .horizontal-layout-second .rec-group .rec-block:last-child{padding-left: 35px;} .horizontal-layout-second .dn-room{width: 16.01rem; height: 13rem; padding: 6px; border: 2px solid #DEDEDE; border-left: unset; position: relative; background: #F2F2F2; padding: 80px 60px;} .diagram-content .cto-room{width: 5rem; display: flex; flex-direction: column; background: #FFF; justify-content: center; align-items: center; padding: 10px;} .diagram-content .title-position{color: #0050AE; text-align: center; font-size: 13px; font-style: normal; font-weight: 600; line-height: normal;} .diagram-content .tokyo-room{width: 8.3125rem; padding: 26px 14px; border-left: 2px solid #DEDEDE; border-right: 2px solid #DEDEDE; background: #F2F2F2;} .center-horizontal-layout .osaka-room.room-style{max-width: 3.8125rem; background: #F2F2F2;} .center-horizontal-layout .osaka-room.room-style p{transform: rotate(-90deg);} .center-horizontal-layout .storage-room-2{height: 7rem;} .center-horizontal-layout .server-room-2{padding: 5px 10px;} .center-horizontal-layout .technique-room{padding: 18px 4px;} .center-horizontal-layout .stairs-2{padding: 0 9px; max-width: 5.3125rem;} .center-horizontal-layout .elevator-2{max-width: 4.25rem;} .right-horizontal-layout .room-employee .group-user{padding: 2px 4px;} .right-horizontal-layout .room-employee{border-right: 2px solid #DEDEDE;} .horizontal-layout-second .block-corner .elevator{width: 4.3125rem; height: 3.7rem; padding: 20px 8px; border-right: 2px solid #DEDEDE; border-bottom: 2px solid #DEDEDE; background: #F2F2F2;} .horizontal-layout-second .block-corner{width: 8.3125rem; height: 13.0625rem; border: 2px solid #DEDEDE; border-right: none;} .horizontal-layout-second .block-corner .ceo-room{display: flex; flex-direction: column; justify-content: center; align-items: center; margin-top: 30px;} .horizontal-layout-second .group-employee-1{width: 7.5rem; height: 13.05rem; display: flex; flex-direction: column; align-items: end; border: 2px solid #DEDEDE; border-left: none; padding: 6px;} .horizontal-layout-second .group-employee-1 .employee-row1{margin-bottom: 24px;} .horizontal-layout-second .group-employee-1 .employee-row2{margin-bottom: 24px;} .horizontal-layout-second .group-employee-2{height: 11.54rem; border-top: 2px solid #DEDEDE;} .horizontal-layout-second .inner{height: 9.2rem; border-bottom: 2px solid #DEDEDE;} .horizontal-layout-second .inner .block-employee{padding: 6px;} .horizontal-layout-second .bo-group{padding: 6px 10px 6px 6px; border-bottom: 2px solid #DEDEDE; position: relative;} .horizontal-layout-second .bo-group .span-css{position: absolute; left: 0; width: 2px; background: #E4E4E4; height: 36px; bottom: 0;} .horizontal-layout-second .relax-room-2{width: 8.8375rem; height: 19.75rem; border: 2px solid #DEDEDE;} .horizontal-layout-second .group-employee-3{border-top: 2px solid #DEDEDE;} .horizontal-layout-second .group-employee-3 .it-area .block-employee{padding: 6px 4px;} .horizontal-layout-second .group-employee-3 .it-area{height: 9.15rem; border-bottom: 2px solid #DEDEDE;} .group-employee-3 .it-group{padding: 6px 4px; height: 11.4375rem; border-bottom: 2px solid #DEDEDE; position: relative;} .group-employee-3 .it-group .span-css{position: absolute; right: 0; width: 2px; background: #E4E4E4; height: 37px; bottom: 0;} .horizontal-layout-second .group-employee-4{width: 16rem; height: 13.4rem; border: 2px solid #DEDEDE; border-left: none; padding: 0 4px 0 0; border-bottom: none;} .group-employee-4 .row-employee-1 .block-employee-group{padding: 6px 10px 14px 4px; border-right: 2px solid #DEDEDE; border-bottom: 2px solid #DEDEDE;} .group-employee-4 .row-employee-1 .block-employee-corner{width: 10.375rem; padding-top: 6px;} .group-employee-4 .row-employee-1 .block-employee-corner .block-employee:first-child{margin-bottom: 9px;} .group-employee-4 .row-employee-2{width: 16rem; height: 6.2rem; justify-content: space-between; padding: 0 4px 14px 0px; border-bottom: 2px solid #DEDEDE; border-left: 2px solid #DEDEDE; align-items: end;} .group-employee-4 .row-employee-2 .block-employee:first-child{margin-left: 40px;} .diagram-content .horizontal-layout .seoul-room{width: 5.25rem; padding: 17px 10px; border-right: 2px solid #DEDEDE; background: #F2F2F2;} .diagram-content .traning-floor-3{flex-direction: column; align-items: end; width: 17.3rem; height: 9rem;} .traning-floor-3 .traning-employee-group{height: 6.5rem; width: 100%; border-bottom: 2px solid #DEDEDE; border-top: 2px solid #DEDEDE;} .traning-floor-3 .traning-employee-group .block-employee{padding: 0 6px;} .traning-floor-3 .server-room{width: 4.75rem; height: 2.625rem; border-top: 2px solid #DEDEDE; border-left: 2px solid #DEDEDE; padding: 4px 9px; background: #F2F2F2;} .traning-floor-3 .server-room p{margin: 0; color: #888; text-align: center; font-size: 13px; font-style: normal; font-weight: 400; line-height: normal;} .diagram-content .center-horizontal-layout-table{height: 10rem;} .diagram-content .center-horizontal-layout-table table{height: 100%;} .diagram-content .center-horizontal-layout-table td{border: 2px solid #DEDEDE; background: #F2F2F2;} .diagram-content .center-horizontal-layout-table .technique-room{width: 4.125rem; height: 2.6rem;} .diagram-content .center-horizontal-layout-table .stairs-3{width: 6rem;} .diagram-content .center-horizontal-layout-table .employee-room{text-align: -webkit-center; background: unset; height: 7.25rem; border-top: unset; border-left: unset; align-items: end; justify-content: center;} .diagram-content .right-horizontal-layout .rec-room .block-employee{padding: 0px 6px;} .diagram-content .right-horizontal-layout .sydney-room{width: 5.25rem; padding: 16px 8px; border-right: 2px solid #DEDEDE; border-left: 2px solid #DEDEDE; background: #F2F2F2;} .modal-booking{max-width: 1290px;} .horizontal-layout-second-floor-3 .rec-room-center{position: relative; padding: 10px 31px 9px 26px;} .horizontal-layout-second-floor-3 .london-room{height: 5.05rem; padding: 14px 9px; background: #F2F2F2; border: 2px solid #DEDEDE; border-left: none;} .horizontal-layout-second-floor-3 .employee-room-1{width: 9rem; height: 13.125rem; border: 2px solid #DEDEDE; border-left: none; padding: 13px 17px 10px 12px;} .horizontal-layout-second-floor-3 .employee-room-1 .block-employee{margin-bottom: 12px;} .horizontal-layout-second-floor-3 .employee-room-2{height: 11.4rem; border-top: 2px solid #DEDEDE;} .horizontal-layout-second-floor-3 .employee-room-2 .group-block{height: 9.8125rem; border-bottom: 2px solid #DEDEDE;} .horizontal-layout-second-floor-3 .employee-room-2 .group-block{padding: 15px 5px 18px;} .horizontal-layout-second-floor-3 .employee-room-2 .single-block{padding: 15px 12px 18px 0; border-bottom: 2px solid #DEDEDE; position: relative;} .horizontal-layout-second-floor-3 .employee-room-2 .single-block .span-css{position: absolute; left: 0; width: 2px; background: #E4E4E4; height: 23px; bottom: 0;} .horizontal-layout-second-floor-3 .relax-room-3{width: 9.5rem; height: 11.375rem; border: 2px solid #DEDEDE; padding: 72px 27px; background: #F2F2F2;} .horizontal-layout-second-floor-3 .relax-room-3 .block-1{padding: 15px 8px 18px 15px;} .horizontal-layout-second-floor-3 .relax-room-3 .block-2{padding: 15px 12px 18px 0;} .horizontal-layout-second-floor-3 .employee-room-2 .single-block .single-block-employee{text-align: -webkit-center;} .horizontal-layout-second-floor-3 .employee-room-3{height: 13rem; border-top: 2px solid #DEDEDE;} .horizontal-layout-second-floor-3 .employee-room-3 .single-block{height: 11.27rem; padding: 15px 8px 15px 8px; border-bottom: 2px solid #DEDEDE; position: relative;} .horizontal-layout-second-floor-3 .employee-room-3 .single-block .span-css{position: absolute; right: 0; width: 2px; background: #E4E4E4; height: 20px; bottom: 0;} .horizontal-layout-second-floor-3 .employee-room-3 .single-block .block-employee{margin-bottom: 26px;} .horizontal-layout-second-floor-3 .employee-room-3 .single-block .single-block-employee{text-align: -webkit-center;} .horizontal-layout-second-floor-3 .employee-room-3 .center-group{height: 10rem; padding: 15px 0; border-bottom: 2px solid #DEDEDE;} .horizontal-layout-second-floor-3 .employee-room-3 .center-group .block-employee{padding: 0 5px;} .horizontal-layout-second-floor-3 .employee-room-3 .right-group{padding: 15px 0px 17px 0; border-right: 2px solid #DEDEDE; border-bottom: 2px solid #DEDEDE; position: relative;} .horizontal-layout-second-floor-3 .employee-room-3 .right-group .span-css{position: absolute; left: 0; width: 2px; background: #E4E4E4; height: 46px; bottom: 0;} .horizontal-layout-second-floor-3 .employee-room-3 .right-group .group-inner{padding: 0 5px;} .horizontal-layout-second-floor-3 .employee-room-3 .right-group .group-inner-last{padding-right: 0;} .horizontal-layout-second-floor-3 .employee-room-3 .right-group .group-inner .block-employee{margin-bottom: 20px;} .horizontal-layout-second-floor-3 .employee-room-3 .right-group .group-inner-last .block-employee{padding-right: 12px;} .horizontal-layout-second-floor-3 .employee-room-3 .right-group .block-employee-last .block-employee{padding-right: 0; margin: 0;} .seat-diagram-contain .modal-booking-list-dialog, .modal-block-seat-dialog, .modal-booking-group-dialog, .modal-block-seat-group-dialog, .modal-assign-area-dialog{max-width: 1290px;} .border-background.nocheck{border: 1px solid #000;} .border-background{position: relative;} .border-background:hover .dialog-information{display: block;} .seat-dialog-visible .dialog-information{display: block !important;} .dialog-information{display: none; position: absolute; padding: 12px; background-color: #A4E9FF; color: #fff; border-radius: 5px; z-index: 1500; top: -10px; width: 258px; box-shadow: 6px 6px 6px 0px rgba(0, 0, 0, 0.06); transform: translate(-50%, -100%);} .dialog-information .dialog-arrow{position: absolute; bottom: -10px; left: 54%; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #A4E9FF; transform: translateX(-50%);} .dialog-information:hover{display: block;} .dialog-information .avatar{text-align: center; padding-bottom: 8px;} .dialog-information .avatar img{border-radius: 56px; width: 56px; height: 56px;} .dialog-information #seatCode{color: #0050AE; font-weight: 700;} .dialog-information #department{color: #0050AE; font-weight: 700;} .dialog-information .content .form-group{margin-bottom: 9px; margin-right: 8px;} .dialog-information .content label{color: #666; text-align: right; font-size: 13px; font-style: normal; font-weight: 400; line-height: normal; padding: 0; padding-right: 8px;} .dialog-information .content p, .dialog-information .content a{color: #222; text-align: left; font-size: 13px; font-style: normal; font-weight: 400; line-height: normal; padding: 0px 5px 0px 0px; margin: unset;} .networkPortInput{font-size: 13px; max-height: 20px;} .dialog-information .content .word-break{word-break: break-all; white-space: pre-wrap;} .dialog-information .content .contain-data{padding: 0; display: flex; align-items: center;} .dialog-information .btn-dialog{text-align: center; margin-bottom: 10px; padding-top: 15px;} .dialog-information .btn-dialog .book{border-radius: 6px; border: 1px solid #0391E8; padding: 7px 30px; background: #0391E8; color: #FFF; text-align: center; font-size: 14px; font-style: normal; font-weight: 700; line-height: 18px; width: 98px;} .dialog-information .btn-dialog .block{border-radius: 6px; border: 1px solid #0391E8; padding: 7px 2px; background: #FFF; color: #0391E8; text-align: center; font-size: 14px; font-style: normal; font-weight: 700; line-height: 18px; width: 98px;} .seat-diagram-contain{background: #F2F2F2; padding-top: 26px; padding-bottom: 26px;} .pagination-contain .total-count select{border: none; border-radius: 3px; background: #EDF0F4; color: #666; font-size: 14px; font-style: normal; font-weight: 400; line-height: 22px; padding: 8px 16px; -webkit-appearance: none; -moz-appearance: none; background-image: url("/vti_seat_management/static/src/img/IconFrame.svg"); background-repeat: no-repeat; background-position-x: 100%; background-position-y: 10px; margin-bottom: 15px;} .pagination-contain .total-count select:focus{outline: none;} .pagination-contain .total-count select span{color: #222; font-size: 14px; font-style: normal; font-weight: 700; line-height: 22px;} .nav-custom-seat .pagination .page-item{width: 32px; height: 32px; border-radius: 3px; border: 1px solid #EDF0F4; background: #FFF; margin: 0 4px; display: flex; justify-content: center; align-items: center;} .nav-custom-seat .pagination .page-item a{color: #222; text-align: center; font-size: 14px; font-style: normal; font-weight: 400; line-height: 22px;} .nav-custom-seat .pagination .page-item.active a{color: #0761AD;} .nav-custom-seat .pagination .page-item.active{border: 1px solid #0761AD;} .nav-custom-seat .pagination .page-item.next-page{padding: 3px 8px;} .modal-booking .modal-content{padding: 40px 24px;} .modal-booking .modal-content .modal-header{border-bottom: 1px solid #E4E4E4;} .modal-booking .modal-content .modal-header h5{color: #222; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal;} .modal-booking .modal-body .tab-content label{color: #222; text-align: right; font-size: 13px; font-style: normal; line-height: 18px;} .modal-booking .modal-body .tab-content .form-group input{color: #222; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px;} .modal-booking .modal-body .tab-content form{padding-bottom: 12px; margin-bottom: 24px; border-bottom: 1px solid #E4E4E4;} .modal-booking .modal-body .tab-content table thead th{color: #666; font-size: 14px; font-style: normal; font-weight: 700; line-height: 22px; padding: 9px 16px; text-align: center; border: 1px solid #D1D1D1;} .modal-booking .modal-body .tab-content table tbody th, .modal-booking td{color: #222; font-size: 14px; font-style: normal; font-weight: 400; line-height: 22px; text-align: center; padding: 10px 16px !important; border: 1px solid #D1D1D1; vertical-align: middle !important;} .modal-booking-list .modal-content{padding: 40px;} .modal-content .modal-header h5{color: #222; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; flex-basis: 60%; padding-bottom: 20px;} .modal-booking-list .modal-content .has-search{padding: 0 20px; position: relative; border: 1px solid #DDD; flex-basis: 40%; border-radius: 10px;} .modal-booking-list .modal-content .has-search span{position: absolute; right: 20px; top: 5px;} .modal-booking-list .modal-content .has-search select{color: #666; font-size: 14px; font-style: normal; font-weight: 400; line-height: 24px; border: none; border-right: 1px solid #DDD; padding-right: 12px;} .modal-booking-list .modal-content .has-search select:focus-visible{outline: none;} .modal-booking-list .modal-content .has-search input{border: none; color: #666; font-size: 14px; font-style: normal; font-weight: 400; line-height: 24px;} .modal-booking-list .modal-content .has-search input:focus{border: none; box-shadow: none;} .modal-booking-list .modal-content .has-search img{padding-top: 4px;} .modal-booking-list .modal-header{display: block; border-bottom: 1px solid #D1D1D1; padding: 0; padding-bottom: 9px; margin-bottom: 24px;} .modal-booking-list .modal-body{padding: 0;} .modal-booking-list .modal-body table .thead-light th{color: #666; font-size: 14px; font-style: normal; font-weight: 700; line-height: 22px; text-align: center; border: 1px solid #D1D1D1;} .modal-booking-list .modal-body table tbody th, .modal-booking-list td{color: #222; font-size: 14px; font-style: normal; font-weight: 400; line-height: 22px; border: 1px solid #D1D1D1; text-align: center; vertical-align: middle;} .modal-booking-list .modal-content .confirm{color: #FFF; font-size: 14px; font-style: normal; font-weight: 700; line-height: 18px; padding: 12px 24px; border-radius: 6px; border: 1px solid #0391E8; background: #0391E8;} .btn-checkout-detail{color: #0391E8; font-size: 14px; font-style: normal; font-weight: 700; line-height: 6px; padding: 12px 24px; border-radius: 6px; border: 1px solid #0391E8; background: #FFFFFF;} .list-booking-container .table thead th, .view-all-seats-container .table thead th{color: #666; font-size: 14px; font-style: normal; font-weight: 700; line-height: 22px; text-align: center; border: 1px solid #D1D1D1;} .list-booking-container .table tbody th, .list-booking-container td, .view-all-seats-container .table tbody th, .view-all-seats-container td{color: #222; font-size: 14px; font-style: normal; font-weight: 400; line-height: 22px; text-align: center; border: 1px solid #D1D1D1;} .seat-diagram-contain .list-booking-container{margin-top: 24px;} .modal-booking-group-dialog .modal-content{padding: 40px;} .modal-booking-group-dialog .modal-header{padding: 0; padding-bottom: 20px; margin-bottom: 24px;} .modal-booking-group-dialog .modal-header button{padding: 4px 22px; border-radius: 6px; background: #0050AE; color: #FFF; font-size: 14px; font-style: normal; font-weight: 700; line-height: 18px;} .modal-booking-group-dialog .form-group label{color: #222; font-size: 13px; font-style: normal; line-height: 18px;} .modal-booking-group-dialog .col-label-paying{max-width: 162px;} .modal-booking-group-dialog .paying{max-width: 441px;} .modal-booking-list .modal-content .discard{padding: 5px 33px; color: #0391E8; font-size: 14px; font-style: normal; font-weight: 700; line-height: 18px; border: 1px solid #0391E8; background: #FFF; border-radius: 6px; cursor: pointer; outline: none;} .modal-booking-group-dialog .label-table td{color: #FFF; text-align: center; font-size: 14px; font-style: normal; font-weight: 700; line-height: 22px; border: 1px solid #777; background: #ADADAD; margin-bottom: 0; padding: 10px;} .modal-booking-group-dialog .label-table p{margin-bottom: 0;} .modal-booking-group-dialog .label-table .label-contain-left{flex-basis: 54%;} .modal-booking-group-dialog .label-table .label-contain-right{flex-basis: 46%;} .modal-booking-group-dialog .table .thead-light th{color: #666; font-size: 14px; font-style: normal; font-weight: 700; line-height: 22px; padding: 9px 12px; vertical-align: middle; text-align: center; border: 1px solid #D1D1D1;} .modal-booking-group-dialog .modal-body{padding: 0;} .modal-booking-group-dialog .table .content-table th, .modal-booking-group-dialog td{color: #222; font-size: 14px; font-style: normal; font-weight: 400; line-height: 22px; border: 1px solid #D1D1D1; text-align: center;} .btn-block-seat, .btn-checkout-seats{padding: 10px 23px !important; color: #0391E8; text-align: center; font-size: 14px; font-style: normal; font-weight: 700; line-height: 18px; border-radius: 6px; border: 1px solid #0391E8; background: #FFF; margin-left: 21px;} .btn-seats{color: #FCFDFE; text-align: center; font-size: 14px; font-style: normal; font-weight: 700; line-height: 18px; border-radius: 6px; border: 1px solid #0391E8; background: #0391E8; padding: 10px 35px !important; margin-left: 21px;} .btn-seats-selected{color: #FCFDFE; font-size: 14px; font-style: normal; font-weight: 700; line-height: 18px; border-radius: 6px; border: 1px solid #5DA8FF; background: #5DA8FF; margin: 0 21px; cursor: unset !important;} .close-icon-selected{cursor: pointer;} .modal-block-seat .modal-body .form-group label{color: #222; text-align: right; font-size: 13px; font-style: normal; line-height: 18px;} .modal-block-seat .modal-body .form-group input{color: #222; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px;} .modal-footer .reset{color: #FF5D48; font-size: 14px; font-style: normal; font-weight: 700; line-height: 18px; border-radius: 6px; border: 1px solid rgba(255, 93, 72, 0.50); background: #FFF; padding: 5px 23px;} .modal-footer .submit{color: #FFF; font-size: 14px; font-style: normal; font-weight: 700; line-height: 18px; border-radius: 6px; background: #0050AE; padding: 5px 23px; border: none;} .label-table .label-contain p{color: #FFF; text-align: center; font-size: 14px; font-style: normal; font-weight: 700; line-height: 22px; border-radius: 3px; border: 1px solid #777; background: #ADADAD; margin: 0; padding: 10px;} .modal-block-seat-group, .modal-booking-seat-group, .modal-assign-area{overflow-x: hidden; overflow-y: auto;} .modal-block-seat-group .table .thead-light th{color: #666; font-size: 14px; font-style: normal; font-weight: 700; line-height: 22px; border: 1px solid #D1D1D1; text-align: center;} .modal-block-seat-group .table .content-table th, .modal-block-seat-group td{color: #222; font-size: 12px; font-style: normal; font-weight: 400; line-height: 22px; text-align: center; border: 1px solid #D1D1D1;} .modal-block-seat-group .modal-body label{color: #222; font-size: 13px; font-style: normal; line-height: 18px;} .modal-block-seat-group .modal-content{padding: 40px;} .modal-block-seat-group .modal-header{padding: 0; padding-bottom: 24px; margin-bottom: 24px;} .modal-block-seat-group .modal-body{padding: 0;} .modal-block-seat-group .form-group{margin-bottom: 24px;} .modal-assign-area .modal-content{padding: 40px;} .modal-assign-area .modal-header{padding: 0; margin-bottom: 15px;} .modal-assign-area .modal-body{padding: 0;} .modal-assign-area .modal-body .input-group label{color: #222; font-size: 13px; font-style: normal; line-height: 18px;} .modal-assign-area .thead-light th{color: #666; font-size: 14px; font-style: normal; font-weight: 700; line-height: 22px; text-align: center; border: 1px solid #D1D1D1;} .modal-assign-area .content-table th, .modal-assign-area td{color: #222; text-align: center; font-size: 12px; font-style: normal; font-weight: 400; line-height: 22px; border: 1px solid #D1D1D1;} .area-contain .area-background .block{height: 32px; width: 32px; border-radius: 3px; margin-right: 8px; flex-shrink: 0;} .area-contain span{color: #000; font-size: 13px; font-style: normal; font-weight: 500; line-height: normal;} .status-contain span{color: #222; font-size: 13px; font-style: normal; font-weight: 500; line-height: normal;} .area-contain .block-parent{padding: 0 30px; margin-bottom: 16px; max-width: 135px;} .status-contain .status-parent{padding: 0 8px;} .seat-contact-contain p{font-style: italic; font-weight: 500; font-size: 13px; opacity: 80%; margin-bottom: unset;} .seat-contact-contain{margin-top: 20px;} .seat-dashboard .form-group label{color: #121212; font-size: 14px; font-style: normal; font-weight: 500; line-height: 22px;} .seat-dashboard .form-group{max-width: 385px;} .seat-dashboard .form-group select, .seat-dashboard input{width: 100%; padding: 10px; border-radius: 6px; border: 1px solid #777; background: #FFF;} .seat-diagram-contain .seat-dashboard{padding: 15px; background: #FFF;} .seat-dashboard .reset-value-report-page{border-radius: 6px; border: 1px solid #0391E8; color: #0391E8; text-align: center; font-size: 14px; font-style: normal; font-weight: 700; line-height: 18px; background: #FFF; margin-right: 12px;} .refresh-search-seat{padding: 5px 22px; border-radius: 6px; border: 1px solid #0391E8; background: #FFF; font-size: 14px; font-weight: 700; line-height: 18px; color: #0391E8; margin: 0 7px 0 20px; outline: none; cursor: pointer;} .seat-dashboard .search-btn{border-radius: 6px; border: 1px solid #0391E8; color: #FFF; text-align: center; font-size: 14px; font-style: normal; font-weight: 700; line-height: 18px; background: #0391E8; margin-left: 12px;} .seat-dashboard .cta{padding-right: 30px; text-align: right; margin-bottom: 52px;} .seat-dashboard .block-left span{color: #222; font-size: 16px; font-style: normal; font-weight: 700; line-height: 22px;} .seat-dashboard .total-value .inner-total{border-radius: 6px; border: 1px solid rgba(119, 119, 119, 0.50); padding: 16px; background: #FFF; margin: 0 13px; box-shadow: 8px 8px 8px 0px rgba(153, 153, 153, 0.02); max-width: 355px;} .total-seat .block-right span{color: #0050AE; font-size: 24px; font-style: normal; font-weight: 800; line-height: 32px;} .total-use .block-right span{color: #F39D4D; font-size: 24px; font-style: normal; font-weight: 800; line-height: 32px;} .total-unoccupied .block-right span{color: #05B42C; font-size: 24px; font-style: normal; font-weight: 800; line-height: 32px;} .total-not-use .block-right span{color: #05B42C; font-size: 24px; font-style: normal; font-weight: 800; line-height: 32px;} .on-change-list img{cursor: pointer;} .list-booking-container .link-to-history, .view-all-seats-container .link-to-history{color: #0391E8; font-size: 14px; font-weight: 600; line-height: 17px; letter-spacing: 0em;} .list-booking-container .has-search{position: relative; border: 1px solid #DDD; height: 31px; border-radius: 6px; width: 450px;} .list-booking-container .has-search span, .view-all-seats-container .has-search span{position: absolute; right: 3px; top: 1px;} .list-booking-container .has-search select, .view-all-seats-container .has-search select{color: #666; font-size: 14px; font-style: normal; font-weight: 400; line-height: 24px; border: none; border-right: 1px solid #DDD; padding: 0 10px; height: -webkit-fill-available; border-top-left-radius: 6px; border-bottom-left-radius: 6px;} .list-booking-container .has-search select:focus-visible, .view-all-seats-container .has-search select:focus-visible, #seatAssignAreaStartTime, #seatAssignAreaEndTime{outline: none;} .list-booking-container .has-search input, .view-all-seats-container .has-search input{border: none; color: #666 !important; font-size: 14px; font-style: normal; font-weight: 400; line-height: 24px; padding: 0 20px; height: auto; border-radius: 6px;} .list-booking-container .has-search input:focus, .view-all-seats-container .has-search input:focus{border: none; box-shadow: none;} .list-booking-container .searchList{padding: 6px 24px 6px 24px; border-radius: 6px; border: 1px; background: #0391E8; font-size: 14px; font-weight: 700; line-height: 18px; color: #FFF; margin: 0 50px 0 16px; outline: none; cursor: pointer;} .on-change-list .download-list{margin: 0 15px; border: none; background: unset; padding: 0; outline: none;} .list-history-container h1, .view-all-seats-container h1{font-size: 31px; font-weight: 500; line-height: 37px; color: #4C4C4C;} .list-history-container .download-list, .view-all-seats-container .download-list{margin: 0 15px; border: none; background: unset; padding: 0; outline: none;} .list-history-container .download-list>img, .view-all-seats-container .download-list>img{cursor: pointer; padding-bottom: 4px;} .list-history-container .back-diagram>img, .view-all-seats-container .back-diagram>img{cursor: pointer;} .list-history-container .table thead th, .view-detail-container .table thead th{color: #666; font-size: 13px; font-style: normal; font-weight: 700; line-height: 22px; text-align: center; border: 1px solid #D1D1D1; vertical-align: middle;} .list-history-container .table tbody th, .list-history-container td, .view-detail-container .table tbody th, .view-detail-container td{color: #222; font-size: 14px; font-style: normal; font-weight: 400; line-height: 22px; text-align: center; border: 1px solid #D1D1D1;} .list-history-container .searchList{padding: 6px 24px 6px 24px; border-radius: 6px; border: 1px; background: #0391E8; font-size: 14px; font-weight: 700; line-height: 18px; color: #FFF; margin: 0 0 0 16px; outline: none; cursor: pointer;} .view-all-seats-container .searchList{padding: 6px 24px 6px 24px; border-radius: 6px; border: 1px; background: #0391E8; font-size: 14px; font-weight: 700; line-height: 18px; color: #FFF; margin: 0 50px 0 16px; outline: none; cursor: pointer;} .list-history-container .has-search select{color: #666; font-size: 14px; font-style: normal; font-weight: 400; line-height: 24px; border: none; border: 1px solid #DDD; padding: 5px 10px; border-top-left-radius: 6px; border-bottom-left-radius: 6px;} .list-history-container .has-search .search-seat-history{padding: 5px 10px; width: 250px; border-radius: unset; height: auto; border-top-right-radius: 6px; border-bottom-right-radius: 6px;} .view-all-seats-container .has-search .search-seat-list-view-all{padding: 5px 10px; width: 250px; border-radius: unset; height: auto; border-top-right-radius: 6px; border-bottom-right-radius: 6px;} .list-history-container .has-search .option, .view-all-seats-container .has-search .option{padding: 5px 80px 5px 10px; border-top-right-radius: 6px; border-bottom-right-radius: 6px;} .list-history-container .has-search .filter-department{margin-right: 20px; position: relative; height: 33px;} .view-all-seats-container .has-search .filter-department{margin-right: 20px; position: relative; height: 33px; border: 1px solid #DDD; border-radius: 6px;} .has-search .fa-search::before{content: unset} .list-booking-container .img_search_list_seat{padding-top: 5px;} .form-datepicker-group [type="date"]::-webkit-calendar-picker-indicator{opacity: 0;} .form-datepicker-group [type="date"]{background: url("/vti_seat_management/static/src/img/Calendar.svg") 92% 50% no-repeat; border: 1px solid #E4E4E4;} .form-datepicker-group .date-to{margin-right: 16px;} .form-datepicker-group .inner{margin-right: 56px;} .modal-booking-seat .modal-body .form-check-inline{margin-right: 72px;} .modal-booking-seat .modal-body .form-check-inline input{width: 20px; height: 20px;} .seat-list-confirmation .close{padding: 5px 35px 5px 35px; border-radius: 6px; border: 1px solid #0391E8; font-size: 14px; font-weight: 700; line-height: 18px; color: #0391E8; margin: 0 16px;} .seat-list-confirmation .confirm{padding: 5px 24px 5px 24px; border-radius: 6px; border: 1px solid #0391E8; font-size: 14px; font-weight: 700; line-height: 18px; color: #FFF; background: #0391E8; cursor: pointer;} .seat-list-confirmation .close:focus, .seat-list-confirmation .confirm:focus{outline: unset;} .seat-list-confirmation .information label, .dl-pm-view-history .information label, .view-detail-container .information label{font-size: 14px; font-weight: 400; color: #666;} .view-detail-container .information label{max-width: 100px;} .seat-list-confirmation .information input, .view-detail-container .information input{font-size: 14px; font-weight: 600; line-height: 18px; color: #212529; outline: none;} .seat-list-confirmation .information .form-group, .view-detail-container .form-group{margin-bottom: 0;} .seat-list-confirmation .information{margin-bottom: 20px;} .tutorial-contain{padding: 30px; background: #FFF;} .tutorial-contain form{background: #F2F2F2; text-align: center; padding: 15px; margin-bottom: 30px;} .tutorial-contain .input-file-trigger{background: linear-gradient(90.75deg, #0391E8 1.76%, #0050AE 100%); border-radius: 6px; padding: 12px 24px 12px 24px; font-size: 14px; font-weight: 700; line-height: 18px; color: #FFFFFF; margin: 0;} .tutorial-contain .type-support p{font-size: 14px; font-weight: 400; line-height: 18px; color: #666; margin: 0;} .tutorial-contain .type-support p span{font-size: 14px; font-weight: 700; line-height: 18px; padding: 3px 8px 3px 8px; border-radius: 4px;} .tutorial-contain .file-preview{padding: 30px 80px; background: #F2F2F2;} .modal-dialog-confirmation .modal-content{text-align: center; padding: 40px;} .modal-dialog-confirmation .modal-content h5{font-size: 24px; font-weight: 700; line-height: 29px; color: #222; padding: 0;} .modal-dialog-confirmation .modal-content .modal-header{justify-content: center; padding: 0;} .modal-dialog-confirmation .modal-content .modal-body{padding: 0;} .modal-dialog-confirmation .modal-content .modal-footer{justify-content: center; padding: 0;} .modal-dialog-confirmation .modal-content .modal-footer button{padding: 16px 24px 16px 24px; border-radius: 6px; background: linear-gradient(90.75deg, #0391E8 1.76%, #0050AE 100%); font-size: 13px; font-weight: 700; line-height: 18px; width: 100%;} .wrapper.date-from{padding: 0 15px;} .wrapper.date-from>span{padding-right: 10px;} .wrapper.date-to>span{padding-right: 10px;} .wrapper.date-from>input{height: 29px; min-width: 400px; border-radius: 10px; border: 1px solid; border-color: #CED4DA;} .wrapper.date-to>input{height: 40px;} .start-time-book-group{padding-left: 60px;} .departments-seat-attribution{height: 500px; padding-top: 40px; display: none;} .departments-seat-attribution-rate{height: 500px; padding-top: 40px; display: none;} .buildings-seat-attribution{height: 500px; padding-top: 40px; display: none;} .floors-seat-attribution{height: 500px; padding-top: 40px; display: none;} .actual-departments-seat-attribution{height: 500px; padding-top: 40px; display: none;} #report-time-select{height: 36px; font-family: sans-serif; font-size: 100%; outline: 0; border: 0; box-shadow: none; background: transparent !important; min-width: unset;} .select2-container-multi .select2-choices .select2-search-choice{padding: 7px 5px 7px 18px;} .js-hide-until-loaded{display: none;} .list-history-container .has-search span, .view-all-seats-container .has-search span{position: absolute; right: 20px; top: 8px;} #seatBlockReason{margin-left: 20px; border-radius: 10px; max-height: 30px;} .seat-check-type-booking input{appearance: auto} .seat-confirmation-container input{outline: none; cursor: default;} .dl-pm-view-history input{outline: none; cursor: default;} .modal-confirmation-seat .modal-content .modal-header{background: #057BBA; justify-content: center;} .modal-confirmation-seat .modal-content .modal-header h5{font-size: 19px; font-weight: 700; line-height: 23px; text-align: center; color: #FCFAFA; padding: 0;} .modal-confirmation-seat .modal-content .modal-body p{font-size: 16px; font-weight: 500; line-height: 19px; text-align: center; color: #000; margin: 0;} .modal-confirmation-seat .modal-content .modal-footer{justify-content: center;} .modal-confirmation-seat .modal-content .modal-footer .btn-seat-confirm{background: #057BBA;} .seat-list-confirmation .label-confirmed{background: #fff; color: #0391E8; border: 1px solid #0391E880; font-size: 14px; font-weight: 700; line-height: 18px; text-align: center; border-radius: 4px; padding: 5px;} .modal-block-seat-dialog input{outline: none;} .modal-booking-seat input{outline: none;} .modal-confirmation-seat .modal-content .modal-footer{justify-content: center;} .modal-confirmation-seat .modal-content .modal-footer .btn-savechange{background: #057BBA;} .modal-booking-list-dialog .modal-content{max-height: 763px;} .modal-booking-list-dialog .modal-content .modal-body{overflow-y: auto;} .modal-booking-list-dialog .modal-content .modal-body thead{position: sticky; top: -2px;} .modal-booking-list-dialog .modal-content .modal-body tbody{overflow-y: auto;} .book-paying-department{flex-wrap: nowrap;} #labelBookPayingDepartmentOne{text-align: center; padding-right: 10px; padding-left: 4px;} #seatBookingPayingDepartment{padding: 17px 16px; border-radius: 10px;} #s2id_seatBookingType, #s2id_seatBookingPayingDepartment{max-width: 425px; margin-left: 15px;} #s2id_seatBookingPurpose{max-width: 402px; margin-left: 14px;} #month-seat-history{outline: none; border-top-left-radius: unset; border-bottom-left-radius: unset;} .seat-element-hidden{display: none !important;} #seatAssignAreaStartTime, #seatAssignAreaEndTime{min-width: 441px; padding-left: 10px;} .seat-unset-padding{padding: unset !important;} .wrapper.date-from.select2-container{padding: unset;} #seatBlockGroupsReason{border-radius: 10px; max-height: 29px;} #seatBookingGroupsStartTime, #seatBookingGroupsEndTime{outline: none;} .modal-booking-seat .form-control.select2-container, .modal-booking-seat-group .form-control.select2-container, .modal-assign-area-dialog .form-control.select2-container, .popup-confirm-seat .form-control.select2-container, .popup-center-confirm .form-control.select2-container{height: fit-content !important; margin-top: 5px;} .modal-booking-seat .form-control .select2-choice .select2-arrow, .modal-booking-seat-group .form-control .select2-choice .select2-arrow, .modal-assign-area-dialog .form-control .select2-choice .select2-arrow, .popup-confirm-seat .form-control .select2-choice .select2-arrow, .popup-center-confirm .form-control .select2-choice .select2-arrow{border-left: unset; background-image: unset; background: unset;} .modal-booking-seat .form-control .select2-choice, .modal-booking-seat-group .form-control .select2-choice, .modal-assign-area-dialog .form-control .select2-choice, .popup-confirm-seat .form-control .select2-choice, .popup-center-confirm .form-control .select2-choice{border-radius: 10px; background-image: unset;} .modal-booking-seat .form-control, .modal-booking-seat-group .form-control, .modal-assign-area-dialog .form-control, #s2id_seatAssignAreaCompany, #s2id_seatAssignAreaDepartment, #seatAssignAreaDepartment, #seatAssignAreaCompany, #s2id_seatAssignBookingType{border-radius: 10px;} .modal-booking-seat .select2-container .select2-choice abbr, .modal-booking-seat-group .select2-container .select2-choice abbr, .modal-assign-area-dialog .select2-container .select2-choice abbr, .popup-confirm-seat .select2-container .select2-choice abbr, .popup-center-confirm .select2-container .select2-choice abbr{right: 20px; top: 7px;} .modal-booking-seat .select2-container.select2-allowclear .select2-choice .select2-chosen, .modal-booking-seat-group .select2-container.select2-allowclear .select2-choice .select2-chosen, .modal-assign-area-dialog .select2-container.select2-allowclear .select2-choice .select2-chosen, .popup-confirm-seat .select2-container.select2-allowclear .select2-choice .select2-chosen, .popup-center-confirm .select2-container.select2-allowclear .select2-choice .select2-chosen{font-size: 14px;} #seatBookingStartTime, #seatBookingGroupsStartTime, #seatBlockStartTime, #seatBlockGroupsStartTime, #seatBookingEndTime, #seatBookingGroupsEndTime{padding-left: 10px;} #seatBookingGroupsStartTime{min-width: 430px;} #seatBlockGroupsStartTime{min-width: 450px; margin-left: -40px;} .view-all-seats{padding-left: 20px;} .clickable-row, .clickable-dialog{cursor: pointer; position: relative;} .booking-type-label{display: inline-block; background-size: contain; background-repeat: no-repeat; font-size: 11px; font-weight: 200; padding: 0px 18px; line-height: 18px; height: 23px; margin-bottom: -6px;} .seat-dashboard .select2-container-multi .select2-search-choice-close{top: 6px;} .unset-padding-left{padding-left: unset;} #personal-history-date-from, #personal-history-date-to{height: unset; border-radius: 10px; min-width: -webkit-fill-available; height: 30px;} .label-type-book-group{min-width: 155px;} .label-paying-book-group{min-width: 155px; padding-top: 5px;} #s2id_seatBookingGroupsPayingDepartment{max-width: 432px; border-radius: 10px;} #s2id_seatBookingGroupsPurpose{border-radius: 10px; max-width: 400px; margin-left: 15px;} .btn-block-seat.handle-block-button-hide{min-width: 104px;} .popup-confirm-seat .modal-dialog, .popup-alert-seat .modal-dialog, .popup-long-validate .modal-dialog, .popup-center-confirm .modal-dialog{height: 70%; display: flex; align-items: center;} .popup-confirm-seat .modal-header, .popup-alert-seat .modal-header, .popup-long-validate .modal-header, .popup-center-confirm .modal-header{background-color: #057BBA; position: relative; display: flex; justify-content: center; padding: 7px;} .popup-confirm-seat .modal-title, .popup-alert-seat .modal-title, .popup-long-validate .modal-title, .popup-center-confirm .modal-title{color: #fff; font-weight: 600; font-size: 21px;} .popup-confirm-seat .modal-body, .popup-long-validate .modal-body{padding: 10px 10px 10px 20px; text-align: left; font-weight: 600;} .popup-alert-seat .modal-body, .popup-center-confirm .modal-body{padding: 10px 10px 10px 10px; text-align: center; font-weight: 600;} .popup-confirm-seat .modal-footer, .popup-alert-seat .modal-footer, .popup-long-validate .modal-footer, .popup-center-confirm .modal-footer{display: flex; justify-content: center; border: none; gap: 0 20px;} .popup-confirm-seat .btn-secondary, .popup-alert-seat .btn-secondary, .popup-center-confirm .btn-secondary{background-color: #F6F8FA; color: #000; font-weight: 500; border-color: #777777;} .popup-confirm-seat .btn-primary, .popup-alert-seat .btn-primary, .popup-center-confirm .btn-primary{background-color: #057BBA; color: #fff; font-weight: 500; border-color: #057BBA;} #s2id_checkoutReason, #s2id_checkoutReasonDetail, #s2id_checkoutReasonMulti{border-radius: 10px; text-align: start;} .btn-book-list, .btn-assign-list{background-color: #0391E8; border-radius: 7px; padding: 0px 5px 0px 5px; font-size: 14px;} .btn-block-list, .btn-dialog-seat-checkout-list{background-color: #fff; color: #0391E8; padding: 0px 5px 0px 5px; border-radius: 7px; font-size: 14px;} .assign-note{margin-bottom: -23px; font-size: 11px;} .assign-note p{font-size: 11px !important; font-style: italic !important;} .area-background .assigning-icon{position: absolute; right: 0; top: 0;} .modal-booking .form-group{margin-bottom: 8px;} .modal-booking .seat-check-type-booking{margin-top: 12px; margin-left: 15px;} .disable-scroll{overflow-y: hidden;} .modal-assign-area-dialog .form-group{margin-bottom: 8px;} .dn-room .inner-contain .block-user{padding: 0 8px;} .dn-room .inner-contain .block-employee{padding: 0 8px;} .dn-room .group-user .block-user .inner-block{margin-bottom: 20px;} .dn-room .span-line{position: absolute; left: 0; width: 2px; background: #E4E4E4; height: 205px; bottom: 0;} .right-horizontal-layout .inner.open-space{border-bottom: none;} .right-horizontal-layout .room-employee .odc-room{position: relative;} #odc-1-f2{border-left: 2px solid #DEDEDE;} .right-horizontal-layout .room-employee .odc-room .line-left{position: absolute; left: -40px; width: 136px; background: #E4E4E4; height: 2px; bottom: 0;} .group-employee-4 .row-employee-1 .block-employee-group .left-block-employee .line-bottom{position: absolute; width: 35px; background: #E4E4E4; height: 2px; bottom: -2px; right: 35px;} .group-employee-4 .row-employee-1 .block-employee-group .left-block-employee .line-bottom-left{position: absolute; width: 2px; background: #E4E4E4; height: 112px; bottom: 0; right: 68px;} .group-employee-4 .row-employee-1 .block-employee-group .left-block-employee .line-top-white{position: absolute; width: 20px; background: #FFFFFF; height: 2px; bottom: 111px; right: 15px;} .right-horizontal-layout .room-employee .odc-room .line-under{position: absolute; right: -13px; width: 172px; background: #E4E4E4; height: 2px; bottom: 0;} .relax-room-2 .work-space{border-bottom: 2px solid #DEDEDE; justify-content: center; padding: 75px 6px 88px 6px; background: #F2F2F2;} .relax-room-2 .work-space .group-employee{padding: 0 8px;} .horizontal-layout-second-floor-3 .employee-room-1 .block-employee.side{margin-left: -64px;} .horizontal-layout-second-floor-3 .block-employee-last{position: relative;} .horizontal-layout-second-floor-3 .block-employee-last .line-left{position: absolute; left: 0; width: 2px; background: #E4E4E4; height: 60px; bottom: -2px;} .horizontal-layout-second-floor-3 .block-employee-last .line-left-2{position: absolute; left: 0; width: 2px; background: #E4E4E4; height: 75px; bottom: 80px;} .horizontal-layout-second-floor-3 .block-employee-last .line-left-3{position: absolute; left: 0; width: 2px; background: #E4E4E4; height: 25px; bottom: 179px;} .horizontal-layout-second-floor-3 .block-employee-last .line-top{position: absolute; top: -45px; width: 116px; background: #E4E4E4; height: 2px; right: 0;} .horizontal-layout-second-floor-3 .rec-room-center .span-css{position: absolute; bottom: 0; width: 2px; background: #E4E4E4; height: 56px; right: 0;} .seat-non-clickable{cursor: unset;} .seatDeleteButton{cursor: pointer;} .redirect-book-screen{cursor: pointer;} .text-seat-code{display: none; border: 1px solid rgb(0, 0, 0); font-size: 4.5px !important; margin: unset !important; line-height: unset !important;} .view-seat-code{margin-left: 10px;} .enablePortBtn{margin-right: -5px;} .disablePortBtn{margin-right: -20px;} .user-img-container{padding-right: 6px;} .user-image{height: 23px;} .status-contain{padding-right: 0;} .seat-menu-container{transition: width 0.8s ease-in-out, margin 0.8s ease-in-out; overflow: hidden; white-space: nowrap;} .seat-menu-container.hidden{width: 0; margin-left: -16.67%;} .seat-menu-container.open{width: 16.67%;} .content-expanded{transition: width 0.5s ease-in-out;} .seat-toggle-btn{position: absolute; top: 9px; right: 20px; z-index: 1000; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border: 2px solid #cccccc; color: #000000; cursor: pointer; font-size: 15px; margin-left: 5px;} #seat-content-container .seat-toggle-btn{top: 9px; left: 15px} .seat-toggle-btn:hover{background-color: #cccccc;} .seat-toggle-btn::after{position: absolute; left: 30px; color: black; padding: 5px 10px; border-radius: 5px; font-size: 13px; white-space: nowrap; opacity: 0; transform: translateY(-50%); top: 50%; transition: opacity 0.3s ease;} .seat-toggle-btn:hover::after{opacity: 1;} .seat-rotated-custom{transform: rotate(180deg); transition: transform 0.5s ease-in-out;} .seat-content-center{transition: all 0.3s ease-in-out;} .submenu a{white-space: normal;} #seat-content-container .hidden{visibility: hidden;} #seat-menu-container .hidden{visibility: hidden;} 

/* /vti_seat_management/static/src/css/menu.css defined in bundle 'web.assets_frontend' */
#menu-content .inner-menu{padding: 21px 20px; background: #FFF;} #menu-content .inner-menu h1{color: #4C4C4C; font-size: 18px; font-style: normal; font-weight: 700; line-height: normal; margin-bottom: 30px;} .inner-menu .group-building ul li.menu-has-children{list-style-image: url('/vti_seat_management/static/src/img/Building.svg');} .group-building ul .menu-has-children .submenu li.active::before{color: #0391E8;} .inner-menu .submenu li.active .nav-link{color: #0391E8;} .inner-menu .group-function ul li.menu-has-children{list-style-image: url('/vti_seat_management/static/src/img/list-menu-icon.svg');} ul li.report-item{list-style-image: url('/vti_seat_management/static/src/img/Chart.svg');} ul li.history-item{list-style-image: url('/vti_seat_management/static/src/img/File.svg');} ul li.guidelines-item{list-style-image: url('/vti_seat_management/static/src/img/Question.svg');} ul li.admin-config-item{list-style-image: url('/vti_seat_management/static/src/img/Admin.png');} ul li.seat-report-item{list-style-image: url('/vti_seat_management/static/src/img/Report.png');} ul li.confirmation-item{list-style-image: url('/vti_seat_management/static/src/img/Confirmation.svg');} .group-function ul .menu-has-children .submenu{list-style: circle;} .group-function ul .menu-has-children .submenu li{list-style: unset;} .inner-menu ul .menu-has-children .submenu li{border-bottom: 1px solid #E4E4E4; list-style: circle;} .inner-menu .nav-item .nav-item-link{color: #212529; font-size: 13px; font-style: normal; font-weight: 600; line-height: 18px;} .inner-menu .nav-item{margin-bottom: 30px;} .inner-menu .nav-item .nav-link{color: #212529; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; padding: 16px 0 16px 0;} .seat-diagram-contain .btn-book{padding: 10px 34px !important; border-radius: 6px; border: 1px solid #0391E8; background: #0391E8; color: #FFF; text-align: center; font-size: 14px; font-style: normal; font-weight: 700; line-height: 18px;} .seat-diagram-contain .btn-action{margin-bottom: 15px; margin-top: 10px;} .diagram-title h1{color: #4C4C4C; font-size: 30.527px; font-style: normal; font-weight: 500; line-height: normal;} .diagram-title .breadcrumb{background: unset; padding: 0;} .diagram-title .breadcrumb a{color: #666; font-size: 14px; font-style: normal; font-weight: 400; line-height: 24px; cursor: unset;} .diagram-title .breadcrumb li.active{color: #212529; font-size: 14px; font-weight: 700; line-height: 24px;} .diagram-title .breadcrumb li{display: block;} .diagram-title .breadcrumb-item.breadcrumb-item::before{content: url('/vti_seat_management/static/src/img/ArrowDown.svg'); vertical-align: sub;} .diagram-title .breadcrumb-item:first-child::before, .diagram-title .breadcrumb-item:first-of-type::before{content: none !important;} #seatTableEmployeeOther{display: none; cursor: pointer;} #seatAssignAreaColor{width: 30px; height: 30px; border: solid 1px;} .menu-has-children.show .nav-item-link::after{content: url('/vti_seat_management/static/src/img/Arrow-Down2.svg'); position: absolute; right: 0; top: 3px;} .menu-has-children.not-show .nav-item-link::after{content: url('/vti_seat_management/static/src/img/Arrow-Down2.svg'); position: absolute; right: 0; top: 3px; transform: rotate(-90deg);} .inner-menu li.menu-has-children{position: relative;} .menu-has-children.rotate .nav-item-link::after{transform: rotate(-90deg);} 

/* /vti_seat_management/static/src/css/handico.css defined in bundle 'web.assets_frontend' */
.diagram-content.handico-diagram .area-background{margin: unset} .floor-diagram-wrapper{width: 100%; display: flex;} .floor-container{width: 1272px; height: 500px; display: flex; margin: auto;} .floor-diagram-left, .floor-diagram-right{width: 300px; height: 100%; position: relative; flex-shrink: 0; z-index: 1;} .floor-diagram-right{transform: scaleX(-1);} .floor-diagram-right .text-content{transform: scaleX(-1);} .floor-container .stairs{position: absolute; top: 0; right: 0; width: 73px; height: 133px; border: 1px solid #e4e4e4; background-color: #f5f5f5; padding-top: 51px; color: #888; font-size: 13px; font-weight: 16px; text-align: center;} .left-shape-1{position: absolute; top: -1px; right: 72px; width: 147px; height: 145px; clip-path: polygon(100% 0, 100% 95%, 25% 95%, 17% 100%, 5% 81%); background-color: #e4e4e4; z-index: 1; &::before{content: ""; position: absolute; top: 2px; right: 1px; width: 145px; height: 142px; background-color: #f5f5f5; z-index: -1; clip-path: polygon(100% 0, 100% 95%, 25% 95%, 17% 100%, 5% 82%);}} .left-shape-2{position: absolute; width: 91px; height: 60px; border: 1px solid #e4e4e4; background-color: #f5f5f5; top: 138px; left: 27px; transform: rotate(-39deg); z-index: 2;} .floor-container .elevator{width: 65px; height: 60px; border: 1px solid #e4e4e4; background-color: #f5f5f5;} .floor-container .elevator{width: 65px; height: 60px; border: 1px solid #e4e4e4; background-color: #f5f5f5;} .floor-container .elevator.text-content{padding-top: 16px; font-size: 13px; line-height: 15px; font-weight: 400; text-align: center; color: #888;} .elevator-wrapper-1{position: absolute; display: flex; top: 157px; left: 116px; z-index: 3;} .left-shape-3{width: 65px; height: 60px; content: ""; position: absolute; right: 100%; border: 1px solid #e4e4e4; background-color: #f5f5f5; top: 157px; left: 59px;} .left-shape-4{width: 270px; height: 66px; position: absolute; right: 0; top: 217px; background-color: #e4e4e4; clip-path: polygon(10% 0, 100% 0, 100% 100%, 7% 100%, 0% 31%); &::after{content: ""; position: absolute; top: 0px; right: 0px; left: 1px; width: 269px; height: 65px; background-color: #fff; clip-path: polygon(10% 0, 100% 0, 100% 100%, 7% 100%, 0% 31%);}} .elevator-wrapper-2{position: absolute; display: flex; top: 282px; left: 116px; z-index: 3; &::after{content: ""; position: absolute; left: 100%; top: 0; width: 54px; height: 60px; border: 1px solid #e4e4e4; background-color: #f5f5f5;}} .left-shape-5{width: 52px; height: 60px; position: absolute; right: 0; top: 342px; background-color: #f5f5f5; border: 1px solid #e4e4e4;} .left-shape-5.text-content{font-size: 13px; line-height: 16px; text-align: center; color: #888; padding-top: 11px;} .left-shape-6{width: 160px; height: 131px; position: absolute; right: 52px; top: 342px; background-color: #e4e4e4; clip-path: polygon(17% 0, 100% 0, 100% 75%, 80% 100%, 0 18%); &::before{content: ""; position: absolute; top: 2px; right: 2px; bottom: 2px; left: 2px; clip-path: polygon(17% 0, 100% 0, 100% 75%, 80% 100%, 0 18%); background-color: #f5f5f5;}} .left-shape-6 .shape-text{position: absolute; font-size: 13px; line-height: 16px; text-align: center; color: #888; top: 41px; right: 14px;} .left-shape-7{position: absolute; bottom: 0; right: 0; width: 84px; height: 60px; background-color: #e4e4e4; clip-path: polygon(38% 0, 100% 0, 100% 100%, 42% 100%, 0 54%); &::before{content: ""; position: absolute; top: 2px; right: 2px; bottom: 2px; left: 2px; clip-path: polygon(38% 0, 100% 0, 100% 100%, 42% 100%, 0 54%); background-color: #f5f5f5;}} .left-shape-7 .shape-text{position: absolute; font-size: 13px; line-height: 16px; text-align: center; color: #888; top: 21px; right: 12px;} .floor-diagram-center{flex: 1 1 0%; min-width: 0px; border-top: 1px solid #e4e4e4; position: relative;} .shapes{display: flex;} .center-room{border: 1px solid #e4e4e4; background-color: #f2f2f2;} .first-row{display: flex; gap: 0 16px; justify-content: end;} .first-row .left, .first-row .right{display: flex; flex-direction: column; gap: 1px;} .center-room-1{width: 99px; height: 130px; font-size: 13px; line-height: 16px; font-weight: 400; color: #888; text-align: center; padding: 31px 13px 0px 13px;} .center-room-2{width: 73px; height: 100px; padding-top: 38px; font-size: 13px; line-height: 16px; font-weight: 400; color: #888; text-align: center;} .first-row .seats{gap: 0 60px; padding-top: 10px;} .seats{display: flex;} .seats .seat-row{display: flex; gap: 0 20px;} .seats .seat-row .group{display: flex; gap: 1px;} .seats .seat-row .group .seat{width: 24px; height: 24px; position: relative;} .second-row{width: fit-content; padding-left: 59px; margin-top: 27px; display: flex; border-top: 2px solid #e4e4e4; border-left: 2px solid #e4e4e4; position: relative;} .second-row::before{content: ""; position: absolute; top: 70px; left: -2px; width: 4px; height: 129px; background-color: #fff;} .second-row .right-stick{position: absolute; top: 0px; bottom: 21px; width: 2px; right: -63px; background-color: #e4e4e4;} .second-row .right-stick::before{content: ""; position: absolute; top: 70px; left: -2px; width: 4px; height: 41px; background-color: #fff;} .second-row .seats, .third-row .seats{flex-direction: column; gap: 1px 20px;} .third-row .seats{position: relative;} .third-row .seats::after{position: absolute; content: ""; bottom: 0; right: 45px; left: -59px; height: 1px; background-color: #e4e4e4;} .center-room-4{content: ""; position: absolute; width: 90px; top: -35px; right: -84px; height: 53px; background-color: #e4e4e4; clip-path: polygon(0 0, 71% 0, 100% 41%, 67% 100%);} .center-room-4::after{content: ""; position: absolute; top: 1px; left: 1px; bottom: 1px; width: 88px; height: 50px; background-color: #f2f2f2; clip-path: polygon(2% 0, 71% 0, 100% 41%, 67% 100%);} .center-room-3{width: 129px; height: 197px; margin-left: 25px; font-size: 13px; font-weight: 16px; color: #888; text-align: center; padding-top: 83px;} .third-row{position: absolute; bottom: 0; left: 0; padding-left: 60px; z-index: 2;} .third-row::before{content: ""; position: absolute; width: 32px; top: -35px; right: -90px; height: 1px; background-color: #e4e4e4; transform: rotate(40deg); transform-origin: left;} .third-row::after{content: ""; position: absolute; width: 188px; bottom: 0; right: -143px; height: 1px; background-color: #e4e4e4; transform: rotate(-47deg); transform-origin: left;} #kyoto-meeting-room{position: absolute; top: 17px; right: 9px; max-width: 99px; max-height: 45px;} @media (max-width: 1549px){.floor-diagram-wrapper::-webkit-scrollbar{height: 5px;}.floor-diagram-wrapper::-webkit-scrollbar-thumb{background-color: transparent; border-radius: 10px; transition: background-color 2s ease-out;}.floor-diagram-wrapper.scrolling::-webkit-scrollbar-thumb{background: #E8E8E8;}.floor-diagram-wrapper::-webkit-scrollbar-track{background-color: #FFFFFF; border-radius: 10px;}} 

/* /vti_seat_management/static/src/css/fourth_floor.css defined in bundle 'web.assets_frontend' */
.diagram-content.fourth-vti-diagram .area-background{margin: unset} .fourth-vti-diagram{margin-bottom: 120px;} .flat-floor-container{height: 345px; flex-shrink: 0; margin-left: 30px;} .flat-diagram-container{padding-top: 70px; width: 100%; height: 100%;} .flat-diagram{border: 3px solid #e4e4e4; height: 100%; display: flex; flex-direction: column; justify-content: space-between;} .flat-first-row{display: flex;} .seats.flat{flex-direction: column; flex: 2; gap: 1px 0px;} .flat-box{border: 1px solid #e4e4e4; background-color: #f2f2f2; font-size: 13px; line-height: 15px; color: #888888; display: flex; justify-content: center; align-items: center; text-align: center;} .flat-box-1{width: 73px; height: 83px;} .flat-box-2{width: 128px; height: 83px;} .flat-box-3{width: 122px; height: 83px; padding: 0px 10px 0px 10px;} .flat-box-4{width: 73px; height: 83px;} .flat-box-5{width: 65px; height: 75px; position: relative;} .flat-box-5::before{content: ""; position: absolute; bottom: calc(100% + 1px); height: 43px; left: -1px; right: -1px; border: 1px solid #e4e4e4; background-color: #f2f2f2;} .flat-box-6{width: 73px; height: 117px; position: relative; top: -43px;} .flat-box-7{width: 65px; height: 76px; position: relative;} .flat-box-7::before{content: ""; position: absolute; bottom: 100%; height: 43px; left: -1px; right: -3px; border: 3px solid #e4e4e4; border-bottom: unset; background-color: #fff; border-left: 1px solid #e4e4e4;} .flat-box-8{width: 92px; height: 83px; padding: 10px 15px 10px 15px;} .flat-box-9{width: 26px; height: 83px;} .flat-box-10{width: 113px; height: 83px;} .flat-box-11{position: absolute; bottom: calc(100% + 1px); left: -1px; right: -3px; height: 57px; border: none;} .flat-box-wrapper{position: relative;} .flat-box-wrapper-flex{display: flex;} .flat-box-12{position: absolute; bottom: 100%; height: 43px; width: 100%;} .flat-seats-left.seats .seat-row{gap: 0 13px; justify-content: center;} .flat-seats-right.seats .seat-row{gap: 0 18px; justify-content: center;} .flat-seats-left{padding-top: 11px; padding-left: 13px; padding-right: 8px;} .flat-seats-right{padding-top: 11px; padding-left: 11px; padding-right: 11px;} .flat-second-row{padding-bottom: 4px;} .flat-second-row .seats{flex-direction: column; gap: 1px 0;} .flat-second-row .seats .seat-row{gap: 0 16px; justify-content: center;} .flat-second-row .group.center{width: 49px; display: flex; justify-content: center;} .meeting-room-style{color: #FFF; text-align: center; font-size: 13px; font-style: normal; font-weight: 600; line-height: normal; margin: 0; padding: 6px; background: #0050AE; border-radius: 8px;} .flat-seats-center{background-color: #fff; border-right: 3px solid #e4e4e4; border-left: unset; border-bottom: unset; border-top: unset; justify-content: end;} 

/* /vti_seat_management/static/src/css/dakao_fourth.css defined in bundle 'web.assets_frontend' */
.dakao-wrapper{display: flex; justify-content: center;} .dakao-container{position: relative; width: 90vw; max-width: 850px; aspect-ratio: 850 / 350; border: 2px solid #DEDEDE;} .dakao-room{position: absolute; box-sizing: border-box; background-color: #f5f5f5; border: 1px solid #DEDEDE; color: #8a8a8a; display: flex; justify-content: center; align-items: center; text-align: center; font-size: 13px; line-height: normal; font-weight: 400; font-style: normal;} .dakao-stairs-top{top: 0; left: 0; width: 15%; height: 25%;} .dakao-testing-room{top: 0; left: 25%; margin-left: -1px; width: 20%; height: 25%;} .dakao-warehouse{bottom: 0; left: 6%; width: 19%; height: 35%;} .dakao-meeting-room{bottom: 0; left: 25%; width: 33%; height: 45%;} .dakao-relax-area{bottom: 0; right: 0; width: 35%; height: 15%;} .dakao-seats-1{position: absolute; left: 450px; top: 30px;} .dakao-seats-2{position: absolute; left: 660px; top: 30px;} .dakao-seats-3{position: absolute; left: 660px; top: 160px;} 

/* /vti_seat_management/static/src/css/song_da.css defined in bundle 'web.assets_frontend' */
 .song-da-wrapper{width: 1194px; height: 722px; border: 1px solid #dbdbdb; position: relative; z-index: 4;} .sd-center-seat-group-1{position: absolute; top: 80px; left: 30px;} .sd-center-seat-group-2{position: absolute; top: 180px; left: 30px;} .sd-center-left-seat-group-1{position: absolute; top: 50px; left: -145px;} .sd-center-left-seat-group-2{position: absolute; top: 145px; left: -145px;} .sd-mid-left-seat-group-1{position: absolute; top: 220px; left: 290px;} .sd-mid-left-seat-group-2{position: absolute; top: 270px; left: 265px;} .sd-mid-left-seat-group-3{position: absolute; top: 335px; left: 265px;} .sd-mid-right-seat-group-1{position: absolute; top: 220px; right: 355px;} .sd-mid-right-seat-group-2{position: absolute; top: 270px; right: 355px;} .sd-mid-right-seat-group-3{position: absolute; top: 335px; right: 355px;} .sd-center-right-seat-group-1{position: absolute; top: 50px; right: -120px;} .sd-center-right-seat-group-2{position: absolute; top: 145px; right: -120px;} .sd-center-right-seat-group-3{position: absolute; top: 220px; right: -120px;} .sd-left-seat-group-1{position: absolute; top: 150px; left: 20px;} .sd-left-seat-group-2{position: absolute; top: 230px; left: 45px;} .sd-left-seat-group-3{position: absolute; top: 305px; left: 20px;} .sd-left-seat-group-4{position: absolute; top: 370px; left: 20px;} .sd-left-seat-group-5{position: absolute; top: 445px; left: 45px;} .sd-left-seat-group-6{position: absolute; top: 520px; left: 20px;} .sd-left-seat-group-7{position: absolute; top: 605px; left: 35px;} .sd-left-seat-group-8{position: absolute; top: 670px; left: 40px;} .sd-right-seat-group-1{position: absolute; top: 105px; right: 20px;} .sd-right-seat-group-2{position: absolute; top: 150px; right: 20px;} .sd-right-seat-group-3{position: absolute; top: 250px; right: 20px;} .sd-right-seat-group-4{position: absolute; top: 330px; right: 20px;} .sd-right-seat-group-5{position: absolute; top: 420px; right: 20px;} .sd-right-seat-group-6{position: absolute; top: 500px; right: 20px;} .song-da-edge{position: absolute; z-index: 1;} .edge-top-right{top: 0; right: 0;} .edge-top-right::after{position: absolute; content: ""; right: -1px; top: -1px; height: 37px; width: 297px; border-width: 1px; border-style: solid; border-top-color: #fff; border-right-color: #fff; border-left-color: #dbdbdb; border-bottom-color: #dbdbdb;} .edge-top-right::before{position: absolute; content: ""; right: -1px; top: 35px; width: 17px; height: 64px; border-width: 1px; border-style: solid; border-top-color: #fff; border-right-color: #fff; border-left-color: #dbdbdb; border-bottom-color: #dbdbdb; z-index: 2;} .edge-bottom-right{position: absolute; bottom: 0px; right: 0px;} .edge-bottom-right::after{position: absolute; content: ""; right: -1px; bottom: 28px; width: 21px; height: 57px; border-width: 1px; border-style: solid; border-top-color: #dbdbdb; border-right-color: #fff; border-left-color: #dbdbdb; border-bottom-color: #fff; z-index: 2;} .edge-bottom-right::before{position: absolute; content: ""; right: -1px; bottom: -1px; width: 189px; height: 30px; border-width: 1px; border-style: solid; border-top-color: #fff; border-right-color: #fff; border-left-color: #dbdbdb; border-bottom-color: #fff; z-index: 2;} .edge-bottom-left{left: 0; bottom: 0;} .edge-bottom-left::after{position: absolute; content: ""; width: 16px; height: 133px; right: -15px; bottom: -1px; border-width: 1px; border-style: solid; border-top-color: #dbdbdb; border-right-color: #dbdbdb; border-left-color: #fff; border-bottom-color: #fff; z-index: 2;} .edge-bottom-left::before{position: absolute; content: ""; width: 199px; height: 21px; left: 14px; bottom: -1px; border-width: 1px; border-style: solid; border-top-color: #dbdbdb; border-right-color: #dbdbdb; border-left-color: #fff; border-bottom-color: #fff; z-index: 3;} .song-da-box{border: 1px solid #e4e4e4; background-color: #f2f2f2; display: flex; justify-content: center; align-items: center; font-size: 13px; line-height: 16px; font-weight: 400; color: #888;} .boxes-top{display: flex;} .boxes-top-left{display: inline-flex;} .box-top-left-1{width: 355px; height: 144px; border-top: none; border-left: none;} .box-top-left-2{width: 185px; height: 83px; transform: translateX(-50%); border-top: none;} .boxes-top-center{position: relative;} .box-top-center{width: 64px; height: 141px; border-top: none;} .boxes-top-right-1{position: absolute; right: 295px;} .box-top-right-1{width: 175px; height: 82px; border-right: none; border-top: none;} .boxes-top-right-wrapper{display: flex;} .boxes-top-right-col-wrapper{display: flex; flex-direction: column;} .box-top-right-2, .box-top-right-3{width: 100%; height: 100%;} .box-top-right-2{border-top: none;} .box-top-right-3{border-bottom: none;} .box-top-right-4{width: 149px; height: 58px; margin-left: auto;} .boxes-top-right-2{position: absolute; top: 35px; right: 15px;} .box-top-right-5{width: 148px; height: 68px;} .boxes-bottom-left{position: absolute; bottom: 0; left: 212px; display: flex; align-items: end;} .box-bottom-left-1{width: 151px; height: 65px; border-bottom: none;} .box-bottom-left-2{width: 103px; height: 73px; border-bottom: none;} .boxes-bottom-right{position: absolute; bottom: 29px; right: 19px;} .box-bottom-right{width: 169px; height: 86px;} .boxes-center{position: absolute; top: 222px; left: 450px; display: flex; flex-direction: column;} .boxes-row-wrapper{display: flex;} .boxes-row-wrapper.first-row{padding-right: 10px; margin-left: auto;} .box-center-1, .box-center-2{width: 90px; height: 60px; border-bottom: none;} .box-center-3{width: 138px; height: 75px; border-right: none;} .box-center-4{width: 90px; height: 75px;} .boxes-center-bottom{position: absolute; bottom: 218px; left: 465px;} .boxes-center-bottom::after, .boxes-center-bottom::before{content: ""; position: absolute; width: 1px; height: 218px; top: 100%; background-color: #d1d1d1;} .boxes-center-bottom::before{left: 0;} .boxes-center-bottom::after{right: 0;} .box-center-bottom{width: 180px; height: 68px;} .song-da-separator-left{position: absolute; height: 208px; width: 1px; background-color: #d1d1d1; top: 180px; left: 355px;} .song-da-separator-right{position: absolute; height: 208px; width: 1px; background-color: #d1d1d1; top: 180px; right: 446px;} .song-da-separator-left::after{content: ""; position: absolute; top: 39px; width: 110px; right: 100%; height: 1px; background-color: #d1d1d1;} .song-da-separator-right::after{content: ""; position: absolute; top: 39px; width: 110px; left: 100%; height: 1px; background-color: #d1d1d1;} .song-da-line-right{position: absolute; top: 235px; right: 0px; height: 1px; width: 197px; background-color: #d1d1d1;} .floor-plan-container{position: relative; width: 800px; height: 400px; margin: 50px auto;} .wall-sd{position: absolute; background-color: #d3d3d3;} .sd7-group{position: absolute;} .wall-top{top: 10px; left: -10px; width: 760px; height: 2px;} .wall-right{top: 20px; right: 20px; width: 2px; height: 290px;} .wall-bottom{bottom: 90px; left: 130px; width: 650px; height: 2px;} .wall-left{top: 10px; left: -10px; width: 2px; height: 110px;} .wall-left-2{top: 120px; left: 20px; width: 2px; height: 155px;} .wall-bottom-left-short{top: 275px; left: 20px; width: 110px; height: 2px;} .wall-bottom-left-vertical{top: 275px; left: 130px; width: 2px; height: 35px;} .internal-wall-1{top: 120px; left: 240px; width: 2px; height: 190px;} .internal-wall-2{top: 120px; left: 397px; width: 2px; height: 190px;} .internal-wall-3{top: 120px; left: 540px; width: 2px; height: 180px;} .internal-wall-top-1{top: 120px; left: -10px; width: 55px; height: 2px;} .internal-wall-top-2{top: 120px; left: 105px; width: 170px; height: 2px;} .internal-wall-top-3{top: 120px; left: 320px; width: 110px; height: 2px;} .internal-wall-top-4{top: 120px; left: 470px; width: 70px; height: 2px;} .meeting-room-sd7{position: absolute; background-color: #f0f0f0; display: flex; align-items: center; justify-content: center;} .hoi-an-meeting-room-1{bottom: 90px; right: 110px; width: 150px; height: 60px; border: 2px solid #d3d3d3;} .hue-meeting-room-2{top: 10px; right: -25px; width: 90px; height: 120px; writing-mode: vertical-rl; text-orientation: mixed; border: 2px solid #d3d3d3; padding: 15px 0px;} .sd7-group-1{top: 20px; left: 70px;} .sd7-group-2{top: 50px; left: 70px;} .sd7-group-3{top: 20px; left: 240px;} .sd7-group-4{top: 20px; left: 310px;} .sd7-group-5{top: 20px; left: 370px;} .sd7-group-6{top: 20px; left: 510px;} .sd7-group-7{top: 20px; left: 570px;} .sd7-group-8{top: 20px; left: 660px;} .sd7-group-9{top: 130px; left: 40px;} .sd7-group-10{top: 150px; left: 90px;} .sd7-group-11{top: 150px; left: 160px;} .sd7-group-12{top: 150px; left: 225px;} .sd7-group-13{top: 130px; left: 260px;} .sd7-group-14{top: 150px; left: 320px;} .sd7-group-15{top: 150px; left: 440px;} .sd7-group-16{top: 130px; left: 520px;} .sd7-group-17{top: 110px; left: 580px;} .sd7-group-18{top: 110px; left: 660px;} .sd7-group-19{top: 138px; left: 755px;} 

/* /vti_seat_management/static/src/css/responsive.css defined in bundle 'web.assets_frontend' */
@media (min-width: 1400px) and (max-width: 1530px){.horizontal-layout-second .hcm-room{width: 7.0625rem;}#menu-content .inner-menu{padding: 15px;}.group-building .submenu{padding-left: 16px;}.seat-diagram-contain .diagram-inner{padding: 15px !important;}.seat-diagram-contain .btn-action{margin-bottom: 10px;}.left-horizontal-layout .stair{width: 4.375rem;}.left-horizontal-layout .rest-room{padding: 41px 22px; width: 4.3125rem;}.left-horizontal-layout .hcm-room{padding: 26px 15px; width: 8.0625rem;}.diagram-content .room-style p{padding: 5px; font-size: 12px;}.left-horizontal-layout .it-room{width: 7.5rem; padding: 8px 10px 8px 10px;}.diagram-content .normal-font p{font-size: 12px;}.center-horizontal-layout .server-room{padding: 30px 6px; max-width: 3.2rem;}.center-horizontal-layout .elevator{padding: 33px 6px; max-width: 3.5rem;}.center-horizontal-layout .pump-room{max-width: 3.2rem; padding: 40px 6px;}.right-horizontal-layout .cfo-room span{font-size: 12px;}.right-horizontal-layout .cfo-room{padding: 6px;}.right-horizontal-layout .inner{height: 9.2375rem;}.right-horizontal-layout .room-list{width: 11.875rem; padding: 4px 0px 5px;}.right-horizontal-layout .milk-room{width: 2.875rem; padding: 28px 5px;}.right-horizontal-layout .rest-room-last{width: 6.0625rem; padding: 32px 40px;}.right-horizontal-layout .health-room{width: 3.25rem; padding: 28px 4px;}.lobby .hn-room{width: 7.4375rem; height: 9.1875rem; padding: 54px 14px; border-left: unset;}.employee-group .vms-group{width: 7.5625rem; padding: 6px 15px 5px 6px;}.employee-group .center-group-vms{width: 3.5rem; padding: 8px 9px 0 10px;}.horizontal-layout-second .ga-group{width: 11.5625rem; padding: 7px 10px 38px 5px;}.horizontal-layout-second .relax-room{width: 3.5875rem; padding: 72px 10px;}.horizontal-layout-second .rec-group{width: 13.2rem; padding-right: 0;}.horizontal-layout-second .rec-group .rec-block{padding: 6px 2px;}.horizontal-layout-second .dn-room{width: 15.1rem;}.list-booking-container .pagination-contain{align-items: baseline;}.list-booking-container .table thead th{vertical-align: middle;}.list-booking-container tbody td{vertical-align: middle;}.list-booking-container tbody td:last-child{width: 13.6rem;}.view-all-seats-container .table thead th{vertical-align: middle;}.view-all-seats-container tbody td{vertical-align: middle;}.view-all-seats-container tbody td:last-child{width: 13.6rem;}.diagram-content .tokyo-room{width: 6.4rem; padding: 26px 12px;}.diagram-content .cto-room{width: 4rem;}.center-horizontal-layout .storage-room-2{height: 6rem;}.center-horizontal-layout .technique-room{padding: 18px 6px;}.right-horizontal-layout .room-employee .group-user{padding: 4px 4px;}.horizontal-layout-second .block-corner .elevator{border-right: unset; width: 4.2rem;}.horizontal-layout-second .group-employee-1{width: 5.4rem;}.horizontal-layout-second .inner .block-employee{padding: 8px 2px;}.horizontal-layout-second .bo-group{padding: 6px;}.horizontal-layout-second .relax-room-2{width: 8.2375rem; padding: 0;}.horizontal-layout-second .block-corner{width: 5.8rem; border-right: 2px solid #DEDEDE;}.group-employee-3 .it-group{padding: 6px 2px;}.horizontal-layout-second .group-employee-3 .it-area .block-employee{padding: 6px 2px;}.group-employee-4 .row-employee-1 .block-employee-group{padding: 5px 4px 15px 4px;}.group-employee-4 .row-employee-2{width: 11rem; padding: 0 2px 14px 0px; justify-content: center;}.group-employee-4 .row-employee-2 block-employee{padding: 0 6px;}.horizontal-layout-second .group-employee-4{width: 11rem;}.traning-floor-3 .traning-employee-group .block-employee{padding: 0 4px;}.diagram-content .center-horizontal-layout-table .employee-room{vertical-align: bottom;}.diagram-content .right-horizontal-layout .rec-room .block-employee{padding: 6px 4px;}.horizontal-layout-second-floor-3 .rec-room-center .block-employee{justify-content: center;}.horizontal-layout-second-floor-3 .rec-room-center{padding: 10px 0px 9px 0px;}.horizontal-layout-second-floor-3 .london-room{padding: 10px 4px;}.horizontal-layout-second-floor-3 .employee-room-1{width: 9.5rem; padding: 13px 4px 42px 4px;}.horizontal-layout-second-floor-3 .employee-room-2 .group-block{padding: 15px 4px 18px;}.horizontal-layout-second-floor-3 .employee-room-2 .group-block .block-employee{padding: 0 4px;}.horizontal-layout-second-floor-3 .employee-room-2 .single-block{padding: 15px 16px 18px 0;}.horizontal-layout-second-floor-3 .relax-room-3{width: 8rem;}.horizontal-layout-second-floor-3 .relax-room-3 .block-1{padding: 15px 10px 18px 10px;}.horizontal-layout-second-floor-3 .relax-room-3 .block-2{padding: 15px 0 18px 0;}.horizontal-layout-second-floor-3 .employee-room-3 .right-group{padding: 15px 0 17px 0;}.horizontal-layout-second-floor-3 .employee-room-3 .single-block{padding: 15px 0px 15px 0px;}.horizontal-layout-second-floor-3 .employee-room-3 .center-group .block-employee{padding: 0;}.horizontal-layout-second-floor-3 .employee-room-3 .right-group .group-inner{padding: 0;}.horizontal-layout-second-floor-3 .employee-room-2{width: 18.925rem;}.seat-dashboard .total-value .inner-total{padding: 10px; margin: 0 10px; max-width: 259px;}.group-building ul{padding-left: 32px;}.group-function ul{padding-left: 32px;}.modal-booking .modal-content{padding: 10px 20px;}.modal-booking .modal-footer{padding: 5px;}.employee-group .vms-group .left{padding: 26px 4px 0 0px;}.employee-group .vms-group .right{padding: 6px 0 6px 4px;}.horizontal-layout-second .lobby{width: 10.8125rem;}.dn-room .inner-contain .block-user{padding: 0 4px;}.employee-group .vms-group .center{padding: 0 4px 0 4px;}.relax-room-2 .work-space{padding-bottom: 77px;}.group-employee-4 .row-employee-2 .block-employee:first-child{margin-left: 0;}.horizontal-layout-second-floor-3.horizontal-layout-second .block-corner{border-right: unset; width: 6.2rem;}.horizontal-layout-second-floor-3 .employee-room-1 .block-employee.side{margin-left: -37px;}.horizontal-layout-second .rec-group .rec-block:last-child{padding-left: 14px;}.song-da-wrapper{max-width: 1078px;}.box-top-left-2{width: 169px;}.boxes-top-right-1{right: 240px;}.edge-top-right::after{width: 242px;}.boxes-top-right-2{right: 41px;}.edge-top-right::before{width: 43px;}.song-da-separator-left{left: 315px;}.sd-mid-left-seat-group-1{left: 250px;}.sd-mid-left-seat-group-2{left: 225px;}.sd-mid-left-seat-group-3{left: 225px;}.song-da-wrapper .boxes-center{left: 400px;}.song-da-separator-right{right: 388px;}.sd-mid-right-seat-group-1{right: 322px;}.sd-mid-right-seat-group-2{right: 295px;}.sd-mid-right-seat-group-3{right: 295px;}.box-top-right-1{width: 169px;}.boxes-center-bottom{left: 432px;}.boxes-bottom-left{left: 212px;}.box-bottom-left-1{width: 132px;}.box-bottom-left-2{width: 89px;}.box-top-left-1{width: 316px;}.floor-container{width: 1139px;}.seats .seat-row{gap: 0 9px;}.center-room-1{width: 74px; padding: 31px 5px 0 5px;}.center-room-2{width: 62px;}.first-row .seats{gap: 0 49px;}.second-row{padding-left: 40px;}.first-row{gap: 0 5px;}.floor-container .elevator{width: 50px;}.elevator-wrapper-2{left: 112px;}} @media (max-width: 1399px){.dn-room .inner-contain .block-user{padding: 0;}.flat-floor-container{margin-left: 0 !important;}#menu-content .inner-menu{padding: 20px 10px; background: #FFF;}.group-building ul{padding-left: 25px;}.menu-has-children.not-show .nav-item-link::after{right: -8px; top: 5px;}.group-function ul{padding-left: 25px;}.seat-diagram-contain .diagram-inner{padding: 10px !important;}.left-horizontal-layout .it-room{width: 7rem; padding: 8px 4px 8px 4px;}.left-horizontal-layout .hcm-room{padding: 20px 10px; width: 6.0625rem;}.right-horizontal-layout .room-list .block-employee{padding: 0 2px;}.left-horizontal-layout .stair{padding: 40px 10px; width: 3.6rem;}.left-horizontal-layout .rest-room{padding: 40px 20px; width: 4.5125rem;}.center-horizontal-layout .server-room{padding: 31px 4px; max-width: 3rem;}.center-horizontal-layout .elevator{padding: 32px 6px; max-width: 3.75rem;}.center-horizontal-layout .pump-room{max-width: 2.8125rem; padding: 40px 4px;}.right-horizontal-layout .cfo-room{padding: 2px;}.right-horizontal-layout .room-list{width: 10.875rem; padding: 20px 2px 20px;}.right-horizontal-layout .health-room{width: 3.25rem; padding: 33px 2px;}.right-horizontal-layout .rest-room-last{width: 5.0625rem; padding: 40px 24px;}.lobby .hn-room{width: 6.4375rem; border-left: unset;}.lobby .elevator{width: 3.8rem; border-bottom: unset;}.employee-group .vms-group{width: 11.0625rem;}.employee-group .vms-group .left{padding: 26px 4px 0 0px;}.employee-group .vms-group .center{padding: 0 4px 0 4px;}.employee-group .vms-group .right{padding: 6px 0 5px 4px;}.employee-group .center-group-vms{width: 3rem; padding: 8px 8px 0 8px;}.horizontal-layout-second .ga-group{width: 11.5625rem; padding: 8px 4px 38px 4px;}.ga-group .ga-row .ga-block:last-child{padding: 0 4px 0 4px;}.horizontal-layout-second .relax-room{width: 3.6875rem; padding: 72px 10px;}.horizontal-layout-second .rec-group{width: 12.8rem; padding-right: 0;}.horizontal-layout-second .rec-group .rec-block{padding: 6px 2px;}.horizontal-layout-second .dn-room{width: 11.125rem;}.horizontal-layout-second .dn-room{padding: 80px 52px;}.horizontal-layout-second .rec-group .rec-block:last-child{padding-left: 0;}.dn-room .inner-contain .block-employee{padding: 0 4px;}.modal-booking .modal-content{padding: 10px;}.modal-booking .modal-content .modal-header{padding: 5px;}.modal-booking .modal-footer{padding: 5px;}.modal-booking .modal-body{padding: 5px;}.diagram-content .tokyo-room{width: 6.3125rem; padding: 20px 10px;}.diagram-content .cto-room{width: 4rem;}.center-horizontal-layout .storage-room-2{height: 5rem;}.center-horizontal-layout .server-room-2{padding: 5px 4px;}.center-horizontal-layout .stairs-2{padding: 0 4px; max-width: 3.3125rem;}.right-horizontal-layout .room-employee .group-user{padding: 8px 0;}.diagram-content .cto-room{width: 3.5rem;}.horizontal-layout-second .block-corner .elevator{width: 3.15rem; padding: 20px 0;}.horizontal-layout-second .group-employee-1{width: 5.4rem;}.horizontal-layout-second .inner .block-employee{padding: 6px 0px;}.horizontal-layout-second .bo-group{padding: 6px 4px 6px 4px;}.horizontal-layout-second .relax-room-2{width: 3.4375rem; padding: 0;}.group-employee-3 .it-group{padding: 6px 0px;}.horizontal-layout-second .group-employee-3 .it-area .block-employee{padding: 6px 0px;}.group-employee-4 .row-employee-1 .block-employee-group{padding: 5px 2px 15px 2px;}.horizontal-layout-second .group-employee-4{width: 13rem;}.group-employee-4 .row-employee-2{width: 13rem; padding: 0 4px 14px 2px;}.traning-floor-3 .traning-employee-group .block-employee{padding: 0 0px;}.diagram-content .right-horizontal-layout .rec-room .block-employee{padding: 10px 0px;}.horizontal-layout-second .block-corner{width: 8rem;}.horizontal-layout-second-floor-3 .london-room{padding: 6px 4px;}.horizontal-layout-second-floor-3 .rec-room-center{padding: 10px 4px 9px 2px;}.horizontal-layout-second-floor-3 .employee-room-1{width: 8.2rem; padding: 13px 0px 42px 0px;}.horizontal-layout-second-floor-3 .employee-room-2 .group-block{padding: 12px 0px 18px;}.horizontal-layout-second-floor-3 .employee-room-2 .group-block .block-employee{padding: 0;}.horizontal-layout-second-floor-3 .employee-room-2 .single-block{padding: 12px 0px 18px 0;}.horizontal-layout-second-floor-3 .relax-room-3{width: 6.5rem;}.horizontal-layout-second-floor-3 .relax-room-3 .block-1{padding: 15px 0 0 0;}.horizontal-layout-second-floor-3 .relax-room-3 .block-2{padding: 15px 0 0 0;}.horizontal-layout-second-floor-3 .employee-room-3 .single-block{padding: 12px 0px 15px 0px;}.horizontal-layout-second-floor-3 .employee-room-3 .center-group .block-employee{padding: 0;}.horizontal-layout-second-floor-3 .employee-room-3 .right-group .group-inner{padding: 0;}.horizontal-layout-second-floor-3 .employee-room-3 .center-group{padding: 12px 0;}.horizontal-layout-second-floor-3 .employee-room-3 .right-group{padding: 12px 0 17px 0;}.list-booking-container .table thead th{vertical-align: middle;}.list-booking-container tbody td:last-child{width: 13.6rem; text-align: center !important;}.list-booking-container tbody td{vertical-align: middle;}.song-da-wrapper{max-width: 988px !important;}.edge-top-right::after{width: 216px !important;}.boxes-top-right-1{right: 214px !important;}.song-da-line-right{width: 160px !important;}.box-top-right-4{width: 149px !important;}.song-da-separator-right{right: 334px;}.sd-mid-right-seat-group-1{right: 267px;}.sd-mid-right-seat-group-2{right: 241px;}.sd-mid-right-seat-group-3{right: 241px;}.box-top-right-1{width: 140px;}.box-top-left-1{width: 320px;}.song-da-separator-left{left: 320px;}.sd-mid-left-seat-group-1{left: 255px;}.sd-mid-left-seat-group-2{left: 228px;}.sd-mid-left-seat-group-3{left: 228px;}.boxes-center{left: 368px;}.boxes-center-bottom{left: 402px;}.box-center-bottom{width: 176px;}.edge-bottom-left::before{width: 150px;}.boxes-bottom-left{left: 163px;}.box-bottom-left-1{width: 148px;}.box-bottom-left-2{width: 91px;}.song-da-separator-left{left: 320px;}.horizontal-layout-second-floor-3 .employee-room-3 .right-group .group-inner-last .block-employee{padding-right: 0;}.right-horizontal-layout .inner{height: 7.4375rem;}.group-employee-4 .row-employee-2 .block-employee:first-child{margin-left: 18px;}#handico-floor-11 .floor-diagram-wrapper{overflow-x: auto; overflow-y: hidden;}.floor-diagram-wrapper .floor-container{padding-bottom: 2px;}} 

/* /vti_seat_management/static/src/css/fourth_floor_responsive.css defined in bundle 'web.assets_frontend' */
@media (min-width: 1400px) and (max-width: 1600px){.flat-floor-container{margin-left: 0;}.flat-box-1{width: 52px;}.flat-box-2{width: 88px;}.flat-box-3{width: 100px;}.flat-box-4{width: 65px;}.flat-box-5{width: 60px;}.flat-box-6{width: 54px;}.flat-box-7{width: 60px;}.flat-box-10{width: 70px;}.flat-second-row .seats .seat-row{gap: 0 10px;}} @media (max-width: 1399px){.flat-second-row .seats .seat-row{gap: 0 5px; justify-content: unset;}.flat-seats-right.seats .seat-row{gap: 0 5px;}.flat-box-2{width: 70px;}.flat-box-3{width: 85px; padding: 0 5px 0 5px;}.flat-box-1{width: 60px;}.flat-seats-left{padding-left: 5px; padding-right: 5px;}.flat-seats-left.seats .seat-row{gap: 0 5px;}.flat-seats-right{padding-left: 5px; padding-right: 5px;}.flat-box-7{width: 60px;}.flat-box-8{width: 85px; padding: 10px 5px 10px 5px;}.flat-box-10{width: 85px;}}