@font-face {
	font-family: 'Arapey';
	src: url('../fonts/Arapey/Arapey-Regular.eot');
	src: url('../fonts/Arapey/Arapey-Regular.woff') format('woff'), url('../fonts/Arapey/Arapey-Regular.ttf') format('truetype'), url('../fonts/Arapey/Arapey-Regular.svg') format('svg');
}
@font-face {
	font-family: 'OpenSans-Light';
	src: url('../fonts/OpenSans-Light/OpenSans-Light.eot');
	src: url('../fonts/OpenSans-Light/OpenSans-Light.woff') format('woff'), url('../fonts/OpenSans-Light/OpenSans-Light.ttf') format('truetype'), url('../fonts/OpenSans-Light/OpenSans-Light.svg') format('svg');
}
@font-face {
	font-family: 'OpenSans-Regular';
	src: url('../fonts/OpenSans-Regular/OpenSans-Regular.eot');
	src: url('../fonts/OpenSans-Regular/OpenSans-Regular.woff') format('woff'), url('../fonts/OpenSans-Regular/OpenSans-Regular.ttf') format('truetype'), url('../fonts/OpenSans-Regular/OpenSans-Regular.svg') format('svg');
}
@font-face {
	font-family: 'OpenSans-Semibold';
	src: url('../fonts/OpenSans-Semibold/OpenSans-Semibold.eot');
	src: url('../fonts/OpenSans-Semibold/OpenSans-Semibold.woff') format('woff'), url('../fonts/OpenSans-Semibold/OpenSans-Semibold.ttf') format('truetype'), url('../fonts/OpenSans-Semibold/OpenSans-Semibold.svg') format('svg');
}
@font-face {
	font-family: 'OpenSans-Bold';
	src: url('../fonts/OpenSans-Bold/OpenSans-Bold.eot');
	src: url('../fonts/OpenSans-Bold/OpenSans-Bold.woff') format('woff'), url('../fonts/OpenSans-Bold/OpenSans-Bold.ttf') format('truetype'), url('../fonts/OpenSans-Bold/OpenSans-Bold.svg') format('svg');
}
table{
    border: 0;
    width:  100%;
    padding: 4px;
    border-spacing: 8px;     
    
    }
.t{
    text-align: center;
    height: 150px;
}
.tab1 {
    background-color: #777F6B;
    width:  25%;
    text-align: left;
}
.tab2 {
    background-color: #DFD49E;
    width: 25%;
    text-align: left;
}
.tab3 {
    background-color: #BBB3AE;
    width: 25%;
    text-align: right;
}
.tab4 {
    background-color: #4D5B6A;
    width: 25%;
    text-align: right;
}
.t:hover{
    color: black;
    width:  35%;
    height: 200px;
}
.proof{
    text-align: center;
    height: 150px;
}
.ProofGrey {
    background-color: #6A6A6E;
    width:  25%;
    text-align: right;
}
.ProofWhite {
    background-color: #FCFCFC;
    width: 25%;
    text-align: right;
}
.ProofCharcoal {
    background-color: #494F51;
    width: 25%;
    text-align: right;
}
.ProofBlack {
    background-color: #0E0E0E;
    width: 25%;
    text-align: right;
}
.ProofGreen {
    background-color: #314633;
    width: 25%;
    text-align: right;
}
.ProofTerracotta {
    background-color: #551600;
    width: 25%;
    text-align: right;
}
.proof:hover{
    color: black;
    width:  35%;
    height: 200px;
}
.velvet{
    text-align: center;
    height: 150px;
}
.autumn-mist {
    background-color: #BCDFC7;
    width:  25%;
    text-align: right;
}
.snowly-peach {
    background-color: #FAD675;
    width: 25%;
    text-align: right;
}
.snowly-peach-lt {
    background-color: #FFE7A0;
    width: 25%;
    text-align: right;
}
.pale-parchment-lt {
    background-color: #FFF4A2;
    width: 25%;
    text-align: right;
}
.blush-rose {
    background-color: #FEAE69;
    width: 25%;
    text-align: right;
}
.dawn-glow {
    background-color: #EE6366;
    width: 25%;
    text-align: right;
}
.daystar {
    background-color: #FBE11B;
    width:  25%;
    text-align: right;
}
.knysna-mist {
    background-color: #ECF8E2;
    width: 25%;
    text-align: right;
}
.misty {
    background-color: #FFE9B3;
    width: 25%;
    text-align: right;
}
.rose-dawn {
    background-color: #FCF5BF;
    width: 25%;
    text-align: right;
}
.fay-white {
    background-color: #F5F3A8;
    width: 25%;
    text-align: right;
}
.velvet:hover{
    color: black;
    width:  35%;
    height: 200px;
}
.megaclad{
    text-align: center;
    height: 150px;
}
.green-beige {
    background-color: #CCC58F;
    width:  25%;
    text-align: right;
}
.sand-yellow {
    background-color: #D2B773;
    width: 25%;
    text-align: right;
}
.pearl {
    background-color: #E9E5CE;
    width: 25%;
    text-align: right;
}
.signalrot {
    background-color: #A1232B;
    width: 25%;
    text-align: right;
}
.beigerot {
    background-color: #CB8D73;
    width: 25%;
    text-align: right;
}
.olive-green {
    background-color: #817F68;
    width: 25%;
    text-align: right;
}
.vanilla {
    background-color: #E4D39D;
    width:  25%;
    text-align: right;
}
.wheat {
    background-color: #C0A966;
    width: 25%;
    text-align: right;
}
.golden-maize {
    background-color: #C4A236;
    width: 25%;
    text-align: right;
}
.sand-box {
    background-color: #DACEB8;
    width: 25%;
    text-align: right;
}
.cashmere {
    background-color: #E4CE9E;
    width: 25%;
    text-align: right;
}
.brown-beige {
    background-color: #B38C5E;
    width: 25%;
    text-align: right;
}
.megaclad:hover{
    color: black;
    width:  35%;
    height: 200px;
}