@font-face {
    font-family: 'WebSymbolsRegular';
    src: url('websymbols/websymbols-regular-webfont.eot');
    src: url('websymbols/websymbols-regular-webfont.eot?#iefix') format('embedded-opentype'),
        url('websymbols/websymbols-regular-webfont.woff') format('woff'),
        url('websymbols/websymbols-regular-webfont.ttf') format('truetype'),
        url('websymbols/websymbols-regular-webfont.svg#WebSymbolsRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
.ca-menu{
    padding:0;
    width: 100%;
	float:left;
}

.col01{background-color:#07ada9;}
.col02{background-color:#faa167;}
.col03{background-color:#ffd527;}
.col04{background-color:#d1ba77;}
.col05{background-color:#8d589c;}
.col06{background-color:#abacae;}
.col07{background-color:#f1496d;}
.col08{background-color:#e19742;}
.col09{background-color:#18244e;}
.col010{background-color:#4483c8;}
.col011{background-color:#09c1f3;}
.col012{background-color:#a2dde1;}
.col013{background-color:#574d1a;}
.col014{background-color:#ffd06e;}
.col015{background-color:#4abc9a;}
.col016{background-color:#023a4b;}
.col017{background-color:#ec4654;}
.col018{background-color:#85461b;}
.col019{background-color:#c8ac87;}
.col020{background-color:#516937;}
.col021{background-color:#f5702b;}
.col022{background-color:#87bc92;}
.col023{background-color:#efd8ac;}
.col024{background-color:#606467;}
.col025{background-color:#066835;}




.ca-menu li{
    width:18%;
    height: 330px;
	/*margin-right: 13px;*/
	margin:1%;
	padding:1%;
    overflow: hidden;
    position: relative;
    float:left;
	/*background-image:url(../images/bg.jpg); background-position:left top; background-repeat:repeat;*/
    /*background: #fffbdb ;*/ /* Old browsers */
    /*background: -moz-linear-gradient(left, #ae2590 0%, #6c1583 47%, #48298f 100%); *//* FF3.6+ */
    /*background: -webkit-gradient(linear, left top, right top, color-stop(0%,#ae2590), color-stop(47%,#6c1583), color-stop(100%,#ededed));*/ /* Chrome,Safari4+ */
    /*background: -webkit-linear-gradient(left, #ae2590 0%,#6c1583 47%,#48298f 100%);*/ /* Chrome10+,Safari5.1+ */
    /*background: -o-linear-gradient(left, #ffffff 0%,#f6f6f6 47%,#ededed 100%); *//* Opera 11.10+ */
    /*background: -ms-linear-gradient(left, #ffffff 0%,#f6f6f6 47%,#ededed 100%);*/ /* IE10+ */
    /*background: linear-gradient(left, #ffffff 0%,#f6f6f6 47%,#ededed 100%);*/ /* W3C */
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=1 );*/ /* IE6-9 */
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px rgba(1,1,1,1);
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}
.ca-menu li:last-child{
    margin-right: 0px;
}
.ca-menu li a{
    text-align: left;
	float:left;
    width: 100%;
    height: 100%;
    display: block;
    color: #333;
    position: relative;
}
.ca-icon{
    font-family: 'WebSymbolsRegular', cursive;
    font-size: 60px;
    color: #ddd;
    text-shadow: 1px 0px 1px rgba(255,255,255,0.8);
    line-height: 150px;
    position: absolute;
    width: 100%;
    height: 65%;
    left: 0px;
    top: 0px;
    text-align: center;
    -webkit-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
}
.ca-content{
    position: absolute;
    left: 0px;
    width: 100%;
    height: 50%;
    top: 75%;
}
.ca-main{
    font-size: 20px;
	font-weight: bold;
    opacity: 0.8;
    text-align: center;
    -webkit-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
}
.ca-sub{
    text-align:center;
    font-size: 14px;
    color: #000;
    /*text-shadow: 1px 1px 1px #fff;*/
    line-height:20px;
    opacity: 0.8;
    -webkit-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
}
.ca-menu li:hover{
    /*background:#fff;*/
}
.ca-menu li:hover .ca-icon{
    color: #afa379;
    font-size: 90px;
    opacity: 0.7;
    -webkit-animation: moveFromLeft 400ms ease;
    -moz-animation: moveFromLeft 400ms ease;
    -ms-animation: moveFromLeft 400ms ease;
}
.ca-menu li:hover .ca-main{
    color: #38362f;
    -webkit-animation: moveFromRight 300ms ease;
    -moz-animation: moveFromRight 300ms ease;
    -ms-animation: moveFromRight 300ms ease;
}
.ca-menu li:hover .ca-sub{
    color: #38362f;
    -webkit-animation: moveFromBottom 500ms ease;
    -moz-animation: moveFromBottom 500ms ease;
    -ms-animation: moveFromBottom 500ms ease;
}
@-webkit-keyframes moveFromLeft{
    from {
        -webkit-transform: translateX(-100%);
    }
    to {
        -webkit-transform: translateX(0%);
    }
}
@-moz-keyframes moveFromLeft{
    from {
        -moz-transform: translateX(-100%);
    }
    to {
        -moz-transform: translateX(0%);
    }
}
@-ms-keyframes moveFromLeft{
    from {
        -ms-transform: translateX(-100%);
    }
    to {
        -ms-transform: translateX(0%);
    }
}

@-webkit-keyframes moveFromRight {
    from {
        -webkit-transform: translateX(100%);
    }
    to {
        -webkit-transform: translateX(0%);
    }
}
@-moz-keyframes moveFromRight {
    from {
        -moz-transform: translateX(100%);
    }
    to {
        -moz-transform: translateX(0%);
    }
}
@-ms-keyframes moveFromRight {
    from {
        -ms-transform: translateX(100%);
    }
    to {
        -ms-transform: translateX(0%);
    }
}

@-webkit-keyframes moveFromBottom {
    from {
        -webkit-transform: translateY(100%);
    }
    to {
        -webkit-transform: translateY(0%);
    }
}
@-moz-keyframes moveFromBottom {
    from {
        -moz-transform: translateY(100%);
    }
    to {
        -moz-transform: translateY(0%);
    }
}
@-ms-keyframes moveFromBottom {
    from {
        -ms-transform: translateY(100%);
    }
    to {
        -ms-transform: translateY(0%);
    }
}