/* cyrillic-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Open Sans Regular'), local('OpenSans-Regular'), url(../fonts/OpenSans-Regular1.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Open Sans Regular'), local('OpenSans-Regular'), url(../fonts/OpenSans-Regular2.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Open Sans Regular'), local('OpenSans-Regular'), url(../fonts/OpenSans-Regular3.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Open Sans Regular'), local('OpenSans-Regular'), url(../fonts/OpenSans-Regular4.woff2) format('woff2');
    unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Open Sans Regular'), local('OpenSans-Regular'), url(../fonts/OpenSans-Regular5.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Open Sans Regular'), local('OpenSans-Regular'), url(../fonts/OpenSans-Regular6.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Open Sans Regular'), local('OpenSans-Regular'), url(../fonts/OpenSans-Regular7.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local('Open Sans Bold'), local('OpenSans-Bold'), url(../fonts/OpenSans-Bold1.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local('Open Sans Bold'), local('OpenSans-Bold'), url(../fonts/OpenSans-Bold2.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local('Open Sans Bold'), local('OpenSans-Bold'), url(../fonts/OpenSans-Bold3.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local('Open Sans Bold'), local('OpenSans-Bold'), url(../fonts/OpenSans-Bold4.woff2) format('woff2');
    unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local('Open Sans Bold'), local('OpenSans-Bold'), url(../fonts/OpenSans-Bold5.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local('Open Sans Bold'), local('OpenSans-Bold'), url(../fonts/OpenSans-Bold6.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local('Open Sans Bold'), local('OpenSans-Bold'), url(../fonts/OpenSans-Bold7.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'), url(../fonts/OpenSans-ExtraBold1.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'), url(../fonts/OpenSans-ExtraBold2.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'), url(../fonts/OpenSans-ExtraBold3.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'), url(../fonts/OpenSans-ExtraBold4.woff2) format('woff2');
    unicode-range: U+0370-03FF;
}

/* vietnamese */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'), url(../fonts/OpenSans-ExtraBold-Vi.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'), url(../fonts/OpenSans-ExtraBold-LatinExt.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'), url(../fonts/OpenSans-ExtraBold-Latin.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


@font-face{font-family:'icielBrandonTextBold';src:url(../fonts/icielBrandonText-Bold.eot);src:url(../fonts/icielBrandonText-Bold.eot?#iefix) format("embedded-opentype"),url(../fonts/icielBrandonText-Bold.woff2) format("woff2"),url(../fonts/icielBrandonText-Bold.woff) format("woff"),url(../fonts/icielBrandonText-Bold.ttf) format("truetype"),url(../fonts/icielBrandonText-Bold.svg) format("svg");font-weight:700;font-style:normal}


*{margin:0;padding:0;box-sizing:border-box}
.fl{float:left}
.fr{float:right}
.clear{clear:both}
.dBlock{display:block}
.clSilver{color:#999}
.clBlue{color:#2888e1}
.clOrange{color:#ee6a36}
.clRedBlur{color:#ec6363}
.clGreenBlur{color:#7d920a}
.dnone{display:none}
body{font-family:'Open Sans', 'Helvetica','Sans-serif';color:#2b2b2b}
.container{width:100%;max-width:1064px;padding:0 20px;margin:0 auto}
#header{background-image:linear-gradient(to right,#2888e1,#0056a6);color:#fff;padding:13px 0 15px;position:relative;width:100%;top:0}
#header .headerLeft{width:calc(100% - 455px);font-family:'icielBrandonTextBold'}
#header .headerLeft .title{font-size:29px;text-align:center;margin-bottom:7px}
#header .content{text-align:center}
#header .headerLeft .leftIntro{text-transform:uppercase;font-size:22px;display:inline-block;position:relative}
#header .arrowLeft,#header .arrowRight{position:absolute}
#header .arrowLeft::after,#header .arrowLeft::before,#header .arrowRight::after,#header .arrowRight::before{display:block;content:'';position:absolute;width:0;height:0}
#header .arrowLeft{left:-7px}
#header .arrowLeft::before{border-top:16px solid #1b6eb9;border-left:7px solid transparent}
#header .arrowLeft::after{border-bottom:16px solid #1b6eb9;border-left:7px solid transparent;top:14px}
#header .arrowRight{right:0;top:0}
#header .arrowRight::before{border-top:16px solid #1b6eb9;border-right:7px solid transparent}
#header .arrowRight::after{border-bottom:16px solid #1b6eb9;border-right:7px solid transparent;top:16px}
#header .leftIntro p{display:inline-block;background:#1b6eb9;padding:0 5px}
#header .headerRight{width:415px;margin:0 20px;text-align:center;font-size:18px}
#header .headerRight .title,.groupBtn{font-family:'Open Sans'; font-weight: 700}
#header .headerRight .title{font-size:18px;color:#ffde00;width:315px;text-align:center;margin:0 auto;margin-bottom:6px}
#header .headerRight a.btnGopY,.table th,.table .stt,.table .quantity,.timeJoin th,.timeJoin .boldLeft,#popup .title,#popup .textarea label{font-family:'Open Sans'; font-weight:700;}
#header .headerRight a.btnGopY{display:inline-block;text-decoration:none;background:#fff;text-transform:uppercase;font-weight:700;padding:9px 13px;border-radius:50px}
#body{min-height:100vh;background:#e0e3ed;padding:24px 0 33px;font-size:18px;margin-top:0px}
#body .container{background:#fff;padding-top:20px}
.topIntro{padding-bottom:32px}
.topIntro .leftImage{width:392px;text-align:center}
.topIntro .rightContent{width:calc(100% - 392px);padding:0 20px;text-align:justify;margin-top: 28px}
.topIntro .rightContent p{margin-bottom:5px}
.topIntro .LightText,.criteria .title,.criteria .index,.timeJoin .index,.wrapIndex span,.wrapIndex span,.timeJoin .title{font-family:'Open Sans', sans-serif;font-size: 16px;font-weight: bold;}
.topIntro .LightText,.criteria .title,.criteria .index,.timeJoin .index,.wrapIndex span,.wrapIndex span,.timeJoin .title{font-family:'Open Sans';font-size: 16px;font-weight: 800 !important;}
.criteria .title,.timeJoin .title{text-align:center;font-size:16px;margin-bottom:32px; font-weight: bold}
.criteria .title,.criteria .index,.timeJoin .index,.timeJoin .title,.topIntro .LightText{text-transform:uppercase}
.criteria .index,.timeJoin .index{width:calc(100% - 34px);padding-top:5px}
.wrapIndex{margin-bottom:12px;display:flex}
.wrapIndex span,.wrapIndex span{width:30px;height:30px;background:#ee6a36;margin-right:5px;color:#fff;border-radius:50px;display:inline-block;text-align:center;padding-top:4px}
.criteria .content .intro{margin-bottom:26px}
.criteria .table > p{margin-bottom:12px}
.table{padding-bottom:24px}
table{border-collapse:collapse}
.table tr > th,.timeJoin tr > th{text-align:left}
.table tr > th:nth-child(1){width:59px}
.table tr > th:nth-child(2){width:450px}
.table tr > th:nth-child(3){width:147px}
.table table,.table th,.table td,.timeJoin table,.timeJoin th,.timeJoin td{border:1px dashed #bdd9f4}
.table table,.table td,.timeJoin table,.timeJoin td{padding:10px 10px 30px}
.table th,.timeJoin table th{padding:19px 10px}
.table table p{margin-bottom:0}
.timeJoin{padding-bottom:17px}
.timeJoin .theLeft{margin-bottom:24px}
.timeJoin .boldLeft{list-style:none}
.timeJoin .introduction{list-style:none;margin-bottom:32px}
.timeJoin .introduction li:first-child{margin-bottom:13px}
.timeJoin .introduction li:not(.boldLeft){background:url(../images/landing_page/feedback/Polygon1.png) no-repeat 0 5px;padding-left:19px;margin-bottom:5px}
.timeJoin table{width:100%}
.timeJoin table th:first-child{width: 10px;}
#list-survey tr td:first-child{text-align: center;}
#list-survey tr td{padding: 10px 10px 10px}
.timeJoin table th:nth-child(2){width:250px}
.timeJoin .dateTime{font-size:16px}
#popup{font-size:18px;min-height:100vh;position:fixed;top:0;left:0;z-index:9999;width:100%;transform:scale(0);transition:all .5s}
#popup .title{text-align:center;font-size:24px;text-transform:uppercase;padding:27px 0;background:#fff;position:relative}
#popup .bgWrap{background:#f5faff;height:100vh;padding:24px 0}
#popup .content{width:726px;height:100%;padding:0 20px;margin:0 auto}
#popup .groupFrm:not(.textarea){margin-bottom:10px}
#popup .textarea{margin-bottom:26px}
#popup .groupFrm label{display:block;margin-bottom:10px}
#popup .validate{margin-bottom:20px}
#popup .groupFrm textarea,#popup .groupFrm input{width:100%;border:1px solid #eaeff5;border-radius:5px;font-size:18px;font-family:'Open Sans';padding:5px 12px}
.groupBtn{text-align:center;padding-top:8px}
.btnSubmit, .list-gopy.btnGopY{text-transform:uppercase;display:inline-block;background:#2888e1;color:#fff;border-radius:50px;padding:10px 25px;text-decoration:none;margin-bottom:13px}
.close{width:18px;height:18px;background:url(../images/landing_page/feedback/close.png) no-repeat center;display:block;position:absolute;top:32px;right:32px}
.actionClose{transform:scale(1)!important;transition:all .5s}
#popup .groupInput{max-height:calc(100% - 160px);overflow-x:auto;margin-right:-10px;padding-right:10px}
#popup .groupInput::-webkit-scrollbar{width:3px}
#popup .groupInput::-webkit-scrollbar-track{background:#fff}
#popup .groupInput::-webkit-scrollbar-thumb{background:#e6e6e6;border-radius:3px}
#popup .groupInput::-webkit-scrollbar-thumb:hover{background:#2888e1}
#notification{position:fixed;top:80px;right:37px;z-index: 99}
.popNotifi{width:290px;background:#ee6a36;font-size:15px;color:#fff;padding:9px 12px;border-radius:7px;position:relative}
.popNotifi .clo{width:12px;height:12px;background:url(../images/landing_page/feedback/clo.png) no-repeat center;display:block;position:absolute;right:12px;top:12px}
#list-survey, #list-survey-no-gift {
    max-height: 1000px;
    overflow: auto;
}
#list-survey::-webkit-scrollbar-track, #list-survey-no-gift::-webkit-scrollbar-track{
    box-shadow: inset 0 0 5px #fff;
    position: relative;
    z-index: 9999;
}
#list-survey::-webkit-scrollbar-thumb, #list-survey-no-gift::-webkit-scrollbar-thumb {
    background: #b1abab;
    border-radius: 4px;
    z-index: 999;
    position: relative;
}
#list-survey::-webkit-scrollbar, #list-survey-no-gift::-webkit-scrollbar{
    width: 6px;
}
.btn-tabb {margin-bottom: 5px;}
.btn-tabb a{
    cursor: pointer;
    font-size: 16px;
    background: #ccc;
    padding: 10px 12px 5px 12px;
    border-radius: 12px 12px 0px 0;
}
.btn-tabb a.active, .btn-tabb a:hover{
    background: #2888e1;
    color: #fff;
}
@media all and (max-width:1024px) {
  #body{margin-top:0px;padding:12px 0}
  #body .container{max-width:calc(100% - 24px)}
}
@media all and (max-width:768px) {
  #body{margin-top:0px;padding:0}
  #body .container{max-width:100%}
  #header .headerLeft{width:100%;margin-bottom:15px}
  #header .headerRight{width:100%;margin:0}
  #header .headerLeft .title{font-size:24px}
  .topIntro .leftImage{width:100%;text-align:center}
  .topIntro .rightContent{width:100%;padding:0;margin-top: 0;}
  #popup .content{width:100%}
  #notification{bottom:12px;left:12px;top:unset;right:unset}
}
@media all and (max-width:457px) {
  #body{margin-top:0px;font-size:15px}
  #body .container{padding:12px}
  #header .headerLeft .title{width:89%;margin:0 auto 5px}
  #header .leftIntro p{width:95%;padding:6px 43px}
  #header .arrowLeft::before{border-top:45px solid #1b6eb9;border-left:18px solid transparent}
  #header .arrowLeft::after{border-bottom:45px solid #1b6eb9;border-left:18px solid transparent;top:31px}
  #header .arrowRight::before{border-top:45px solid #1b6eb9;border-right:18px solid transparent;right:-7px}
  #header .arrowRight::after{border-bottom:45px solid #1b6eb9;border-right:18px solid transparent;top:31px;right:-7px}
  .topIntro .leftImage img{width:100%}
  .topIntro{padding-bottom:23px}
  .criteria .title,.timeJoin .title{margin-bottom:18px}
  .criteria .index,.timeJoin .index{font-size:18px;padding-top:0}
  .criteria .content .intro{margin-bottom:18px}
  .criteria .table > p{margin-bottom:10px}
  .table{padding-bottom:16px}
  .timeJoin .theLeft{margin-bottom:20px}
  .timeJoin .introduction li:first-child{margin-bottom:15px}
  .timeJoin .introduction li:not(.boldLeft){margin-bottom:16px}
  .timeJoin .introduction{margin-bottom:4px}
  .criteria .title,.timeJoin .title{margin-bottom:13px}
  .table tr > th:nth-child(1){padding:19px 5px}
  .timeJoin table th:first-child{width:155px}
  .timeJoin{padding-bottom:0}
  #popup .title{font-size:18px;padding: 12px 0;}
  #popup .groupInput{max-height:calc(100% - 167px)}
  #popup .content{padding:0 12px}
  .close{top:13px;right:12px}
  #popup .bgWrap{padding:12px 0;font-size: 15px;}
  .wrapIndex{align-items:center}
  #popup .textarea {margin-bottom: 12px;}
  #popup .groupFrm textarea, #popup .groupFrm input {font-size: 13px}
  #popup .validate {margin-bottom: 12px}
  #popup .groupFrm label {margin-bottom: 6px;}
}
@media all and (max-width:375px) {
  #header .headerLeft .title{width:100%}
  .wrapIndex{align-items:center}
  #popup .title{font-size:17px}
}
@media all and (max-width:360px) {
  .table table,.table td,.timeJoin table,.timeJoin td{padding:6px 6px 15px}
}
@media all and (max-width:320px) {
  #header .headerLeft .title{font-size:18px}
  #header .leftIntro p{padding:6px 0;font-size:18px}
  #header .arrowLeft::after{top:19px}
  #header .arrowRight::after{top:19px}
  #header .headerRight .title{font-size:16px;width:auto}
  #header .headerLeft{margin-bottom:7px}
  .table table,.table td,.timeJoin table,.timeJoin td{font-size:13px}
  .timeJoin .dateTime{font-size:12px}
  #popup .title{padding:10px 30px}
  .close{top:22px}
}