/* General */

body {
    font-family: "Oswald", sans-serif !important;
}

h2 {
    scroll-margin-top: 55px;
}

/* Footer */

footer {
    font-size: 1em;
    font-weight: 750 !important;
    background: url("images/banners/3444435.jpg");
}

.footer-link {
    text-decoration: none;
    color: #000;
    text-transform: uppercase;
    font-weight: 300;
}

.rights-footer {
    background: #94c6ff !important;
    color: #212529;
}

.list-margin-10 {
    margin: 10px 0;
}

.list-margin-20 {
    margin: 20px 0;
}

/* Tweak bootstrap carousel styling and custom styling for carousel children */

.carousel {
   width: 100%;
   max-height: 65vh;
 }

.carousel-caption > a {
    text-transform: uppercase !important;
    font-family: "Oswald", sans-serif !important;
    font-weight: 600 !important;
    font-size: 1.2rem;
}

 .carousel-item > img {
    object-fit: cover;
    height: 65vh;
 }

 .carousel-caption {
    position: absolute;
    left: 0 !important;
    width: 100%;
    padding: 2rem !important;
    background: #000000b6;
    font-family: "Barlow";
    font-size: 1.2rem;
 }

  .carousel-caption > h5 {
    font-weight: 700 !important;
    font-size: 1.5rem;
  }

 .carousel-button-holder {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #000000e7;
    border-radius: 50%;
    padding: .8rem;
 }

/* Tweak bootstrap button styling */

.btn-primary {
    background: #1367c8 !important;
    border: none !important;
    color: #fff !important;
    transition: 0.4s;
}

.btn-primary:hover {
    background: #115eb7 !important;
    transition: 0.2s;
}

/* Page backgrounds */

.service-background {
    background: black;
    background: url("../assets/images/dec-jan-images/all-repair-headings.webp") center center no-repeat;
    background: -webkit-linear-gradient(rgba(3, 8, 48, 0.892), rgba(54, 76, 95, 0.81)), url("../assets/images/provided-photos/coring/coring-4.webp");
    background: linear-gradient(rgba(3, 8, 48, 0.892), rgba(54, 76, 95, 0.81)), url("../assets/images/provided-photos/coring/coring-4.webp"); /* The least supported option. */
    background-size: cover;
    overflow: hidden;
}

.contact-us-background {
    background: black;
    background: url("../assets/images/banners/sussex-landscape.webp") center center no-repeat;
    background: -webkit-linear-gradient(rgba(3, 8, 48, 0.892), rgba(54, 76, 95, 0.81)), url("../assets/images/banners/sussex-landscape.webp");
    background: linear-gradient(rgba(3, 8, 48, 0.892), rgba(54, 76, 95, 0.81)), url("../assets/images/banners/sussex-landscape.webp"); /* The least supported option. */
    background-size: cover;
    overflow: hidden;
}

/* Service box styling (individual services on service page) */

.service-box {
    background: #94c6ff !important;
}

.service-box-right {
    background: #fff !important;
    background: linear-gradient(0deg,#fff 0%, #94c6ff 100%) !important;
}

.CIK-button {
    border-radius: 0% !important;
    padding: 1rem 2rem !important;
    font-family: "Oswald", sans-serif !important;
}

.service-image {
    object-fit: cover;
}

#service-box-text {
    font-size: 1.1em;
}

/* Form Styling */

.form-group {
    padding: 1.2rem 0;
    font-size: 1.2rem;
}

.form-group > input, .form-group > textarea {
    border-radius: 0;
    resize: none;
}

[type="submit"] {
    font-size: 1.2rem !important;
} 

/* Utility classes */

.black-text {
    color: #000;
}

.blue {
    background: #94c6ff;
}

.blue-gradient {
    background: #99e7ff;
    background: linear-gradient(90deg,rgba(153, 231, 255, 1) 0%, rgba(114, 149, 247, 1) 100%);
}

.white {
    background: #fff !important;
}

.no-border-top {
    border: none !important;
}

.small-image {
    max-width: 30vw;
    max-height: 70vh;
    object-fit: contain;
    border: 4px #fff solid;
    border-radius: 3%;
}

.inherit-color {
  color: inherit !important;
}

.oswald-font {
    font-family: "Oswald", sans-serif !important;
}

.left-and-right {
    flex-grow: 1;
    flex-basis: 0;
}

.white-title-background, .white-title-background-non-responsive {
    background: #fff;
    padding: 1rem 3rem;
    margin: 4rem 0rem;
}

.no-border-radius {
    border-radius: 0% !important;
}

/* Dropdown styling */

 .dropdown-menu {
    border: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    margin-left: 3rem !important;
 }

 .dropdown-menu > li > a {
    padding: 0.8rem 0.75rem ;
 }

.dropdown-item.active {
    background-color: #94c6ff !important;
    color: #000 !important;
}

.dropdown-item.active:hover{
    background-color: #0000001f !important;
    transition: 0.4s !important;
}

.dropdown-item:active {
    background-color: #0000001f !important;
    color: #000 !important;
}

/* Tweak toastify styling */

.toastify {
    font-size: 1.3em;
    padding: 1em !important;
}

/* Header and Navbar styling */

#navbar {
    background: #94c6ff !important;
}

#navbar, footer {
    color: #000000 !important;
    font-family: "Oswald", sans-serif;
    font-size: 0.9em;
    font-weight: 600 !important;
}

#nav-header {
    background: #94c6ff !important;
}

#site-title {
    display: inline-flex;
    align-self: center;
    width: auto !important;
    font-family: "Barlow", "Oswald", "Roboto", sans-serif !important;
    font-weight: 900 !important;
    font-size: 5vw;
    line-height: 1;
    padding-top: 0;
    padding-bottom: 0;
    margin: 1em 0;
    text-decoration-line: underline;
    text-decoration-thickness: .2em;
    text-underline-offset: .05em;
    -webkit-text-decoration-thickness: .2em;
    text-underline-position: under;
    -webkit-text-underline-position: under;
}

.mono-border {
    padding: 6px 0;
    border: solid black 3px;
    text-decoration: none;
    color: black;
    transition: 0.4s;
}

.mono-border:hover {
    color: #fff !important;
    background-color: #000 !important;
}

/* Top 'border' added above site title via pseudo-element */
#site-title::before {
  content: "";
  display: block;
  height: .2em;
  background: #000;
  width: 100%;
  margin-bottom: .1em;
}

/* Contact box */

.contact-us-box {
    background: #94c6ff !important;
    font-size: 1.15em;
}

.contact-ul {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.contact-ul > li {
    display: flex;
    align-items: center;
    justify-content: center;
}

.contact-ul-spacing > li {
    margin: 1em;
}

.contact-ul .fa-li {
  position: static;
  width: auto;
  margin-right: 1em;
}

.contact-ul i {
  font-size: 2rem;
  line-height: 1;
}

.contact-ul > li > a {
   border-radius: 0 !important; 
}

#contact-details {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

/* Bootstrap Large Breakpoint (992px) */
@media screen and (min-width:992px) {

    /* Footer */

    footer {
        font-size: 1.15em;
    }

    .footer-hover {
        transition: 1s ease-in-out;
    }

    .footer-hover:hover {
        background-color: rgba(0, 0, 0, 0);
        padding-left: 20px;
    }

    /* Navbar */

    #navbar {
        box-shadow: 0px 2px 11px 0px #000000;
    }
    
    #nav-header {
        background-color: #FFFFFF !important;
    }

    #white-header {
        display: none;
    }

    #site-title {
        font-size: 45px;
        margin: 0.7em 0;
    }

    .nav-link {
        background-color: #00000000;
        transition: 0.4s;
    }

    .nav-link:hover {
        background-color: #0000001f;
        transition: 0.4s;
    }

    .active {
        display: inline-block;
        position: relative;
    }

    /* Dropdown menu */

    .dropdown-menu {
        background: #94c6ff !important;
        top: 3.33rem !important;
        box-shadow: 0 0 10px black !important;
        clip-path: inset(0px -10px -10px -10px) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        display: block !important;
        transition: 0.5s;
        margin-left: 0 !important;
    }

    .dropdown-menu > li > a:hover {
        background-color: #0000001f;
        transition: 0.4s;
    }

    .dropdown:hover > .dropdown-menu {
        visibility: visible !important;
        opacity: 1 !important;
        transition: 0.5s;
    }
}

/* Media query - laptops and larger (1028px) */
@media screen and (min-width:1200px) {

    .white-title-background {
        background-color: inherit;
        padding: 1rem 0rem;
        margin: 2rem 0rem;
    }
}

