﻿.thumb-wrapper {
    display: block;
    width: 100%;
    height: 100%;
}

.thumb .thumb-detail {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    background: #fff;
    font-family: arial;
    font-weight: bold;
    font-size: 16px;
}

.thumb-detail {
    position: absolute;
    top: 0px;
    -moz-box-shadow: 0 0 4px 4px #ABABAB;
    -webkit-box-shadow: 0 0 4px 4px#ABABAB;
    box-shadow: 0 0 4px 4px #ABABAB;
    -moz-border-radius: 2px;
    border-radius: 2px;
    border: 1px solid #9F9F9F;
    width: 170px;
    height: 172px;
}

.thumb .thumb-detail a, #appReminder p {
    display: block;
    width: 100%;
    height: 100%;
    text-transform: uppercase;
    font-weight: bold;
    color: white;
    text-decoration: none;
    font-family: 'Open Sans', sans-serif;
    letter-spacing: -1px;
    margin: 5px;
    font-size: 18px;
}

#appReminder .thumb-detail {
    background-color: rgb(204, 51, 51);
}

/*
	* Without CSS3
	*/
.thumb.scroll {
    overflow: hidden;
}

/*
	* CSS3 Flip
	*/
.thumb.flip {
    -webkit-perspective: 800;
    -moz-perspective: 800;
    -ms-perspective: 800;
    -o-perspective: 800;
    perspective: 800;
}

    .thumb.flip .thumb-wrapper {
        -webkit-transition: -webkit-transform 1s;
        -moz-transition: -moz-transform 1s;
        -ms-transition: -moz-transform 1s;
        -o-transition: -moz-transform 1s;
        transition: -moz-transform 1s;
        -webkit-transform-style: preserve-3d;
        -moz-transform-style: preserve-3d;
        -ms-transform-style: preserve-3d;
        -o-transform-style: preserve-3d;
        transform-style: preserve-3d;
    }

    .thumb.flip .thumb-detail {
        -webkit-transform: rotateY(-180deg);
        -moz-transform: rotateY(-180deg);
        -ms-transform: rotateY(-180deg);
        -o-transform: rotateY(-180deg);
        transform: rotateY(-180deg);
    }

    .thumb.flip img, .thumb.flip div,
    .thumb.flip .thumb-detail {
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    .thumb.flip .flipIt {
        -webkit-transform: rotateY(-180deg);
        -moz-transform: rotateY(-180deg);
        -ms-transform: rotateY(-180deg);
        -o-transform: rotateY(-180deg);
        transform: rotateY(-180deg);
    }
