.sec-shadow{
    border: 1px solid #fcfcfc;
    border-radius: 6px;
   box-shadow: rgba(0, 0, 0, 0.1) 1px 2px 2px 2px;
   padding: 30px;
}

/*--------------hero section start-----------*/
.cities-page-hero{
    background-color: var(--blue-color);
  clip-path: polygon(0 0, 100% 0%, 100% 88%, 0 100%);
  height: 430px;
  position: relative;
  color: white;
}
.cities-page-hero h1{
    font-size: 51px;
font-family: "DM Serif Display", serif;
font-style: italic;
color: var(--white-color);
font-style: normal;
letter-spacing: 7px;
}
.cities-page-hero h1 span{
    color: var(--sky-blue);
}
.cities-page-hero h5{
    font-family: "DM Serif Display", serif;
font-style: italic;
font-style: normal;
letter-spacing: 2px;
}
/*--------------hero section end-----------*/

/*------all cities hero---------*/
.accounting-hero {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 90%;
  opacity: .9;
  background-image: url(../img/cities/bg.webp);
  background-size: cover;
  z-index: -1;
}
.bookkeeping-hero{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 90%;
  opacity: .3;
  background-size: cover;
  z-index: -1;
  background-image: url(../img/service/bookkeeping-hero.webp);
}
.dental-hero{
    position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 90%;
  opacity: .3;
  background-size: cover;
  z-index: -1;
 background-image: url(../img/service/dental-accoumtants-bg.webp);
}
.restaurant-hero{
    position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 90%;
  opacity: .4;
  background-size: cover;
  z-index: -1;
 background-image: url(../img/service/restaurant.webp);
}
.cities-hero {
  position: relative;
  max-height: 500px;
}

.cities-hero img {
  position: static;
  z-index: 2;
}
.cities-hero form{
  margin-top: 30px;
}
.cities-hero form input{
  padding: 8px 25px;
  margin-bottom: 20px !important;
  border-radius: 10px;
}
.cities-hero button{
  background-color: var(--main-color);
  border: none;
  color: white;
  line-height: 30px;
  border-radius: 20px;
  font-size: 18px;
}
.cities .london{
    background-image: url('../img/cities/london.webp');
    background-size: cover;
    color: white;
    padding: 50px;
}
.cities .birmingham{
    background-image: url('../img/cities/birmingham.webp');
    background-size: cover;
    color: white;
    padding: 50px;
}
.cities .cambridge{
    background-image: url('../img/cities/cambridge.webp');
     background-size: cover;
    color: white;
    padding: 50px;
}
.cities .cardiff{
    background-image: url('../img/cities/cardiff.webp');
    background-size: cover;
    color: white;
    padding: 50px;
}
.cities .coventry{
    background-image: url('../img/cities/coventry.webp');
    background-size: cover;
    color: white;
    padding: 50px;
}
.cities .edinburgh{
    background-image: url('../img/cities/edinburgh.webp');
    background-size: cover;
    color: white;
    padding: 50px;
}
.cities .glasgow{
    background-image: url('../img/cities/glasgow.webp');
    background-size: cover;
    color: white;
    padding: 50px;
}
.cities .hull{
    background-image: url('../img/cities/hull.webp');
    background-size: cover;
    color: white;
    padding: 50px;
}
.cities .liverpool{
    background-image: url('../img/cities/liverpool.webp');
    background-size: cover;
    color: white;
    padding: 50px;
}
.cities .manchester{
    background-image: url('../img/cities/manchester.webp');
    background-size: cover;
    color: white;
    padding: 50px;
}
.cities .newcastle{
    background-image: url('../img/cities/newcastle.webp');
    background-size: cover;
    color: white;
    padding: 50px;
}
.cities .nottingham{
    background-image: url('../img/cities/nottingham.webp');
    background-size: cover;
    color: white;
    padding: 50px;
}
.cities .oxford{
    background-image: url('../img/cities/oxford.webp');
    background-size: cover;
    color: white;
    padding: 50px;
}
.cities .southampton{
    background-image: url('../img/cities/southampton.webp');
    background-size: cover;
    color: white;
    padding: 50px;
}
.cities .york{
    background-image: url('../img/cities/york.webp');
    background-size: cover;
    color: white;
    padding: 50px;
}

.cities .hero .slide-content{
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 20px;
    padding: 50px 70px;
}

.cities .hero .slide-content h2{
    margin-top: 15px;
    font-weight: 500;
}

.cities h1 span, .cities h2 span, .cities h3 span, .cities h4 span, .cities h5 span, .cities h6 span{
    color: var(--main-color);
}
.cities-contact-form{
    background-color: var(--main-color);
    border-radius: 8px;
    color: white;
    box-shadow: 10px 10px var(--sixth-color);
}
.cities-contact-form form .field input,
.cities-contact-form form .message textarea{
  width: 100%;
  outline: none;
  padding: 0 18px 0 48px;
  font-size: 16px;
  border-radius: 5px;
  border: 1px solid #ccc;
}
.cities-contact-form .field input:focus,
.cities-contact-form .message textarea:focus{
  padding-left: 47px;
  border: 2px solid #0D6EFD;
}
.cities-contact-form .field input:focus ~ i,
.cities-contact-form .message textarea:focus ~ i{
  color: #0D6EFD;
}

.cities-contact-form button{
    background-color: var(--second-color);
    color: white;
}
.cities-contact-form button:hover{
    background-color: var(--main-color);
}

.top-fold{
    clip-path: polygon(2% 0, 98% 0%, 100% 100%, 0 100%);
}
.bottom-fold{
    clip-path: polygon(0 0, 100% 0, 98% 100%, 2% 100%);
}

/*-----------cities services start--------------*/
.cities-services a{
    color: black;
}
.cities-services .card{
    border: 2px solid var(--sky-blue);
    border-right: none;
    border-bottom: none;
    background-color: white;
    text-align: center;
}
.cities-services .card:hover{
    transition: .4s ease-in;
    background-color: var(--main-color);
    color: white;
}
.cities-services .card:hover h6{
    color: var(--sky-blue);
}
.cities-services .card h6{
    color: var(--main-color);
}
/*-----------cities services end--------------*/

/*.cities .last-sec .cards{*/
/*    background-color: rgba(0, 0, 0, .1);*/
/*    border-radius: 20px;*/
/*    padding: 14px 0px;*/
/*    border: 1px solid var(--fourth-color);*/
/*    border-top: none;*/
/*    border-left: none;*/
/*}*/
/*.cities .last-sec .cards:hover {*/
/*    background-color: var(--fourth-color);*/
/*    border: 1px solid var(--main-color);*/
/*}*/

/*.cities .last-sec h6{*/
/*    color: var(--main-color);*/
/*}*/
.cities .banner p{
    font-size: 17px;
    font-weight: 500;
}
.cities .sec-1 p i{
    margin-right: 10px;
    color: var(--third-color);
}

/*seo-haedings*/
.seo-headings h2{
    font-size: 25px;
}

/*side-nav-menu*/
.side-nav-menu ul{
 background-color: var(--fifth-color);
 width: 350px;
 padding: 0;
 margin-top: 5px;
 border: 1px solid black;
}
.side-nav-menu ul a{
 color: var(--main-color);
}
.side-nav-menu ul li{
 height: 30px;
 background-color: var(--fifth-color);
 border-bottom: 1px dotted var(--second-color);
 padding: 5px 25px;
 font-size: 17px;
 height: 40px;
}

/*industry-we-serve*/
.industry-we-serve i{
  font-size: 45px;
}
.industry-we-serve p{
    font-size: 21px;
}
.industry-we-serve i{
    color: var(--main-color);
}

/*i color*/
.cities li i{
    color:green;
}