@font-face {
    font-family: 'Assistant';
    src: url('../fonts/Assistant-Bold.woff2') format('woff2'),
        url('../fonts/Assistant-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Assistant';
    src: url('../fonts/Assistant-SemiBold.woff2') format('woff2'),
        url('../fonts/Assistant-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Assistant';
    src: url('../fonts/Assistant-Medium.woff2') format('woff2'),
        url('../fonts/Assistant-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Assistant';
    src: url('../fonts/Assistant-Regular.woff2') format('woff2'),
        url('../fonts/Assistant-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Assistant';
    src: url('../fonts/Assistant-Light.woff2') format('woff2'),
        url('../fonts/Assistant-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

body{
    font-family: 'Assistant';
    font-size: 18px;
    font-weight: 400;
}
h1 {
    font-size: 90px;
    line-height: 118px;
}
h2 {
    font-size: 56px;
    line-height: 73px;
}
h3{
    font-size: 32px;
}
h4{
    font-size: 22px;
}
h5{
    font-size: 20px;
}
h1,h2,h3,h4,h5{
    font-weight: bold;
}
.wrapper {
    overflow: hidden;
}
.container-width{
    max-width: 1660px;
    margin: 0 auto;
}
/* header one */
.header-one {
    background-color: #0F2F5F;
    padding: 10px 0px;
}
.header-one .contact-icons{
    position: relative;
    padding-left: 30px;
    text-decoration: none;
}
.header-one .contact-icons .head-icons{
    font-size: 18px;
    color: white;
    width: 25px;
    position: absolute;
    left: 0;
}
.header-one .contact-icons h6 {
    font-size: 16px;
    color: white;
    font-weight: normal;
    margin-left: 0;
}
.header-one .contact-icons-margin {
    margin-left: 55px;
}
.header-one .header-one-social-icons a {
    margin: 0px 16px;
    transition: ease all .5s;
}
.header-one .header-one-social-icons a:hover {
    transform: scale(1.2);
}
.header-one .header-one-social-icons .head-social {
    color: white;
    font-size: 20px;
}
.header-one .header-one-social-icons .head-social:first-child{
    margin-left: 0px;
}
.header-one .header-one-social-icons .head-social:last-child{
    margin-right: 0px;
}
.header .header-one .header-one-area-content a{
    text-decoration: none;
}
/* header two */
.header-two{
    padding: 15px 0px;
}
/* header three */
.header-three{
    background-color: #0F3264;
}
.header-three .header-list .nav-item .nav-link {
    position: relative;
    z-index: 9;
    padding: 10px 25px;
    background-color: #0F3264;
    border-top: 2px solid #0F3264; 
    min-width: 140px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.header-list .nav-item .icon-holder {
    width: 200px;
    position: absolute;
    top: -20px;
    z-index: -1;
    left: 0;
    display: none;
}
.header-three .header-list .nav-link {
    font-weight: 600;
    color: white !important;
    font-size: 18px;
    /* padding: 0; */
}
.header-three .header-list .nav-item .nav-link:hover,.header-three .header-list .nav-item .nav-link.active{
    background-color: #1D5EBE;
    border-color: #FFD046;
}
.header-list .nav-item .nav-link.active .icon-holder,.header-list .nav-item .nav-link:hover .icon-holder {
    display: block;
}
.header-three .header-btn {
    border-radius: 23px;
    height: 45px;
    width: 128px;
    font-weight: 600;
    font-size: 18px;
}
.header-three .bg-yellow {
    background-color: #FFD046;
    border: 1px solid #FFD046;
}
.header-three .header-btn {
    position: relative;
    padding-left: 50px;
    transition: ease all 1s;
}
.header-three .header-btn:hover {
    padding-left: 10px;
    background: #123A75 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
    color: #fff;
}
.header-three .bg-blue{
    background-color: #1D5EBE;
    border: 1px solid #1D5EBE;
    margin-left: 9px;
    color: #fff;
}
.header-three .user-logo-img {
    margin-right: 12px;
    height: 32px;
    width: 32px;
    position: absolute;
    left: 5px;
    transition: ease all 1s;
}
.header-three .user-logo-img img{
    width: 100%;
    height: 100%;
}
.header-three .bg-yellow .user-logo-img img.hover{
    display: none;
}
.header-three .bg-yellow:hover .user-logo-img img{
    display: none;
}
.header-three .bg-yellow:hover .user-logo-img img.hover{
    display: block;
}
.header-three .header-btn:hover .user-logo-img {
    left: 90px;
}
/* main */
.main{
    background-image: url(../images/main-bg.png);
    background-repeat: no-repeat;
    height: auto;
    background-size: cover;
    display: flex;
    align-items: center;
    padding-bottom: 350px;
}
.main .main-content {
    padding: 76px 0px;
}
.main .main-content h4{
    color: white;
    font-weight: normal;
    font-size: 36px;
}
.main .main-content .yellow, .latest-news .latest-news-content-text .yellow{
    color: #FFD046;
}
.main .main-content h1 {
    color: white;
    font-weight: bold;
    font-size: 40px;
    line-height: 52px;
    margin-bottom: 15px;
}
.main .main-content p{
    color: white;
    font-weight: normal;
    font-size: 22px;
    line-height: 30px;
    margin-bottom: 30px;
}
.main .main-content .btn-transparent {
    border-radius: 30px;
    background-color: transparent;
    border: 1px solid white;
    color: white;
    height: 55px;
    width: 200px;
    font-weight: 600;
    font-size: 18px;
}
.main .main-content-input-wrapper, .table-section .table-section-area-form-content .main-content-input-wrapper{
    position: relative;
    width: 92%;
    border-radius: 30px;
    height: 60px;
    margin-bottom: 40px;
}
.main .main-content-input-wrapper .search-icon, .table-section .table-section-area-form-content .main-content-input-wrapper .search-icon {
    position: absolute;
    left: 0;
    font-size: 25px;
    width: 60px;
}
.main .main-content-input-wrapper input, .table-section .table-section-area-form-content .main-content-input-wrapper input {
    width: 100%;
    height: 100%;
    padding-left: 55px;
    border-radius: 30px;
    border: 1px solid #EAEAEA;
}
.main .main-content-input-wrapper input:focus, .table-section .table-section-area-form-content .main-content-input-wrapper input:focus {
    border: 1px solid #EAEAEA;
    box-shadow: unset;
}
.main .main-content-input-wrapper .btn-blue, .table-section .table-section-area-form-content .main-content-input-wrapper .btn-blue {
    position: absolute;
    right: 10px;
    border-radius: 30px;
    background-color: #0F2F5F;
    color: white;
    font-size: 18px;
    font-weight: 600;
    border: 1px solid;
    height: 77%;
    width: 120px;
}
.main .builder-content h4{
    font-size: 20px;
    line-height: 26px;
    font-weight: bold;
    color: #FFD046;
}
.main .row-padding{
    padding-left: 80px;
}
.main .builder-col-head {
    width: 195px;
}
.main .builder-col-info {
    width: calc(100% - 195px);
}
.main .builder-content.content-border{
    position: relative;
    padding-top: 25px;
}
.main .builder-content.content-border::before {
    content: '';
    position: absolute;
    background: transparent linear-gradient(180deg, #FFFFFF00 0%, #FFFFFF 48%, #FFFFFF00 100%);
    height: 90px;
    width: 3px;
    top: 0;
    right: 0;
}
.main .builder-content p{
    font-size: 18px;
    line-height: 30px;
    color: white;
    font-weight: normal;
    margin-bottom: 20px;
}
.main .builder-content a{
    font-size: 20px;
    line-height: 26px;
    color: #FFD046;
    font-weight: bold;
    text-decoration: none;
}
.main .builder-content a:hover{
    border-bottom: 1px solid white;
    color: white;
}
.content-padding{
    padding-left: 45px;
}
/* global coverage */
.global-coverage {
    margin-top: -350px;
}

.global-coverage .global-coverage-images img {
    height: 100%;
    width: 100%;
}
/* key values */
.section-padding{
    padding: 90px 0px;
}
.key-values{
    background-image: url('../images/key-values-bg.svg');
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: 100%;
}
.key-values .key-values-info-area {
    width: 1208px;
    margin: 0 auto 85px;
}
.key-values .key-values-info-area h4, .latest-news-info-area h4{
    color: #575757;
    font-size: 20px;
    font-weight: normal;
    letter-spacing: 6.92px;
}
.key-values .key-values-info-area h2, .latest-news-info-area h2 ,.how-it-work .how-it-work-content h2{
    color: #000000;
    font-size: 56px;
    font-weight: bold;
    margin-bottom: 22px;
    line-height: 65px;
}
.key-values .images-border-wrapper {
    position: relative;
    width: 630px;
    margin: 0 auto 45px;
}
.key-values .images-border-wrapper::after{
    content: '';
    position: absolute;
    border-top: 1px solid;
    width: 260px;
    color: #0000004f;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.key-values .images-border-wrapper::before {
    content: '';
    position: absolute;
    border-top: 1px solid;
    width: 260px;
    color: #0000004f;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
.key-values .key-values-info-area p{
    color: #000000B8;
    font-size: 22px;
    font-weight: normal;
}
.key-values .key-values-area h3, .key-values .key-values-graph-area h3 {
    color: #000000;
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 25px;
}
.key-values .key-values-area-content {
    border: 1px solid #C1C1C1;
    border-radius: 5px;
    background-color: white;
    padding: 20px;
}
.key-values .key-values-area-content ul{
    height: 325px;
    overflow-y: scroll;
    padding-right:  15px !important;
}
.key-values .key-values-area-content .ul-height {
    height: 255px;
}
.key-values .key-values-area-content ul li {
    list-style: none;
    padding: 12px 0px;
    border-bottom: 1px dashed #C1C1C1;
}
.key-values .key-values-area-content ul li:last-child {
    border-bottom: none;
}
.key-values .key-values-area-content ul li h5{
    font-size: 18px;
    font-weight: normal;
    color: black;
    margin: 0px;
}
.key-values .key-values-area-content ul li h6{
    font-size: 18px;
    font-weight: 600;
    color: black;
    margin: 0px;
}
/* key values => scroll bar */
/* width */
.key-values .key-values-area-content ul::-webkit-scrollbar {
    width: 4px;
    border-radius: 10px;
    height: 4px;
  }
  
  /* Track */
  .key-values .key-values-area-content ul::-webkit-scrollbar-track {
    background: #B9B9B9; 
  }
   
  /* Handle */
  .key-values .key-values-area-content ul::-webkit-scrollbar-thumb {
    background: #123A75; 
  }
  
  /* Handle on hover */
  .key-values .key-values-area-content ul::-webkit-scrollbar-thumb:hover {
    background: #123A75; 
  }
  /* graph */
  .key-values .key-values-graph-area{
    background: transparent radial-gradient(closest-side at 50% 50%, #0D4666 0%, #000D39 100%);
    border-radius: 5px;
    margin-top: 63px;
    padding: 40px;
    height: 100%;
  }
  .key-values .key-values-graph {
    margin-bottom: 38px;
}
  .key-values .key-values-graph-area  h3{
    color: white;
  }
  .key-values .key-values-graph-area ul li{
    list-style: none;
    font-size: 18px;
    color: white;
    font-weight: bold;
    line-height: 38px;
    position: relative;
    padding-left: 24px;
  }
  .key-values .key-values-graph-area ul li::before {
    position: absolute;
    content: '';
    border-left: 4px solid;
    color: #8EC536;
    height: 18px;
    border-radius: 10px;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
.key-values .key-values-graph-area ul .orange-border::before {
    color: #FFD046;
}
.key-values .key-values-graph-area ul .blue-border::before {
    color: #93D3D4;
}
.key-values .key-values-graph-area ul .red-border::before {
    color: #F1625C;
}
/* country graph */
.country-graph-wrapper-info{
    width: 35%;
}
.flag-information-wrapper {
    padding-top: 30px;
}
.country-graph-wrapper {
    margin-bottom: 22px;
}
.country-graph-wrapper .country-graph-wrapper-info p{
    font-size: 16px;
    color: white;
    font-weight: normal;
    line-height: 21px;
    text-align: right;
}
.country-flag-img {
    padding-right: 20px;
}
.progress-wrapper{
    height: 29px;
    width: 65%;
}
.progress-wrapper-bg {
    background-color: #FFD046;
    border-radius: 23px;
    height: 100%;
    padding-right: 20px;
}
.country-graph-wrapper .progress-wrapper-bg p{
    color: black;
    font-weight: bold;
}
/* target market */
.target-market{
    background-color: #f5f5f6;
}
.target-market .target-market-content h3, .how-it-work .how-it-work-content h3{
    font-size: 32px;
    line-height: 42px;
    font-weight: bold;
    color: black;
    margin-bottom: 30px;
}
.target-market .target-market-content p, .how-it-work .how-it-work-content p{
    font-size: 24px;
    line-height: 32px;
    color: #000000B8;
    font-weight: normal;
    margin-bottom: 60px;
}
.target-market .target-btn, .how-it-work .how-it-work-btn{
    position: relative;
    padding-left: 50px;
    transition: ease all 1s;
    border-radius: 23px;
    height: 45px;
    width: 170px;
    font-weight: 600;
    font-size: 18px;
}
.target-market .bg-blue, .how-it-work .bg-blue {
    background-color: #1D5EBE;
    border: 1px solid #1D5EBE;
    color: white;
}
.target-market .user-logo-img, .how-it-work .user-logo-img{
    margin-right: 12px;
    height: 32px;
    width: 32px;
    position: absolute;
    left: 5px;
    transition: ease all 1s;
}
.target-market .target-btn:hover, .how-it-work .how-it-work-btn:hover {
    padding-left: 10px;
    background: #123A75 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
    color: #fff;
}
.target-market .target-btn:hover .user-logo-img, .how-it-work .how-it-work-btn:hover .user-logo-img {                                                
    left: 77%;
}
.target-market ul li{
    color: #000000B8;
    font-size: 18px;
    line-height: 31px;
    font-weight: normal;
    list-style: none;
}
.target-market .tick-image, .how-it-work .tick-image {
    margin-right: 10px;
    width: 25px;
}
.li-wrapper{
    width: calc(100% - 25px);
}
/* latest news */
.latest-news{
    background-color: #f5f5f6;
    position: relative;
}
.latest-news .latest-news-info-area h4, .latest-news .latest-news-info-area h2{
    color: black;
}
.latest-news .latest-news-content{
    cursor: pointer;
}
.latest-news .latest-news-content-img{
    margin-bottom: 30px;
    overflow: hidden;
}
.latest-news .latest-news-content-img img{
    transition: ease all .5s;
}
.latest-news .latest-news-content:hover .latest-news-content-img img {
    transform: scale(1.2);
}
.latest-news .latest-news-content-text {
    padding-right: 100px;
    position: relative;
    padding-left: 25px;
}
.latest-news .latest-news-content-text::before {
    position: absolute;
    content: '';
    border-left: 3px solid #5567a3a8;
    border-radius: 10px;
    left: 0;
    top: 50%;
    transform: translatey(-50%);
    height: 100%;
    transition: ease all .5s;
}
.latest-news .latest-news-content:hover .latest-news-content-text::before {
   border-left: 3px solid #5567A3;
}
.latest-news .latest-news-content-text h4{
    font-size: 22px;
    font-weight: bold;
    color: black;
    margin-bottom: 15px;
    line-height: 30px;
}
.latest-news .latest-news-content-text h6{
    font-size: 16px;
    font-weight: normal;
    color: #000d39;
}
.latest-news .load-more-wrapper{
    text-decoration: none;
    position: absolute;
    width: 100%;
    height: 600px;
    background: transparent linear-gradient(180deg, #000d3905 0%, white 100%) 0% 0% no-repeat padding-box;
    bottom: 0;
    z-index: 9;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 50px;
    flex-direction: column;
    left: 0;
}
.latest-news .load-more-wrapper span{
    color: #0f2f5f;
    font-size: 14px;
    font-weight: normal;
    display: block;
}
/* how it work */
.how-it-work .how-it-work-content h3{
    padding-right: 100px;
}
.how-it-work .how-it-work-content p{
    margin-bottom: 25px;
}
.how-it-work .how-it-work-content strong {
    font-size: 18px;
    line-height: 26px;
    font-weight: bold;
    display: block;
    color: black;
    margin-bottom: 20px;
}

/* table-setion */
.table-section{
    background-color: #F7F7FA;
    padding-bottom: 150px;
}
.table-section .table-section-area-form-content{
    margin-bottom: 30px;
}
.table-section .table-section-area {
    background-color: white;
    border-radius: 20px;
    padding: 40px;
    margin-bottom: 40px;
}
.table-section .table-section-area-form-content .main-content-input-wrapper{
    width: 58%;
}
.table-section .table-section-area-form-content .main-content-input-wrapper input {
    background-color: #EAEAEA;
    border: 1px solid #EAEAEA;
}
.table-section .table-section-area-form-content h5{
    font-size: 18px;
    font-weight: normal;
    color: #000000;
}
.table-section .bold{
    font-weight: bold;
}
.table-section table {
    border-collapse: separate;
    border-spacing: 0px 10px;
}
.table-section table tr th{
    color: #171C3866;
    white-space: nowrap;
}
.table-section .table>:not(caption)>*>* {
    padding: 15px;
}
.table-section tbody, td, tfoot, th, thead, tr{
    border-style: unset;
}
.table-section table tr td {
    border-top: 1px solid #ECECEC;
    border-bottom: 1px solid #ECECEC;
    white-space: nowrap;
}
.table-section table tr td:first-child {
    border-left: 1px solid #ECECEC;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.table-section table tr td:last-child {
    border-right: 1px solid #ECECEC;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}
/* subscription */
.subscription {
    padding: 60px 0px;
}
.subscription .subscription-area{
    background-color: #0F2F5F;
    border-radius: 11px;
    padding: 40px;
    position: relative;
    padding-left: 180px;
    /* top: -80px; */
}
.subscription .subscription-area .subscription-area-img {
    position: absolute;
    left: 20px;
    width: 150px;
    top: 0;
}
.subscription .subscription-area-img .icon-holder.search-icon {
    width: 100%;
}
.subscription .subscription-area-content h4{
    color: white;
}
.subscription .subscription-area-content p{
    color: white;
    font-size: 16px;
    line-height: 22px;
    font-weight: normal;
}
.subscription .subscription-form input {
    border-radius: 30px;
    margin: 0px 9px;
    height: 60px;
    width: 400px;
    padding-left: 30px;
}
.subscription .subscription-form input::placeholder{
    font-size: 16px;
    font-weight: normal;
    color: black;
}
.subscription .subscription-form input:focus{
    box-shadow: unset;
    border: 1px solid white;
}
.subscription .subscription-btn {
    font-weight: 600;
    font-size: 18px;
    color: white;
    background-color: #0F2F5F;
    border-radius: 30px;
    border: 7px solid white;
    height: 60px;
    width: 140px;
}

  /* ========= zzzz */


  .banner .banner-content {
    position: relative;
  }
  .banner .banner-heading {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .banner-heading h1 {
    color: #fff;
  }
  .sea-waves-bg {
    padding-top: 75px;
    padding-bottom: 30px;
  }
  .sea-waves-content {
    padding-top: 0px;
  }
  .sea-waves-content h2 {
    margin-bottom: 42px;
  }
  .sea-waves-content p {
    font-size: 22px;
    line-height: 28px;
    color: #000000B8;
  }
  .sea-waves-content p:nth-child(2) {
    margin-bottom: 42px;
  }
  .sea-waves-img-info {
    position: relative;
  }
  .sea-waves-img-info p {
    font-size: 22px;
    line-height: 36px;
  }
  .sea-waves-info {
    max-width: 623px;
    width: 100%;
    background-color: #ffffff;
    box-shadow: 0px 3px 50px #00000014;
    padding: 50px;
    position: absolute;
    bottom: -130px;
    right: 0;
    left: 0;
    margin: 0 auto;
  }
  .footer {
    background-color: #F7F7FA;
    padding-top: 68px;
    position: relative;
    z-index: 9;
  }
  .footer::before {
    content: '';
    background-image: url(../images/footer-bg.png);
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-repeat: no-repeat;
    background-position: top left;
    top: 0;
  }
  .footer .footer-logo {
    margin-bottom: 42px;
  }
  .footer p {
    font-size: 18px;
    line-height: 30px;
    color: #000000;
    margin-bottom: 42px;
  }
  .footer .read-more {
    color: #123A75;
    font-size: 16px;
    font-weight: bold;
    text-decoration: none;
  }
  .footer-link p {
    font-size: 20px;
    line-height: 26px;
    color: #090000;
    margin-bottom: 20px;
    font-weight: bold;
  }
  .footer-link-ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
  }
  .footer-link-ul a {
    text-decoration: none;
    font-size: 18px;
    color: #090000;
    line-height: 40px;
  }
  .footer-link-ul a:hover {
    color: #123A75;
  }
  .footer-link:nth-child(1) {
    margin-bottom: 30px;
  }
  .footer-links-container {
    padding-top: 60px;
  }
  .footer-link-ul .fa {
    color: #123A75;
    width: 18px ;
  }
  .social-links ul{
      padding: 0;
  }
  .social-links li {
    width: 30px;
    height: 30px;
    background-color: #fff;
    border-radius: 50%;
    margin-right: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
  }
  .social-links li a:hover{
      transform: scale(1.2);
  }
.social-links li .fa-facebook {
    color: #2E5EB5;
}

.social-links li .fa-google-plus {
    color: #CC0000;
}

.social-links li .fa-twitter {
    color: #1DB0BD;
}

.social-links li .fa-linkedin {
    color: #2B5094;
}

.vessels-port {
    padding-top: 180px;
}
  .vessels-port h3 {
    margin-bottom: 35px;
  }

  .accordion-container {
    border: 1px solid #C1C1C1;
    padding: 14px 24px;
    border-radius: 5.5px;
    height: calc(100% - 70px);
  }
  .copyright {
    background-color: #0F2F5F;
    margin-top: 50px;
  }
  .copyright p {
    color: #fff;
    font-size: 16px;
    padding: 15px 0;
  }
  .copyright ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
  }
  .copyright ul a {
    text-decoration: none;
    color: #FFD046;
  }
  .copyright ul li {
    margin-right: 7px;
  }

  .vessels-port .accordion-header {
    line-height: 0;
  }
  .vessels-port .accordion-header .accordion-button.collapsed {
    border: 1px solid #ECECEC;
    font-size: 18px;
  }
  .vessels-port .accordion-header .accordion-button {
    border: 1px solid #ECECEC;
    border-bottom: 0;
  }
  .vessels-port .accordion-item .accordion-collapse.show .accordion-body {
    border-top: 0;
  }
  .vessels-port .accordion-item {
    margin-bottom: 10px;
    border: 0;
  }
  .vessels-port .accordion-table p {
    margin-bottom: 0;
    padding: 0;
    font-size: 18px;
  }
  .vessels-port .accordion-item .accordion-body {
    border: 1px solid #ECECEC;
  }
  
  .vessels-port .accordion-table .row1 p:nth-child(1) {
    width: 50%;
  }
  .vessels-port .accordion-table .row1 p:nth-child(2) {
    font-weight: bold;
    width: 50%;
  }
  .vessels-port .accordion-button:not(.collapsed) {
    background-color: transparent;
    box-shadow: none;
    color: #000000;
    font-size: 18px;
    font-weight: bold;
  }
  .vessels-port .accordion-button:focus{
    box-shadow: none;
  }
  .vessels-port .ports-container {
    padding: 24px 19px;
    border-radius: 5px;
    border: 1px solid #C1C1C1;
    margin-bottom: 55px;
  }
  .ports-container .port {
    background-color: #F7F7FA;
    padding: 15px 10px 15px 6px;
    margin-bottom: 10px;
    border: 1px solid #F7F7FA;
  }
  .ports-container .port:hover {
    background-color: transparent;
    cursor: pointer;
  }
  .ports-container .port .flag-name p {
    font-size: 18px;
    color: #000000;
    white-space: nowrap;
  }
  .ports-container .port .date p {
    font-size: 18px;
    color: #000000;
    font-weight: 600;
  }
  .vessels-port .marginb {
    margin-bottom: 80px;
  }
  .bg-content-desp {
    height: 100%;
    background-color: #0F2F5F;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .bg-content-desp p {
    color: #ffffff;
    font-size: 22px;
    line-height: 37px;
    text-align: center;
    padding: 10px 110px;
  }
  .bg-content-desp p span {
    font-size: 32px;
  }
  /* updated css */
  .content-table-bg {
    border: 1px solid #C1C1C1;
    border-radius: 10px;
    padding: 30px !important;
}
.build-table-bg{
    background-color: #F7F7FA;
}
.build-table .build-table-bg .row1 {
    background-color: white;
    padding: 12px;
    margin-bottom: 12px;
}
.build-table h5{
    font-size: 22px;
    font-weight: bold;
    line-height: 28px;
    margin-bottom: 20px;
}
.build-table p{
    width: unset !important;
    font-weight: bold !important;
}
.sea-small-images img{
    width: 100%;
}
.ports-container {
    border: 1px solid #C1C1C1;
    padding: 30px;
    border-radius: 10px;
}
.vesseles-last-info-content p{
    font-size: 22px;
    font-weight: normal;
    line-height: 28px;
}
.google-map-wrapper{
    padding-top: 30px;
}
 /* === vessels-listing ========= */
 .vessels-database {
    background-color: #F7F7FA;
    padding: 75px 0 50px 0;
 }
 .vessels-database h2 {
    margin-bottom: 50px;
    color: #000000;
 }
 .vessels-database .input-fields input {
    padding: 18px 22px;
    color: #B7B3B3;
    font-size: 18px;
    line-height: 23px;
    border: 1px solid #B7B3B3;
    border-radius: 7px;
 }
 .vessels-database .input-fields input:focus, .vessels-database .input-fields .dropdown button {
    box-shadow: unset;
 }
 .vessels-database .input-fields .dropdown button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 22px;
    border: 1px solid #B7B3B3;
    background-color: #EAEAEA8F;
    color: #B7B3B3;
 }
 .vessels-database .input-fields .all-flags button {
    background-color: transparent;
 }
 .vessels-database .input-fields {
    margin-bottom: 70px;
 }

 .r-slider1 .range-slider {
    position: relative;
    width: 100%;
    height: 42px;
    text-align: center;
}

.r-slider1 .range-slider input {
    pointer-events: none;
    position: absolute;
    overflow: hidden;
    left: 0;
    top: -4px;
    width: 100%;
    outline: none;
    height: 50px;
    margin: 0;
    padding: 0;
}

.r-slider1 .range-slider input::-webkit-slider-thumb {
    pointer-events: all;
    position: relative;
    z-index: 1;
    outline: 0;
}

.r-slider1 .range-slider input::-moz-range-thumb {
    pointer-events: all;
    position: relative;
    z-index: 10;
    -moz-appearance: none;
    width: 9px;
}

.r-slider1 .range-slider input::-moz-range-track {
    position: relative;
    z-index: -1;
    background-color: rgba(0, 0, 0, 1);
    border: 0;
}

.r-slider1 .range-slider input:last-of-type::-moz-range-track {
    -moz-appearance: none;
    background: none transparent;
    border: 0;
}

.r-slider1 .range-slider input[type=range]::-moz-focus-outer {
  border: 0;
}

.r-slider1 .rangeValue {
  width: 30px;
}

.r-slider1 .output {
  position: absolute;
  border:1px solid #999;
  width: 40px;
  height: 30px;
  text-align: center;
  color: #999;
  border-radius: 4px;
  display: inline-block;
  font: bold 15px/30px Helvetica, Arial;
  bottom: 75%;
  left: 50%;
  transform: translate(-50%, 0);
}

.r-slider1 .output.outputTwo {
  left: 100%;
}

.r-slider1 input[type=range] {
  -webkit-appearance: none;
  background: none;
}

.r-slider1 input[type=range]::-webkit-slider-runnable-track {
  height: 5px;
  border: none;
  border-radius: 3px;
  background: transparent;
}

.r-slider1 input[type=range]::-ms-track {
  height: 5px;
  background: transparent;
  border: none;
  border-radius: 3px;
}

.r-slider1 input[type=range]::-moz-range-track {
  height: 5px;
  background: transparent;
  border: none;
  border-radius: 3px;
}

.r-slider1 input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  border: none;
  height: 32px;
  width: 32px;
  border-radius: 50%;
  background: #fff;
  margin-top: -5px;
  position: relative;
  z-index: 10000;
}

.r-slider1 input[type=range]::-ms-thumb {
  -webkit-appearance: none;
  border: none;
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background: #555;
  margin-top: -5px;
  position: relative;
  z-index: 10000;
}

.r-slider1 input[type=range]::-moz-range-thumb {
  -webkit-appearance: none;
  border: none;
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background: #555;
  margin-top: -5px;
  position: relative;
  z-index: 10000;
}

.r-slider1 input[type=range]:focus {
  outline: none;
}

.r-slider1 .full-range,
.r-slider1 .incl-range {
  width: 100%;
  height: 18px;
  left: 0;
  top: 21px;
  position: absolute;
  background: #DDD;
  border-radius: 10px;
}

.r-slider1 .incl-range {
  background: #F5B659;
}
.r-slider1 h4 {
    font-weight: 400;
}
.r-slider1 h4 span {
    color: #F5B659;
}
.r-slider2 h4 span {
    color: #1D5EBE;
}
.r-slider2 .incl-range {
    background: #239FDA;
}










.vessels-listing .key-values {
    background-image: none;
}
.vessels-listing .key-values .key-values-graph-area {
    margin-top: 0;
}
.vessels-listing .key-values h2 {
    margin-bottom: 60px;
}
.result-stats-table .table {
    border: 1px solid #EEEEEE;
}
.result-stats-table thead {
    background-color: #EEEEEE;
}
.result-stats-table thead tr th {
    padding: 25px 8px 25px 20px;
}
.vessels-listing .key-values .row.graphs {
    margin-bottom: 70px;
}
.result-stats-table tbody .flag-content p:nth-child(1) {
    font-weight: bold;
}
.result-stats-table tbody .flag-content p:nth-child(2) {
    font-weight: 400;
}
/* .result-stats-table tbody tr:not(:last-child) {
    margin-bottom: 10px;
} */
.result-stats-table tbody tr {
    background-color: #F7F7FA;
}
.result-stats-table tbody tr td {
    padding: 15px 8px 15px 20px;
    vertical-align: middle;
}
.table-pagination p:nth-child(1) {
    font-weight: 400;
    margin-right: 50px;
}
.table-pagination p:nth-child(2) {
    font-weight: 700;
}
.result-stats-table {
    margin-bottom: 20px;
}
.result-stats-table tbody .flag-img {
    width: 65px;
}


/* ================ media quriesssss ================= */

@media (max-width: 1699px) {
    .container-width {
        max-width: 1460px;
    }
    .header-one .header-one-social-icons a {
        margin: 0px 12px;
    }
    .header-one .contact-icons-margin {
        margin-left: 40px;
    }
    .header-three .header-list .nav-item .nav-link {
        padding: 10px 20px;
        min-width: 130px;
        height: 60px;
    }
    .header-three .header-list .nav-link {
        font-size: 16px;
    }
    .header-list .nav-item .icon-holder{
        width: 170px;
    }
    .header-three .header-btn {
        border-radius: 20px;
        height: 42px;
        width: 115px;
        font-size: 16px;
    }
    .header-three .header-btn:hover .user-logo-img {
        left: 75px;
    }
    .header-two-images.d-flex.justify-content-end {
        width: 600px;
        margin-left: auto;
    }
    h1 {
        font-size: 80px;
        line-height: 108px;
    }
    h2 {
        font-size: 50px;
        line-height: 60px;
    }
    h3 {
        font-size: 30px;
    }
    .sea-waves-content h2 {
        margin-bottom: 32px;
    }
    .sea-waves-content p {
        font-size: 20px;
    }
    .sea-waves-content p:nth-child(2) {
        margin-bottom: 32px;
    }
    .sea-waves-info {
        max-width: 550px;
        padding: 30px;
    }
    .sea-waves-img-info p {
        font-size: 20px;
        line-height: 32px;
    }
    .vessels-port h3 {
        margin-bottom: 25px;
    }
    .bg-content-desp p {
        font-size: 20px;
        line-height: 32px;
        padding: 10px 80px;
    }
    .bg-content-desp p span {
        font-size: 28px;
    }
    /* main */
    .main .main-content h1 {
        font-size: 38px;
        line-height: 48px;
        margin-bottom: 18px;
    }
    .main .main-content p {
        font-size: 21px;
        line-height: 30px;
        margin-bottom: 27px;
    }
    .main .builder-content p {
        font-size: 18px;
        line-height: 28px;
        margin-bottom: 20px;
    }
    .main .builder-content.content-border::before {
        height: 80px;
        width: 2px;
    }
    /* key values */
    .country-flag-img {
        padding-right: 20px;
        margin-left: 15px;
        width: 46px;
    }
    /* target market */
    .target-market .target-market-content p, .how-it-work .how-it-work-content p {
        font-size: 22px;
        line-height: 30px;
        margin-bottom: 55px;
    }
    /* how it work */
    .how-it-work .how-it-work-content p {
        margin-bottom: 22px !important;
    }
}
@media (max-width: 1499px) {
    .container-width {
        max-width: 1320px;
    }
    /* main */
    .main {
        padding-bottom: 280px;
    }
    .main .main-content h4 {
        font-size: 32px;
    }
    .main .main-content h1 {
        font-size: 35px;
        line-height: 44px;
        margin-bottom: 15px;
    }
    .main .main-content p {
        font-size: 20px;
        line-height: 28px;
        margin-bottom: 25px;
    }
    .main .main-content .btn-transparent {
        height: 53px;
        width: 190px;
        font-size: 18px;
    }
    /* global-coverage */
    .global-coverage {
        margin-top: -280px;
    }
    /* key values */
    .section-padding {
        padding: 70px 0px;
    }
    .key-values .key-values-info-area {
        width: 1188px;
        margin: 0 auto 60px;
    }
    .key-values .key-values-info-area h4, .latest-news-info-area h4 {
        font-size: 20px;
        letter-spacing: 4.92px;
    }
    .key-values .key-values-info-area h2, .latest-news-info-area h2 ,.how-it-work .how-it-work-content h2{
        font-size: 48px;
        margin-bottom: 18px;
        line-height: 54px;
    }
    .key-values .images-border-wrapper {
        width: 590px;
        margin: 0 auto 35px;
    }
    .key-values .key-values-info-area p {
        font-size: 21px;
    }
    .key-values .images-border-wrapper::before, .key-values .images-border-wrapper::after {
        width: 242px;
    }
    .key-values .key-values-area h3, .key-values .key-values-graph-area  h3 {
        font-size: 25px;
        margin-bottom: 22px;
    }
    .key-values .key-values-area-content .ul-height {
        height: 269px;
    }
    .country-flag-img {
        padding-right: 20px;
        margin-left: 10px;
        width: 40px;
    }
    .key-values .key-values-graph-area {
        padding: 25px;
    }
    /* target market */
    .target-market .target-market-content p, .how-it-work .how-it-work-content p {
        font-size: 21px;
        line-height: 29px;
        margin-bottom: 50px;
    }
    /* latest news */
    .latest-news .latest-news-content-text h4 {
        font-size: 21px;
    }
    /* subscription */
    .subscription .subscription-form input {
        width: 280px;
    }
}
@media (max-width: 1399.98px) {
    /* zoh */
    .sea-waves-bg {
        padding-top: 40px;
    }
    .sea-waves-content {
        /* padding-top: 30px; */
    }
    h1 {
        font-size: 70px;
        line-height: 90px;
    }
    h2 {
        font-size: 45px;
        line-height: 60px;
    }
    h3 {
        font-size: 28px;
    }
    .sea-waves-bg{
        padding-top: 50px;
    }
    .sea-waves-content h2 {
        margin-bottom: 22px;
    }
    .sea-waves-content p:nth-child(2) {
        margin-bottom: 22px;
    }
    .sea-waves-content p {
        font-size: 18px;
    }
    .sea-waves-info {
        max-width: 520px;
        padding: 20px;
    }
    .sea-waves-img-info p {
        font-size: 18px;
        line-height: 30px;
    }
    .vessels-port h3 {
        margin-bottom: 20px;
    }
    .ports-container .port .flag-name p,.ports-container .port .date p {
        font-size: 16px;
    }
    .vessels-port .accordion-header .accordion-button.collapsed{
        font-size: 16px;
    }
    .bg-content-desp p {
        font-size: 18px;
        line-height: 30px;
    }
    .bg-content-desp p span {
        font-size: 24px;
    }
    .footer-link p {
        font-size: 18px;
    }
    .footer-link-ul a {
        font-size: 16px;
        line-height: 32px;
    }
    .footer .footer-logo {
        margin-bottom: 32px;
    }
    .footer p {
        font-size: 16px;
        line-height: 28px;
        margin-bottom: 32px;
    }
    .footer .read-more{
        font-size: 15px;
    }
    .copyright p {
        font-size: 15px;
        padding: 12px 0;
    }
    /* ===== vessles listing ======= */
    .vessels-database {
        padding: 40px 0 40px 0;
    }
    .vessels-database .input-fields input, .vessels-database .input-fields .dropdown button {
        padding: 16px 18px;
    }
    .vessels-listing .key-values h2 {
        margin-bottom: 45px;
    }
}

@media (max-width: 1366px) {
    .container-width {
        max-width: 1180px;
    }
    .header-one .contact-icons {
        padding-left: 25px;
    }
    .header-one .contact-icons .head-icons {
        width: 20px;
    }
    .header-one .contact-icons h6 {
        font-size: 14px;
    }
    .header-one .contact-icons-margin {
        margin-left: 20px;
    }
    .header-one .header-one-social-icons a {
        margin: 0px 8px;
    }
    .header-one .header-one-social-icons .head-social {
        color: white;
        font-size: 16px;
    }
    .header-two-images {
        width: 220px;
    }
    .header-two-images.d-flex.justify-content-end {
        width: 500px;
    }
    .header-three .header-list .nav-item .nav-link {
        min-width: 120px;
        height: 55px;
    }
    .header-three .header-list .nav-link {
        font-size: 14px;
    }
    .header-list .nav-item .icon-holder {
        width: 160px;
    }
    .header-three .header-btn {
        border-radius: 20px;
        height: 40px;
        width: 105px;
        font-size: 15px;
        padding-left: 45px;
    }
    .header-three .header-btn:hover .user-logo-img {
        left: 65px;
    }
    /* zoh */
    .sea-waves-bg {
        padding-top: 40px;
    }
    .sea-waves-content {
        /* padding-top: 30px; */
    }
    h1 {
        font-size: 60px;
        line-height: 80px;
    }
    h2 {
        font-size: 40px;
        line-height: 50px;
    }
    h3 {
        font-size: 24px;
    }
    .sea-waves-content h2 {
        margin-bottom: 15px;
    }
    .bg-content-desp p {
        padding: 10px 60px;
    }
    .sea-waves-info {
        padding: 30px;
        bottom: -160px;
    }
    .vessels-port h3 {
        margin-bottom: 15px;
    }

    /* end z */
    /* main */
    .main {
        padding-bottom: 240px;
    }
    .main .main-content h4 {
        font-size: 30px;
    }
    .main .main-content h1 {
        font-size: 34px;
        line-height: 40px;
    }
    .main .main-content p {
        font-size: 19px;
        line-height: 26px;
    }
    .main .builder-content p {
        font-size: 18px;
        line-height: 28px;
        margin-bottom: 15px;
    }
    /* global coverage */
    .global-coverage {
        margin-top: -240px;
    }
    /* key values */
    .section-padding {
        padding: 60px 0px;
    }
    .key-values .key-values-info-area {
        width: 1078px;
        margin: 0 auto 40px;
    }
    .key-values .key-values-info-area h2, .latest-news-info-area h2,.how-it-work .how-it-work-content h2  {
        font-size: 43px;
        margin-bottom: 10px;
        line-height: 48px;
    }
    .key-values .images-border-wrapper {
        width: 540px;
        margin: 0 auto 27px;
    }
    .key-values .images-border-wrapper::before, .key-values .images-border-wrapper::after {
        width: 226px;
    }
    .key-values .key-values-info-area p {
        font-size: 20px;
        line-height: 28px;
    }
    .country-flag-img {
        padding-right: 20px;
        margin-left: 8px;
        width: 39px;
    }
    .country-graph-wrapper .country-graph-wrapper-info p {
        font-size: 13px;
    }
    /* target market */
    .target-market .target-market-content p, .how-it-work .how-it-work-content p {
        font-size: 20px;
        line-height: 29px;
    }
    /* latest news */
    .latest-news .latest-news-content-text h4 {
        font-size: 19px;
        margin-bottom: 14px;
        line-height: 28px;
    }
    .subscription .subscription-form input {
        width: 230px;
    }
}
@media (max-width: 1199px) {
    .container-width {
        max-width: 960px;
    }
    .header-two-images {
        width: 200px;
    }
    .header-two-images.d-flex.justify-content-end {
        width: 450px;
    }
    .header-three .header-list .nav-item .nav-link {
        min-width: 100px;
        height: 50px;
        padding: 8px 15px;
    }
    .header-three .user-logo-img {
        height: 28px;
        width: 28px;
    }
    /* main */
    .main {
        padding-bottom: 200px;
    }
    .main .main-content h4 {
        font-size: 27px;
    }
    .main .main-content h1 {
        font-size: 34px;
        line-height: 40px;
    }
    /* global coverage */
    .global-coverage {
        margin-top: -190px;
    }
    /* key values */
    .key-values .key-values-info-area {
        width: 860px;
        margin: 0 auto 35px;
    }
    .key-values .key-values-info-area h2, .latest-news-info-area h2,.how-it-work .how-it-work-content h2 {
        font-size: 40px;
        margin-bottom: 10px;
        line-height: 45px;
    }
    .key-values .images-border-wrapper {
        width: 400px;
        margin: 0 auto 25px;
    }
    .key-values .images-border-wrapper::before, .key-values .images-border-wrapper::after {
        width: 156px;
    }
    .key-values .key-values-info-area p {
        font-size: 19px;
    }
    .key-values .key-values-area-content .ul-height {
        height: 288px;
    }
    .key-values .key-values-graph-area {
        margin-top: 52px;
        padding: 25px;
    }
    .key-values .key-values-graph-area ul li {
        font-size: 16px;
        padding-left: 21px;
    }
    .key-values .key-values-graph-area {
        padding: 40px;
    }
    .key-values .key-values-graph-area {
        max-width: 650px;
        width: 100%;
        margin: 52px auto 0px;
    }
    .country-flag-img {
        padding-right: 20px;
        margin-left: 15px;
        width: 46px;
    }
    .country-graph-wrapper .country-graph-wrapper-info p {
        font-size: 16px;
    }
    /* target market */
    .target-market .target-market-content h3, .how-it-work .how-it-work-content h3 {
        font-size: 28px;
        line-height: 32px;
        margin-bottom: 27px;
    }
    .target-market .target-market-content p, .how-it-work .how-it-work-content p {
        margin-bottom: 35px;
    }
    .target-market ul li {
        font-size: 17px;
        line-height: 29px;
    }
    /* latest news */
    .latest-news .latest-news-content-text {
        padding-right: 30px;
    }
    /* subscription */
    .subscription .subscription-area {
        flex-direction: column;
        text-align: center;
        padding: 160px 40px 40px 40px;
    }
    .subscription .subscription-area .subscription-area-img {
        left: 50%;
        transform: translateX(-50%);
        top: 20px;
    }
    .subscription .subscription-area-content {
        margin-bottom: 30px;
    }
    .subscription .subscription-form {
        margin-bottom: 30px !important;
    }
    .subscription .subscription-form input {
        width: 250px;
        height: 55px;
    }
    /* zoh */
    .sea-waves-info {
        bottom: -110px;
    }
    .vessels-port {
        padding-top: 150px;
    }
    .sea-img {
        height: 100%;
    }
    /* end z */
    .vessels-port .marginb {
        margin-bottom: 40px;
    }
    .footer{
        padding-top: 40px;
    }
    .copyright {
        margin-top: 20px;
    }
   
    .footer p {
        font-size: 15px;
        line-height: 24px;
        margin-bottom: 25px;
    }
    .footer-link p {
        font-size: 15px;
        margin-bottom: 15px;
    }
    .footer-link-ul a {
        font-size: 14px;
        line-height: 28px;
    }
    .copyright p {
        font-size: 14px;
        padding: 10px 0;
    }
    .copyright ul a{
        font-size: 14px;
    }
    h4 {
        font-size: 20px;
    }
}
@media (max-width: 991px) {
    .container-width {
        max-width: 720px;
    }
    .header-one-social-icons{
        display: none !important;
    }
    .header-two-images {
        width: 160px;
        margin-left: 50px;
    }
    .header-two-images.d-flex.justify-content-end {
       display: none !important;
    }
    .header-buttons{
        padding: 10px;
    }
    .header-three .navbar-toggler {
        position: absolute;
        top: -55px;
        border: none;
        padding: 0;
        color: #0F2F5F;
        box-shadow: none;
        outline: none;
    }

    .header-two {
        padding: 10px 0px;
    }
    .header-three .navbar-collapse {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        background: #0f3264;
        z-index: 2;
    }
    .header-three .navbar-collapse ul{
        margin: 0 !important;
    }
    .header-list .nav-item .icon-holder{
        display: none !important;
    }
    .header-three .header-list .nav-item .nav-link{
        justify-content: flex-start;
    }
    /* main */
    .main {
        padding-bottom: 170px;
        height: auto;
    }
    .main .main-content {
        padding: 50px 0px;
    }
    .main .main-content-input-wrapper, .table-section .table-section-area-form-content .main-content-input-wrapper {
        width: 100%;
    }
    .main .row-padding {
        padding-left: 0px;
    }
    .builder-col-info .content-padding{
        padding-left: 35px;
    }
    .content-padding {
        padding-left: 0px;
    }
    /* global coverage */
    .global-coverage {
        margin-top: -140px;
    }
    /* key values */
    .key-values .key-values-info-area {
        width: 680px;
        margin: 0 auto 30px;
    }
    .key-values .key-values-info-area h2, .latest-news-info-area h2, .how-it-work .how-it-work-content h2 {
        font-size: 38px;
        margin-bottom: 10px;
        line-height: 41px;
    }
    .key-values-area {
        margin-bottom: 30px;
    }
    /* updated css */
    .vesseles-last-info-content p {
        font-size: 18px;
        line-height: 26px;
    }
    /* ======== vessels listing ==== */
    .r-slider1 h4 {
        text-align: left !important;
        padding-top: 10px;
    }
    .vessels-database h2 {
        margin-bottom: 30px;
    }
    .vessels-database .input-fields {
        margin-bottom: 40px;
    }
}
@media (max-width: 767.98px){
    /* zoh */
    .banner-heading h1 {
        font-size: 40px;
        line-height: 58px;
    }
    h2 {
        font-size: 32px;
        line-height: 38px;
    }
    .sea-waves-info {
        bottom: -140px;
    }
    .accordion-container {
        padding: 10px 14px;
    }
    .sea-img {
        width: 100%;
    }
    .bg-content-desp {
        margin-top: 10px;
    }
    .bg-content-desp p {
        padding: 10px 30px;
    }
    .bg-content-desp p span {
        font-size: 26px;
    }
    /* end z */
      /* main */
      .main {
        padding-bottom: 80px;
    }
    .main .main-content {
        padding: 60px 0px;
        text-align: center;
    }
    .main .main-content-input-wrapper, .table-section .table-section-area-form-content .main-content-input-wrapper {
        margin-bottom: 30px;
    }
    .main .builder-content p {
        font-size: 17px;
        line-height: 26px;
        margin-bottom: 10px;
    }
    .builder-row {
        margin-bottom: 30px;
    }
    /* global coverage */
    .global-coverage {
        margin-top: -80px;
    }
    /* key values */
    .section-padding {
        padding: 50px 0px;
    }
    .key-values .key-values-info-area {
        width: 490px;
    }
    .key-values .key-values-info-area h2, .latest-news-info-area h2 ,.how-it-work .how-it-work-content h2{
        font-size: 34px;
        line-height: 41px;
    }
    .key-values .key-values-area h3, .key-values .key-values-graph-area  h3 {
        font-size: 24px;
    }
    /* table section */
    .table-section .table-section-area {
        padding: 25px;
    }
    .table-section .table-section-area-form-content {
        margin-bottom: 10px;
        flex-flow: column;
    }
    .subscription .subscription-form input {
        height: 50px;
    }
    .banner .banner-content .banner-img {
        height: 150px;
    }
    .banner .banner-content .banner-img img {
        height: 100%;
        width: 100%;
        object-fit: cover;
    }
    /* updated css */
    .sea-small-images {
        width: 60%;
        margin: 0 auto;
    }
    .vessels-database .input-fields .col-md-3 h4 {
        padding-top: 10px;
    }
    .vessels-listing .key-values .row.graphs {
        margin-bottom: 50px;
    }
    h4 {
        font-size: 19px;
    }
}

@media (max-width: 575.98px){
    .banner-heading h1 {
        font-size: 25px;
        line-height: 40px;
    }
    h2 {
        font-size: 23px;
        line-height: 30px;
    }
    h3 {
        font-size: 21px;
    }
    .sea-waves-bg {
        padding-top: 20px;
    }
    .vessels-port h3 {
        margin-bottom: 10px;
    }
    .sea-waves-content p {
        font-size: 16px;
        line-height: 24px;
    }
    .sea-waves-content p:nth-child(2) {
        margin-bottom: 10px;
    }
    .sea-waves-img-info p {
        font-size: 16px;
        line-height: 24px;
    }
    .sea-waves-info {
        position: unset;
    }
    .vessels-port {
        padding-top: 20px;
    }
    .vessels-port .accordion-header .accordion-button.collapsed {
        font-size: 16px;
    }
    .vessels-port .accordion-table .row1 {
        flex-direction: column;
    }
    .accordion-container {
        height: unset;
    }
    .ports-container .port {
        flex-direction: column;
        align-items: flex-start !important;
    }
    .img-margin-b {
        margin-bottom: 10px;
    }
    .ports-container .port .date p, .ports-container .port .flag-name p {
        font-size: 16px;
    }
    .bg-content-desp p {
        padding: 10px
    }
    .bg-content-desp p {
        font-size: 16px;
        line-height: 24px;
    }
    .bg-content-desp p span {
        font-size: 18px;
    }
    .footer {
        padding-top: 20px;
    }
    .footer .footer-logo {
        margin-bottom: 20px;
    }
    .footer p {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 10px;
    }
    .footer-links-container {
        padding-top: 30px;
    }
    .footer-link-ul a {
        font-size: 16px;
        line-height: 24px;
    }
    .footer-link.contact-us {
        margin-top: 30px;
    }
    .copyright .main-copyright-div {
        flex-direction: column;
    }
    .copyright p {
        padding: 7px 0;
    }
    .copyright ul a {
        font-size: 16px;
    }

      /* main */
      .main {
        height: auto;
    }
    .main .main-content {
        padding: 40px 0px;
    }
    .main .main-content h4 {
        font-size: 26px;
    }
    .main .main-content h1 {
        font-size: 32px;
        line-height: 40px;
    }
    .main .builder-col-head {
        width: 100%;
    }
    .main .builder-col-info {
        width: 100%;
    }
    .builder-row {
        margin-bottom: 20px;
        flex-direction: column;
    }
    .builder-col-info .content-padding {
        padding-left: 0px;
    }
    .main .builder-content.content-border::before {
        display: none;
    }
    /* global coverage */
    .global-coverage {
        margin-top: -60px;
    }
    /* key values */
    .key-values .key-values-info-area {
        width: 270px;
    }
    .key-values .images-border-wrapper {
        width: 100%;
    }
    .key-values .images-border-wrapper::before, .key-values .images-border-wrapper::after {
        width: 100px;
    }
    .key-values .key-values-info-area h2, .latest-news-info-area h2 ,.how-it-work .how-it-work-content h2{
        font-size: 32px;
        line-height: 39px;
    }
    .key-values .key-values-info-area h4, .latest-news-info-area h4 {
        font-size: 19px;
        letter-spacing: 3.92px;
    }
    .key-values .key-values-area h3, .key-values .key-values-graph-area h3 {
        font-size: 22px;
    }
    .country-graph-wrapper .progress-wrapper-bg p {
        font-size: 12px;
    }
    .key-values .key-values-graph-area {
        padding: 15px;
    }
    .country-flag-img {
        margin-left: 6px;
        width: 35px;
    }
    .country-graph-wrapper .country-graph-wrapper-info p {
        font-size: 11px;
    }
    /* target market */
    .target-market .target-market-content h3, .how-it-work .how-it-work-content h3 {
        font-size: 25px;
        line-height: 31px;
        margin-bottom: 16px;
    }
    .target-market .target-market-content p, .how-it-work .how-it-work-content p {
        font-size: 19px;
        line-height: 27px;
    }
    .how-it-work .how-it-work-content h3 {
        padding-right: 0px;
    }
    /* latest news */
    .latest-news .latest-news-content-text h4 {
        font-size: 18px;
        margin-bottom: 10px;
        line-height: 26px;
    }
    /* table section */
    .subscription .subscription-form {
        flex-direction: column;
    }
    .table-section .table-section-area {
        padding: 5px;
    }
    .main .main-content-input-wrapper input::placeholder, .table-section .table-section-area-form-content .main-content-input-wrapper input::placeholder{
        font-size: 10px;
    }
    .main .main-content-input-wrapper .btn-blue, .table-section .table-section-area-form-content .main-content-input-wrapper .btn-blue {
        width: 75px;
        font-size: 14px;
    }
    .main .main-content-input-wrapper .search-icon, .table-section .table-section-area-form-content .main-content-input-wrapper .search-icon{
        height: 40px;
    }
    .main .main-content-input-wrapper, .table-section .table-section-area-form-content .main-content-input-wrapper{
        height: 50px;
    }
    /* zoh */
    .sea-waves-content {
        padding-top: 0;
    }
    .sea-waves-content h2 {
        margin-bottom: 10px;
    }
    .sea-waves-content p:nth-child(2) {
        margin-bottom: 20px;
    }
   
    .sea-waves-info {
        padding: 20px;
    }
  
    .sea-waves-info {
        bottom: -130px;
    }
    .vessels-port .col-lg-5 {
        margin-top: 30px;
    }

    /* end z */
    .accordion-container{
        height: auto;
    }
    .footer-links-container {
        padding-top: 30px;
    }
    .copyright p {
        font-size: 13px;
    }
    .key-values .key-values-area-content{
        padding: 12px;
    }
    .key-values .key-values-area-content ul li {
        min-width: 300px;
    }
    /* updated css */
    .sea-small-images {
        width: 100%;
        margin: 0 auto;
    }
    .content-table-bg {
        padding: 15px !important;
    }
     /* ============ vessels listing ========= */
     .vessels-database .input-fields input, .vessels-database .input-fields .dropdown button {
        padding: 14px 16px;
    }
    .vessels-listing .key-values h2 {
        margin-bottom: 20px;
    }
    .vessels-listing .key-values .row.graphs {
        margin-bottom: 20px;
    }
    .table-pagination p:nth-child(1) {
        margin-right: 29px;
    }
    .r-slider1 .full-range, .r-slider1 .incl-range {
        height: 14px;
        top: 18px;
    }
    .r-slider1 input[type=range]::-webkit-slider-thumb {
        height: 25px;
        width: 25px;
    }
    h4 {
        font-size: 17px;
    }
}