@import "../../../styles/generic/variables";
@import url('https://fonts.googleapis.com/css?family=Open+Sans');

$open-sans: 'Open Sans';

#sfc-gp-cart {
    .header-background{
        height: 70px;
        border: solid 1px $heading-border;
        background-color: $heading-background;

        .wrapper{
            margin-right: auto;
            margin-left: auto;
            display: flex;

            @media screen and (min-width: 300px) {
                max-width: 268px;
            }
            @media screen and (min-width: 576px) {
                max-width: 558px;
            }
            @media screen and (min-width: 850px) {
                max-width: 832px;
            }
            @media screen and (min-width: 1160px) {
                max-width: 1128px;
            }
        }
        .back-link{
            float: left;
            display: inline-block;
            padding: 23px 0;
            font-family: $open-sans, sans-serif;
            font-size: 14px;
            font-weight: normal;
            font-style: normal;
            font-stretch: normal;
            line-height: 1.29;
            letter-spacing: normal;
            color: $heading-font;
            position: relative;
        }
        .back-link:before{
            content: '\F104';
            font-family: FontAwesome;
            font-size: 32px;
            font-style: normal;
            color: #4d4d4d;
            display: inline-block;
            padding-right: 6px;
            line-height: 24px;

        }
        .show {
            display: block;
        }
        .hidden {
            display: none;
        }
        h3{
            font-family: 'Open Sans', sans-serif;
            font-weight: 600;
            font-style: normal;
            font-stretch: normal;
            line-height: 1.17;
            letter-spacing: normal;
            text-align: center;
            color: $heading-font;
            margin: 0 auto;
            padding: 24px 0;

            @media screen and (min-width: 300px) {
                font-size: 18px;
            }
            @media screen and (min-width: 576px) {
                font-size: 24px;
            }
        }
        .back-text{
            display: inline-block;
            /* margin-bottom: 39px; */
            position: absolute;
            top: 28px;
        }
        .hide-back-button {
            @media screen and (max-width: 575px) {
                display: none;
            }
        }
    }

}