.row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: 0;
    margin-left: 0;
  }
  
.topheaderbg{
    background-color:#55A1C8 ;
    font-family: inter;
    color: white;
    font-size: 12px;
    font-weight: 400;
    padding: 0.5% 0;
}
.topheaderbg a{
    color: white;
    text-decoration: none;
}
.topmail {
    float: left;
    text-align: left;
  }
.topmail1 {
    width: 0.6%;
    margin: 0 1% 0 0;
  }
  .topcall {
    float: right;
    text-align: right;
  }
  .topcall1 {
    width: 2%;
    margin: 0 1% 0 0;
  }
  .bg-body-tertiary {
    --bs-bg-opacity: 1;
    background-color: transparent !important;
  }
  .headernav{
    padding-right: 0px !important;
    padding-left: 0px !important;
  }
  .navbar-brand img{
    width: 100%;
  }
  .navbutton{
    background-color: #55A1C8;
    font-size: 16px;
    font-weight: 500;
    color: white;
    border: 0px;
    font-family: inter;
    padding: 1% 2.5%;
    text-decoration: none;
  }
  .navbutton:hover{
    background-color: #2A749A;
   
  }
  .navbar-collapse {
    flex-basis: 100%;
    flex-grow: 0.2;
    align-items: center;
    float: right;
  }
  .nav-link {
    display: block;
    padding: 0 0px 0 40px !important;
    font-size: 15px;
    font-weight: var(--bs-nav-link-font-weight);
    color: black;
    text-decoration: none;
    background: 0 0;
    border: 0;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
    font-family: inter;
  }
  .nav-link:focus, .nav-link:hover {
    color: #2A749A;
  }

.dropdown-item {
    font-family: 'Inter';
    font-size: 14px;
    color: black;
    padding: 4% 0;
}

.navbar-nav .dropdown-menu {
    padding: 5% 15%;
}
.dropdown-item:hover{
	background-color: transparent;
}

/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
    /* Styles */
    .topmail {
        float: left;
        text-align: left;
      }
      .topmail1 {
        width: 2.8%;
        margin: -2px 1% 0 0;
      }
      .topcall {
        float: right;
        text-align: right;
      }
      .topcall1 {
        width: 2%;
        margin: -2px 1% 0 0;
      }
      .nav-link {
        display: block;
        padding: 0 0px 0 35px !important;
        font-size: 14px;
        font-weight: var(--bs-nav-link-font-weight);
        color: black;
        text-decoration: none;
        background: 0 0;
        border: 0;
        transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
        font-family: inter;
      }
      .navbutton {
        background-color: #55A1C8;
        font-size: 14px;
        font-weight: 500;
        color: white;
        border: 0px;
        font-family: inter;
        padding: 1.5% 2.5%;
        text-decoration: none;
      }
      .navbar-collapse {
        flex-basis: 100%;
        flex-grow: 0.3;
        align-items: center;
        float: right;
      }
    }
    
/* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
    /* Styles */
    .topmail {
        float: left;
        text-align: left;
      }
    .topmail1 {
        width: 2.6%;
        margin: -2px 1% 0 0;
      }
      .topcall {
        float: right;
        text-align: right;
      }
      .topcall1 {
        width: 2%;
        margin: -2px 1% 0 0;
      }
      .nav-link {
        display: block;
        padding: 0 0px 0 40px !important;
        font-size: 15px;
        font-weight: var(--bs-nav-link-font-weight);
        color: black;
        text-decoration: none;
        background: 0 0;
        border: 0;
        transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
        font-family: inter;
      }
      .navbutton {
        background-color: #55A1C8;
        font-size: 16px;
        font-weight: 500;
        color: white;
        border: 0px;
        font-family: inter;
        padding: 1% 2.5%;
        text-decoration: none;
      }
      .navbar-collapse {
        flex-basis: 100%;
        flex-grow: 0.2;
        align-items: center;
        float: right;
      }
      .navbar-collapse {
        flex-basis: 100%;
        flex-grow: 0.2;
        align-items: center;
        float: right;
      }
    }   
    

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    /* Styles */
    .topheaderbg{
        background-color:#55A1C8 ;
        font-family: inter;
        color: white;
        font-size: 12px;
        font-weight: 400;
        padding: 1% 0;
    }
    .topmail1 {
        width: 10%;
        margin: 0 3% 0 0;
        float: left;
        display: none;
      }
      
      .topcall1 {
        width: 8%;
        margin: 0 3% 0 0;
        float: left;
        display: none;
      }
     
    .navbar-brand img{
        width: 85%;
      }
      .navbar-toggler-icon {
        display: inline-block;
        width: 1em;
        height: 1em;
        vertical-align: middle;
        background-image: var(--bs-navbar-toggler-icon-bg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100%;
    }
    .navbar-toggler {
        font-size: var(--bs-navbar-toggler-font-size);
        line-height: 1;
        color: #55A1C8;
      }
      .nav-link {
        display: block;
        padding: 3% 0px 0 0px !important;
        font-size: 14px;
        font-weight: var(--bs-nav-link-font-weight);
        color: black;
        text-decoration: none;
        background: 0 0;
        border: 0;
        transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
        font-family: inter;
      }
      .nav-link:focus, .nav-link:hover {
        color: #2A749A;
      }
      .navbutton{
        background-color: #55A1C8;
        font-size: 14px;
        font-weight: 500;
        color: white;
        border: 0px;
        font-family: inter;
        padding: 2% 4.5%;
        text-decoration: none;
      }
      .navbutton:hover{
        background-color: #2A749A;
       
      }
      .navbar-nav{
        margin: 0 0 5% 0 !important;
      }
      .navbar-collapse {
        padding: 0 0 4% 0;
      }
      
    }


      /* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    /* Styles */
    .row {
        --bs-gutter-x: 1.5rem;
        --bs-gutter-y: 0;
        display: flex;
        flex-wrap: wrap;
        margin-top: calc(-1 * var(--bs-gutter-y));
        margin-right: 0;
        margin-left: 0;
      }

    .topheaderbg{
        background-color:#55A1C8 ;
        font-family: inter;
        color: white;
        font-size: 12px;
        font-weight: 400;
        padding: 1% 0;
    }
    .topmail1 {
        width: 10%;
        margin: 0 3% 0 0;
        float: left;
        display: none;
      }
      
      .topcall1 {
        width: 8%;
        margin: 0 3% 0 0;
        float: left;
        display: none;
      }
     
    .navbar-brand img{
        width: 80%;
      }
      .navbar-toggler-icon {
        display: inline-block;
        width: 1em;
        height: 1em;
        vertical-align: middle;
        background-image: var(--bs-navbar-toggler-icon-bg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100%;
    }
    .navbar-toggler {
        font-size: var(--bs-navbar-toggler-font-size);
        line-height: 1;
        color: #55A1C8;
      }
      .nav-link {
        display: block;
        padding: 5% 0px 0 0px !important;
        font-size: 14px;
        font-weight: var(--bs-nav-link-font-weight);
        color: black;
        text-decoration: none;
        background: 0 0;
        border: 0;
        transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
        font-family: inter;
      }
      .nav-link:focus, .nav-link:hover {
        color: #2A749A;
      }
      .navbutton{
        background-color: #55A1C8;
        font-size: 14px;
        font-weight: 500;
        color: white;
        border: 0px;
        font-family: inter;
        padding: 3% 4.5%;
        text-decoration: none;
      }
      .navbutton:hover{
        background-color: #2A749A;
       
      }
	
      .navbar-nav{
        margin: 0 0 6% 0 !important;
      }
      .navbar-collapse {
        padding: 0 0 4% 0;
      }
	.navbar-nav .dropdown-menu {
    padding: 5% 15%;
}

}




.bannerbg{
    background: url("https://www.hashmilaw.com/Images/banner2.jpg") no-repeat center;
    background-size: cover;
    height: 70vh;
    text-align: center;
    padding: 3% 0 0 0;
    font-family: inter;
    color: white;
}
.bannertext1{
 font-size: 16px;
 padding: 0 0;
}
.bannertext2{
    font-family: DM serif text;
    font-size: 56px;
    padding: 0.5% 22%;
    line-height: 60px;
}
.bannertext3{
    font-size: 16px;
    padding: 0% 19% 1% 19%;
}


/* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
    /* Styles */
    
.bannerbg{
    background-size: cover;
    height: 70vh !important;
    text-align: center;
    padding: 3% 0 0 0 !important;
    color: white !important;
}
.bannertext1{
    font-size: 16px !important;
    padding: 0 0 !important;
}
.bannertext2{
       font-size: 56px !important;
       padding: 0.5% 22% !important;
       line-height: 60px !important;
}
.bannertext3{
       font-size: 16px !important;
       padding: 0.2% 19% 1% 19% !important;
}
   
    }


/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
    /* Styles */

    .bannerbg{
        background-size: cover;
        height: 70vh;
        text-align: center;
        padding: 3% 0 0 0;
        font-family: inter;
        color: white;
    }
    .bannertext1{
        font-size: 14px;
        padding: 0 0;
    }
    .bannertext2 {
        font-size: 48px;
        padding: 0.6% 22%;
        line-height: 54px;
      }
    .bannertext3{
           font-size: 15px;
           padding: 0% 16% 1% 16%;
    }

    }


/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    /* Styles */
    .bannerbg{
        background-size: cover;
        height: 45vh;
        text-align: center;
        padding: 6% 0 0 0;
        font-family: inter;
        color: white;
    }
    .bannertext1{
        font-size: 14px;
        padding: 0 0;
    }
    .bannertext2 {
        font-size: 40px;
        padding: 0.6% 7%;
        line-height: 44px;
      }
    .bannertext3{
           font-size: 14px;
           padding: 0% 2% 1% 2%;
    }
    }

    
/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
/* Styles */
.bannerbg{
    background-size: cover;
    height: 60vh;
    text-align: center;
    padding: 10% 0 0 0;
    font-family: inter;
    color: white;
}
.bannertext1{
    font-size: 14px;
    padding: 0 0;
}
.bannertext2 {
    font-size: 32px;
    padding: 0.6% 7%;
    line-height: 38px;
  }
.bannertext3{
       font-size: 14px;
       padding: 0% 2% 1% 2%;
}
}




.sectiontwo{
 padding: 8% 0%;
}
.sectiontwoleft{
 padding: 4% 6% 0% 0%;
 width: 50%;
}
.sectiontwoleft1 {
    color: black;
    font-family: DM serif text;
    font-size: 45px;
    line-height: 45px;
    padding: 0 0 2% 0;
  }
.sectiontwoleft2{
  color: black;
  font-size: 14px;
  font-family: inter;

}
.sectiontwoleft3{
    color: black;
    font-size: 14px;
    font-family: inter;
    margin: -1% 0 5% 0;
  }
.sectionbutton{
    background-color: #55A1C8;
    font-size: 14px;
    font-weight: 500;
    color: white;
    border: 0px;
    font-family: inter;
    padding: 2% 4.5%;
    text-decoration: none;
  }
  .sectionbutton:hover{
    background-color: #2A749A;
   
  }

  .sectiontwoleft01{
    padding: 6% 6% 0% 0%;
   }
   .sectiontworight{
    padding: 0 0 0 0;
    width: 100%;
   }
   .sectiontworight img{
    width: 100%;
   }
   .sectiontwo02{
    width: 50%;
   }



   /* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
    /* Styles */
    .sectiontwoleft1 {
        font-size: 45px !important;
        line-height: 45px !important;
        padding: 0 0 2% 0;
      }
      .sectiontwoleft {
        padding: 4% 6% 0% 0% !important;
      }
      .sectiontwoleft01 {
        padding: 6% 6% 0% 0% !important;
      }
    }

    

/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
    /* Styles */
    .sectiontwoleft1 {
        font-size: 42px;
        line-height: 44px;
        padding: 0 0 2% 0;
      }
      .sectiontwoleft {
        padding: 1% 6% 0% 0%;
      }
      .sectiontwoleft01 {
        padding: 3% 6% 0% 0%;
      }
    }


/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    /* Styles */
    .sectiontwoleft {
        padding: 0% 2% 6% 2%;
        text-align: left;
      }
      .sectiontwoleft1 {
        font-size: 28px;
        line-height: 32px;
        padding: 0 0 1% 0;
      }
      .sectiontwoleft01 {
        padding: 0% 2% 6% 2%;
        text-align: left;
        width: 50%;
      }
      .sectiontwoleft2 {
        font-size: 13px;
      }
      .sectiontwoleft3 {
        font-size: 13px;
        margin: -2% 0 5% 0;
      }
    }


/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    /* Styles */
    .sectiontwoleft {
        padding: 4% 2% 12% 2%;
        width: 100%;
        text-align: center;
      }
      .sectiontwoleft1 {
        font-size: 28px;
        line-height: 34px;
        padding: 0 0 2% 0;
      }
      .sectiontwo02 {
        width: 100%;
      }
      .sectiontwoleft01{
        padding: 4% 2% 12% 2%;
        width: 100%;
        text-align: center;
      }
      .sectionbutton {
        background-color: #55A1C8;
        font-size: 14px;
        font-weight: 500;
        color: white;
        border: 0px;
        font-family: inter;
        padding: 3% 8.5%;
        text-decoration: none;
      }
      .sectiontwoleft3 {
        color: black;
        font-size: 14px;
        font-family: inter;
        margin: -1% 0 8% 0;
      }
    }



    .sectionthree1{
        font-size: 45px;
        line-height: 50px;
        padding: 0 24% 1% 24%;
        color: black;
        font-family: DM serif text;
        text-align: center;
    }
    .sectionthree2{
        color: black;
        font-size: 14px;
        font-family: inter;
        text-align: center;
        padding: 0 20% 0 20%;
    }
    .boxicon01{
        padding: 3% 0 0 0;
    }
    .boxicon1{
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 3% 3% 2% 3%;
        margin: 0 1.2% 0 0%;
        width: 32%;
    }
   
    .boxicon2{
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 3% 3% 2% 3%;
        margin: 0 0.6% 0 0.6%;
        width: 32%;
    }
    .boxicon3{
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 3% 3% 2% 3%;
        margin: 0 0% 0 1.2%;
        width: 32%;
    }
    .boxiconimage{
        width: 24%;
    }
    .boxicontext{
        color: black;
        font-family: DM serif text;
        font-size: 26px;
        padding: 5% 0 0 0;
    }
    .boxiconparh{
        color: black;
        font-size: 14px;
        font-family: inter;
        padding: 1% 0 0 0;
    }



    /* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
    /* Styles */
    .sectionthree1{
        font-size: 45px !important;
        line-height: 50px !important;
        padding: 0 24% 1% 24% !important;
        color: black;
        text-align: center;
    }
    .sectionthree2 {
        color: black;
        font-size: 14px;
        font-family: inter;
        text-align: center;
        padding: 0 20% 0 20% !important;
      }
      .boxicontext {
        color: black;
        font-size: 26px !important;
        padding: 5% 0 0 0 !important;
      }
      .boxiconparh {
        color: black;
        font-size: 14px !important;
        font-family: inter;
        padding: 1% 0 0 0 !important;
      }
      .boxicon1{
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 3% 3% 2% 3% !important;
        margin: 0 1.2% 0 0%;
        width: 32%;
    }
   
    .boxicon2{
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 3% 3% 2% 3% !important;
        margin: 0 0.6% 0 0.6%;
        width: 32%;
    }
    .boxicon3{
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 3% 3% 2% 3% !important;
        margin: 0 0% 0 1.2%;
        width: 32%;
    }
    }


    /* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
    /* Styles */
    .sectionthree1 {
        font-size: 42px;
        line-height: 44px;
        padding: 0 20% 1% 20%;
        color: black;
        text-align: center;
      }
      .sectionthree2 {
        color: black;
        font-size: 14px;
        font-family: inter;
        text-align: center;
        padding: 0 16% 0 16%;
      }
      .boxicontext {
        color: black;
        font-size: 23px;
        padding: 5% 0 1% 0;
      }
      .boxiconparh {
        color: black;
        font-size: 13px;
        padding: 0% 0 0 0;
      }
      .boxicon1 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 3% 2% 2% 2%;
        margin: 0 1.2% 0 0%;
        width: 32%;
      }
      .boxicon2 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 3% 2% 2% 2%;
        margin: 0 0.6% 0 0.6%;
        width: 32%;
      }
      .boxicon3 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 3% 2% 2% 2%;
        margin: 0 0% 0 1.2%;
        width: 32%;
      }
    }



    /* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    /* Styles */
    .sectionthree1 {
        font-size: 28px;
        line-height: 32px;
        padding: 0 15% 1% 15%;
        color: black;
        text-align: center;
      }
      .sectionthree2 {
        color: black;
        font-size: 14px;
        text-align: center;
        padding: 0 2% 0 2%;
      }
      .boxicontext {
        color: black;
        font-family: DM serif text;
        font-size: 20px;
        padding: 5% 0 0 0;
      }
      .boxiconparh {
        color: black;
        font-size: 13px;
        font-family: inter;
        padding: 1% 0 0 0;
      }
      .boxiconimage {
        width: 30%;
      }
      .boxicon1 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 3% 2% 2% 2%;
        margin: 0 1.2% 0 0%;
        width: 32%;
      }
      .boxicon2 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 3% 2% 2% 2%;
        margin: 0 0.6% 0 0.6%;
        width: 32%;
      }
      .boxicon3 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 3% 2% 2% 2%;
        margin: 0 0% 0 1.2%;
        width: 32%;
      }
    }


    /* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    /* Styles */
    .sectionthree1 {
        font-size: 28px;
        line-height: 34px;
        padding: 8% 2% 1% 2%;
        color: black;
        font-family: DM serif text;
        text-align: center;
      }
      .sectionthree2 {
        color: black;
        font-size: 14px;
        font-family: inter;
        text-align: center;
        padding: 0 2% 0 2%;
      }
      .boxicon1 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 10% 3% 8% 3%;
        margin: 6% 2% 0 2%;
        width: 96%;
      }
      .boxicon2 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 10% 3% 8% 3%;
        margin: 4% 2% 0 2%;
        width: 96%;
      }
      .boxicon3 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 10% 3% 8% 3%;
        margin: 4% 2% 0 2%;
        width: 96%;
      }
      .boxicontext {
        color: black;
        font-family: DM serif text;
        font-size: 25px;
        padding: 5% 0 0 0;
      }
    }




    .sectionfourrightbg{
        background-color: #55A0C7;
        width: 41.1%;
        color: #ffffff;
        font-family: inter;
        padding: 7% 5%;
    }
    .sectionfourleft{
        padding: 0 0;
    }
    .sectionfour{
        padding: 6% 0 0 0;
    }
    .sectionfourtext1{
        font-size: 14px;
    }
    .sectionfourtext2{
        font-family: DM serif text;
        font-size: 30px;
        line-height: 34px;
        padding: 1.4% 0 1% 0;
    }
    .sectionfourtext3{
        font-size: 14px;
        padding: 0 0 3% 0;
    }
    .sectionfourbutton {
        background-color: #2A749A;
        font-size: 15px;
        font-weight: 500;
        color: white;
        border: 0px;
        font-family: inter;
        padding: 3% 5.5%;
        text-decoration: none;
      }

      .sectionfourbutton:hover{
        background-color: #145372;
      }
      




      /* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
    /* Styles */
    .sectionfourrightbg{
        background-color: #55A0C7;
        width: 41.1%;
        color: #ffffff;
        font-family: inter;
        padding: 7% 5% !important;
    }
    .sectionfourleft{
        padding: 0 0;
    }
    .sectionfour{
        padding: 6% 0.5% 0 0.6% !important;
    }
    .sectionfourtext1{
        font-size: 14px;
    }
    .sectionfourtext2{
        font-family: DM serif text;
        font-size: 30px;
        line-height: 34px;
        padding: 1.4% 0 1% 0;
    }
    .sectionfourtext3{
        font-size: 14px;
        padding: 0 0 3% 0;
    }
    .sectionfourbutton {
        background-color: #2A749A;
        font-size: 15px;
        font-weight: 500;
        color: white;
        border: 0px;
        font-family: inter;
        padding: 3% 5.5%;
        text-decoration: none;
      }
    }


    /* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
    /* Styles */
    .sectionfourrightbg{
        background-color: #55A0C7;
        width: 41.1%;
        color: #ffffff;
        font-family: inter;
        padding: 7% 5%;
    }
    .sectionfourleft{
        padding: 0 0;
    }
    .sectionfour{
        padding: 6% 0.5% 0 0.6%;
    }
    .sectionfourtext1{
        font-size: 14px;
    }
    .sectionfourtext2{
        font-family: DM serif text;
        font-size: 30px;
        line-height: 34px;
        padding: 1.4% 0 1% 0;
    }
    .sectionfourtext3{
        font-size: 14px;
        padding: 0 0 3% 0;
    }
    .sectionfourbutton {
        background-color: #2A749A;
        font-size: 15px;
        font-weight: 500;
        color: white;
        border: 0px;
        font-family: inter;
        padding: 3% 5.5%;
        text-decoration: none;
      }
    }


    /* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    /* Styles */
    .sectionfourimage{
        width: 100%;
      }
      .sectionfourleft {
        padding: 0 0;
        width: 100%;
      }
      .sectionfourrightbg {
        background-color: #55A0C7;
        width: 100%;
        color: #ffffff;
        font-family: inter;
        padding: 10% 5%;
      }
      .sectionfourbutton {
        background-color: #2A749A;
        font-size: 15px;
        font-weight: 500;
        color: white;
        border: 0px;
        font-family: inter;
        padding: 2.5% 5.5%;
        text-decoration: none;
      }
      .sectionfour {
        padding: 6% 1% 0 1%;
      }
    }

    

    /* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    /* Styles */
    .sectionfour {
        padding: 6% 0 0 0;
        width: 89%;
      }

    .sectionfourimage{
        width: 100%;
    }
    .sectionfourleft {
        padding: 10% 0 0 0;
        width: 100%;
      }
      .sectionfourrightbg {
        background-color: #55A0C7;
        width: 100%;
        color: #ffffff;
        font-family: inter;
        padding: 15% 9%;
        text-align: center;
      }
      .sectionfourtext1 {
        font-size: 13px;
        margin: -2% 0 1% 0;
      }
      .sectionfourtext2 {
        font-family: DM serif text;
        font-size: 26px;
        line-height: 30px;
        padding: 1.4% 0 0% 0;
      }
    }



    .sectionfive{
        padding: 6% 0 0 0;
    }
    .boximage1 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 0% 0% 3% 0%;
        margin: 0 1.2% 0% 0%;
        width: 32%;
      }
      .boximage2 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 0% 0% 0% 0%;
        margin: 0 0.6% 0 0.6%;
        width: 32%;
      }
      .boximage3 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 0% 0% 0% 0%;
        margin: 0 0% 0 1.2%;
        width: 32%;
      }

      .boximage01 {
        width: 100%;
      }

      .boximagetext {
        color: black;
        font-size: 26px ;
        padding: 6% 18% 0 18% ;
        font-family: DM serif text;
      }
      .boximageparh {
        color: black;
        font-size: 14px ;
        font-family: inter;
        padding: 0% 8% 2% 8%;
      }
      .boxicon02 {
        padding: 2% 0 0 0;
      }
      .sectionfivebutton {
        background-color: #55A1C8;
        font-size: 15px;
        font-weight: 500;
        color: white;
        border: 0px;
        font-family: inter;
        padding: 2.5% 5.5%;
        text-decoration: none;
      }
      .sectionfivebutton:hover {
        background-color: #2A749A;
      }





      /* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
    /* Styles */
    }

    


    /* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
    /* Styles */
    }




    /* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    /* Styles */
    .boximagetext {
        color: black;
        font-size: 20px;
        padding: 8% 10% 0 10%;
        font-family: DM serif text;
      }
      .boximageparh {
        color: black;
        font-size: 13px;
        font-family: inter;
        padding: 0% 4% 2% 4%;
      }
      .sectionfivebutton {
        background-color: #55A1C8;
        font-size: 14px;
        font-weight: 500;
        color: white;
        border: 0px;
        font-family: inter;
        padding: 3.5% 7.5%;
        text-decoration: none;
      }
      .sectionfivebutton:hover {
        background-color: #2A749A;
      }
    }



    /* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    /* Styles */
    .boxicon01 {
        padding: 3% 0 0 0;
        width: 100%;
      }
    .boximage1 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 0% 0% 8% 0%;
        margin: 2% 1% 0% 1%;
        width: 98%;
      }
      .boximagetext {
        color: black;
        font-size: 24px;
        padding: 6% 18% 0 18%;
        font-family: DM serif text;
      }
      .boximage2 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 0% 0% 8% 0%;
        margin: 4% 1% 0 1%;
        width: 98%;
      }
      .boximage3 {
        border: 1px solid #55A1C8;
        text-align: center;
        box-shadow: rgba(100, 100, 111, 0.06) 0px 7px 29px 0px;
        padding: 0% 0% 8% 0%;
        margin: 4% 1% 0 1%;
        width: 98%;
      }
    }
    




    .testimonialbg{
        background: url("https://www.hashmilaw.com/Images/Group 32.jpg") no-repeat center;
        background-size: cover;
        height: 70vh;
        text-align: center;
        padding: 6% 0 0 0;
        font-family: inter;
        margin: 1% 0 0 0;
    }

    .testimonialtext1{
         color: #55A1C8;
         font-family: inter;
         font-size: 16px;
         text-transform: uppercase;
    }
    .testimonialtext2{
        font-family: DM serif text;
        font-size: 45px;
        color: black;
        padding: 1% 28%;
    }
    

    .main {
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
      
      }
      
      .testimonials {
        width: 100%;
        max-width: 70%;
        margin: 20px;
        position: relative;
        opacity: 0;
        animation: showTestimonials 0.32s 0.78s cubic-bezier(0.55, 0.055, 0.675, 0.19) forwards;
        input {
          display: none;
          visibility: hidden;
          height: 0;
          width: 0;
          pointer-events: none;
          opacity: 0;
        }
      }
      
      @keyframes showTestimonials {
        to {
          opacity: 1;
        }
      }
      
      .testimonials-inner {
        position: relative;
        min-height: 100px;
      }
      
      .testimonial {
        padding: 20px 34px 20px 34px;
        margin: 0 30px;
        pointer-events: none;
        position: relative;
        z-index: 1;
      }
      
      input[name="testimonial"]:nth-child(1):checked ~ .testimonials-inner .testimonial:nth-child(1),
      input[name="testimonial"]:nth-child(2):checked ~ .testimonials-inner .testimonial:nth-child(2),
      input[name="testimonial"]:nth-child(3):checked ~ .testimonials-inner .testimonial:nth-child(3),
      input[name="testimonial"]:nth-child(4):checked ~ .testimonials-inner .testimonial:nth-child(4) {
        pointer-events: initial;
      }
      
      .testimonial {
        transition: 0.72s cubic-bezier(0.215, 0.610, 0.355, 1), opacity 0.32s 0.12s;
        opacity: 0;
        transform: translate(0, 38px);
        max-height: 80px;
        animation: hideTestimonial 0s 0.52s forwards;
        position: relative;
      }
      
      input[name="testimonial"]:nth-child(1):checked ~ .testimonials-inner .testimonial:nth-child(1),
      input[name="testimonial"]:nth-child(2):checked ~ .testimonials-inner .testimonial:nth-child(2),
      input[name="testimonial"]:nth-child(3):checked ~ .testimonials-inner .testimonial:nth-child(3),
      input[name="testimonial"]:nth-child(4):checked ~ .testimonials-inner .testimonial:nth-child(4) {
        animation: showTestimonial 0s 0.72s forwards;
        position: absolute;
        opacity: 1;
        transform: none;
        max-height: 500px;
        transition: 0.3s 0.52s, opacity 0.68s 0.92s, max-height 0.82s 0.72s;
      }
      
      @keyframes hideTestimonial {
        to {
          position: absolute
        }
      }
      
      @keyframes showTestimonial {
        to {
          position: relative
        }
      }
      
      input[name="testimonial"]:nth-child(1):checked ~ .testimonials-bullets label:nth-child(1) span,
      input[name="testimonial"]:nth-child(2):checked ~ .testimonials-bullets label:nth-child(2) span,
      input[name="testimonial"]:nth-child(3):checked ~ .testimonials-bullets label:nth-child(3) span,
      input[name="testimonial"]:nth-child(4):checked ~ .testimonials-bullets label:nth-child(4) span {
        background-color: #55A1C8;
        transform: scale(1);
        transition: transform 0.36s cubic-bezier(0.26, -0.59, 0.43, 2.48), background-color 0.41s ease-in;
      }
      
      .testimonial-photo {
        height: 84px;
        width: 84px;
        position: absolute;
        top: -32px;
        left: 0;
        right: 0;
        margin: 0 auto;
      }
      
      .photo-background {
        background-color: #ffffff;
        position: absolute;
        top: 0;
        left: 0;
        border-radius: 50%;
        height: 100%;
        box-shadow: 0 -4px 3px -2px #c3c2c2;
        width: 100%;
        transform: scale(0.87);
        transition: 0.32s;
      }
      
      input[name="testimonial"]:nth-child(1):checked ~ .testimonials-inner .testimonial:nth-child(1) .photo-background,
      input[name="testimonial"]:nth-child(2):checked ~ .testimonials-inner .testimonial:nth-child(2) .photo-background,
      input[name="testimonial"]:nth-child(3):checked ~ .testimonials-inner .testimonial:nth-child(3) .photo-background,
      input[name="testimonial"]:nth-child(4):checked ~ .testimonials-inner .testimonial:nth-child(4) .photo-background {
        transform: scale(1);
        transition: 0s;
      }
      
      .photo-author {
        background-size: 68px;
        background-position: center;
        height: 0;
        width: 0;
        border-radius: 50%;
        background-color: #dbdbdb;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        margin: auto;
        opacity: 0;
        transform: scale(1.18) translate(0, -6px);
        transition: transform 0.42s ease-out, opacity 0.58s, width 0s 0.6s, height 0s 0.6s;
      }
      
      input[name="testimonial"]:nth-child(1):checked ~ .testimonials-inner .testimonial:nth-child(1) .photo-author,
      input[name="testimonial"]:nth-child(2):checked ~ .testimonials-inner .testimonial:nth-child(2) .photo-author,
      input[name="testimonial"]:nth-child(3):checked ~ .testimonials-inner .testimonial:nth-child(3) .photo-author,
      input[name="testimonial"]:nth-child(4):checked ~ .testimonials-inner .testimonial:nth-child(4) .photo-author {
        transform: scale(1);
        opacity: 1;
        height: 68px;
        width: 68px;
        transition: width 0.26s 1.01s, height 0.26s 1.01s;
      }
      
      .testimonial-text {
        color: #000000;
        font-size: 18px;
        text-align: center;
        letter-spacing: 0.12px;
        font-style: normal;
        line-height: 26px;
        font-family: inter;
        p {
          margin-bottom: 10px;
        }
      }
      
      .testimonial-author {
        font-size: 18px;
        text-align: center;
        color: #55A1C8;
        letter-spacing: 0.24px;
        text-shadow: 0 0 1px #55A1C8;
        font-family: inter;
        font-weight: 500;
        padding: 2% 0 0 0;
      }
      
      .testimonials-bullets {
        display: flex;
        justify-content: center;
        width: 100%;
        height: 30px;
        transform: translate(0, 8px);
        .bullet {
          height: 30px;
          width: 30px;
          cursor: pointer;
          margin: 0 1px;
          div {
            display: flex;
            align-items: center;
            justify-content: center;
            height: 30px;
            width: 30px;
            border-radius: 50%;
            background-color: #ffffff;
            box-shadow: 0 4px 6px -7px #000000;
            span {
              background-color: #0e2c3536;
              height: 14px;
              width: 14px;
              border-radius: 50%;
              transform: scale(0.82);
              transition: 0.72s;
            }
          }
          &:hover span {
            background-color: #55A1C8;
          }
        }
      }
      
      .testimonials-arrows {
        height: 100%;
        .arrow {
          display: flex;
          align-items: center;
          justify-content: center;
          height: 50px;
          width: 50px;
          position: absolute;
          top: calc(50% - 25px);
          span {
            display: flex;
            align-items: center;
            justify-content: center;
            background-color: #ffffff;
            border-radius: 50%;
            height: 40px;
            width: 40px;
            &:before {
              font-size: 32px;
              font-family: monospace, sans-serif;
              font-weight: 600;
              color: #c3c3c3;
              transition: color 0.21s ease-in;
            }
          }
          &:hover span:before {
            color: #55A1C8;
            transition: color 0.17s ease-out;
          }
          label {
            position: absolute;
            left: 0;
            top: 0;
            height: 100%;
            width: 100%;
            cursor: pointer;
          }
        }
        .arrow-left {
          left: -20px;
          span {
           
            &:before {
              content: '<';
            }
          }
        }
        .arrow-right {
          right: -20px;
          span {
            
            &:before {
              content: '>';
            }
          }
        }
      }
      
      input[name="testimonial"]:nth-child(1):checked ~ .testimonials-arrows .arrow-left label[for="input-testimonial4"],
      input[name="testimonial"]:nth-child(1):checked ~ .testimonials-arrows .arrow-right label[for="input-testimonial2"],
      input[name="testimonial"]:nth-child(2):checked ~ .testimonials-arrows .arrow-left label[for="input-testimonial1"],
      input[name="testimonial"]:nth-child(2):checked ~ .testimonials-arrows .arrow-right label[for="input-testimonial3"],
      input[name="testimonial"]:nth-child(3):checked ~ .testimonials-arrows .arrow-left label[for="input-testimonial2"],
      input[name="testimonial"]:nth-child(3):checked ~ .testimonials-arrows .arrow-right label[for="input-testimonial4"],
      input[name="testimonial"]:nth-child(4):checked ~ .testimonials-arrows .arrow-left label[for="input-testimonial3"],
      input[name="testimonial"]:nth-child(4):checked ~ .testimonials-arrows .arrow-right label[for="input-testimonial1"] {
        z-index: 1;
      }
      




      /* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
    /* Styles */
    .testimonial {
        padding: 20px 34px 20px 34px !important;
        margin: 0 30px;
        pointer-events: none;
        position: relative;
        z-index: 1;
      }
      .testimonial-text {
        color: #000000;
        font-size: 18px !important;
        text-align: center;
        letter-spacing: 0.12px;
        font-style: normal;
        line-height: 26px;
      }
    }

    

    /* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
    /* Styles */
    .testimonial {
        padding: 0px 34px 20px 34px;
        margin: 0 30px;
        pointer-events: none;
        position: relative;
        z-index: 1;
      }
      .testimonial-text {
        color: #000000;
        font-size: 16px;
        text-align: center;
        letter-spacing: 0.12px;
        font-style: normal;
        line-height: 26px;
      }
    }


    /* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    /* Styles */
    .testimonialtext2 {
        font-size: 28px;
        color: black;
        padding: 1% 24%;
        line-height: 32px;
      }
      .testimonialtext1 {
        color: #55A1C8;
        font-size: 14px;
        text-transform: uppercase;
      }
      .testimonials {
        width: 100%;
        max-width: 100%;
        margin: 20px;
        position: relative;
        opacity: 0;
        animation: showTestimonials 0.32s 0.78s cubic-bezier(0.55, 0.055, 0.675, 0.19) forwards;
      }
      .testimonial-text {
        color: #000000;
        font-size: 16px;
        text-align: center;
        letter-spacing: 0.12px;
        font-style: normal;
        line-height: 26px;
      }
      .testimonial {
        padding: 0px 34px 20px 34px;
        margin: 0 30px;
        pointer-events: none;
        position: relative;
        z-index: 1;
      }
      .testimonialbg {
          background-size: auto;
        background-size: cover;
        height: 50vh;
        text-align: center;
        padding: 8% 0 8% 0;
        font-family: inter;
        margin: 1% 0 0 0;
      }
    }



    /* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    /* Styles */
    .testimonialtext2 {
        font-size: 28px;
        color: black;
        padding: 0.5% 4%;
        line-height: 34px;
      }
      .testimonialtext1 {
        color: #55A1C8;
        font-family: inter;
        font-size: 14px;
        text-transform: uppercase;
      }
      .testimonials {
        width: 100%;
        max-width: 100%;
        margin: 15px;
        position: relative;
        opacity: 0;
        animation: showTestimonials 0.32s 0.78s cubic-bezier(0.55, 0.055, 0.675, 0.19) forwards;
      }
      .testimonials-arrows {
        .arrow {
          span {
            display: flex;
            align-items: center;
            justify-content: center;
            background-color: #ffffff;
            border-radius: 50%;
            height: 30px;
            width: 30px;
            
          }
        }
      }
      .testimonial {
        padding: 0px 0px 20px 0px;
        margin: 0 30px;
        pointer-events: none;
        position: relative;
        z-index: 1;
      }
      .testimonial-text {
        color: #000000;
        font-size: 15px;
        text-align: center;
        letter-spacing: 0.12px;
        font-style: normal;
        line-height: 26px;
        font-family: inter;
      }
      .testimonials-bullets {
        .bullet {
          div {
            display: flex;
            align-items: center;
            justify-content: center;
            height: 15px;
            width: 14px;
            border-radius: 50%;
            background-color: #ffffff;
            box-shadow: 0 4px 6px -7px #000000;
          }
        }
      }
      input[name="testimonial"]:nth-child(1):checked ~ .testimonials-bullets label:nth-child(1) span, input[name="testimonial"]:nth-child(2):checked ~ .testimonials-bullets label:nth-child(2) span, input[name="testimonial"]:nth-child(3):checked ~ .testimonials-bullets label:nth-child(3) span, input[name="testimonial"]:nth-child(4):checked ~ .testimonials-bullets label:nth-child(4) span {
        background-color: #55A1C8;
        transform: scale(0.7);
        transition: transform 0.36s cubic-bezier(0.26, -0.59, 0.43, 2.48), background-color 0.41s ease-in;
      }
      .testimonials-bullets {
        .bullet {
          div {
            span {
              background-color: #0e2c3536;
              height: 14px;
              width: 14px;
              border-radius: 50%;
              transform: scale(0.7);
              transition: 0.72s;
            }
          }
        }
      }
      .testimonials-bullets {
        .bullet {
          height: 20px;
          width: 20px;
          cursor: pointer;
          margin: 0 1px;
        }
      }
      .testimonialbg {
        background-size: auto;
        background-size: cover;
        height: 75vh;
        text-align: center;
        padding: 15% 0 0 0;
        font-family: inter;
        margin: 5% 0 0 0;
      }
      .testimonials-arrows {
        .arrow {
          span {
            &::before {
              font-size: 25px;
              font-family: monospace, sans-serif;
              font-weight: 600;
              color: #c3c3c3;
              transition: color 0.21s ease-in;
            }
          }
        }
      }
    }




    .sectioneightright01{
        padding: 6% 0% 0% 6% ;
    }


   /* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
    /* Styles */
    .sectioneightright01{
        padding: 6% 0% 0% 6% !important;
    }
    }

    
    /* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
    /* Styles */
    .sectioneightright01{
        padding: 3% 0% 0% 6% ;
    }
    }


    /* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    /* Styles */
    .sectioneightright01 {
        padding: 0% 0% 0% 3%;
        width: 50%;
      }
    }


    /* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    /* Styles */
    .sectioneightright01 {
        padding: 8% 0% 0% 0%;
        text-align: center;
      }
    }



    .sectionnine{
        text-align: center;
        padding: 8% 13% 8% 13%;
    }
    .sectionbuttonnine {
        background-color: #55A1C8;
        font-size: 14px;
        font-weight: 500;
        color: white;
        border: 0px;
        font-family: inter;
        padding: 1.5% 4.5%;
        text-decoration: none;
        text-transform: uppercase;
      }
      .sectionbuttonnine:hover {
        background-color: #2A749A;
      }
      .sectionnineleft2 {
        color: black;
        font-size: 14px;
        font-family: inter;
        margin: -0.5% 0 3% 0;
      }



      /* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
    /* Styles */
    }

    /* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
    /* Styles */
    }


    /* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    /* Styles */
    .sectionnine{
        text-align: center;
        padding: 4% 0 10% 0;
    }
    }


    /* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    /* Styles */
    .sectionnine{
        text-align: center;
        padding: 10% 0 20% 0;
    }
    .sectionbuttonnine {
        background-color: #55A1C8;
        font-size: 14px;
        font-weight: 500;
        color: white;
        border: 0px;
        font-family: inter;
        padding: 4% 5%;
        text-decoration: none;
        text-transform: uppercase;
      }
      .sectionbuttonnine:hover {
        background-color: #2A749A;
      }
      .sectionnineleft2 {
        color: black;
        font-size: 14px;
        font-family: inter;
        margin: -0.5% 0 8% 0;
      }
    }




    .footerbg{
        background-color: #2A749A;
        padding: 5% 0;
    }

    .footerlogo{
        width: 50%;
    }
    .footersection01 {
        color: #ffffff;
        font-size: 14px;
        font-family: inter;
        padding: 4% 0 0 0;
      }
      .footersection01icon{
        padding: 0;
        width: 10%;
      }
     .footersectiontwo{
        color: white;
     }
     .footersectiontwo1 {
        font-family: DM serif text;
        font-size: 24px;
        padding: 5% 0 8% 0;
      }
     .footersectiontwo2{
        font-family: inter;
        color: white;
        text-decoration: none;
        font-size: 14px;
        padding: 0;
        margin: 0;
     }
     .footersectionthree1{
        font-family: DM serif text;
        font-size: 24px;
        padding: 4% 0 8% 0;
      }
      .footersectiontwotext2{
        padding: 4% 0 0 6%;
      }
      .footersectionfourtext2{
        padding: 2% 0 0 4%;
      }
      .footersectionthreetext1{
        font-family: inter;
        color: white;
        text-decoration: none;
        font-size: 14px;
        padding: 0;
        margin: -3% 0 0 0;
      }
      .footersectionthreetext2{
        font-family: inter;
        color: white;
        text-decoration: none;
        font-size: 14px;
        padding: 4% 0 0 0;
        margin: 0;
      }
      .footersectionthreeicon1{
        margin: -3.2% 0 0 0;
      }
      .footersectionthreeicon2{
        margin: 2% 0 0 0;
      }
      .footersectionthreeicon3{
        margin: 2.4% 0 0 0;
      }
      .footersectionfour1{
        font-family: DM serif text;
        font-size: 24px;
        padding: 4% 0 5% 0;
      }


    .lastfooter{
        background-color: #55A1C8;
        text-align: center;
        font-family: inter;
    }
    .lastfooter1 {
        color: white;
        font-size: 13px;
        padding: 1% 0%;
        margin: 0 0 0 0;
      }




      /* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    /* Styles */
    .footerlogo {
        width: 30%;
      }
      .footersection01 {
        color: #ffffff;
        font-size: 14px;
        font-family: inter;
        padding: 2% 0 0 0;
      }
      .footersection01icon {
        padding: 0 0% 0 0px;
        width: 6%;
      }
      .footersectiontwo1 {
        font-family: DM serif text;
        font-size: 22px;
        padding: 5% 0 8% 0;
      }
      .footersectionthree1 {
        font-family: DM serif text;
        font-size: 22px;
        padding: 6% 0 8% 0;
      }
      .footersectionfour1 {
        font-family: DM serif text;
        font-size: 22px;
        padding: 6% 0 5% 0;
      }
      .footersectiontwo {
        color: white;
        padding: 4% 0 0 0;
      }
      .footersectiontwotext2 {
        padding: 4% 0 0 5%;
      }
      .footersectionthreetext2 {
        font-family: inter;
        color: white;
        text-decoration: none;
        font-size: 14px;
        padding: 7% 0 0 0;
        margin: 0;
      }
      .footersectionthreeicon2 {
        margin: 4% 0 0 0;
      }
      .footersectionthreeicon3 {
        margin: 3.6% 0 0 0;
      }
    }



    /* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    /* Styles */
    .footerbg {
        background-color: #2A749A;
        padding: 12% 0;
      }
      .footersectiontwo {
        color: white;
        padding: 0;
      }
      .footersectiontwo1 {
        font-family: DM serif text;
        font-size: 24px;
        padding: 12% 0 4% 0;
      }
      .footersectiontwotext2 {
        padding: 4% 0 0 3%;
      }
      .footersectionthree1 {
        font-family: DM serif text;
        font-size: 24px;
        padding: 12% 0 6% 0;
      }
      .footersectionfour1 {
        font-family: DM serif text;
        font-size: 24px;
        padding: 12% 0px 4% 0;
      }
      .lastfooter1 {
        color: white;
        font-size: 12px;
        padding: 2% 0%;
        margin: 0 0 0 0;
      }
      .footerlogo {
        width: 60%;
      }
    }



.innerbannerbg {
    background: url("../Images/innerbanner.jpg") no-repeat center;
    background-size: cover;
    text-align: center;
    padding: 6% 0 7% 0;
    font-family: inter;
    color: white;
}

.sectiontwoinner{
	padding: 0 0 8% 0;
}

.lawyersbg{
	    background-color: #55a1c82e;
    padding: 3% 3%;
    border: 1px solid #55a1c8;
}
.lawyersbgfirst{
	margin: 5% 5%;
}
.lawyerrighttext{
	padding: 0 4%;
}
.lawyerrighttex1{
	color: black;
    font-family: DM serif text;
    font-size: 30px;
    line-height: 45px;
    padding: 0 0 0% 0;
}
.linelawyer{
	margin: 3% 0 3% 0;
}



/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
/* Styles */
	.innerbannerbg {
    background-size: cover;
    text-align: center;
    padding: 6% 0 7% 0;
    font-family: inter;
    color: white;
}
	.lawyersbg{
	    background-color: #55a1c82e;
    padding: 4% 3%;
    border: 1px solid #55a1c8;
}
.lawyersbgfirst{
	margin: 5% 5%;
}
.lawyerrighttext{
	padding: 0 4%;
}
.lawyerrighttex1{
	color: black;
    font-family: DM serif text;
    font-size: 26px;
    line-height: 45px;
    padding: 0 0 0% 0;
}
.linelawyer{
	margin: 3% 0 3% 0;
}
}

/* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
/* Styles */
	.innerbannerbg {
    background-size: cover;
    text-align: center;
    padding: 6% 0 7% 0;
    font-family: inter;
    color: white;
}
	.lawyersbg{
	    background-color: #55a1c82e;
    padding: 3% 3%;
    border: 1px solid #55a1c8;
}
.lawyersbgfirst{
	margin: 5% 5%;
}
.lawyerrighttext{
	padding: 0 4%;
}
.lawyerrighttex1{
	color: black;
    font-family: DM serif text;
    font-size: 30px;
    line-height: 45px;
    padding: 0 0 0% 0;
}
.linelawyer{
	margin: 3% 0 3% 0;
}

}








/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
/* Styles */
	.innerbannerbg {
    background-size: cover;
    text-align: center;
    padding: 6% 0 7% 0;
    font-family: inter;
    color: white;
}
		.innerbannerbg {
    background-size: cover;
    text-align: center;
    padding: 6% 0 7% 0;
    font-family: inter;
    color: white;
}
	.lawyersbg{
	    background-color: #55a1c82e;
    padding: 4% 3%;
    border: 1px solid #55a1c8;
}
.lawyersbgfirst{
	margin: 5% 5%;
}
.lawyerrighttext{
	padding: 5% 4%;
    text-align: center;
}
.lawyerrighttex1{
	color: black;
    font-family: DM serif text;
    font-size: 26px;
    line-height: 45px;
    padding: 0 0 0% 0;
}
.linelawyer{
	margin: 0% 0 7% 0;
}
}

    /* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
/* Styles */
	.innerbannerbg {
    background-size: cover;
    text-align: center;
    padding: 10% 0 11% 0;
    font-family: inter;
    color: white;
}
		.lawyersbg{
	    background-color: #55a1c82e;
    padding: 8% 3%;
    border: 1px solid #55a1c8;
}
.lawyersbgfirst{
	margin: 5% 5%;
}
.lawyerrighttext{
	padding: 5% 4%;
    text-align: center;
}
.lawyerrighttex1{
	color: black;
    font-family: DM serif text;
    font-size: 22px;
    line-height: 45px;
    padding: 0 0 0% 0;
}
.linelawyer{
	margin: 0% 0 7% 0;
}
}

.aboutpage1{
	padding: 8% 0 5% 0;
}
.aboutpageparh{
	padding: 0 5% !important;
}

.map-container{
  position:relative;
  
}
.map-container iframe{
  left:0;
  top:0;
  height:100%;
  width:100%;
  position:absolute;
}
.contactbox1 {
    background-color: #55a1c840;
    font-family: inter;
    text-align: center;
    border: 1px solid #55A1C8;
	margin: 5% 0% 5% 0%;
	padding: 5% 0;
}
.contactbox1 a{
    text-decoration: none;
	color: #000000;
}
.phonebox1{
	font-size: 28px;
	font-family: DM serif text;
}
.phonebox2{
	font-size: 16px;
	margin: 2% 0 0 0;
}
.phonebox3{
	font-size: 16px;
	margin: 1% 0 0 0;
}
.formbox1{
	padding: 0% 0 6% 0;
	font-family: inter;
}
.hours{
	padding: 4% 4%;
	background-color: #55A1C8;
	color: white;
}
.formbox2{
	padding: 0% 6% 0 1%;
}
.formboxtitle{
 font-family: DM serif text;
	color: black;
	font-size: 38px;
	padding: 0 0 2% 0;
}
.forminput1 {
    font-size: 14px;
    border-radius: 0;
    height: 45px;
}
.forminput2 {
    font-size: 14px;
    border-radius: 0;
}
.formsubcontact{
	    background-color: #55A1C8;
    font-size: 16px;
    font-weight: 500;
    color: white;
    border: 0px;
    font-family: inter;
    padding: 1.5% 6%;
    text-decoration: none;
	border-radius: 0
}
 .formsubcontact:hover{
    background-color: #2A749A;
   
  }
.timebox1{
	padding: 8% 0 0 0;
}
.timebox2{
	padding: 0 0 0 0;
}
.timebox3{
	padding: 0 0 0 0;
	    font-weight: 600;
}


/* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
/* Styles */
	
.map-container{
  position:relative;
  
}
.map-container iframe{
  left:0;
  top:0;
  height:100%;
  width:100%;
  position:absolute;
}
.contactbox1 {
    background-color: #55a1c840;
    font-family: inter;
    text-align: center;
    border: 1px solid #55A1C8;
	margin: 5% 0% 5% 0%;
	padding: 5% 0;
}
.contactbox1 a{
    text-decoration: none;
	color: #000000;
}
.phonebox1{
	font-size: 28px;
	font-family: DM serif text;
}
.phonebox2{
	font-size: 16px;
	margin: 2% 0 0 0;
}
.phonebox3{
	font-size: 16px;
	margin: 1% 0 0 0;
}
.formbox1{
	padding: 0% 0 6% 0;
	font-family: inter;
}
.hours{
	padding: 4% 4%;
	background-color: #55A1C8;
	color: white;
}
.formbox2{
	padding: 0% 6% 0 1%;
}
.formboxtitle{
 font-family: DM serif text;
	color: black;
	font-size: 38px;
	padding: 0 0 2% 0;
}
.forminput1 {
    font-size: 14px;
    border-radius: 0;
    height: 45px;
}
.forminput2 {
    font-size: 14px;
    border-radius: 0;
}
.formsubcontact{
	    background-color: #55A1C8;
    font-size: 16px;
    font-weight: 500;
    color: white;
    border: 0px;
    font-family: inter;
    padding: 1.5% 6%;
    text-decoration: none;
	border-radius: 0
}
 .formsubcontact:hover{
    background-color: #2A749A;
   
  }
.timebox1{
	padding: 8% 0 0 0;
}
.timebox2{
	padding: 0 0 0 0;
}
.timebox3{
	padding: 0 0 0 0;
	    font-weight: 600;
}

}

/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
/* Styles */
}

    /* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
/* Styles */
	.contactbox1 {
    background-color: #55a1c840;
    font-family: inter;
    text-align: center;
    border: 1px solid #55A1C8;
    margin: 5% 0% 0% 0%;
    padding: 11% 0;
    width: 100%;
}
	.formbox2 {
    padding: 12% 6% 16% 6%;
    width: 100%;
}
	.formboxtitle {
    font-family: DM serif text;
    color: black;
    font-size: 34px;
    padding: 0 0 4% 0;
    text-align: center;
}
	.formsubcontact {
    background-color: #55A1C8;
    font-size: 16px;
    font-weight: 500;
    color: white;
    border: 0px;
    font-family: inter;
    padding: 3% 12%;
    text-decoration: none;
    border-radius: 0;
}
	.hours {
    padding: 12% 8%;
    background-color: #55A1C8;
    color: white;
    width: 100%;
		text-align: center;
}
	.flex-caption {
    position: relative;
    background: #fff;
    color: #333;
    max-width: 100% !important;
    display: table;
    padding: 0px 0 14% 0 !important;
    border-radius: 4px;
    float: left;
    text-align: center;
}
	.flexslider .slides img {
  
    padding: 0 1% 0 1% !important;
}
}



.flex-caption {
  position: relative;
  background: #fff;
  color: #333;
  max-width: 48%;
  display: table;
  padding: 0px;
  border-radius: 4px;
	float: left;
}

.flex-caption p {
  color: black;
}

li.css a {
      border-radius: 0;
}

.flex-viewport {
  max-height: 450px;
  
}

section.slider {
  
  margin: 5% auto;
	        border: 1px solid #55A1C8;
}
.flexslider {
    box-shadow: none !important;
}

.flexslider .slides img {
  height: auto;
  max-width: 490px;
  border-radius: 4px 4px 4px 4px;
  float: right;
	padding: 0 1% 0 0px;
}

.flexslider {
  border: 0px solid #ffffff;
  box-shadow: 0 1px 30px rgba(0,0,0,.4);
  transition: 400ms ease;
	padding: 4% 5% !important;
	margin: 0 0 0px 0 !important;
}

span.date {
  font-size: 11px;
}

.flex-control-nav {
  bottom: 5px;
}

.flex-control-paging li a {
  width: 8px;
  height: 8px;
  background: rgba(255, 255, 255, 0.5);
}

.flex-control-paging li a:hover {
  background: #4183D7;
}

.flex-control-paging li a.flex-active {
  background: #4183D7;
}

.flex-control-nav {
  text-align: left;
  margin-left: 20px;
}

.flexslider .slides > li {
  position: relative;
}

.card-outmore {
  padding: 10px 30px 10px 30px;
  border-radius: 0px 0px 4px 0px;
  border-top: 1px solid #e0e0e0;
  background: #efefef;
  color: #222;
  display: inline-table;
  width: 100%;
  max-width: 310px;
  transition: 400ms ease;
  position: relative;
  bottom: 0;
  right: 0;
  box-sizing: border-box;
}
.card-outmore h5 {
  float: left;
  margin: 0px;
}
.card-outmore i {
  float: right;
}
#outmore-icon {
  border:1px solid ;
  padding: 1px 6px;
  border-radius: 50em;
}

.flex-direction-nav a:before {
  font-family: "FontAwesome";
  font-size: 38px;
  display: inline-block;
  content: '\f104';
  color: #fff;
}

.flex-direction-nav a.flex-next:before {
  content: '\f105';
  color: #333;
}

a:hover .card-outmore {
  background: #2C3E50;
  color: #fff;
}

a:hover .flexslider {
  box-shadow: 0 10px 50px rgba(0,0,0,.6);
}
.catslider{
	float: right;
	width: 50%;
}
.flex-direction-nav a:before {
   
    font-size: 30px !important;
  
}


.flex-direction-nav a:before {
    font-family: flexslider-icon;
    font-size: 40px;
    display: inline-block;
    content: '\f001';
    color: #2A749A !important;
    text-shadow: 1px 1px 0 rgba(255, 255, 255, .3);
}
.sli1{
	padding: 6% 0 0 0;
}

















