
body {
    /*background: #ebe8db;*/
    /*background: #92cbe8;*/
    background: #fff;
    color: #513d3e;
}

header {
    /*background-color: #fff;*/
    background-color: #000;
    /*background-color: #57b9ea;*/
}

#cartCount {
    background-color: #c32c2c;
}

.sm-logo {
    position: relative;
    width: 170px;
    top: -10px;
}

.logo-container {
    max-width: 400px;
}

.logo {
    -webkit-filter: grayscale(100%) brightness(0) invert();
}

h1 {
    font-size: 1.5em;
}

h3 {
    font-size: 1em;
}

@media (min-width: 768px) {
    small {
        font-size: 1.4em;
    }
}

.flip-out-container {
    position: relative;
    z-index: 3000;
    margin: auto;
    -webkit-perspective: 1000px;
       -moz-perspective: 1000px;
        -ms-perspective: 1000px;
         -o-perspective: 1000px;
            perspective: 1000px;
}

.portrait {
    max-width: 457px;
    max-height: 640px;
}

.landscape {
    max-width: 640px;
    max-height: 457px;
}

.flip-out-container .flip-out {
    /*border: 1px solid #000;*/
    box-shadow: 2px 2px 10px #555;

    width: 100%;
    height: 100%;
    -webkit-transition: all 0.6s ease-in-out;
       -moz-transition: all 0.6s ease-in-out;
        -ms-transition: all 0.6s ease-in-out;
         -o-transition: all 0.6s ease-in-out;
            transition: all 0.6s ease-in-out;
    -webkit-transform-style: preserve-3d;
       -moz-transform-style: preserve-3d;
        -ms-transform-style: preserve-3d;
         -o-transform-style: preserve-3d;
            transform-style: preserve-3d;
}

.flip-out-container .flip-out .flip-out-front {
    display: block;
    z-index: 3001;
    width: 100%;
    height: 100%;
    /*position: absolute;*/
    -webkit-transform: rotateY( 0deg );
       -moz-transform: rotateY( 0deg );
        -ms-transform: rotateY( 0deg );
         -o-transform: rotateY( 0deg );
            transform: rotateY( 0deg );
    -webkit-backface-visibility: hidden;
       -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
         -o-backface-visibility: hidden;
            backface-visibility: hidden;
}


.flip-out-container .flip-out .flip-out-back {
    /*background-color: red;*/
    display: block;
    z-index: 3000;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    -webkit-backface-visibility: hidden;
       -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
         -o-backface-visibility: hidden;
            backface-visibility: hidden;
    box-sizing: border-box;
    -webkit-transform: rotateY( -180deg );
       -moz-transform: rotateY( -180deg );
        -ms-transform: rotateY( -180deg );
         -o-transform: rotateY( -180deg );
            transform: rotateY( -180deg );
}

.flip-out-container .flipping {
    -webkit-transform: rotateY( -180deg );
       -moz-transform: rotateY( -180deg );
        -ms-transform: rotateY( -180deg );
         -o-transform: rotateY( -180deg );
            transform: rotateY( -180deg );
}

.options {
    margin-top: 20px;
}

.options button {
    margin: 0 15px;
}
