.jconlist:hover .jftop{
-webkit-animation: moveFromTop 400ms ease;
-moz-animation: moveFromTop 400ms ease;
-ms-animation: moveFromTop 400ms ease;}

.jconlist:hover .jfbottom{
-webkit-animation: moveFromBottom 400ms ease;
-moz-animation: moveFromBottom 400ms ease;
-ms-animation: moveFromBottom 400ms ease;}

*::selection{background:#fdbe13; color:#ffffff;}

.jconlist{
	background:#ffffff;
	padding:5px;
	border:1px solid #d8d8d8;
	-webkit-box-shadow:0 8px 6px -6px rgba(0,0,0,0.2);
	-moz-box-shadow:0 8px 6px -6px rgba(0,0,0,0.2));
	box-shadow:0 8px 6px -6px rgba(0,0,0,0.2);
	overflow:hidden;
	cursor:pointer;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	border-radius:3px;
	margin:9px auto;}
	
.jcbluet{background:#f9f9f9; border-bottom:5px solid #fff; padding:9px;}
.jcblueb{background:#f9f9f9; padding:9px;}
.jconlist:hover .jcbluet{color:#0aa7da;}
.jconlist:hover .jcblueb{background:#0aa7da; color:#ffffff;}

.jcgreent{background:#f9f9f9; border-bottom:5px solid #fff; padding:9px;}
.jcgreenb{background:#f9f9f9; padding:9px;}
.jconlist:hover .jcgreent{color:#43a611;}
.jconlist:hover .jcgreenb{background:#43a611; color:#ffffff;}

.jcoranget{background:#f9f9f9; border-bottom:5px solid #fff; padding:9px;}
.jcorangeb{background:#f9f9f9; padding:9px;}
.jconlist:hover .jcoranget{color:#ff870b;}
.jconlist:hover .jcorangeb{background:#ff870b; color:#ffffff;}

.jcpurplet{background:#f9f9f9; border-bottom:5px solid #fff; padding:9px;}
.jcpurpleb{background:#f9f9f9; padding:9px;}
.jconlist:hover .jcpurplet{color:#6d3baa;}
.jconlist:hover .jcpurpleb{background:#6d3baa; color:#ffffff;}



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

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