/* Crane Safe Custom CSS */
/* Sizing */
.ptb-25vh {
    padding: 25vh 0;
}
.ptb-15vh {
    padding: 15vh 0 5vh 0;
}
.row>* {
    padding-left: 0;
    padding-right: 0;
}
.vh100 {
    height: 90vh;
}
.soc-bar {
    max-height:50px;
}

/* General */
html {
    scroll-behavior: smooth;
}
body {
    overflow-x: hidden;
    background: #2f342e;
}
#we-do, #get-cert, #contact {
    scroll-margin-top: 100px;;
}
.border-bottom-green {
    border-bottom: 5px solid #54844d;
}
#we-do {
    box-shadow: 0 0 20px #000;
}
.form-control {
    border: none !important;
    border-radius: 0 !important;
    border-bottom: 5px solid #54844d !important;
    font-family: 'Work Sans', sans-serif;
}
.hide {
    display: none;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Oswald', sans-serif;
}
p {
    font-family: 'Work Sans', sans-serif;
}
.hero-title {
    font-size: 45px;
}
.small-hero-title {
    font-size: 35px;
}
.sub-title {
    font-size: 20px;
    text-transform: uppercase;
}
.services p {
    font-size: 18px;
    font-weight: 600;
    color: #666;
}
.services {
    color: #000;
}
a {
    text-decoration: none !important;
    font-weight: 600;
    transition: 0.35s ease;
}
a:hover {
    color: #54844d !important;
    border-bottom: 2px solid #000;
}
.soc-bar a {
    font-size: 30px;
}
.soc-bar p {
    margin-top: -5px;
}
.soc-bar i {
    padding: 15px;
}
.text-small {
    font-size: 14px;
    padding-bottom: 5px;
}

/* Colors */
.bg-darkgrey {
    background-color: #2f342e;
}
.bg-black {
    background-color: #000;
}
.bg-trans-white {
    background-color: rgba(255,255,255,0.5);
}
.bg-dark-trans {
    background-color: rgba(0,0,0,0.5);
}
.bg-green {
    background-color: #54844d;
}
.text-brightgreen {
    color: #68dd56 !important;
}
.text-green {
    color: #54844d;
}
.text-orange {
    color: #f7941d;
}

/* Buttons / Images */
.bg-metal {
    background-image: url('../images/metal-bg.jpg');
    background-blend-mode: multiply;
}
.main-head-bg {
    background-image: url('../images/Main-Head-BG.jpg');
    background-attachment: fixed;
    background-position: center;
    background-blend-mode: multiply;
    animation: zoom-in 60s ease;
}
.vet-owned-bg {
    background-image: url('../images/Vet-Owned-BG.jpg');
    background-attachment: fixed;
    background-position: center;
    background-blend-mode: multiply;
    animation: zoom-in 60s ease;
}
.crane-graphic {
    margin-top: -8px;
    padding-right: 25%;
}
.cont-form-submit {
    font-size: 24px;
    border: none;
    background-color: #54844d;
    color: #000;
    font-weight: 600;
    text-align: center;
    width: 50%;
    padding: 10px 0;
    font-family: 'Oswald', sans-serif;
    transition: 0.35s ease;
}
.cont-form-submit:hover {
    width: 51%;
    background-color: #000;
    color: #fff;
    border-bottom: 5px solid #54844d;
}
.icon {
    object-fit: contain;
    max-width: 48px;
    margin: -8px 0 0 0;
}
.soc-bar a {
    transition: 0.35s ease;
}
.soc-bar a:hover {
    color: #fff !important;
    border: none !important;
}
.soc-bar.cont a:hover {
    color: #54844d !important;
    border:none;
}
.scroll-down:hover {
    border-bottom: none;
    color: #54844d !important;
}

/* Animations */
@keyframes zoom-in {
    0% {
        background-size: 100%;
    }
    100% {
        background-size: 120%;
    }
}
/* Navigation */
.brand {
    max-width: 150px;
}
.nav-link {
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
}

/* Scrollbar */
/* width */
::-webkit-scrollbar {
    width: 10px;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
    background: #2f342e;
  }
  
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: #54844d;
  }
  
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: #555;
  }

/* Mobile Adjustments */
@media screen and (max-width: 1280px) {
    .hero-title {
        font-size: 30px;
    }
    .crane-graphic {
        width: 50%;
    }
    @keyframes zoom-in {
        0% {
            background-size: 250%;
        }
        50% {
            background-size: 252%;
        }
        100% {
            background-size: 255%;
        }
        50% {
            background-size: 252%;
        }
        0% {
            background-size: 250%;
        }
    }
    .ptb-15vh {
        padding: 10vh 0;
    }
}