* {font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft JhengHei UI", "Microsoft JhengHei", "Microsoft Mhei", PMingLiU, MingLiU, sans-serif;font-weight: 400;}
a.safety-accordion-heading.title-box {background-color: #1b1988 !important;border-top-left-radius: 20px;border-top-right-radius: 20px;}

.banner_ctner {margin:0px;padding:0px;text-align:center;width:100%;}
.banner_ctner img{max-width:1300px;width:100%;}
.loading_ctner {display:none;height:300px;left:0;margin:0 auto;margin-top:20px;position:relative;top:0;width:530px;}
.loading1 {left:0;position:absolute;top:0;}
.loading2 {display:block;filter:alpha(opacity=70);height:100%;left:0;opacity:0.7;position:absolute;top:0;width:100%;}
.loading3 {background:url(../images/loading.gif) no-repeat center center;display:block;height:100%;left:0;position:absolute;top:0;width:100%;}
.slide_ctner{cursor:move;height:300px;left:0;overflow:hidden;position:absolute;top:0;visibility:hidden;width:530px;}

.ar_left{height:55px;left:-35px;top:123px;visibility:hidden;width:55px;}
.ar_right{height:55px;right:-35px;top:123px;visibility:hidden;width:55px;}

.event_anchor {content:'';display:table;}
.event_hide {display:none!important;}

h2 {color: #004BA9;}
h2>a {text-decoration: none;color: #146195;font-weight: 800;}

table {border-collapse: collapse;width: 100%;}
th,td {text-align: left;padding: 8px;}
th {background-color: #000;color: white;}
	
h2.events {color:#007573;font-size: 2.1em;text-align:center;background-image: none;padding-left: 0px;font-weight: 800;background-color:white;}
.events-desc {border: 3px solid #80f7f4;background-color: #f0fbff;border-radius: 25px;padding: 20px;text-align: left;}
table a {color:#000;}
.arrows {width: 100%;}
.arrow-left,.arrow-right {top: 70px;}

.vid-item:hover {background: #c0cafe;}

.pid-item {
        display: block;
        width: 148px;
        height: 148px;
        float: left;
        margin: 0;
        padding: 10px;
        position: relative;
    }

.pid-item:hover {cursor: pointer;background: #8faea3;}
.pid-list-container {width: 92%;overflow: hidden;margin-top: 20px;margin-left: 4%;margin-right: 4%;padding-bottom: 0px;}
	
	.eventNotesContainer{
		margin: 0 auto;
		width: 100%;
		display: flex!important;
		flex-wrap: wrap;
		justify-content: center;
	}
	.eventNotes {
		margin: 30px; 
		vertical-align: middle; 
		border: 1px solid #17f1f9; 
		border-radius: 5px; 
		background-color: #1a5268;
		font-size:1.5em; 
		color: #17f1f9; 
		font-style: italic; 
		padding:10px;
	}
    .photo-arrow-left {
        color: #fff;
        position: absolute;
        background: #67B4FF;
        padding: 15px;
        left: -25px;
        top: 50px;
        z-index: 99;
        cursor: pointer;
    }

    .photo-arrow-right {
        color: #fff;
        position: absolute;
        background: #67B4FF;
        padding: 15px;
        right: -25px;
        top: 50px;
        z-index: 100;
        cursor: pointer;
    }

    .photo-arrow-right:hover,.photo-arrow-left:hover {background: #CC181E;}
    .photo-arrows {position: relative;width: 100%;}

a.safety-accordion-heading h2 {background: none;color:#fff!important;font-weight:800;}
a.safety-accordion-heading.active h2 {background: none;}

/* override style at style.css ***********/
a.safety-accordion-heading {background-color: #7cdfd5;border-top-left-radius: 20px;border-top-right-radius: 20px;}
a.safety-accordion-heading>h2 {background-color: #628cb2;}
a.safety-accordion-heading.active {background:#9cfcf7!important;border-top-left-radius: 20px;border-top-right-radius: 20px;}

a.safety-accordion-heading>h2 {color: #080208;}
.safety-accordion-control {margin-left: 120px;}
.right .safety-accordion-control {text-align:center;}

.underline {text-decoration: underline;}

    /*============css 2017============*/
    body div#breadcrumb {display: block;}

    div#content {
        border-bottom: 0 !important;
        width: 100%;
        background-color: white;
        float: left;
        clear: both;
        border-bottom: 5px solid #91d95b;
        text-align: center;
        min-height: 0px;
    }

    div#content2 {
        padding-top: 80px;
        padding-bottom: 80px;
        background-color: #a7b5fa;
    }

    div#content3 {
        padding-bottom: 40px;
        background-color: #faeca7;
    }

    div#content4 {
        background-color: #eca7fa;
        border-bottom: 5px solid #91d95b;
        padding-bottom: 40px;
    }

    div#content2,
    div#content3,
    div#content4 {
        width: 100%;
        float: left;
        clear: both;
        text-align: center;
    }

    @media (min-width: 440px) {

        div#content2,
        div#content3,
        div#content4 {
            width: 100%;
            background-color: #FFFFFF;
            float: left;
            clear: both;
            text-align: center;
        }

        .swiper-container {
            width: 395px;
        }
    }

    @media (min-width: 771px) {

        div#content2,
        div#content3,
        div#content4 {
            width: 100%;
            background-color: #FFFFFF;
            float: left;
            clear: both;
            text-align: center;
        }

        .swiper-container {
            width: 690px;
        }
    }

    body div#content,
    body div#content2,
    body div#content3,
    body div#content4 {
        position: relative;
        z-index: 10;
    }

    body div#content:before,
    body div#content2:before,
    body div#content3:before,
    body div#content4:before {
        content: " ";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: -1;
    }

    body div#banner:before {
        background-image: url(../images/csw-2022/background_middle.png);
        background-repeat: repeat;
        background-position: center;
        background-size: 25%;
    }

    body div#content:before {
        background-image: url(../images/csw-2022/background_middle.png), url(../images/csw-2022/background_bottom.png);
        background-repeat: repeat, repeat-x;
        background-position: center, center bottom;
    }

    body div#content2:before {
        background-color: #e8e6ca;
        background-image: url(../images/csw-2022/background2.png);
        background-repeat: repeat-x;
        background-position: center bottom;
    }

    body div#content3:before {
        //	background-image: url(../images/csp-2017/bg_csp_3.jpg);
        background-color: #ffffff;
    }

    body div#content4:before {
        background-image: url(../images/csw-2022/background.png);
        background-color: #f1f5e9;
    }

    a.safety-accordion-heading {
        position: relative;
    }

    a.safety-accordion-heading h2 {
        color: #fff;
        background-image: none;
        font-weight: 800;
        padding: 20px 30px;
        font-size: 2em;
        padding-right: 150px;
    }

    a.safety-accordion-heading div.safety-accordion-control {
        position: absolute;
        right: 0;
        margin-left: 0
    }
	
	.eb_container {display:flex;flex-flow: row wrap;align-content: space-between;justify-content: space-between;}

    .eb_item {display: inline-flex;flex-direction: column;flex:1;flex-grow:0;width:100%;min-width:520px;margin: 20px 30px;box-shadow: 2px 2px 10px #d9d9d9;border-top: 0;background-color: #fff;}

    .eb_top {background-color: #9eb6ef;font-weight: bold !important;font-size: 1.3rem;padding: 1.8em;text-align: center;vertical-align: middle; /*added for CSW 2024 */height: 80px; /* original: 10% */}

    .eb_tpc {color: #00206d;display: flex;align-items: center;vertical-align: middle;/*added for CSW 2024 */height: 100%; /* original: 80% */justify-content: space-around;font-size: 1.3rem;}

    .eb_btm {color: #3f4041;padding: 15px 20px;flex: 1;}

    .eb_footer {color: #3f4041;padding: 15px 20px;border-top: 0;width: 93%;}
	.eb_banner {}
	.eb_banner img {width:100%;}
    .eb_image {width: 100%;height: 190px;}

    .eb_btm>div {position: relative;padding-bottom: 10px;text-align: left;}
    .eb_icn {position: absolute;top: 0;left: 0;}
    .eb_txt {padding: 5px 0 0 60px;}
    .eb_tit {color: #146195;font-weight: bold;}

    .eb_footer>div.eb_btn {padding: 15px 0 30px 0;border-top: 1px solid #ebebeb;text-align: center;}
    .eb_btn>a{
        font-weight: bold;
        padding: 15px 60px;
        border-width: 2px;
        display: inline-block;
        -moz-border-radius: 25px;
        -webkit-border-radius: 25px;
        border-radius: 25px;
    }
    .eb_footer > .active a{background-color: #9cfcf7;color: #063447;}
    .eb_footer > .inactive a{background-color: #bcbcbc;color: #666;pointer-events: none;}
	.logo-center {display: flex;justify-content: center;}
	.logo-center img{max-height:5.5em;}

div.safety-accordion-risk > div {width: 100% !important;}

div.safety-accordion-content {padding: 0;}
div.safety-accordion-background {background-color: #f4f4f4;width: 100% !important;text-align: center;position: relative;}
.dot-line {border-top: 3px dotted #165961;}
    .csp-learning-content-myhead {
        font-size: 1.8em;
        color: #003a5b;
        font-weight: bold;
        padding: 15px 0;
        margin: 0 30px;
    }

    .chp_logo_list a {
        vertical-align: middle;
        //width: 190px;
        padding: 20px 49px;
        display: inline-block;
    }

    .chp_logo_list img {
        max-width: 100%;
    }

    .csp-learning-content-leaflets>div {
        display: inline-block;
        width: 230px;
        padding: 10px 29px;
    }

    .lb_top>img {
        max-width: 100%;
    }

    .lb_btm {
        background-color: #fff;
        padding: 10px 0;
    }

    .lb_btn {
        padding-top: 15px;
        text-align: center;
    }

    .lb_btn>a {
        background-color: #e72034;
        color: #fff;
        font-weight: bold;
        padding: 15px 60px;
        border-style: solid;
        border-width: 2px;
        display: inline-block;
        -moz-border-radius: 25px;
        -webkit-border-radius: 25px;
        border-radius: 25px;
    }

    .lb_isc {
        text-align: center;
        padding: 20px 0;
    }

    .csp-learning-content-info>div {
        display: inline-block;
        width: 325px;
        padding: 10px 30px;
        text-align: center;
    }

    .igb_top img {
        max-height: 252px;
        max-width: 325px;
    }

    .igb_btm {
        color: #5C7CCB;
        padding: 10px 0;
        font-weight: bold;
    }

    .csp-learning-content-video>div {
        display: inline-block;
        width: 325px;
        padding: 10px 30px;
        text-align: center;
    }

    .csp-learning-content-video img {
        max-width: 100%;
    }

    .infographic-section {padding-top: 10px;}
    .infographic-section>div {display: inline-block;text-align: center;}	
	.infographic-section .infographic-caption {line-height:110%;min-height:60px;padding:15px;}
	
    div.infographic-caption {text-align: left;min-height: 90px;background-color: #9eb6ef;margin-top: -3px;color: #00206d;font-weight: bold;font-size: 1.1em;padding: 10px;}
	
    div.infographic-item {width: 300px;text-align: center;margin: 30px;vertical-align: top;padding: 1px 1px;box-shadow: 2px 2px 10px #9ca9bd;}
	.infographic-item a{color:#00206d;}	
    .infographic-item img {width: 100%;max-height: 177px;}

    .infographic-footer {font-size: 0.75em;}
	
    .cswLink .infographic-item img {width: 100% !important;}
    .cswLink .infographic-item {width: auto;}

    .video-section>div {display: inline-block;}
    div.video-item {
        width: 300px;
        text-align: center;
        margin: 30px;
        vertical-align: top;
        padding: 1px 1px;
        box-shadow: 2px 2px 10px #9ca9bd;
        height: auto;
    }

    div.video-caption {
        text-align: left;
        min-height: 115px;
        background-color: #fff;
        margin-top: -3px;
        color: black;
        font-weight: bold;
        font-size: 1.1em;
        padding: 15px 15px 4px;
        line-height: 110%;
    }
	.video-caption a, .others-caption a {color:#00305a;}

    .others-section>div {
        display: inline-block;
        text-align: center;
        background-color:
    }

    div.others-item {
        width: 300px;
        text-align: center;
        margin: 30px;
        vertical-align: top;
        padding: 1px 1px;
        box-shadow: 2px 2px 10px #9ca9bd;
        border: 1px solid #fff;
        height: 50%;
        position: relative;
    }

    div.others-caption {
        text-align: left;
        min-height: 122px;
        background-color: #fff;
        margin-top: -3px;
        color: black;
        font-weight: bold;
        font-size: 1.1em;
        padding: 10px;
        max-height: 134px;
    }

    div.others-footer {
        bottom: 10px;
        position: absolute;
        display: flex;
        right: 10px;
    }

    /*****************************************/
    
	.video-item img {width:100%;}
	img.partner-logo  {width:auto;}

    .section_img {max-width: 120px;}
	
	.other-head img{width:100%;}
    .header {width: 100%;margin: 0;padding: 0;display:flex;}
    .header .left {width: 100%;padding-right: 10px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
    .header .right {padding: 0 2px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
	.header span {color:#00554C;}

    .swiper-container {
        width: 86%;
        height: 100%;
        background-color: #f1f5e9;
        padding: 0 50px 50px 50px;
    }

    .swiper-slide {
        text-align: center;
        font-size: 1.1em;
        background: #165961;
        color: white;
        padding: 0 0 20px;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }

.swiper-slide>a {color: #fff;}
.swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;}
.swiper-button-next {
        background-image: url(../images/csw-2022/next.png);
        background-repeat: no-repeat;
        background-size: 100% auto;
        background-position: center;
        width: 52px !important;
        height: 52px !important;
        top: 40% !important;
    }

.swiper-button-next::after {display: none;}
.swiper-button-prev {
        background-image: url(../images/csw-2022/prev.png);
        background-repeat: no-repeat;
        background-size: 100% auto;
        background-position: center;
        width: 52px !important;
        height: 52px !important;
        top: 40% !important;
}

.swiper-button-prev::after {display: none;}
.pEvents {display: block;position: relative;max-width: 1170px;width:100%;}
.partner-logo {max-height: 50px}
	
.useful-link-box {text-align:left!important;width: 100%;padding: 1rem 2rem 2rem;}
.useful-link-box a{color:#000;}
.useful-link-row {display: inline-flex;width:100%;padding: .5rem 0;align-items: center;}
.useful-link-row img {max-height:40px;padding-right:.5rem;}
	
@media (min-width:440px) {
    div.safety-accordion-risk > div {width: 480px;}
    a.safety-accordion-heading h2 {width: 340px;}
}
@media (min-width:768px) {
    div.safety-accordion-risk > div {width: 580px;}
    a.safety-accordion-heading h2 {width: 460px;}
}
@media (min-width:992px) {
    div.safety-accordion-risk > div {width: 800px;}
    a.safety-accordion-heading h2 {width: 680px;}
}
@media (min-width:1200px) {
   div.safety-accordion-risk > div {width: 1000px;}
    a.safety-accordion-heading h2 {width: 880px;}
}