/* 
Theme Name: Customized Hello Elementor
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Sasky Samonte
Author URI: https://iclickmedia.com.sg/
Template: hello-elementor
Version: 1.1.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
* iClick Media Custom Styles
* @author: Sasky
* @URL: iclickmedia.com.sg
*/


a {
    color: #0065B3;
}

a:hover {
    color: #F38122;
}

.site-header, body:not([class*=elementor-page-]) .site-main {
    max-width: 1140px;
}

.clearfix {
  overflow: auto;
}

.elementor-slideshow__title,
.elementor-slideshow__description {
    display: none;
}



/** Header **/
#hbptc-site-header {
    max-width: 100%;
}

#hbptc-site-header__contaner {
    margin-top: 10px;
    margin-right: 5%;
    background-size: 99%;
    background-repeat: no-repeat;
    background-position: top right;
}

.hbptc-top-line {
    margin: 10px 5%;
    height: 20px;
    background-size: cover;
    background-repeat: no-repeat;
}

.site-navigation ul.menu li a {
    padding: 5px 5px;
}

.site-header .site-navigation {
    justify-content: left;
}

.site-navigation {
    flex-grow: 0;
}

.hbptc-overlay {
    background: #000;
}

.hbptc-page-header {
    background-size: cover;
}

.hbptc-page-title h1 {
    text-align: center;
    color: #0D66B0;
    font-weight: bold;
    padding: 0 50px;
}

.hbptc-site-hotline .hbptc-site-hotline__title span {
    color: #0343AC;
    font-style: italic;
}

.hbptc-site-hotline .hbptc-site-hotline__number span {
    color: #0343AC;
    font-weight: bold;
}

.hbptc-site-24hotline .hbptc-site-24hotline__title span {
    color: #AD0119;
    font-style: italic;
}

.hbptc-site-24hotline .hbptc-site-24hotline__number {
    color: #0343AC;
    font-weight: bold;
}

.hbptc-site-top-rightside-logo img {
    width: 100%;
    margin-top: 10px;
}


/** Table Press **/
.hbptc-services.dataTable.no-footer {
    border-bottom: 0px solid #111;
}

.hbptc-services.dataTable thead .sorting {
    background-image: none;
}

.hbptc-services.tablepress .sorting:after {
    display: none;
}


/** Pricing Style **/
.hpbtc-pricing-style sub.period {
    vertical-align: top!important;
    display: inline-block;
    padding: 14px 0px;
    width: 50%;
    text-align: left;
}


.hpbtc-pricing-style .ekit-wid-con .elementskit-pricing-tag {
    background-color: #fff;
}

/** Columns **/

/* Create three equal columns that floats next to each other */
/* Clear floats after the columns */
.hbptc-row:after {
      content: "";
      display: table;
      clear: both;
}

.hbptc-column {
      float: left;
      padding: 10px;
}

.hbptc-column-10 {
      width: 10%;
}

.hbptc-column-15 {
      width: 15%;
}

.hbptc-column-20 {
      width: 20%;
}

.hbptc-column-30 {
      width: 30%;
}

.hbptc-column-33 {
      width: 33%;
}

.hbptc-column-40 {
      width: 40%;
}

.hbptc-column-50 {
      width: 50%;
}

.hbptc-column-60 {
      width: 60%;
}

.hbptc-column-70 {
      width: 70%;
}


.hbptc-column-80 {
      width: 80%;
}

.hbptc-column-90 {
      width: 90%;
}


.hbptc-column-100 {
      width: 100%;
}


.hbptc-column-30 {
    width: 30%;
}



/** Forms **/
.hbptc-group-buttons {
    margin-top: 20px;
}
.wpcf7-response-output {
	/** display: none!important; **/
}

.hbptc-attachment {
    margin: 20px 0px;
}

.wpcf7 .ajax-loader {
    margin-top: 10px;
    margin-left: 90px;
    position: absolute;
}


[type=reset] {
    display: inline-block;
    font-weight: 400;
    color: #c36;
    text-align: center;
    white-space: nowrap;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid #c36;
    padding: .5rem 1rem;
    font-size: 1rem;
    border-radius: 3px;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    cursor: pointer;
}

[type=reset]:focus, [type=reset]:hover {
    color: #fff;
    background-color: #c36;
    text-decoration: none;
}


.wpcf7 input[type="file"] {
    border: none;
    margin-top: 10px;
    border-radius: 3px;
    padding: 10px 10px;
    width: 100%;
}

#hbptc-share-review input,
#hbptc-share-review textarea {
    background: transparent;
    border: none;
    border-bottom: solid 2px white;
}

#hbptc-share-review input[type="file"] {
    background: transparent;
    border: none;
    color: #fff;
}

#hbptc-share-review input[type="submit"] {
    color: #fff;
}

#hbptc-share-review label {
    text-transform: uppercase;
    color:#fff;
}

#hbptc-share-review ::placeholder {
    color: #ffffff70;
}

/** Image Carousel **/
.swiper-slide-image {
    cursor: pointer;
}



/** Annual Report **/
.hbptc-publication-report-carousel__content a {
    color: #fff;
    font-weight: bold;
    background: #0065B3;
    padding: 10px;
    border-radius: 10px;
}

.hbptc-publication-report-carousel__content a:hover {
    color: #fff;
    background: #F38122;
}

.hbptc-publication-report-carousel__content h2 {
    font-size: 2rem;
    color: #0D66B0;
    font-weight: bold;
}

.hbptc-publication-report-carousel__content span {
    font-weight: bold;
    margin-bottom: 20px;
    display: inline-block;
}

.hbptc-publication-report-carousel__img {
    text-align: center;
}

.hbptc-publication-report-carousel__img img {
    max-width: 280px;
}

.hbptc-publication-report-carousel__arrow .swiper-button-next,
.hbptc-publication-report-carousel__arrow .swiper-button-prev {
    background-image: none;
}

.hbptc-publication-report-carousel__arrow .swiper-button-next i,
.hbptc-publication-report-carousel__arrow .swiper-button-prev i {
    font-size: 3em;
}




/** Custom Button **/
a.hbptc_btn {
    color: #fff;
    font-weight: bold;
    background: #0065B3;
    margin-top: 10px;
    padding: 10px;
    border-radius: 10px;
    display: inline-block;
}

a.hbptc_btn:hover {
    background: #F38122;
}


/** Custom Heading **/
h2.handy-man__title {
    font-size: 2rem;
    font-weight: bold;
}

h2.primary-color {
    color: #0065B3;
}

h2.secondary-color {
    color: #F38122;
}

h2.black-color {
    color: #000;
}

p.handy-man__content {
    font-size: 1rem;
}

p.handy-man__content a {
    color: #000;
}

/** Sticky Column & Menu **/

.handy_man { 
    position: sticky; 
    position: -webkit-sticky; 
} 

.handy_man_sticky {
    top: 5rem;
}


#hbptc-sticky-menu a {
    display: block;
    margin-bottom: 8px;
    line-height: 18px;
    color: #F27B13;
}

#hbptc-sticky-menu a:hover {
    color: #0065B3;
}

#hbptc-sticky-menu a.highlight {
    display: block;
    font-weight: bold;
    text-decoration: underline;
    color: #0065B3;
}



/** Hover Effects **/
.hover-box {
    height: 350px;
    position: relative;
    cursor: pointer;
}
.hover-box:hover .hover-show-title,
.hover-box:hover .hover-show-btn {
    opacity: 1;
    visibility: visible;
    z-index: 9;
}

.hover-show-title,
.hover-show-btn {
    opacity: 0;
    visibility: hidden;
}

.hover-box:hover .hover-hide-title {
    opacity: 0;
    visibility: hidden;
}

.hover-show-title a {
    display: inline-block;
    padding: 10px;
    margin: 2px 0px;
    color: #fff;
    background: #0065B3;
    width: 90%;
}

.hover-show-title a:hover {
    color: #000!important;
    background: #fafafa;
}

/** Parallax **/
.parallax_content_mps {
    margin-left: 5em;
}

.parallax_content_img {
    margin-right: 5em;
}
   
   
/** Common Facilities Booking **/
.hbptc-cfb-tab .elementor-widget-container {
    max-height: 330px;
}

.hbptc-cfb-tab .elementskit-pricing-header  {
    max-height: 120px;
}

/** Buttons **/
[type=button], [type=submit], [type=reset], button {
    color: #0065B3;
    border: 1px solid #0065B3;
}

[type=button]:focus, [type=button]:hover, [type=submit]:focus, [type=submit]:hover, [type=reset]:focus, [type=reset]:hover, button:focus, button:hover {
    color: #fff;
    background-color: #0065B3;
}

/** Price Custom Style **/
.hbptc-min-height .elementor-widget-container {
  height: 90px;   
}

.hbptc-pricing-tag .elementor-widget-container {
    height: 120px;
    padding-top: 20px;
}

.hbptc-pricing-tag .elementor-widget-container span.hbptc-price {
    font-size: 48px;
    margin-left: 20px;
    font-weight: 700;
    color: #0D66B0;
    display:inline-block;
}

.hbptc-pricing-tag .elementor-widget-container span.hbptc-per-daylocation {
    display:inline-block;
    font-size: 18px;
    font-weight: 400;
    line-height: 22px;
}

/** Custom Animation Effecs **/
.hbptc-infobox {
    height: 100%;
    transition: all .4s ease;
    cursor: pointer;
}

.hbptc-infobox:hover {
    background-color: #FFFFFF;
    box-shadow: 0px 30px 30px 0px rgb(28 33 62 / 8%);
    border-style: solid;
    border-width: 3px 0px 0px 0px;
    border-color: #0065B3;
    border-radius: 0px 0px 0px 0px;
    transform: translateY(-8px);
}

.bounce-clouds-1 {
	animation: bounce 4s infinite;
	-webkit-animation: bounce 4s infinite;
	-moz-animation: bounce 4s infinite;
	-o-animation: bounce 4s infinite;
}

.bounce-clouds-2 {
	animation: bounce 5s infinite;
	-webkit-animation: bounce 5s infinite;
	-moz-animation: bounce 5s infinite;
	-o-animation: bounce 5s infinite;
}

.bounce-clouds-3 {
	animation: bounce 7s infinite;
	-webkit-animation: bounce 7s infinite;
	-moz-animation: bounce 7s infinite;
	-o-animation: bounce 7s infinite;
}

@-webkit-keyframes bounce-clouds-1 {
	0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);}	
	40% {-webkit-transform: translateY(-30px);}
	60% {-webkit-transform: translateY(-15px);}
}
 
@-moz-keyframes bounce-clouds-1 {
	0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}
	40% {-moz-transform: translateY(-30px);}
	60% {-moz-transform: translateY(-15px);}
}
 
@-o-keyframes bounce-clouds-1 {
	0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}
	40% {-o-transform: translateY(-30px);}
	60% {-o-transform: translateY(-15px);}
}

@keyframes bounce-clouds-1 {
	0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
	40% {transform: translateY(-30px);}
	60% {transform: translateY(-15px);}
}

@-webkit-keyframes bounce-clouds-2 {
	0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);}	
	40% {-webkit-transform: translateY(-30px);}
	60% {-webkit-transform: translateY(-15px);}
}
 
@-moz-keyframes bounce-clouds-2 {
	0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}
	40% {-moz-transform: translateY(-30px);}
	60% {-moz-transform: translateY(-15px);}
}
 
@-o-keyframes bounce-clouds-2 {
	0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}
	40% {-o-transform: translateY(-30px);}
	60% {-o-transform: translateY(-15px);}
}

@keyframes bounce-clouds-2 {
	0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
	40% {transform: translateY(-30px);}
	60% {transform: translateY(-15px);}
}

@-webkit-keyframes bounce-clouds-3 {
	0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);}	
	40% {-webkit-transform: translateY(-30px);}
	60% {-webkit-transform: translateY(-15px);}
}
 
@-moz-keyframes bounce-clouds-3 {
	0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}
	40% {-moz-transform: translateY(-30px);}
	60% {-moz-transform: translateY(-15px);}
}
 
@-o-keyframes bounce-clouds-3 {
	0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}
	40% {-o-transform: translateY(-30px);}
	60% {-o-transform: translateY(-15px);}
}

@keyframes bounce-clouds-3 {
	0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
	40% {transform: translateY(-30px);}
	60% {transform: translateY(-15px);}
}


/** Info Box **/
.hbptc-post-box .elementor-widget-container {
    height: 200px;
    min-height: 200px;
}

.hbptc-achieved-box .elementor-widget-container {
    height: 500px;
    min-height: 500px;
}


/** Tabs & Filter**/
#hbptc-tab-style-1 .eael-tabs-nav {
    margin-top: -99px;
}

#hbptc-gallery .eael-filter-gallery-control li[data-filter=".eael-cf-bukit-panjang"].control.active,
#hbptc-tab-style-1 .eael-tabs-nav li#bukit-panjang {
    background-color: #33C9F1;
}

#hbptc-gallery .eael-filter-gallery-control li[data-filter=".eael-cf-bukit-timah"].control.active,
#hbptc-tab-style-1 .eael-tabs-nav li#bukit-timah {
    background-color: #F9B4A6;
}

#hbptc-gallery .eael-filter-gallery-control li[data-filter=".eael-cf-cashew"].control.active,
#hbptc-tab-style-1 .eael-tabs-nav li#cashew {
    background-color: #E7C96B;
}

#hbptc-gallery .eael-filter-gallery-control li[data-filter=".eael-cf-ulu-pandan"].control.active,
#hbptc-tab-style-1 .eael-tabs-nav li#ulu-pandan {
    background-color: #89D1C4;
}


#hbptc-gallery .eael-filter-gallery-control li[data-filter=".eael-cf-zhenghua"].control.active,
#hbptc-tab-style-1 .eael-tabs-nav li#zhenghua {
    background-color: #B5BDE9;
}

#hbptc-tab-style-1 .eael-tabs-nav li.active {
    font-size: 30px;
    margin-top: -35px;
}


#hbptc-tab-style-2 .eael-tabs-nav {
    margin-top: -87px;
}

#hbptc-tab-style-2 .eael-tabs-nav li.active {
    font-size: 16px;
    margin-top: -10px;
}


#hbptc-tab-style-2 .eael-tabs-nav li#good-health-and-well-being {
    background-color: #206B32;
}

#hbptc-tab-style-2 .eael-tabs-nav li#quality-education {
    background-color: #C22133;
}

#hbptc-tab-style-2 .eael-tabs-nav li#affordable-and-clean-energy {
    background-color: #B1810E;
}

#hbptc-tab-style-2 .eael-tabs-nav li#industry-innovation-and-infrastructure {
    background-color: #AA4D19;
}

#hbptc-tab-style-2 .eael-tabs-nav li#sustainable-cities-and-communities {
    background-color: #AF6F1B;
}

#hbptc-tab-style-2 .eael-tabs-nav li#responsible-consumption-and-production {
    background-color: #14264A;
}

#hbptc-tab-style-2 .eael-tabs-nav li#climate-action {
    background-color: #32542B;
}

#hbptc-tab-style-2 .eael-tabs-nav li#partnerships-for-the-goals {
    background-color: #8F621D;
}


#hbptc-gallery .gallery-item-thumbnail-wrap img {
    border-radius: 50%;
}

#hbptc-gallery .caption-style-hoverer {
    border-radius: 50%;
}


#hbptc-gallery .eael-filter-gallery-control li[data-filter="*"].control.active {
  background-color: #0D66B0;
}


/** Popup Maker Custom Style **/
.pum-content {
    outline: none;
}


/** Stakeholders **/
.stakeholders-content {
    display: none;
}
.stakeholders-icon img {
    cursor: pointer;
}

img.border-img {
    border: solid 5px #0065B3!important;
}

/** Ecological Assets **/
.ecological-icon img {
    cursor: pointer;
}

#disabled-link a {
  pointer-events: none;
  cursor: default;
}

svg#sustainability-approach-icon g {
    cursor: pointer;
}

#sustainability-journey-icon g {
    cursor: pointer;
}

#sustainability-journey-container {
    text-align: center;
}

#sustainability-journey-icon {
    width: 80%;
}

.gallery-item-buttons {
    margin-left: 20px;
}

.gallery-item-caption-wrap.caption-style-card .fg-item-title {
    display: none;
}


/* The Modal */

.hbptc-modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 999; /* Sit on top */
  padding-top: 20px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: hidden; 
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.8); /* Black w/ opacity */
}

/* Modal Content */


.hbptc-modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 5px;
  border: 1px solid #888;
}

.hbptc-modal-header {
  padding: 5px 15px;
}

/* The Close Button */
#hbptc-btn-close {
  color: #aaa;
  font-size: 28px;
  font-weight: bold;
  float: right;
  z-index: 9;
}

#hbptc-btn-close:hover,
#hbptc-btn-close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

.elementor-button#addPhotosBtn  {
    cursor: pointer;
}

#hbptc-modal-form .acf-form-submit {
    text-align: center;
}

/* Grid Format */
/*Formats the text inside the image*/
.hbptc-photo-grid > div {
  display: flex;
  justify-content: center;
  align-items: center;
}
.hbptc-photo-grid > div > figure > img {
  width: 100%;
  height: 250px;
  object-fit: cover;
  transition: all .5s ease-in-out;
  backface-visibility: hidden; 
  /* Remove Image flickering on hover */
  opacity: .35;
   -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
}
.hbptc-photo-grid {
  display: grid;
  grid-template-columns: auto auto auto auto;
  grid-gap: 10px;
}

.hbptc-photo-grid > div:hover {
  transform: scale(1.1);
  z-index: 999;
}
.hbptc-photo-grid > div:hover .description {
  display: block;
  text-align: center;
}

.hbptc-photo-grid > div:hover img {
  opacity: 1;
  z-index: 2;
  -webkit-filter: none; /* Safari 6.0 - 9.0 */
  filter:none;
}

.hbptc-photo-container {
    width: 100%;
    cursor: pointer;
}

.hbptc-photo-content-hover {
    z-index: 1;
    position: absolute;
    white-space: nowrap;
    display: none;
    padding: 15px;
    background: #fff;
    transition: 2.3s;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
}

.hbptc-photo-container:hover .hbptc-photo-content-hover {
    display: block;
}

.hbptc-photo-content-hover div {
    margin: 10px 10px;
}

.hbptc-photo-content-hover h5 {
    color: #0D66B0;
    font-weight: 700;
    font-size: 18px;
    margin: 0px;
    margin-bottom: 5px;
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}

.hbptc-photo-content-hover span {
    color: #0D66B0;
    font-size: 14px;
    margin: 5px 5px;
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}


/** Responsive **/

@media (max-width:2560px){
    .elementor-section.elementor-section-boxed > .elementor-container {
        max-width: 1480px;
    }
    
    .hbptc-page-header { 
        height: 600px;
    }
    .hbptc-page-title {
        margin: 6em 0;
    }
    .show_mobile {
        display: none;
    }
    
    .show_desktop {
        display: block;
    }
}

@media (max-width:1920px){
    .elementor-section.elementor-section-boxed > .elementor-container {
        max-width: 1280px;
    }
    .mp_list img {
        width: 110px;
    }
    
    .hbptc-page-header { 
        height: 600px;
    }
    .hbptc-page-title {
        margin: 6em 0;
    }
    
    #hbptc-annual-report-carousel .swiper-button-prev,
    #hbptc-sustainability-report-carousel .swiper-button-prev{
        left: 57%;
    }
    
    #hbptc-annual-report-carousel .swiper-button-next,
    #hbptc-sustainability-report-carousel .swiper-button-next{
        right: 10%;
    }
    .hbptc-photo-grid {
        grid-template-columns: auto auto auto auto auto;
    }
    .hbptc-modal-content {
      width: 35%;
    }
}

@media (max-width:1441px){
    .elementor-section.elementor-section-boxed > .elementor-container {
        max-width: 1180px;
    }
    .hbptc-photo-grid {
        grid-template-columns: auto auto auto auto auto;
    }
}

@media (max-width:1300px){
    .mp_list img {
        width: 120px;
    }
    .hbptc-photo-grid {
        grid-template-columns: auto auto auto auto;
    }
}

@media (max-width:1280px){
    .mp_list img {
        width: 100px;
    }
    .elementor-section.elementor-section-boxed > .elementor-container {
        max-width: 1180px;
    }
    .hbptc-page-header { 
        height: 400px;
    }
    .hbptc-page-title {
        margin: 4em 0;
    }
    .hbptc-modal-content {
      width: 35%;
    }
}


@media (max-width:1024px){
    .hbptc-page-header { 
        height: 200px;
    }
    
    .hbptc-page-title {
        margin: 2em 0;
    }
}

@media (max-width:768px){
	#hbptc-tab-style-2 .eael-tabs-nav {
		margin-top: -120px;
	}
	
	#hbptc-tab-style-2 .eael-advance-tabs .eael-tabs-nav>ul {
		align-items: normal;
	}

	#hbptc-tab-style-1 .eael-tabs-nav li.active {
        font-size: 20px!important;
        margin-top: -12px!important;
    }
	#hbptc-tab-style-1 .eael-tabs-nav {
		margin-top: -80px;
	}

    .hbptc-page-header { 
        height: 150px;
    }
    
    .hbptc-page-title {
        margin: 1em 0;
    }
    .hbptc-publication-report-carousel__img img {
        max-width: 80%;
    }
    
    #hbptc-annual-report-carousel .swiper-button-prev,
    #hbptc-sustainability-report-carousel .swiper-button-prev{
        left: 45%;
    }
    
    #hbptc-annual-report-carousel .swiper-button-next,
    #hbptc-sustainability-report-carousel .swiper-button-next {
        right: 3%;
    }
    .hbptc-modal-content {
      width: 60%;
    }
    
    .hbptc-photo-grid {
        grid-template-columns: auto auto;
    }
}



@media (max-width:480px){
	#hbptc-tab-style-1 .eael-tabs-nav {
		margin-top: -50px;
	}
	
	#hbptc-tab-style-1  .responsive-vertical-layout.eael-advance-tabs .eael-tabs-nav>ul li {
		-webkit-box-flex: 1;
		-ms-flex: 2 1 0;
		flex: 2 1 0;
	}

    .hbptc-page-header { 
        height: 100px;
    }
    
    .hbptc-page-title {
        margin: 1em 0;
    }
    
    .hbptc-column-mobile-100 {
        width: 100%!important;
    }
    #hbptc-sticky-menu a {
        margin-bottom: 5px;
        line-height: 14px;
        font-size: 14px;
    }
    #hbptc-tab-style-1 .eael-tabs-nav li.active {
        font-size: 7px!important;
        margin-top: -4px!important;
    }
    #hbptc-tab-style-2 .eael-tabs-nav li.active {
        font-size: 18px!important;
        margin-top: 0px!important;
    }
    
    .show_mobile {
        display: block;
    }
    
    .show_desktop {
        display: none;
    }
    
    .hbptc-column-10,
    .hbptc-column-15,
    .hbptc-column-20,
    .hbptc-column-30,
    .hbptc-column-40,
    .hbptc-column-50,
    .hbptc-column-60,
    .hbptc-column-70,
    .hbptc-column-80,
    .hbptc-column-90,
    .hbptc-column-100 {
        width: 100%;
    }
    
    #hbptc-annual-report-carousel .swiper-button-prev,
    #hbptc-sustainability-report-carousel .swiper-button-prev{
        left: -2%;
        margin-top: -20%;
    }
    
    #hbptc-annual-report-carousel .swiper-button-next,
    #hbptc-sustainability-report-carousel .swiper-button-next{
        margin-top: -20%;
    } 
    .hbptc-modal-content {
      width: 80%;
    }
}

@media (max-width:320px){
    #hbptc-annual-report-carousel .swiper-button-prev,
    #hbptc-sustainability-report-carousel .swiper-button-prev{
        left: -2%;
        margin-top: -80%;
    }
    
    #hbptc-annual-report-carousel .swiper-button-next,
    #hbptc-sustainability-report-carousel .swiper-button-next{
        margin-top: -80%;
    } 
}