/* responsive */
@media (min-width: 1400px) {
    .container {
        max-width: 1500px;
    }
}
/*
@media (max-width: 576px) {
    .sbf__top__bar {
        height: 2.6875rem;
    }
}*/
@media (max-width: 1550px)
{
    .header__our__services p {
        width: 30rem;
    }
}
@media (min-width: 992px) {
    .navbar-expand-lg {
        overflow: hidden;
    }

    .nav-item.active::after {
        width: calc(100% - 1rem);
    }

    .nav-item--gradient {
        margin-left: 1rem;
    }

    .nav-link--gradient {
        display: block;
    }
    .sbf__navbar .sbf__become_fitter
    {
        display: none;
    }
}

@media (min-width: 992px) and (max-width: 1400px) {
    .header {
        height: 30rem;
    }
}

@media (max-width: 992px)
{
    .sbf__fitter-btn
    {
        display: none;
    }
    .sbf__become_fitter,
    .sbf__become_fitter img
    {
        width:80%;
    }
    .mn
    {
        display: none;
    }
    .header{
        height: 20rem;
    }
    .header__our__services
    {
        height: 15rem;
    }

}
@media (max-width: 575.98px) {
    .news__item {
        width: 100%;
        height: 31.5rem;
    }

    .news {
        height: auto;
        display: block;
    }
    #map{
        margin: 2rem 0rem !important;
    }
}

@media (max-width: 767.98px) {
    .bike-sizer-block {
        display: none;
    }
    .step__up__your__game {
        height: auto;
        padding: 1rem 0;
    }
    .sbf__news__card__img
    {
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        height: 125px;
    }
    .mobile-none{
        display:none !important;
    }

    .gradient__text--blue{
        color: #ffffff;
        text-shadow: 0 0 7px rgba(0, 0, 0, .3);
        background: none;
        -webkit-background-clip: unset;
        -webkit-text-fill-color: white;
    }
    .gradient__text--orange, .gradient__text--purple {
        color: #ffffff;
        text-shadow: 0 0 7px rgba(0, 0, 0, .3);
        background:  none;
        -webkit-background-clip: unset;
        -webkit-text-fill-color: white;
    }
    .gradient__text--green{
        color: #ffffff;
        text-shadow: 0 0 7px rgba(0, 0, 0, .3);
        background:  none;
        -webkit-background-clip: unset;
        -webkit-text-fill-color: white;
    }
    .gradient__text--pink{
        color: #ffffff;
        text-shadow: 0 0 7px rgba(0, 0, 0, .3);
        background:  none;
        -webkit-background-clip: unset;
        -webkit-text-fill-color: white;
    }
    .quick__fit
    {
        min-height: auto;
    }
    .sbf__description
    {
        padding: 0rem;

    }
    .sbf__description p,
    .sbf__description h2{
        padding: 0rem 0.5rem;
    }
    /*.sbf__section*/
    /*{*/
    /*    border: 2px solid #35BDB4;*/
    /*}*/
    .sbf__section h2
    {
        font-size: 1.25rem;
    }
    .sbf__quote
    {
        font-size: 1rem;
        background: linear-gradient(120deg, transparent 8%, #098AB3 8.1%);
    }
    .sbf__usp
    {
        font-size: 1.5rem;
    }
}

@media (max-width: 800px) {
    .our__services__image--right {
        display: none;
    }

    .our__services__image--left {
        display: none;
    }
}

@media screen and (max-width:1024px){
    .play__button{
        width: 2rem;
        height: 2rem;
    }
    .cta__section--cta,
    .play__button i
    {
        font-size: 1rem;
    }
    .title-white
    {
        font-size:  2rem !important;
    }
    body, html {
        font-size: 1rem;
    }
    .header__video{
        margin-top: 1rem;
        height: 20rem;
        margin-bottom: 2rem;
    }

    .header p,
    .header h1{
        width: auto;
    }
    .shoe__cleat__adjustment,
    .dynamic__fit,
    .bike__adjustment{
        background: none;
    }
    .saddle__selection,
    .quick__fit,
    .complete__fit{
        background: #f9f9f9;
    }
    .header__our__services p,
    .saddle__selection p,
    .quick__fit p,
    .complete__fit p{
        width: auto;
    }
    .our__services__images{
        display: none;
    }
    .sbf__footer__logo{
        width: 20rem;
    }
    .sbf__footer h2
    {
        padding-top : 2rem;
        margin-bottom: 1rem;
    }
    .sbf__btn{
        font-size: 1.3rem;
    }
    .bike__adjustment .col-lg-6 p,
    .dynamic__fit .col-lg-6 p,
    .shoe__cleat__adjustment .col-lg-6 p{
        width: auto;
    }
    .sbf__header{
        padding: 0;
    }
}

@media (max-width: 587px) {
    .header .col-lg-6
    {
        margin-top: 0rem !important;
    }

    .home--header--title::before,
    .home--header--title::after
    {
        display: none;
    }
}
@media (min-width: 992px) {
    .step__up__your__game__content h2 {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        margin-right: 28.87875rem;
    }

    .step__up__your_game__get_fitted {
        height: 100%;
        right: 0;
        top: 0;
        width: 14rem;
        position: absolute;
        padding: 0.375rem 2.75rem;
    }

    .step__up__your_game__get_fitted span {
        top: 50%;
        position: absolute;
        -webkit-transform: skew(30deg) translateY(-50%);
        -moz-transform: skew(30deg) translateY(-50%);
        -o-transform: skew(30deg) translateY(-50%);
        transform: skew(30deg) translateY(-50%);
    }
}

@media (min-width: 1200px) {
    .news__item {
        width: 25%;
    }
}
@media (max-width: 1485px)
{
    .bike-icons
    {
        position: relative !important;
        display: block !important;
        margin-top: 1rem;
    }
}
@media (max-width: 1200px)
{
    .sbf__img__absolute
    {
        position: relative;
        display: block;
        width: 100%;
        left: 0;
        top: 0;
    }
    #map{
        height: 800px !important;
    }
}
@media (max-width: 1024px)
{

    p{
        font-size: 1rem !important;
    }
    .sbf__dealer__results .sbf__dealer p,
    .sbf__dealer__results .sbf__dealer li
    {
        font-size: 0.8rem !important;
    }
    .sbf__fitted__table
    {
        table-layout: fixed;
        width: 100%;

    }
    .sbf__fitted__table tr
    {
        display: flex;
        flex-wrap: wrap;

    }
    .sbf__fitted__table td{
        font-size: 1rem !important;
    }
    .sbf__fitted__table .respsonsive-full{
        width: 100vw;
        text-align: center !important;
        border-bottom: 1px solid rgba(191, 191, 191, 0.5);
    }
    .sbf__fitted__table .responsive-half
    {
        width: 50%;
        display: inline-block;
    }
    .sbf__fitted__table .respsonsive-none
    {
        display: none !important;
    }

    .sbf__img__absolute
    {
        position: relative;
        display: block;
        width: 100% !important;
        top: 0;
        left: 0;
    }
    .sbf__img__fitted
    {
        display: none;
    }
    .sbf__img__fitted--mobile
    {
        display: block;
    }
    .sbf__header h1
    {
        font-size: 2.2rem !important;
        text-align: center;
        padding: 5rem 0rem
    }
    .sbf__header
    {
        background-position: center;
    }
    .about__us
    {
        background: linear-gradient(110deg, #0080B2 25%, #35BDB4 55%);
        background-size: cover;
    }
}

@media (max-width: 576px) {

    .top-5
    {
        margin-top: 0rem;
    }
    html, body {
        font-size: 16px;
    }
    .sbf__contact--btn{
        width: 100% !important;
        display: block !important;
    }
    .header {
        text-align: center;
        background: linear-gradient(105.82deg, #0080B2 2.3%, #35BDB4 78.55%) !important;
        min-height: 10rem;
        display: flex;
        vertical-align: center;
        align-items: center;
    }

    .header h1
    {
        font-size: 3.625rem !important;
    }
    .title-black
    {
        font-size: 3rem;
    }
    .dealer__locater__button
    {
        margin: auto;
        font-size: 1.25rem;
    }

    .sbf__news__date
    {
        font-size: 1rem;
    }
    .sbf__post__date
    {
        margin-left: -3rem;
        width: 90% !important;
        font-size: 1rem !important;
    }

    .sbf__mobile__reorder
    {
        flex-direction: column-reverse;
    }
}
.sbf__news__card
{
    box-shadow: 1px 2px 1px rgba(12, 12, 12, 0.2);
}
@media (min-width: 576px) {
    html, body {
        font-size: 12px;
    }
    .cookie__consent__btn {
        margin-bottom: 0;
    }
    .cookie__consent {
        padding: 1rem 3rem;
    }
}
@media (min-width: 769px) {
    html, body {
        font-size: 12px;
    }
}
@media (min-width: 1200px) {
    html, body {
        font-size: 12px;
    }

    .services__block--bike .sbf__service--icon
    {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
    }
}
@media (min-width: 1400px) {
    html, body {
        font-size: 16px;
    }
}
@media (min-width: 1750px) {
    html, body {
        font-size: 16px;
    }
    /*Adjust homepage image*/
}

/** Homepage - title quotes **/
@media screen and (min-width: 1400px) {
    .title__box::before {
        content: url("../images/quote.png");
        display: block;
        width: 30px;
        height: 30px;
        position: absolute;
        margin-top: -0.4rem;
    }

    .title__box::after {
        content: url("../images/quote.png");
        display: block;
        width: 30px;
        height: 30px;
        position: absolute;
        float: right;
        margin-top: -6rem;
        margin-left: 39.5rem;
        transform: scale(-1, -1);
    }
}

@media screen and (min-width: 1217px) and (max-width: 1400px) {
    .header h1 {
        margin-left: 3rem;
    }

    .title__box::before {
        content: url("../images/quote.png");
        display: block;
        width: 30px;
        height: 30px;
        position: absolute;
        margin-top: -0.4rem;
    }

    .title__box::after {
        content: url("../images/quote.png");
        display: block;
        width: 30px;
        height: 30px;
        position: absolute;
        float: right;
        margin-top: -6rem;
        margin-left: 32.5rem;
        transform: scale(-1, -1);
    }
}

@media screen and (min-width: 1200px) and (max-width: 1217px) {
    .header h1 {
        margin-left: 3rem;
    }

    .title__box::before {
        content: url("../images/quote.png");
        display: block;
        width: 30px;
        height: 30px;
        position: absolute;
        margin-top: -0.4rem;
    }

    .title__box::after {
        content: url("../images/quote.png");
        display: block;
        width: 30px;
        height: 30px;
        position: absolute;
        float: right;
        margin-top: -6rem;
        margin-left: 40.5rem;
        transform: scale(-1, -1);
    }

}

@media screen and (min-width: 993px) and (max-width: 1200px) {
    .header h1 {
        margin-left: 3rem;
    }

    .title__box::before {
        content: url("../images/quote.png");
        display: block;
        width: 30px;
        height: 30px;
        position: absolute;
        margin-top: -0.4rem;
    }

    .title__box::after {
        content: url("../images/quote.png");
        display: block;
        width: 30px;
        height: 30px;
        position: absolute;
        float: right;
        margin-top: -6rem;
        margin-left: 21rem;
        transform: scale(-1, -1);
    }
}