@charset "UTF-8";
.accordion-handle__state,.alt-feature-menu-bottom__headings .headings__state,.article-item__play-btn:after,.slick-list[class*=icon-]:after,.slick-list[class=icon]:after,.has-title-arrow .article-item__desc:after,.owl-carousel--white .owl-nav button.owl-next span,.owl-carousel--white .owl-nav button.owl-prev span,.slick-next[class*=icon-]:before,.slick-next[class=icon]:before,.slick-prev[class*=icon-]:before,.slick-prev[class=icon]:before,.timeline__marker,.yt-pl__play-icon,.zoom-out-icon,i[class*=icon-],i[class=icon]{font-family:"icomoon"!important;speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-share-outline:before{content:""}.icon-pdf:before{content:""}.icon-weather-hazy:before{content:""}.icon-weather-windy-cloudy:before{content:""}.icon-weather-partly-cloudy-night:before{content:""}.icon-weather-partly-cloudy:before{content:""}.icon-weather-fog:before{content:""}.icon-weather-passing-showers:before{content:""}.icon-weather-showers:before{content:""}.icon-weather-drizzle:before{content:""}.icon-weather-thundery-showers:before{content:""}.icon-weather-fair-day:before{content:""}.icon-weather-fair-night:before{content:""}.icon-weather-light-showers:before{content:""}.icon-weather-heavy-thundery-showers:before{content:""}.icon-weather-strong-winds-rain:before{content:""}.icon-weather-windy-fair:before{content:""}.icon-weather-fair-warm:before{content:""}.icon-weather-mist:before{content:""}.icon-weather-cloudy:before{content:""}.icon-weather-heavy-showers:before{content:""}.icon-weather-snow-showers:before{content:""}.icon-weather-moderate-rain:before{content:""}.icon-weather-overcast:before{content:""}.icon-weather-windy-rain:before{content:""}.icon-weather-windy-showers:before{content:""}.icon-weather-snow:before{content:""}.icon-weather-heavy-rain:before{content:""}.icon-weather-heavy-thundery-showers-with-gusty-winds:before{content:""}.icon-weather-light-rain:before{content:""}.icon-weather-windy:before{content:""}.icon-weather-slightly-hazy:before{content:""}.icon-weather-strong-winds-showers:before{content:""}.icon-weather-sunny:before{content:""}.icon-profile:before{content:""}.icon-mail:before{content:""}.icon-calendar:before{content:""}.icon-phone:before{content:""}.icon-arrow-right-left:before{content:""}.icon-arrow-up:before{content:""}.icon-arrow-left:before,.owl-carousel--white .owl-prev span:before{content:""}.icon-arrow-right:before,.owl-carousel--white .owl-next span:before{content:""}.icon-expand-arrows:before{content:""}.icon-arrow-right-inverse:before{content:""}.icon-arrow-circle-right:before{content:""}.icon-bell:before{content:""}.yt-pl__play-icon:before{content:""}.zoom-out-icon:before{content:"";}.icon-chevron-down:before,.main-navigation .navbar-search>.is-active.navbar-link>.navbar-search__btn>.icon:before,.navbar-search>.navbar-item.is-active>.navbar-search__btn>.icon:before,.navbar-search__btn.is-active .icon:before{content:""}.icon-chevron-first:before{content:""}.icon-chevron-last:before{content:""}.icon-times:before{content:""}.icon-chevron-left:before{content:""}.icon-chevron-right:before{content:""}.icon-chevron-up:before{content:""}.icon-clock:before{content:""}.icon-exclamation-triangle:before{content:""}.icon-facebook-outline:before{content:""}.icon-facebook:before{content:""}.icon-fbmsger:before{content:""}.icon-gplus-outline:before{content:""}.icon-instagram:before{content:""}.icon-linkedin-outline:before{content:""}.icon-mail-outline:before{content:""}.icon-menu:before{content:""}.icon-minus-outline:before{content:""}.icon-play-outline:before{content:""}.icon-play:before{content:""}.icon-plus-outline:before{content:""}.icon-whatsapp:before{content:""}.icon-telegram:before{content:""}.icon-print:before{content:""}.icon-sglion:before{content:""}.icon-twitter-outline:before{content:""}.icon-twitter:before{content:""}.icon-volume:before{content:""}.icon-whatsapp-outline:before{content:""}.icon-search:before,.navbar-search__btn .icon:before,.navbar-search__input-btn .icon:before{content:""}.icon-youtube:before{content:""}.accordion-handle__state:before{content:""}.btn-link.collapsed .accordion-handle__state:before{content:""}
@font-face{font-family:'icomoon';src:url('fonts/icomoon.eot?itbshd');src:url('fonts/icomoon.eot?itbshd#iefix') format('embedded-opentype'),
url('fonts/icomoon.ttf') format('truetype'),
url('fonts/icomoon.woff?itbshd') format('woff'),
url('fonts/icomoon.svg') format('svg');font-weight:normal;font-style:normal;font-display:block}[class*=" icon-"],[class^=icon-]{font-family:'icomoon'!important;speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-weather-cloudy1:before{content:"\e948"}.icon-weather-drizzle1:before{content:"\e949"}.icon-weather-fair-day1:before{content:"\e94a"}.icon-weather-fair-night1:before{content:"\e94b"}.icon-weather-fair-warm1:before{content:"\e94c"}.icon-weather-fog1:before{content:"\e94d"}.icon-weather-hazy1:before{content:"\e94e"}.icon-weather-heavy-rain1:before{content:"\e94f"}.icon-weather-heavy-showers1:before{content:"\e950"}.icon-weather-heavy-thundery-showers1:before{content:"\e951"}.icon-weather-heavy-thundery-showers-with-gusty-winds1:before{content:"\e952"}.icon-weather-light-rain1:before{content:"\e953"}.icon-weather-light-showers1:before{content:"\e954"}.icon-weather-mist1:before{content:"\e955"}.icon-weather-moderate-rain1:before{content:"\e956"}.icon-weather-overcast1:before{content:"\e957"}.icon-weather-partly-cloudy1:before{content:"\e958"}.icon-weather-partly-cloudy-night1:before{content:"\e959"}.icon-weather-passing-showers1:before{content:"\e95a"}.icon-weather-showers1:before{content:"\e95b"}.icon-weather-slightly-hazy1:before{content:"\e95c"}.icon-weather-snow1:before{content:"\e95d"}.icon-weather-snow-showers1:before{content:"\e95e"}.icon-weather-strong-winds-rain1:before{content:"\e95f"}.icon-weather-strong-winds-showers1:before{content:"\e960"}.icon-weather-sunny1:before{content:"\e961"}.icon-weather-thundery-showers1:before{content:"\e962"}.icon-weather-windy1:before{content:"\e963"}.icon-weather-windy-cloudy1:before{content:"\e964"}.icon-weather-windy-fair1:before{content:"\e965"}.icon-weather-windy-rain1:before{content:"\e966"}.icon-weather-windy-showers1:before{content:"\e967"}.icon-arrow-circle-right:before{content:"\e900"}.icon-bell:before{content:"\e901"}.icon-chevron-down:before{content:"\e902"}.icon-chevron-first:before{content:"\e903"}.icon-chevron-last:before{content:"\e904"}.icon-chevron-left:before{content:"\e905"}.icon-chevron-right:before{content:"\e906"}.icon-chevron-up:before{content:"\e907"}.icon-clock:before{content:"\e908"}.icon-exclamation-triangle:before{content:"\e909"}.icon-facebook-outline:before{content:"\e90a"}.icon-facebook:before{content:"\e90b"}.icon-fbmsger:before{content:"\e90c"}.icon-gplus-outline:before{content:"\e90d"}.icon-instagram:before{content:"\e90e"}.icon-linkedin-outline:before{content:"\e90f"}.icon-mail-outline:before{content:"\e910"}.icon-menu:before{content:"\e911"}.icon-minus-outline:before{content:"\e912"}.icon-play-outline:before{content:"\e913"}.icon-play:before{content:"\e914"}.icon-plus-outline:before{content:"\e915"}.icon-print:before{content:"\e916"}.icon-search:before{content:"\e917"}.icon-sglion:before{content:"\e918"}.icon-twitter-outline:before{content:"\e919"}.icon-twitter:before{content:"\e91a"}.icon-volume:before{content:"\e91b"}.icon-weather-hazy:before{content:"\e91c"}.icon-weather-windy-cloudy:before{content:"\e91d"}.icon-weather-partly-cloudy-night:before{content:"\e91e"}.icon-weather-partly-cloudy:before{content:"\e91f"}.icon-weather-fog:before{content:"\e920"}.icon-weather-passing-showers:before{content:"\e921"}.icon-weather-showers:before{content:"\e922"}.icon-whatsapp-outline:before{content:"\e923"}.icon-whatsapp:before{content:"\e924"}.icon-youtube:before{content:"\e925"}.icon-arrow-right-inverse:before{content:"\e926"}.icon-expand-arrows:before{content:"\e927"}.icon-arrow-up:before{content:"\e928"}.icon-weather-drizzle:before{content:"\e929"}.icon-weather-thundery-showers:before{content:"\e92a"}.icon-weather-fair-day:before{content:"\e92b"}.icon-weather-fair-night:before{content:"\e92c"}.icon-weather-light-showers:before{content:"\e92d"}.icon-weather-heavy-thundery-showers:before{content:"\e92e"}.icon-weather-strong-winds-rain:before{content:"\e92f"}.icon-weather-windy-fair:before{content:"\e930"}.icon-weather-fair-warm:before{content:"\e931"}.icon-weather-mist:before{content:"\e932"}.icon-weather-cloudy:before{content:"\e933"}.icon-weather-heavy-showers:before{content:"\e934"}.icon-weather-snow-showers:before{content:"\e935"}.icon-weather-moderate-rain:before{content:"\e936"}.icon-weather-overcast:before{content:"\e937"}.icon-weather-windy-rain:before{content:"\e938"}.icon-weather-windy-showers:before{content:"\e939"}.icon-weather-snow:before{content:"\e93a"}.icon-weather-heavy-rain:before{content:"\e93b"}.icon-weather-heavy-thundery-showers-with-gusty-winds:before{content:"\e93c"}.icon-weather-light-rain:before{content:"\e93d"}.icon-weather-windy:before{content:"\e93e"}.icon-weather-slightly-hazy:before{content:"\e93f"}.icon-weather-strong-winds-showers:before{content:"\e940"}.icon-weather-sunny:before{content:"\e941"}.icon-arrow-right-left:before{content:"\e942"}.icon-calendar:before{content:"\e943"}.icon-profile:before{content:"\e944"}.icon-mail:before{content:"\e945"}.icon-phone:before{content:"\e946"}.icon-pdf:before{content:"\e947"}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-stretch: normal;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v34/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjZ0B4gaVc.ttf) format('truetype');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
font-stretch: normal;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v34/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsgH1x4gaVc.ttf) format('truetype');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-stretch: normal;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v34/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsg-1x4gaVc.ttf) format('truetype');
}
.content-text h1,
.content-text h2,
.content-text h3,
.content-text h4,
.content-text h5,
.content-text h6 {
font-weight: 600;
margin-top: 2rem;
margin-bottom: calc(8em / 11);
}
.content-text h1:first-child,
.content-text h2:first-child,
.content-text h3:first-child,
.content-text h4:first-child,
.content-text h5:first-child,
.content-text h6:first-child {
margin-top: 0;
}
.content-text {
overflow: auto;
}
@media screen and (max-width: 1023px) {
.content-text h1,
.content-text h2,
.content-text h3,
.content-text h4,
.content-text h5,
.content-text h6 {
font-size: 1.125rem;
}
}
.row {
padding: 0;
margin: 0;
}
.row > [class*='col-'] {
padding: 0;
margin: 0;
}
.content-text ul {
list-style: disc outside;
margin-left: 2em;
margin-top: 1em;
}
.content-text ul:not(:last-child) {
margin-bottom: 1em;
}
.content-text p {
padding: 0;
margin: 0;
}
.content-text p:not(:last-child) {
margin-bottom: 1em;
}
.content-text p:first-child {
margin-bottom: 1em;
}
ul {
padding: 0;
margin: 0;
}
img {
max-width: 100%;
}
table,
.table {
width: 100%;
background-color: #ffffff;
color: #333333;
table-layout: fixed;
}
table.bg-blue thead,
.table.bg-blue thead {
background-color: #d9e2f3;
color: #333333;
}
table.bg-blue tbody,
.table.bg-blue tbody {
background-color: #f0f0f0;
}
table.border-black tr td,
.table.border-black tr td {
border: 1px solid #333333;
}
table.bg-grey thead,
.table.bg-grey thead {
background-color: #f0f0f0;
color: #333333;
}
table.bg-grey tbody,
.table.bg-grey tbody {
background-color: #f0f0f0;
}
table thead,
.table thead {
background-color: #D81800;
color: #FFFFFF;
}
table tbody,
.table tbody {
border: 1px solid #f1f1f1;
background-color: #ffffff;
}
table tr td,
.table tr td {
border: 1px solid #dadada;
}
.pe-none {
pointer-events: none !important;
}
.icon-primary {
color: #D81800;
font-size: 1.5rem;
}
.b-p-c {
background-color: #D81800;
}
.dp-n {
display: none !important;
}
.dp-f {
display: flex !important;
}
.dp-b {
display: block !important;
}
.p-r {
position: relative;
}
.p-f-notice {
position: fixed;
width: 100%;
z-index: 99;
}
.p-f-header {
position: fixed;
width: 100%;
z-index: 99;
}
.pos-r-dsg {
position: relative;
width: 100%;
}
.rm-ul-style {
list-style-type: none;
}
.list-square {
list-style-type: square;
}
.full-width {
width: 100vw;
}
.upcase-auto {
text-transform: uppercase;
}
.rm-a-b {
text-decoration: none;
color: #333333;
}
.rm-a-w {
text-decoration: none;
color: #FFFFFF;
}
.a-h-w:hover {
color: #FFFFFF;
}
.rm-a-b-g {
text-decoration: none;
color: #DADADA;
}
.rm-a-b-primary:hover {
text-decoration: none;
color: #D81800 !important;
}
.detail-content-link {
color: #D81800 !important;
}
.detail-content-link:hover {
text-decoration: underline !important;
color: #D81800 !important;
}
.devider {
height: 2px;
background-color: #F0F0F0;
border: 0;
margin: 24px 0;
}
.display-flex {
display: flex;
}
.wrap-flex {
flex-wrap: wrap;
}
.flex-col {
display: flex;
flex-direction: column;
}
.flex-nowrap {
flex-wrap: nowrap;
}
.flex-center {
display: flex;
justify-content: center;
align-items: center;
}
.flex-center-justify {
display: flex;
justify-content: center !important;
}
.flex-center-align {
display: flex;
align-items: center;
}
.flex-right {
display: flex;
justify-content: flex-end;
}
.flex-left {
display: flex;
justify-content: flex-start;
}
.flex-right-align {
display: flex;
align-items: flex-end;
}
.flex-left-align {
display: flex;
align-items: flex-start;
}
.text-size-0 {
font-size: 2.25rem;
}
.text-size-1 {
font-size: 2rem;
}
.text-size-2 {
font-size: 1.375rem;
}
.text-size-3 {
font-size: 1.125rem;
}
.text-size-4 {
font-size: 1rem;
}
.text-size-5 {
font-size: 0.938rem;
}
.text-size-6 {
font-size: 0.875rem;
}
.text-size-7 {
font-size: 0.813rem;
}
.text-size-8 {
font-size: 0.75rem;
}
.text-size-9 {
font-size: 1.75rem;
}
.text-size-10 {
font-size: 1.25rem;
}
.lh-s-10 {
line-height: 1.25rem;
}
.text-size-11 {
font-size: 1.5rem;
}
.text-white {
color: #FFFFFF;
}
.text-primary-1 {
color: #D81800;
}
.text-g-1 {
color: #DADADA;
}
.text-bold {
font-weight: 700;
}
.text-semibold {
font-weight: 600;
}
.text-thin {
font-weight: 300;
}
.text-underline {
text-decoration: underline;
}
.t-a-r {
text-align: right;
}
.t-a-l {
text-align: left;
}
.border-left-w {
border-left: solid 1px #F0F0F0;
}
.border-right-b {
border-right: solid 1px #333333;
}
.border-right-w {
border-right: solid 1px #F0F0F0;
}
.border-top-w {
border-top: solid 1px #F0F0F0;
}
.border-bottom-w {
border-bottom: solid 1px #F0F0F0;
}
.border-t-grey-g {
border-top: groove 4px #979797;
}
.border-b-w-3 {
border-bottom: 1px solid #D6DAE4;
}
.p-r-1 {
padding-right: 1px;
}
.p-l-1 {
padding-left: 1px;
}
.p-0 {
padding: 0;
}
.w-20 {
width: 20% !important;
}
.section-with-bg {
position: relative;
}
.section-with-bg:after {
content: '';
background-color: #fcecd5 !important;
position: absolute;
width: 100vw;
height: 100%;
left: calc(-50vw + 50%);
top: 0;
z-index: -1;
}
.section-with-bg.beige:after {
background-color: #fcecd5 !important;
}
.section-with-bg.light-grey:after {
background-color: #E1E5EB !important;
}
.section-with-bg.grey:after {
background-color: #f0f0f0 !important;
}
@media screen and (min-width: 768px) {
.offset-md-1 {
margin-left: 8.333333% !important;
}
}
@font-face {
font-family: OpenSans-Light;
src: url(../font/OpenSans/OpenSans-Light.ttf);
}
@font-face {
font-family: OpenSans-Regular;
src: url(../font/OpenSans/OpenSans-Regular.ttf);
}
@font-face {
font-family: OpenSans-Medium;
src: url(../font/OpenSans/OpenSans-Medium.ttf);
}
@font-face {
font-family: OpenSans-SemiBold;
src: url(../font/OpenSans/OpenSans-SemiBold.ttf);
}
@font-face {
font-family: OpenSans-Bold;
src: url(../font/OpenSans/OpenSans-Bold.ttf);
}
@font-face {
font-family: AvenirNextLTW01-Heavy;
src: url(../font/AvenirNext/AvenirNextLTW01-Heavy.woff2) format("woff2");
}
@font-face {
font-family: AvenirNextCondensed-Heavy;
src: url(../font/AvenirNext/AvenirNextCondensed-Heavy.woff2) format("woff2");
}
.btn-read-more {
background-color: #499a6e;
border: none;
color: #FFFFFF !important;
font-weight: 900;
padding: calc(0.5em - 1px) 1.5rem;
border-radius: 3rem;
}
.btn-read-more:hover {
text-decoration: underline !important;
}
.btn-category {
text-transform: uppercase;
white-space: nowrap;
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #DADADA;
color: #333333;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category:hover {
color: #333333;
text-decoration: none;
}
.btn-category.pp-1 {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #7200DB;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.others {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #9f2b68;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.foreign-affairs {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #841b2d;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.health {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #005DC5;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.housing {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #AC5100;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.pofma {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #2e3192;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.taglisting {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #2e3192;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.social-and-community {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #7200DB;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.savings-and-taxes {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #5E8500;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.economy-and-finance {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #c46210;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.education {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #EE3276;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.brown-1 {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #AC5100;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.infocomms-and-technology {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #88540b;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.green-1 {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #688F00;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.defence-and-security {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #4b5320;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.employment {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #0048ba;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.environment {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #688F00;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.transport {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #005DC5;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.blue-3 {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #2e3192;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.pink-1 {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #EE3276;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.arts-and-culture {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #e52b50;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.law-and-governance {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #EAB000;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.immigration-and-citizenship {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #d3212d;
color: #FFFFFF;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category.grey-1 {
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #DADADA;
color: #333333;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category-grey {
white-space: nowrap;
text-transform: uppercase;
margin: 0 10px 10px 0;
padding: 3px 9px;
background-color: #DADADA;
color: #7200DB;
font-size: 0.75rem;
border-radius: 0px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.btn-category-grey:hover {
text-decoration: none;
}
.btn-category-grey.pp-1 {
color: #7200DB;
}
.btn-category-grey.others {
color: #9f2b68;
}
.btn-category-grey.foreign-affairs {
color: #841b2d;
}
.btn-category-grey.housing {
color: #AC5100;
}
.btn-category-grey.health {
color: #005DC5;
}
.btn-category-grey.pofma {
color: #2e3192;
}
.btn-category-grey.taglisting {
color: #2e3192;
}
.btn-category-grey.social-and-community {
color: #7200DB;
}
.btn-category-grey.savings-and-taxes {
color: #5E8500;
}
.btn-category-grey.brown-1 {
color: #AC5100;
}
.btn-category-grey.economy-and-finance {
color: #c46210;
}
.btn-category-grey.education {
color: #EE3276;
}
.btn-category-grey.infocomms-and-technology {
color: #88540b;
}
.btn-category-grey.green-1 {
color: #688F00;
}
.btn-category-grey.defence-and-security {
color: #4b5320;
}
.btn-category-grey.employment {
color: #0048ba;
}
.btn-category-grey.environment {
color: #688F00;
}
.btn-category-grey.transport {
color: #005DC5;
}
.btn-category-grey.blue-3 {
color: #2e3192;
}
.btn-category-grey.pink-1 {
color: #EE3276;
}
.btn-category-grey.arts-and-culture {
color: #e52b50;
}
.btn-category-grey.law-and-governance {
color: #AE8300;
}
.btn-category-grey.immigration-and-citizenship {
color: #d3212d;
}
.btn-category-grey.black-white {
color: #fff;
background-color: #000;
}
.bg-vertical-grey {
display: block;
position: relative;
margin: 1rem 0 2rem;
padding-top: 1rem;
width: 100vw;
left: calc(-50vw + 50%);
background-color: #F0F0F0;
}
.progress {
-moz-appearance: none;
-webkit-appearance: none;
border: none;
border-radius: 0;
display: none;
height: 1rem;
overflow: hidden;
padding: 0;
position: fixed;
top: 0;
left: 0;
width: 100vw;
z-index: 998;
}
.progress.show {
display: block;
}
.progress::-webkit-progress-bar {
background-color: #ededed;
}
.progress::-webkit-progress-value {
background-color: #979797;
}
.progress::-moz-progress-bar {
background-color: #979797;
}
.progress::-ms-fill {
background-color: #979797;
border: none;
}
.progress:indeterminate {
-webkit-animation-duration: 1.5s;
animation-duration: 1.5s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-name: moveIndeterminate;
animation-name: moveIndeterminate;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
background-color: #ededed;
background-image: linear-gradient(to right, #979797 30%, #ededed 30%);
background-position: top left;
background-repeat: no-repeat;
background-size: 150% 150%;
}
.progress:indeterminate::-webkit-progress-bar {
background-color: transparent;
}
.progress:indeterminate::-moz-progress-bar {
background-color: transparent;
}
.progress:indeterminate::-ms-fill {
animation-name: none;
}
.progress.is-white::-webkit-progress-value {
background-color: #ffffff;
}
.progress.is-white::-moz-progress-bar {
background-color: #ffffff;
}
.progress.is-white::-ms-fill {
background-color: #ffffff;
}
.progress.is-white:indeterminate {
background-image: linear-gradient(to right, #ffffff 30%, #ededed 30%);
}
.progress.is-black::-webkit-progress-value {
background-color: #000000;
}
.progress.is-black::-moz-progress-bar {
background-color: #000000;
}
.progress.is-black::-ms-fill {
background-color: #000000;
}
.progress.is-black:indeterminate {
background-image: linear-gradient(to right, #000000 30%, #ededed 30%);
}
.progress.is-light::-webkit-progress-value {
background-color: whitesmoke;
}
.progress.is-light::-moz-progress-bar {
background-color: whitesmoke;
}
.progress.is-light::-ms-fill {
background-color: whitesmoke;
}
.progress.is-light:indeterminate {
background-image: linear-gradient(to right, whitesmoke 30%, #ededed 30%);
}
.progress.is-dark::-webkit-progress-value {
background-color: #333333;
}
.progress.is-dark::-moz-progress-bar {
background-color: #333333;
}
.progress.is-dark::-ms-fill {
background-color: #333333;
}
.progress.is-dark:indeterminate {
background-image: linear-gradient(to right, #333333 30%, #ededed 30%);
}
.progress.is-primary::-webkit-progress-value {
background-color: #d81800;
}
.progress.is-primary::-moz-progress-bar {
background-color: #d81800;
}
.progress.is-primary::-ms-fill {
background-color: #d81800;
}
.progress.is-primary:indeterminate {
background-image: linear-gradient(to right, #d81800 30%, #ededed 30%);
}
.progress.is-link::-webkit-progress-value {
background-color: #333333;
}
.progress.is-link::-moz-progress-bar {
background-color: #333333;
}
.progress.is-link::-ms-fill {
background-color: #333333;
}
.progress.is-link:indeterminate {
background-image: linear-gradient(to right, #333333 30%, #ededed 30%);
}
.progress.is-info::-webkit-progress-value {
background-color: #3298dc;
}
.progress.is-info::-moz-progress-bar {
background-color: #3298dc;
}
.progress.is-info::-ms-fill {
background-color: #3298dc;
}
.progress.is-info:indeterminate {
background-image: linear-gradient(to right, #3298dc 30%, #ededed 30%);
}
.progress.is-success::-webkit-progress-value {
background-color: #00a331;
}
.progress.is-success::-moz-progress-bar {
background-color: #00a331;
}
.progress.is-success::-ms-fill {
background-color: #00a331;
}
.progress.is-success:indeterminate {
background-image: linear-gradient(to right, #00a331 30%, #ededed 30%);
}
.progress.is-warning::-webkit-progress-value {
background-color: #ffdd57;
}
.progress.is-warning::-moz-progress-bar {
background-color: #ffdd57;
}
.progress.is-warning::-ms-fill {
background-color: #ffdd57;
}
.progress.is-warning:indeterminate {
background-image: linear-gradient(to right, #ffdd57 30%, #ededed 30%);
}
.progress.is-danger::-webkit-progress-value {
background-color: #d81800;
}
.progress.is-danger::-moz-progress-bar {
background-color: #d81800;
}
.progress.is-danger::-ms-fill {
background-color: #d81800;
}
.progress.is-danger:indeterminate {
background-image: linear-gradient(to right, #d81800 30%, #ededed 30%);
}
.progress.is-small {
height: 0.875rem;
}
.progress.is-medium {
height: 1.125rem;
}
.progress.is-large {
height: 1.375rem;
}
* {
box-sizing: border-box;
-moz-box-sizing: border-box;
}
html {
font-size: 16px;
}
body {
margin: 0;
overflow-x: hidden;
font-size: 1rem;
}
.container {
max-width: 1274px;
margin: 0 auto;
padding: 0;
}
#st-1 {
z-index: 1 !important;
}
.post-container {
margin: 36px 0;
}
.post-container .post-field {
padding-left: 0;
}
.post-container .post-field .row {
margin: 0;
}
.post-container .post-field .row .post-col {
padding: 0;
}
.post-container .post-field {
padding-right: 0;
}
.post-container .post-field .row:last-child {
flex-direction: column-reverse;
}
.post-container .post-field .row .post-col .row:last-child {
flex-direction: row;
}
.post-container .post-field .row .post-col .row .col {
padding: 0;
}
.post-container .post-field .row .post-col.post-square {
padding-right: 5px;
}
.post-container .post-field .row .post-col.post-square .col-5 {
padding-left: 0;
padding-right: 10px;
}
.aside-container {
padding-right: 0;
padding-left: 0;
}
@media screen and (min-width: 768px) {
.post-container .post-field .row:last-child {
flex-direction: row;
}
.post-container .post-field .row .post-col {
padding-right: 7px;
}
.post-container .post-field .row .post-col.col-p-n {
padding-right: 0;
padding-left: 13px;
}
.post-container .post-field .row .post-col.post-square {
padding-right: 0;
}
.post-container .post-field .row .post-col.post-square .col-5 {
padding: 0;
padding-left: 13px;
}
.post-container .second-r {
flex-direction: row;
}
.aside-container {
margin-top: 20px;
}
}
@media screen and (min-width: 1024px) {
.post-container .col-xl-3 {
flex: 0 0 25%;
max-width: 25%;
width: 25%;
}
.post-container .col-xl-9 {
flex: 0 0 75%;
max-width: 75%;
width: 75%;
}
.post-container .post-field .row .post-col {
padding-right: 10px;
}
.post-container .post-field .row .post-col.col-p-n {
padding-right: 5px;
padding-left: 10px;
}
.post-container .post-field .row .post-col.post-square {
padding-right: 0;
}
.post-container .post-field .row .post-col.post-square .col-5 {
padding: 0 5px 0 10px;
}
.post-container .post-field .row .col-p-n .row:first-child {
margin-bottom: 40px;
}
.aside-container {
margin-top: 0px;
padding-left: 15px !important;
}
}
.content-wrapper {
position: relative;
margin-top: 1rem;
margin-bottom: 2px;
}
.content-wrapper .row {
margin: 0;
padding: 0;
justify-content: space-between;
}
.content-wrapper .row .content-col {
margin: 0;
padding: 0;
}
.content-wrapper .right .related-post .post-related-Swiper {
z-index: 0;
}
.content-wrapper .right .related-post .detail-post-title {
margin-bottom: 2rem;
}
.content-wrapper .pipe {
padding: 0 34px;
}
.feature-post {
margin-top: 1rem;
margin-bottom: 2rem;
}
.feature-post .feature-title-post {
font-size: 1.5rem;
line-height: 1.5;
margin: 0;
}
.feature-post .feature-img {
margin: 0px;
width: 100%;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-color: transparent;
-o-object-fit: cover;
object-fit: cover;
padding-bottom: 20px;
}
.feature-post .feature-link {
font-weight: 600;
text-transform: uppercase;
font-size: 1.125rem;
color: #D81800;
}
.feature-post .feature-link:hover {
color: #BA2412;
text-decoration: none;
}
.detail-post .detail-post-title {
display: flex;
width: 100%;
padding: 16px 0;
border-top: 0.25rem solid #d81800;
border-bottom: 1px solid #f0f0f0;
color: #D81800;
}
.feedback-bar {
display: flex;
flex-direction: column;
justify-content: space-between;
color: #FFFFFF;
background-color: #D81800;
padding: 8px 12px;
width: 100%;
}
.feedback-bar .feedback-bar-item a {
color: #FFFFFF;
text-decoration: underline;
margin-right: 10px;
}
.feedback-bar .feedback-bar-item a:hover {
color: #333333;
}
.feedback-bar .feedback-bar-item .dot-icon::after {
position: absolute;
content: '•';
margin-left: -32px;
}
.topic-detail {
display: flex;
flex-direction: column;
text-transform: uppercase;
width: 100%;
}
.topic-detail .btn-container {
display: flex;
flex-wrap: wrap;
}
.topic-detail .btn-container button {
margin-right: 4px;
}
.topic-detail .btn-container button:hover {
opacity: 0.9;
}
.topic-detail span {
margin-bottom: 10px;
}
.topic-detail .tags {
font-weight: 600;
margin-top: 22px;
margin-bottom: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
list-style-type: none;
}
.topic-detail .tags a {
color: #333333;
line-height: 0.8;
}
.topic-detail .tags a:hover {
opacity: 0.9;
text-decoration: none;
}
.topic-detail .tags li {
text-transform: none;
margin: 10px 0;
line-height: 0.8;
}
.topic-detail .tags li::after {
content: '';
display: inline-block;
height: 0.875rem;
border-right: 2px solid #333333;
margin: 0 10px;
padding-top: 0;
}
.topic-detail .tags li:last-child::after {
content: '';
border: none;
}
.article-toolbar {
display: flex;
flex-direction: column;
margin: 1rem 0 2rem !important;
padding-top: 16px;
}
.article-toolbar .article-bar {
display: flex;
align-items: center;
line-height: 1;
margin-bottom: 1rem;
}
.article-toolbar .article-bar .article-item {
display: flex;
justify-content: center;
align-items: center;
margin-left: 8px;
opacity: 1;
}
.article-toolbar .article-bar .article-item:hover {
text-decoration: none;
}
.article-toolbar .article-bar .article-item:hover .icon {
color: #8b1c0e;
opacity: 0.9;
}
.article-toolbar .article-bar .article-item .icon {
color: #D81800;
width: 32px;
height: 32px;
}
.article-toolbar .article-bar .article-item .icon::before {
font-size: 2rem;
}
.article-toolbar .article-bar .article-item:last-child {
border: none;
font-size: 24px;
}
.article-toolbar .article-bar .border-vertical {
display: inline-block;
color: #a4a4a4;
margin-left: 8px;
}
.article-toolbar .article-bar .border-vertical::before {
content: '|';
}
.article-toolbar .readspeaker a {
color: #333333;
}
.readspeaker a {
cursor: pointer;
}
.content-with-border {
padding: 0.5em 0.75em;
text-align: left;
border: 1px solid #dadada;
}
.table-content {
background-color: #f0f0f0;
}
.table-content .row {
padding: 0;
margin: 0;
}
.table-content .row > [class*='col-'] {
border: 1px solid #dadada;
padding: 0.5em 0.75em;
margin: 0;
}
.table-content .row > [class*='col-']:first-child {
border-right: none;
}
.table-content .content {
margin-top: 0.5em;
}
.table-content .img {
width: 100%;
height: auto;
}
.table-content .title {
width: calc(100% + (0.75em * 2));
margin-left: -0.75em;
padding-left: 0.75em;
padding-bottom: 0.5em;
border-bottom: 1px solid #dadada;
}
.table-content .desc {
padding: 0;
padding-top: 0.5em;
font-style: italic;
text-align: center;
}
.horizontal-border {
position: relative;
width: 100vw;
left: calc(-50vw + 50%);
border-bottom: 3px solid #D81800;
}
.content-field {
width: 100%;
}
.content-field .content-img {
max-width: 100%;
}
.carousel-detail-field {
position: relative;
width: 100%;
padding: 10px;
border: 1px solid #dadada;
}
.carousel-detail-field .detailSwiper,
.carousel-detail-field .detailSwiper2,
.carousel-detail-field .detailSwiper3,
.carousel-detail-field .detailSwiper4 {
width: 100%;
height: calc(100% + 30px);
margin-bottom: -30px;
--swiper-theme-color: red;
}
.carousel-detail-field .detailSwiper .swiper-wrapper,
.carousel-detail-field .detailSwiper2 .swiper-wrapper,
.carousel-detail-field .detailSwiper3 .swiper-wrapper,
.carousel-detail-field .detailSwiper4 .swiper-wrapper {
padding-bottom: 30px;
}
.carousel-detail-field .detailSwiper .swiper-wrapper .swiper-slide,
.carousel-detail-field .detailSwiper2 .swiper-wrapper .swiper-slide,
.carousel-detail-field .detailSwiper3 .swiper-wrapper .swiper-slide,
.carousel-detail-field .detailSwiper4 .swiper-wrapper .swiper-slide {
user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
width: auto;
}
.carousel-detail-field .detailSwiper .swiper-wrapper .swiper-slide a img,
.carousel-detail-field .detailSwiper2 .swiper-wrapper .swiper-slide a img,
.carousel-detail-field .detailSwiper3 .swiper-wrapper .swiper-slide a img,
.carousel-detail-field .detailSwiper4 .swiper-wrapper .swiper-slide a img {
height: 280px;
width: auto;
}
.carousel-detail-field .detailSwiper2 .swiper-wrapper .swiper-slide .detail-carousel-item img {
width: 100%;
height: 100%;
max-height: 280px;
-o-object-fit: cover;
object-fit: cover;
}
.carousel-detail-field .detailSwiper3 .swiper-wrapper .swiper-slide .detail-carousel-item img,
.carousel-detail-field .detailSwiper4 .swiper-wrapper .swiper-slide .detail-carousel-item img {
width: auto;
height: 100%;
height: 280px;
-o-object-fit: cover;
object-fit: cover;
}
.carousel-detail-field.carousel-field .swiper-btn {
top: calc(50% - 25px);
}
.carousel-detail-field .swiper-pagination {
bottom: -5px;
}
.carousel-detail-field .resize-icon {
position: absolute;
bottom: 30px;
right: 0;
z-index: 10;
background: #000000;
font-size: 1.375rem;
color: #ffffff;
padding: 10px;
pointer-events: none;
}
.js-tabbed-content .tabs-pane {
display: none;
margin-bottom: 1.5rem;
}
.js-tabbed-content .tabs-pane.active {
display: block;
}
.js-tabbed-content .tabs-pane img {
max-width: 100%;
}
.js-tabbed-content .tabs-description {
font-size: 15px;
text-align: center;
}
.js-tabbed-content .tabs {
display: flex;
justify-content: center;
white-space: nowrap;
}
.js-tabbed-content .tabs ul {
padding: 0;
list-style-type: none;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
}
.js-tabbed-content .tabs li {
display: flex;
flex-wrap: nowrap;
}
.js-tabbed-content .tabs li.active a {
color: #333333;
}
.js-tabbed-content .tabs li::after {
content: "|";
line-height: 2.4;
}
.js-tabbed-content .tabs li:last-child::after {
display: none;
}
.js-tabbed-content .tabs a {
font-size: 15px;
align-items: center;
border-bottom-color: #f0f0f0;
border-bottom-style: none;
border-bottom-width: 1px;
color: #d81800;
display: flex;
justify-content: center;
margin-bottom: -1px;
padding: 0.5em 0.5em;
vertical-align: top;
}
.js-tabbed-content .tabs a:hover {
text-decoration: none;
color: #333333;
}
.model-carousel {
display: none;
position: fixed;
top: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.86);
width: 100vw;
height: 100vh;
z-index: 100000;
justify-content: center;
align-items: center;
}
.model-carousel.active {
display: flex;
}
.model-carousel .model-close {
border: none;
position: absolute;
top: -50px;
right: 0;
width: 50px;
height: 50px;
max-height: 50px;
max-width: 50px;
min-height: 50px;
min-width: 50px;
border-radius: 0;
background-color: #d81800;
}
.model-carousel .model-close::before {
height: 4px;
width: 50%;
background-color: #ffffff;
content: "";
display: block;
left: 50%;
position: absolute;
top: 50%;
transform: translateX(-50%) translateY(-50%) rotate(45deg);
transform-origin: center center;
}
.model-carousel .model-close::after {
height: 50%;
width: 4px;
background-color: #ffffff;
content: "";
display: block;
left: 50%;
position: absolute;
top: 50%;
transform: translateX(-50%) translateY(-50%) rotate(45deg);
transform-origin: center center;
}
.model-carousel .model-icon {
position: absolute;
top: 35%;
width: 50px;
height: 50px;
display: flex;
justify-content: center;
align-items: center;
border: none;
background-color: #FFFFFF;
font-size: 25px;
}
.model-carousel .model-icon.left {
left: 20px;
}
.model-carousel .model-icon.right {
right: 20px;
}
.model-carousel .model-wrapper {
position: relative;
height: auto;
width: calc(100vw - 2rem);
max-height: calc(100vh - 40px);
background: #ffffff;
padding: calc(10px*2);
}
.model-carousel .carousel-field {
position: relative;
padding: 10px 0;
margin: 0;
border: none;
}
.model-carousel .slide-show {
display: none;
text-align: center;
opacity: 0;
pointer-events: none;
user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
-webkit-animation: visibleSlideShow 1.2s;
animation: visibleSlideShow 1.2s;
max-width: 80%;
margin: 0 auto;
}
.model-carousel .slide-show.active {
opacity: 1;
display: block;
}
.model-carousel .slide-show .image {
max-height: 50vh;
}
.model-carousel .slide-show .slider-caption {
margin-top: 10px;
margin-bottom: 10px;
}
@-webkit-keyframes visibleSlideShow {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes visibleSlideShow {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.model-carousel .slider-caption {
margin: 0 auto;
text-align: center;
}
.model-carousel .carousel-detail-model-2 .detailSwiper.model-2 .swiper-wrapper .swiper-slide.swiper-slide-active .slider-thumb::after,
.model-carousel .carousel-detail-model-2 .detailSwiper2.model-2 .swiper-wrapper .swiper-slide.swiper-slide-active .slider-thumb::after,
.model-carousel .carousel-detail-model-2 .detailSwiper3.model-2 .swiper-wrapper .swiper-slide.swiper-slide-active .slider-thumb::after,
.model-carousel .carousel-detail-model-2 .detailSwiper4.model-2 .swiper-wrapper .swiper-slide.swiper-slide-active .slider-thumb::after {
border: 2px solid #d81800;
content: '';
width: 100%;
height: 100%;
position: absolute;
z-index: 1;
}
.model-carousel .carousel-detail-model-2 .detailSwiper.model-2 .swiper-wrapper .swiper-slide .slider-thumb,
.model-carousel .carousel-detail-model-2 .detailSwiper2.model-2 .swiper-wrapper .swiper-slide .slider-thumb,
.model-carousel .carousel-detail-model-2 .detailSwiper3.model-2 .swiper-wrapper .swiper-slide .slider-thumb,
.model-carousel .carousel-detail-model-2 .detailSwiper4.model-2 .swiper-wrapper .swiper-slide .slider-thumb {
position: relative;
width: 100%;
padding-bottom: 56.25%;
cursor: pointer;
}
.model-carousel .carousel-detail-model-2 .detailSwiper.model-2 .swiper-wrapper .swiper-slide .image,
.model-carousel .carousel-detail-model-2 .detailSwiper2.model-2 .swiper-wrapper .swiper-slide .image,
.model-carousel .carousel-detail-model-2 .detailSwiper3.model-2 .swiper-wrapper .swiper-slide .image,
.model-carousel .carousel-detail-model-2 .detailSwiper4.model-2 .swiper-wrapper .swiper-slide .image {
pointer-events: none;
user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
position: absolute;
height: 100%;
width: auto;
left: 50%;
transform: translateX(-50%);
}
.post-related-Swiper.fullwidth.isColumn {
flex-direction: column;
}
.post-related-Swiper.fullwidth .swiper-wrapper {
width: calc(100% + 20px);
margin-left: -10px;
flex-wrap: wrap;
}
.post-related-Swiper.fullwidth .swiper-slide {
width: calc(100% / 3);
padding: 10px;
}
.post-related-Swiper.fullwidth .swiper-slide .post-related-img::after {
content: "";
position: absolute;
background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.5));
opacity: 0.5;
height: 100%;
width: 100%;
top: 0;
}
.post-related-Swiper.fullwidth .swiper-slide .post-related-img:hover::after {
background: linear-gradient(125deg, #f97794, #623aa2);
}
.spinner {
position: relative;
height: 100%;
width: 100px;
overflow: hidden;
}
.spinner img {
position: absolute;
top: calc(50% - 9px);
left: 0;
max-width: none;
}
.feedback-row .container {
padding: 0;
}
.content-two-column {
width: calc(100% + 20px);
margin-left: -10px;
margin-top: 1rem;
padding-bottom: 2rem;
}
.content-two-column .row.grey div {
background-color: #f0f0f0;
}
.content-two-column .content-2c-col {
padding: 10px;
}
@media screen and (max-width: 424px) {
.article-toolbar .article-bar .article-item:last-child {
display: none;
}
.article-toolbar .article-bar .border-vertical {
display: none;
}
}
@media screen and (max-width: 767px) {
.topic-detail .tags a {
line-height: 1.6;
}
.topic-detail .tags li {
font-size: 15px;
}
.post-related-Swiper.fullwidth .swiper-wrapper {
width: 100%;
flex-wrap: nowrap;
}
.post-related-Swiper.fullwidth .swiper-slide {
padding: 0;
width: 100%;
}
.post-related-Swiper.fullwidth .swiper-slide .post-related-img::after {
display: none;
}
}
@media screen and (min-width: 425px) {
.content-wrapper .row .content-col.left {
min-width: calc(100% - 4% - 24%);
}
.content-wrapper .row .content-col.right {
max-width: 100%;
margin-left: 0;
}
.content-wrapper .article-field {
flex-direction: column;
}
.detail-post .detail-post-title {
text-align: center;
justify-content: center;
font-size: 1rem;
}
}
@media screen and (min-width: 768px) {
.content-wrapper .row .content-col.left {
min-width: calc(100% - 4% - 24%);
}
.content-wrapper .row .content-col.right {
max-width: 25%;
margin-left: 0;
}
.content-wrapper .article-field {
margin-top: 16px;
}
.content-wrapper .article-field .readspeaker {
margin-top: 0;
}
.feedback-bar {
flex-direction: row;
}
.feedback-row .col-12 {
padding-right: 10px;
}
.detail-post .detail-post-title {
text-align: center;
justify-content: center;
font-size: 1rem;
}
.detail-post .feature-title-post {
font-size: 1.5rem;
}
.topic-detail .tags {
width: 100%;
}
.post-related-Swiper .swiper-slide {
height: -webkit-fit-content !important;
height: -moz-fit-content !important;
height: fit-content !important;
}
.post-related-Swiper .swiper-slide .post-child {
padding-bottom: 16px;
margin-bottom: 0;
}
}
@media screen and (min-width: 1024px) {
.content-wrapper .article-field {
flex-direction: row;
}
.content-wrapper .row .content-col.left {
min-width: calc(100% - 9% - 24%);
}
.content-wrapper .row .content-col.right {
max-width: 25%;
padding-left: 0;
}
.article-toolbar {
flex-direction: row;
justify-content: space-between;
}
.article-toolbar .article-bar {
margin-bottom: 0;
}
.detail-post .detail-post-title {
text-align: left;
justify-content: left;
font-size: 1.125rem;
}
.detail-post .feature-title-post {
font-size: 2rem;
}
.js-tabbed-content .tabs-description {
font-size: 1rem;
}
.js-tabbed-content .tabs a {
font-size: 1rem;
}
.model-carousel .model-wrapper {
width: 68.75%;
}
.model-carousel .model-close {
top: 0;
right: -50px;
}
}
@media screen and (min-width: 1215px) {
.content-wrapper .row .content-col.right {
max-width: 24%;
padding-left: 0;
}
}
@media screen and (min-width: 1408px) {
.content-wrapper .row .content-col.right {
max-width: 290px;
margin-left: 9%;
}
}
.header-default {
width: 100%;
}
.article-field {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.category-list,
.event-category-list {
display: none;
flex-wrap: wrap;
justify-content: center;
margin: 0 0 32px;
}
.category-list .category-btn,
.event-category-list .category-btn {
text-transform: uppercase;
min-width: 140px;
margin: 0 5px 10px;
padding: 8px 16px;
background-color: #FFFFFF;
color: #D81800;
font-size: 1rem;
border-radius: 20px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
border: 1px solid #D81800;
font-weight: 600;
}
.category-list .category-btn.active,
.event-category-list .category-btn.active {
background-color: #D81800;
color: #FFFFFF;
}
.category-list button:hover,
.event-category-list button:hover {
background-color: #D81800;
color: #FFFFFF;
}
@media screen and (min-width: 768px) {
.container-fluid {
padding: 0 75px;
}
.category-list,
.event-category-list {
display: flex;
}
.header-dropdown {
display: none;
}
}
@media screen and (min-width: 1024px) {
.main-topic {
padding: 0;
}
.container-fluid {
padding: 0 55px;
}
}
.nav-tabs .nav-link.active {
-webkit-appearance: none;
}
.events-field .col-md-4 {
flex: 0 0 100%;
max-width: 100%;
}
.btn-view-all {
border-radius: 2rem;
font-size: 0.8rem;
color: #fff;
background-color: #d81800;
padding: 0.75rem 3.5rem;
font-weight: 600;
margin: 2rem auto;
border: #fff solid 2px;
transition: 0.5s;
}
.btn-view-all:hover {
background-color: #fff;
color: #d81800;
border: #d81800 solid 2px;
}
.event-item {
padding: 0;
}
.event-item.big-event-item .item__time,
.event-item.big-event-item .item__title--link,
.event-item.big-event-item .item__body p {
color: #fff;
}
.event-item.big-event-item .item .col-12 .p-2 {
padding-left: 15px !important;
}
.event-item.big-event-item .content {
position: absolute;
bottom: 1rem;
}
.event-item.big-event-item .item__image img {
aspect-ratio: 21 / 9;
min-height: 320px;
}
.event-item.event-item-detail:last-of-type {
margin-bottom: 4rem;
}
.event-item.event-item-detail .item {
border-bottom: 1px solid #808080;
padding: 2.5rem 0;
}
.event-item .item {
position: relative;
padding: 15px 0;
}
.event-item .item .col-12 {
padding: 0;
}
.event-item .item .col-12 .p-2 {
padding: 0 10px 0 0 !important;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
}
.event-item .item__image .item__image_overplay {
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 30%, rgba(0, 0, 0, 0.8) 75%);
height: 100%;
display: block;
position: absolute;
width: 100%;
opacity: 1;
}
.event-item .item__image img {
aspect-ratio: 16 / 9;
max-width: 100%;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.event-item .item__tag {
display: flex;
flex-wrap: wrap;
margin-bottom: 0;
}
.event-item .item__tag a {
text-decoration: none;
}
.event-item .tag {
margin: 0px 10px 10px 0px;
align-items: center;
border-radius: 0;
color: #979797;
display: inline-flex;
height: 2em;
justify-content: center;
line-height: 1.5;
padding-left: 0.75em;
padding-right: 0.75em;
white-space: nowrap;
background-color: #dadada;
font-size: 0.75rem;
text-transform: uppercase;
vertical-align: top;
}
.event-item .tag:hover {
color: #fff;
text-decoration: none;
}
.event-item .tag-primary {
color: #fff;
line-height: 1;
border: none;
}
.event-item .item__title {
margin-bottom: 0.5rem;
vertical-align: text-top;
outline: none;
line-height: initial;
}
.event-item .item__title--link {
font-weight: 600;
font-size: 0.75rem;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
/* number of lines to show */
line-clamp: 1;
-webkit-box-orient: vertical;
}
.event-item .item__title--link:hover {
color: #d81800;
}
.event-item .item__body p {
margin: 0.5rem 0;
font-size: 0.813rem;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
line-clamp: 3;
-webkit-box-orient: vertical;
color: #121212;
font-weight: 300;
}
.event-item p:not(:last-child) {
margin-bottom: 1em;
}
.event-item a {
color: #121212;
cursor: pointer;
text-decoration: none;
}
.event-item .item__time,
.event-item .item__location {
font-weight: 600;
margin-bottom: 0.5rem;
color: #121212;
font-size: 0.75rem;
}
.event-item .item__description {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
}
.event-item .event-status {
font-weight: 600;
font-size: 0.75rem;
}
.event-item .event-status.red-status {
color: #d81800;
}
.event-item .event-status.green-status {
color: #12d800;
}
.event-item .event-status.yellow-status {
color: #d4d800;
}
.header-banner-event-detail {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
}
.header-banner-event-detail .banner-video video {
width: 100%;
-o-object-fit: cover;
object-fit: cover;
max-height: calc(100vh - 195px);
}
.header-banner-event-detail .banner-video video::-webkit-media-controls {
display: none;
}
.header-banner-event-detail .banner-image img {
width: 100%;
max-height: calc(100vh - 195px);
-o-object-fit: cover;
object-fit: cover;
}
.header-banner-event-detail .banner-title {
position: relative;
background-color: #f0f0f0;
padding: 2rem;
}
.header-banner-event-detail .banner-title .title {
font-weight: 700;
margin-bottom: 0.5rem;
color: #121212;
font-size: 1.125rem;
}
.header-banner-event-detail .banner-title .hosted {
font-size: 0.75rem;
font-weight: 400;
margin-bottom: 0.5rem;
color: #121212;
}
.event-filter-btn {
width: 100%;
text-align: left;
border-radius: 0;
border: 1px solid #f0f0f0;
}
.event-filter-btn .dropdown-icon {
float: right;
margin-top: 5px;
}
.event-filter-wrapper-mobile {
display: none;
background-color: rgba(18, 18, 18, 0.35);
width: 100%;
height: 100%;
position: fixed;
top: 0;
right: 0;
z-index: 1000;
transition: 0.5s;
}
.event-filter-wrapper-mobile.show {
display: block;
}
.event-filter-wrapper-mobile .event-filter-mobile {
background-color: #fff;
height: 100%;
width: 100%;
z-index: 1000;
transition: 0.5s;
display: block;
padding: 2rem 1rem;
}
.event-filter-wrapper-mobile .event-filter-mobile .event-filter .filter-label {
margin: auto;
}
.event-filter-wrapper-mobile .event-filter-mobile .btn-reset {
border-radius: 2rem;
font-size: 0.8rem;
padding: 0.75rem 3.5rem;
font-weight: 600;
margin: 2rem auto;
transition: 0.5s;
background-color: #fff;
color: #d81800;
border: #d81800 solid 2px;
}
.event-filter-wrapper-mobile .event-filter-mobile .btn-reset:hover {
background-color: #d81800;
color: #fff;
border: #fff solid 2px;
}
.event-filter-wrapper-mobile .event-filter-mobile .btn-apply {
border-radius: 2rem;
font-size: 0.8rem;
color: #fff;
background-color: #d81800;
padding: 0.75rem 3.5rem;
font-weight: 600;
margin: 2rem auto;
border: #fff solid 2px;
transition: 0.5s;
}
.event-filter-wrapper-mobile .event-filter-mobile .btn-apply:hover {
background-color: #fff;
color: #d81800;
border: #d81800 solid 2px;
}
.event-filter-wrapper-mobile .event-filter-mobile .btn-close {
position: absolute;
right: 25px;
top: 25px;
background-color: #fff0;
outline: none;
border: none;
font-size: 2rem;
}
.event-filter-btn-toggle {
margin-bottom: 3rem;
}
.header-dropdown {
margin-bottom: 3rem;
}
.event-filter {
margin-bottom: 3rem;
}
.event-filter .filter-label {
padding: 0.4rem 0;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
}
.event-filter .dropdown-menu {
width: 100%;
}
.event-filter .dropdown-menu .dropdown-item {
padding: 0.25rem 0.75rem;
}
.content-wrapper .row.event-detail {
padding-top: 2rem;
}
.content-wrapper .row.event-detail :first-child {
margin-top: 0;
}
.content-wrapper .row.event-detail h2 {
font-weight: 600;
margin: 2.5rem 0 1.5rem;
width: 100%;
}
.content-wrapper .row.event-detail .text {
margin-top: 1.5rem;
}
.content-wrapper .row.event-detail .speakers .speaker-item {
margin: 1rem 0 1.5rem;
}
.content-wrapper .row.event-detail .speakers .speaker-item .speaker-img {
width: 100%;
text-align: center;
overflow: hidden;
}
.content-wrapper .row.event-detail .speakers .speaker-item .speaker-img img {
-o-object-fit: scale-down;
object-fit: scale-down;
max-height: 45vw;
}
.content-wrapper .row.event-detail .speakers .speaker-item .speaker-info {
padding: 1rem 0;
}
.content-wrapper .row.event-detail .speakers .speaker-item .speaker-info .speaker-name {
font-weight: 700;
font-size: 1.375rem;
}
.content-wrapper .row.event-detail .speakers .speaker-item .speaker-info .speaker-position {
font-size: 1.125rem;
margin-bottom: 0.5rem;
}
.content-wrapper .row.event-detail .main-event-info {
margin-bottom: 2rem;
padding: 1rem;
background-color: #f7f7f7;
padding-bottom: 1.5rem;
justify-content: space-evenly;
}
.content-wrapper .row.event-detail .main-event-info .col-xl-auto {
display: flex;
}
.content-wrapper .row.event-detail .main-event-info .col-xl-auto .info {
display: flex;
flex-direction: column;
}
.content-wrapper .row.event-detail .main-event-info .col-xl-auto .info > * {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
}
.content-wrapper .row.event-detail .main-event-info .info {
margin-left: 2rem;
display: block;
height: 100%;
}
.content-wrapper .row.event-detail .main-event-info .info .date,
.content-wrapper .row.event-detail .main-event-info .info .location,
.content-wrapper .row.event-detail .main-event-info .info .price {
font-weight: 600;
}
.content-wrapper .row.event-detail .main-event-info .info-icon {
min-width: 20px;
width: 20px;
max-width: 20px;
height: 100%;
float: left;
vertical-align: middle;
text-align: left;
}
.content-wrapper .row.event-detail .main-event-info .info-icon svg {
width: 75%;
}
.content-wrapper .row.event-detail .get-ticket {
position: absolute;
width: 100%;
bottom: -25px;
}
.content-wrapper .row.event-detail .get-ticket .btn-get-ticket {
border-radius: 2rem;
font-size: 0.8rem;
color: #fff;
background-color: #d81800;
padding: 0.75rem 3.5rem;
font-weight: 600;
border: #fff solid 2px;
transition: 0.5s;
height: 50px;
}
.content-wrapper .row.event-detail .get-ticket .btn-get-ticket:hover {
background-color: #fff;
color: #d81800;
border: #d81800 solid 2px;
}
@media screen and (min-width: 768px) {
.events-field .col-md-4 {
flex: 0 0 calc(50% - 20px);
max-width: calc(50% - 20px);
}
.event-item .item__title--link {
font-weight: 700;
font-size: 0.813rem;
}
.event-item .item__body p {
font-size: 0.938rem;
}
.event-item .item__time,
.event-item .item__location {
font-size: 0.813rem;
}
.event-item .event-status {
font-size: 0.813rem;
}
.event-item .item__body,
.event-item .item__tag {
display: flex;
}
.header-banner-event-detail .banner-title .title {
font-size: 1.375rem;
}
.header-banner-event-detail .banner-title .hosted {
font-size: 0.813rem;
}
.content-wrapper .row.event-detail .speakers .speaker-item .speaker-img {
text-align: left;
}
.content-wrapper .row.event-detail .speakers .speaker-item .speaker-img img {
max-height: 30vw;
}
.content-wrapper .row.event-detail .speakers .speaker-item .speaker-info {
padding: 1rem;
}
}
@media screen and (min-width: 1024px) {
.events-field .col-md-4 {
flex: 0 0 calc(33.333333% - 20px);
max-width: calc(33.333333% - 20px);
}
.event-item.big-event-item .item .col-12 .p-2 {
padding-left: 2rem !important;
}
.event-item .item__title--link {
font-size: 0.938rem;
}
.event-item .item__body p {
font-size: 1.125rem;
}
.event-item .item__time,
.event-item .item__location {
font-size: 0.938rem;
}
.event-item .event-status {
font-size: 0.938rem;
}
.header-banner-event-detail .banner-title {
position: absolute;
bottom: 0;
width: 100%;
padding: 5rem;
background: #ffffff;
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 25%, rgba(0, 0, 0, 0.5) 65%, #000000 100%);
}
.header-banner-event-detail .banner-title .title {
color: #f0f0f0;
font-size: 1.75rem;
}
.header-banner-event-detail .banner-title .hosted {
font-size: 1rem;
color: #f0f0f0;
}
.content-wrapper .row.event-detail .main-event-info {
margin-bottom: 2rem;
padding: 2rem;
padding-bottom: 2.5rem;
}
.content-wrapper .row.event-detail .main-event-info .col-xl-auto {
flex: 1;
padding: 0 10px;
}
.content-wrapper .row.event-detail .main-event-info .info {
margin-left: 5px;
display: inline-block;
}
.content-wrapper .row.event-detail .main-event-info .info .date,
.content-wrapper .row.event-detail .main-event-info .info .location,
.content-wrapper .row.event-detail .main-event-info .info .price {
font-weight: 600;
}
.content-wrapper .row.event-detail .speakers .speaker-item {
margin: 1rem 0 1.5rem;
}
.content-wrapper .row.event-detail .speakers .speaker-item .speaker-img {
width: 100%;
max-height: 250px;
}
.content-wrapper .row.event-detail .speakers .speaker-item .speaker-info .speaker-name {
font-weight: 700;
font-size: 1.375rem;
}
.content-wrapper .row.event-detail .speakers .speaker-item .speaker-info .speaker-position {
font-size: 1.125rem;
margin-bottom: 0.5rem;
}
}
.main-topic {
padding: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.main-topic .dropdown-topic {
margin-bottom: 10px;
}
.db-name {
width: 100%;
text-align: center;
font-weight: bold;
font-size: 1.75rem;
}
.px-lg-5 {
margin: 80px;
}
.topic-menu {
z-index: 5;
}
@media screen and (min-width: 1024px) {
.main-topic {
padding: 0 10px;
}
.db-name {
font-size: 2.25rem;
}
}
.horizontal-border.grey-border {
border-bottom: 1px solid #F0F0F0;
margin-bottom: 24px;
}
.page-anchors {
display: flex;
justify-content: center;
flex-direction: column;
margin: 16px 0 32px;
}
.page-anchors a {
text-transform: uppercase;
font-size: 1rem;
font-weight: 600;
color: #D81800;
}
@media screen and (min-width: 768px) {
.page-anchors {
flex-direction: row;
}
.page-anchors a:not(:last-child)::after {
content: '';
display: inline-block;
height: 0.875rem;
border-right: 2px solid #333333;
margin: 0 10px;
padding-top: 0;
}
}
@media screen and (min-width: 1024px) {
.page-anchors a {
font-size: 1.125rem;
}
}
.addition-container {
margin-bottom: 10px;
}
.addition-container.aboutus {
margin-bottom: 68px;
}
.addition-container .row {
justify-content: center;
}
.addition-container .row .global-title {
padding: 10px 0 0;
margin: 32px 0 24px;
}
.addition-container .row .global-title.aboutus {
text-align: left;
padding: 0;
padding-top: 16px;
}
.addition-container .row .global-title.faq {
font-size: 2rem !important;
margin: 16px 0 24px;
padding: 0;
}
.addition-container .row .subtitle {
text-align: center;
margin-bottom: 24px;
font-size: 1.375rem;
font-weight: 600;
}
.addition-container .row .subtitle.aboutus {
text-align: left;
}
.addition-container .row .subtitle.faq {
font-weight: normal;
font-style: italic;
font-size: 1rem;
}
.bg-divider,
.bg-introduction,
.bg-divider-2 {
text-align: center;
font-size: 1.125rem;
margin-bottom: 80px;
margin-top: 1rem;
}
.bg-divider img,
.bg-divider-2 img {
height: 10px;
width: 100%;
}
.bg-introduction {
margin: 85px auto 80px;
}
.bg-section-title {
text-transform: uppercase;
margin-bottom: 80px;
margin-top: 1rem;
display: flex;
justify-content: center;
}
.bg-section-title.title-horizontal .bg-left,
.bg-section-title.title-horizontal .bg-right {
display: none;
}
.bg-section-title .bg-content {
position: relative;
padding: 10px 0;
}
.bg-section-title .bg-content h2 {
font-family: AvenirNextLTW01-Heavy;
font-weight: 700;
margin: 10px 0;
font-size: 1.5rem;
display: inline-block;
text-align: center;
line-height: 1.1;
}
.bg-section-title .bg-content .bg-box {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
}
.bg-section-title .bg-content .bg-box .bg-container {
position: relative;
width: 100%;
height: 100%;
}
.bg-section-title .bg-content .bg-box .bg-container .bg-left {
position: absolute;
height: 100%;
left: 0;
transform: translateX(calc(2px - 100%));
}
.bg-section-title .bg-content .bg-box .bg-container .bg-main {
position: relative;
width: 100%;
height: 100%;
}
.bg-section-title .bg-content .bg-box .bg-container .bg-right {
right: 0;
position: absolute;
height: 100%;
transform: translateX(calc(100% - 1px));
}
.bg-section-title .bg-content .bg-box .bg-container .bg-decor {
position: absolute;
bottom: 0;
z-index: 2;
height: 100%;
}
@media screen and (max-width: 768px) {
.bg-section-title {
margin-left: 70px !important;
margin-right: 70px !important;
}
.bg-divider,
.bg-divider-2 {
margin-bottom: 48px;
}
}
@media screen and (min-width: 768px) {
.bg-divider img,
.bg-divider-2 img {
max-width: 300px;
}
.bg-introduction {
max-width: 63%;
}
}
@media screen and (min-width: 1024px) {
.bg-section-title .bg-content h2 {
font-size: 2rem;
}
}
@media screen and (min-width: 1408px) {
.bg-introduction {
max-width: 100%;
}
}
.search-field {
margin-top: 105px;
}
.search-field .row {
justify-content: center;
flex-wrap: nowrap;
margin: 0;
padding: 0;
}
.search-field .row > [class*='col-'] {
margin: 0;
padding: 0;
padding-right: 10px;
}
.search-field .row > [class*='col-']:last-child {
padding-right: 0;
}
.search-field .row .col-md-6 .search-items::after {
display: none;
}
.search-field .row .col-md-3:last-child .search-items::after {
right: 16px;
}
.search-field .search-items {
line-height: normal;
}
.search-field .search-items .title {
line-height: 1;
font-weight: 600;
margin-bottom: 0.5em;
}
.search-field .search-items .input-field {
width: 100%;
box-shadow: none;
border: 1px solid #dadada;
padding-bottom: 0.5rem;
padding-left: 20px;
padding-right: 20px;
padding-top: 0.5rem;
}
.search-field .search-items .input-field:focus {
box-shadow: none;
border: 1px solid #dadada;
}
.search-field .search-items .input-field:focus-visible {
border: 1px solid #dadada;
box-shadow: none;
outline: none;
}
.search-field .search-items .input-field::-moz-placeholder {
opacity: 0.5;
}
.search-field .search-items .input-field::placeholder {
opacity: 0.5;
}
.search-field .search-items .search-select-box {
position: relative;
}
.search-field .search-items .search-select-box::after {
right: 20px;
z-index: 4;
border: 3px solid #333333;
border-radius: 2px;
border-right: 0;
border-top: 0;
content: "";
display: block;
height: 10px;
margin-top: -0.4375em;
pointer-events: none;
position: absolute;
top: calc(50%);
transform: rotate(-45deg);
transform-origin: center;
width: 10px;
}
.search-field .search-items .search-select {
position: relative;
text-align: left;
width: 100%;
padding-bottom: 0.5rem;
padding-left: 20px;
padding-right: 20px;
padding-top: 0.5rem;
background-color: #FFFFFF;
border-radius: 0;
border: 1px solid #dadada;
color: #333333;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
}
.search-field .search-items .search-select:focus {
box-shadow: none;
}
.search-field .search-items .search-select:active {
box-shadow: none;
background-color: #FFFFFF;
color: #333333;
}
.search-field .search-items .search-select:focus-visible {
outline: none;
border-radius: 0;
}
.search-field .search-items .dropdown-search {
top: 100%;
left: 0;
width: calc(100% - 10px);
}
.search-field .search-items .dropdown-search.dropdown-menu .dropdown-content .dropdown-item {
font-weight: normal;
text-transform: none;
}
.search-field .search-items .dropdown-search.dropdown-menu .dropdown-content .dropdown-item:last-child {
padding: 15px 20px;
}
.search-field .banner-btn {
padding-bottom: calc(0.5em + 1px);
padding-left: calc(1.5rem + 1px);
padding-right: calc(1.5rem + 6px);
padding-top: calc(0.5em + 1px);
display: block;
min-width: 0;
margin-left: 0;
}
.search-field .banner-btn span {
text-transform: uppercase;
}
.search-field .banner-btn .icon {
margin-left: 0.375rem;
margin-right: calc(-0.75rem - 1px);
}
.search-field .divider {
margin-top: 3rem;
position: relative;
width: 100vw;
left: calc(-50vw + 50%);
}
.search-result .row {
padding: 0;
margin: 0;
justify-content: center;
}
.search-result .row > [class*='col-'] {
padding: 0;
margin: 0;
}
.search-result .title-main {
margin-top: 1rem;
margin-bottom: 2rem;
}
.search-result .title-main h3 {
font-size: 2rem;
font-weight: 700;
}
.search-result .topic-detail {
margin-top: 2rem;
}
.search-result .topic-detail mark {
font-weight: 600;
margin-top: 10px;
display: block;
background-color: transparent;
color: #d81800;
padding: 0;
margin: 0;
text-transform: uppercase;
}
.search-result .search-view-topic {
margin-top: 1rem;
margin-bottom: 2rem;
font-size: 1.375rem;
font-weight: 700;
}
.search-result .search-view-topic a {
color: #333333;
}
.search-result .search-view-topic a:hover {
text-decoration: none;
}
.highlight-search-text {
color: #D81800 !important;
}
.search-result-item {
padding-bottom: 20px;
width: calc(100% + 20px);
margin-left: -10px;
border-bottom: 1px solid #f0f0f0;
}
.search-result-item .row {
padding: 0;
margin: 0;
justify-content: center;
}
.search-result-item .row .col-4 {
padding: 10px 10px 10px 0;
}
.search-result-item .title {
margin-bottom: 0;
font-weight: 700;
text-transform: uppercase;
}
.search-result-item.features {
background: #f0f0f0;
padding: 20px;
width: 100%;
margin-left: 0;
margin-bottom: 20px;
}
.search-result-item.features .article-link {
display: block;
}
.article-search-item {
padding-top: 20px;
}
.article-search-item .row {
padding: 0;
margin: 0;
}
.article-search-item .row > [class*='col-'] {
padding: 10px;
margin: 0;
}
.article-search-item .row .col-5 {
padding: 10px 10px 10px 0;
}
.article-search-item .article-link {
padding-right: 10px;
}
.article-search-item .article-link img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.article-search-item .article-title a {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
/* number of lines to show */
line-clamp: 3;
-webkit-box-orient: vertical;
color: #333333;
font-size: 1.75rem;
font-weight: 700;
}
.article-search-item .article-title a:visited {
color: #551A8B;
}
.article-search-item .article-title a:hover {
color: #D81800 !important;
text-decoration: none;
}
.article-search-item .article-desc {
margin: 1rem 0;
}
.article-search-item .article-note {
margin-top: 0.5rem;
color: #a4a4a4;
font-size: 0.875rem;
}
.infor-search-box {
background-color: #f0f0f0;
padding: 30px 20px;
margin-top: 1rem;
margin-bottom: 2rem;
}
.infor-search-box .title {
margin-bottom: 1rem;
font-weight: 600;
font-size: 1.125rem;
}
.infor-search-box .desc {
padding: 0;
margin: 0;
}
ul.ui-autocomplete.ui-menu {
display: none;
width: calc(100%);
left: 10px;
min-width: 12rem;
position: absolute;
top: calc(100%);
z-index: 20;
border: none;
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px;
border-top: 2px solid #f0f0f0;
box-shadow: 0 8px 8px rgba(0, 0, 0, 0.1);
background-color: white;
padding: 10px 0;
}
ul.ui-autocomplete.ui-menu li.ui-menu-item {
overflow-x: hidden;
text-overflow: ellipsis;
padding: 15px 20px;
border-bottom: 1px solid #f0f0f0;
text-align: inherit;
white-space: nowrap;
width: 100%;
color: #979797;
display: block;
font-size: 0.875rem;
line-height: 1.5;
position: relative;
text-transform: none;
font-weight: normal;
cursor: pointer;
}
ul.ui-autocomplete.ui-menu li.ui-menu-item:hover {
color: #000000;
background-color: whitesmoke;
}
@media screen and (max-width: 767px) {
.search-field .row {
flex-direction: column;
}
.search-field .row > [class*='col-'] {
margin: 0;
padding: 0;
}
.search-field .search-items {
margin-bottom: 1.625rem;
}
.search-field .search-items .dropdown-search {
top: calc(100% - 1.625rem);
width: 100%;
}
.search-field .banner-btn {
margin-top: 0;
}
.search-result .title-main h3 {
font-size: 1.5rem;
}
.search-result-item {
padding: 0 0 10px;
margin-bottom: 0;
width: 100%;
margin-left: 0;
}
.search-result-item .row .col-md-4 {
padding: 0;
}
.search-result-item .title {
font-size: 1.125rem;
}
.search-result-item .article-link {
display: none;
}
.search-result-item.features {
border-bottom: none;
}
.search-result-item.features .article-link {
padding-right: 0;
display: block;
}
.search-result-item:last-child {
border-bottom: none;
}
.article-search-item {
padding-top: 10px;
}
.article-search-item .article-title a {
font-weight: 600;
font-size: 1rem;
}
.infor-search-box .title {
font-size: 1rem;
}
.infor-search-box .desc {
font-size: 1rem;
}
}
.error-component {
text-align: center;
margin: 1.5rem auto 3rem;
padding: 10px;
}
.error-component img {
margin-bottom: 2.5rem;
}
.error-component .content-text h2 {
font-weight: 700;
margin-bottom: 0.5em;
}
.error-component .banner-btn {
margin-top: 0;
}
.unavailable-component {
position: fixed;
left: 0;
top: 0;
width: 100vw;
height: 100vh;
background-color: #F2F2F2;
text-align: center;
z-index: 99999;
}
.unavailable-component .text {
padding: 8% 28%;
}
.unavailable-component .text p {
font-family: tahoma !important;
margin-bottom: 4px;
}
.unavailable-component .text p a {
color: #0000EE;
text-decoration: underline;
}
.unavailable-component .text p:first-child {
font-size: 24px;
}
.unavailable-component .text p:not(:first-child) {
font-size: 13px;
}
.article-banner {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
}
.article-banner:before {
content: '';
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5));
background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.5)));
}
.article-banner img.img-banner {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.article-banner .container {
padding-bottom: 420px;
}
.article-banner .container .text-content {
position: absolute;
left: 20px;
right: 20px;
bottom: 2rem;
}
.article-banner .container .text-content .text-content-title {
font-size: 1.75rem;
color: #FFFFFF;
line-height: 1.3;
font-weight: 700;
}
.content-tab {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
background-color: #E1E5EB;
margin-bottom: 0 !important;
}
.content-tab .tab-name-mobile .dropdown .dropdown-toggle {
font-size: 1.2rem;
font-weight: bold;
color: #635296;
position: relative;
width: 100%;
padding: 20px;
background-color: #FAE04A;
border: none;
text-align: left;
}
.content-tab .tab-name-mobile .dropdown .dropdown-toggle:focus {
box-shadow: none !important;
outline: none !important;
}
.content-tab .tab-name-mobile .dropdown .dropdown-toggle:before {
content: " ";
position: absolute;
top: 0;
left: 0;
width: 10px;
height: 100%;
background-color: #635296;
}
.content-tab .tab-name-mobile .dropdown .dropdown-toggle:after {
content: '';
position: absolute;
top: 50%;
right: 5%;
transform: rotate(315deg);
transform-origin: center;
display: block;
height: 1rem;
width: 1rem;
padding: 7px;
margin-top: -0.8rem;
border: 4px solid transparent;
border-color: #1B1C1D;
border-right: 0;
border-top: 0;
border-radius: 2px;
pointer-events: none;
}
.content-tab .tab-name-mobile .dropdown .dropdown-menu {
background-color: #c4c4c4;
transform: translate3d(0px, 69px, 0px) !important;
}
.content-tab .tab-name-mobile .dropdown .dropdown-menu ul {
border: none;
}
.content-tab .tab-name-mobile .dropdown .dropdown-menu ul li {
padding: 0;
}
.content-tab .tab-name-mobile .dropdown .dropdown-menu ul li button {
font-size: 1.1rem;
font-weight: bold;
color: #635296;
position: relative;
padding: 15px 1.2rem;
background-color: transparent;
text-decoration: none;
float: left;
width: 100%;
border: none;
}
.content-tab .tab-name {
border-bottom: 5px solid #FAE04A;
background-color: #ADB1B5;
transition: top 0s ease-in-out;
}
.content-tab .tab-name ul.nav-tabs {
border: none;
}
.content-tab .tab-name ul.nav-tabs .nav-item {
padding: 0;
}
.content-tab .tab-name ul.nav-tabs .nav-item .nav-link {
font-size: 1.1rem;
font-weight: bold;
color: #635296;
position: relative;
padding: 20px 3rem;
background-color: transparent;
text-decoration: none;
border: none;
}
.content-tab .tab-name ul.nav-tabs .nav-item .nav-link:after {
content: '';
position: absolute;
left: 0;
bottom: -5px;
width: 100%;
height: 5px;
background-color: #FAE04A;
}
.content-tab .tab-name ul.nav-tabs .nav-item .nav-link.active {
padding: 20px 1.5rem;
background-color: #FAE04A;
}
.content-tab .tab-name ul.nav-tabs .nav-item .nav-link.active:after {
background-color: #635296;
}
.content-tab .tab-name ul.nav-tabs .nav-item .nav-link:not(.active):hover {
background-color: #00A79B;
color: #635296;
}
.content-tab .tab-name ul.nav-tabs .nav-item .nav-link:not(.active):hover:after {
background-color: #00A79B;
}
.content-tab .tab-name.fixed-top {
position: fixed;
top: 0px;
z-index: 999;
width: 100%;
transition: top 0.1s ease-in-out;
}
.content-tab .tab-content .tab-pane h2.title {
font-size: 1.8rem;
font-weight: 700;
color: #00A79B;
line-height: 1.1;
width: 50%;
margin: 2.5rem auto;
text-align: center;
}
.content-tab .tab-content .tab-pane .item {
padding-top: 2rem;
}
.content-tab .tab-content .tab-pane .item.beige {
background-color: #fcecd5 !important;
}
.content-tab .tab-content .tab-pane .item.light-grey {
background-color: #E1E5EB !important;
}
.content-tab .tab-content .tab-pane .item.grey {
background-color: #f0f0f0 !important;
}
.content-tab .tab-content .tab-pane .item.bg-img {
background: url('https://www.gov.sg/article/~/media/GOV/Microsite/TOTT/Feature/content-box-bg1.png') no-repeat center top;
background-size: 100%;
}
.content-tab .tab-content .tab-pane .item .tott-content-box {
position: relative;
line-height: 1.1;
z-index: 9;
padding: 20px 0;
margin-bottom: 4rem;
}
.content-tab .tab-content .tab-pane .item .tott-content-box::before {
content: '';
position: absolute;
top: 0px;
left: 0px;
z-index: 12;
width: 100%;
height: 100%;
border: 5px solid #FAE04A;
}
.content-tab .tab-content .tab-pane .item .tott-content-box:after {
content: '';
position: absolute;
top: 25px;
left: 25px;
z-index: 11;
width: 100%;
height: 100%;
background-color: #635296;
}
.content-tab .tab-content .tab-pane .item .tott-content-box .text-content-inner {
position: relative;
z-index: 13;
padding: 10px 1rem 10px 2.5rem;
color: #FFFFFF;
margin-left: 25px;
margin-top: 25px;
}
.content-tab .tab-content .tab-pane .item .tott-content-box .text-content-inner .text-content-title {
font-size: 1.7rem;
font-weight: bold;
line-height: 1.1;
color: #FAE04A;
margin-bottom: 30px;
}
.content-tab .tab-content .tab-pane .item .tott-content-box .text-content-inner ul.dot {
list-style-type: none;
margin-top: 0.25em;
margin-left: 2.5rem;
margin-bottom: 20px;
}
.content-tab .tab-content .tab-pane .item .tott-content-box .text-content-inner ul.dot.bullet-yellow li::before {
color: #FAE04A;
}
.content-tab .tab-content .tab-pane .item .tott-content-box .text-content-inner ul.dot.bullet-yellow li a {
color: #FAE04A;
}
.content-tab .tab-content .tab-pane .item .tott-content-box .text-content-inner ul.dot.bullet-green li::before {
color: #1B8210;
}
.content-tab .tab-content .tab-pane .item .tott-content-box .text-content-inner ul.dot.bullet-green li a {
color: #1B8210;
}
.content-tab .tab-content .tab-pane .item .tott-content-box .text-content-inner ul.dot.bullet-blue li::before {
color: #03579f;
}
.content-tab .tab-content .tab-pane .item .tott-content-box .text-content-inner ul.dot.bullet-blue li a {
color: #03579f;
}
.content-tab .tab-content .tab-pane .item .tott-content-box .text-content-inner ul.dot.bullet-pink li::before {
color: #CE3B6A;
}
.content-tab .tab-content .tab-pane .item .tott-content-box .text-content-inner ul.dot.bullet-pink li a {
color: #CE3B6A;
}
.content-tab .tab-content .tab-pane .item .tott-content-box .text-content-inner ul.dot li {
margin-bottom: 5px;
line-height: 1.5;
}
.content-tab .tab-content .tab-pane .item .tott-content-box .text-content-inner ul.dot li::before {
content: "\2022";
display: inline-block;
margin-left: -17px;
width: 1em;
}
.content-tab .tab-content .tab-pane .item .btn-container {
margin-top: 2rem;
margin-bottom: 1.5rem;
}
.content-tab .tab-content .tab-pane .item .btn-container .learn-more {
font-weight: bold;
color: #363E3F;
display: inline-block;
position: relative;
padding: 20px 40px;
background: #FAE04A;
}
.content-tab .tab-content .tab-pane .item .btn-container .learn-more:before {
content: " ";
position: absolute;
top: 50%;
left: 20px;
width: 0;
height: 0;
margin-top: -10px;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-left: 10px solid #363E3F;
}
.content-tab .tab-content .tab-pane .item .btn-container .learn-more:hover {
opacity: 0.8;
text-decoration: underline;
}
.content-tab .tab-content .tab-pane .item .item-2-row:first-child .tott-content-box {
margin-right: 5%;
}
.content-tab .tab-content .tab-pane .item .item-2-row:last-child .tott-content-box {
margin-left: 5%;
}
.carousel-container {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
background-color: #FADC00;
padding-top: 1rem;
padding-bottom: 2rem;
}
.carousel-container .carousel-title {
font-size: 1.7rem;
font-weight: bold;
line-height: 1.1;
color: #2200B3;
margin-top: 1rem;
padding: 10px 0;
text-align: center;
}
.which-profile {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
padding-top: 1rem;
padding-bottom: 3rem;
margin-top: 0;
background-color: #434DA6;
}
.which-profile .which-profile-title {
font-size: 1.7rem;
font-weight: bold;
line-height: 1.1;
color: #22ABA6;
margin-top: 1rem;
padding: 10px 0;
text-align: center;
}
.which-profile .which-profile-list-mobile {
margin-top: 10px;
}
.which-profile .which-profile-list-mobile .item {
display: flex;
align-items: center;
}
.which-profile .which-profile-list-mobile .item:not(:last-child) {
margin-bottom: 20px;
}
.which-profile .which-profile-list-mobile .item:hover {
opacity: 0.8;
}
.which-profile .which-profile-list-mobile .item .item-title {
position: relative;
top: -10px;
left: 0;
width: 75%;
padding-left: 2.5rem;
}
.which-profile .which-profile-list-mobile .item .item-title:before {
content: '';
position: absolute;
top: 50%;
left: -10px;
transform: rotate(225deg);
transform-origin: center;
border: 5px solid transparent;
border-color: #F8DB02;
border-right: 0;
border-top: 0;
border-radius: 2px;
display: block;
height: 1.5rem;
width: 1.5rem;
margin-top: -0.7375em;
pointer-events: none;
}
.which-profile .which-profile-list-mobile .item .item-title span.title {
font-size: 1.4rem;
font-weight: 700;
color: #F8DB02;
line-height: 1;
display: block;
margin-top: 0;
}
.which-profile .which-profile-list-mobile .item .img-block {
width: 25%;
margin-left: 15px;
}
.which-profile .which-profile-list {
display: flex;
align-items: center;
justify-content: center;
}
.which-profile .which-profile-list .item {
flex-basis: 0;
flex-grow: 1;
flex-shrink: 1;
padding: 10px;
}
.which-profile .which-profile-list .item .img-block {
position: relative;
z-index: 10;
}
.which-profile .which-profile-list .item .img-block img {
width: 100%;
height: auto;
}
.article-nav {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
padding: 1.5rem 0 3rem;
background-color: #fcecd5;
}
.article-nav .read-ahead {
margin-bottom: 0;
}
.article-nav .read-ahead h4.title {
border: none;
}
.article-nav .read-ahead .item {
flex-basis: calc(50% - 10px);
padding: 20px;
border-top: 0.25rem solid #d81800;
background: #FFFFFF;
}
.article-nav .read-ahead .item:first-child {
background: #FFFFFF;
margin-bottom: 0;
}
.video-content {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
text-align: center;
}
.video-content .title {
font-size: 1.7rem;
font-weight: bold;
color: #22ABA6;
line-height: 1.1;
margin: 1rem 0 1.5rem;
}
.video-content .description {
margin-bottom: 1.5rem;
}
.video-content .item .video-holder {
padding: 20px 0 25px;
}
.video-content .item .video-holder.left .video-container:before {
content: '';
position: absolute;
top: -20px;
left: -20px;
width: 90%;
height: 100%;
background: #FE512B;
}
.video-content .item .video-holder.right .video-container:before {
content: '';
position: absolute;
top: -20px;
right: -20px;
width: 90%;
height: 100%;
background: #FB75AC;
}
.video-content .item .video-holder .video-container .video {
position: relative;
padding-bottom: 56.25%;
margin-bottom: 1em;
}
.video-content .item .video-holder .video-container .video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.video-content .item .video-holder p {
margin-left: -20px;
}
.video-content .item .video-holder a {
text-decoration: underline;
}
.infographics {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
margin: 1rem 0 1.5rem;
}
.infographics h3 {
font-weight: 600;
font-size: 1.25rem;
margin-bottom: 0.5714em;
text-decoration: underline;
}
.infographics table {
width: unset;
max-width: 100%;
margin: 0 0 auto;
display: table;
text-align: center;
}
.infographics table tbody {
background-color: #f0f0f0;
}
.infographics table tr td,
.infographics table tr th {
border: 1px solid #dadada;
padding: 0.5em 0.75em;
vertical-align: top;
}
.infographics table tr td img,
.infographics table tr th img {
max-width: 100%;
height: auto;
}
.infographics table tr td a,
.infographics table tr th a {
color: #D81800;
}
.img-transparent-bg {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
}
.img-transparent-bg .img-block {
max-width: 50%;
margin-left: auto;
margin-right: auto;
}
.img-with-bg {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
margin-top: 3rem;
margin-bottom: 2rem;
}
.img-with-bg .img-block {
margin-left: auto;
margin-right: auto;
width: 50%;
min-width: 320px;
max-width: 900px;
}
.img-with-bg .img-block img {
max-width: 100%;
height: auto;
}
.article-stories,
.article-with-dropdown {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
}
.article-stories .item img,
.article-with-dropdown .item img {
width: 100%;
height: auto;
display: block;
}
.article-stories .item h4,
.article-with-dropdown .item h4 {
font-weight: 700;
font-size: 1em;
margin-top: 4px;
margin-bottom: 10px;
}
.article-stories .item .read-more-link,
.article-with-dropdown .item .read-more-link {
margin-bottom: 32px;
}
.article-stories .item .read-more-link a,
.article-with-dropdown .item .read-more-link a {
font-weight: 700;
color: #D81800;
}
.article-stories .item .read-more-link .icon-book:before,
.article-with-dropdown .item .read-more-link .icon-book:before {
content: "";
position: relative;
margin-right: 10px;
display: inline-block;
width: 23px;
height: 31px;
background: url('../media/img/book.png') no-repeat center left;
background-size: contain;
vertical-align: middle;
}
.article-with-dropdown {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
}
.article-with-dropdown .item.is-expanded .expanding-item-inner:after {
content: "";
opacity: 1;
display: block;
height: 0;
width: 0;
position: absolute;
bottom: -30px;
left: calc(50% - 15px);
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-bottom: 15px solid #eee;
}
.article-with-dropdown .item.is-expanded .expanding-item-inner .text-block .detail-wrapper__state::before {
content: "\e912";
}
.article-with-dropdown .item.is-expanded .expanding-item-expander {
max-height: none;
min-height: 200px;
overflow: visible;
margin-top: 30px;
opacity: 1;
}
.article-with-dropdown .item .expanding-item-inner {
width: 100%;
position: relative;
background-color: #fff;
transition: all 0.2s ease-in-out;
cursor: pointer;
}
.article-with-dropdown .item .expanding-item-inner .text-block {
padding: 20px;
display: flex;
justify-content: space-between;
align-items: flex-start;
}
.article-with-dropdown .item .expanding-item-inner .text-block .detail-wrapper__content {
padding-right: 20px;
}
.article-with-dropdown .item .expanding-item-inner .text-block .detail-wrapper__content .detail-wrapper__title {
font-size: 1.125rem;
font-weight: 800;
}
.article-with-dropdown .item .expanding-item-inner .text-block .detail-wrapper__content .detail-wrapper__text {
font-size: 0.875rem;
margin-top: 5px;
}
.article-with-dropdown .item .expanding-item-inner .text-block .detail-wrapper__state {
speak: none;
font-style: normal;
font-weight: 400;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 1.5rem;
font-family: icomoon!important;
color: #d81800;
}
.article-with-dropdown .item .expanding-item-inner .text-block .detail-wrapper__state:before {
content: "\e915";
}
.article-with-dropdown .item .expanding-item-expander {
display: flex;
align-items: center;
position: relative;
transition: all 0.2s ease-in-out;
background-color: #eee;
max-height: 0;
min-height: 0;
overflow: hidden;
margin-top: 0;
opacity: 0;
}
.article-with-dropdown .item .expanding-item-expander .desc-wrapper-content {
padding: 20px 0;
margin-left: -10px;
margin-right: -10px;
}
.article-with-dropdown .item .expanding-item-expander .desc-wrapper-content .desc-wrapper-text p {
margin-bottom: 1em;
}
.related-article-new-layout {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
}
.related-article-new-layout .item {
padding: 0 15px;
}
.divider-block {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
margin: 1rem 0 80px;
}
.divider-block .divider {
max-width: 300px;
margin: 0 auto;
background: url('https://www.gov.sg/~/media/campaign/jobs-economy/images/divider.png') no-repeat center center;
background-size: cover;
height: 10px;
color: #f0f0f0;
border: 0;
}
.filter-job {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
margin: 1rem 0 80px;
}
.filter-job .bg-button__item {
height: 100%;
display: flex;
position: relative;
margin: 0;
text-decoration: none;
}
.filter-job .bg-button__item .bg-button__overlay-left:before {
content: "";
position: absolute;
width: 50%;
bottom: 0;
height: 50%;
background: #ffc200;
z-index: 1;
}
.filter-job .bg-button__item .bg-button__overlay-left:after {
content: "";
position: absolute;
width: 50%;
top: 0;
left: 0;
height: 50%;
background: #ff5955;
z-index: 1;
}
.filter-job .bg-button__item .bg-button__overlay-right:before {
content: "";
position: absolute;
width: 50%;
bottom: 0;
right: 0;
height: 50%;
background: #b940ff;
z-index: 1;
}
.filter-job .bg-button__item .bg-button__overlay-right:after {
content: "";
position: absolute;
width: 50%;
top: 0;
right: 0;
height: 50%;
background: #05dbc1;
z-index: 1;
}
.filter-job .bg-button__item .filter-box {
width: 100%;
z-index: 2;
padding: 40px 0;
background-color: #000;
border-radius: 300px;
}
.filter-job .bg-button__item .filter-box .filter-box-content {
max-width: 800px;
margin: 0 auto;
padding: 0 45px;
text-align: center;
}
.filter-job .bg-button__item .filter-box .filter-box-content .filter-box-content-area {
margin-bottom: 45px;
}
.filter-job .bg-button__item .filter-box .filter-box-content .filter-box-content-area .filter-box-title {
font-family: AvenirNextLTW01-Heavy;
font-size: 30px;
color: #ffc200;
letter-spacing: 1px;
display: block;
margin-bottom: 40px;
text-transform: uppercase;
}
.filter-job .bg-button__item .filter-box .filter-box-content .filter-box-content-area .dropdown {
max-width: 470px;
margin: 0 auto;
}
.filter-job .bg-button__item .filter-box .filter-box-content .filter-box-content-area .dropdown .dropdown-toggle {
font-weight: 600;
font-size: 1rem;
line-height: 1.4rem;
color: #333333;
width: 100%;
height: auto;
position: relative;
padding: 0.5rem 2.5rem 0.5rem 10px;
border: 1px solid rgba(0, 0, 0, 0.1);
background-color: #FFFFFF;
box-shadow: none;
text-align: left;
text-overflow: ellipsis;
white-space: nowrap;
text-transform: uppercase;
}
.filter-job .bg-button__item .filter-box .filter-box-content .filter-box-content-area .dropdown .dropdown-toggle span.chevron-down {
position: absolute;
top: 50%;
right: 18px;
transform: translateY(-75%) rotate(-45deg);
width: 10px;
height: 10px;
border-left: 2px solid #000;
border-bottom: 2px solid #000;
}
.filter-job .bg-button__item .filter-box .filter-box-content .filter-box-content-area .dropdown .dropdown-menu {
width: 100%;
transform: translate3d(0px, 40px, 0px) !important;
padding-bottom: 0.5rem;
padding-top: 0.5rem;
max-height: 200px;
overflow: auto;
text-align: center;
}
.filter-job .bg-button__item .filter-box .filter-box-content .filter-box-content-area .dropdown .dropdown-menu .dropdown-item {
font-weight: 600;
padding: 10px 20px;
border-bottom: 1px solid #f0f0f0;
background: none;
white-space: normal;
text-transform: uppercase;
}
.filter-job .bg-button__item .filter-box .filter-box-content .filter-box-content-area .dropdown .dropdown-menu .dropdown-item:hover {
text-decoration: underline ;
}
.filter-job .bg-button__item .filter-box .filter-box-content .filter-box-content-area .dropdown .dropdown-menu .dropdown-item.active {
color: #ffc200;
}
.filter-job .bg-button__item .filter-box .filter-box-content .filter-box-content-btn a {
font-family: AvenirNextCondensed-Heavy;
font-size: 26px;
font-weight: 700;
color: #000;
position: relative;
padding: 10px 40px 10px 20px;
background-color: #ffc200;
text-transform: uppercase;
cursor: pointer;
text-decoration: none;
}
.filter-job .bg-button__item .filter-box .filter-box-content .filter-box-content-btn a:after {
content: "";
position: absolute;
right: 0px;
top: 50%;
transform: translateY(-50%);
z-index: 5;
border: 15px solid transparent;
border-left-color: #000;
}
.journey-job {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
}
.journey-job .journey-job-list {
font-family: AvenirNextLTW01-Heavy;
color: #000;
margin: 0 -25px;
}
.journey-job .journey-job-list .item {
padding: 25px;
height: 100%;
}
.journey-job .journey-job-list .item.color-theme-1 .text-content {
border: 10px solid #00ec5c;
}
.journey-job .journey-job-list .item.color-theme-1 .text-content .journey-job-status-top {
background: #00ec5c;
}
.journey-job .journey-job-list .item.color-theme-1 .text-content .journey-job-status-middle .dropdown .dropdown-toggle {
border: 1px solid #00ec5c;
}
.journey-job .journey-job-list .item.color-theme-1 .text-content .journey-job-status-middle .dropdown .dropdown-toggle .chevron-down {
border-left: 2px solid #00ec5c;
border-bottom: 2px solid #00ec5c;
}
.journey-job .journey-job-list .item.color-theme-1 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link.active,
.journey-job .journey-job-list .item.color-theme-1 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link:hover {
color: #00ec5c;
}
.journey-job .journey-job-list .item.color-theme-1 .text-content .journey-job-status-middle .tab-content .tab-pane .journey-job-status-title {
color: #00ec5c;
}
.journey-job .journey-job-list .item.color-theme-1 .text-content .journey-job-status-bottom:hover {
color: #00ec5c;
}
.journey-job .journey-job-list .item.color-theme-1 .text-content .journey-job-status-bottom .journey-job-status-bottom-icon-link .btn-decor-list .btn-decor::after {
border-left-color: #00ec5c;
}
.journey-job .journey-job-list .item.color-theme-2 .text-content {
border: 10px solid #ff5955;
}
.journey-job .journey-job-list .item.color-theme-2 .text-content .journey-job-status-top {
background: #ff5955;
}
.journey-job .journey-job-list .item.color-theme-2 .text-content .journey-job-status-middle .dropdown .dropdown-toggle {
border: 1px solid #ff5955;
}
.journey-job .journey-job-list .item.color-theme-2 .text-content .journey-job-status-middle .dropdown .dropdown-toggle .chevron-down {
border-left: 2px solid #ff5955;
border-bottom: 2px solid #ff5955;
}
.journey-job .journey-job-list .item.color-theme-2 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link.active,
.journey-job .journey-job-list .item.color-theme-2 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link:hover {
color: #ff5955;
}
.journey-job .journey-job-list .item.color-theme-2 .text-content .journey-job-status-middle .tab-content .tab-pane .journey-job-status-title {
color: #ff5955;
}
.journey-job .journey-job-list .item.color-theme-2 .text-content .journey-job-status-bottom:hover {
color: #ff5955;
}
.journey-job .journey-job-list .item.color-theme-2 .text-content .journey-job-status-bottom .journey-job-status-bottom-icon-link .btn-decor-list .btn-decor::after {
border-left-color: #ff5955;
}
.journey-job .journey-job-list .item.color-theme-3 .text-content {
border: 10px solid #05dbc1;
}
.journey-job .journey-job-list .item.color-theme-3 .text-content .journey-job-status-top {
background: #05dbc1;
}
.journey-job .journey-job-list .item.color-theme-3 .text-content .journey-job-status-middle .dropdown .dropdown-toggle {
border: 1px solid #05dbc1;
}
.journey-job .journey-job-list .item.color-theme-3 .text-content .journey-job-status-middle .dropdown .dropdown-toggle .chevron-down {
border-left: 2px solid #05dbc1;
border-bottom: 2px solid #05dbc1;
}
.journey-job .journey-job-list .item.color-theme-3 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link.active,
.journey-job .journey-job-list .item.color-theme-3 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link:hover {
color: #05dbc1;
}
.journey-job .journey-job-list .item.color-theme-3 .text-content .journey-job-status-middle .tab-content .tab-pane .journey-job-status-title {
color: #05dbc1;
}
.journey-job .journey-job-list .item.color-theme-3 .text-content .journey-job-status-bottom:hover {
color: #05dbc1;
}
.journey-job .journey-job-list .item.color-theme-3 .text-content .journey-job-status-bottom .journey-job-status-bottom-icon-link .btn-decor-list .btn-decor::after {
border-left-color: #05dbc1;
}
.journey-job .journey-job-list .item.color-theme-4 .text-content {
border: 10px solid #b940ff;
}
.journey-job .journey-job-list .item.color-theme-4 .text-content .journey-job-status-top {
background: #b940ff;
}
.journey-job .journey-job-list .item.color-theme-4 .text-content .journey-job-status-middle .dropdown .dropdown-toggle {
border: 1px solid #b940ff;
}
.journey-job .journey-job-list .item.color-theme-4 .text-content .journey-job-status-middle .dropdown .dropdown-toggle .chevron-down {
border-left: 2px solid #b940ff;
border-bottom: 2px solid #b940ff;
}
.journey-job .journey-job-list .item.color-theme-4 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link.active,
.journey-job .journey-job-list .item.color-theme-4 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link:hover {
color: #b940ff;
}
.journey-job .journey-job-list .item.color-theme-4 .text-content .journey-job-status-middle .tab-content .tab-pane .journey-job-status-title {
color: #b940ff;
}
.journey-job .journey-job-list .item.color-theme-4 .text-content .journey-job-status-bottom:hover {
color: #b940ff;
}
.journey-job .journey-job-list .item.color-theme-4 .text-content .journey-job-status-bottom .journey-job-status-bottom-icon-link .btn-decor-list .btn-decor::after {
border-left-color: #b940ff;
}
.journey-job .journey-job-list .item.color-theme-5 .text-content {
border: 10px solid #ffc200;
}
.journey-job .journey-job-list .item.color-theme-5 .text-content .journey-job-status-top {
background: #ffc200;
}
.journey-job .journey-job-list .item.color-theme-5 .text-content .journey-job-status-middle .dropdown .dropdown-toggle {
border: 1px solid #ffc200;
}
.journey-job .journey-job-list .item.color-theme-5 .text-content .journey-job-status-middle .dropdown .dropdown-toggle .chevron-down {
border-left: 2px solid #ffc200;
border-bottom: 2px solid #ffc200;
}
.journey-job .journey-job-list .item.color-theme-5 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link.active,
.journey-job .journey-job-list .item.color-theme-5 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link:hover {
color: #ffc200;
}
.journey-job .journey-job-list .item.color-theme-5 .text-content .journey-job-status-middle .tab-content .tab-pane .journey-job-status-title {
color: #ffc200;
}
.journey-job .journey-job-list .item.color-theme-5 .text-content .journey-job-status-bottom:hover {
color: #ffc200;
}
.journey-job .journey-job-list .item.color-theme-5 .text-content .journey-job-status-bottom .journey-job-status-bottom-icon-link .btn-decor-list .btn-decor::after {
border-left-color: #ffc200;
}
.journey-job .journey-job-list .item.color-theme-7 .text-content {
border: 10px solid #00b9ca;
}
.journey-job .journey-job-list .item.color-theme-7 .text-content .journey-job-status-top {
background: #00b9ca;
}
.journey-job .journey-job-list .item.color-theme-7 .text-content .journey-job-status-middle .dropdown .dropdown-toggle {
border: 1px solid #00b9ca;
}
.journey-job .journey-job-list .item.color-theme-7 .text-content .journey-job-status-middle .dropdown .dropdown-toggle .chevron-down {
border-left: 2px solid #00b9ca;
border-bottom: 2px solid #00b9ca;
}
.journey-job .journey-job-list .item.color-theme-7 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link.active,
.journey-job .journey-job-list .item.color-theme-7 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link:hover {
color: #00b9ca;
}
.journey-job .journey-job-list .item.color-theme-7 .text-content .journey-job-status-middle .tab-content .tab-pane .journey-job-status-title {
color: #00b9ca;
}
.journey-job .journey-job-list .item.color-theme-7 .text-content .journey-job-status-bottom:hover {
color: #00b9ca;
}
.journey-job .journey-job-list .item.color-theme-7 .text-content .journey-job-status-bottom .journey-job-status-bottom-icon-link .btn-decor-list .btn-decor::after {
border-left-color: #00b9ca;
}
.journey-job .journey-job-list .item.color-theme-8 .text-content {
border: 10px solid #4487c7;
}
.journey-job .journey-job-list .item.color-theme-8 .text-content .journey-job-status-top {
background: #4487c7;
}
.journey-job .journey-job-list .item.color-theme-8 .text-content .journey-job-status-middle .dropdown .dropdown-toggle {
border: 1px solid #4487c7;
}
.journey-job .journey-job-list .item.color-theme-8 .text-content .journey-job-status-middle .dropdown .dropdown-toggle .chevron-down {
border-left: 2px solid #4487c7;
border-bottom: 2px solid #4487c7;
}
.journey-job .journey-job-list .item.color-theme-8 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link.active,
.journey-job .journey-job-list .item.color-theme-8 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link:hover {
color: #4487c7;
}
.journey-job .journey-job-list .item.color-theme-8 .text-content .journey-job-status-middle .tab-content .tab-pane .journey-job-status-title {
color: #4487c7;
}
.journey-job .journey-job-list .item.color-theme-8 .text-content .journey-job-status-bottom:hover {
color: #4487c7;
}
.journey-job .journey-job-list .item.color-theme-8 .text-content .journey-job-status-bottom .journey-job-status-bottom-icon-link .btn-decor-list .btn-decor::after {
border-left-color: #4487c7;
}
.journey-job .journey-job-list .item.color-theme-9 .text-content {
border: 10px solid #ff8700;
}
.journey-job .journey-job-list .item.color-theme-9 .text-content .journey-job-status-top {
background: #ff8700;
}
.journey-job .journey-job-list .item.color-theme-9 .text-content .journey-job-status-middle .dropdown .dropdown-toggle {
border: 1px solid #ff8700;
}
.journey-job .journey-job-list .item.color-theme-9 .text-content .journey-job-status-middle .dropdown .dropdown-toggle .chevron-down {
border-left: 2px solid #ff8700;
border-bottom: 2px solid #ff8700;
}
.journey-job .journey-job-list .item.color-theme-9 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link.active,
.journey-job .journey-job-list .item.color-theme-9 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link:hover {
color: #ff8700;
}
.journey-job .journey-job-list .item.color-theme-9 .text-content .journey-job-status-middle .tab-content .tab-pane .journey-job-status-title {
color: #ff8700;
}
.journey-job .journey-job-list .item.color-theme-9 .text-content .journey-job-status-bottom:hover {
color: #ff8700;
}
.journey-job .journey-job-list .item.color-theme-9 .text-content .journey-job-status-bottom .journey-job-status-bottom-icon-link .btn-decor-list .btn-decor::after {
border-left-color: #ff8700;
}
.journey-job .journey-job-list .item.color-theme-10 .text-content {
border: 10px solid #a13693;
}
.journey-job .journey-job-list .item.color-theme-10 .text-content .journey-job-status-top {
background: #a13693;
}
.journey-job .journey-job-list .item.color-theme-10 .text-content .journey-job-status-middle .dropdown .dropdown-toggle {
border: 1px solid #a13693;
}
.journey-job .journey-job-list .item.color-theme-10 .text-content .journey-job-status-middle .dropdown .dropdown-toggle .chevron-down {
border-left: 2px solid #a13693;
border-bottom: 2px solid #a13693;
}
.journey-job .journey-job-list .item.color-theme-10 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link.active,
.journey-job .journey-job-list .item.color-theme-10 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link:hover {
color: #a13693;
}
.journey-job .journey-job-list .item.color-theme-10 .text-content .journey-job-status-middle .tab-content .tab-pane .journey-job-status-title {
color: #a13693;
}
.journey-job .journey-job-list .item.color-theme-10 .text-content .journey-job-status-bottom:hover {
color: #a13693;
}
.journey-job .journey-job-list .item.color-theme-10 .text-content .journey-job-status-bottom .journey-job-status-bottom-icon-link .btn-decor-list .btn-decor::after {
border-left-color: #a13693;
}
.journey-job .journey-job-list .item.color-theme-11 .text-content {
border: 10px solid #60b846;
}
.journey-job .journey-job-list .item.color-theme-11 .text-content .journey-job-status-top {
background: #60b846;
}
.journey-job .journey-job-list .item.color-theme-11 .text-content .journey-job-status-middle .dropdown .dropdown-toggle {
border: 1px solid #60b846;
}
.journey-job .journey-job-list .item.color-theme-11 .text-content .journey-job-status-middle .dropdown .dropdown-toggle .chevron-down {
border-left: 2px solid #60b846;
border-bottom: 2px solid #60b846;
}
.journey-job .journey-job-list .item.color-theme-11 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link.active,
.journey-job .journey-job-list .item.color-theme-11 .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link:hover {
color: #60b846;
}
.journey-job .journey-job-list .item.color-theme-11 .text-content .journey-job-status-middle .tab-content .tab-pane .journey-job-status-title {
color: #60b846;
}
.journey-job .journey-job-list .item.color-theme-11 .text-content .journey-job-status-bottom:hover {
color: #60b846;
}
.journey-job .journey-job-list .item.color-theme-11 .text-content .journey-job-status-bottom .journey-job-status-bottom-icon-link .btn-decor-list .btn-decor::after {
border-left-color: #60b846;
}
.journey-job .journey-job-list .item .text-content {
padding: 40px 30px;
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-top {
font-family: AvenirNextLTW01-Heavy;
font-weight: 700;
line-height: 1.2;
min-height: 4em;
display: flex;
justify-content: center;
align-items: center;
flex: 0 0 auto;
padding: 8px 20px;
margin: -40px 0px 0;
border-radius: 0 0 40px 40px;
text-transform: uppercase;
text-align: center;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-middle {
margin-top: 50px;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-middle .dropdown .dropdown-toggle {
color: #333333;
line-height: 1.4rem;
width: 100%;
height: auto;
padding: 0.5rem 2.5rem 0.5rem 20px;
box-shadow: none;
text-align: left;
overflow: hidden;
position: relative;
display: flex;
align-items: center;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-middle .dropdown .dropdown-toggle span:first-of-type {
overflow: hidden;
text-overflow: ellipsis;
max-width: 100%;
display: inline-block;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-middle .dropdown .dropdown-toggle .chevron-down {
position: absolute;
top: 50%;
right: 18px;
transform: translateY(-75%) rotate(-45deg);
width: 10px;
height: 10px;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-middle .dropdown .dropdown-menu {
width: 100%;
padding: 0;
transform: translate3d(0px, 40px, 0px) !important;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs {
flex-direction: column;
align-items: flex-start;
border: none;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item {
width: 100%;
padding: 10px 20px 10px 1.5rem;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item:not(:last-child) {
border-bottom: 1px solid #f0f0f0;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-middle .dropdown .dropdown-menu ul.nav-tabs .nav-item .nav-link {
color: #333333;
width: 100%;
padding: 0;
border: none;
background: none;
justify-content: flex-start;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-middle .tab-content {
padding-top: 40px;
padding-bottom: 40px;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-middle .tab-content .tab-pane .journey-job-status-title {
font-family: AvenirNextCondensed-Heavy;
font-weight: 700;
font-size: 24px;
color: #00ec5c;
line-height: 1.2;
padding-bottom: 25px;
text-transform: capitalize;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-middle .tab-content .tab-pane .journey-job-status-desc {
font-family: Open Sans, sans-serif;
color: #000;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-bottom {
font-family: AvenirNextCondensed-Heavy;
font-weight: 700;
font-size: 20px;
color: #000;
line-height: 1.2;
text-transform: uppercase;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-bottom span,
.journey-job .journey-job-list .item .text-content .journey-job-status-bottom a {
font-family: AvenirNextCondensed-Heavy;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-bottom:hover {
color: #00ec5c;
text-decoration: none;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-bottom .journey-job-status-bottom-icon-link {
position: relative;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-bottom .journey-job-status-bottom-icon-link .btn-decor-list {
display: inline-block;
margin-left: 20px;
white-space: nowrap;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-bottom .journey-job-status-bottom-icon-link .btn-decor-list .btn-decor {
position: relative;
margin-left: 15px;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-bottom .journey-job-status-bottom-icon-link .btn-decor-list .btn-decor::after {
content: "";
position: absolute;
right: 5px;
top: 50%;
transform: translateY(-50%);
z-index: 5;
border: 10px solid transparent;
}
.text-img-2-column {
margin-top: 1rem;
margin-bottom: 2rem;
}
.text-img-2-column.beige {
background-color: #fcecd5 !important;
}
.text-img-2-column.light-grey {
background-color: #E1E5EB !important;
}
.text-img-2-column.grey {
background-color: #f0f0f0 !important;
}
.text-img-2-column .item {
padding-top: 10px;
padding-bottom: 10px;
}
.text-img-2-column .item h4 {
font-weight: 700;
font-size: 1.125rem;
color: #1B8210;
margin-bottom: 0.72727273em;
}
.text-img-2-column .item h4:not(:first-child) {
margin-top: 1.45454545em;
}
.text-img-2-column .item h4.color-green {
color: #1B8210;
}
.text-img-2-column .item h4.color-blue {
color: #03579f;
}
.text-img-2-column .item h4.color-pink {
color: #CE3B6A;
}
.text-img-2-column .item ul {
margin-top: 0.5rem;
margin-left: 1.3em;
list-style-type: none;
}
.text-img-2-column .item ul:not(:last-child) {
margin-bottom: 1em;
}
.text-img-2-column .item ul.bullet-green li::before {
color: #1B8210;
}
.text-img-2-column .item ul.bullet-green li a {
color: #1B8210;
}
.text-img-2-column .item ul.bullet-green-thin li::before {
color: #7ed075;
}
.text-img-2-column .item ul.bullet-green-thin li a {
color: #1B8210;
}
.text-img-2-column .item ul.bullet-blue li::before {
color: #03579f;
}
.text-img-2-column .item ul.bullet-blue li a {
color: #03579f;
}
.text-img-2-column .item ul.bullet-blue-thin li::before {
color: #6298c7;
}
.text-img-2-column .item ul.bullet-blue-thin li a {
color: #03579f;
}
.text-img-2-column .item ul.bullet-pink li::before {
color: #CE3B6A;
}
.text-img-2-column .item ul.bullet-pink li a {
color: #CE3B6A;
}
.text-img-2-column .item ul.bullet-pink-thin li::before {
color: #ff9fc6;
}
.text-img-2-column .item ul.bullet-pink-thin li a {
color: #CE3B6A;
}
.text-img-2-column .item ul li {
margin-bottom: 0.5rem;
}
.text-img-2-column .item ul li::before {
content: "•";
padding-right: 0.5rem;
margin-left: -1rem;
display: inline-block;
text-align: center;
transform: scale(1.8);
}
.text-img-2-column .item ul li:last-child {
margin-bottom: 24px;
}
.text-img-2-column .item ul li a {
text-decoration: underline;
}
.text-img-2-column .item .img-block img {
max-width: 100%;
height: auto;
}
.content-two-column .sfContentBlock ul {
margin-top: 0.5rem;
margin-left: 1.3em;
list-style-type: none;
}
.content-two-column .sfContentBlock ul:not(:last-child) {
margin-bottom: 1em;
}
.content-two-column .sfContentBlock ul.bullet-green li::before {
color: #1B8210;
}
.content-two-column .sfContentBlock ul.bullet-green li a {
color: #1B8210;
}
.content-two-column .sfContentBlock ul.bullet-green-thin li::before {
color: #7ed075;
}
.content-two-column .sfContentBlock ul.bullet-green-thin li a {
color: #1B8210;
}
.content-two-column .sfContentBlock ul.bullet-blue li::before {
color: #03579f;
}
.content-two-column .sfContentBlock ul.bullet-blue li a {
color: #03579f;
}
.content-two-column .sfContentBlock ul.bullet-blue-thin li::before {
color: #6298c7;
}
.content-two-column .sfContentBlock ul.bullet-blue-thin li a {
color: #03579f;
}
.content-two-column .sfContentBlock ul.bullet-pink li::before {
color: #CE3B6A;
}
.content-two-column .sfContentBlock ul.bullet-pink li a {
color: #CE3B6A;
}
.content-two-column .sfContentBlock ul.bullet-pink-thin li::before {
color: #ff9fc6;
}
.content-two-column .sfContentBlock ul.bullet-pink-thin li a {
color: #CE3B6A;
}
.content-two-column .sfContentBlock ul li {
margin-bottom: 0.5rem;
}
.content-two-column .sfContentBlock ul li::before {
content: "•";
padding-right: 0.5rem;
margin-left: -1rem;
display: inline-block;
text-align: center;
transform: scale(1.8);
}
.content-two-column .sfContentBlock ul li:last-child {
margin-bottom: 24px;
}
.content-two-column .sfContentBlock ul li a {
text-decoration: underline;
}
.career-centres-new {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
}
.related-post-new {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
margin: 1rem 0 2rem;
}
.related-post-new .detail-post-title {
border-top: 0.25rem solid #d81800;
}
.related-post-new h5 {
margin-bottom: 2rem;
}
.related-post-new .list-article {
margin: 0 -15px;
}
.related-post-new .item {
padding: 0 15px;
}
.related-post-new .item .post-child:hover .post-img-container:after {
content: '';
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
opacity: 0.5;
background: linear-gradient(125deg, #f97794, #623aa2);
}
.discover-new-opportunities-button .row {
margin-right: -15px;
margin-left: -15px;
}
.discover-new-opportunities-button .row [class*='col-'] {
padding-left: 15px;
padding-right: 15px;
}
.discover-new-opportunities-button .filter-box .bg-button__title {
font-family: AvenirNextCondensed-Heavy;
font-size: 24px;
font-weight: 700;
color: #fff;
line-height: 1;
text-transform: uppercase;
margin-bottom: 3px;
letter-spacing: 2px;
}
.discover-new-opportunities-button .filter-box .bg-button__sub-title {
font-family: AvenirNextCondensed-Heavy;
font-size: 40px;
font-weight: 700;
color: #ffc200;
line-height: 1;
text-transform: uppercase;
letter-spacing: 2px;
}
.discover-new-opportunities-button .filter-box .bg-button__text-content {
font-family: AvenirNextCondensed-Heavy;
font-size: 24px;
font-weight: 700;
color: #fff;
line-height: 1;
text-transform: uppercase;
letter-spacing: 2px;
}
.discover-new-opportunities-button .filter-box .bg-button-link span {
display: block;
}
.infographics-2-column {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
margin-top: 1rem;
margin-bottom: 2rem;
}
.infographics-2-column .item {
margin-bottom: 30px;
}
.infographics-2-column .item .row {
margin-right: -15px;
margin-left: -15px;
}
.infographics-2-column .item .row [class*='col-'] {
padding-right: 15px;
padding-left: 15px;
}
.infographics-2-column .item .info-img {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
padding-bottom: 100%;
background-color: #eee;
position: relative;
}
.infographics-2-column .item .info-img img {
height: 100%;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}
.infographics-2-column .item .text-content h6 {
font-size: 14px;
font-weight: 700;
margin-bottom: 20px;
}
.infographics-2-column .item .text-content a {
color: #D81800;
}
@media screen and (max-width: 767px) {
.content-tab .tab-content .tab-pane h2.title {
width: 100%;
margin-top: 1rem;
margin-bottom: 1rem;
}
.content-tab .tab-content .tab-pane .item .tott-content-box {
padding: 10px 0;
margin-right: 15px;
}
.content-tab .tab-content .tab-pane .item .tott-content-box::after {
left: 15px;
top: 15px;
}
.content-tab .tab-content .tab-pane .item .tott-content-box .text-content-inner {
padding: 10px;
}
.content-tab .tab-content .tab-pane .item .btn-container {
text-align: center;
}
.article-with-dropdown .item .expanding-item-inner {
padding: 20px 0 0;
}
.article-with-dropdown .item .expanding-item-inner .text-block .detail-wrapper__content {
padding-right: 0;
}
.article-with-dropdown .item .expanding-item-expander {
width: calc(100% + 40px);
margin-left: -20px;
margin-right: -20px;
}
.video-content .item .video-holder.left {
padding-left: 20px;
}
.video-content .item .video-holder.right {
padding-right: 20px;
}
.img-transparent-bg {
margin-top: 3rem;
margin-bottom: 2rem;
}
.img-transparent-bg .img-block {
min-width: 320px;
max-width: 900px;
}
.divider-block {
margin-bottom: 48px;
}
.filter-job {
margin-bottom: 48px;
}
.filter-job .bg-button__item .filter-box {
border-radius: 100px;
}
.filter-job .bg-button__item .filter-box .filter-box-content {
padding: 0 33px;
}
.filter-job .bg-button__item .filter-box .filter-box-content .filter-box-content-area .filter-box-title {
font-size: 24px;
line-height: 1;
}
.journey-job .journey-job-list .item .text-content .journey-job-status-top {
font-size: calc(17.09091px + 0.90909vw);
}
.growth-sectors.growth-sectors-listing .item {
margin-bottom: 15px;
}
.related-post-new .item {
margin-bottom: 2rem;
}
}
@media screen and (min-width: 768px) {
.article-stories .item,
.article-with-dropdown .item {
padding: 15px;
}
.article-stories .item h4,
.article-with-dropdown .item h4 {
font-weight: 700;
min-height: 6.5em;
margin-top: 4px;
margin-bottom: 10px;
}
.article-stories .item .read-more-link,
.article-with-dropdown .item .read-more-link {
position: absolute;
bottom: 0;
margin-bottom: 0;
padding-bottom: 14px;
}
.article-with-dropdown .item:nth-of-type(3n+1) .expanding-item-expander {
margin-left: calc(150% + 20px);
}
.article-with-dropdown .item:nth-of-type(3n+2) .expanding-item-expander {
margin-left: 50%;
}
.article-with-dropdown .item:nth-of-type(3n+3) .expanding-item-expander {
margin-left: calc(-50% - 20px);
}
.article-with-dropdown .item .expanding-item-expander {
padding-left: 10px;
padding-right: 10px;
transform: translate(-50%);
}
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
.article-with-dropdown .item .expanding-item-expander {
width: calc(300% + 80px);
}
}
@media screen and (min-width: 1024px) {
.article-banner .container .text-content {
left: 35px;
right: 35px;
}
.article-banner .container .text-content__title {
font-size: 2.25rem;
}
.content-tab .tab-content .tab-pane h2.title {
font-size: 2.1rem;
}
.article-stories .item h4 {
min-height: 5.5em;
}
.article-with-dropdown .item .expanding-item-expander {
width: 100vw;
padding: 0;
}
.text-img-2-column .item h4 {
font-size: 1.375rem;
}
}
@media screen and (min-width: 1200px) {
.content-tab .tab-content .tab-pane h2.title {
font-size: 2.6rem;
}
.which-profile .which-profile-title {
font-size: 2rem;
}
.carousel-container .carousel-title {
font-size: 2rem;
}
.video-content .title {
font-size: 2rem;
}
.video-content .item .video-holder {
padding-left: 35px;
margin-top: 2rem;
}
.video-content .item .video-holder.left .video-container:before {
top: -35px;
left: -35px;
}
.video-content .item .video-holder.right .video-container:before {
top: -35px;
right: -35px;
}
.video-content .item .video-holder p {
margin-left: -35px;
}
.infographics h3 {
font-size: 1.75rem;
}
.img-transparent-bg {
margin-top: 4.5rem;
margin-bottom: 3.5rem;
}
}
@media screen and (min-width: 1216px) {
.article-banner .container {
padding-bottom: 34.72222222%;
}
}
@media screen and (min-width: 1400px) {
.content-tab .tab-content .tab-pane h2.title {
font-size: 2.8rem;
}
.content-tab .tab-content .tab-pane .tott-content-box .text-content-inner .text-content-title {
font-size: 2rem;
}
}
@media screen and (min-width: 1600px) {
.content-tab .tab-content .tab-pane h2.title {
font-size: 3.2rem;
}
}
.header-default .global-title {
margin: 0;
line-height: 1.3;
}
.header-default .global-title.feature {
padding-bottom: 0;
}
.header-default .feature-desc {
margin-top: 24px;
margin-bottom: 44px;
}
.feature-container .feature-items {
display: flex;
flex-direction: column;
align-items: center;
}
.feature-container .feature-items .row {
margin: 0;
padding: 0;
width: calc(100% + 20px);
}
.feature-container .feature-items .row .col-12 {
padding: 10px;
}
.feature-container .feature-items .feature-banner {
margin-bottom: 20px;
height: 0;
margin-bottom: 0;
padding-bottom: 134.28571429%;
}
.feature-container .feature-items .feature-banner .banner-content {
position: absolute;
width: 100%;
top: 0;
right: 0;
}
.feature-container .feature-items .feature-banner .banner-content .banner-text {
min-width: 148px;
width: 50%;
}
.feature-container .feature-items .feature-banner .banner-content .banner-text .banner-text__title {
font-size: 1.75rem;
margin-bottom: 24px;
}
.feature-container .feature-items .feature-banner .banner-content .banner-text .banner-text__desc {
word-break: break-word;
line-height: 1.25;
font-size: 1.25rem;
margin-bottom: 24px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
/* number of lines to show */
line-clamp: 3;
-webkit-box-orient: vertical;
}
.feature-container .feature-items .feature-banner .banner-content .banner-text .banner-btn {
margin-top: 0;
min-width: 100%;
}
.feature-container .feature-items .feature-banner .banner-content .banner-text .banner-btn span {
white-space: nowrap;
}
.feature-container .pagination-container {
padding: 0;
margin-bottom: 0;
}
.feature-container .pagination-container .row .desktop-pagination,
.feature-container .pagination-container .row .mobile-pagination {
flex: 0 0 100%;
max-width: 100%;
}
@media screen and (min-width: 992px) and (max-width: 1024px) {
.feature-container .feature-items .row .col-lg-3 {
flex: 0 0 50%;
max-width: 50%;
}
}
@media screen and (min-width: 1024px) {
.feature-container .feature-items .feature-banner .banner-content .banner-text .banner-text__title {
font-size: 1.375rem;
}
.feature-container .feature-items .feature-banner .banner-content .banner-text .banner-text__desc {
font-size: 1rem;
}
.feature-container .feature-items .feature-banner .banner-content .banner-text .banner-btn {
min-width: 148px;
margin-top: 0;
}
}
.tott-content-desc {
display: flex;
justify-content: center;
text-align: center;
padding: 50px 0;
position: relative;
}
.tott-content-desc.background-grey::after {
position: absolute;
content: '';
top: 0;
left: 0;
width: 100vw;
height: 100%;
left: calc(-50vw + 50%);
background-color: #e1e5eb;
z-index: -100;
}
.tott-content-desc p {
width: 83.33333333%;
margin: 0;
padding: 0;
color: #333333;
}
.title-tott {
padding: 10px;
margin: 10px 0;
font-weight: 700;
font-size: 1.7rem;
color: #22ABA6;
}
.title-tott.text-blue {
color: #2200B3;
}
.desc {
display: block;
padding: 10px;
margin-bottom: 14px;
}
.tott-feature-container {
position: relative;
width: 100vw;
left: calc(-50vw + 50%);
text-align: center;
padding-top: 1rem;
padding-bottom: 3rem;
background-color: #434DA6;
}
.tott-feature-container .container {
padding: 0;
}
.tott-feature-container.background-grey::after {
position: absolute;
content: '';
top: 0;
left: 0;
width: 100vw;
height: 100%;
left: calc(-50vw + 50%);
background-color: #e1e5eb;
z-index: -100;
}
.tott-feature-container .tott-persona-list {
display: none;
}
.tott-feature-container .tott-persona-list .tott-persona-item {
flex: 1;
display: inline-block;
padding: 10px;
width: 100%;
opacity: 1;
}
.tott-feature-container .tott-persona-list .tott-persona-item:hover {
opacity: 0.8;
}
.tott-feature-container .tott-persona-list .tott-persona-item .tott-persona-img {
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
}
.tott-feature-container .tott-persona-list-mobile {
display: flex;
flex-direction: column;
padding-bottom: 0;
}
.tott-feature-container .tott-persona-list-mobile .tott-persona-item-mobile {
display: flex;
padding: 10px;
justify-content: space-between;
align-items: center;
line-height: 1;
}
.tott-feature-container .tott-persona-list-mobile .tott-persona-item-mobile .tott-persona-img-mobile {
padding: 5px;
margin-left: 10px;
width: 25%;
}
.tott-feature-container .tott-persona-list-mobile .tott-persona-item-mobile .tott-persona-title {
display: flex;
align-items: center;
text-align: left;
color: #FADC00;
font-size: 22.4px;
font-weight: 700;
}
.tott-feature-container .tott-persona-list-mobile .tott-persona-item-mobile .tott-persona-title .icon {
font-size: 38px;
margin-right: 20px;
}
.tott-video-container {
position: relative;
width: 100%;
text-align: center;
padding-top: 1rem;
padding-bottom: 1rem;
z-index: 0;
max-width: unset !important;
}
.tott-video-container .container {
padding: 0;
}
.tott-video-container.background-grey::after {
position: absolute;
content: '';
top: 0;
left: 0;
width: 100vw;
height: 100%;
left: calc(-50vw + 50%);
background-color: #e1e5eb;
z-index: -100;
}
.tott-video-container .container {
padding: 0;
}
.tott-video-container .row {
margin: 0;
padding: 0;
}
.tott-video-container .video-col {
margin: 0;
padding: 0;
}
.tott-video-container .video-col .video-holder {
padding: 25px 0;
margin-top: 2rem;
}
.tott-video-container .video-col .video-holder.left {
padding-left: 20px;
}
.tott-video-container .video-col .video-holder.left .video-container::after {
position: absolute;
content: '';
width: 90%;
height: 100%;
background-color: #FE512B;
z-index: -1;
left: -20px;
top: -20px;
}
.tott-video-container .video-col .video-holder.right {
padding-right: 20px;
}
.tott-video-container .video-col .video-holder.right .video-container::after {
position: absolute;
content: '';
width: 90%;
height: 100%;
background-color: #FB75AC;
z-index: -1;
right: -20px;
top: -20px;
}
.tott-video-container .video-col .video-holder .video-container {
margin: 0;
}
.tott-video-container .video-col .video-holder .video-container.left {
margin-right: 10px;
}
.tott-video-container .video-col .video-holder .video-container.right {
margin-left: 10px;
}
.tott-carousel-container {
position: relative;
width: 100vw;
left: calc(-50vw + 50%);
text-align: center;
padding-top: 1rem;
padding-bottom: 3rem;
background-color: #FADC00;
}
.tott-carousel-container .tott-carousel-field {
padding: 0 30px;
}
.tott-carousel-container.background-grey::after {
position: absolute;
content: '';
top: 0;
left: 0;
width: 100vw;
height: 100%;
left: calc(-50vw + 50%);
background-color: #e1e5eb;
z-index: -100;
}
.tott-carousel-container .container {
position: relative;
padding: 0;
}
.tott-carousel-container .tottSwiper {
padding: 15px 0 34px;
--swiper-theme-color: red;
}
.tott-carousel-container .tottSwiper .swiper-wrapper .swiper-slide img {
width: 380px;
height: 340px;
padding: 0 20px;
}
.tott-carousel-container .swiper-btn {
position: absolute;
width: 50px;
height: 50px;
background-color: #D81800;
color: #FFFFFF;
top: calc(50%);
display: flex;
justify-content: center;
align-items: center;
z-index: 2;
}
.tott-carousel-container .swiper-btn:hover .icon {
opacity: 1;
}
.tott-carousel-container .swiper-btn.swiper-btn-next {
right: 15px;
}
.tott-carousel-container .swiper-btn.swiper-btn-prev {
left: 15px;
}
.tott-carousel-container .swiper-btn .icon {
opacity: 0.75;
}
.tott-text-icon {
display: inline-block;
vertical-align: middle;
}
.tott-text-icon:before {
content: "";
position: relative;
margin-right: 10px;
display: inline-block;
vertical-align: middle;
background-position: center left;
background-size: contain;
background-repeat: no-repeat;
}
.tott-text-icon.icon-pen:before {
background-image: url('data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAABq0lEQVRIibXWzytEURTA8S/50SQpJRtlJBuxsJFiIeR3FpZKsvQfiI2F8uMfYCdTLLCSkF/ZWLBlwWKisKEUimSjU+dOr9edcWfenVPT7d073c+757533yn4mG3EY9QBCaADeACmgMPg9IUesRrgWDGJOLALjOQDFOwcqA/1FwM7QdQXuGjBrGhUsBpoAeaA5wz/M2hfFFDSeAFcAvLkdTqgq7mCwT0zd++CxnMBq4Cz0J4Z9Osf9DRb0GANlrFt4AX4ToMmgYlsQIM1WcY2gUlgHbi3pDdprl1BF2wNGLPsaULbJxxfi2wwEwYtkzQazAXMBTNxBzyGOzOBlRGwG6ALeHMFK4CDiNirbWIbKNgR0Oobs4F5xcJg3rEwOJ1vLAwO6aRSJiw7Ylf6hXfCJIq0ldO/GZjRWmQeuAU2/sF6gXdXLLjCfuBH3zuJT4XGfWJBcFDbttD4ViC9kTEDyrnXA5QCe/oAmJCVrvjC0D1sB8r1OqbosJYO3cCoL8yAA6G+mB5rEiXANbAALEXF0oGSxhNgX6vm1KfFRwhYq6uQVclPKrFfn0gqgD81/H520pMZIwAAAABJRU5ErkJggg==');
width: 28px;
height: 28px;
}
.tott-text-icon.icon-book:before {
background-image: url('data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAfCAYAAAAMeVbNAAAA5UlEQVRIie3WrQoCQRSG4VdRRC/ApMEkWrwEwSAiarAqmLwK78QmmGyiWARvw7jBZjBYBH9AjuzIsuwfw2ybL0xY9jwcZnaWk7kvmhVgDbQxGycLrFKAJTXBOynAv+QCnl2Bh4ZVBMpR+B4YasAqO2AQhreAOfDSgPNu/T9+vAosdVoOStYUFBR/57Idx4htKQDdpE358Q0wjanZAiMdfOze1nfI+3JovSRwEC7f6iRpcVxSPVCLW9ziFre4N+p/fgb6Bt0D0FB4CbgAH0P4UxbBT+5I5wA3Q3hd4TPPlCtzi5mA8wWIOR1G7wvC/AAAAABJRU5ErkJggg==');
width: 23px;
height: 31px;
}
.tott-text-icon.icon-camera:before {
background-image: url('data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAcCAYAAAAN3M1lAAACbUlEQVRYhc3XOYgUQRgF4G/Xe71X8AADFRQ88EhEUYTFVMTMRFA8A8EDPFFBxRvxCkx0UdE1EFHExMBIBMFIEwMvUIw88cb1pOQfGIaZne7ZEfdBU93Vr+p/XX/Vq+qGD9sm6ARmYj9mo1uFbu5jF67mCdO9TF1vrEb/eP6B83hWwpuPy+hRJcYUXMFWHOiMsBk4XFI3EBvjPglZjJMZRBUjjewA7MXnauSUygaswzKMDLF9S3jt+Br3TTkFleIXPlZ49wKtOJZEbMfuKp31jKseaIwMlEOqP4J+ibS+TgHrifVJ2OAuKGxwucmf8LhogibxE6Oshld4jWYMTXO4VmXlgj3CWEyNa3KswEp4gy0YHWKSMQ6PaxWe1kvYlwrBy+E6xuAopscHJM86jXm4hPE4nldYuVSOCFN8X8SZVYZ3EYswB2cxquR9sp9DWBN29CbD6u9QWErHvSrt0i6wHC240YGvDUFbGOue4LdkEZZlQpfDrtgb2zKa7YlI+ZasAWoR1h575KKY4FnQI9J5F0/+lbAHsaXMzdmuwL+bhVyLsFdRDs3ZrjC6L7OQaxHWHOW7nO0KH9RchfcXtQhLvtQHt3K2ux3ltCzkWoQ1hXmeK/K6avgdKzN91KR/JSxhZ4hamZG/O47Y+7IGqFXYhDjlpi1nYQcj9x2bw/eWYkHWAJVOF1mwFr2ivIkl4erD8BZ3cAbPsQEH83Sejta/OyEu4WGk6ho+FdX3DO/aEX9TudCZEStgHC7gW5hvOo8Nioner9ZO6yGsgF5ZrSALGkuGv6vgU2P8LnU1tKZUbsJPrCj6+/5fSIeDU9j6BwD2axflDR0oAAAAAElFTkSuQmCC');
width: 38px;
height: 28px;
}
@media screen and (min-width: 768px) {
.tott-feature-container {
position: relative;
left: 0;
width: 100%;
}
.tott-feature-container .tott-persona-list {
display: flex;
}
.tott-feature-container .tott-persona-list-mobile {
display: none;
}
.tott-carousel-container {
position: relative;
left: 0;
width: 100%;
}
}
@media screen and (min-width: 1024px) {
.title-tott {
font-size: 2rem;
}
.container {
position: relative;
padding-left: 5px;
padding-right: 5px;
}
.tott-feature-container {
position: relative;
width: 100vw;
left: calc(-50vw + 50%);
}
.tott-video-container {
position: relative;
width: 100vw;
left: calc(-50vw + 50%);
}
.tott-video-container .video-col .video-holder.left {
padding-left: 35px;
}
.tott-video-container .video-col .video-holder.left .video-container::after {
left: -35px;
top: -35px;
}
.tott-video-container .video-col .video-holder.right {
padding-right: 35px;
}
.tott-video-container .video-col .video-holder.right .video-container::after {
right: -35px;
top: -35px;
}
.tott-video-container .video-col .video-holder .video-container.left,
.tott-video-container .video-col .video-holder .video-container.right {
margin: 10px;
}
.tott-video-container .video-col .video-holder p a {
text-decoration: underline;
color: #333333;
}
.tott-carousel-container {
position: relative;
width: 100vw;
left: calc(-50vw + 50%);
}
}
.tott-main-content {
margin-top: 1rem;
position: relative;
width: 100vw;
left: calc(-50vw + 50%);
background-color: #E1E5EB;
}
.tott-main-content.tott-main-content::after {
position: absolute;
content: '';
height: 100%;
width: 100%;
top: -1rem;
left: 0;
background-color: #fcecd5;
z-index: -1;
}
.tott-main-content .row {
padding: 0;
}
.tott-main-content .row .col-6:first-child {
padding: 0 10px 0 15px;
}
.tott-main-content .row .col-6:first-child .content-box {
margin-right: 5%;
}
.tott-main-content .row .col-6:last-child {
padding: 0 15px 0 10px;
}
.tott-main-content .row .col-6:last-child .content-box {
margin-left: 5%;
}
.tott-main-content .background-tott-article {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 0;
}
.tott-main-content .tott-main-title {
width: 100%;
display: flex;
justify-content: center;
z-index: 1;
}
.tott-main-content .tott-main-title .title-tott {
z-index: 1;
}
.tott-main-content .tott-main-title .title-tott.article {
font-size: 3.2rem;
font-weight: 700;
line-height: 1.2;
width: 50%;
text-align: center;
margin: 2.5rem;
}
.tott-main-content .tott-tab-content {
display: none;
}
.tott-main-content .tott-tab-content.selected {
display: block;
}
.tott-main-content .text {
text-align: center;
padding: 10px;
padding-bottom: calc(2.5rem + 10px);
}
.tott-main-content .text p {
margin: 0;
}
.tott-main-content .text p a {
color: #333333;
text-decoration: underline;
}
.tott-prevnext.fullwidth {
position: relative;
width: 100vw;
left: calc(-50vw + 50%);
}
.tott-prevnext.bg-pale-skin {
background-color: #FCECD5;
}
.tott-prevnext .post-prevnext .row {
margin-top: 0;
}
@media screen and (max-width: 767px) {
.tott-main-content {
margin-top: 0;
}
.tott-main-content .tott-tab-content .row {
margin: 0;
}
.tott-main-content .tott-tab-content .row .col-12 {
padding: 0;
padding-right: 10px;
}
.tott-main-content .tott-main-title .title-tott.article {
width: 100%;
line-height: 1.2;
font-size: 1.8rem;
}
.tott-prevnext.fullWidth-mobile {
position: relative;
width: 100vw;
left: calc(-50vw + 50%);
}
.tott-prevnext .post-prevnext .row {
margin-top: 20px;
}
.tott-prevnext .post-prevnext .row .prevnext-col {
padding: 0;
}
}
@media screen and (min-width: 768px) {
.tott-main-content .tott-tab-content .row .col-12:first-child {
padding-right: 10px;
}
.tott-main-content .tott-tab-content .row .col-12:first-child .content-box {
margin-right: 5%;
}
.tott-main-content .tott-tab-content .row .col-12:last-child {
padding-left: 10px;
}
.tott-main-content .tott-tab-content .row .col-12:last-child .content-box {
margin-left: 5%;
}
}
@media screen and (max-width: 1023px) {
.tott-main-content .background-tott-article {
top: 80px;
}
}
.tott-article-container,
.tott-avatar-container,
.tott-img-banner,
.tott-article-content,
.tott-divider,
.tott-profile-btn,
.tott-component,
.tott-img-header,
.tott-story-read-more,
.tott-profile-btn-other,
.tott-story-content,
.tott-story-image {
display: block;
position: relative;
padding-top: 2rem;
}
.tott-article-container.bg-pale-skin,
.tott-avatar-container.bg-pale-skin,
.tott-img-banner.bg-pale-skin,
.tott-article-content.bg-pale-skin,
.tott-divider.bg-pale-skin,
.tott-profile-btn.bg-pale-skin,
.tott-component.bg-pale-skin,
.tott-img-header.bg-pale-skin,
.tott-story-read-more.bg-pale-skin,
.tott-profile-btn-other.bg-pale-skin,
.tott-story-content.bg-pale-skin,
.tott-story-image.bg-pale-skin {
background-color: #fcecd5;
}
.tott-blue {
color: #03579f;
}
.tott-purple {
color: #473485;
}
.tott-article-container {
padding-bottom: 16px;
padding-top: 2rem;
}
.tott-article-container .article-toolbar {
margin: 0 !important;
}
.tott-avatar-container .container {
display: flex;
align-items: center;
justify-content: center;
}
.tott-avatar-container .tott-avatar-img .avatar {
max-width: 108px;
}
.tott-avatar-container .tott-avatar-desc {
text-transform: uppercase;
font-weight: 700;
line-height: 1.3;
color: #432c62;
margin-left: 5px;
font-size: 1rem;
}
.tott-img-banner .tott-banner-wrapper {
text-align: center;
width: 66.66666667%;
margin: 0 auto;
padding: 4.5rem 0 3.5rem;
}
.tott-img-banner .tott-banner-wrapper .banner {
width: 100%;
height: auto;
}
.tott-article-content .row {
padding: 0;
margin: 0;
flex-wrap: wrap;
}
.tott-article-content .row > [class*='col-'] {
padding: 0;
margin: 0;
}
.tott-article-content .tott-content-title {
font-weight: 700;
line-height: 1.3;
font-size: 1.25rem;
}
.tott-article-content .tott-content-list ul {
padding-left: 0;
margin: 0.5rem 0 1em 1.3em;
}
.tott-article-content .tott-content-list ul li:last-child {
margin-bottom: 24px;
}
.tott-article-content .tott-content-list p {
margin-top: 0.5rem;
}
.tott-article-content .tott-content-link {
text-decoration: underline;
margin-left: -1.3em;
cursor: pointer;
}
.tott-article-content .tott-content-link:hover {
color: #D81800;
}
.tott-divider {
padding: 0;
}
.tott-divider .container {
text-align: center;
}
.tott-divider .tott-divider-img {
width: 60%;
max-width: 400px;
margin: 4rem auto;
}
.tott-profile-btn .container {
display: flex;
justify-content: center;
}
.tott-profile-btn .profile-btn {
position: relative;
flex: 1;
}
.tott-profile-btn .profile-btn a img {
width: 100%;
max-width: 90%;
}
.tott-profile-btn .profile-btn.left {
flex: 50% 1 1;
text-align: left;
}
.tott-profile-btn .profile-btn.right {
flex: 50% 1 1;
text-align: right;
}
.tott-profile-btn-other .container {
display: flex;
justify-content: center;
}
.tott-profile-btn-other .profile-btn {
text-align: center;
}
.tott-profile-btn-other .profile-btn a img {
width: 60%;
}
.tott-component .post-prevnext {
margin-bottom: 0;
}
.tott-component .post-prevnext .row {
margin-top: 0;
padding-top: 0;
}
.tott-component .post-prevnext .row .prevnext-col {
padding: 0;
}
.tott-img-header {
padding-top: 0;
}
.tott-img-header .container {
display: flex;
justify-content: center;
}
.tott-img-header .tott-img-header-wrapper {
position: relative;
margin: 4.5rem auto 3.5rem;
width: 50%;
min-width: 320px;
max-width: 900px;
}
.tott-img-header .tott-img-header-wrapper .img-header {
width: 100%;
}
.tott-story-read-more .container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
padding: 0 5px;
}
.tott-story-read-more .tott-story-item {
position: relative;
max-width: 100%;
width: 100%;
padding: 10px;
}
.tott-story-read-more .tott-story-item .tott-story-img {
width: 100%;
}
.tott-story-read-more .tott-story-item .tott-story-img img {
width: 100%;
}
.tott-story-read-more .tott-story-item .tott-story-desc {
font-weight: 700;
margin-top: 4px;
margin-bottom: 10px;
}
.tott-story-read-more .tott-story-item .tott-story-link {
position: relative;
padding-bottom: 32px;
}
.tott-story-read-more .tott-story-item .tott-story-link::before {
width: 23px;
height: 31px;
content: "";
position: relative;
margin-right: 10px;
display: inline-block;
vertical-align: middle;
}
.tott-story-read-more .tott-story-item .tott-story-link a {
color: #D81800;
font-weight: 700;
}
.tott-story-read-more .tott-story-item .tott-story-link a:hover {
text-decoration: underline;
}
.tott-story-content p {
width: 100%;
text-align: left;
margin: 0 auto;
padding-bottom: 1em;
padding-top: 0.5em;
}
.tott-story-image .tott-story-image-wrapper {
margin: 0 auto;
width: 100%;
}
.tott-story-image .tott-story-image-wrapper .image {
width: 100%;
}
.tott-story-image .tott-story-image-wrapper .image img {
width: 100%;
}
.tott-story-image .tott-story-image-wrapper .tott-img-caption {
font-size: 14px;
margin-top: 16px;
}
@media screen and (min-width: 768px) {
.tott-story-read-more .tott-story-item {
width: calc(100% / 3);
}
.tott-story-read-more .tott-story-item .tott-story-desc {
min-height: 6.5em;
}
.tott-story-read-more .tott-story-item .tott-story-link {
position: absolute;
bottom: 0;
margin-bottom: 0;
padding-bottom: 14px;
}
.tott-profile-btn .profile-btn a img {
width: auto;
max-width: 80%;
}
.tott-component .post-prevnext .row .prevnext-col {
padding: 0 40px;
}
.tott-article-content .row {
padding: 0;
margin: 0;
flex-wrap: nowrap;
}
.tott-article-content .row .col-12:not(:last-child) {
padding-right: 30px;
}
.tott-article-content .row .col-12:not(:first-child) {
padding-left: 30px;
}
}
@media screen and (min-width: 1024px) {
.tott-story-read-more .tott-story-item {
width: calc(100% / 3);
}
.tott-story-read-more .tott-story-item .tott-story-desc {
min-height: 5.5em;
}
.tott-profile-btn-other .profile-btn a img {
width: 100%;
}
.tott-article-content .tott-content-title {
font-size: 1.75rem;
}
}
@media screen and (min-width: 1408px) {
.tott-profile-btn .profile-btn a img {
width: auto;
max-width: 100%;
}
}
.sg-press-centre .secondary-header {
width: 100vw;
position: relative;
left: calc(-50vw + 50%);
}
.sg-press-centre .secondary-header .banner-with-description {
position: absolute;
top: 50% !important;
right: 50% !important;
transform: translate(50%, -50%);
}
.sg-press-centre .secondary-header .banner-with-description h1 {
position: unset !important;
}
.sg-press-centre .secondary-header .banner-with-description p {
font-family: OpenSans-Medium;
font-size: 15px;
}
.sg-press-centre .secondary-header img {
width: 100%;
min-height: 190px;
height: 140px;
-o-object-fit: cover;
object-fit: cover;
}
.sg-press-centre .secondary-header h1 {
font-size: 50px;
font-weight: 700;
color: #d11212;
margin-bottom: 0;
position: absolute;
left: 15px;
bottom: calc(50% - 30px);
}
.sg-press-centre .main-content {
width: 100vw;
position: relative;
left: calc(-50vw + 50%);
background-color: #f0ebe6;
}
.sg-press-centre .main-content .imgleaderhead {
height: 100px;
}
.sg-press-centre .main-content .share-this p {
font-size: 0.929em;
color: #555;
margin: 0 0 0 8px;
}
.sg-press-centre .main-content .content-container {
position: relative;
background-color: #f0ebe6;
width: 100%;
margin: 0 auto;
padding-bottom: 15px;
box-shadow: 0px 4px 10px -2px rgba(0, 0, 0, 0.33);
}
.sg-press-centre .main-content .content-container .container {
padding: 0;
padding-top: 10px;
}
.sg-press-centre .main-content .content h2 {
font-size: 2rem;
font-weight: 700;
color: #333333;
margin-bottom: 0.5em;
line-height: 1.3;
}
.sg-press-centre .main-content .content .press-info p {
font-size: 13px;
margin-bottom: 0;
}
.sg-press-centre .main-content .content .press-info p.press-info-category {
font-weight: bold;
color: #0072bc;
}
.sg-press-centre .main-content .content .press-info p.press-info-date {
color: #737373;
}
.sg-press-centre .main-content .content .row {
margin-left: -15px;
margin-right: -15px;
}
.sg-press-centre .main-content .content .row .item {
padding: 0 15px;
}
.sg-press-centre .main-content .content .item {
margin-bottom: 30px;
}
.sg-press-centre .main-content .content .item.green h6.title,
.sg-press-centre .main-content .content .item.green p.press-info-category {
color: #0d913b;
}
.sg-press-centre .main-content .content .item.green .wrap {
border-bottom: 3px solid #0d913b;
}
.sg-press-centre .main-content .content .item.orange h6.title,
.sg-press-centre .main-content .content .item.orange p.press-info-category {
color: #ef7135;
}
.sg-press-centre .main-content .content .item.orange .wrap {
border-bottom: 3px solid #ef7135;
}
.sg-press-centre .main-content .content .item .wrap {
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 290px;
height: 100%;
padding: 20px;
border: 1px solid #cccccc;
border-bottom: 3px solid #0072bc;
background-color: #FFFFFF;
}
.sg-press-centre .main-content .content .item h6.title {
font-size: 13px;
font-weight: bold;
color: #0072bc;
text-transform: uppercase;
margin: 2rem 0 20px;
}
.sg-press-centre .main-content .content .item a {
display: inline-block;
font-size: 15px;
color: #4b4b4b;
margin-bottom: 20px;
}
.sg-press-centre .main-content .content .item a:visited {
color: #551A8B;
}
.sg-press-centre .main-content .content .item a:hover {
color: #0072bc;
text-decoration: underline;
}
.sg-press-centre .main-content .content .email-subscription {
padding: 20px 10px;
border-top: 1px solid #ccc;
}
.sg-press-centre .main-content .content .email-subscription h5 {
font-size: 16px;
font-weight: 700;
color: #0072bc;
margin: 0;
}
.sg-press-centre .main-content .content .email-subscription p {
font-size: 15px;
color: #4b4b4b;
margin-bottom: 30px;
}
.sg-press-centre .main-content .content .email-subscription form .form-group:nth-child(2) {
display: flex;
flex-wrap: nowrap;
}
.sg-press-centre .main-content .content .email-subscription form .form-group input {
font-size: 0.929em;
width: 50%;
height: 40px;
border-radius: 0px;
padding-left: 10px;
margin: 0 10px 20px 0;
border: 1px solid #cfcfcf;
}
.sg-press-centre .main-content .content .email-subscription form .form-group label {
font-size: 15px;
color: #737373;
margin: 10px 0 15px;
}
.sg-press-centre .main-content .content .email-subscription form .form-group .img-captcha {
border: 1px solid #cfcfcf;
}
.sg-press-centre .main-content .content .email-subscription form .form-group .refresh-captcha {
display: block;
text-align: center;
height: 24px;
width: 65px;
}
.sg-press-centre .main-content .content .email-subscription form .form-group .refresh-captcha img {
background-size: 18px 15px;
-o-object-fit: cover;
object-fit: cover;
}
.sg-press-centre .main-content .content .email-subscription form button {
border: 1px solid #cfcfcf;
background: #FFFFFF;
color: #d11212;
padding: 7px 20px;
transition: all 0.3s ease 0s;
border-radius: 0px;
outline: none;
height: 40px;
}
.sg-press-centre .main-content .content .email-subscription .error {
margin: 0 0 10px;
padding: 20px;
background: #ffeeee;
}
.sg-press-centre .main-content .content .email-subscription .error h2 {
font-size: 16px;
color: #0072bc;
padding: 0;
margin: 0;
}
.sg-press-centre .main-content .content .email-subscription .error p {
font-size: 15px;
color: #d11212;
padding: 0;
margin: 0 0 10px;
}
.sg-press-centre .main-content .content .email-subscription .success {
margin: 0 0 10px;
padding: 20px;
background: #cfecd8;
}
.sg-press-centre .main-content .content .email-subscription .success h2 {
font-size: 16px;
color: #0072bc;
padding: 0;
margin: 0;
}
.sg-press-centre .main-content .content .email-subscription .success p {
font-size: 15px;
color: #0d913c;
padding: 0;
margin: 0 0 10px;
}
.sg-press-centre .main-content .content.content-detail {
padding-bottom: 50px;
}
.sg-press-centre .main-content .content.content-detail a:visited {
color: #002d81 !important;
}
.sg-press-centre .main-content .content.content-detail a:visited span {
color: #002d81 !important;
}
.sg-press-centre .main-content .content.content-detail .press-info {
margin: 20px 0;
}
.sg-press-centre .main-content .content.content-detail .press-info p {
font-size: 13px;
}
.sg-press-centre .main-content .content.content-detail h3.title {
font-size: 1.125rem;
font-weight: 600;
color: #333333;
line-height: 1.3;
margin: 0 0 5px;
}
.sg-press-centre .main-content .content.content-detail p {
font-size: 15px;
margin-bottom: 15px;
}
.sg-press-centre .main-content .content.content-detail .quote {
border: 1px solid #c1bdbd;
border-right: 2px solid #0072bc;
padding: 20px 30px;
margin: 20px 0 1.1428em;
}
.sg-press-centre .main-content .content.content-detail .quote h3 {
font-size: 1.125rem;
}
.sg-press-centre .main-content .content.content-detail .quote a {
color: #D81800;
}
.sg-press-centre .main-content .content.content-detail .quote a:hover {
text-decoration: underline;
}
.sg-press-centre .main-content .content.content-detail .quote .right {
text-align: center;
}
.sg-press-centre .main-content .content.content-detail ul {
padding: 0;
margin-left: 2em;
margin-top: 1em;
}
.sg-press-centre .main-content .content.content-detail ul.list-style-none {
list-style-type: none;
}
.sg-press-centre .main-content .content.content-detail ul.list-style-none li + li {
border-top: 1px solid #ccc;
}
.sg-press-centre .main-content .content.content-detail ul li {
padding: 20px 0;
}
.sg-press-centre .main-content .content.content-detail ul li:first-of-type {
padding-top: 0;
}
.sg-press-centre .main-content .content.content-detail ul li h6 {
width: 40%;
font-weight: 700;
}
.sg-press-centre .main-content .content.content-detail ul li p {
color: #333333;
margin-bottom: 0;
}
.sg-press-centre .main-content .content.content-detail ul li a {
color: #D81800;
}
.sg-press-centre .main-content .content.content-detail ul li a:hover {
text-decoration: underline;
}
.media-guide-categories h2.title,
.media-guide-detail h2.title {
font-size: 2rem;
font-weight: 700;
margin-bottom: 0.5em;
}
.media-guide-categories ul,
.media-guide-detail ul {
padding: 20px 0 20px 40px;
}
.media-guide-categories ul li,
.media-guide-detail ul li {
margin-bottom: 0.25em;
}
.media-guide-categories ul li:hover a,
.media-guide-detail ul li:hover a {
text-decoration: underline;
}
.media-guide-categories ul li:visited,
.media-guide-detail ul li:visited {
color: #8B1C0E;
}
.media-guide-categories ul li a,
.media-guide-detail ul li a {
color: #D81800;
}
.media-guide-categories p,
.media-guide-detail p {
margin-bottom: 1em;
}
.media-guide-categories h5,
.media-guide-detail h5 {
font-size: 20px;
font-weight: bold;
margin-bottom: 20px;
}
.media-guide-categories .contact-list,
.media-guide-detail .contact-list {
text-align: center;
position: relative;
}
.media-guide-categories .contact-list .hide-block,
.media-guide-detail .contact-list .hide-block {
display: none;
}
.media-guide-categories .contact-list .btn-block,
.media-guide-detail .contact-list .btn-block {
border-top: 3px solid #d11212;
text-align: center;
}
.media-guide-categories .contact-list .btn-block .btn-show,
.media-guide-detail .contact-list .btn-block .btn-show {
font-size: 12px;
font-weight: bold;
font-style: italic;
color: #d11212;
display: block;
position: relative;
padding: 0 5px 5px;
margin: 0 auto;
}
.media-guide-categories .contact-list .btn-block .btn-show:focus,
.media-guide-detail .contact-list .btn-block .btn-show:focus {
box-shadow: unset !important;
}
.media-guide-categories .contact-list .btn-block .btn-show:before,
.media-guide-detail .contact-list .btn-block .btn-show:before {
content: '';
position: absolute;
left: 50%;
top: -1px;
margin-left: -5px;
width: 0;
height: 0;
border-style: solid;
border-width: 5px 5px 0 5px;
border-color: #d11212 transparent transparent transparent;
}
@media screen and (max-width: 576px) {
.sg-press-centre .main-content .email-subscription {
position: relative;
width: 100vw !important;
left: calc(-50vw + 50%);
margin-left: 0 !important;
padding: 20px !important;
}
}
@media screen and (min-width: 540px) and (max-width: 767px) {
.sg-press-centre .main-content .content.content-detail {
width: 100% !important;
margin: 0 auto !important;
}
}
@media screen and (min-width: 768px) {
.sg-press-centre .main-content {
background-color: #FFFFFF;
}
.sg-press-centre .main-content .content-container {
padding-left: 15px;
padding-right: 15px;
background-color: #FFFFFF;
}
}
@media screen and (max-width: 767px) {
.sg-press-centre {
background-color: #f0ebe6;
}
.sg-press-centre .main-content .content {
max-width: 540px;
margin: 0 auto;
}
.sg-press-centre .main-content .content .email-subscription {
border: 1px solid #ccc;
border-bottom: 3px solid #0072bc;
background-color: #FFFFFF;
}
.sg-press-centre .main-content .content .email-subscription form .form-group input {
width: 100%;
}
.sg-press-centre .main-content .content .email-subscription form .btn {
width: 100%;
margin-bottom: 10px;
}
}
@media screen and (max-width: 992px) {
.sg-press-centre .secondary-header .banner-with-description {
padding: 15px 0px;
}
.sg-press-centre .secondary-header .banner-with-description p {
padding: 0px 15px !important;
}
.sg-press-centre .secondary-header h1 {
font-size: 2em;
padding: 0 15px;
left: 0;
top: 35px !important;
}
.sg-press-centre .main-content .content-container {
width: 100%;
padding-left: 15px;
padding-right: 15px;
}
.sg-press-centre .main-content .content-container .container {
overflow-x: unset;
}
.sg-press-centre .main-content .content .email-subscription {
width: calc(100% + 30px);
padding: 20px 10px;
margin-left: -15px;
}
}
@media screen and (max-width: 1024px) {
.sg-press-centre .main-content .content.content-detail {
width: calc(100% + 30px);
margin-left: -15px;
padding: 10px 20px;
background: #FFFFFF;
}
.sg-press-centre .main-content .content.content-detail h2 {
padding: 0 15px;
}
.sg-press-centre .main-content .content.content-detail ul {
width: 100%;
margin-left: 1em;
}
.sg-press-centre .main-content .content h2 {
font-size: 1.625rem;
}
}
@media screen and (min-width: 1024px) {
.sg-press-centre .secondary-header h1 {
left: 30px;
bottom: 70px;
}
.sg-press-centre .main-content {
background-color: #f0ebe6;
}
.sg-press-centre .main-content .content-container {
width: 100%;
}
.sg-press-centre .main-content .content-container .container {
max-width: 100%;
background-color: #FFFFFF;
padding-left: 35px;
padding-right: 35px;
}
.sg-press-centre .main-content .content-container .container .content {
max-width: 900px;
}
.sg-press-centre .main-content .content-container .container .content.content-detail h3.title {
font-size: 1.75rem;
}
.sg-press-centre .main-content .content-container .container .content.content-detail .quote h3 {
font-size: 1.75rem;
}
}
@media screen and (min-width: 1200px) {
.sg-press-centre .main-content .content-container {
background: #FFFFFF;
width: 85%;
}
}
@media screen and (min-width: 1400px) {
.sg-press-centre .main-content .content-container {
background: #FFFFFF;
width: 75%;
}
}
.trusted-sites {
margin-top: 2rem;
}
.trusted-sites .main-content {
padding: 0 20px;
}
.trusted-sites .main-content .container {
margin: 0 auto;
}
.trusted-sites .main-content .container .row {
justify-content: center;
}
.trusted-sites .main-content .container h1 {
font-weight: 700;
font-size: 1.75rem;
margin-bottom: 1.5rem;
margin-top: 1rem;
}
.trusted-sites .main-content .container p {
margin-bottom: 1em;
}
.trusted-sites .main-content .container .page-anchors {
margin: 80px 0 4rem;
}
.trusted-sites .main-content .container .page-anchors ul.tags {
display: flex;
align-items: flex-start;
flex-direction: column;
}
.trusted-sites .main-content .container .page-anchors ul.tags li:first-child {
margin-bottom: 10px;
}
.trusted-sites .main-content .container .page-anchors ul.tags li a {
font-size: 1rem;
font-weight: 600;
color: #D81800;
}
.trusted-sites .main-content .container .page-anchors ul.tags li a:hover {
text-decoration: underline;
}
.trusted-sites .main-content .container .government-websites,
.trusted-sites .main-content .container .other-organisations {
margin-bottom: 5rem;
}
.trusted-sites .main-content .container .government-websites h3,
.trusted-sites .main-content .container .other-organisations h3 {
font-size: 24px;
font-weight: 700;
margin-bottom: 24px;
}
.trusted-sites .main-content .container .government-websites table th,
.trusted-sites .main-content .container .other-organisations table th,
.trusted-sites .main-content .container .government-websites table td,
.trusted-sites .main-content .container .other-organisations table td {
border: 1px solid #dadada;
padding: 0.5em 0.75em;
}
.trusted-sites .main-content .container .government-websites table thead tr th,
.trusted-sites .main-content .container .other-organisations table thead tr th {
text-align: left;
font-weight: 700;
color: #FFFFFF;
background-color: #D81800;
white-space: nowrap;
}
.trusted-sites .main-content .container .government-websites table thead tr th:first-child,
.trusted-sites .main-content .container .other-organisations table thead tr th:first-child {
width: 30%;
}
.trusted-sites .main-content .container .government-websites table tbody,
.trusted-sites .main-content .container .other-organisations table tbody {
background-color: #FFFFFF;
}
.trusted-sites .main-content .container .government-websites table tbody tr td a,
.trusted-sites .main-content .container .other-organisations table tbody tr td a {
color: #D81800;
}
.trusted-sites .main-content .container .government-websites table tbody tr td a:hover,
.trusted-sites .main-content .container .other-organisations table tbody tr td a:hover {
text-decoration: underline;
}
@media screen and (max-width: 767px) {
.trusted-sites {
margin-top: 2rem;
}
.trusted-sites .main-content {
padding: 0;
}
.trusted-sites .main-content .container {
padding: 0;
}
}
@media screen and (min-width: 768px) {
.trusted-sites .main-content {
width: 100vw;
position: relative;
left: calc(-50vw + 50%);
}
.trusted-sites .main-content .container .page-anchors {
margin: 76px 0 2rem;
}
.trusted-sites .main-content .container .page-anchors ul.tags {
display: flex;
justify-content: center;
flex-direction: row;
}
.trusted-sites .main-content .container .page-anchors ul.tags li:first-child {
margin-bottom: 0;
}
.trusted-sites .main-content .container .page-anchors ul.tags li:first-child:after {
content: '';
display: inline-block;
height: 0.875rem;
border-right: 2px solid #333333;
margin: 0 10px;
padding-top: 0;
}
}
@media screen and (min-width: 1024px) {
.trusted-sites .main-content .container h1 {
font-size: 2.25rem;
}
.trusted-sites .main-content .container .page-anchors ul.tags li a {
font-size: 1.125rem;
}
}
.about-content {
max-width: 80%;
margin: auto;
}
.about-content h2 {
font-family: OpenSans-SemiBold;
color: #d11212;
font-size: 2rem;
margin-bottom: 0.5em;
line-height: 1.3;
}
.about-content p {
font-family: OpenSans-Regular;
font-size: 15px;
}
.filter-content {
max-width: 80%;
margin: 0 auto;
padding: 50px 0 0px;
}
.filter-content .control {
padding: 0px 15px;
}
.filter-content .control,
.filter-content .bsv4_category-wrap_gtt {
align-items: center;
margin: 20px 0px;
}
.filter-content .control .from-wrap,
.filter-content .bsv4_category-wrap_gtt .from-wrap,
.filter-content .control .to-wrap,
.filter-content .bsv4_category-wrap_gtt .to-wrap {
display: flex;
align-items: center;
}
.filter-content .control .from-wrap label,
.filter-content .bsv4_category-wrap_gtt .from-wrap label,
.filter-content .control .to-wrap label,
.filter-content .bsv4_category-wrap_gtt .to-wrap label {
font-family: OpenSans-Bold;
font-size: 16px;
margin-bottom: 0;
}
.filter-content .control .from-wrap .dropdown,
.filter-content .bsv4_category-wrap_gtt .from-wrap .dropdown,
.filter-content .control .to-wrap .dropdown,
.filter-content .bsv4_category-wrap_gtt .to-wrap .dropdown {
margin: 0px 20px;
}
.filter-content .control .from-wrap,
.filter-content .bsv4_category-wrap_gtt .from-wrap {
padding-left: 0;
}
.filter-content .control .to-wrap,
.filter-content .bsv4_category-wrap_gtt .to-wrap {
justify-content: flex-end;
}
.filter-content .control .to-wrap .dropdown,
.filter-content .bsv4_category-wrap_gtt .to-wrap .dropdown {
margin-right: 12px;
}
.filter-content .control .dropdown,
.filter-content .bsv4_category-wrap_gtt .dropdown {
border-color: #adadad;
background-color: #f8f9fa;
position: relative;
width: 60%;
}
.filter-content .control .dropdown-toggle,
.filter-content .bsv4_category-wrap_gtt .dropdown-toggle {
background-color: #f8f9fa;
color: #212529;
width: 100%;
border-radius: 0;
}
.filter-content .control .dropdown-toggle::after,
.filter-content .bsv4_category-wrap_gtt .dropdown-toggle::after {
position: absolute;
width: 1px;
height: 100%;
top: 16px !important;
right: 20px;
content: "";
display: block;
background: #ccc;
background: transparent!important;
}
.filter-content .control .dropdown-menu,
.filter-content .bsv4_category-wrap_gtt .dropdown-menu {
padding: 0;
}
.filter-content .control .dropdown-menu li,
.filter-content .bsv4_category-wrap_gtt .dropdown-menu li {
cursor: pointer;
}
.filter-content .control .dropdown-menu.show,
.filter-content .bsv4_category-wrap_gtt .dropdown-menu.show {
width: 100%;
max-height: 200px;
overflow: auto;
}
.filter-content .control .dropdown-menu.show::-webkit-scrollbar,
.filter-content .bsv4_category-wrap_gtt .dropdown-menu.show::-webkit-scrollbar {
width: 10px;
}
.filter-content .control .dropdown-menu.show::-webkit-scrollbar-track,
.filter-content .bsv4_category-wrap_gtt .dropdown-menu.show::-webkit-scrollbar-track {
box-shadow: inset 0 0 2px grey;
border-radius: 8px;
background: ghostwhite;
}
.filter-content .control .dropdown-menu.show::-webkit-scrollbar-thumb,
.filter-content .bsv4_category-wrap_gtt .dropdown-menu.show::-webkit-scrollbar-thumb {
background: grey;
border-radius: 10px;
}
.filter-content .control .dropdown-menu.show::-webkit-scrollbar-thumb:hover,
.filter-content .bsv4_category-wrap_gtt .dropdown-menu.show::-webkit-scrollbar-thumb:hover {
background: grey;
}
.filter-content .control .dropdown-menu .dropdown-item,
.filter-content .bsv4_category-wrap_gtt .dropdown-menu .dropdown-item {
color: #D81800;
padding: 10px;
font-size: 14px;
font-family: OpenSans-Regular;
}
.filter-content .control .dropdown-menu .dropdown-item.active,
.filter-content .bsv4_category-wrap_gtt .dropdown-menu .dropdown-item.active {
background-color: #333333 !important;
color: #FFFFFF !important;
}
.filter-content .control .dropdown-menu .dropdown-item:focus,
.filter-content .bsv4_category-wrap_gtt .dropdown-menu .dropdown-item:focus {
background-color: #333333 !important;
color: #FFFFFF !important;
}
.filter-content .control .dropdown-menu .dropdown-item:hover,
.filter-content .bsv4_category-wrap_gtt .dropdown-menu .dropdown-item:hover {
background-color: #333333 !important;
color: #FFFFFF !important;
}
.filter-content .control .dropdown-menu .dropdown-item:checked,
.filter-content .bsv4_category-wrap_gtt .dropdown-menu .dropdown-item:checked {
background-color: #333333 !important;
color: #FFFFFF !important;
}
.filter-content .control .dropdown-menu .dropdown-item.selected,
.filter-content .bsv4_category-wrap_gtt .dropdown-menu .dropdown-item.selected {
background-color: #333333 !important;
color: #FFFFFF !important;
}
.filter-content .control .filter-option .filter-option-inner-inner,
.filter-content .bsv4_category-wrap_gtt .filter-option .filter-option-inner-inner {
text-align: left;
font-size: 14px;
font-family: OpenSans-Regular;
}
.filter-content .control .filter-option::after,
.filter-content .bsv4_category-wrap_gtt .filter-option::after {
content: "";
position: absolute;
width: 1px;
height: 100%;
background-color: #ccc;
bottom: 0px;
right: 48px;
}
.filter-content .bsv4_category-wrap_gtt .dropdown {
width: 100%;
}
.filter-content .bsv4_category-wrap_gtt .dropdown-toggle::after {
position: absolute;
top: 20px !important;
right: 20px !important;
left: unset;
}
.filter-content div.content-translate {
width: 80%;
margin: 0 auto;
}
.filter-content .bsv4_select_category_gtt {
width: 100%;
}
.filter-content .bsv4_category-wrap_gtt {
padding: 0;
}
.filter-content .bsv4_category-wrap_gtt label {
font-family: OpenSans-Bold;
}
.filter-content .bsv4_category-wrap_gtt .dropdown-toggle {
height: 42px;
}
.filter-content .control-search {
width: 100%;
position: relative;
}
.filter-content .control-search .search-input {
width: 100%;
height: 50px;
padding: 8px 50px 8px 10px;
margin-bottom: 20px;
color: #737373;
border: 1px solid #adadad;
text-align: center;
font-size: 16px;
}
.filter-content .control-search input[type=submit] {
width: 50px;
height: 50px;
background: transparent;
border: 0px;
position: absolute;
right: 0px;
top: 0px;
bottom: 0px;
z-index: 20;
}
.filter-content .control-search .svg-inline--fa {
color: #737373;
position: absolute;
right: 10px;
top: 12px;
font-size: 27px;
z-index: 1;
}
.filter-content .translate-img {
height: 24px;
cursor: pointer;
}
.filter-content .filter-about-us {
text-align: right;
}
.filter-content .filter-about-us a {
font-family: OpenSans-Regular;
color: #d11212;
}
@media screen and (max-width: 992px) {
.filter-content {
max-width: 100%;
margin: 0;
padding: 0px 10px;
}
.filter-content .translate-img {
margin: 10px;
position: absolute;
top: 50%;
right: 50%;
transform: translate(50%, -50%);
z-index: 99;
}
.filter-content div.content-translate {
width: 100%;
margin: 0;
}
.filter-content .bsv4_category {
padding: 0;
}
.filter-content .control {
display: grid !important;
position: relative;
padding: 0;
}
.filter-content .control .to-wrap {
margin-left: 0;
justify-content: unset;
}
.filter-content .control .from-wrap,
.filter-content .control .to-wrap {
padding: 15px 0px;
display: grid;
flex: 0 0 100%;
max-width: 100%;
}
.filter-content .control .from-wrap label,
.filter-content .control .to-wrap label {
padding: 10px 0px;
}
.filter-content .control .from-wrap .dropdown,
.filter-content .control .to-wrap .dropdown {
margin: 0px;
max-width: 100%;
width: auto;
}
}
.footer {
position: relative;
width: 100vw;
left: calc(-50vw + 50%);
padding: 48px 20px 16px;
background-color: #333333;
font-size: 0.938rem;
z-index: 1;
}
.footer .container {
padding: 0;
}
.footer .container .row {
margin: 0;
}
.footer .container .row .footer-col {
padding: 0 10px 15px 0;
}
.footer .container .footer-logo {
margin: 0px;
width: 100%;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-color: transparent;
-o-object-fit: cover;
object-fit: cover;
width: 4.45rem;
background-size: contain;
margin-bottom: 32px;
}
.footer .container .row .col-8 {
padding-bottom: 4px;
}
.footer .list-footer {
display: grid;
padding-bottom: 23px;
padding: 0;
font-size: 0.875rem;
}
.footer .list-footer li {
display: inline-block;
padding: 5px 35px 5px 0;
}
.footer .list-footer li a {
color: #DADADA;
}
.footer .list-footer li a:hover {
text-decoration: underline;
}
.footer .copyright-field {
padding: 20px 0 21px;
margin: 4px 0 20px;
color: #DADADA;
font-size: 0.75rem;
}
.footer .copyright-field .col :last-child {
padding-right: 0;
}
.footer .copyright-field .copyright-text {
padding-right: 0;
padding-left: 0;
}
.footer .copyright-field .copyright-text:first-child {
text-align: left;
}
.footer .social-footer {
display: flex;
justify-content: flex-end;
border-top: 2px solid #979797;
padding: 25px 10px 20px;
}
.footer .social-footer a {
text-decoration: none;
color: #DADADA;
height: 80%;
}
.footer .social-footer a:hover {
opacity: 0.9;
}
.footer .social-footer a:first-child .social-img {
margin: 0;
}
.footer .social-footer .icon-footer:first-child {
padding-left: 10px;
padding-right: 6px;
}
.footer .social-footer .social-img {
filter: url("data:image/svg+xml;utf8,#grayscale");
filter: brightness(0) invert(0.6);
filter: #ffffff;
margin-left: 15px;
}
@media screen and (min-width: 425px) {
.footer .container .row {
justify-content: center;
}
.footer .copyright-field {
margin-bottom: 0;
}
}
@media screen and (max-width: 767px) {
.footer .container .row {
position: relative;
width: calc(100vw - 20px);
left: calc(-50vw + 50% + 10px);
}
.footer .container .row .footer-col {
padding-left: 10px;
padding-right: 10px;
margin-bottom: calc(1.5rem - 5px);
}
.footer .social-footer {
display: flex;
justify-content: flex-start;
padding: 23px 10px 19px;
}
.footer .copyright-field {
padding-bottom: 10px;
padding-right: 10px;
padding-left: 10px;
margin-bottom: calc(1.5rem - 10px) !important;
}
.footer .copyright-field .copyright-text {
text-align: left;
}
.footer .copyright-field .copyright-text:first-child {
padding-bottom: 10px;
}
}
@media screen and (min-width: 768px) {
.footer .container .row {
margin-bottom: calc(1.5rem - 10px);
}
.footer .list-footer {
display: flex;
}
.footer .copyright-field {
margin-bottom: 0;
border-top: 1px groove #F0F0F0;
}
.footer .copyright-field .copyright-text {
text-align: right;
}
.footer .social-footer {
flex-wrap: wrap;
border: none;
padding: 0;
}
.footer .social-footer a {
height: auto;
}
}
@media screen and (min-width: 1024px) {
.footer .container {
padding: 0 15px;
}
.footer .container .row {
margin-bottom: calc(1.5rem - 10px);
}
.footer .container .row .footer-col {
padding: 0;
padding-bottom: 10px;
}
.footer .container .copyright-field {
padding-top: 23px;
padding-bottom: 40px;
margin: 0;
margin-top: 8px;
font-size: 0.813rem;
}
.footer .container .social-footer {
display: flex;
justify-content: flex-end;
}
}
.header {
position: -webkit-sticky !important;
position: sticky !important;
z-index: 1000;
transition: top 0.3s ease-in-out;
}
.header .identity {
position: relative;
width: 100vw;
left: calc(-50vw + 50%);
background-color: #FFFFFF;
box-shadow: 0px 4px 9px 0px rgba(0, 0, 0, 0.1);
}
.header .identity .container {
padding: 0;
}
.header .identity .row {
width: 100%;
margin-left: 0;
justify-content: space-between;
}
.header .identity .row .identity-right {
padding: 0;
}
.header .identity .row .logo-header {
display: flex;
justify-content: space-between;
width: 100%;
padding: 0;
}
.header .identity .row .logo-header .img-logo {
padding: 0 12px;
}
.header .identity .img-logo {
max-height: 60px;
}
.header .identity .social-link {
padding: 8px 12px;
padding-bottom: 11px;
}
.header .identity .social-link .row {
flex-wrap: nowrap;
}
.header .identity .social-link .social-link-child {
padding: 5px 15px;
}
.header .identity .social-link .social-link-child:hover .social-img {
opacity: 0.9;
}
.header .identity .social-link .social-link-child.border-right {
border: none !important;
}
.header .identity .social-link .social-link-child.border-right:not(:last-child)::after {
content: '';
border-right: 1px solid #f0f0f0;
position: absolute;
right: 0;
height: 40px;
top: 50%;
transform: translateY(-50%);
}
.header .navbar-header {
display: none;
}
.header .res-hide {
display: none;
padding-right: 0;
}
.header .navbar {
padding: 0;
}
.header .navbar .navbar-toggler {
width: 80px;
border: none;
}
.header .navbar .search-btn {
width: 80px;
height: 80px;
border: none;
}
.header .navbar .search {
background-color: #FFFFFF;
}
.header .navbar .search:hover {
background-color: #FFFFFF;
}
.header .navbar .search .icon-search {
color: #333333;
}
.header .weather {
width: 100%;
}
.header .weather .weather-content .day {
font-size: 1.125rem;
}
.header .weather .weather-content .date {
margin-top: 2px;
font-size: 0.875rem;
}
.header .weather .weather-content .temp {
font-size: 1rem;
}
.weather {
position: relative;
background-color: #495AA3;
color: #FFFFFF;
}
.weather .weather-img {
position: absolute;
top: 0;
right: 0;
height: 100%;
z-index: 0;
}
.weather .weather-left {
flex: 4;
margin: 15px 25px 16px;
z-index: 1;
}
.weather .weather-right {
line-height: 23px;
flex: 5;
margin: 18px 25px 14px 0;
align-items: flex-end;
z-index: 1;
}
.weather .weather-right .link-weather {
text-decoration: underline;
-webkit-text-decoration-color: #FFFFFF;
text-decoration-color: #FFFFFF;
}
.weather .weather-right .link-weather:hover {
text-decoration: none;
}
.weather .weather-right .unique {
font-size: 25px;
margin-right: 9px;
}
.weather .weather-right .psi-infor {
margin-right: 5px;
}
.weather .weather-content {
white-space: nowrap;
display: flex;
flex-direction: column;
}
.weather i.unique {
font-size: 25px;
margin-right: 5px;
}
.fa-cloud-sun {
margin-right: 6px;
}
.close-btn {
position: relative;
}
.close-btn .close-icon {
height: 2px;
width: 26px;
background-color: #333333;
display: block;
left: calc(50% - (26px / 2));
position: absolute;
transform-origin: center;
transition-duration: 86ms;
transition-property: background-color, opacity, transform;
transition-timing-function: ease-out;
}
.close-btn .close-icon:first-child {
top: calc(50% - 9px);
}
.close-btn .close-icon:last-child {
bottom: calc(50% - 9px);
}
.close-btn.active {
transition: all 0.5s ease-in-out;
background-color: #D81800;
border-radius: 0;
}
.close-btn.active .close-icon {
background-color: #FFFFFF;
}
.close-btn.active .close-icon:first-child {
transform: translateY(8px) rotate(45deg);
}
.close-btn.active .close-icon:nth-child(2) {
display: none;
}
.close-btn.active .close-icon:last-child {
transform: translateY(-8px) rotate(-45deg);
}
.input-group {
box-shadow: 0 8px 8px rgba(0, 0, 0, 0.1);
z-index: 999;
}
.menuField {
background-color: #FFFFFF;
height: 100vh;
width: 100vw;
left: calc(-50vw + 50%);
overflow-y: scroll;
z-index: 999;
}
.menuField .navbar-nav {
padding-bottom: 40vh;
overflow-y: scroll;
}
.menuField .navbar-nav .nav-item {
width: 100vw;
}
.menuField .navbar-nav input {
font-size: 1rem;
padding-top: 0.75rem;
padding-bottom: 0.75rem;
}
.menuField .navbar-nav input::-webkit-input-placeholder {
opacity: 0.4;
}
.menuField .navbar-nav .form-control {
padding: 12px 50px 12px 20px;
border: none;
height: auto;
}
.menuField .navbar-nav .form-control :focus {
border: none;
box-shadow: none;
}
.menuField .navbar-nav .rounded {
border-radius: 0;
}
.menuField .navbar-nav .rounded .input-group-text {
position: absolute;
padding: 0;
right: 10px;
top: 50%;
transform: translateY(-50%);
background-color: #FFFFFF;
color: #D81800;
z-index: 4;
}
.rounded,
.form-control {
border-radius: 0 !important;
}
.search-infor {
text-align: center;
width: auto;
}
.search-infor .title-search {
padding: 16px 0;
margin-bottom: 0;
line-height: 1.5;
border-bottom: solid 1px grey;
margin: 0 20px;
}
.search-infor .search-link .icon {
max-width: 16px;
max-height: 16px;
}
.search-infor ul {
margin: 0 20px;
list-style-type: none;
-webkit-padding-start: 0;
padding-inline-start: 0;
}
.search-infor ul li {
padding: 12px 0;
}
.search-infor ul li .search-link {
color: #333333;
}
.search-infor ul li .search-link:hover {
color: #D81800;
}
.search-infor ul li:not(:first-child) {
border-top: solid 1px #DADADA;
}
.navbar-light .navbar-toggler {
color: #000000;
}
.navbar-header {
width: 100vw;
position: relative;
left: calc(-50vw + 50%);
padding: 0;
background-color: #D81800;
font-size: 15px;
font-weight: 600 !important;
text-transform: uppercase;
box-shadow: 0px 4px 9px 0px rgba(0, 0, 0, 0.1);
}
.navbar-header .container {
display: flex;
flex-wrap: nowrap;
}
.navbar-header .navbar-group {
position: relative;
height: 80px;
flex-wrap: nowrap;
flex: 1;
}
.navbar-header .navbar-group .nav {
position: relative;
height: 100%;
}
.navbar-header .navbar-group.center {
background-color: #BA2412;
}
.navbar-header .navbar-group.right {
background-color: #8B1C0E;
}
.navbar-header .navbar-group.right .nav {
flex-wrap: nowrap;
}
.nav-item {
position: relative;
padding: 20px 15px;
height: 100%;
}
.nav-item.dropdown {
cursor: pointer;
}
.nav-item.dropdown:hover {
background-color: #A32010;
}
.dropdown:hover .dropdown-menu.nav-menu {
top: 97%;
display: block;
border-radius: 0;
box-shadow: 0 8px 8px rgba(0, 0, 0, 0.1);
}
.dropdown:hover .dropdown-menu.nav-menu .dropdown-item {
position: relative;
padding: 10px 20px;
min-width: 255px;
font-size: 0.875rem;
font-weight: 600;
border: 1px solid #f0f0f0;
}
.dropdown:hover .dropdown-menu.nav-menu .dropdown-item.active {
background-color: #FFFFFF;
color: #333333;
}
.dropdown:hover .dropdown-menu.nav-menu .dropdown-item:active {
background-color: #FFFFFF;
color: #333333;
}
.dropdown:hover .dropdown-menu.nav-menu .dropdown-item:hover::before {
border-left: 5px solid #d81800;
content: '';
position: absolute;
left: 0;
height: 100%;
top: 0;
}
.dropdown:hover .dropdown-menu.nav-menu.two-col {
min-width: 514px;
display: flex;
flex-wrap: wrap;
}
.dropdown:hover .dropdown-menu.nav-menu.two-col .dropdown-item {
width: 50%;
white-space: normal;
}
li.nav-link {
padding: 0;
}
.nav-topic .ctg-header-btn.active .nav-link::after {
margin-top: -0.2em;
transform: rotate(-225deg);
border-color: #D81800;
}
.nav-topic .nav-link::after {
margin-top: -0.375em;
right: 1.125em;
border: 3px solid transparent;
border-color: #333333;
border-radius: 2px;
border-right: 0;
border-top: 0;
content: " ";
display: block;
height: 0.625em;
margin-top: -0.4375em;
pointer-events: none;
position: absolute;
top: 50%;
transform: rotate(-45deg);
transform-origin: center;
width: 0.625em;
}
.nav-link.dropdown-toggle {
width: 100%;
padding: 21px 40px 21px 15px !important;
position: relative;
}
.nav-link.dropdown-toggle::after {
margin-top: -0.375em;
right: 1.125em;
border: 3px solid transparent;
border-color: #fff;
border-radius: 2px;
border-right: 0;
border-top: 0;
content: " ";
display: block;
height: 0.625em;
margin-top: -0.4375em;
pointer-events: none;
position: absolute;
top: 50%;
transform: rotate(-45deg);
transform-origin: center;
width: 0.625em;
}
.nav-link {
color: #FFFFFF;
padding: 21px 15px;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
position: relative;
}
.nav-link.dropdown-toggle {
padding-left: 0;
padding-right: 0;
}
.nav-link.dropdown-toggle .css {
padding-right: 3px;
}
.nav-link.border-l::before {
content: '';
border-left: 1px solid #ffffff;
opacity: 0.5;
height: 26px;
top: 50%;
margin-top: -13px;
position: absolute;
left: 0;
z-index: 1;
}
.border-small {
height: 32%;
border-left: 1px solid #ffffff;
opacity: 0.5;
}
.nav-link:hover {
color: #FFFFFF;
background-color: #A32010;
}
.navbar-right .nav .nav-link:hover {
color: #FFFFFF;
background-color: #A32010;
}
.nav-menu {
z-index: 6;
padding: 0;
border: none;
}
.nav-menu:hover {
display: block;
}
.nav-menu .dropdown-item:hover {
background-color: #FFFFFF;
}
.dropdown-toggle::after {
display: none;
}
.nav-link.search-nav-btn .icon {
margin: 0;
}
.nav-link.search-nav-btn .icon:last-child {
font-size: 23px;
}
.nav-link .icon {
margin-left: 12px;
margin-right: -2px;
font-size: 1rem;
}
.dropdown-menu .row {
flex-wrap: nowrap;
}
.dropdown-menu.dropdown-search {
display: none;
width: calc(100% - 20px);
left: 10px;
min-width: 12rem;
padding-top: 0;
padding-bottom: 0;
position: absolute;
top: calc(100% - 20px);
z-index: 20;
border: none;
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px;
border-top: 2px solid #f0f0f0;
box-shadow: 0 8px 8px rgba(0, 0, 0, 0.1);
}
.dropdown-menu.dropdown-search.s-mobile {
top: 100%;
width: 100%;
left: 0;
}
.dropdown-menu.dropdown-search.active {
display: block;
}
.dropdown-menu.dropdown-search .dropdown-content {
background-color: #ffffff;
border-radius: 0;
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
padding-bottom: 0.5rem;
padding-top: 0.5rem;
}
.dropdown-menu.dropdown-search .dropdown-content .dropdown-item {
overflow-x: hidden;
text-overflow: ellipsis;
padding: 15px 20px;
border-bottom: 1px solid #f0f0f0;
text-align: inherit;
white-space: nowrap;
width: 100%;
color: #979797;
display: block;
font-size: 0.875rem;
line-height: 1.5;
position: relative;
text-transform: uppercase;
font-weight: 600;
}
.dropdown-menu.dropdown-search .dropdown-content .dropdown-item:last-child {
padding: 0;
}
.dropdown-menu.dropdown-search .dropdown-content .dropdown-item:hover {
color: #000000;
background-color: whitesmoke;
}
.dropdown-menu.dropdown-search .dropdown-content .dropdown-item a {
cursor: pointer;
color: #000000;
font-weight: 700;
font-size: 0.875rem;
overflow-x: hidden;
text-overflow: ellipsis;
padding: 15px 20px;
border-bottom: 1px solid #f0f0f0;
display: block;
font-weight: bold;
}
.icon-search {
margin: 0;
padding: 0;
font-size: 1.5rem;
pointer-events: none;
}
.ctg-header-btn.active .icon {
color: #D81800;
transform: scaleY(-1);
}
.ctg-header-dropdown,
.menuDropdown,
.searchDropdown {
display: none;
}
.ctg-header-dropdown.active,
.menuDropdown.active,
.searchDropdown.active {
display: block;
}
.ctg-header-btn {
width: 100%;
border: none;
padding: 0;
display: flex;
align-items: center;
justify-content: space-between;
}
.ctg-header-btn span {
width: 100%;
}
.ctg-header-btn span a {
line-height: 1.5;
width: 100%;
}
.ctg-header-dropdown ul li {
border: 1px solid #f0f0f0;
}
.ctg-header-dropdown ul li .nav-link {
text-transform: uppercase;
padding: 20px 30px !important;
color: #FFFFFF !important;
font-size: 0.875rem;
}
.ctg-header-dropdown ul li .nav-link:hover {
background-color: #8B1C0E !important;
color: #FFFFFF;
}
.ctg-header-dropdown ul li .nav-link:hover::after {
position: absolute;
content: '';
top: 0;
left: 0;
height: 100%;
width: 5px;
background-color: #d81800;
}
.menuDropdown .nav-item {
text-transform: uppercase;
}
.menuDropdown .nav-item.active .icon {
color: #D81800;
transform: scaleY(-1);
}
.menuDropdown .nav-item .icon {
position: absolute;
right: 0;
font-size: 14px;
padding-right: 16px;
}
.ctg-header-dropdown {
padding-top: 10px;
padding-left: 20px;
}
.topic-img {
margin: 0px;
width: 100%;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-color: transparent;
-o-object-fit: cover;
object-fit: cover;
height: 100%;
}
.topic-title {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.topic-title:hover {
color: #FFFFFF;
}
.topic-title span {
text-align: left;
position: absolute;
top: 16px;
left: 0;
padding: 0 16px;
color: #FFFFFF;
font-size: 0.875rem;
font-weight: 600;
text-transform: uppercase;
}
.topic-title span::after {
position: absolute;
top: 0;
left: 0;
content: '';
width: 4px;
height: 100%;
background-color: #D81800;
}
.ctg-header-dropdown {
max-height: 430px;
}
.ctg-header-dropdown .swiper {
width: auto;
height: 100%;
margin-left: auto;
margin-right: auto;
}
.ctg-header-dropdown .swiper-wrapper {
height: 430px;
}
.ctg-header-dropdown .swiper-slide {
text-align: center;
font-size: 18px;
background: #fff;
width: 198px !important;
height: 198px !important;
margin-bottom: 10px;
/* Center slide text vertically */
display: flex;
justify-content: center;
align-items: center;
}
.search-nav-btn {
width: 100%;
height: 100%;
background-color: transparent;
border: none;
height: 80px;
width: 80px;
}
.search-nav-btn.active {
background-color: #a32010;
}
@-webkit-keyframes spinAround {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes spinAround {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.search-nav-field {
position: absolute;
z-index: 1;
background-color: #d9d9d9;
width: 100%;
}
.search-nav-field.is-spinning .form-outline::after {
-webkit-animation: spinAround 500ms infinite linear;
animation: spinAround 500ms infinite linear;
border: 2px solid #f0f0f0;
border-radius: 290486px;
border-right-color: transparent;
border-top-color: transparent;
content: "";
display: block;
height: 1em;
width: 1em;
position: absolute !important;
right: 4rem;
z-index: 4;
}
.search-nav-field .form-outline {
position: relative;
width: calc(100% - 80px);
padding: 0 10px;
}
.search-nav-field .form-outline .form-control {
padding: 12px 28px 12px 20px;
width: 100%;
border: none;
height: auto;
}
.search-nav-field .form-outline .form-control:focus {
box-shadow: none;
border: none;
}
.search-nav-field .form-outline .form-control::-moz-placeholder {
opacity: 0.5;
}
.search-nav-field .form-outline .form-control::placeholder {
opacity: 0.5;
}
.search-nav-field .form-outline #form1::-ms-clear {
width: 0;
height: 0;
display: none;
}
.search-nav-field button {
width: 80px;
height: 80px;
border-radius: 0;
border: none;
background-color: #8B1C0E;
}
.search-nav-field button:hover {
background-color: #A32010;
}
.search-nav-field button:active {
border: none !important;
background-color: #8B1C0E !important;
box-shadow: none !important;
}
.search-nav-field button:focus {
border: none;
background-color: #8B1C0E;
box-shadow: none;
}
.search-nav-delete {
position: absolute;
-webkit-appearance: none;
background-color: rgba(0, 0, 0, 0.2);
border: none;
border-radius: 290486px;
cursor: pointer;
pointer-events: auto;
display: inline-block;
flex-grow: 0;
flex-shrink: 0;
font-size: 0;
height: 20px;
max-height: 20px;
max-width: 20px;
min-height: 20px;
min-width: 20px;
outline: none;
vertical-align: top;
width: 20px;
right: 30px;
z-index: 99;
}
.search-nav-delete.sub-nav {
right: 50px;
top: 15px;
}
.search-nav-delete::before {
height: 2px;
width: 50%;
background-color: #ffffff;
content: "";
display: block;
left: 50%;
position: absolute;
top: 50%;
transform: translateX(-50%) translateY(-50%) rotate(45deg);
transform-origin: center center;
}
.search-nav-delete::after {
height: 50%;
width: 2px;
background-color: #ffffff;
content: "";
display: block;
left: 50%;
position: absolute;
top: 50%;
transform: translateX(-50%) translateY(-50%) rotate(45deg);
transform-origin: center center;
}
.menuField {
position: absolute;
width: 100%;
}
.menuField .navbar-nav {
position: relative;
background-color: #FFFFFF;
}
.menuField .navbar-nav .nav-item {
padding: 0;
}
.menuField .navbar-nav .nav-item .nav-link {
padding: 19px 40px 19px 20px;
color: #333333;
font-weight: 600;
font-size: 0.938rem;
justify-content: flex-start;
}
.menuField .navbar-nav .nav-item .nav-link:hover {
color: #D81800;
background-color: #FFFFFF;
}
.menuField .navbar-nav .social-menu {
padding: 30px 20px;
}
.menuField .navbar-nav .social-menu .nav-link {
padding: 0;
}
.menuField .navbar-nav .social-menu .social-item {
display: flex;
flex-wrap: wrap;
}
.menuField .navbar-nav .social-menu .social-item .social-img {
filter: url("data:image/svg+xml;utf8,#grayscale");
filter: grayscale(1);
filter: gray;
margin: 15px 15px 0 0;
}
.menuField .navbar-nav .social-menu .social-item .nav-link {
font-size: 1.625rem;
padding: 15px 15px 0 0;
}
.menuField .navbar-nav .search-wrap {
padding: 10px;
background-color: #D81800;
width: 100%;
}
.menuField .navbar-nav .search-infor {
width: 100%;
}
.menuField.ctg-header-dropdown {
position: relative;
}
.menuField.searchDropdown {
width: 100vw;
}
.menuField.menuDropdown {
width: 100vw;
}
.headernavSwiper .swiper-wrapper {
flex-direction: column;
flex-wrap: wrap;
}
@media screen and (min-width: 768px) {
.header .identity .row {
width: 100%;
margin-left: 0;
justify-content: space-between;
}
.header .identity .row .col-lg-2 {
max-width: 100%;
flex: auto;
}
.header .identity .row .col-lg-10 {
max-width: 100%;
flex: auto;
}
.header .identity .row .identity-right {
padding: 0;
}
.header .identity .row .logo-header {
display: flex;
justify-content: space-between;
width: 100%;
padding: 0;
}
.header .identity .row .logo-header .img-logo {
padding: 0 12px;
}
.header .identity .navbar .search {
background-color: #FFFFFF;
}
.header .identity .navbar .search:hover {
background-color: #FFFFFF;
}
.header .identity .navbar .search .icon-search {
color: #333333;
}
.header .identity .weather .weather-content .day {
font-size: 1.125rem;
}
.header .identity .weather .weather-content .unique {
font-size: 25px;
}
.header .identity .weather .weather-content .date {
font-size: 0.875rem;
}
.header .identity .weather .weather-content .temp {
font-size: 1rem;
}
.header .navbar-header {
display: none;
}
.header .res-hide {
display: none;
padding-right: 0;
}
}
@media screen and (min-width: 1024px) {
.header {
box-shadow: none;
}
.header .identity .container {
padding: 0 15px;
}
.header .identity .row .col-lg-2 {
flex: 0 0 16.666667%;
max-width: 16.666667%;
}
.header .identity .row .col-lg-10 {
flex: 0 0 83.333333%;
max-width: 83.333333%;
}
.header .identity .row .logo-header {
padding: 0;
}
.header .identity .row .logo-header .img-logo {
padding: 0;
}
.header .identity .navbar {
display: none;
}
.header .identity .weather {
position: relative;
display: flex !important;
width: auto;
}
.header .identity .weather .weather-content .day {
font-size: 1.375rem;
}
.header .identity .weather .weather-content .unique {
font-size: 25px;
}
.header .identity .weather .weather-content .date {
font-size: 0.875rem;
}
.header .identity .weather .weather-content .temp {
font-size: 1.125rem;
}
.header .navbar-header {
display: block;
box-shadow: 0px 4px 9px 0px rgba(0, 0, 0, 0.1);
}
.header .res-hide {
display: flex;
}
}
@media screen and (max-width: 1023px) {
.menuDropdown .nav-item.active .nav-menu {
display: block;
}
.menuDropdown .nav-item.active .nav-link.dropdown-toggle::after {
margin-top: -0.2em;
transform: rotate(-225deg);
border-color: #D81800;
}
.menuDropdown .nav-item .nav-menu {
background-color: #D81800;
}
.menuDropdown .nav-item .nav-menu .dropdown-item {
background-color: transparent;
color: white;
padding: 20px 30px;
border: 1px solid #f0f0f0;
text-transform: uppercase;
font-weight: 600;
line-height: 1.25rem;
font-size: 0.875rem;
}
.nav-link.dropdown-toggle {
padding-left: 20px !important;
}
.nav-link.dropdown-toggle::after {
border-color: #333333;
}
}
.hide-nav-search {
display: none;
}
@media screen and (min-width: 1216px) {
.hide-nav-search {
display: flex;
}
}
.most-popular-field {
margin: 16px 0 32px;
}
.most-popular-field .title {
text-align: center;
font-size: 1.5rem;
font-weight: 700;
margin: 32px 0 16px;
}
.most-popular-field .popular-link-list {
display: grid;
counter-reset: counter;
color: #333333;
}
.most-popular-field .popular-link-list .popular-link {
display: none;
padding: 20px 0;
border-top: 1px solid #000000;
color: #333333;
font-size: 1.125rem;
counter-increment: counter;
margin-left: 10px;
}
.most-popular-field .popular-link-list .popular-link:visited span {
color: #551A8B;
}
.most-popular-field .popular-link-list .popular-link:hover {
color: #D81800 !important;
text-decoration: none;
}
.most-popular-field .popular-link-list .popular-link:hover span {
color: #D81800 !important;
}
.most-popular-field .popular-link-list .popular-link::before {
line-height: 1;
content: counter(counter);
font-size: 44px;
font-weight: 700;
flex: 0 0 40px;
display: inline-flex;
}
.most-popular-field .popular-link-list .popular-link:nth-child(-n + 5) {
grid-column: 1;
display: flex;
margin: 0;
}
.most-popular-field .popular-link-list .popular-link:nth-child(1) {
grid-row: 1;
}
.most-popular-field .popular-link-list .popular-link:nth-child(2) {
grid-row: 2;
}
.most-popular-field .popular-link-list .popular-link:nth-child(3) {
grid-row: 3;
}
.most-popular-field .popular-link-list .popular-link:nth-child(4) {
grid-row: 4;
}
.most-popular-field .popular-link-list .popular-link:nth-child(5) {
grid-row: 5;
}
.most-popular-field .popular-link-list .popular-link:nth-child(6) {
grid-row: 1;
grid-column: 2;
}
.most-popular-field .popular-link-list .popular-link:nth-child(7) {
grid-row: 2;
grid-column: 2;
}
.most-popular-field .popular-link-list .popular-link:nth-child(8) {
grid-row: 3;
grid-column: 2;
}
.most-popular-field .popular-link-list .popular-link:nth-child(9) {
grid-row: 4;
grid-column: 2;
}
.most-popular-field .popular-link-list .popular-link:nth-child(10) {
grid-row: 5;
grid-column: 2;
}
@media screen and (min-width: 768px) {
.most-popular-field .popular-link-list {
grid-template-columns: 1fr 1fr;
}
.most-popular-field .popular-link-list .popular-link {
display: flex;
}
.most-popular-field .popular-link-list .popular-link::before {
flex: 0 0 55px;
}
.most-popular-field .popular-link-list .popular-link:nth-child(-n + 5) {
margin: 0 10px 0 0;
}
}
@media screen and (min-width: 1024px) {
.most-popular-field .title {
font-size: 2rem;
margin: 32px 0 16px;
}
.most-popular-field .popular-link-list .popular-link {
font-size: 1.375rem;
}
}
.notice {
position: -webkit-sticky;
position: sticky;
width: 100vw;
margin-left: calc(-50vw + 50%);
top: 0;
background-color: #F0F0F0;
transition: top 0.3s ease-in-out;
z-index: 1000;
}
.notice .container {
padding: 5px 20px;
}
.notice .link-banner:hover {
text-decoration: none;
}
.text-banner {
color: #333333;
font-size: 0.75rem;
}
.icon-sglion {
margin-right: 5px;
color: #D81800;
vertical-align: middle;
}
@media screen and (min-width: 1024px) {
.notice {
padding: 0;
}
.notice .container {
padding: 0 15px;
}
}
.pagination-container {
width: 100%;
margin-bottom: 40px;
}
.pagination-container .row {
margin: 0;
padding: 0;
width: 100%;
justify-content: center;
}
.pagination-container .row div {
margin: 0;
padding: 0;
display: flex;
justify-content: space-between;
}
.pagination-container .row div .pagination-items {
background-color: #F0F0F0;
width: 100%;
}
.pagination-container .row .desktop-pagination {
display: none;
}
.pagination-container .row .mobile-pagination {
display: flex;
}
.pagination-container .row .mobile-pagination .pagination-item,
.pagination-container .row .mobile-pagination .pagination-item-video {
padding: 0.5em 0;
}
.pagination-container .row .sgpc-pagination {
display: none;
}
.pagination-container .row .video-pagination {
display: none !important;
}
.pagination-container.sgpc-page {
display: flex;
justify-content: center;
}
.pagination-container.sgpc-page .row .sgpc-pagination {
display: block !important;
}
.pagination-container.sgpc-page .row .desktop-pagination {
display: none !important;
}
.pagination-container.sgpc-page .row .mobile-pagination {
display: none !important;
}
.pagination-container.sgpc-page .row .video-pagination {
display: none !important;
}
.pagination-container.video-feature-page {
padding-top: 2rem;
margin-bottom: 0;
}
.pagination-container.video-feature-page .row .sgpc-pagination {
display: none !important;
}
.pagination-container.video-feature-page .row .desktop-pagination {
display: none !important;
}
.pagination-container.video-feature-page .row .mobile-pagination {
display: none !important;
}
.pagination-container.video-feature-page .row .video-pagination {
display: block !important;
}
.pagination-container .sgpc-pagination {
background-color: #f0ebe6 !important;
justify-content: center !important;
display: flex;
}
.pagination-container .sgpc-pagination .pagination-item,
.pagination-container .sgpc-pagination .pagination-item-video {
display: flex;
justify-content: center;
align-items: center;
position: relative;
margin: 0;
padding: 0;
margin-right: 2px;
height: 42px;
min-width: 23px;
background-color: #D8D5D0;
background-position: 0 0;
overflow: hidden;
font-size: 12px;
}
.pagination-container .sgpc-pagination .pagination-item:hover,
.pagination-container .sgpc-pagination .pagination-item-video:hover {
background-color: #D81800;
color: #FFFFFF;
}
.pagination-container .sgpc-pagination .pagination-item:hover img,
.pagination-container .sgpc-pagination .pagination-item-video:hover img {
filter: brightness(0) invert(1);
}
.pagination-container .sgpc-pagination .pagination-item.active,
.pagination-container .sgpc-pagination .pagination-item-video.active {
background-color: #D81800;
color: #FFFFFF;
}
.pagination-container .sgpc-pagination .pagination-item.active img,
.pagination-container .sgpc-pagination .pagination-item-video.active img {
filter: brightness(0) invert(1);
}
.pagination-container .sgpc-pagination .pagination-item.dot,
.pagination-container .sgpc-pagination .pagination-item-video.dot {
cursor: pointer !important;
}
.pagination-container .sgpc-pagination .pagination-items {
background-color: #f0ebe6 !important;
justify-content: center;
flex-wrap: nowrap;
}
.pagination-container .sgpc-pagination .pagination-items .nav img {
max-width: none;
position: absolute;
top: 0;
left: -5px;
}
.pagination-container .sgpc-pagination .pagination-items .nav:nth-child(2) img {
left: calc(-44px);
}
.pagination-container .sgpc-pagination .pagination-items .nav:nth-last-child(2) img {
left: calc(-42px * 2);
}
.pagination-container .sgpc-pagination .pagination-items .nav:last-child img {
left: calc(-42px * 3);
}
.pagination-container .pagination-items {
flex-wrap: nowrap;
}
.pagination-container .pagination-item,
.pagination-container .pagination-item-video {
padding: 0.5em;
margin: 4px;
justify-content: center;
color: #333333;
}
.pagination-container .pagination-item.next,
.pagination-container .pagination-item-video.next,
.pagination-container .pagination-item.prev,
.pagination-container .pagination-item-video.prev {
display: flex;
align-items: center;
flex-wrap: nowrap;
color: #D81800;
font-weight: 700;
}
.pagination-container .pagination-item.next .icon,
.pagination-container .pagination-item-video.next .icon,
.pagination-container .pagination-item.prev .icon,
.pagination-container .pagination-item-video.prev .icon {
padding: 0 6px;
color: #333333;
font-weight: 700;
}
.pagination-container .pagination-item.next,
.pagination-container .pagination-item-video.next {
justify-content: flex-end;
}
.pagination-container .pagination-item.prev,
.pagination-container .pagination-item-video.prev {
justify-content: flex-start;
}
.pagination-container .pagination-item.active,
.pagination-container .pagination-item-video.active {
background-color: #D81800;
color: #FFFFFF;
}
.pagination-container .pagination-item.text,
.pagination-container .pagination-item-video.text {
font-weight: 700;
white-space: nowrap;
}
.pagination-container .pagination-item.disable,
.pagination-container .pagination-item-video.disable {
opacity: 0.5;
cursor: not-allowed;
}
.pagination-container .pagination-item.disable:hover,
.pagination-container .pagination-item-video.disable:hover {
border: none !important;
}
.pagination-container .pagination-item:hover,
.pagination-container .pagination-item-video:hover {
text-decoration: none;
}
.pagination-container .video-pagination .pagination-item.active,
.pagination-container .video-pagination .pagination-item-video.active {
background-color: transparent;
color: #D81800;
}
@media screen and (max-width: 370px) {
.pagination-container .pagination-items {
justify-content: center;
flex-wrap: wrap;
}
}
@media screen and (max-width: 400px) {
}
@media screen and (max-width: 767px) {
.pagination-container.pagination-filter .row div .pagination-items {
align-items: center;
justify-content: center;
flex-wrap: wrap;
}
}
@media screen and (min-width: 768px) {
.pagination-container .row .sgpc-pagination {
background-color: #FFFFFF !important;
}
.pagination-container .row .sgpc-pagination .pagination-items {
background-color: #FFFFFF !important;
}
.pagination-container.video-feature-page .row .video-pagination {
display: none !important;
}
.pagination-container .pagination-item,
.pagination-container .pagination-item-video {
min-width: 2.5em;
}
}
@media screen and (min-width: 992px) {
.pagination-container .sgpc-pagination .pagination-item {
min-width: 40px;
}
.pagination-container .sgpc-pagination .pagination-items .nav img {
position: absolute;
top: 0;
left: 0;
}
.pagination-container .sgpc-pagination .pagination-items .nav:nth-child(2) img {
left: -39px;
}
.pagination-container .sgpc-pagination .pagination-items .nav:nth-last-child(2) img {
left: calc(-39px * 2);
}
.pagination-container .sgpc-pagination .pagination-items .nav:last-child img {
left: calc(-39px * 3);
}
}
@media screen and (min-width: 1024px) {
.pagination-container {
padding: 0;
}
.pagination-container .row div {
justify-content: center;
}
.pagination-container .row .desktop-pagination {
display: flex;
}
.pagination-container .row .mobile-pagination {
display: none;
}
.pagination-container .pagination-items .pagination-item,
.pagination-container .pagination-items .pagination-item-video {
padding: 8px;
display: flex;
}
.pagination-container .pagination-items .pagination-item:hover,
.pagination-container .pagination-items .pagination-item-video:hover {
padding: 7px;
border: 1px solid #DADADA;
}
.pagination-container .pagination-items .pagination-item.disable:hover,
.pagination-container .pagination-items .pagination-item-video.disable:hover {
padding: 8px;
border: none !important;
}
.pagination-container .pagination-items .pagination-item.dot:hover,
.pagination-container .pagination-items .pagination-item-video.dot:hover {
cursor: context-menu;
padding: 8px;
border: none;
}
.pagination-container .pagination-items .pagination-item.active:hover,
.pagination-container .pagination-items .pagination-item-video.active:hover {
padding: 8px;
border: none;
}
}
.breadcrumbs-container {
margin: 16px 0 32px;
}
.breadcrumbs-container .link-item {
color: #979797;
}
.breadcrumbs-container .link-item:hover {
color: #333333;
text-decoration: none;
}
.breadcrumbs-container .slash {
color: #979797;
padding: 0 6px;
}
.breadcrumbs-container .current-page {
font-weight: 600;
}
.navigation {
position: fixed;
display: none;
justify-content: space-between;
width: 100vw;
max-width: 100%;
pointer-events: none;
top: 50%;
left: 0;
z-index: 10000;
}
.navigation .navi-btn-item {
position: relative;
z-index: 100;
background-color: #BA2412;
width: 50px;
transition: all 1s ease;
display: flex;
align-items: center;
flex-wrap: nowrap;
pointer-events: all;
}
.navigation .navi-btn-item div {
margin-left: 10px;
width: 180px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: inline-block;
line-height: 1.2;
transition: all 1s ease-in;
color: #D81800;
font-size: 1.125rem;
}
.navigation .navi-btn-item div .left {
float: left;
}
.navigation .navi-btn-item div .right {
float: right;
}
.navigation .navi-btn-item:hover {
width: 242px;
background-color: #FFFFFF;
border: 1px solid #D81800;
text-decoration: none;
}
.navigation .navi-btn-item:hover svg {
color: #D81800;
}
.navigation .navi-btn-item:hover span {
color: #D81800;
}
.navigation .navi-btn-item.right {
justify-content: flex-end;
}
.navigation .navi-btn-item svg {
font-size: 20px;
color: #FFFFFF;
}
.navigation .navi-btn-item svg.left {
padding: 11px 16px;
}
.navigation .navi-btn-item svg.right {
padding: 11px 16px;
}
@media screen and (min-width: 1024px) {
.navigation {
display: flex;
}
}
.expla {
float: center;
display: flex;
justify-content: center;
margin-top: -10px;
margin-bottom: 20px;
}
.expla .row {
width: 100%;
justify-content: center;
}
.expla .row div {
padding: 0;
}
.expla .dropdown-toggle {
background-color: #FFFFFF;
color: #333333;
}
.expla .dropdown-menu {
display: none;
margin: 0;
}
.expla .dropdown-menu .dropdown-item {
font-size: 0.938rem;
padding: 10px 20px 10px 24px;
border-bottom: 1px solid #F0F0F0;
}
.expla .dropdown-menu .dropdown-item.active {
background-color: #FFFFFF;
color: #D81800;
}
.expla .dropdown-menu .dropdown-item:hover {
background-color: #FFFFFF;
color: #D81800;
}
.expla .dropdown-menu .dropdown-item:focus {
background-color: #FFFFFF;
}
.expla .topic-menu {
width: 100%;
max-height: 200px;
padding: 8px 0 !important;
overflow-y: scroll;
border: 1px solid rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
}
.expla .topic-menu.active {
display: block;
}
.expla .topic-menu .dropdown-item {
text-transform: capitalize;
}
.expla .topic-btn {
background-color: white;
position: relative;
color: black;
text-align: left;
font-size: 0.938rem;
border: 1px solid #F0F0F0;
width: 100%;
padding: 8px 40px 8px 20px;
border-radius: 0;
text-transform: capitalize;
}
.expla .topic-btn .dropdown-icon {
position: absolute;
font-weight: 200;
right: 14px;
top: 12px;
}
.expla .topic-btn:active {
box-shadow: none !important;
background-color: #FFFFFF !important;
color: #333333 !important;
}
.expla .topic-btn:focus {
box-shadow: none !important;
background-color: #FFFFFF !important;
color: #333333 !important;
}
@media screen and (min-width: 1024px) {
.expla .topic-btn {
font-size: 1rem;
}
.expla .dropdown-menu .dropdown-item {
font-size: 1rem;
}
}
.sidebar-nav-inner {
padding-left: 0;
padding-right: 10%;
}
.sidebar-nav-inner p {
color: #333333;
}
.sidebar-nav-inner form .form-item {
position: relative;
width: 100%;
}
.sidebar-nav-inner form .form-item p {
margin: 0;
}
.sidebar-nav-inner form .form-item input,
.sidebar-nav-inner form .form-item button {
width: 80%;
border-radius: 0px;
border: 1px solid #cfcfcf;
padding: 6px 30px 6px 10px;
font-size: 14px;
height: 40px;
}
.sidebar-nav-inner form .form-item button {
background-color: #FFFFFF;
text-align: left;
opacity: 0.7;
}
.sidebar-nav-inner form .form-item p,
.sidebar-nav-inner form .form-item input,
.sidebar-nav-inner form .form-item button {
margin-bottom: 10px;
}
.sidebar-nav-inner form .form-item .text-container {
position: relative;
}
.sidebar-nav-inner form .form-item .text-container .input-group {
box-shadow: none;
width: 80%;
}
.sidebar-nav-inner form .form-item .text-container .input-group .input-group-text {
position: absolute;
margin: 0;
padding: 0;
background-color: #FFFFFF;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
top: calc((50% - (10px / 2)) - (21px / 2));
left: calc(100% - 30px);
z-index: 99;
}
.sidebar-nav-inner form .form-item .text-container .input-group .form-control:focus {
box-shadow: none;
}
.sidebar-nav-inner form .form-item .btn-sg-form {
position: relative;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.sidebar-nav-inner form .form-item .btn-sg-form.active {
background-color: #dae0e5;
}
.sidebar-nav-inner form .form-item .btn-sg-form.active::after {
transform: rotate(180deg);
}
.sidebar-nav-inner form .form-item .btn-sg-form:focus {
box-shadow: none;
}
.sidebar-nav-inner form .form-item .btn-sg-form::after {
position: absolute;
right: 12px;
top: calc(50% - 0.15em);
opacity: 0.7;
display: inline-block;
margin-left: 0.255em;
vertical-align: 0.255em;
content: "";
border-top: 0.3em solid;
border-right: 0.3em solid transparent;
border-bottom: 0;
border-left: 0.3em solid transparent;
transition: all 0.5s;
}
.sidebar-nav-inner form .form-item .dropdown-menu-sg {
display: none;
position: absolute;
top: calc(100% - 10px);
max-height: 555px;
height: 310px;
width: 80%;
z-index: 100;
overflow-y: auto;
}
.sidebar-nav-inner form .form-item .dropdown-menu-sg.active {
display: block;
}
.sidebar-nav-inner form .form-item .dropdown-menu-sg ul {
border: 1px solid #ccc;
list-style-type: none;
overflow-y: hidden;
margin: 0;
padding: 0;
}
.sidebar-nav-inner form .form-item .dropdown-menu-sg ul li {
word-break: break-all;
background-color: #FFFFFF;
border-bottom: 1px solid #ccc;
font-size: 0.733em;
padding: 10px 20px 10px 24px;
cursor: pointer;
}
.sidebar-nav-inner form .form-item .dropdown-menu-sg ul li.active {
background-color: #333333;
color: #FFFFFF;
}
.sidebar-nav-inner form .form-item .dropdown-menu-sg ul li:hover {
background-color: #333333;
color: #FFFFFF;
}
.sidebar-nav-inner form .btn {
width: 80%;
background: #FFFFFF;
height: 40px;
outline: none;
}
.sidebar-nav-inner form .btn-submit {
margin-top: 27px;
border: 1px solid #cfcfcf;
color: #d11212;
padding: 7px 0;
transition: all 0.3s ease 0s;
border-radius: 0px;
}
.sidebar-nav-inner form .btn-submit:hover {
background: #d11212;
color: #FFFFFF;
border: 1px solid #d11212;
}
.sidebar-nav-inner form .btn-reset {
margin-bottom: 15px;
}
.sidebar-nav-inner form .btn-reset:hover {
text-decoration: underline;
}
.sidebar-nav-inner .another-search a {
display: flex;
align-items: center;
font-size: 13px;
color: #585858;
font-weight: 700;
margin-bottom: 7px;
}
.sidebar-nav-inner .another-search a:hover {
color: #0072bc;
text-decoration: none;
}
.sidebar-nav-inner .another-search a img {
margin-right: 20px;
}
@media screen and (min-width: 1600px) {
.sidebar-nav-inner {
padding-left: 20%;
}
}
.tempus-dominus-widget {
inset: -10px auto auto 0px !important;
background-color: #1189D5 !important;
padding: 0 !important;
width: -webkit-fit-content !important;
width: -moz-fit-content !important;
width: fit-content !important;
font-size: 14px !important;
}
.tempus-dominus-widget .date-container-decades,
.tempus-dominus-widget .date-container-months,
.tempus-dominus-widget .date-container-years {
background-color: #FFFFFF !important;
color: #333333 !important;
}
.tempus-dominus-widget .date-container-decades .decade:hover,
.tempus-dominus-widget .date-container-months .decade:hover,
.tempus-dominus-widget .date-container-years .decade:hover,
.tempus-dominus-widget .date-container-decades .month:hover,
.tempus-dominus-widget .date-container-months .month:hover,
.tempus-dominus-widget .date-container-years .month:hover,
.tempus-dominus-widget .date-container-decades .year:hover,
.tempus-dominus-widget .date-container-months .year:hover,
.tempus-dominus-widget .date-container-years .year:hover {
background-color: #FFFFFF !important;
}
.tempus-dominus-widget .date-container-decades .decade.active,
.tempus-dominus-widget .date-container-months .decade.active,
.tempus-dominus-widget .date-container-years .decade.active,
.tempus-dominus-widget .date-container-decades .month.active,
.tempus-dominus-widget .date-container-months .month.active,
.tempus-dominus-widget .date-container-years .month.active,
.tempus-dominus-widget .date-container-decades .year.active,
.tempus-dominus-widget .date-container-months .year.active,
.tempus-dominus-widget .date-container-years .year.active {
background-color: #FFFFFF !important;
color: #333333 !important;
}
.tempus-dominus-widget .date-container-decades .old,
.tempus-dominus-widget .date-container-months .old,
.tempus-dominus-widget .date-container-years .old {
color: #333333 !important;
}
.tempus-dominus-widget .date-container-days {
grid-auto-rows: 32px;
grid-auto-columns: 42px;
}
.tempus-dominus-widget .calendar-header {
grid-auto-rows: 32px;
grid-auto-columns: 42px;
margin: 0 !important;
padding: 0 !important;
grid-template-areas: "a a a a a a a";
}
.tempus-dominus-widget .calendar-header .previous {
grid-column-start: 1;
}
.tempus-dominus-widget .calendar-header .picker-switch {
grid-column-start: 2;
grid-column-end: 7;
}
.tempus-dominus-widget .calendar-header .next {
grid-column-start: 7;
}
.tempus-dominus-widget .calendar-header > * {
color: #333333 !important;
border: 1px solid #ccc;
display: flex;
align-items: center;
padding-left: 10px;
}
.tempus-dominus-widget .dow {
font-weight: 600;
border: 1px solid #ccc;
color: #333333 !important;
display: flex;
align-items: center;
}
.tempus-dominus-widget .dow:hover {
cursor: default;
}
.tempus-dominus-widget .day {
background-color: #FFFFFF;
border: 1px solid #ccc;
color: #333333;
border-radius: 0 !important;
width: 100% !important;
height: 100% !important;
}
.tempus-dominus-widget .day:hover {
background-color: #FFFFFF !important;
}
.tempus-dominus-widget .day.active {
background-color: #FFFFFF !important;
color: #333333 !important;
}
.tempus-dominus-widget .day.active::before {
display: none !important;
}
.tempus-dominus-widget .day.today {
background-color: #FFD700 !important;
color: #333333 !important;
}
.tempus-dominus-widget .day.today::before {
display: none !important;
}
.tempus-dominus-widget .day.old {
color: #333333 !important;
}
.tempus-dominus-widget .day.weekend {
color: #333333;
}
.tempus-dominus-widget .day.new {
color: #333333 !important;
}
.cookie-notice-bar {
display: none;
position: fixed;
bottom: 0;
width: 100vw;
left: 0;
background: #dadada;
padding-top: 32px;
padding-bottom: 32px;
z-index: 99;
}
.cookie-notice-bar.active {
display: block;
}
.cookie-notice-bar .row .col-md-8 {
padding-right: 0;
}
.cookie-notice-bar .cookie-notice-bar__content {
padding: 0 0 0 32px;
position: relative;
}
.cookie-notice-bar .cookie-notice-bar__content p {
width: 100%;
margin: 0;
}
.cookie-notice-bar .cookie-notice-bar__control {
text-align: center;
margin-left: 54px;
}
.cookie-notice-bar .cookie-notice-bar__control .cookie-btn {
border: solid 1px transparent;
height: 2.5em;
line-height: 16px;
margin: auto;
padding: calc(0.5em - 1px + 5px) calc(1.5rem + 1px);
background-color: #d81800;
color: #FFFFFF;
font-size: 1rem;
border-radius: 3rem;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
}
.cookie-notice-bar .cookie-notice-bar__control .cookie-btn:hover {
background-color: #cb1700;
}
@media screen and (max-width: 767px) {
.cookie-notice-bar .row .col-md-8 {
padding-right: 10px;
}
.cookie-notice-bar .cookie-notice-bar__content {
padding-left: 0;
}
.cookie-notice-bar .cookie-notice-bar__control {
text-align: left;
margin-left: 0;
margin-top: 1rem;
}
}
.notication-bar {
display: none;
position: relative;
width: 100vw;
left: calc(-50vw + 50%);
min-height: 160px;
}
.notication-bar.active {
display: block;
}
.notication-bar.black {
background: #333333;
color: #FFFFFF;
}
.notication-bar.black a {
color: #FFFFFF;
}
.notication-bar.yellow {
background: #eaea50;
color: #333333;
}
.notication-bar.yellow .notication-bar-wrapper .notication-bar-control .noti-btn {
border: 1px solid #333333;
color: #333333;
}
.notication-bar.yellow .notication-bar-wrapper .notication-bar-control a {
color: #333333;
}
.notication-bar .notication-bar-container {
display: flex;
padding: 20px 0;
}
.notication-bar .notication-bar-icon {
flex: 0 0 auto;
margin-right: 15px;
padding-top: 3px;
}
.notication-bar .notication-bar-icon .icon {
max-width: 30px;
width: 30px;
height: 30px;
}
.notication-bar .notication-bar-wrapper {
display: flex;
justify-content: space-between;
flex-direction: column;
}
.notication-bar .notication-bar-wrapper .notication-bar-content {
flex: 1 1 auto;
}
.notication-bar .notication-bar-wrapper .notication-bar-content a {
text-decoration: underline;
}
.notication-bar .notication-bar-wrapper .notication-bar-content a:hover {
color: #A32010;
}
.notication-bar .notication-bar-wrapper .notication-bar-control {
flex: 0 0 auto;
text-align: center;
margin-top: 20px;
padding-right: 45px;
}
.notication-bar .notication-bar-wrapper .notication-bar-control .noti-btn {
margin: 0 0 5px;
padding: 0;
background-color: rgba(0, 0, 0, 0);
color: #FFFFFF;
font-size: 1rem;
border-radius: 3em;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
padding-bottom: calc(0.5em - 1px);
padding-left: 1.5rem;
padding-right: 1.5rem;
padding-top: calc(0.5em - 1px);
display: block;
border: 1px solid #FFFFFF;
text-transform: uppercase;
width: 100%;
}
.notication-bar .notication-bar-wrapper .notication-bar-control .noti-btn:hover {
background-color: #A32010;
color: #FFFFFF;
border-color: #A32010;
}
.notication-bar .notication-bar-wrapper .notication-bar-control a {
display: block;
font-size: 0.8125rem;
text-decoration: underline;
color: #FFFFFF;
}
.notication-bar .notication-bar-wrapper .notication-bar-control a:hover {
color: #A32010;
}
@media screen and (min-width: 425px) {
.notication-bar .notication-bar-wrapper {
flex-direction: row;
flex: 1 1 auto;
}
.notication-bar .notication-bar-wrapper .notication-bar-control {
margin-left: 20px;
margin-top: 0;
padding-right: 0;
}
}
@media screen and (min-width: 768px) {
.notication-bar {
height: 160px;
}
.notication-bar .notication-bar-container {
padding: 20px;
}
}
.footer-back-to-top {
opacity: 0;
pointer-events: none;
position: fixed;
display: flex;
flex-direction: column;
background-color: #d81800;
align-items: center;
color: #ffffff;
width: 40px;
bottom: 0;
padding: 0.15rem 0.1rem 0.1rem;
right: 10px;
text-align: center;
transition: opacity 0.4s;
z-index: 29;
}
.footer-back-to-top.show {
pointer-events: initial;
opacity: 1;
}
.footer-back-to-top .icon {
font-size: 1.75rem;
}
.bot-msg {
width: 70px;
position: fixed;
bottom: 30px;
right: 50px;
z-index: 9999;
}
.bot-hover {
font-size: 40px;
color: #FFDB66;
position: fixed;
bottom: 10px;
left: 15px;
z-index: 9999;
}
.bot-hover svg {
background-color: #333333;
border-radius: 50%;
}
.icon-share-outline {
width: 32px;
height: 32px;
background: url('../media/icon-share-outline.png') no-repeat center center;
background-size: 100% 100%;
}
.loader-wrapper {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, 0.3);
display: flex;
justify-content: center;
align-items: center;
z-index: 99999;
}
.loader {
border: 16px solid #f3f3f3;
border-top: 16px solid #D81800;
border-radius: 50%;
width: 120px;
height: 120px;
-webkit-animation: spin 1.5s linear infinite;
animation: spin 1.5s linear infinite;
}
@-webkit-keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.special-feature-banner {
position: relative;
z-index: 1;
padding-bottom: 5rem;
}
.special-feature-banner figure {
position: relative;
padding-bottom: calc(470 / 1274 * 100%);
}
.special-feature-banner figure img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.special-feature-banner .content .text-block {
width: 80%;
position: absolute;
left: 50%;
bottom: -5rem;
transform: translateX(-50%);
z-index: 2;
background: #FFFFFF;
border-top: 0.25rem solid #D81800;
text-align: center;
padding: 1rem 0;
}
.special-feature-banner .content .text-block h6,
.special-feature-banner .content .text-block h4.title {
font-weight: 700;
}
.special-feature-banner .content .text-block h6 {
font-size: 1rem;
color: #D81800;
margin-bottom: 0.5rem;
}
.special-feature-banner .content .text-block h4.title {
font-size: 1.25rem;
max-width: 90%;
margin-bottom: 1.5rem;
margin-left: auto;
margin-right: auto;
line-height: 1.5;
}
@media screen and (min-width: 768px) {
.special-feature-banner {
padding-bottom: 8rem;
}
.special-feature-banner .content .text-block {
bottom: -8rem;
padding: 2rem 0;
}
.special-feature-banner .content .text-block h6 {
margin-bottom: 1rem;
}
.special-feature-banner .content .text-block h4.title {
font-size: 2rem;
max-width: 60%;
}
}
.sfContentBlock {
padding-bottom: 14px;
}
.sfContentBlock .video-embed {
position: relative;
padding-top: 56.25% !important;
}
.sfContentBlock .video-embed.embed-facebook {
width: 500px !important;
padding-top: 0 !important;
}
.sfContentBlock .video-embed.embed-facebook .video-embed {
width: 500px !important;
padding-top: 500px !important;
}
.sfContentBlock .video-embed iframe,
.sfContentBlock .video-embed video {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}
.sfContentBlock a:not(.cc-btn) {
color: #d81800 !important;
}
.sfContentBlock a:not(.cc-btn):visited {
color: #8b1c0e !important;
}
.sfContentBlock a:not(.cc-btn):visited span {
color: #8b1c0e !important;
}
.sfContentBlock a:hover {
text-decoration: underline !important;
color: #D81800 !important;
}
.sfContentBlock table {
width: 100% !important;
max-width: 100%;
}
.sfContentBlock div {
max-width: 100%;
}
.sfPageEditor .sfs-tabstrip .tab-content > .RadDockZone > .zeControlDock .rdContent > div,
.sfPageEditor .sfs-tabstrip .tab-pane .k-tabstrip-wrapper > div,
.sfPageEditor .tab-configurator > .RadDockZone > div.RadDock:not([behaviourobjecttype='Mci.ComWidget.Mvc.Controllers.TabStripController']) .rdMiddle .rdContent,
.sfPageEditor.zeLayoutMode .sf_colsIn.tab-configurator .zeDockZoneEmpty,
.sfs-tabstrip.loading {
display: none;
}
.sfPageEditor.zeContentMode .sfs-tabstrip {
border-top: 1px solid #c4c4c4;
padding-top: 7px;
}
.sfPageEditor .tab-configurator > .RadDockZone > div.RadDock:not([behaviourobjecttype='Mci.ComWidget.Mvc.Controllers.TabStripController']) .rdMiddle {
background-color: red !important;
}
.sfPageEditor .tab-configurator > .RadDockZone > div.RadDock:not([behaviourobjecttype='Mci.ComWidget.Mvc.Controllers.TabStripController']) .rdMiddle .rdCenter:after {
content: "Only place Tabstrip controllers in this layout zone please, please move this above the grey line";
color: #fff;
font-weight: 700;
}
.sfPageEditor .k-tabstrip-wrapper {
margin-bottom: 0 !important;
}
.sfPageEditor .k-tabstrip-wrapper .k-widget {
margin-bottom: -5px !important;
}
.k-tabstrip-wrapper,
.sfPageEditor .sfs-tabstrip,
.sfs-tabstrip {
margin-bottom: 20px;
}
.sfPageEditor .sfs-tabstrip.loading {
display: block;
}
.sfPageEditor .sfs-tabstrip .tab-panels {
padding: 10px;
border: 1px solid #c4c4c4 !important;
background-color: #f0f0f0;
}
.sfPageEditor .sfs-tabstrip .tab-pane {
background-color: #fff;
border: 2px solid #ccc;
margin-bottom: 20px;
padding: 10px;
}
.sfPageEditor .sfs-tabstrip .tab-content > .RadDockZone > .zeControlDock .rdContent,
.sfPageEditor .sfs-tabstrip .tab-pane .k-tabstrip-wrapper {
background-color: #f2dede;
font-weight: 700;
padding: 20px;
}
.sfPageEditor .sfs-tabstrip .tab-pane .k-tabstrip-wrapper::before {
content: "Put the tabstrip in the zone marked Config Widget please";
}
.sfPageEditor .sfs-tabstrip .tab-content > .RadDockZone > .zeLayoutDock .sf_cols:before {
content: "TabStrip Tab";
}
.sfPageEditor .sfs-tabstrip .tab-content > .RadDockZone > .zeControlDock .rdContent::before {
content: "Layout widgets only please, consult the documentation";
}
.sfPageEditor .sfs-tabstrip .zeLayoutDock .rdTable .rdMiddle .rdCenter .rdContent .sf_cols:before {
background-color: #ccc;
font-family: sans-serif;
font-size: 11px;
font-weight: 700;
width: 100%;
line-height: 30px;
padding-left: 8px;
display: inline-block;
box-sizing: border-box;
border-top-left-radius: 7px;
}
.sfPageEditor .sfs-tabstrip .zeLayoutDock .rdTable .rdMiddle .rdCenter .rdContent .sf_cols .RadDockZone .sf_cols:before {
display: none;
height: 0;
}
.list-group-item {
cursor: pointer;
}
.text-muted {
font-size: 12px;
padding-top: 4px;
}
.defaulttab {
font-weight: 700;
}
.detail-banner-wrap {
position: relative;
left: calc(-50vw + 50%);
padding-top: 420px;
width: 100vw;
z-index: 1;
}
.detail-banner-wrap .detail-banner {
margin: 0px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-color: transparent;
position: absolute;
top: 0;
left: 0;
-o-object-fit: cover;
object-fit: cover;
width: 100%;
height: 100%;
z-index: 0;
}
.detail-banner-wrap .container {
position: relative;
overflow-x: visible !important;
z-index: 2;
}
.detail-banner-wrap .detail-banner-content {
position: absolute;
color: #FFFFFF;
bottom: 36px;
left: 20px;
}
.detail-banner-wrap .detail-banner-content .title {
line-height: 1.3;
font-weight: 700;
font-size: 1.75rem;
}
.detail-banner-wrap .detail-banner-content .description {
font-size: 1.125rem;
margin-top: 10px;
}
.detail-banner-wrap .detail-banner-content .published {
font-size: 0.875rem;
margin-top: 10px;
}
.detail-banner-wrap .detail-banner-content .published .duration {
padding-right: 10px;
margin-right: 10px;
border-right: 1px solid;
}
.detail-banner-wrap::before {
content: '';
position: absolute;
width: 100%;
height: 100%;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5));
top: 0;
z-index: 2;
}
@media screen and (min-width: 1024px) {
.detail-banner-wrap {
padding-top: calc((100vw * 34.7222222) / 100);
}
.detail-banner-wrap .detail-banner-content {
bottom: 36px;
left: 15px;
}
.detail-banner-wrap .detail-banner-content .title {
font-size: 2.25rem !important;
}
.detail-banner-wrap .detail-banner-content .description {
font-size: 1.375rem;
}
.detail-banner-wrap .detail-banner-content .published {
font-size: 0.875rem;
}
}
@media screen and (min-width: 1408px) {
.detail-banner-wrap .detail-banner-content .description {
font-size: calc(20px + 10 * (100vw - 1408px) / 1408);
}
.detail-banner-wrap .detail-banner-content .published {
font-size: calc(14px + 10 * (100vw - 1408px) / 1408);
}
}
.post-prevnext {
display: flex;
justify-content: center;
margin-bottom: 3rem;
max-width: 100%;
padding: 10px 0;
}
.post-prevnext .row {
width: 100%;
margin: 20px 0;
padding: 0;
}
.post-prevnext .prevnext-col {
display: flex;
justify-content: flex-start;
margin: 0 auto;
padding: 0;
width: 100% !important;
flex: 0 0 100% !important;
}
.post-prevnext .post-prevnext-block {
display: flex;
justify-content: flex-start;
flex-direction: column;
width: 50%;
border-top: 0.25rem solid #D81800;
background-color: #FFFFFF;
padding: 20px;
margin: 0;
}
.post-prevnext .post-prevnext-block.post-prevnext-block_next {
border-left: 1px solid #f0f0f0;
}
.post-prevnext .post-prevnext-block .prevnext-header {
display: flex;
flex-wrap: nowrap;
align-items: center;
color: #D81800;
font-weight: 600;
text-transform: uppercase;
margin-bottom: 24px;
line-height: 20.797px;
}
.post-prevnext .post-prevnext-block .prevnext-header .icon {
padding-right: 10px;
}
.post-prevnext .post-prevnext-block .prevnext-header .text-hidden-resp {
padding-left: 5px;
}
.post-prevnext .post-prevnext-block .prevnext-header.text-next {
justify-content: flex-end;
}
.post-prevnext .post-prevnext-block .prevnext-header.text-next .icon {
padding: 0;
padding-left: 10px;
}
.post-prevnext .post-prevnext-block .prevnext-header .text-hidden-resp {
display: none;
}
.post-prevnext .post-prevnext-block .post-prevnext-content {
position: relative;
display: flex;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .row {
justify-content: flex-start !important;
margin: 0;
padding: 0;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .row .col-4 {
flex: 0 0 0;
max-width: 0;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .row .col-8 {
flex: 0 0 100%;
max-width: 100%;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .row div {
padding: 0;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .img-prevnext-block {
display: none;
position: relative;
width: 100%;
height: 0;
padding: 0;
padding-top: 56.25% !important;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .img-prevnext-block a {
width: 100%;
height: 100%;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .img-prevnext-block .img-prevnext {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .prevnext-title {
position: relative;
width: 100%;
margin-left: 0;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .prevnext-title a {
width: 100%;
color: #333333;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
white-space: normal;
overflow: hidden;
line-clamp: 3;
-webkit-line-clamp: 3;
max-height: calc(1rem * 1.3 * 4);
line-height: 1.3;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .prevnext-title a:visited {
color: #551A8B;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .prevnext-title a:hover {
color: #D81800 !important;
text-decoration: none;
}
@media screen and (min-width: 768px) {
.post-prevnext .row {
margin: 0px;
}
.post-prevnext .post-prevnext-block .prevnext-header .text-hidden-resp {
display: block;
}
}
@media screen and (min-width: 1024px) {
.post-prevnext .post-prevnext-block {
margin-right: 10px;
}
.post-prevnext .post-prevnext-block.post-prevnext-block_next {
margin: 0 0 0 10px;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .row .col-4 {
flex: 0 0 33.333333%;
max-width: 33.333333%;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .row .col-8 {
flex: 0 0 66.66666667%;
max-width: 66.66666667%;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .img-prevnext-block {
display: block;
}
.post-prevnext .post-prevnext-block .post-prevnext-content .prevnext-title {
margin-left: 15px;
}
}
.content-text {
position: relative;
width: 100%;
}
.content-text .table img {
height: auto;
max-width: 100%;
}
.content-text .table td {
padding: 0.5em 0.75em;
}
.content-text .table.statistics th {
padding: 0in 5.4pt;
}
.content-text .table.statistics td {
padding: 0in 5.4pt;
}
.c-vaccine-container .four-buttons {
margin-top: 2.5rem;
margin-bottom: 40px;
display: flex;
justify-content: center;
}
.c-vaccine-container .four-buttons .four-buttons__list .detail-content-link {
display: inline;
padding-top: 0;
padding-bottom: 0;
margin-right: 20px;
}
.c-vaccine-container .four-buttons .four-buttons__list .detail-content-link.active span {
font-weight: 700;
text-decoration: underline;
}
.c-vaccine-container .four-buttons .four-buttons__list .detail-content-link span::after {
content: "";
height: 16px;
width: 1px;
background-color: #333;
display: inline-block;
position: relative;
right: -10.5px;
bottom: -1px;
}
.c-vaccine-container .four-buttons .four-buttons__list .detail-content-link:last-child span::after {
display: none;
}
.c-vaccine-container .vaccine-videos {
margin-top: 1rem;
padding: 0 35px;
}
.c-vaccine-container .vaccine-title {
text-align: center;
}
.c-vaccine-container .vaccine-title h1 {
font-size: 2.25rem;
font-weight: 700;
}
.c-vaccine-container .vaccine-category .vaccine-video-list {
display: none;
flex-wrap: wrap;
}
.c-vaccine-container .vaccine-category .vaccine-video-list.active {
display: flex;
}
.c-vaccine-container .vaccine-category .vaccine-video-list .vaccine-video-item {
padding: 10px;
width: calc(100% / 3);
}
.c-vaccine-container .vaccine-category .vaccine-video-list .vaccine-video-item .video-container {
margin: 0;
}
.c-vaccine-container .vaccine-category .vaccine-video-list .vaccine-video-item .title {
font-size: 18px;
font-weight: 700;
margin-bottom: 10px;
}
.c-vaccine-container .banner-btn {
font-weight: 700;
}
.most-shared {
margin-bottom: 5rem;
}
.most-shared h4.title {
font-size: 1rem;
color: #D81800;
font-weight: 700;
text-align: center;
padding: 1rem 0;
margin-bottom: 2rem;
border-top: 0.25rem solid #D81800;
border-bottom: 1px solid #DADADA;
}
.most-shared .item:first-child {
padding-right: 15px;
}
.most-shared .item:last-child {
padding-left: 15px;
}
.most-shared .item .img-most-shared-thumbnail {
position: relative;
width: 100%;
height: 0;
padding: 0;
padding-top: 56.25% !important;
margin-bottom: 0.5rem;
}
.most-shared .item .img-most-shared-thumbnail a {
width: 100%;
height: 100%;
}
.most-shared .item .img-most-shared-thumbnail .img-most-shared {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.most-shared .item .img-most-shared-title {
color: #333333;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
white-space: normal;
overflow: hidden;
line-clamp: 3;
-webkit-line-clamp: 3;
max-height: calc(1rem * 1.3 * 4);
line-height: 1.3;
}
.most-shared .item .img-most-shared-title:hover {
color: #D81800;
text-decoration: none;
}
@media screen and (min-width: 768px) {
.most-shared .item .img-most-shared-thumbnail {
padding-top: 20.25% !important;
margin-bottom: 1rem;
}
.most-shared .item .img-most-shared-title {
padding-left: 1rem;
}
}
.recommended-articles {
margin-bottom: 5rem;
}
.recommended-articles h4.title {
font-size: 1rem;
color: #333333;
font-weight: 700;
margin-bottom: 1rem;
}
.recommended-articles .item {
background: #F0F0F0;
padding: 0.5rem 0 0.5rem 0.5rem;
}
.recommended-articles .item:not(:last-child) {
margin-bottom: 4px;
}
.recommended-articles .item .img-recommended-articles-thumbnail {
position: relative;
width: 100%;
height: 0;
padding: 0;
padding-top: 16.25% !important;
}
.recommended-articles .item .img-recommended-articles-thumbnail a {
width: 100%;
height: 100%;
}
.recommended-articles .item .img-recommended-articles-thumbnail .img-recommended-articles {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.recommended-articles .item .img-recommended-articles-title {
font-size: 0.875rem;
color: #333333;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
white-space: normal;
overflow: hidden;
line-clamp: 3;
-webkit-line-clamp: 3;
max-height: calc(1rem * 1.3 * 4);
line-height: 1.3;
padding-left: 0.5rem;
padding-right: 0.5rem;
}
.recommended-articles .item .img-recommended-articles-title:hover {
color: #D81800;
text-decoration: none;
}
@media screen and (min-width: 768px) {
.recommended-articles .item .img-recommended-articles-thumbnail {
padding-top: 8.25% !important;
}
.recommended-articles .item .img-recommended-articles-title {
font-size: 1rem;
padding-left: 1rem;
padding-right: 1rem;
}
}
.read-ahead {
margin-bottom: 5rem;
}
.read-ahead h4.title {
font-size: 0.8rem;
color: #D81800;
font-weight: 700;
padding-left: 0.5rem;
margin-bottom: 1rem;
border-left: 0.25rem solid #D81800;
}
.read-ahead .item {
padding: 0.5rem;
}
.read-ahead .item:first-child {
background: #EBEBEB;
margin-bottom: 4px;
}
.read-ahead .item .img-read-ahead-thumbnail {
position: relative;
width: 100%;
height: 0;
padding: 0;
padding-top: 30.25% !important;
}
.read-ahead .item .img-read-ahead-thumbnail a {
width: 100%;
height: 100%;
}
.read-ahead .item .img-read-ahead-thumbnail .img-read-ahead {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.read-ahead .item .img-read-ahead-title {
font-size: 0.875rem;
color: #333333;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
white-space: normal;
overflow: hidden;
line-clamp: 3;
-webkit-line-clamp: 3;
max-height: calc(1rem * 1.3 * 4);
line-height: 1.3;
padding-left: 0.5rem;
padding-right: 0.5rem;
}
.read-ahead .item .img-read-ahead-title:visited {
color: #551A8B;
}
.read-ahead .item .img-read-ahead-title:hover {
color: #D81800 !important;
text-decoration: none;
}
@media screen and (min-width: 768px) {
.read-ahead h4.title {
font-size: 1rem;
}
.read-ahead .item {
padding: 1rem;
}
.read-ahead .item .img-read-ahead-thumbnail {
padding-top: 16.25% !important;
}
.read-ahead .item .img-read-ahead-title {
font-size: 1rem;
padding-left: 1rem;
padding-right: 1rem;
}
}
.quote-and-share {
margin-bottom: 5rem;
}
.quote-and-share.quote-and-share-layout-2 .content {
border: unset;
}
.quote-and-share.quote-and-share-layout-2 .content .img-quote-and-share-thumbnail {
aspect-ratio: 16/9;
}
.quote-and-share.quote-and-share-layout-2 .content .right-content {
padding: 2rem 1rem 2rem 2rem;
border: 1px solid #DADADA;
border-bottom: 0.25rem solid #D81800;
}
.quote-and-share.quote-and-share-layout-3 .content {
padding: 2rem;
}
.quote-and-share.quote-and-share-layout-3 .content .right-content {
padding: 0;
}
.quote-and-share.quote-and-share-layout-3 .content .right-content p {
margin-bottom: 0;
}
.quote-and-share.quote-and-share-layout-3 .content .right-content .article-toolbar .article-bar .article-item:last-child {
display: flex;
}
.quote-and-share.quote-and-share-layout-3 .content .right-content .article-toolbar .article-bar .dropdown .btn:focus {
box-shadow: unset;
outline: unset;
}
.quote-and-share.quote-and-share-layout-3 .content .right-content .article-toolbar .article-bar .dropdown .dropdown-menu {
padding-right: 8px;
transform: translate3d(-4px, 34px, 0px) !important;
right: 0 !important;
left: unset !important;
}
.quote-and-share .content {
border: 1px solid #DADADA;
}
.quote-and-share .content .img-quote-and-share-thumbnail {
position: relative;
width: 100%;
aspect-ratio: 1/1;
}
.quote-and-share .content .img-quote-and-share-thumbnail a {
width: 100%;
height: 100%;
}
.quote-and-share .content .img-quote-and-share-thumbnail .img-quote-and-share {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.quote-and-share .content .right-content {
padding: 2rem;
}
.quote-and-share .content .right-content a:hover {
text-decoration: none;
}
.quote-and-share .content .right-content h4.title {
font-size: 1rem;
color: #333333;
font-weight: 700;
margin-bottom: 1rem;
line-height: 1.3;
}
.quote-and-share .content .right-content p {
position: relative;
}
.quote-and-share .content .right-content p::before {
content: '- ';
}
.quote-and-share .content .right-content .article-toolbar {
margin: 0 !important;
}
.quote-and-share .content .right-content .article-toolbar .article-bar {
margin: 0 !important;
}
@media screen and (min-width: 768px) {
.quote-and-share.quote-and-share-layout-2 .content .img-quote-and-share-thumbnail .img-quote-and-share {
z-index: 2;
max-width: unset;
width: calc(100% + 1rem);
height: calc(100% + 1rem);
top: 50%;
transform: translateY(-50%);
}
.quote-and-share.quote-and-share-layout-2 .content .right-content {
padding: 2rem 1rem 2rem 3rem;
}
.quote-and-share.quote-and-share-layout-3 .content .right-content .article-toolbar .article-bar .dropdown .dropdown-menu {
padding-right: 8px;
right: unset !important;
left: 0 !important;
}
.quote-and-share .content .right-content {
padding: 0 1rem 0 2rem;
}
.quote-and-share .content .right-content h4.title {
font-size: 1.125rem;
}
}
.you-need-to-know {
margin: 1rem 0;
}
.you-need-to-know .row {
margin-right: -15px !important;
margin-left: -15px !important;
}
.you-need-to-know [class*='col-'] {
padding-right: 15px !important;
padding-left: 15px !important;
}
.you-need-to-know h4 {
font-weight: 600;
}
.you-need-to-know .item {
height: 100%;
}
.you-need-to-know .item .header-title {
height: 150px;
background-color: grey;
display: flex;
align-items: flex-end;
padding: 16px;
}
.you-need-to-know .item .header-title h6 {
color: #FFFFFF;
margin-bottom: 0;
}
.you-need-to-know .item .list-direct {
height: calc(100% - 150px);
padding: 20px 16px;
border: 1px solid grey;
}
.you-need-to-know .item .list-direct a {
font-size: 14px;
color: #007bff;
display: block;
padding: 8px 0;
}
.you-need-to-know .item .list-direct a:not(:last-child) {
border-bottom: 1px solid grey;
}
.timeline {
padding-left: 3rem;
margin: 1rem 0 2rem;
}
.timeline .item {
position: relative;
margin-bottom: 16px;
border: 1px solid transparent;
border-radius: 8px;
}
.timeline .item:before {
content: '';
position: absolute;
left: calc(-1.5rem + 5px);
top: 0;
width: 2px;
height: calc(100% + 18px);
background: #D81800;
}
.timeline .item:first-child::after {
content: '';
position: absolute;
left: calc(-1.5rem + 1px);
top: 0;
transform: translateY(-50%);
width: 9px;
height: 2px;
background: #D81800;
}
.timeline .item:not(:first-child) {
padding: 16px 0 16px 3rem;
border: 1px solid #ffdbd6;
}
.timeline .item:not(:first-child)::after {
content: '';
position: absolute;
left: -1.5rem;
top: 50%;
transform: translateY(-50%);
width: 11px;
height: 11px;
border-radius: 50%;
background: #D81800;
}
.timeline .item:not(:first-child):before {
top: -1px;
}
.timeline .item span.number {
font-size: 20px;
font-weight: 600;
}
.timeline .item span.total {
color: #D81800;
}
.timeline .item h6 {
font-weight: 600;
}
.timeline .item p {
margin-bottom: 0;
}
.timeline .item a {
color: #D81800;
}
.infographics-unpublished {
margin: 1rem 0 2rem;
}
.infographics-unpublished .row {
margin-right: -15px !important;
margin-left: -15px !important;
}
.infographics-unpublished [class*='col-'] {
padding-right: 15px !important;
padding-left: 15px !important;
}
.infographics-unpublished .item {
display: flex;
align-items: flex-start;
margin-bottom: 16px;
}
.infographics-unpublished .item img {
width: 50%;
height: 15vw;
-o-object-fit: cover;
object-fit: cover;
margin-right: 2rem;
}
.infographics-unpublished .item h6 {
font-weight: 700;
margin-bottom: 8px;
}
.infographics-unpublished .item a {
color: #D81800;
}
.infographics-unpublished .item a:not(:last-child):after {
content: '|';
color: #212529;
padding-left: 2px;
}
.swimlane {
margin: 1rem 0 2rem;
}
.swimlane .text-features {
width: 80%;
margin: 0 auto;
}
.swimlane .jump-section {
margin: 3rem 0;
}
.swimlane .jump-section a {
color: #D81800;
position: relative;
padding-right: 10px;
}
.swimlane .jump-section a:not(:last-child):after {
content: '|';
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
color: #333333;
}
.swimlane .list-content {
background: #f0f0f0;
padding: 2rem 0 1rem;
}
.swimlane .list-content .item {
padding-top: 2rem;
padding-bottom: 3rem;
}
.swimlane .list-content .item:not(:last-child) {
border-bottom: 1px solid #cacaca;
}
.swimlane .row {
margin-right: -15px !important;
margin-left: -15px !important;
}
.swimlane [class*='col-'] {
padding-right: 15px !important;
padding-left: 15px !important;
}
.swimlane h4 {
font-weight: 700;
margin-bottom: 1rem;
}
.swimlane .line {
width: 30px;
height: 4px;
background: #D81800;
margin-bottom: 0.5rem;
}
.swimlane .btn-view-all {
padding: 0.75rem 1.5rem;
margin: 1rem auto;
}
.swimlane .swiper-button-next-custom,
.swimlane .swiper-button-prev-custom {
width: 32px;
height: 32px;
}
.swimlane .swiper-button-next-custom:after,
.swimlane .swiper-button-prev-custom:after {
content: '';
}
.swimlane .swiper-button-next-custom img,
.swimlane .swiper-button-prev-custom img {
width: 32px;
height: 32px;
}
.swimlane .swiper-button-next-custom {
right: 0;
}
.swimlane .swiper-button-prev-custom {
left: 0;
}
.swimlane .swiper-button-prev-custom img {
transform: rotate(180deg);
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide {
height: auto;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child {
height: 100%;
background-color: #fff;
position: unset;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content {
padding: 1rem;
position: unset;
margin-top: 0 !important;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content .flex-col a:hover {
color: #d81800;
text-decoration: none !important;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.pp-1:after {
content: '';
width: 100%;
height: 4px;
background-color: #7200DB;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.others:after {
content: '';
width: 100%;
height: 4px;
background-color: #9f2b68;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.foreign-affairs:after {
content: '';
width: 100%;
height: 4px;
background-color: #841b2d;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.housing:after {
content: '';
width: 100%;
height: 4px;
background-color: #AC5100;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.health:after {
content: '';
width: 100%;
height: 4px;
background-color: #005DC5;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.pofma:after {
content: '';
width: 100%;
height: 4px;
background-color: #2e3192;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.taglisting:after {
content: '';
width: 100%;
height: 4px;
background-color: #2e3192;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.social-and-community:after {
content: '';
width: 100%;
height: 4px;
background-color: #7200DB;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.savings-and-taxes:after {
content: '';
width: 100%;
height: 4px;
background-color: #5E8500;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.brown-1:after {
content: '';
width: 100%;
height: 4px;
background-color: #AC5100;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.economy-and-finance:after {
content: '';
width: 100%;
height: 4px;
background-color: #c46210;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.education:after {
content: '';
width: 100%;
height: 4px;
background-color: #EE3276;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.infocomms-and-technology:after {
content: '';
width: 100%;
height: 4px;
background-color: #88540b;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.green-1:after {
content: '';
width: 100%;
height: 4px;
background-color: #688F00;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.defence-and-security:after {
content: '';
width: 100%;
height: 4px;
background-color: #4b5320;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.employment:after {
content: '';
width: 100%;
height: 4px;
background-color: #0048ba;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.environment:after {
content: '';
width: 100%;
height: 4px;
background-color: #688F00;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.transport:after {
content: '';
width: 100%;
height: 4px;
background-color: #005DC5;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.blue-3:after {
content: '';
width: 100%;
height: 4px;
background-color: #2e3192;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.pink-1:after {
content: '';
width: 100%;
height: 4px;
background-color: #EE3276;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.arts-and-culture:after {
content: '';
width: 100%;
height: 4px;
background-color: #e52b50;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.law-and-governance:after {
content: '';
width: 100%;
height: 4px;
background-color: #AE8300;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.immigration-and-citizenship:after {
content: '';
width: 100%;
height: 4px;
background-color: #d3212d;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.financialservices {
border-color: #ff5955;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.financialservices:after {
content: '';
width: 100%;
height: 4px;
background-color: #ff5955;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.healthcareandcommunitycare {
border-color: #05dbc1;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.healthcareandcommunitycare:after {
content: '';
width: 100%;
height: 4px;
background-color: #05dbc1;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.infocommtechnology {
border-color: #b940ff;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.infocommtechnology:after {
content: '';
width: 100%;
height: 4px;
background-color: #b940ff;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.wholesaletrade {
border-color: #ffc200;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.wholesaletrade:after {
content: '';
width: 100%;
height: 4px;
background-color: #ffc200;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.moresectors {
border-color: #000;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.moresectors:after {
content: '';
width: 100%;
height: 4px;
background-color: #000;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.accountancy {
border-color: #00b9ca;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.accountancy:after {
content: '';
width: 100%;
height: 4px;
background-color: #00b9ca;
position: absolute;
bottom: 0;
left: 0;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.builtenvironment {
border-color: #00ec5c;
}
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child .post-content.builtenvironment:after {
content: '';
width: 100%;
height: 4px;
background-color: #00ec5c;
position: absolute;
bottom: 0;
left: 0;
}
@media screen and (min-width: 768px) {
.swimlane .swimlane-swiper .swiper-wrapper .swiper-slide .post-child {
margin-bottom: 0 !important;
}
}
.jobs-component {
height: 100%;
}
.filter-box-container {
position: -webkit-sticky;
position: sticky;
transition: top 0.3s ease-in-out;
}
.filter-box {
display: flex;
justify-content: center;
padding: 40px 0;
background-color: #000;
border-radius: 300px;
position: relative;
}
.filter-box .bg-button__overlay-left::after {
content: "";
position: absolute;
width: 50%;
top: 0;
left: 0;
height: 50%;
background: #ff5955;
z-index: -1;
}
.filter-box .bg-button__overlay-left::before {
content: "";
position: absolute;
width: 50%;
left: 0;
bottom: 0;
height: 50%;
background: #ffc200;
z-index: -1;
}
.filter-box .bg-button__overlay-right::after {
content: "";
position: absolute;
width: 50%;
top: 0;
right: 0;
height: 50%;
background: #05dbc1;
z-index: -1;
}
.filter-box .bg-button__overlay-right::before {
content: "";
position: absolute;
width: 50%;
right: 0;
bottom: 0;
height: 50%;
background: #b940ff;
z-index: -1;
}
.filter-box .bg-button {
width: 100%;
}
.filter-box .filter-box-items {
display: flex;
flex-direction: column;
justify-content: center;
}
.filter-box .filter-box-items .main-title {
text-align: center;
font-family: AvenirNextLTW01-Heavy;
display: none;
color: #ffc200;
text-transform: uppercase;
font-size: 1.875rem;
font-weight: 700;
margin-bottom: 40px;
letter-spacing: 1px;
}
.filter-box .filter-box-items .filter-box-item-btn {
position: relative;
margin-bottom: 45px;
display: flex;
flex-direction: column;
justify-content: center;
}
.filter-box .filter-box-items .filter-box-item-btn .icon-dropdown {
position: absolute;
display: flex;
align-items: center;
right: 6px;
width: 35px;
height: 100%;
top: 0;
padding: 0 12px 0 8px;
z-index: 2;
}
.filter-box .filter-box-items .filter-box-item-btn .filter-box-dropdown-btn {
position: relative;
background-color: #FFFFFF;
color: #333333;
max-width: 470px;
width: 100%;
margin: 0 auto;
padding-left: 10px;
padding-right: 40px;
text-align: left;
font-size: 0.938rem;
text-transform: uppercase;
font-weight: 600;
border-radius: 0;
text-overflow: ellipsis;
overflow: hidden;
color: #000;
}
.filter-box .filter-box-items .filter-box-item-btn .filter-box-dropdown-btn:focus {
box-shadow: none;
}
.filter-box .filter-box-items .filter-box-item-btn .filter-box-dropdown {
border-radius: 0;
margin: 0;
max-width: 470px;
max-height: 200px;
width: 100%;
border: 1px solid #f0f0f0;
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
padding-bottom: 0.5rem;
padding-top: 0.5rem;
overflow-y: scroll;
}
.filter-box .filter-box-items .filter-box-item-btn .filter-box-dropdown .dropdown-item {
text-transform: uppercase;
font-weight: 600;
text-align: center;
padding: 10px;
border-bottom: 1px solid #f0f0f0;
white-space: normal;
}
.filter-box .filter-box-items .filter-box-item-btn .filter-box-dropdown .dropdown-item.active {
background-color: #FFFFFF;
color: #ffc200;
}
.filter-box .filter-box-items .filter-box-item-btn .filter-box-dropdown .dropdown-item:hover {
background-color: #FFFFFF;
text-decoration: underline;
}
.filter-box .filter-box-items .filter-box-item-btn span.alert {
color: #d81800;
text-align: center;
padding-top: 0;
}
.filter-box .filter-box-items .filter-box-item {
display: flex;
justify-content: center;
}
.filter-box .filter-box-items .filter-box-item .filter-box-btn {
font-family: AvenirNextCondensed-Heavy;
background-color: #ffc200;
color: #000;
font-size: 26px;
padding: 10px 40px 10px 20px;
position: relative;
cursor: pointer;
text-transform: uppercase;
font-weight: 700;
}
.filter-box .filter-box-items .filter-box-item .filter-box-btn:hover {
transition: color 0.3s ease-in;
color: #a4a4a4;
text-decoration: none;
}
.filter-box .filter-box-items .filter-box-item .filter-box-btn::after {
content: "";
position: absolute;
right: 5px;
top: 50%;
transform: translateY(-50%);
z-index: 5;
border: 10px solid transparent;
border-left-color: #f2c500;
border: 15px solid transparent;
border-left-color: #000;
right: 0;
}
.filter-box .title {
text-transform: uppercase;
font-family: AvenirNextLTW01-Heavy;
color: #FFC200;
font-size: 1.5rem;
font-weight: 700;
margin-bottom: 15px;
text-align: center;
letter-spacing: 1px;
}
@media screen and (min-width: 768px) {
.filter-box .title {
font-size: 1.875rem;
}
.filter-box .filter-box-items .main-title {
text-align: left;
}
}
@media screen and (max-width: 767px) {
.filter-box {
border-radius: 100px;
}
.filter-box .filter-box-items {
padding: 0 33px;
}
.filter-box .filter-box-items .filter-box-item-btn .filter-box-dropdown .dropdown-item {
text-align: left;
font-size: 15px;
}
.filter-box .title {
line-height: 1;
}
}
@media screen and (min-width: 768px) and (max-width: 991px) {
.filter-box {
border-radius: 150px;
}
}
@media screen and (min-width: 992px) and (max-width: 1199px) {
.filter-box {
border-radius: 200px;
}
}
@media screen and (min-width: 1024px) {
.filter-box .filter-box-items .filter-box-item-btn .filter-box-dropdown-btn {
font-size: 1rem;
}
}
.careerCentres,
.covid-schemes,
.growth-sectors {
margin-top: 50px;
margin-bottom: 50px;
}
.careerCentres .row,
.covid-schemes .row,
.growth-sectors .row {
width: 100%;
padding: 0;
margin: 0;
}
.careerCentres .row > [class*="col-"],
.covid-schemes .row > [class*="col-"],
.growth-sectors .row > [class*="col-"] {
padding: 0;
}
.careerCentres .cc-content {
margin-top: 30px;
}
.cc-img {
max-width: 80%;
text-align: center;
margin: 0 auto;
}
.cc-img img {
max-width: 100%;
height: auto;
}
.cc-content {
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.cc-content p {
margin-bottom: 30px;
font-weight: 600;
}
.cc-content p a {
font-weight: 700;
color: #333333;
text-decoration: underline;
}
.cc-btn {
font-family: AvenirNextCondensed-Heavy;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
text-transform: uppercase;
background-color: #000;
padding: 10px 40px 10px 20px;
position: relative;
cursor: pointer;
color: #fff;
font-weight: 700;
}
.cc-btn::after {
content: "";
position: absolute;
right: 5px;
top: 50%;
transform: translateY(-50%);
z-index: 5;
border: 10px solid transparent;
border-left-color: #f2c500;
}
.cc-btn:hover {
color: #a4a4a4;
transition: color 0.3s ease-in;
text-decoration: none;
}
.covid-schemes {
text-align: center;
}
.covid-schemes .cc-content {
margin-top: 16px;
display: flex;
align-items: center;
}
.covid-schemes .cc-content p {
font-size: 1.125rem;
font-weight: 700;
}
.covid-schemes .cc-img {
max-width: 60%;
}
.growth-sectors.growth-sectors-listing .bg-section-title {
margin-bottom: 50px;
}
.growth-sectors.growth-sectors-listing .bg-section-title .bg-content .bg-box .bg-container .bg-left,
.growth-sectors.growth-sectors-listing .bg-section-title .bg-content .bg-box .bg-container .bg-decor,
.growth-sectors.growth-sectors-listing .bg-section-title .bg-content .bg-box .bg-container .bg-right {
display: none;
}
.growth-sectors.growth-sectors-listing .item {
padding: 0 !important;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image {
margin: 0 5px 0 0;
text-align: center;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.pp-1 {
background-color: #7200DB;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.others {
background-color: #9f2b68;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.foreign-affairs {
background-color: #841b2d;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.housing {
background-color: #AC5100;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.health {
background-color: #005DC5;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.pofma {
background-color: #2e3192;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.taglisting {
background-color: #2e3192;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.social-and-community {
background-color: #7200DB;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.savings-and-taxes {
background-color: #5E8500;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.brown-1 {
background-color: #AC5100;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.economy-and-finance {
background-color: #c46210;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.education {
background-color: #EE3276;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.infocomms-and-technology {
background-color: #88540b;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.green-1 {
background-color: #688F00;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.defence-and-security {
background-color: #4b5320;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.employment {
background-color: #0048ba;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.environment {
background-color: #688F00;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.transport {
background-color: #005DC5;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.blue-3 {
background-color: #2e3192;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.pink-1 {
background-color: #EE3276;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.arts-and-culture {
background-color: #e52b50;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.law-and-governance {
background-color: #AE8300;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.immigration-and-citizenship {
background-color: #d3212d;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.financialservices {
background-color: #ff5955;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.healthcareandcommunitycare {
background-color: #05dbc1;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.infocommtechnology {
background-color: #b940ff;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.wholesaletrade {
background-color: #ffc200;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.moresectors {
background-color: #000;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.accountancy {
background-color: #00b9ca;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-image.builtenvironment {
background-color: #00ec5c;
}
.growth-sectors.growth-sectors-listing .item .growth-sectors-text {
font-family: AvenirNextCondensed-Heavy;
font-size: 16px;
font-weight: 700;
color: #000;
line-height: 1;
text-transform: uppercase;
text-align: center;
}
.growth-sectors .bg-section-title {
margin-bottom: 0;
}
.growth-sectors .sub-text {
padding: 50px 0;
font-size: 1.125rem;
text-align: center;
}
.growth-sectors .sub-text p {
font-weight: 700;
margin: 0;
}
.stories {
position: relative;
width: 100%;
margin: 0 auto;
}
.stories .row {
margin: 0 auto;
max-width: 100%;
padding: 0;
}
.stories .row > [class*="col-"] {
padding: 0;
}
.stories .bg-section-title {
margin-bottom: 0;
}
.stories .sub-text {
padding: 50px 0;
font-size: 1.125rem;
text-align: center;
max-width: 450px;
margin: 0 auto;
}
.stories .sub-text p {
font-weight: 600;
margin: 0;
}
@media screen and (min-width: 768px) {
.careerCentres .cc-content {
margin-top: 0;
}
.stories {
width: calc(83.33333333% + 50px);
margin: 0 auto;
}
.stories .row {
margin: 0 auto 50px;
}
.covid-schemes .cc-content p {
font-size: 1.25rem;
}
.covid-schemes .cc-img {
max-width: 80%;
}
}
@media screen and (min-width: 1200px) {
.growth-sectors.growth-sectors-listing .item .growth-sectors-text {
font-size: 22px;
}
}
.jobs-stories-container {
width: 100%;
margin-bottom: 30px;
padding: 0;
}
.jobs-stories-container a:hover {
text-decoration: none;
}
.jobs-stories-container .stories-card-img {
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
}
.jobs-stories-container .stories-card-img img {
width: 100%;
}
.jobs-stories-container .stories-card-body {
padding-top: 15px;
line-height: 1.15;
color: #333333;
}
.jobs-stories-container .stories-card-body:hover {
color: #a4a4a4;
transition: color 0.3s ease-in;
}
.jobs-stories-container .stories-card-body .title {
font-family: AvenirNextCondensed-Heavy;
font-size: calc(17.09091px + 0.90909vw);
text-transform: uppercase;
font-weight: 700;
}
.jobs-stories-container .stories-card-body .desc {
font-size: 1.125rem;
padding: 0;
margin: 15px 0 0;
}
@media screen and (min-width: 768px) {
.jobs-stories-container {
padding: 0 25px;
}
}
@media screen and (min-width: 1024px) {
.jobs-stories-container .stories-card-body .title {
font-size: 28px;
}
}
.filter-box.back-to-main {
max-width: 400px;
padding: 30px 20px;
margin: 0 auto;
margin-bottom: 80px;
}
.filter-box .bg-button-link {
width: 100%;
height: 100%;
text-align: center;
}
.filter-box .bg-button-link:hover {
text-decoration: none;
}
.filter-box .bg-button__text {
position: relative;
color: #FFFFFF;
line-height: 1;
}
.filter-box .bg-button__text span {
font-family: AvenirNextLTW01-Heavy;
letter-spacing: 2px;
position: relative;
margin-bottom: 0;
padding-left: 28px;
font-size: calc(18.54545px + 0.45455vw);
text-transform: uppercase;
font-weight: 700;
}
.filter-box .bg-button__text span::after {
content: "";
position: absolute;
border: 13px solid transparent;
border-left-color: #f2c500;
top: 50%;
transform: translateY(-50%) rotate(180deg);
left: -12px;
}
@media screen and (max-width: 767px) {
.filter-box.back-to-main {
margin-bottom: 48px;
}
}
@media screen and (min-width: 1200px) {
.filter-box .bg-button__text span {
font-size: 24px;
}
}
.jobs-programmes {
margin-bottom: 20px;
width: 100%;
display: flex;
flex-wrap: wrap;
}
.jobs-programmes .jobs-programmes-list {
width: 100%;
padding: 10px 0;
}
.jobs-programmes .jobs-programmes-list.border-black .jobs-programmes-item {
border: 10px solid #000 !important;
}
.jobs-programmes .jobs-programmes-list.color-theme-1 .jobs-programmes-item {
border: 10px solid #00ec5c;
}
.jobs-programmes .jobs-programmes-list.color-theme-1 .jobs-programmes-item .top .title {
background: #00ec5c;
color: #333333;
}
.jobs-programmes .jobs-programmes-list.color-theme-1 .jobs-programmes-item .top .sub-title {
color: #00ec5c;
}
.jobs-programmes .jobs-programmes-list.color-theme-1 .jobs-programmes-item .top .jobs-prog-main-dropdown button {
border: 1px solid #00ec5c;
}
.jobs-programmes .jobs-programmes-list.color-theme-1 .jobs-programmes-item .top .jobs-prog-main-dropdown button .icon-dropdown {
color: #00ec5c;
}
.jobs-programmes .jobs-programmes-list.color-theme-1 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item.active {
color: #00ec5c;
}
.jobs-programmes .jobs-programmes-list.color-theme-1 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item:hover {
color: #00ec5c;
}
.jobs-programmes .jobs-programmes-list.color-theme-1 .jobs-programmes-item .bottom a:hover {
color: #00ec5c;
}
.jobs-programmes .jobs-programmes-list.color-theme-1 .jobs-programmes-item .bottom a .btn-decor::after {
border-left-color: #00ec5c;
}
.jobs-programmes .jobs-programmes-list.color-theme-2 .jobs-programmes-item {
border: 10px solid #ff5955;
}
.jobs-programmes .jobs-programmes-list.color-theme-2 .jobs-programmes-item .top .title {
background: #ff5955;
color: #333333;
}
.jobs-programmes .jobs-programmes-list.color-theme-2 .jobs-programmes-item .top .sub-title {
color: #ff5955;
}
.jobs-programmes .jobs-programmes-list.color-theme-2 .jobs-programmes-item .top .jobs-prog-main-dropdown button {
border: 1px solid #ff5955;
}
.jobs-programmes .jobs-programmes-list.color-theme-2 .jobs-programmes-item .top .jobs-prog-main-dropdown button .icon-dropdown {
color: #ff5955;
}
.jobs-programmes .jobs-programmes-list.color-theme-2 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item.active {
color: #ff5955;
}
.jobs-programmes .jobs-programmes-list.color-theme-2 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item:hover {
color: #ff5955;
}
.jobs-programmes .jobs-programmes-list.color-theme-2 .jobs-programmes-item .bottom a:hover {
color: #ff5955;
}
.jobs-programmes .jobs-programmes-list.color-theme-2 .jobs-programmes-item .bottom a .btn-decor::after {
border-left-color: #ff5955;
}
.jobs-programmes .jobs-programmes-list.color-theme-3 .jobs-programmes-item {
border: 10px solid #05dbc1;
}
.jobs-programmes .jobs-programmes-list.color-theme-3 .jobs-programmes-item .top .title {
background: #05dbc1;
color: #333333;
}
.jobs-programmes .jobs-programmes-list.color-theme-3 .jobs-programmes-item .top .sub-title {
color: #05dbc1;
}
.jobs-programmes .jobs-programmes-list.color-theme-3 .jobs-programmes-item .top .jobs-prog-main-dropdown button {
border: 1px solid #05dbc1;
}
.jobs-programmes .jobs-programmes-list.color-theme-3 .jobs-programmes-item .top .jobs-prog-main-dropdown button .icon-dropdown {
color: #05dbc1;
}
.jobs-programmes .jobs-programmes-list.color-theme-3 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item.active {
color: #05dbc1;
}
.jobs-programmes .jobs-programmes-list.color-theme-3 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item:hover {
color: #05dbc1;
}
.jobs-programmes .jobs-programmes-list.color-theme-3 .jobs-programmes-item .bottom a:hover {
color: #05dbc1;
}
.jobs-programmes .jobs-programmes-list.color-theme-3 .jobs-programmes-item .bottom a .btn-decor::after {
border-left-color: #05dbc1;
}
.jobs-programmes .jobs-programmes-list.color-theme-4 .jobs-programmes-item {
border: 10px solid #b940ff;
}
.jobs-programmes .jobs-programmes-list.color-theme-4 .jobs-programmes-item .top .title {
background: #b940ff;
color: #333333;
}
.jobs-programmes .jobs-programmes-list.color-theme-4 .jobs-programmes-item .top .sub-title {
color: #b940ff;
}
.jobs-programmes .jobs-programmes-list.color-theme-4 .jobs-programmes-item .top .jobs-prog-main-dropdown button {
border: 1px solid #b940ff;
}
.jobs-programmes .jobs-programmes-list.color-theme-4 .jobs-programmes-item .top .jobs-prog-main-dropdown button .icon-dropdown {
color: #b940ff;
}
.jobs-programmes .jobs-programmes-list.color-theme-4 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item.active {
color: #b940ff;
}
.jobs-programmes .jobs-programmes-list.color-theme-4 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item:hover {
color: #b940ff;
}
.jobs-programmes .jobs-programmes-list.color-theme-4 .jobs-programmes-item .bottom a:hover {
color: #b940ff;
}
.jobs-programmes .jobs-programmes-list.color-theme-4 .jobs-programmes-item .bottom a .btn-decor::after {
border-left-color: #b940ff;
}
.jobs-programmes .jobs-programmes-list.color-theme-5 .jobs-programmes-item {
border: 10px solid #ffc200;
}
.jobs-programmes .jobs-programmes-list.color-theme-5 .jobs-programmes-item .top .title {
background: #ffc200;
color: #333333;
}
.jobs-programmes .jobs-programmes-list.color-theme-5 .jobs-programmes-item .top .sub-title {
color: #ffc200;
}
.jobs-programmes .jobs-programmes-list.color-theme-5 .jobs-programmes-item .top .jobs-prog-main-dropdown button {
border: 1px solid #ffc200;
}
.jobs-programmes .jobs-programmes-list.color-theme-5 .jobs-programmes-item .top .jobs-prog-main-dropdown button .icon-dropdown {
color: #ffc200;
}
.jobs-programmes .jobs-programmes-list.color-theme-5 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item.active {
color: #ffc200;
}
.jobs-programmes .jobs-programmes-list.color-theme-5 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item:hover {
color: #ffc200;
}
.jobs-programmes .jobs-programmes-list.color-theme-5 .jobs-programmes-item .bottom a:hover {
color: #ffc200;
}
.jobs-programmes .jobs-programmes-list.color-theme-5 .jobs-programmes-item .bottom a .btn-decor::after {
border-left-color: #ffc200;
}
.jobs-programmes .jobs-programmes-list.color-theme-6 .jobs-programmes-item {
border: 10px solid #000;
}
.jobs-programmes .jobs-programmes-list.color-theme-6 .jobs-programmes-item .top .title {
background: #000;
color: #FFFFFF;
}
.jobs-programmes .jobs-programmes-list.color-theme-6 .jobs-programmes-item .top .sub-title {
color: #000;
}
.jobs-programmes .jobs-programmes-list.color-theme-6 .jobs-programmes-item .top .jobs-prog-main-dropdown button {
border: 1px solid #000;
}
.jobs-programmes .jobs-programmes-list.color-theme-6 .jobs-programmes-item .top .jobs-prog-main-dropdown button .icon-dropdown {
color: #000;
}
.jobs-programmes .jobs-programmes-list.color-theme-6 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item.active {
color: #000;
}
.jobs-programmes .jobs-programmes-list.color-theme-6 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item:hover {
color: #a4a4a4;
}
.jobs-programmes .jobs-programmes-list.color-theme-6 .jobs-programmes-item .bottom a:hover {
color: #a4a4a4;
}
.jobs-programmes .jobs-programmes-list.color-theme-6 .jobs-programmes-item .bottom a .btn-decor::after {
border-left-color: #000;
}
.jobs-programmes .jobs-programmes-list.color-theme-7 .jobs-programmes-item {
border: 10px solid #00b9ca;
}
.jobs-programmes .jobs-programmes-list.color-theme-7 .jobs-programmes-item .top .title {
background: #00b9ca;
color: #333333;
}
.jobs-programmes .jobs-programmes-list.color-theme-7 .jobs-programmes-item .top .sub-title {
color: #00b9ca;
}
.jobs-programmes .jobs-programmes-list.color-theme-7 .jobs-programmes-item .top .jobs-prog-main-dropdown button {
border: 1px solid #00b9ca;
}
.jobs-programmes .jobs-programmes-list.color-theme-7 .jobs-programmes-item .top .jobs-prog-main-dropdown button .icon-dropdown {
color: #00b9ca;
}
.jobs-programmes .jobs-programmes-list.color-theme-7 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item.active {
color: #00b9ca;
}
.jobs-programmes .jobs-programmes-list.color-theme-7 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item:hover {
color: #00b9ca;
}
.jobs-programmes .jobs-programmes-list.color-theme-7 .jobs-programmes-item .bottom a:hover {
color: #00b9ca;
}
.jobs-programmes .jobs-programmes-list.color-theme-7 .jobs-programmes-item .bottom a .btn-decor::after {
border-left-color: #00b9ca;
}
.jobs-programmes .jobs-programmes-list.color-theme-8 .jobs-programmes-item {
border: 10px solid #4487c7;
}
.jobs-programmes .jobs-programmes-list.color-theme-8 .jobs-programmes-item .top .title {
background: #4487c7;
color: #333333;
}
.jobs-programmes .jobs-programmes-list.color-theme-8 .jobs-programmes-item .top .sub-title {
color: #4487c7;
}
.jobs-programmes .jobs-programmes-list.color-theme-8 .jobs-programmes-item .top .jobs-prog-main-dropdown button {
border: 1px solid #4487c7;
}
.jobs-programmes .jobs-programmes-list.color-theme-8 .jobs-programmes-item .top .jobs-prog-main-dropdown button .icon-dropdown {
color: #4487c7;
}
.jobs-programmes .jobs-programmes-list.color-theme-8 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item.active {
color: #4487c7;
}
.jobs-programmes .jobs-programmes-list.color-theme-8 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item:hover {
color: #4487c7;
}
.jobs-programmes .jobs-programmes-list.color-theme-8 .jobs-programmes-item .bottom a:hover {
color: #4487c7;
}
.jobs-programmes .jobs-programmes-list.color-theme-8 .jobs-programmes-item .bottom a .btn-decor::after {
border-left-color: #4487c7;
}
.jobs-programmes .jobs-programmes-list.color-theme-9 .jobs-programmes-item {
border: 10px solid #ff8700;
}
.jobs-programmes .jobs-programmes-list.color-theme-9 .jobs-programmes-item .top .title {
background: #ff8700;
color: #333333;
}
.jobs-programmes .jobs-programmes-list.color-theme-9 .jobs-programmes-item .top .sub-title {
color: #ff8700;
}
.jobs-programmes .jobs-programmes-list.color-theme-9 .jobs-programmes-item .top .jobs-prog-main-dropdown button {
border: 1px solid #ff8700;
}
.jobs-programmes .jobs-programmes-list.color-theme-9 .jobs-programmes-item .top .jobs-prog-main-dropdown button .icon-dropdown {
color: #ff8700;
}
.jobs-programmes .jobs-programmes-list.color-theme-9 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item.active {
color: #ff8700;
}
.jobs-programmes .jobs-programmes-list.color-theme-9 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item:hover {
color: #ff8700;
}
.jobs-programmes .jobs-programmes-list.color-theme-9 .jobs-programmes-item .bottom a:hover {
color: #ff8700;
}
.jobs-programmes .jobs-programmes-list.color-theme-9 .jobs-programmes-item .bottom a .btn-decor::after {
border-left-color: #ff8700;
}
.jobs-programmes .jobs-programmes-list.color-theme-10 .jobs-programmes-item {
border: 10px solid #a13693;
}
.jobs-programmes .jobs-programmes-list.color-theme-10 .jobs-programmes-item .top .title {
background: #a13693;
color: #333333;
}
.jobs-programmes .jobs-programmes-list.color-theme-10 .jobs-programmes-item .top .sub-title {
color: #a13693;
}
.jobs-programmes .jobs-programmes-list.color-theme-10 .jobs-programmes-item .top .jobs-prog-main-dropdown button {
border: 1px solid #a13693;
}
.jobs-programmes .jobs-programmes-list.color-theme-10 .jobs-programmes-item .top .jobs-prog-main-dropdown button .icon-dropdown {
color: #a13693;
}
.jobs-programmes .jobs-programmes-list.color-theme-10 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item.active {
color: #a13693;
}
.jobs-programmes .jobs-programmes-list.color-theme-10 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item:hover {
color: #a13693;
}
.jobs-programmes .jobs-programmes-list.color-theme-10 .jobs-programmes-item .bottom a:hover {
color: #a13693;
}
.jobs-programmes .jobs-programmes-list.color-theme-10 .jobs-programmes-item .bottom a .btn-decor::after {
border-left-color: #a13693;
}
.jobs-programmes .jobs-programmes-list.color-theme-11 .jobs-programmes-item {
border: 10px solid #60b846;
}
.jobs-programmes .jobs-programmes-list.color-theme-11 .jobs-programmes-item .top .title {
background: #60b846;
color: #333333;
}
.jobs-programmes .jobs-programmes-list.color-theme-11 .jobs-programmes-item .top .sub-title {
color: #60b846;
}
.jobs-programmes .jobs-programmes-list.color-theme-11 .jobs-programmes-item .top .jobs-prog-main-dropdown button {
border: 1px solid #60b846;
}
.jobs-programmes .jobs-programmes-list.color-theme-11 .jobs-programmes-item .top .jobs-prog-main-dropdown button .icon-dropdown {
color: #60b846;
}
.jobs-programmes .jobs-programmes-list.color-theme-11 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item.active {
color: #60b846;
}
.jobs-programmes .jobs-programmes-list.color-theme-11 .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item:hover {
color: #60b846;
}
.jobs-programmes .jobs-programmes-list.color-theme-11 .jobs-programmes-item .bottom a:hover {
color: #60b846;
}
.jobs-programmes .jobs-programmes-list.color-theme-11 .jobs-programmes-item .bottom a .btn-decor::after {
border-left-color: #60b846;
}
.jobs-programmes .jobs-programmes-list.blue-box .jobs-programmes-item {
border: 10px solid #4487c7;
}
.jobs-programmes .jobs-programmes-list.blue-box .jobs-programmes-item .top .title {
background: #4487c7;
}
.jobs-programmes .jobs-programmes-list.blue-box .jobs-programmes-item .top .sub-title {
color: #4487c7;
}
.jobs-programmes .jobs-programmes-list.blue-box .jobs-programmes-item .top .jobs-prog-main-dropdown button {
border: 1px solid #4487c7;
}
.jobs-programmes .jobs-programmes-list.blue-box .jobs-programmes-item .top .jobs-prog-main-dropdown button .icon-dropdown {
color: #4487c7;
}
.jobs-programmes .jobs-programmes-list.blue-box .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item.active {
color: #4487c7;
}
.jobs-programmes .jobs-programmes-list.blue-box .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item:hover {
color: #4487c7;
}
.jobs-programmes .jobs-programmes-list.blue-box .jobs-programmes-item .bottom a:hover {
color: #4487c7;
}
.jobs-programmes .jobs-programmes-list.blue-box .jobs-programmes-item .bottom a .btn-decor::after {
border-left-color: #4487c7;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item {
border: 10px solid #000;
padding: 20px;
max-width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top {
line-height: 1.2;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top ul {
padding: 0;
margin-left: 1em;
margin-top: 1em;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top ul ul {
list-style-type: lower-alpha;
margin-top: 0;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top .title {
font-family: AvenirNextLTW01-Heavy;
display: flex;
align-items: center;
justify-content: center;
height: 4em;
border-radius: 0 0 40px 40px;
padding: 0 20px;
margin: -40px 0 0;
background: #ffc200;
font-weight: 700;
font-size: 1.2rem;
text-align: center;
text-transform: uppercase;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top .sub-title {
font-family: AvenirNextCondensed-Heavy;
font-weight: 700;
font-size: 24px;
line-height: 1.2;
padding-bottom: 25px;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top .jobs-prog-main-dropdown {
width: 100%;
padding-bottom: 40px;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top .jobs-prog-main-dropdown button {
position: relative;
width: 100%;
border-radius: 0;
background-color: #FFFFFF;
color: #333333;
text-align: left;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top .jobs-prog-main-dropdown button .icon-dropdown {
position: absolute;
display: flex;
align-items: center;
right: 6px;
width: 35px;
height: 100%;
top: 0;
padding: 0 12px 0 8px;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top .jobs-prog-main-dropdown button:focus {
box-shadow: none;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu {
width: 100%;
background-color: #ffffff;
border-radius: 0;
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
padding-bottom: 0.5rem;
padding-top: 0.5rem;
max-height: 200px;
overflow: hidden;
overflow-y: auto;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item {
padding: 10px 20px;
padding-left: 1.5rem;
white-space: normal;
border-bottom: 1px solid #f0f0f0;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item.active {
background-color: #FFFFFF;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top .jobs-prog-main-dropdown .dropdown-menu .dropdown-item:hover {
background-color: #FFFFFF;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top .text {
padding-top: 50px;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top .text li {
margin-top: 0.25em;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .bottom {
font-size: 20px;
padding-top: 25px;
color: #000;
font-weight: 700;
text-transform: uppercase;
line-height: 1.2;
position: relative;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .bottom a {
font-family: AvenirNextCondensed-Heavy;
width: 100%;
color: #000;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .bottom a:hover {
color: #ffc200;
text-decoration: none;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .bottom a .btn-decor-list {
margin-left: 20px;
white-space: nowrap;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .bottom a .btn-text {
display: flex;
flex-direction: column;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .bottom a .btn-text > * {
font-family: AvenirNextCondensed-Heavy;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .bottom a .btn-decor {
position: relative;
margin-left: 15px;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .bottom a .btn-decor::after {
content: "";
position: absolute;
right: 5px;
top: 50%;
transform: translateY(-50%);
z-index: 5;
border: 10px solid transparent;
border-left-color: #ffc200;
}
@media screen and (min-width: 550px) {
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .bottom a .btn-text {
flex-direction: row;
}
}
@media screen and (min-width: 768px) {
.jobs-programmes {
margin-bottom: 80px;
}
.jobs-programmes .jobs-programmes-list {
padding: 10px;
width: calc(100% / 3);
}
}
@media screen and (min-width: 992px) {
.jobs-programmes .jobs-programmes-list .jobs-programmes-item {
padding: 40px;
}
.jobs-programmes .jobs-programmes-list .jobs-programmes-item .top .title {
margin-top: -40px;
}
}
.result-title {
max-width: 700px;
margin: 80px auto;
text-align: center;
}
.result-title h2 {
font-family: AvenirNextLTW01-Heavy;
line-height: 1.3;
font-weight: 700;
margin: 0;
}
.result-container {
margin-bottom: 20px;
}
.result-container .jobs-component {
padding: 0 10px 20px;
}
.result-container .filter-box {
position: relative;
justify-content: left;
margin-top: 10px;
border-radius: 100px;
padding: 75px 0;
}
.result-container .filter-box .bg-button {
width: 100%;
}
.result-container .filter-box .filter-box-items {
width: 100%;
padding: 0 33px;
align-items: flex-start;
}
.result-container .filter-box .filter-box-items .main-title {
width: 100%;
display: block;
}
.result-container .filter-box .filter-box-items .filter-box-item-btn {
width: 100%;
}
.result-container .filter-box .filter-box-items .filter-box-item-btn .filter-box-dropdown-btn {
width: 100%;
max-width: 100%;
}
.result-container .filter-box .filter-box-items .filter-box-item-btn .filter-box-dropdown .dropdown-item {
text-align: left;
}
.result-container .filter-box .title {
color: #FFFFFF;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
text-align: left;
font-size: 1.375rem;
}
.result-container .jobs-programmes {
width: 100%;
margin-bottom: 0;
}
.result-container .jobs-programmes .jobs-programmes-list {
width: 100%;
}
.result-container .jobs-programmes .jobs-programmes-list .jobs-programmes-item {
margin-top: 30px;
}
@media screen and (min-width: 768px) {
.result-container {
margin-left: -10px;
width: calc(100% + 20px);
}
.result-container .filter-box {
margin-top: 10px;
border-radius: 100px;
padding: 75px 0;
}
.result-container .filter-box .filter-box-items {
padding: 0 33px;
align-items: flex-start;
}
.result-container .filter-box .filter-box-items .main-title {
display: block;
}
.result-container .filter-box .filter-box-items .filter-box-item-btn .filter-box-dropdown .dropdown-item {
text-align: left;
}
.result-container .filter-box .title {
color: #FFFFFF;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
text-align: left;
font-size: 1.375rem;
}
.result-container .jobs-programmes {
margin-top: 0;
margin-bottom: 0;
}
.result-container .jobs-programmes .jobs-programmes-list {
width: 100%;
}
.result-container .jobs-programmes .jobs-programmes-list .jobs-programmes-item {
margin-top: 0;
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
}
.career-centres .bg-section-title {
margin-top: 80px;
}
.career-centres .row {
padding: 0;
}
.career-centres .row > [class*="col-"] {
padding: 10px;
}
.career-centres .left {
height: 100%;
width: 100%;
}
.career-centres .right .cc-map-filter .title {
display: block;
margin-bottom: 1em;
font-size: 1rem;
font-weight: 800;
color: #000;
}
.career-centres .right .cc-map-filter .cc-map-dropdown button {
position: relative;
width: 100%;
text-align: left;
border-radius: 0;
background-color: #FFFFFF;
color: #333333;
}
.career-centres .right .cc-map-filter .cc-map-dropdown button .icon-dropdown {
position: absolute;
display: flex;
align-items: center;
right: 6px;
width: 35px;
height: 100%;
top: 0;
padding: 0 12px 0 8px;
z-index: 2;
}
.career-centres .right .cc-map-filter .cc-map-dropdown button:focus {
box-shadow: none;
}
.career-centres .right .cc-map-filter .cc-map-dropdown .dropdown-menu {
width: 100%;
background-color: #FFFFFF;
margin: 0;
padding: 0.5rem 0;
max-height: 200px;
border: 1px solid rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
overflow: hidden;
overflow-y: auto;
}
.career-centres .right .cc-map-filter .cc-map-dropdown .dropdown-menu .dropdown-item {
padding: 10px 20px;
padding-left: 1.5rem;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.career-centres .right .cc-map-filter .cc-map-dropdown .dropdown-menu .dropdown-item.selected {
font-weight: 700;
}
.career-centres .right .cc-map-filter .cc-map-dropdown .dropdown-menu .dropdown-item.active {
background-color: #FFFFFF;
color: #333333;
}
.career-centres .right .cc-map-filter .cc-map-dropdown .dropdown-menu .dropdown-item:hover {
background-color: #FFFFFF;
color: #333333;
}
.career-centres .right .cc-map-container .cc-map-list {
margin: 20px 0;
}
.career-centres .right .cc-map-container .cc-map-item {
display: none;
margin-bottom: 20px;
cursor: pointer;
}
.career-centres .right .cc-map-container .cc-map-item .map-icon-local {
flex: 0 0 16%;
}
.career-centres .right .cc-map-container .cc-map-item .map-content {
padding-left: 20px;
}
.career-centres .right .cc-map-container .cc-map-item .map-content .title {
margin-bottom: 5px;
font-size: 1rem;
font-weight: 800;
color: #000;
}
.career-centres .right .cc-map-container .cc-map-item .map-content .desc {
padding: 0;
margin: 0;
}
.career-centres .right .cc-map-pagination {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
}
.career-centres .right .cc-map-pagination .arrow-left,
.career-centres .right .cc-map-pagination .arrow-right {
padding: 7px 15px;
border: 2px solid #000;
color: #fff;
background: #000;
cursor: pointer;
}
.career-centres .right .cc-map-pagination .pani-midle {
display: flex;
flex-wrap: nowrap;
justify-content: center;
}
.career-centres .right .cc-map-pagination .pani-midle ul {
display: flex;
flex-wrap: nowrap;
justify-content: center;
list-style-type: none;
padding: 0;
margin: 0;
}
.career-centres .right .cc-map-pagination .pani-midle ul li {
margin: 0;
padding: 7px 15px;
cursor: pointer;
font-weight: 800;
font-size: 1.125rem;
}
.career-centres .right .cc-map-pagination .pani-midle ul li.active {
border: 2px solid #000;
}
#career-centres-map {
min-height: 500px;
height: 100%;
z-index: 1;
}
.cc-position-popup > * {
font-size: 0.875rem;
}
.cc-position-popup .title {
font-weight: 700;
margin: 18px 0;
color: #000;
}
.cc-position-popup a:hover {
text-decoration: underline;
}
.video-container {
position: relative;
/* 16:9 */
aspect-ratio: 16/9;
width: auto;
max-height: calc(100vh - 20px);
margin: auto;
}
.video-container .ytb-screen {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: none;
}
.video-thumbnail {
width: 100%;
}
.video-feature-field {
margin: 16px 0 32px;
}
.video-feature-field .title {
margin: 32px 0 16px;
font-weight: 700;
font-size: 1.5rem;
}
.video-feature-field .video-container {
margin: 0;
}
.video-feature-field .row .video-col .title-main {
display: block;
font-size: 1.125rem;
font-weight: 600;
padding: 0.5rem 0 1rem;
}
.video-feature-field .row .video-col .video-list {
position: relative;
height: auto;
overflow: hidden;
margin-left: 0;
/* width */
/* Track */
/* Handle */
}
.video-feature-field .row .video-col .video-list::-webkit-scrollbar {
width: 7px;
background-color: #f0f0f0;
border-radius: 4px;
}
.video-feature-field .row .video-col .video-list::-webkit-scrollbar-track {
box-shadow: inset 1px 1px 5px #f0f0f0;
border-radius: 4px;
}
.video-feature-field .row .video-col .video-list::-webkit-scrollbar-thumb {
background: #bababa;
border-radius: 4px;
}
.video-feature-field .row .video-col .video-list .video-items {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(3, 1fr);
position: relative;
transition: transform 0.35s ease;
}
.video-feature-field .row .video-col .video-list .video-item {
display: flex;
align-items: center;
margin-bottom: 10px;
position: relative;
}
.video-feature-field .row .video-col .video-list .video-item .video-img-container {
position: relative;
width: 100px;
min-width: 100px;
height: 56.25px;
margin-right: 10px;
}
.video-feature-field .row .video-col .video-list .video-item img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
-o-object-fit: cover;
object-fit: cover;
}
.video-feature-field .row .video-col .video-list .video-item .title {
margin: 0;
font-size: 0.875rem;
font-weight: 600;
color: #333333;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
white-space: normal;
overflow: hidden;
line-clamp: 2;
-webkit-line-clamp: 2;
}
.video-feature-field .row .video-col .video-list .video-item.active::before {
position: absolute;
content: '';
top: 0;
left: 0;
width: calc(100px + (2px / 2));
height: calc(56.25px + (2px / 2));
z-index: 1;
border: 2px solid #D81800;
}
.video-feature-field .row .video-col .video-list .video-item.active .title {
color: #D81800;
}
.video-feature-field .row .video-col .video-list .video-item:hover {
text-decoration: none;
}
.video-feature-field .row .video-col .video-list .video-item:hover::before {
position: absolute;
content: '';
top: 0;
left: 0;
width: calc(100px + (2px / 2));
height: calc(56.25px + (2px / 2));
z-index: 1;
border: 2px solid #D81800;
}
.video-feature-field .row .video-col .video-list .video-item:hover .title {
color: #D81800;
}
.video-feature-field .row .video-col .btn-container {
width: 100%;
display: flex;
justify-content: center;
}
.video-feature-field .row .video-col .btn-container .btn-video {
margin: -24px 0 0;
padding: 8px 25px;
background-color: #D81800;
color: #FFFFFF;
font-size: 1rem;
border-radius: 48px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
max-width: 172px;
}
.video-feature-field .row .video-col .btn-container .btn-video .icon {
margin: 0 -8px 0 8px;
}
.video-feature-field .row .video-col .btn-container .btn-video:hover {
text-decoration: none;
background-color: #cb1700;
}
.yt-pl__play-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
font-size: 1.5rem;
font-weight: 700;
z-index: 1;
}
.video-desc-field .text-desc .title {
font-weight: 700;
line-height: 1.5;
}
.video-desc-field .video-container {
margin: 0;
}
@media screen and (max-width: 767px) {
.video-feature-field .row .video-col .btn-container .btn-video {
margin-top: 10px;
}
}
@media screen and (min-width: 768px) {
.video-feature-field .video-container {
margin: 0 10px 10px 0;
}
.video-feature-field .row .video-col .video-list {
position: relative;
height: 0;
padding-bottom: 112.5%;
margin-left: 10px;
overflow: auto;
}
.video-feature-field .row .video-col .video-list .video-items {
display: block;
position: absolute;
width: 100% !important;
padding-right: 4px;
}
.video-desc-field .row .col-12:first-child {
padding-right: 10px;
}
.video-desc-field .row .col-12:last-child {
padding-left: 10px;
}
}
@media screen and (min-width: 1024px) {
.video-feature-field .title {
font-size: 1.75rem;
}
}
.accordion .card {
margin-top: 1rem;
border: 1px solid #dadada;
}
.accordion .card .card-header {
border: none;
margin-bottom: 0;
border-bottom: 1px solid #dadada;
background-color: #FFFFFF;
padding: 0;
}
.accordion .card .card-header .title-field {
margin-top: 0.5rem;
width: 100%;
padding-right: 10px;
}
.accordion .card .card-header h5 {
position: relative;
}
.accordion .card .card-header .btn.btn-link {
display: flex;
align-content: center;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 0.5rem 15px;
text-align: left;
width: 100%;
font-weight: 600;
font-size: 1.125rem;
color: #333333;
text-decoration: none !important;
}
.accordion .card .card-header .btn.btn-link:hover {
text-decoration: none !important;
}
.accordion .card .card-header .btn.btn-link:focus {
box-shadow: none;
}
.accordion .card .card-header .btn.btn-link .accordion-handle__state {
font-size: 1.5rem;
color: #d81800;
font-weight: 700;
}
.accordion .card .card-header .btn.btn-link .accordion-handle__state:hover {
color: #A32010;
}
.accordion .card .card-body {
border-top: 1px solid #dadada;
border-bottom: 1px solid #dadada;
}
.accordion .card .card-body:last-child {
border-bottom: none;
}
@media screen and (max-width: 1023px) {
.accordion .card .card-header .btn.btn-link {
font-size: 1rem;
}
}
.carousel-field {
position: relative;
margin: 1rem 0 2rem;
padding: 10px;
border: 1px solid #dadada;
}
.carousel-field .carouselSwiper {
--swiper-theme-color: red;
margin-bottom: -30px;
height: calc(100% + 30px);
}
.carousel-field .carouselSwiper.jobs-page {
border: none;
}
.carousel-field .carouselSwiper.jobs-page .swiper-btn {
top: calc(50% - 50px);
}
.carousel-field .carouselSwiper .swiper-wrapper {
padding-bottom: 30px;
}
.carousel-field .carouselSwiper .swiper-wrapper .swiper-slide img {
width: 280px;
height: 280px;
}
.carousel-field .swiper-btn {
position: absolute;
width: 50px;
height: 50px;
background-color: #D81800;
color: #FFFFFF;
top: 50%;
transform: translateY(-50%);
display: flex;
justify-content: center;
align-items: center;
z-index: 2;
}
.carousel-field .swiper-btn:hover .icon {
opacity: 1;
}
.carousel-field .swiper-btn.swiper-btn-next {
right: 0;
}
.carousel-field .swiper-btn.swiper-btn-prev {
left: 0;
}
.carousel-field .swiper-btn .icon {
opacity: 0.75;
}
.carousel-field .swiper-pagination {
bottom: -5px;
}
.swiper-pagination-bullet:hover {
opacity: 1;
background-color: #A32010;
}
.feature-intro__title {
word-wrap: break-word;
font-weight: 700;
font-size: 1.75rem;
line-height: 1.3;
}
.feature-intro__title::before {
position: absolute;
content: '';
top: 0;
left: 0;
width: 100px;
border-top: 5px solid #D81800;
}
.feature-intro-field,
.feature-intro-field-new {
display: flex;
flex-direction: column;
position: relative;
margin-top: 1rem;
margin-bottom: 1.5rem;
}
.feature-intro-field .feature-intro_content,
.feature-intro-field-new .feature-intro_content {
flex: 1;
word-wrap: break-word;
}
.feature-intro-field .feature-intro_content .content-item .infor-graphic,
.feature-intro-field-new .feature-intro_content .content-item .infor-graphic {
display: flex;
flex-direction: column;
}
.feature-intro-field .feature-intro_content .content-item .infor-graphic .graphic-img,
.feature-intro-field-new .feature-intro_content .content-item .infor-graphic .graphic-img {
flex: 1;
padding: 10px;
}
.feature-intro-field .feature-intro_content .content-item .infor-graphic .graphic-img img,
.feature-intro-field-new .feature-intro_content .content-item .infor-graphic .graphic-img img {
width: 100%;
height: auto;
}
.feature-intro-field .feature-intro_content .content-item .infor-graphic .graphic-text,
.feature-intro-field-new .feature-intro_content .content-item .infor-graphic .graphic-text {
flex: 1;
padding: 10px;
}
.feature-intro-field .feature-intro_content .content-item .infor-graphic .graphic-text .text h3,
.feature-intro-field-new .feature-intro_content .content-item .infor-graphic .graphic-text .text h3 {
font-size: 1rem;
font-weight: 700;
margin: 0;
line-height: 1.5;
}
.feature-intro-field .feature-intro_content .content-item .infor-graphic .graphic-text .link-list,
.feature-intro-field-new .feature-intro_content .content-item .infor-graphic .graphic-text .link-list {
display: flex;
flex-direction: column;
}
.feature-intro-field .feature-intro_content .content-item .infor-graphic .graphic-text .link-list .link-item,
.feature-intro-field-new .feature-intro_content .content-item .infor-graphic .graphic-text .link-list .link-item {
padding: 0.5rem 0;
color: #D81800;
border-bottom: 1px solid #F0F0F0;
}
.feature-intro-field .feature-intro_content .content-item .infor-graphic .graphic-text .link-list .link-item:last-child,
.feature-intro-field-new .feature-intro_content .content-item .infor-graphic .graphic-text .link-list .link-item:last-child {
border-bottom: none;
}
.feature-intro-field .feature-intro_content .content-item .infor-graphic .graphic-text .link-list .link-item:hover,
.feature-intro-field-new .feature-intro_content .content-item .infor-graphic .graphic-text .link-list .link-item:hover {
text-decoration: underline;
}
.feature-intro-field .feature-intro_content .content-item .video-container,
.feature-intro-field-new .feature-intro_content .content-item .video-container {
margin: 0;
}
.feature-intro-field.feature .feature-intro_content .content-item a {
color: #d81800 !important;
}
.feature-intro-field.feature .feature-intro_content .content-item a:visited {
color: #8b1c0e !important;
}
.feature-intro-field .feature-intro__title {
padding-top: 1rem;
}
.feature-intro-field-new .feature-intro__title {
font-size: 24px;
margin-bottom: 22px;
text-decoration: underline;
}
.feature-intro-field-new .feature-intro__title::before {
display: none;
}
.feature-intro-field-new .feature-intro_content {
padding: 0 20px;
}
@media screen and (min-width: 768px) {
.feature-intro-field,
.feature-intro-field-new {
flex-direction: column !important;
}
.feature-intro-field .feature-intro_content,
.feature-intro-field-new .feature-intro_content {
margin-left: 40px;
}
.feature-intro-field .feature-intro_content .content-item .infor-graphic,
.feature-intro-field-new .feature-intro_content .content-item .infor-graphic {
display: flex;
flex-direction: row;
}
.feature-intro-field-new .feature-intro_content {
margin-left: 0;
}
}
@media screen and (min-width: 1024px) {
.feature-intro__title {
font-weight: 700;
font-size: 2.25rem;
}
.feature-intro-field {
flex-direction: row;
}
.feature-intro-field-new .feature-intro_content {
margin-left: 0;
padding: 0 55px;
}
}
@media screen and (min-width: 1280px) {
.feature-intro-field.feature {
flex-direction: row !important;
}
.feature-intro-field.feature .feature-intro__title {
width: 300px;
}
}
.inforgraphic-item {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
padding-bottom: 20px;
margin: 16px 0 24px;
}
.inforgraphic-item .inforgraphic-img {
position: relative;
width: 100%;
margin-bottom: 1rem;
text-align: center;
}
.inforgraphic-item .inforgraphic-img img {
width: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.inforgraphic-item .inforgraphic-detail {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}
.inforgraphic-item .inforgraphic-detail .link-list {
max-width: 425px;
text-align: center;
margin-top: 1rem;
}
@media screen and (min-width: 425px) {
.inforgraphic-item .inforgraphic-img img {
width: 425px;
}
}
.quote-field {
margin: 20px 50px;
padding-left: 32px;
border-left: 6px solid #D81800;
}
.quote-field .quote__sentence {
font-weight: 600;
font-size: 1.375rem;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
/* number of lines to show */
line-clamp: 3;
-webkit-box-orient: vertical;
}
.quote-field .quote__sentence::before {
content: '\201C';
}
.quote-field .quote__sentence::after {
content: '\201D';
}
.quote-field .quote__author {
margin-top: 32px;
}
.quote-field .quote__author::before {
content: '\2013\00a0';
}
.post-feature-field {
position: relative;
width: calc(100% + 30px);
margin-left: -15px;
background-color: #F0F0F0;
padding-bottom: 2rem;
}
.post-feature-field.full-width {
margin-left: 0;
width: 100vw;
left: calc(-50vw + 50%);
}
.post-feature-field .title {
display: block;
margin: 0;
padding: 48px 0 16px;
font-weight: 700;
font-size: 1.5rem;
}
.post-feature-field .post-feature-link {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: inline-block;
}
.post-feature-field .post-feature-items {
position: relative;
display: flex;
flex-wrap: wrap;
width: calc(100% + 20px);
margin-left: -10px;
}
.post-feature-field .post-feature-items .post-feature-item {
position: relative;
padding: 10px;
width: 100%;
}
.post-feature-field .post-feature-items .post-feature-item .post-feature-wrapper {
position: relative;
width: 100%;
padding-bottom: 56.25%;
}
.post-feature-field .post-feature-items .post-feature-item .post-feature-img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.post-feature-field .post-feature-items .post-feature-item .post-feature-content {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
padding: 16px 12px;
width: 100%;
height: 100%;
}
.post-feature-field .post-feature-items .post-feature-item .post-feature-content .post-feature-btn {
position: absolute;
top: 16px;
}
.post-feature-field .post-feature-items .post-feature-item .post-feature-content .title {
position: absolute;
bottom: 0;
left: 0;
padding: 48px 16px 16px;
margin: 0;
font-size: 1.125rem;
font-weight: 600;
color: #FFFFFF;
}
.post-feature-field .post-feature-items .post-feature-item .post-feature-content::before {
position: absolute;
content: '';
background-color: transparent;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.post-feature-field .post-feature-items .post-feature-item .post-feature-content:hover::before {
opacity: 0.5;
background: linear-gradient(125deg, #f97794, #623aa2);
}
@media screen and (min-width: 768px) {
.post-feature-field .post-feature-items .post-feature-item {
width: calc(100% / 2);
}
}
@media screen and (min-width: 1024px) {
.post-feature-field .title {
font-size: 2rem;
}
.post-feature-field .post-feature-items .post-feature-item {
width: calc(100% / 3);
}
}
.content-box {
position: relative;
z-index: 9;
padding: 20px 0;
margin-bottom: 4rem;
}
.content-box::before {
position: absolute;
content: '';
width: 100%;
height: 100%;
top: 0;
left: 0;
border: 5px solid #FAE04A;
z-index: 12;
}
.content-box::after {
position: absolute;
content: '';
width: 100%;
height: 100%;
top: 25px;
left: 25px;
background-color: #635296;
z-index: 11;
}
.content-box .content-inner-box {
position: relative;
z-index: 13;
color: white;
padding: 10px 1rem 10px 2.5rem;
margin-left: 25px;
margin-top: 25px;
}
.content-box .content-inner-box .title h2 {
margin-bottom: 30px;
font-weight: 700;
line-height: 1.1;
color: #FADC00;
}
.content-box .content-inner-box .dash {
list-style-type: none;
padding: 0;
}
.content-box .content-inner-box .dash .sub-title {
margin-bottom: 5px;
font-weight: 700;
}
.content-box .content-inner-box .dash .content {
margin-left: 2.5rem;
list-style-type: none;
}
.content-box .content-inner-box .dash .content li {
margin-bottom: 5px;
}
.content-box .content-inner-box .dash .content li::before {
content: "\2022";
color: #FAE04A;
display: inline-block;
margin-left: -17px;
width: 1em;
}
.content-box .content-inner-box .dash .content li ul {
list-style-type: none;
}
.content-box .content-inner-box .dash .content li + li {
margin-top: 0.25em;
}
.content-box .content-inner-box .dash .btn-container {
margin-top: 2rem;
margin-bottom: 1.5rem;
}
.content-box .content-inner-box .dash .btn-container .learn-more {
text-transform: uppercase;
position: relative;
background: #FAE04A;
color: #363E3F;
font-weight: bold;
display: inline-block;
padding: 20px 40px;
line-height: 1.1;
}
.content-box .content-inner-box .dash .btn-container .learn-more::before {
position: absolute;
content: " ";
top: 50%;
left: 20px;
width: 0;
height: 0;
margin-top: -10px;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-left: 10px solid #363E3F;
}
.content-box .content-inner-box .dash .btn-container .learn-more:hover {
text-decoration: underline;
opacity: 0.8;
}
@media screen and (max-width: 767px) {
.content-box {
display: inline-block;
}
.content-box::after {
top: 15px;
left: 15px;
}
.content-box .content-inner-box {
padding: 10px;
}
.content-box .content-inner-box .title h2 {
font-size: 1.7rem;
}
.content-box .content-inner-box .dash .btn-container {
text-align: center;
}
}
.tott-tab-container {
position: -webkit-sticky;
position: sticky;
width: 100vw;
left: calc(-50vw + 50%);
background-color: #ADB1B5;
border-bottom: 5px solid #FAE04A;
margin-bottom: 1rem;
z-index: 99;
transition: top 0.3s ease-in-out;
}
.tott-tab-container .tott-tab-nav .mobile-dropdown {
display: none;
padding: 20px;
padding-left: 10px;
position: relative;
background-color: #FAE04A;
color: #635296;
font-size: 1.2rem;
font-weight: bold;
}
.tott-tab-container .tott-tab-nav .mobile-dropdown::before {
content: " ";
position: absolute;
top: 0;
left: -10px;
height: 100%;
width: 10px;
background-color: #635296;
}
.tott-tab-container .tott-tab-nav .mobile-dropdown::after {
padding: 7px;
border: 4px solid transparent;
border-radius: 2px;
border-right: 0;
border-top: 0;
content: " ";
display: block;
height: 1em;
width: 1rem;
margin-top: -0.8rem;
pointer-events: none;
position: absolute;
top: 50%;
right: 5%;
transform: rotate(315deg);
transform-origin: center;
border-color: #1B1C1D;
}
.tott-tab-container .dropdown-tott {
display: flex;
}
.tott-tab-container .dropdown-tott a {
position: relative;
color: #635296;
font-weight: 700;
font-size: 1.1rem;
padding: 20px 3rem;
cursor: pointer;
}
.tott-tab-container .dropdown-tott a::after {
bottom: -5px;
background-color: #FAE04A;
position: absolute;
left: 0;
content: '';
width: 100%;
height: 5px;
}
.tott-tab-container .dropdown-tott a:hover {
background-color: #00A79B;
text-decoration: none;
}
.tott-tab-container .dropdown-tott a:hover::after {
background-color: #00A79B;
}
.tott-tab-container .dropdown-tott a.selected {
padding: 20px 1.5rem;
background-color: #FAE04A;
text-decoration: none;
font-size: 1.3rem;
}
.tott-tab-container .dropdown-tott a.selected::after {
background-color: #635296;
}
@media screen and (max-width: 767px) {
.tott-tab-container {
border-bottom: none;
}
.tott-tab-container .container {
padding: 0 0 0 10px;
}
.tott-tab-container .tott-tab-nav .mobile-dropdown {
display: block;
}
.tott-tab-container .dropdown-tott {
display: none;
}
.tott-tab-container .dropdown-tott.active {
position: relative;
display: flex;
flex-direction: column;
}
.tott-tab-container .dropdown-tott.active .tott-choice {
width: 100%;
background-color: #ADB1B5;
padding: 15px 1.2rem;
}
.tott-tab-container .dropdown-tott.active .tott-choice.selected {
display: none;
}
.tott-tab-container .dropdown-tott.active .tott-choice::after {
display: none;
}
}
.photo-gallery-swiper {
padding: 0 25px 50px;
border: 1px solid #dadada;
}
.photo-gallery-swiper .swiper-wrapper .swiper-slide {
width: 220px;
height: 184px;
display: block;
margin: 0 auto;
position: relative;
overflow: hidden;
text-align: center;
}
.photo-gallery-swiper .swiper-wrapper .swiper-slide img {
width: 100%;
max-width: 220px;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.photo-gallery-swiper .swiper-button-next,
.photo-gallery-swiper .swiper-button-prev {
top: 30%;
width: 20px;
height: 40px;
background: #ffffff;
border: 1px solid #f0f0f0;
}
.photo-gallery-swiper .swiper-button-next::after,
.photo-gallery-swiper .swiper-button-prev::after {
display: none;
}
.feature-banner {
position: relative;
margin-bottom: 2rem;
height: 470px;
}
.feature-banner .img-banner {
margin: 0px;
width: 100%;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-color: transparent;
z-index: -1;
position: absolute;
top: 0;
left: 0;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.banner-content {
height: 100%;
flex-direction: column;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5));
text-align: center;
}
.banner-content .banner-text {
width: 50%;
height: 100%;
}
.banner-content .banner-text .banner-text__title {
line-height: 1.5;
font-size: 1.75rem;
}
.banner-btn {
margin: 24px 0 0;
padding: 8px 25px;
background-color: #D81800;
font-size: 1rem;
border-radius: 48px;
border: none;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
cursor: pointer;
min-width: 172px;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
margin-left: auto;
margin-right: auto;
text-decoration: none;
color: #FFFFFF;
}
.banner-btn:hover {
text-decoration: none;
color: #FFFFFF;
background-color: #BA2412;
}
.banner-btn .icon {
margin: 0 -8px 0 8px;
}
@media screen and (min-width: 1024px) {
.banner-content .banner-text .banner-text__title {
font-size: 2.25rem;
}
}
.story-component {
margin-bottom: 40px;
}
.post-child {
position: relative;
margin-bottom: 16px;
}
.post-child .post-img-container {
position: relative;
width: 100%;
height: 0;
padding-top: 56.25%;
}
.post-child .post-img {
margin: 0px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-color: transparent;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.post-content {
margin-top: 12px;
position: relative;
}
.post-content .title-content {
line-height: 1.2em;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
/* number of lines to show */
line-clamp: 3;
-webkit-box-orient: vertical;
}
.post-content .title-content:visited {
color: #551A8B;
}
.post-content span {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
line-clamp: 3;
-webkit-box-orient: vertical;
}
.post-row .row .col-5 {
padding-right: 10px;
}
.post-row .row .col-7 {
padding-left: 10px;
}
.pos-r-dsg .post-content {
width: 100%;
height: 100%;
margin: 0;
padding-bottom: 14px;
}
.text-square {
margin-top: 0;
}
.post-child.absolute-post .post-content {
padding-top: 12px;
}
.post-child.absolute-post .title-content {
color: #333333;
}
.post-tag {
display: flex;
line-height: 1.5;
flex-wrap: wrap;
}
.post-tag .post-tag-btn {
display: flex;
}
@media screen and (min-width: 425px) {
.post-content {
line-height: 1.5;
}
}
@media screen and (min-width: 768px) {
.post-content {
line-height: 21px;
}
.post-content.text-square {
margin-top: 12px;
}
.title-content {
font-size: 1rem;
}
.post-child.absolute-post {
position: absolute;
width: 100%;
top: 0;
padding-right: 7px;
}
.post-child.absolute-post a {
position: relative;
display: block;
}
.post-child.absolute-post a::after {
content: '';
position: absolute;
width: 100%;
height: 100%;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5));
top: 0;
}
.post-child.absolute-post .post-content {
position: absolute;
bottom: 0;
left: 14px;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
}
.post-child.absolute-post .post-content .title-content {
color: #FFFFFF;
}
.post-child.absolute-post .post-content a::after {
display: none;
}
.post-row .row .col-7 {
padding-left: 13px;
}
}
@media screen and (min-width: 1024px) {
.title-content {
font-size: 1.125rem;
}
.post-child.absolute-post {
padding-right: 10px;
}
.post-row .row .col-7 {
padding-left: 10px;
}
}
.most-popular-aside {
position: relative;
border: 1px solid #f0f0f0;
border-top: 0.25rem solid #d81800;
padding-left: 1rem;
padding-right: 1rem;
}
.most-popular-aside .aside-title {
padding-top: 1.5rem;
padding-bottom: 1.5rem;
border-bottom: 1px solid #f0f0f0;
color: #d81800;
font-weight: 600;
text-transform: uppercase;
}
.most-popular-aside .aside-content .aside-list {
counter-reset: counter;
}
.most-popular-aside .aside-content .aside-list a + a {
border-top: 1px solid #f0f0f0;
}
.most-popular-aside .aside-content .aside-list a {
display: flex;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
counter-increment: counter;
color: #333333;
}
.most-popular-aside .aside-content .aside-list a:visited span {
color: #551A8B;
}
.most-popular-aside .aside-content .aside-list a:hover {
color: #D81800 !important;
text-decoration: none;
}
.most-popular-aside .aside-content .aside-list a:hover span {
color: #D81800 !important;
}
.most-popular-aside .aside-content .aside-list a::before {
font-size: 1.75rem;
flex: 0 1 auto;
display: inline-flex;
padding-right: 1rem;
line-height: 1.25;
font-weight: 700;
content: counter(counter);
}
.most-popular-aside .aside-content .aside-list a span {
text-overflow: ellipsis;
display: -webkit-box;
line-clamp: 3;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
white-space: normal;
overflow: hidden;
max-height: calc(1rem * 1.5 * 3);
}
@media screen and (min-width: 1024px) {
.most-popular-aside .aside-content .aside-list a span {
max-height: calc(1.125rem * 1.5 * 3);
}
}
.list-item {
padding: 0;
}
.list-item [class*='col-'] {
padding: 0;
margin: 0;
}
.list-item.large-style .item .col-5 {
flex: 0 0 100%;
max-width: 100%;
}
.list-item.large-style .item .content {
padding-right: 0;
display: flex;
flex-direction: column;
justify-content: center;
position: absolute;
width: 100%;
height: 100%;
}
.list-item.large-style .item .content .item__title--link {
color: #FFFFFF;
}
.list-item.large-style .item .content .item__title--link:hover {
text-decoration: none;
color: #D81800;
}
.list-item.large-style .col-7 {
flex: 0 0 100%;
max-width: 100%;
padding: 0;
}
.list-item.large-style .item__image img {
width: 100%;
height: 300px;
}
.list-item.large-style .item__image .video-thumbnail {
width: 100%;
}
.list-item.large-style .item__footer {
display: none;
}
.list-item.large-style .item__title--link {
text-align: center;
}
.list-item .banner-btn {
color: #FFFFFF;
}
.list-item .item {
border-bottom: 1px solid #f0f0f0;
position: relative;
padding: 20px 0;
}
.list-item .item .col-12 {
padding: 0;
}
.list-item .item .content {
padding: 0 0 0 1rem;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
}
.item__image {
position: relative;
}
.item__image.video .icon-play-wrap {
display: flex;
}
.item__image.played .icon-play-wrap {
display: none !important;
}
.item__image img {
max-width: 100%;
margin: 0px;
width: "https://www.gov.sg/-/media/gov/images/articles/thumbnails/mas-mock.jpg?as=0&mw=1000&hash=AEBFFAB60CB60B4BFD8B18367921A5EE";
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-color: transparent;
-o-object-fit: cover;
object-fit: cover;
}
.item__tag {
display: flex;
flex-wrap: wrap;
margin-bottom: 0;
}
.item__tag a {
text-decoration: none;
}
.tag {
margin: 0px 10px 10px 0px;
align-items: center;
border-radius: 0;
color: #979797;
display: inline-flex;
height: 2em;
justify-content: center;
line-height: 1.5;
padding-left: 0.75em;
padding-right: 0.75em;
white-space: nowrap;
background-color: #dadada;
font-size: 0.75rem;
text-transform: uppercase;
vertical-align: top;
}
.tag:hover {
color: #fff;
text-decoration: none;
}
.tag-primary {
color: #fff;
line-height: 1;
border: none;
}
.item__title {
vertical-align: text-top;
outline: none;
line-height: initial;
}
.item__title--link {
font-weight: 600;
font-size: 1rem;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
/* number of lines to show */
line-clamp: 3;
-webkit-box-orient: vertical;
}
.item__title--link:visited {
color: #551A8B;
}
.item__title--link:hover {
color: #d81800 !important;
}
.item__body p {
margin-top: 1rem;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
line-clamp: 3;
-webkit-box-orient: vertical;
}
p:not(:last-child) {
margin-bottom: 1em;
}
a {
color: #333333;
cursor: pointer;
text-decoration: none;
}
.item__footer {
margin-top: 0.5rem;
color: #a4a4a4;
font-size: 0.875rem;
}
.item__body,
.item__tag {
display: none;
}
.icon-play-wrap {
position: absolute;
top: 20px;
right: 20px;
width: 30px;
height: 30px;
background-color: #D81800;
border-radius: 50%;
display: none;
align-items: center;
justify-content: center;
}
.icon-play-wrap span {
color: #FFFFFF;
}
@media screen and (min-width: 768px) {
.list-item .item__title--link {
font-weight: 700;
font-size: 1.375rem;
}
.list-item .item__body,
.list-item .item__tag {
display: flex;
}
}
@media screen and (min-width: 1024px) {
.list-item .item__title--link {
font-size: 1.75rem;
}
}
.contact-item-container .row {
margin: 0;
padding: 0;
justify-content: center;
overflow: hidden;
}
.contact-item-container .row .title {
margin: 32px 0 16px;
font-weight: 700;
font-size: 1.5rem;
}
.contact-item-container .row .location-col {
padding-left: 0;
padding-right: 0;
margin-bottom: 10px;
}
.contact-item-container .row .location-col .desc {
padding-left: 0;
}
.contact-item-container .row .location-field {
display: flex;
}
.contact-item-container .row .location-field p {
margin: 0;
}
.contact-item-container .row .location-field .icon-external {
margin-right: 10px;
}
.contact-item-container .row .location-field .icon-external img {
width: 24px;
height: 24px;
min-width: 24px;
}
.contact-item-container .row .location-field:first-child {
margin-bottom: 16px;
}
.contact-item-container .row .map-location {
min-height: 206px;
height: 206px;
width: 100%;
overflow: hidden;
}
.contact-item-container .row .map-location iframe {
height: 100%;
}
.contact-item-container .row .divider {
border-bottom: 2px solid #F0F0F0;
margin: 24px 0;
}
@media screen and (min-width: 768px) {
.contact-item-container .row {
overflow: visible;
}
.contact-item-container .row .location-col {
margin-bottom: 0;
}
.contact-item-container .row .map-location {
margin-left: 32px;
}
}
@media screen and (min-width: 1024px) {
.contact-item-container .row .location-col:first-child {
padding: 10px 10px 0 0;
}
.contact-item-container .row .title {
font-size: 2rem;
}
}
.contact-item-container.emergency {
margin-bottom: 68px;
}
.contact-item-container.emergency .title {
margin-top: 8px;
}
.contact-item-container.emergency .emergency-col {
padding: 0;
}
.contact-item-container.emergency .emergency-col p {
margin-bottom: 1rem;
}
@media screen and (min-width: 768px) {
.contact-item-container.emergency .emergency-col {
margin-top: 32px;
}
.contact-item-container.emergency .emergency-col:last-child {
padding-left: 20px;
}
}
.inspired-stories {
position: relative;
width: 100vw;
left: calc(-50vw + 50%);
color: #FFFFFF;
background-color: #343b96;
padding-top: calc(3rem + 10px);
}
.inspired-stories .title-block {
margin-bottom: calc(3rem + 20px);
}
.inspired-stories .title-block h2.title {
font-size: 1.5rem;
font-weight: 700;
margin-bottom: 0.5em;
}
.inspired-stories .title-block p {
margin-bottom: 0;
}
.inspired-stories .item {
margin-bottom: calc(1rem + 20px);
}
.inspired-stories .item img,
.inspired-stories .item p {
margin-bottom: 1rem;
}
.inspired-stories .item h4 {
font-size: 1.125rem;
font-weight: 600;
margin-bottom: 0;
}
.inspired-stories .item p {
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box !important;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
@media screen and (min-width: 768px) {
.inspired-stories .container {
padding-left: 10px;
padding-right: 10px;
}
.inspired-stories .item {
padding: 10px;
}
}
@media screen and (min-width: 1024px) {
.inspired-stories {
padding-left: 20px;
padding-right: 20px;
}
.inspired-stories .container {
padding-left: 5px;
padding-right: 5px;
}
.inspired-stories .title-block {
padding: 0;
}
.inspired-stories .title-block h2.title {
font-size: 2rem;
}
.inspired-stories .item {
padding: 10px;
}
.inspired-stories .item h4 {
font-size: 1.375rem;
}
.inspired-stories .item p {
height: 72px;
}
}
.detail-banner-wrap {
position: relative;
left: calc(-50vw + 50%);
width: 100vw;
z-index: 1;
}
.detail-banner-wrap.fullbleed {
padding-top: 420px;
color: #FFFFFF;
}
.detail-banner-wrap.fullbleed .icon-ytb {
z-index: 3;
pointer-events: none;
font-size: 100px;
top: 25%;
}
.detail-banner-wrap.fullbleed .detail-banner {
position: absolute;
top: 0;
left: 0;
}
.detail-banner-wrap.fullbleed .detail-banner .post-link,
.detail-banner-wrap.fullbleed .detail-banner .fullbleed-img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.detail-banner-wrap.fullbleed .detail-banner .post-link {
z-index: 2;
}
.detail-banner-wrap.fullbleed .container {
pointer-events: none;
}
.detail-banner-wrap.fullbleed .fullbleed-post {
pointer-events: auto;
}
.detail-banner-wrap.fullbleed::before {
content: '';
position: absolute;
width: 100%;
height: 100%;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.7));
top: 0;
z-index: 2;
pointer-events: none;
}
.detail-banner-wrap.fullbleed .fullbleed-post {
position: relative;
width: 100%;
display: flex;
}
.detail-banner-wrap.fullbleed .fullbleed-post.fullbleed-main {
flex-direction: column;
margin-bottom: 2rem;
padding: 0;
}
.detail-banner-wrap.fullbleed .fullbleed-post.fullbleed-main::before {
display: none;
}
.detail-banner-wrap.fullbleed .fullbleed-post.fullbleed-main .content-field {
width: 100%;
padding: 0;
}
.detail-banner-wrap.fullbleed .fullbleed-post.fullbleed-main .title {
padding: 0;
font-weight: 700;
font-size: 1.75rem;
}
.detail-banner-wrap.fullbleed .fullbleed-post::before {
content: '';
position: absolute;
width: 100%;
height: 100%;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.2));
top: 0;
z-index: 0;
border-top: solid 1px rgba(255, 255, 255, 0.5);
}
.detail-banner-wrap.fullbleed .fullbleed-post .title {
font-size: 1rem;
padding-left: 10px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
line-clamp: 3;
-webkit-box-orient: vertical;
}
.detail-banner-wrap.fullbleed .fullbleed-post .post-link-main {
text-transform: uppercase;
color: #FFFFFF;
padding: 0;
}
.detail-banner-wrap.fullbleed .fullbleed-post .post-link-main:focus {
text-decoration: none;
}
.detail-banner-wrap.fullbleed .fullbleed-post .post-link-main:hover {
opacity: 0.8;
text-decoration: none;
}
.detail-banner-wrap.fullbleed .fullbleed-post .img-field {
position: relative;
width: 50%;
padding-bottom: 50%;
height: 0;
}
.detail-banner-wrap.fullbleed .fullbleed-post .img-field .post-link {
position: absolute;
z-index: 2;
width: 100%;
height: 100%;
}
.detail-banner-wrap.fullbleed .fullbleed-post .img-field .post-link:hover {
background-color: rgba(0, 0, 0, 0.1);
}
.detail-banner-wrap.fullbleed .fullbleed-post .img-field img {
position: absolute;
top: 0;
left: 0;
-o-object-fit: cover;
object-fit: cover;
height: 100%;
}
.detail-banner-wrap.fullbleed .fullbleed-post .img-field .icon-ytb {
z-index: 3;
pointer-events: none;
font-size: 40px;
}
.detail-banner-wrap.fullbleed .fullbleed-post .content-field {
width: 50%;
padding: 15px;
padding-left: 0;
padding-bottom: 0;
z-index: 1;
}
.detail-banner-wrap.fullbleed .fullbleed-post .content-field .post-link {
text-decoration: none;
color: #FFFFFF;
}
.detail-banner-wrap.fullbleed .fullbleed-post .content-field .post-link:hover {
opacity: 0.8;
}
.detail-banner-wrap .detail-banner {
margin: 0px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-color: transparent;
position: absolute;
top: 0;
left: 0;
-o-object-fit: cover;
object-fit: cover;
width: 100%;
height: 100%;
z-index: 0;
}
.detail-banner-wrap .container {
position: relative;
overflow-x: visible !important;
z-index: 2;
}
.detail-banner-wrap .detail-banner-content {
position: absolute;
color: #FFFFFF;
bottom: 36px;
left: 20px;
max-width: calc(100% - 40px);
}
.detail-banner-wrap .detail-banner-content .published .duration {
padding-right: 10px;
margin-right: 10px;
border-right: 1px solid;
}
.popup-video-field {
width: 100vw;
height: 100vh;
position: fixed;
top: 0;
left: 0;
z-index: 99999;
display: flex;
justify-content: center;
align-items: center;
background-color: rgba(0, 0, 0, 0.7);
}
.popup-video-field .container {
max-height: calc(100vh - 20px);
}
.model-close {
border: none;
position: absolute;
top: 0;
right: -50px;
width: 50px;
height: 50px;
max-height: 50px;
max-width: 50px;
min-height: 50px;
min-width: 50px;
border-radius: 0;
background-color: #d81800;
}
.model-close::before {
height: 4px;
width: 50%;
background-color: #ffffff;
content: "";
display: block;
left: 50%;
position: absolute;
top: 50%;
transform: translateX(-50%) translateY(-50%) rotate(45deg);
transform-origin: center center;
}
.model-close::after {
height: 50%;
width: 4px;
background-color: #ffffff;
content: "";
display: block;
left: 50%;
position: absolute;
top: 50%;
transform: translateX(-50%) translateY(-50%) rotate(45deg);
transform-origin: center center;
}
.fullbleed-image {
position: relative;
width: 100vw;
min-width: 100vw;
left: calc(-20px);
padding-bottom: 420px;
z-index: 2;
}
.fullbleed-image img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
@media screen and (min-width: 450px) {
.detail-banner-wrap.fullbleed .fullbleed-post .img-field {
width: 30%;
padding-bottom: 30%;
}
.detail-banner-wrap.fullbleed .fullbleed-post .content-field {
width: 70%;
}
}
@media screen and (min-width: 530px) {
.detail-banner-wrap.fullbleed .fullbleed-post .img-field {
width: 25%;
padding-bottom: 25%;
}
.detail-banner-wrap.fullbleed .fullbleed-post .content-field {
width: 75%;
}
}
@media screen and (min-width: 700px) {
.detail-banner-wrap.fullbleed .fullbleed-post .img-field {
width: 15%;
padding-bottom: 15%;
}
.detail-banner-wrap.fullbleed .fullbleed-post .content-field {
width: 75%;
}
}
@media screen and (min-width: 765px) {
.detail-banner-wrap.fullbleed .icon-ytb {
top: 50%;
}
}
@media screen and (min-width: 1200px) {
.detail-banner-wrap.fullbleed .fullbleed-post .img-field {
width: 50%;
padding-bottom: 50%;
}
.detail-banner-wrap.fullbleed .fullbleed-post .content-field {
width: 50%;
}
.detail-banner-wrap.fullbleed .fullbleed-post .title {
padding-left: 10px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 4;
line-clamp: 4;
-webkit-box-orient: vertical;
}
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
.popup-video-field .container {
max-width: calc(90% - 40px - 20px) !important;
}
.popup-video-field .container .video-container {
padding-bottom: 43.75% !important;
}
}
@media screen and (max-width: 1023px) {
.popup-video-field .container {
max-width: calc(100% - 40px - 20px) !important;
}
.detail-banner-wrap .container {
padding: 0;
}
.detail-banner-wrap .fullbleed-main .content-field {
padding-left: 20px !important;
}
.detail-banner-wrap .fullbleed-main .post-link-main {
padding-left: 20px !important;
}
}
@media screen and (min-width: 1024px) {
.popup-video-field .container {
max-width: calc(80% + 30px) !important;
}
}
.timeline-field {
display: flex;
flex-direction: column;
justify-content: center;
margin: 1rem 0 2rem;
}
.timeline-field .global-title {
padding-bottom: 0;
}
.timeline-field .banner-btn {
background-color: #FFFFFF;
border: solid 1px #D81800;
color: #D81800;
font-weight: bold;
text-transform: uppercase;
}
.timeline-field .banner-btn:hover {
background-color: #D81800;
border: solid 1px #FFFFFF;
color: #FFFFFF;
}
.timeline-item {
display: flex;
width: 100%;
position: relative;
margin: 20px 0;
}
.timeline-item:first-child .left::before {
display: none;
}
.timeline-item:last-child .left::after {
display: none;
}
.timeline-item .left {
position: relative;
min-height: 100%;
max-height: 100%;
display: flex;
align-items: center;
}
.timeline-item .left::after {
content: "";
position: absolute;
top: 50%;
left: 50%;
width: 1px;
height: calc(50% + 20px);
background: #DADADA;
z-index: 0;
}
.timeline-item .left::before {
content: "";
position: absolute;
top: 0;
left: 50%;
width: 1px;
height: calc(50% + 20px);
background: #DADADA;
z-index: 0;
}
.timeline-item .time-col {
position: relative;
height: 40px;
width: 40px;
min-width: 40px;
border: 2px solid #D81800;
border-radius: 50%;
margin: 0;
display: flex;
justify-content: center;
align-items: center;
background-color: white;
z-index: 1;
}
.timeline-item .time-col .icon {
padding-left: 1px;
color: #D81800;
font-size: 20px;
}
.timeline-item .right {
display: flex;
align-items: center;
margin-left: 20px;
width: 100%;
}
.timeline-item .right .content {
position: relative;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
padding: 15px;
border: solid 1px #DADADA;
border-radius: 20px;
width: 100%;
}
.timeline-item .right .content .time {
width: 100%;
color: #8D8D8D;
margin-bottom: 6px;
}
.timeline-item .right .content::after {
position: absolute;
top: calc(50% - 8px);
left: -9px;
transform: rotate(45deg);
content: '';
width: 16px;
height: 16px;
border: solid 1px #DADADA;
border-top: none;
border-right: none;
background-color: white;
}
@media screen and (min-width: 768px) {
.timeline-item .time-col {
margin: 0 40px;
}
.timeline-item .right {
margin-left: 0;
}
}
.checklist-field {
counter-reset: counter;
}
.checklist-field .checklist-item {
display: flex;
align-items: center;
margin-bottom: 1rem;
counter-increment: counter;
}
.checklist-field .checklist-item::before {
font-size: 1.75rem;
line-height: 1.25;
font-weight: 700;
display: flex;
justify-content: center;
align-items: center;
min-width: 42px;
width: 42px;
min-height: 42px;
height: 42px;
border: solid 1px #DADADA;
border-radius: 50%;
color: #D81800;
content: counter(counter);
}
.checklist-field .checklist-item .checklist-content {
display: flex;
flex-direction: column;
width: 100%;
margin-left: 1rem;
}
.checklist-field .checklist-item .checklist-header {
font-weight: 700;
margin-bottom: 6px;
}
.checklist-field .checklist-item .checklist-desc {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
line-clamp: 3;
-webkit-box-orient: vertical;
}
.article-block-field {
position: relative;
padding: 1rem 0;
margin-top: 1rem;
margin-bottom: 2rem;
background-color: #F0F0F0;
text-align: center;
}
.article-block-field .header-title {
margin-bottom: 1rem;
font-weight: 600;
}
.article-block-field .banner-btn {
text-transform: uppercase;
}
.article-block-field.swiper-view .article-block-items {
padding-bottom: 30px;
--swiper-theme-color: red;
}
.article-block-field.swiper-view .article-block-item {
width: 100%;
}
.article-block-field.swiper-view .swiper-btn {
position: absolute;
width: 50px;
height: 50px;
background-color: #D81800;
color: #FFFFFF;
top: calc(50% - 25px - 15px);
display: flex;
justify-content: center;
align-items: center;
z-index: 2;
}
.article-block-field.swiper-view .swiper-btn::after {
font-size: 1rem;
}
.article-block-field.swiper-view .swiper-btn.swiper-button-next {
right: 0;
}
.article-block-field.swiper-view .swiper-btn.swiper-button-prev {
left: 0;
}
.article-block-field.grid-view .swiper-pagination {
display: none;
}
.article-block-field.grid-view .swiper-btn {
display: none;
}
.article-block-field.grid-view .swiper-wrapper {
flex-wrap: wrap;
}
.article-block-items {
display: flex;
flex-wrap: wrap;
width: calc(100%);
}
.article-block-items .article-block-item {
margin-bottom: 1rem;
position: relative;
width: calc(100%);
}
.article-block-items .article-block-item a {
color: #333333;
}
.article-block-items .article-block-item a:hover {
text-decoration: none;
}
.article-block-items .article-block-item a:hover .thumbnail {
opacity: 0.7;
}
.article-block-items .article-block-item a:hover .title div {
opacity: 0.7;
}
.article-block-items .article-block-item .thumbnail {
position: relative;
width: 100%;
height: 0;
padding-bottom: 56.25%;
}
.article-block-items .article-block-item .thumbnail img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.article-block-items .article-block-item .title {
position: relative;
padding: 20px;
padding-right: 60px;
text-align: left;
background-color: #FFFFFF;
overflow: hidden;
min-height: 88px;
}
.article-block-items .article-block-item .title div {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
}
.article-block-items .article-block-item .title::after {
right: 30px;
border: 3px solid transparent;
border-color: #D81800;
border-radius: 2px;
border-right: 0;
border-top: 0;
content: " ";
display: block;
height: 0.625em;
margin-top: -0.4375em;
pointer-events: none;
position: absolute;
top: 50%;
transform: rotate(-135deg);
transform-origin: center;
width: 0.625em;
}
@media screen and (min-width: 600px) {
.article-block-field.swiper-view .swiper-btn.swiper-button-next {
right: 10px;
}
.article-block-field.swiper-view .swiper-btn.swiper-button-prev {
left: 10px;
}
.article-block-items {
width: 100%;
}
.article-block-items .article-block-item {
margin-bottom: 0;
padding: 10px;
width: calc(100% / 2);
}
}
@media screen and (min-width: 1024px) {
.article-block-field.grid-view .article-block-items {
width: 80%;
margin: 0 auto;
}
.article-block-items {
width: calc(100% + 20px);
margin-left: -10px;
}
}
.alt_feature_menu_bottom {
position: relative;
width: 100vw;
background-color: white;
z-index: 20;
}
.alt_feature_menu_bottom .accordion {
border-top: 4px solid #D81800;
width: 100%;
background-color: #FFFFFF;
}
.alt_feature_menu_bottom .accordion.story-menu-accordion {
position: relative;
bottom: 0;
}
.alt_feature_menu_bottom .accordion.story-menu-accordion.morethan-2 .sub-section-accordion {
width: 100%;
}
.alt_feature_menu_bottom .accordion.story-menu-accordion .title-field {
margin-top: 0;
width: 100%;
color: #D81800;
font-weight: 700;
}
.alt_feature_menu_bottom .accordion.story-menu-accordion .card {
margin-top: 0;
border: none;
}
.alt_feature_menu_bottom .accordion.story-menu-accordion .card-body {
border-top: none;
border-bottom: 1px solid #dadada;
}
.alt_feature_menu_bottom .accordion.story-menu-accordion .card-body .container {
display: flex;
}
.alt_feature_menu_bottom .accordion.story-menu-accordion .btn.collapsed:not(.show) {
display: block;
}
.alt_feature_menu_bottom .accordion.story-menu-accordion .btn.collapsed .title-field::after {
display: block;
}
.alt_feature_menu_bottom .accordion.story-menu-accordion .btn .title-field::after {
right: 15px;
border: 4px solid transparent;
border-color: #D81800;
border-radius: 2px;
border-right: 0;
border-top: 0;
content: " ";
display: none;
height: 0.7em;
margin-top: -0.4375em;
pointer-events: none;
position: absolute;
top: calc(50% + (0.7em / 2));
transform: rotate(135deg);
transform-origin: center;
width: 0.7em;
}
.alt_feature_menu_bottom ul {
padding: 0 20px 0 34px;
}
.alt_feature_menu_bottom ul li {
list-style-type: none;
margin-bottom: 8px;
}
.alt_feature_menu_bottom ul li a {
color: #333333;
}
.alt_feature_menu_bottom ul li a:hover {
text-decoration: none;
color: #D81800;
}
.alt_feature_menu_bottom ul li.active {
margin-left: 0;
list-style-type: disc;
color: #D81800;
}
.alt_feature_menu_bottom ul li.active a {
color: #D81800;
}
.alt_feature_menu_bottom .close-btn {
position: absolute;
top: 50%;
right: 15px;
}
.alt_feature_menu_bottom .close-btn .close-icon {
background-color: #D81800;
width: 18px;
}
.alt_feature_menu_bottom .close-btn .close-icon:first-child {
transform: translateY(8px) rotate(45deg);
}
.alt_feature_menu_bottom .close-btn .close-icon:last-child {
transform: translateY(-8px) rotate(-45deg);
}
.alt_feature_menu_bottom .btn-link.collapsed .close-btn {
display: none;
}
.alt_feature_menu_bottom .sub-section-accordion {
display: flex;
width: 100%;
border: none;
}
.alt_feature_menu_bottom .sub-section-accordion .card {
width: 100%;
padding: 0;
}
.alt_feature_menu_bottom .sub-section-accordion .card-header {
background-color: #F0F0F0;
border: none !important;
border-bottom: 1px solid #FFFFFF !important;
}
.alt_feature_menu_bottom .sub-section-accordion .card-header .btn.collapsed .title-field::after {
transform: rotate(135deg);
top: calc(50% + (0.6em / 2));
}
.alt_feature_menu_bottom .sub-section-accordion .card-header .btn .title-field {
margin-top: 0;
color: #333333;
font-size: 1rem;
}
.alt_feature_menu_bottom .sub-section-accordion .card-header .btn .title-field::after {
display: block;
top: calc(50%);
height: 0.6em;
width: 0.6em;
border-bottom-width: 3px;
border-left-width: 3px;
border-color: #8D8D8D;
transform: rotate(-45deg);
}
.alt_feature_menu_bottom .sub-section-accordion .card-body {
padding: 10px 0;
border: none !important;
}
.recommended-article-field {
display: flex;
align-items: center;
}
.recommended-article-field .title {
padding: 10px 10px 10px 20px;
font-weight: 600;
text-transform: uppercase;
height: 100%;
display: flex;
align-items: center;
font-size: 1rem;
}
.recommended-article-field .recommended-item {
position: relative;
margin: 10px;
}
.recommended-article-field .recommended-item a {
display: flex;
align-items: center;
color: #333333;
}
.recommended-article-field .recommended-item a:hover {
text-decoration: none;
}
.recommended-article-field .recommended-item .thumbnail {
position: relative;
min-width: 33%;
width: 33%;
height: auto;
margin: 10px;
}
.recommended-article-field .recommended-item .thumbnail img {
width: 100%;
height: 100%;
}
.recommended-article-field .recommended-item .title {
font-size: 1rem;
padding: 0;
margin: 10px 10px 10px 20px;
text-transform: none;
font-weight: 600;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
line-clamp: 3;
-webkit-box-orient: vertical;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
}
@media screen and (max-width: 767px) {
.alt_feature_menu_bottom .story-menu-accordion .card-body {
padding: 0;
}
.alt_feature_menu_bottom .story-menu-accordion .card-body [class*='col-'] {
padding: 0;
margin: 0;
}
}
@media screen and (min-width: 768px) {
.alt_feature_menu_bottom .story-menu-accordion .container {
padding: 0 20px;
}
.alt_feature_menu_bottom .story-menu-accordion .card-body {
padding: 20px 0;
}
.alt_feature_menu_bottom .collapse:not(.show) {
display: none;
}
.alt_feature_menu_bottom .sub-section-accordion {
width: 50%;
}
.alt_feature_menu_bottom .sub-section-accordion .card {
padding: 0 20px;
}
.alt_feature_menu_bottom .sub-section-accordion ul {
padding: 0 20px;
}
.alt_feature_menu_bottom .sub-section-accordion .card-body {
padding: 10px 0;
}
.alt_feature_menu_bottom .sub-section-accordion .title-field::after {
display: none !important;
}
.alt_feature_menu_bottom .sub-section-accordion .close-btn {
display: none;
}
.alt_feature_menu_bottom ul li.active {
margin-left: 18px;
}
.alt_feature_menu_bottom .close-btn {
right: 35px;
}
.recommended-article-field .title {
font-size: 1.125rem;
}
}
@media screen and (min-width: 992px) {
.recommended-article-field .title {
padding-left: 0;
}
}
@media screen and (min-width: 1024px) {
.alt_feature_menu_bottom .close-btn {
right: 15px;
}
}
.poll-field {
display: flex;
flex-wrap: wrap;
justify-content: center;
max-width: 70%;
margin: 0 auto;
}
.poll-field .sub-header {
margin: 0 auto;
width: 80%;
text-align: center;
font-weight: 600;
}
.poll-field .poll-question {
margin: 1rem 0 2rem;
width: 100%;
}
.poll-field .poll-question .banner-btn {
margin: 0;
}
.poll-field .poll-question.hide {
display: none;
}
.poll-field .poll-answer {
display: none;
margin: 1rem 0 2rem;
padding: 0 10px;
width: 100%;
}
.poll-field .poll-answer.show {
display: block;
}
.poll-field .poll-card,
.poll-field .poll-slider,
.poll-field .poll-radio,
.poll-field .poll-checkbox,
.poll-field .poll-thankyou,
.poll-field .poll-result-img,
.poll-field .poll-result-text {
position: relative;
width: 100%;
margin-top: 1rem;
background-color: #F0F0F0;
}
.poll-field .poll-slider {
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
}
.poll-field .poll-card {
padding: 30px 10px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.poll-field .poll-card .card-item {
position: relative;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
margin: 10px;
padding: 10px;
width: calc(70%);
text-align: center;
background-color: #FFFFFF;
border-radius: 8px;
box-shadow: 0px 0px 15px -5px #000000;
}
.poll-field .poll-card .card-item.active {
outline: 2px solid #D81800;
}
.poll-field .poll-card .card-item:hover {
cursor: pointer;
outline: 2px solid #D81800;
}
.poll-field .poll-card .card-item .thumbnail {
position: relative;
top: 10px;
left: 10px;
width: calc(100% - 20px);
height: 0;
padding-bottom: calc(100% - 20px);
background-color: #DADADA;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
}
.poll-field .poll-card .card-item .thumbnail img {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
-o-object-fit: cover;
object-fit: cover;
}
.poll-field .poll-card .card-item .card-name {
width: 100%;
padding: 20px 0;
}
.poll-field .poll-slider {
position: relative;
}
.poll-field .poll-slider .thumbnail {
position: relative;
width: 100%;
height: 0;
padding-bottom: 50%;
text-align: center;
}
.poll-field .poll-slider .thumbnail img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
max-height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.poll-field .poll-radio {
display: flex;
align-items: center;
}
.poll-field .poll-radio .poll-radio-list {
margin-left: 10%;
padding: 3rem 0;
}
.poll-field .poll-checkbox {
display: flex;
align-items: center;
}
.poll-field .poll-checkbox .poll-checkbox-list {
margin-left: 10%;
padding: 3rem 0;
}
.poll-field .poll-checkbox .poll-checkbox-list .poll-checkbox-item {
position: relative;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
display: flex;
align-items: center;
padding-left: 20px;
}
.poll-field .poll-checkbox .poll-checkbox-list input[type='checkbox'] {
position: absolute;
opacity: 0;
cursor: pointer;
}
.poll-field .poll-checkbox .poll-checkbox-list .checkmark {
position: absolute;
top: 4px;
left: 0;
height: 15px;
width: 15px;
background-color: #FFFFFF;
border: 1px solid #DADADA;
border-radius: 4px;
}
.poll-field .poll-checkbox .poll-checkbox-list .checkmark::after {
content: "";
position: absolute;
display: none;
left: 4px;
top: 2px;
width: 5px;
height: 8px;
border: solid white;
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
.poll-field .poll-checkbox .poll-checkbox-list label {
margin-left: 20px;
}
.poll-field .poll-checkbox .poll-checkbox-list input[type='checkbox']:checked ~ .checkmark {
background-color: #2196F3;
border-color: #DADADA;
}
.poll-field .poll-checkbox .poll-checkbox-list input[type='checkbox']:checked ~ .checkmark::after {
display: block;
}
.poll-field .poll-checkbox .poll-checkbox-list.error .checkmark {
border-color: #D81800;
}
.poll-field .poll-action {
width: 100%;
margin-top: 1rem;
display: flex;
justify-content: flex-end;
align-items: center;
flex-direction: column;
}
.poll-field .poll-action .error-text {
display: none;
color: #D81800;
font-weight: 600;
padding-bottom: 10px;
padding-right: 0;
}
.poll-field .poll-action .poll-range {
width: 100%;
display: flex;
flex-wrap: nowrap;
align-items: center;
padding: 0 20px;
margin-bottom: 10px;
}
.poll-field .poll-action .poll-range label {
margin: 0;
}
.poll-field .poll-action .poll-range .slider {
margin: 0 10px;
-webkit-appearance: none;
background: #d3d3d3;
outline: none;
opacity: 0.7;
height: 8px;
width: 100%;
transition: opacity 0.2s;
}
.poll-field .poll-action .poll-range .slider:hover {
opacity: 1;
}
.poll-field .poll-action .poll-range .slider::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
width: 20px;
height: 20px;
border-radius: 50%;
background: #FFFFFF;
box-shadow: 0px 0px 15px -5px #000000;
cursor: pointer;
}
.poll-field .poll-thankyou {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 10px 0;
}
.poll-field .poll-thankyou .icon {
font-size: 40px;
margin-bottom: 6px;
}
.poll-field .poll-result-img {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 3rem 0;
}
.poll-field .poll-result-img .poll-result-item {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 70%;
margin: 5px 0;
}
.poll-field .poll-result-img .poll-result-item .thumbnail {
width: calc(2 * 100% / 6);
position: relative;
height: 0;
padding-bottom: calc(2 * 100% / 6);
background-color: #FFFFFF;
border-radius: 8px;
margin-right: 10px;
}
.poll-field .poll-result-img .poll-result-item .thumbnail img {
position: absolute;
top: 0;
left: 0;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
height: 100%;
}
.poll-field .poll-result-img .poll-result-item .result-content {
position: relative;
width: calc(4 * 100% / 6);
}
.poll-field .poll-result-img .poll-result-item .progress-poll {
width: 100%;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
}
.poll-field .poll-result-img .poll-result-item .progress-poll .progress-bar {
height: 30px;
background-color: #17a2b8;
}
.poll-field .poll-result-text {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 3rem 0;
}
.poll-field .poll-result-text .poll-result-item {
display: flex;
justify-content: center;
align-items: center;
margin: 5px 0;
width: 85%;
}
.poll-field .poll-result-text .poll-text {
margin-right: 10px;
width: 30%;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
line-height: 1;
}
.poll-field .poll-result-text .progress-poll {
width: 70%;
height: 40px;
}
.poll-field .poll-result-text .progress-poll .progress-bar {
background-color: #17a2b8;
}
.poll-field .progress-poll {
display: flex;
height: 1rem;
overflow: hidden;
line-height: 0;
font-size: 0.75rem;
background-color: #FFFFFF;
border-radius: 0.25rem;
}
@media screen and (min-width: 500px) {
.poll-field .poll-card {
padding: 10px;
flex-direction: row;
}
.poll-field .poll-card .card-item {
width: calc(100% / 3);
padding: 0;
}
.poll-field .poll-action {
flex-direction: row;
}
.poll-field .poll-action .error-text {
padding-bottom: 0;
padding-right: 10px;
}
.poll-field .poll-action .poll-range {
width: 70%;
margin-bottom: 0;
}
.poll-field .poll-result-img .poll-result-item .thumbnail {
width: calc(100% / 6);
padding-bottom: calc(100% / 6);
}
.poll-field .poll-result-img .poll-result-item .result-content {
width: calc(5 * 100% / 6);
}
.poll-field .poll-result-img .poll-result-item .progress-poll .progress-bar {
height: 40px;
}
}
@media screen and (min-width: 768px) {
.poll-field .poll-question {
padding: 0 10px;
}
.poll-field .poll-card {
padding: 30px;
}
.poll-field .poll-card .card-item {
width: calc(100% / 3);
padding: 10px;
}
}
@media screen and (max-width: 900px) {
.poll-field .poll-card,
.poll-field .poll-slider,
.poll-field .poll-radio,
.poll-field .poll-checkbox,
.poll-field .poll-thankyou,
.poll-field .poll-result-img,
.poll-field .poll-result-text {
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
}
.poll-field .poll-checkbox-list,
.poll-field .poll-radio-list {
padding: 30px 0;
}
.poll-field .poll-result-img {
padding: 10px 0;
}
.poll-field .poll-result-img .poll-result-item {
width: 90%;
}
.poll-field .poll-thankyou {
min-height: 400px;
}
.poll-field .poll-result-text {
padding: 10px 0;
}
}
@media screen and (max-width: 1215px) {
.poll-field {
max-width: 100%;
}
}
.event-aside {
position: relative;
border: 1px solid #f0f0f0;
border-top: 0.25rem solid #d81800;
padding-left: 1rem;
padding-right: 1rem;
}
.event-aside.most-share .aside-title a::after {
display: none;
}
.event-aside .aside-title {
padding-top: 1.5rem;
padding-bottom: 1.5rem;
border-bottom: 1px solid #f0f0f0;
color: #d81800;
font-weight: 600;
text-transform: uppercase;
}
.event-aside .aside-title a {
position: relative;
color: #d81800;
font-weight: 600;
text-transform: uppercase;
}
.event-aside .aside-title a:hover {
opacity: 0.7;
text-decoration: none;
}
.event-aside .aside-title a::after {
right: -15px;
border: 3px solid transparent;
border-color: #D81800;
border-radius: 2px;
border-right: 0;
border-top: 0;
content: " ";
display: block;
height: 0.7em;
margin-top: -0.4375em;
pointer-events: none;
position: absolute;
top: calc(50% + (0.3em / 2));
transform: rotate(-135deg);
transform-origin: center;
width: 0.7em;
}
.event-aside .aside-content .aside-list a + a {
border-top: 1px solid #f0f0f0;
}
.event-aside .aside-content .aside-list a {
display: flex;
flex-direction: column;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
color: #333333;
}
.event-aside .aside-content .aside-list a:hover {
color: #D81800;
text-decoration: none;
}
.event-aside .aside-content .aside-list a span {
font-weight: 600;
text-overflow: ellipsis;
display: -webkit-box;
line-clamp: 3;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
white-space: normal;
overflow: hidden;
max-height: calc(1rem * 1.5 * 3);
}
.event-aside .aside-content .aside-list a .time {
font-weight: normal;
font-size: 0.875rem;
}
@media screen and (min-width: 1024px) {
.event-aside .aside-content .aside-list a span {
max-height: calc(1.125rem * 1.5 * 3);
}
}
.content-banner {
margin-top: 16px;
margin-bottom: 2rem;
}
.content-banner .article-header {
margin-bottom: 2rem;
}
.content-banner .article-header__title {
font-size: 1.75rem;
font-weight: 700;
line-height: 1.3em;
margin-bottom: 10px;
}
.content-banner .article-header__description {
font-size: 1.125rem;
}
.content-banner .article-header__published {
margin-bottom: 10px;
}
.content-banner .article-header .banner-content__published {
font-size: 0.875rem;
}
.content-banner .article-header .banner-content__published span {
position: relative;
padding: 0 10px;
line-height: calc(0.875rem * 1.2);
}
.content-banner .article-header .banner-content__published span:first-child {
padding-left: 0;
}
.content-banner .article-header .banner-content__published span:not(:last-child):after {
content: '';
position: absolute;
height: calc(0.875rem * 1.2);
bottom: 0px;
padding-right: 10px;
border-right: 1px solid #dadada;
}
.content-banner .image-block img {
display: block;
width: 100%;
height: auto;
}
@media screen and (min-width: 1024px) {
.content-banner .article-header__title {
font-size: 2.25rem;
}
.content-banner .article-header .banner-content__published {
font-size: calc(14px + 10 * (100vw - 1408px) / 1408);
display: flex;
align-items: center;
justify-content: flex-start;
}
.content-banner .article-header .banner-content__published span {
line-height: 1.5;
}
.content-banner .article-header .banner-content__published span:not(:last-child):after {
height: calc((14px + 10 * (100vw - 1408px) / 1408) * 1);
bottom: 50%;
transform: translateY(50%);
}
}
.author-quote {
padding-left: 32px;
margin-left: 32px;
margin-right: 32px;
margin-top: 1rem;
margin-bottom: 2rem;
border-left: 6px solid #d81800;
}
.author-quote .quote__sentence {
font-size: 1.125rem;
font-weight: 600;
}
.author-quote .quote__authour {
margin-top: 32px;
}
.author-quote .quote__authour::before {
content: '-';
}
@media screen and (min-width: 768px) {
.author-quote {
margin-left: 50px;
margin-right: 50px;
}
}
@media screen and (min-width: 768px) {
.author-quote .quote__sentence {
font-size: 1.375rem;
}
}
.filter-result {
max-width: 80%;
margin: 0 auto;
padding: 0px 0 50px;
}
.filter-result .filter-result-tb {
width: 80%;
margin: 0 auto;
padding: 0px 15px;
}
.filter-result table tr:nth-child(2n) {
background: #ebebeb;
border: 1px solid #ccc;
}
.filter-result table tr:nth-child(odd) {
background: #fff;
border: 1px solid #ccc;
}
.filter-result table tr th {
background: #1189d5;
padding: 15px;
}
.filter-result table tr .rgHeader {
font-weight: 700;
}
.filter-result table tr td {
border: 1px solid #dadada;
border-width: 0 0 1px;
padding: 8px 16px;
vertical-align: top;
font-size: 16px;
}
@media screen and (max-width: 767px) {
.filter-result {
max-width: 100% !important;
padding: 0px 0 25px;
}
.filter-result .filter-result-tb {
width: 100% !important;
padding: 0 10px;
}
}
@media print {
@page {
size: landscape;
}
.container {
max-width: 100vw !important;
width: 100vw;
}
.notice {
position: relative !important;
top: 0 !important;
}
.notice a {
text-decoration: none;
}
.header {
position: relative !important;
top: 0 !important;
}
.header:last-child {
display: none;
}
.header .identity {
display: flex;
align-items: center;
height: 80px;
box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15) !important;
}
.detail-banner-wrap {
padding-top: 0;
height: auto;
}
.detail-banner-wrap::before {
display: none;
}
.detail-banner-wrap img {
display: none;
}
.detail-banner-wrap .detail-banner-content {
position: relative;
bottom: 0;
left: 0;
color: black;
}
.carousel-detail-field .detailSwiper {
overflow: visible;
}
.carousel-detail-field .detailSwiper .swiper-wrapper {
transform: none !important;
display: flex;
flex-wrap: wrap;
}
.carousel-detail-field .detailSwiper .swiper-wrapper .swiper-slide {
width: -webkit-fit-content !important;
width: -moz-fit-content !important;
width: fit-content !important;
height: -webkit-fit-content !important;
height: -moz-fit-content !important;
height: fit-content !important;
}
.carousel-detail-field .detailSwiper .swiper-wrapper .swiper-slide-duplicate {
display: none;
}
.carousel-detail-field .detailSwiper .swiper-btn {
display: none;
}
.carousel-detail-field .detailSwiper .swiper-pagination {
display: none;
}
.tott-story-read-more .tott-story-item {
width: calc(100% / 3);
}
.tott-article-content .row {
flex-wrap: nowrap;
}
.tott-article-content .row .col-12 {
max-width: 50%;
}
.article-toolbar {
display: none;
}
.content-wrapper .right {
display: none;
}
.feedback-row {
display: none;
}
.most-popular-field {
display: none;
}
.footer {
display: none;
}
}
* {
font-family: 'Open Sans', sans-serif;
}
html {
min-width: 300px;
}
.container {
max-width: calc(1274px + 20px);
padding-left: 20px;
padding-right: 20px;
word-wrap: break-word;
}
.hide {
height: 100vh;
overflow-y: hidden;
}
h2.not-found {
font-size: 20px;
font-family: OpenSans-Bold;
color: #d11212;
margin: 0 0 30px;
text-align: center;
}
.global-title {
width: 100%;
text-align: center;
padding: 3rem 0;
line-height: 1.5;
font-weight: 700 !important;
font-size: 1.75rem !important;
}
.pagination-filter {
max-width: 100%;
margin: 0 auto;
padding: 0px 0 50px;
}
.pagination-filter .row {
max-width: 80%;
margin: 0 auto;
}
.pagination-filter .desktop-pagination {
max-width: 80%;
flex: 0 0 80%;
padding: 0px 15px !important;
}
.article {
padding: 2rem 0 !important;
}
.has-text-centered {
text-align: center;
padding: 20px 0px;
margin-bottom: 20px;
}
.has-text-centered p {
font-family: OpenSans-Regular;
text-align: center;
font-size: 1em;
}
.has-text-centered a {
color: #d81800;
text-decoration: underline;
}
.component-text {
display: block;
text-align: center;
width: 100%;
margin: 16px 0 32px;
}
.social-img {
width: 24px;
height: 24px;
min-width: 24px;
}
.is-fullwidth {
position: relative;
width: 100vw;
left: calc(-20px);
}
sgds-masthead {
max-width: 100%;
overflow: hidden;
display: block;
position: relative;
z-index: 999;
}
@media screen and (min-width: 425px) {
.container {
max-width: 100%;
}
}
@media screen and (max-width: 767px) {
.pagination-filter .row {
max-width: 100%;
padding: 0px 12px;
}
}
@media screen and (min-width: 768px) {
.container {
max-width: 100%;
}
}
@media screen and (min-width: 1024px) {
.container {
max-width: calc(890px + 30px);
padding-left: 15px;
padding-right: 15px;
}
.is-fullwidth {
left: calc((100vw - 890px) / -2);
}
.global-title {
font-weight: 700 !important;
font-size: 2.25rem !important;
}
}
@media screen and (min-width: 1216px) {
.container {
max-width: calc(1082px + 30px);
padding-left: 15px;
padding-right: 15px;
}
.is-fullwidth {
left: calc((100vw - 1082px) / -2);
}
}
@media screen and (min-width: 1408px) {
.container {
max-width: calc(1274px + 30px);
padding-left: 15px;
padding-right: 15px;
}
.is-fullwidth {
left: calc((100vw - 1274px) / -2);
}
}
/*# sourceMappingURL=style.css.map */