/* @license GPL-2.0-or-later https://www.drupal.org/licensing/faq */
.mangrove--animated--section{display:flex;flex-direction:column;padding:0px !important;margin:0px !important;position:relative;width:100%;height:auto;max-width:1300px;}.mangrove--animated--section h1,.mangrove--animated--section h2,.mangrove--animated--section h3,.mangrove--animated--section p{font-family:'Ubuntu',Helvetica,sans-serif;}.mangrove--animated--section h1{font-size:40px;color:#1C0761;font-weight:400;line-height:45px;}.mangrove--animated--section .cover-image h1{margin-top:200px;font-weight:700 !important;}.mangrove--animated--section h2{font-style:normal;font-weight:normal;font-size:32px;line-height:42px;color:#1C0761;}.mangrove--animated--section h3{font-size:20px;color:#1C0761;font-weight:400;line-height:32px;color:white;}.mangrove--animated--section p{line-height:26px;font-size:18px;}.mangrove--animated--section .content{position:absolute;height:180px;left:23px;right:23px;top:calc(50% - 180px/2 - 46px);text-align:center;}.mangrove--animated--section .highlight{color:#EC0C19;font-weight:600;}.mangrove--animated--section .flex-row{display:flex;flex-flow:row wrap;}.mangrove--animated--section .flex-column{display:flex;flex-flow:column wrap;}.mangrove--animated--section .content-style{position:absolute;height:128px;left:0px;right:0px;bottom:26px;font-family:'Ubuntu',Helvetica,sans-serif;font-style:normal;font-weight:bold;font-size:24px;line-height:32px;text-align:center;color:#EC0C19;}.mangrove--animated--section .mangrove-tree{order:2;display:block;background:url(/sites/msig_hk/themes/hk/images/biodiversity/mangrove/Mangrove-tree.png);width:819px;height:759px;background-position:left;background-repeat:no-repeat;background-size:100% 100%;position:relative;margin-bottom:-290px;}.mangrove--animated--section .graphic-2-1{display:none!important;height:0;}@media (max-width:768px){.mangrove--animated--section .mangrove-tree{background-position:-128% 30%;background-repeat:no-repeat;background-size:88%;}}.mangrove--animated--section .ocean-gradient{background:linear-gradient(178.77deg,rgba(1,148,168,0.75) 51.7%,rgba(142,234,127,0.2925) 73.43%,rgba(93,129,183,0) 95.16%);}.mangrove--animated--section .cover{text-align:center;display:flex;flex-direction:column;padding:80px 0px 16px 0;position:static;height:auto;left:0px;right:0px;top:0px;background:#EDEDE4;flex:none;order:0;margin:0px 0px;}.mangrove--animated--section .cover-title{position:static;width:382px;height:110px;left:calc(50% - 382px/2);top:80px;text-align:center;color:#1C0761;flex:none;order:0;align-self:center;}.mangrove--animated--section .cover-image{display:block;background:url(/sites/msig_hk/themes/hk/images/biodiversity/mangrove/cover-img-mangrove.png);background-repeat:no-repeat;background-position:center center;background-size:cover;position:static;width:500px;height:500px;top:239px;flex:none;align-self:center;}.mangrove--animated--section .cover-intro{max-width:720px;position:relative;height:auto;text-align:center;color:#808080;flex:none;order:2;align-self:center;margin:40px 16px;}.mangrove--animated--section .section-0{display:flex;flex-flow:row nowrap;align-items:bottom;align-content:bottom;align-self:center;height:auto;width:100%;position:relative;background-color:#EDEDE4;margin-top:-5px;}.mangrove--animated--section .section-3{display:flex;flex-direction:row;justify-content:center;position:relative;width:100%;}.mangrove--animated--section .section-2{display:flex;flex-direction:row wrap;flex-shrink:2;flex-wrap:wrap;text-align:left;justify-content:space-around;position:relative;min-height:450px;width:100%;margin-top:300px;}.mangrove--animated--section .content-footer h2{color:white;letter-spacing:0.04em;}.mangrove--animated--section .section-1{text-align:center;display:flex;flex-direction:column;align-items:center;position:relative;height:992px;width:100%;margin-left:auto;margin-right:auto;}.mangrove--animated--section .section-1 .bg .wave-1{top:-40px;left:-380px;opacity:80%;}.mangrove--animated--section .footer{position:relative;width:100%;height:auto;background:#00385B;z-index:4;margin-top:-2px;}.mangrove--animated--section .graphic-3{order:1;align-self:flex-end;position:relative;width:auto;margin-left:auto;padding-right:50px;}.mangrove--animated--section .graphic-3 .wave{align-self:center;}.mangrove--animated--section .graphic-wrapper{display:flex;margin-bottom:0px;align-items:flex-start;justify-content:space-between;}.mangrove--animated--section .line-border{position:static;display:block;height:4px;background-color:#EC0C19;width:150px;flex:none;order:1;align-self:center;margin-left:auto;margin-right:auto;margin-bottom:20px;}.mangrove--animated--section .section-2-wrapper{display:flex;flex-flow:row wrap;}.mangrove--animated--section .graphic-0{order:0;width:400px;position:absolute;height:auto;}.mangrove--animated--section .graphic{z-index:88;position:relative;z-index:3;}.mangrove--animated--section .graphic-container{display:flex;justify-content:center;width:100%;margin-top:30px;height:80px;margin-bottom:40px;}.mangrove--animated--section .graphic-container-1{display:flex;justify-content:left;width:100%;}.mangrove--animated--section .content-2 h2{margin-right:24px;margin-bottom:40px;margin-left:60px;}.mangrove--animated--section .graphic-2{flex:2;z-index:88;position:relative;}.mangrove--animated--section .spacer{margin-bottom:200px;height:50px;}.mangrove--animated--section .content-1{position:relative;height:auto;margin-bottom:50px;margin-top:150px;z-index:99;max-width:640px;margin-right:24px;margin-left:24px;}.mangrove--animated--section .content-0{order:2;position:relative;height:auto;z-index:88;max-width:440px;margin-right:auto;margin-left:auto;color:#1C0761;margin-top:60px;}.mangrove--animated--section .content-2{align-self:center;justify-self:center;text-align:left;height:auto;z-index:99;max-width:700px;margin-right:auto;margin-left:auto;}.mangrove--animated--section .graphic-row{display:flex;align-items:center;justify-content:flex-start;}.mangrove--animated--section .graphic-2-1{display:flex;flex-flow:row nowrap;width:100%;align-items:center;justify-content:center;margin-top:80px;margin-right:30%;padding-right:30%;}.mangrove--animated--section .micro-2{margin-left:24px;}.mangrove--animated--section .graphic-2-1 .micro-2{margin-right:32px;}.mangrove--animated--section .flex-row-reverse{display:flex;flex-flow:row-reverse;align-items:center;justify-content:flex-start;}.mangrove--animated--section .content-3{flex:1;width:100%;position:relative;height:auto;z-index:99;margin-right:24px;margin-left:24px;align-self:top;max-width:700px;margin-top:20px;text-align:center;}.mangrove--animated--section .content-3 h2{width:700px;margin-bottom:20px;}@media (max-width:768px){.mangrove--animated--section .content-3 h2{width:100%;}}.mangrove--animated--section .bg{position:absolute;width:100%;height:auto;}.mangrove--animated--section .background-wrapper{position:absolute;width:100%;}.mangrove--animated--section .reef{display:block;background:url(/sites/msig_hk/themes/hk/images/biodiversity/mangrove/reef.png);width:100%;height:380px;margin-top:250px;}.mangrove--animated--section .bg-img{display:block;background:url(/sites/msig_hk/themes/hk/images/biodiversity/mangrove/bg-img.png);background-color:#EDEDE4;background-size:100% 100%;background-position:center center;width:100%;height:1662px;margin-top:-5px;}.mangrove--animated--section .micro-1{display:block;background:url(/sites/msig_hk/themes/hk/images/biodiversity/mangrove/micro-1.png);width:351px;height:91px;}.mangrove--animated--section .micro-2{display:block;background:url(/sites/msig_hk/themes/hk/images/biodiversity/mangrove/micro-2.png);width:247px;height:260px;}.mangrove--animated--section .wave{display:block;background:url(/sites/msig_hk/themes/hk/images/biodiversity/mangrove/wave.png);width:412px;height:44px;}.mangrove--animated--section .fishes{display:block;background:url(/sites/msig_hk/themes/hk/images/biodiversity/mangrove/Fishes.png);width:197px;height:55px;}.mangrove--animated--section .fishes-2{display:block;background:url(/sites/msig_hk/themes/hk/images/biodiversity/mangrove/Fishes-2.png);width:525px;height:172px;}.mangrove--animated--section .shark{display:block;background:url(/sites/msig_hk/themes/hk/images/biodiversity/mangrove/shark.png);width:500px;height:256px;background-size:cover;}.mangrove--animated--section .graphic-fish{flex-shrink:1;margin-right:60%;}.mangrove--animated--section .graphic-shark{flex-shrink:2;margin-left:40%;background-size:30% 50%;justify-self:flex-end;margin-top:-10px;}.mangrove--animated--section .grp-fish{display:block;background:url(/sites/msig_hk/themes/hk/images/biodiversity/mangrove/grp-fish.png);width:414px;height:107px;background-size:contain;}.mangrove--animated--section .content-footer{color:white;text-align:center;position:relative;}.mangrove--animated--section .content-wrapper{padding:37px 24px;position:relative;height:auto;background:linear-gradient(0deg,rgba(255,255,255,0.1),rgba(255,255,255,0.1)),linear-gradient(180deg,rgba(0,0,0,0.12) 0%,rgba(0,0,0,0) 100%);background-blend-mode:screen,normal;border:2px solid rgba(255,255,255,0.75);box-sizing:border-box;border-radius:30px;}.mangrove--animated--section .link-container{display:flex;flex-direction:row;position:relative;width:100%;justify-content:space-around;margin-top:24px;width:100%;}.mangrove--animated--section .link-mangrove{display:block;background:url(/sites/msig_hk/themes/hk/images/biodiversity/mangrove/link-mangrove.png);width:200px;height:200px;background-repeat:no-repeat;justify-self:center;background-size:100% 100%;background-position:center;}.mangrove--animated--section .link-forest{display:block;background:url(/sites/msig_hk/themes/hk/images/biodiversity/mangrove/link-forest.png);width:200px;height:200px;background-repeat:no-repeat;justify-self:center;background-size:100% 100%;background-position:center;}.mangrove--animated--section .link-ocean{display:block;background:url(/sites/msig_hk/themes/hk/images/biodiversity/mangrove/link-ocean.png);width:200px;height:200px;background-repeat:no-repeat;justify-self:center;background-size:100% 100%;background-position:center;}.mangrove--animated--section .link-row-1{position:relative;width:50%;height:auto;}.mangrove--animated--section .link-row-2{position:relative;width:50%;height:auto;}.mangrove--animated--section .link-column{display:flex;flex-direction:column;padding:0px;align-items:center;justify-content:center;width:auto;height:auto;}.mangrove--animated--section .footer-wrapper{padding:0px;position:relative;width:100%;height:auto;max-width:720px;}.mangrove--animated--section .link-header{position:relative;height:32px;font-size:16px;text-align:center;color:#FFFFFF;letter-spacing:0.04em;}.mangrove--animated--section .link-wrapper{position:relative;margin-top:60px;width:100%;margin-left:auto;margin-right:auto;}.mangrove--animated--section .footer-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 16px;position:relative;height:auto;margin-top:0px;}.mangrove--animated--section .link-txt-mangrove{position:relative;width:150px;height:40.54px;font-weight:bold;line-height:38px;display:flex;align-items:center;text-align:center;color:#FFFFFF;justify-content:center;}.mangrove--animated--section .link-txt-forest{position:static;width:150px;height:40.54px;left:-8.11px;top:166px;font-family:'Ubuntu',Helvetica,sans-serif;font-style:normal;font-weight:bold;display:flex;align-items:center;text-align:center;justify-content:center;color:#FFFFFF;}@media screen and (max-width:1119px){.mangrove--animated--section .content-0{margin-right:24px;max-width:423px;}}@media screen and (max-width:960px){.mangrove--animated--section body{background-color:#EDEDE4;width:100%;}.mangrove--animated--section h1{font-size:32px;color:#1C0761;font-weight:400;line-height:45px;}.mangrove--animated--section h2{font-style:normal;font-weight:normal;font-size:24px;line-height:32px;color:#1C0761;}.mangrove--animated--section h3{font-size:18px;color:#ffffff;font-weight:400;line-height:24px;}.mangrove--animated--section p{line-height:26px;font-size:18px;}.mangrove--animated--section .section-2{text-align:center;}.mangrove--animated--section .section-3{text-align:center;}.mangrove--animated--section .content-3{align-self:center;}.mangrove--animated--section .reef{top:0px;margin-top:170px;}.mangrove--animated--section .graphic-0{left:-150px;}.mangrove--animated--section .graphic-fish{margin-right:30%;}.mangrove--animated--section .graphic-shark{margin-left:30%;}.mangrove--animated--section .graphic-0{width:200px;}.mangrove--animated--section .graphic-shark{}.mangrove--animated--section .content-0{max-width:350px;}.mangrove--animated--section .bg-img{background-size:cover;}}@media screen and (max-width:720px){.mangrove--animated--section .graphic-0{height:500px;width:0px;margin-top:-40px;}.mangrove--animated--section .content-0{display:block;margin-left:auto;margin-right:16px;align-items:center;}.mangrove--animated--section .content-2{text-align:center;}.mangrove--animated--section .content-0{text-align:center;}.mangrove--animated--section .micro-2{display:none;}.mangrove--animated--section .link-mangrove{width:150px;height:150px;background-size:100% 100%;background-position:50% top;}.mangrove--animated--section .link-forest{width:150px;height:150px;background-size:100% 100%;background-position:50% top;}.mangrove--animated--section .link-ocean{width:150px;height:150px;background-size:100% 100%;background-position:50% top;}}@media screen and (max-width:575px){.mangrove--animated--section .cover-image h1{margin-top:100px;}.mangrove--animated--section .graphic-0{height:500px;width:0px;left:-257px;}.mangrove--animated--section .section-2{margin-top:210px;}.mangrove--animated--section .content-0{display:flex;margin-left:auto;margin-right:auto;align-items:center;}.mangrove--animated--section .content-0 h2{padding-left:50px;}.mangrove--animated--section .shark{background-repeat:no-repeat;height:200px;background-size:contain;width:100vw;}.mangrove--animated--section .graphic-3{margin-right:80%;}.mangrove--animated--section .graphic-container-1{margin-left:70%;}.mangrove--animated--section .reef{background-repeat:no-repeat;background-size:80% 80%;}.mangrove--animated--section .content-3{margin-top:40px;}.mangrove--animated--section .content-wrapper{padding:24px 8px;}.mangrove--animated--section .cover-intro{margin-left:24px;margin-right:24px;}.mangrove--animated--section .link-mangrove{width:150px;height:150px;background-size:100% 100%;background-position:50% top;}.mangrove--animated--section .link-forest{width:150px;height:150px;background-size:100% 100%;background-position:50% top;}.mangrove--animated--section .link-ocean{width:150px;height:150px;background-size:100% 100%;background-position:50% top;}.mangrove--animated--section .cover-image{width:300px;height:300px;background-size:100% 100%;}.mangrove--animated--section .graphic-2-1 .wave{margin-left:50%;}.mangrove--animated--section .graphic-shark{margin-top:0;margin-left:10%;}.mangrove--animated--section .content-0{display:block;}.mangrove--animated--section .bg-img{background-size:cover;background-image:url(/sites/msig_hk/themes/hk/css/./images/mangrove/bg-img-mobile.png);}.mangrove--animated--section .content-2 h2{margin-left:24px;}.mangrove--animated--section .content-3 h2{margin-bottom:10px;}.mangrove--animated--section .grp-fish{display:block;background:url(/sites/msig_hk/themes/hk/css/./images/mangrove/grp-fish.png);width:179px;height:139px;background-size:contain;}}@media screen and  (min-width:961px) and (max-width:1024px){.mangrove--animated--section .graphic-shark{margin-top:-142px;background-size:contain;margin-left:58%;}.mangrove--animated--section .shark{width:400px;height:199px;}}