@media all and (min-width:1660px){
.slide-right .img-responsive{max-width: inherit;  height: inherit;}
}

@media all and (max-width:1680px){
.wave-box1{ background-size:100% 100% !important; }
.wave-box2{ background-size: 120% 100% !important;}
.banner-caption{ max-width: 650px;}
.fullscreen{ max-height: 100%;}
.banner-outer-section{ max-height:100vh; height: 100vh;}
/* #banner-image video{height: 100%; width: auto;} */
}

@media all and (max-width:1680px) and (min-width:1600px){
  /* .fullscreen{ padding-top: 5vw !important;} */
  .banner-outer-section{ max-height:850px;}
}

@media all and (max-width:1440px){
.common-padding { padding: 90px 0;}
.banner-caption h1 {font-size: 75px;}

.fullscreen{ max-height: 100%;}
.banner-outer-section{ max-height:100vh; height: 100vh;}
/* #banner-image video{height: 100%; width: auto;} */

.water-related-risks-outer4{ padding-bottom: 10vw;}
#progress-made .swan-position { margin-top: -10vw;}
/* #banner-image video{height: 100%; width: auto;} */
}

@media all and (max-width:1280px){
.banner-outer-section{ max-height:680px;}
}

@media all and (max-width:1024px){
.banner-outer-section{ height: 100vh; max-height: 90vw;}
.fullscreen{ height:90vw }
.wave-box1, .wave-box2{ display: none;}
.number { font-size: 8rem;}
/* #banner-image video{height: 100%; width: auto;} */



#water-resilience{ padding: 60px 0;}
#water-usage, #progress-made{background-color: #fff; padding:60px 0;}
  .banner-caption h1{font-size: 6rem;}
    .banner-outer-section{ max-height: 100vh;}
  .fullscreen{height: 100%;}
  #banner-image video{ height: 100%;}

  .common-padding-top{ padding-top: 60px;}
  .common-padding { padding: 60px 0;}

  #progress-made .swan-position{ margin-top: 0;}


}

@media all and (max-width:990px){
.wave-box1, .wave-box2{background-size: 135vw 216vh !important; background-repeat: no-repeat;}
.water-related-risks-outer2 .row {
  flex-direction: column-reverse;
  display: flex;
}
.water-related-risks-list li{ width:100%;}
.Championing-collaborating-row{flex-direction: column-reverse; margin-bottom: 60px;}
.water-related-risks-outer2 .col-md-6{ margin-bottom: 60px;}
}

@media all and (max-width:1180px) and (min-width:660px){
#banner-image video{ width: auto; height: 100%;}
.banner-outer-section {
  max-height: 660px;
}
}

@media all and (max-width:820px){
  h2{font-size: 32px; line-height: 1.2; margin-bottom:20px;}
 
  
  #water-resilience{ padding:60px 0 !important; margin-bottom: 0 !important;}
  #water-resilience .row{ display: flex; flex-direction: column-reverse;}
  .swan-position { margin-top: 0;}
  

  .water-related-risks-list{margin-top: 45px;}
  .water-related-risks-list li:last-child, .water-type-list li:last-child{ margin-bottom:0px;}
  .water-related-risks-list li, .water-type-list li, .circle-list li{ margin-bottom:30px;}
  .water-related-risks-img1,.water-related-risks-img2{ filter: opacity(0.5);}

.infogrphic-list.common-padding{ padding:0;}
.infogrphic-data-outer .ps-4{ padding-left:15px !important; margin-top: 30px !important;}

#infogrphic-section1{ padding:30px 0 0;}
#infogrphic-section1 .row .col-md-6{ margin-bottom:60px;}
.number { font-size: 5rem;}
.number-infographics{width: 340px; align-items: center; max-width: 340px;}
.left-icon{ max-width:80px;}
.left-icon img{ width: 100%;}
.bubble-img{ max-width:255px; transform: translateY(-50%); right: 0;  left: inherit;}
.right-text{ min-width:230px; text-align: left;}

.water-related-risks-outer4 .row{ flex-direction:column-reverse;}
.infogrphic-section1 .row{ flex-direction:row-reverse;}
#progress-made .slide-left img{ display: none;}
}

@media all and (max-width:660px){
#banner-image video { height: 100%;width: auto;}
.banner-caption h1 { font-size: 56px;}
.banner-caption{ left: 0; right: 0;}

.water-related-risks-list figure figcaption{ height: auto;}
.water-related-risks-list figure figcaption p{ line-height: 24px !important;}
}