.sidebar-left li, .sidebar-right li {clear:both;}   /* to display the icons one on top of the other */

/* --------------ICON TRANSPARENCY--------- */
ul.si-transparent li {
	opacity: 0.7;
	filter:alpha(opacity=70); /* For IE8 and earlier */
	transition: opacity 0.3s ease-in ;
	-moz-transition: opacity 0.3s ease-in ;
	-webkit-transition: opacity 0.3s ease-in ;
	-o-transition: opacity 0.3s ease-in ;	
	}
ul.si-transparent li:hover {
	opacity: 1;
	filter:alpha(opacity=100); /* For IE8 and earlier */
	}
	
/* =============================== ICON HOVER EFFECTS ======================== */
/* -----------------START OF FLIP-X------------- */	
ul.flip-X li a {
	transition: transform 0.5s ease-in ;
	-moz-transition: -moz-transform 0.5s ease-in ;
	-webkit-transition: -webkit-transform 0.5s ease-in ;
	-o-transition: -o-transform 0.5s ease-in ;	
	}
ul.flip-X li:hover a {
	transform: rotateX(360deg) scale(1.3);
	-moz-transform: rotateX(360deg) scale(1.3);
	-webkit-transform: rotateX(360deg) scale(1.3);
	-o-transform: rotateX(360deg) scale(1.3);	
	}
/* --------------END OF FLIP-X  -------------
-----------------START OF FLIP-Y------------- */	
ul.flip-Y li a {
	transition: transform 0.5s ease-in ;
	-moz-transition: -moz-transform 0.5s ease-in ;
	-webkit-transition: -webkit-transform 0.5s ease-in ;
	-o-transition: -o-transform 0.5s ease-in ;	
	}
ul.flip-Y li:hover a {
	transform: rotateY(360deg) scale(1.3);
	-moz-transform: rotateY(360deg) scale(1.3);
	-webkit-transform: rotateY(360deg) scale(1.3);
	-o-transform: rotateY(360deg) scale(1.3);	
	}	
/* --------------END OF FLIP-Y  -------------
-----------------START OF SPIN-CCW------------- */	
ul.spin-CCW li a {
	transition: transform 0.5s ease-in ;
	-moz-transition: -moz-transform 0.5s ease-in ;
	-webkit-transition: -webkit-transform 0.5s ease-in ;
	-o-transition: -o-transform 0.5s ease-in ;	
	}
ul.spin-CCW li:hover a {
	transform: rotate(-360deg) scale(1.3);
	-moz-transform: rotate(-360deg) scale(1.3);
	-webkit-transform: rotate(-360deg) scale(1.3);
	-o-transform: rotate(-360deg) scale(1.3);
	}
/* --------------END OF SPIN-CCW  -------------
-----------------START OF SPIN-CW------------- */
ul.spin-CW li a {
	transition: transform 0.5s ease-in ;
	-moz-transition: -moz-transform 0.5s ease-in ;
	-webkit-transition: -webkit-transform 0.5s ease-in ;
	-o-transition: -o-transform 0.5s ease-in ;	
	}
ul.spin-CW li:hover a {
	transform: rotate(360deg) scale(1.3);
	-moz-transform: rotate(360deg) scale(1.3);
	-webkit-transform: rotate(360deg) scale(1.3);
	-o-transform: rotate(360deg) scale(1.3);	
	}
/* --------------END OF SPIN-CW  -------------
-----------------START OF FLIP-SPIN------------- */
ul.flip-spin li a {
	transition: transform 0.5s ease-in-out ;
	-moz-transition: -moz-transform 0.5s ease-in-out ;
	-webkit-transition: -webkit-transform 0.5s ease-in-out ;
	-o-transition: -o-transform 0.5s ease-in-out ;
	}
ul.flip-spin li:hover a {
	transform: rotate(360deg) rotateY(360deg) scale(1.3);
	-moz-transform: rotate(360deg) rotateY(360deg) scale(1.3);
	-webkit-transform: rotate(360deg) rotateY(360deg) scale(1.3);
	-o-transform: rotate(360deg) rotateY(360deg) scale(1.3);	
	}
/* --------------END OF FLIP-SPIN  -------------
-----------------START OF ZOOM 80% TO 110%------------- */	
ul.zoom-1 li a {
	transition: transform 0.3s ease-in ;
	-moz-transition: -moz-transform 0.3s ease-in ;
	-webkit-transition: -webkit-transform 0.3s ease-in ;
	-o-transition: -o-transform 0.3s ease-in ;
	transform: scale(0.8);
	-moz-transform: scale(0.8);
	-webkit-transform: scale(0.8);
	-o-transform: scale(0.8);
	}
ul.zoom-1 li:hover a {
	transform: scale(1.1);
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1);	
	}
/* --------------END OF ZOOM 80% TO 110% -------------
-----------------START OF ZOOM 100% TO 130%------------- */	
ul.zoom-2 li a	{
	transition: transform 0.3s ease-in ;
	-moz-transition: -moz-transform 0.3s ease-in ;
	-webkit-transition: -webkit-transform 0.3s ease-in ;
	-o-transition: -o-transform 0.3s ease-in ;
	}
ul.zoom-2 li:hover a {
	transform: scale(1.3);
	-moz-transform: scale(1.3);
	-webkit-transform: scale(1.3);
	-o-transform: scale(1.3);	
	}
/* --------------END OF ZOOM 100% TO 120% -------------
-----------------START OF TILTED LEFT------------- */
ul.tilted_1 li a {
	transition: transform 0.5s ease-in ;
	-moz-transition: -moz-transform 0.5s ease-in ;
	-webkit-transition: -webkit-transform 0.5s ease-in ;
	-o-transition: -o-transform 0.5s ease-in ;
	position: relative;
	z-index: 98;
	transform: rotate(-10deg) scale(0.8);
	-moz-transform: rotate(-10deg) scale(0.8);
	-webkit-transform: rotate(-10deg) scale(0.8);
	-o-transform: rotate(-10deg) scale(0.8);
	}
ul.tilted_1 li:hover a {
	z-index: 100;
	transform: rotate(7deg) scale(1.2);
	-moz-tran-righsform: rotate(7deg) scale(1.2);
	-webkit-transform: rotate(7deg) scale(1.2);
	-o-transform: rotate(7deg) scale(1.2);	
	}
/* --------------END OF TILTED LEFT-------------
-----------------START OF TILTED RIGHT------------- */
ul.tilted_2 li a {
	transition: transform 0.5s ease-in ;
	-moz-transition: -moz-transform 0.5s ease-in ;
	-webkit-transition: -webkit-transform 0.5s ease-in ;
	-o-transition: -o-transform 0.5s ease-in ;
	position: relative;
	z-index: 98;
	transform: rotate(10deg) scale(0.8);
	-moz-transform: rotate(10deg) scale(0.8);
	-webkit-transform: rotate(10deg) scale(0.8);
	-o-transform: rotate(10deg) scale(0.8);
	}
ul.tilted_2 li:hover a {
	z-index: 100;
	transform: rotate(-7deg) scale(1.2);
	-moz-tran-righsform: rotate(-7deg) scale(1.2);
	-webkit-transform: rotate(-7deg) scale(1.2);
	-o-transform: rotate(-7deg) scale(1.2);	
	}
/* --------------END OF TILTED RIGHT-------------
-----------------START OF SIDEVIEW LEFT------------- */		
ul.sideview-L li {margin: 10px 6px 6px 4px;}
ul.sideview-L li a {
	transition: left 0.2s linear , transform 0.4s ease ;
	-moz-transition: left 0.2s linear , -moz-transform 0.4s ease ;
	-webkit-transition: left 0.2s linear , -webkit-transform 0.4s ease ;
	-o-transition: left 0.2s linear , -o-transform 0.4s ease ;
	position: relative; 
	left:0%;
	z-index: 98;
	transform: rotateY(60deg) skew(0deg, -10deg);
	-moz-transform: rotateY(60deg) skew(0deg, -10deg);
	-webkit-transform: rotateY(60deg) skew(0deg, -10deg);
	-o-transform: rotateY(60deg) skew(0deg, -10deg);
	}
ul.sideview-L li:hover a {
	left: 19%;
	z-index: 100;
	transform: rotateY(0deg) skew(0deg, 0deg);;
	-moz-transform: rotateY(0deg) skew(0deg, 0deg);
	-webkit-transform: rotateY(0deg) skew(0deg, 0deg);
	-o-transform: rotateY(0deg) skew(0deg, 0deg);	
	}


/* --------------END OF SIDEVIEW LEFT-------------
-----------------START OF SIDEVIEW RIGHT------------ */	
ul.sideview-R li {margin: 10px 6px 6px 4px;}
ul.sideview-R li a {
	transition: right 0.2s linear , transform 0.4s ease ;
	-moz-transition: right 0.2s linear , -moz-transform 0.4s ease ;
	-webkit-transition: right 0.2s linear , -webkit-transform 0.4s ease ;
	-o-transition: right 0.2s linear , -o-transform 0.4s ease ;
	position: relative; 
	right:0%;
	z-index: 98;
	transform: rotateY(-60deg) skew(0deg, 10deg);
	-moz-transform: rotateY(-60deg) skew(0deg, 10deg);
	-webkit-transform: rotateY(-60deg) skew(0deg, 10deg);
	-o-transform: rotateY(-60deg) skew(0deg, 10deg);
	}
ul.sideview-R li:hover a {
	right: 19%;
	z-index: 100;
	transform: rotateY(0deg) skew(0deg, 0deg);;
	-moz-transform: rotateY(0deg) skew(0deg, 0deg);
	-webkit-transform: rotateY(0deg) skew(0deg, 0deg);
	-o-transform: rotateY(0deg) skew(0deg, 0deg);	
	}
/* --------------END OF SIDEVIEW RIGHT-------------
-----------------START OF BUMP-UP------------- */	
ul.bump-up li a {
	transition: bottom 0.3s ease ;
	-moz-transition: bottom 0.3s ease ;
	-webkit-transition: bottom 0.3s ease ;
	-o-transition: bottom 0.3s ease ;
	position: relative;
	z-index: 98;
	bottom: 0;
	}
ul.bump-up li:hover a {
	bottom: 5px;
	z-index: 100;
	}
/* --------------END OF BUMP-UP-------------
-----------------START OF TABBED-UP------------- */	
ul.tabbed-up li a {
	transition: bottom 0.3s ease-in , transform 0.3s ease-in ;
	-moz-transition: bottom 0.3s ease-in , -moz-transform 0.3s ease-in ;
	-webkit-transition: bottom 0.3s ease-in , -webkit-transform 0.3s ease-in ;
	-o-transition: bottom 0.3s ease-in , -o-transform 0.3s ease-in ;
	position: relative;
	z-index: 98;
	bottom: 0;
	transform: scale(0.8);
	-moz-transform: scale(0.8);
	-webkit-transform: scale(0.8);
	-o-transform: scale(0.8);	
	}
ul.tabbed-up li:hover a {
	bottom: 5px;
	z-index: 100;
	transform: scale(1);
	-moz-transform: scale(1);
	-webkit-transform: scale(1);
	-o-transform: scale(1);	
	}
/* --------------END OF TABBED-UP -------------
-----------------START OF BUMP-DOWN------------- */
ul.bump-down li a {
	transition: top 0.3s ease ;
	-moz-transition: top 0.3s ease ;
	-webkit-transition: top 0.3s ease ;
	-o-transition: top 0.3s ease ;
	position: relative;
	z-index: 98;
	top: 0;
	}
ul.bump-down li:hover a {
	top: 5px;
	z-index: 100;
	}
/* --------------END OF BUMP-DOWN-------------
-----------------START OF TABBED-DOWN------------- */		
ul.tabbed-down li a {
	transition: top 0.3s ease-in , transform 0.3s ease-in ;
	-moz-transition: top 0.3s ease-in , -moz-transform 0.3s ease-in ;
	-webkit-transition: top 0.3s ease-in , -webkit-transform 0.3s ease-in ;
	-o-transition: top 0.3s ease-in , -o-transform 0.3s ease-in ;
	position: relative;
	z-index: 98;
	top: 0;
	transform: scale(0.8);
	-moz-transform: scale(0.8);
	-webkit-transform: scale(0.8);
	-o-transform: scale(0.8);	
	}
ul.tabbed-down li:hover a {
	top: 5px;
	z-index: 100;
	transform: scale(1);
	-moz-transform: scale(1);
	-webkit-transform: scale(1);
	-o-transform: scale(1);	
	}
/* --------------END OF TABBED-DOWN -------------
-----------------START OF BUMP-LEFT------------- */
ul.bump-left li a {
	transition: left 0.3s ease ;
	-moz-transition: left 0.3s ease ;
	-webkit-transition: left 0.3s ease ;
	-o-transition: left 0.3s ease ;
	position: relative;
	z-index: 98;
	left: 0;
	}
ul.bump-left li:hover a {
	left: 5px;
	z-index: 100;
	}
/* --------------END OF BUMP-LEFT-------------
-----------------START OF TABBED-LEFT------------- */
ul.tabbed-left li a {
	transition: left 0.3s ease-in , transform 0.3s ease-in ;
	-moz-transition: left 0.3s ease-in , -moz-transform 0.3s ease-in ;
	-webkit-transition: left 0.3s ease-in , -webkit-transform 0.3s ease-in ;
	-o-transition: left 0.3s ease-in , -o-transform 0.3s ease-in ;
	position: relative;
	z-index: 98;
	left: 0;
	transform: scale(0.8);
	-moz-transform: scale(0.8);
	-webkit-transform: scale(0.8);
	-o-transform: scale(0.8);	
	}
ul.tabbed-left li:hover a {
	left: 5px;
	z-index: 100;
	transform: scale(1);
	-moz-transform: scale(1);
	-webkit-transform: scale(1);
	-o-transform: scale(1);	
	}
/* --------------END OF TABBED-LEFT -------------
-----------------START OF BUMP-RIGHT------------- */
ul.bump-right li a {
	transition: right 0.3s ease ;
	-moz-transition: right 0.3s ease ;
	-webkit-transition: right 0.3s ease ;
	-o-transition: right 0.3s ease ;
	position: relative;
	z-index: 98;
	right: 0;
	}
ul.bump-right li:hover a {
	right: 5px;
	z-index: 100;
	}
/* --------------END OF BUMP-RIGHT-------------
-----------------START OF TABBED-RIGHT------------- */
ul.tabbed-right li a {
	transition: right 0.3s ease-in , transform 0.3s ease-in ;
	-moz-transition: right 0.3s ease-in , -moz-transform 0.3s ease-in ;
	-webkit-transition: right 0.3s ease-in , -webkit-transform 0.3s ease-in ;
	-o-transition: right 0.3s ease-in , -o-transform 0.3s ease-in ;
	position: relative;
	z-index: 98;
	right: 0;
	transform: scale(0.8);
	-moz-transform: scale(0.8);
	-webkit-transform: scale(0.8);
	-o-transform: scale(0.8);	
	}
ul.tabbed-right li:hover a {
	right: 5px;
	z-index: 100;
	transform: scale(1);
	-moz-transform: scale(1);
	-webkit-transform: scale(1);
	-o-transform: scale(1);	
	}
/* --------------END OF TABBED-RIGHT-------------
-----------------START OF side90 RIGHT------------- */
ul.side-half-CW li a {
	transition: transform 0.3s ease-in ;
	-moz-transition: -moz-transform 0.3s ease-in ;
	-webkit-transition: -webkit-transform 0.3s ease-in ;
	-o-transition: -o-transform 0.3s ease-in ;
	transform: rotate(-90deg) ;
	-moz-transform: rotate(-90deg) ;
	-webkit-transform: rotate(-90deg) ;
	-o-transform: rotate(-90deg) ;	
	}
ul.side-half-CW li:hover a {
	transform: rotate(0deg) ;
	-moz-transform: rotate(0deg) ;
	-webkit-transform: rotate(0deg) ;
	-o-transform: rotate(0deg) ;	
	}
/* --------------END OF side90 RIGHT-------------
-----------------START OF side90 LEFT------------- */
ul.side-half-CCW li a {
	transition: transform 0.3s ease-in ;
	-moz-transition: -moz-transform 0.3s ease-in ;
	-webkit-transition: -webkit-transform 0.3s ease-in ;
	-o-transition: -o-transform 0.3s ease-in ;
	transform: rotate(90deg) ;
	-moz-transform: rotate(90deg) ;
	-webkit-transform: rotate(90deg) ;
	-o-transform: rotate(90deg) ;	
	}
ul.side-half-CCW li:hover a {
	transform: rotate(0deg) ;
	-moz-transform: rotate(0deg) ;
	-webkit-transform: rotate(0deg) ;
	-o-transform: rotate(0deg) ;	
	}
/* ------------------END OF side90 LEFT-------------
--------------------START OF side90+ RIGHT------------- */
ul.rotout-right li a {
	transition: transform 0.3s ease-in, right 0.3s ease-in ;
	-moz-transition: -moz-transform 0.3s ease-in, right 0.3s ease-in ;
	-webkit-transition: -webkit-transform 0.3s ease-in, right 0.3s ease-in ;
	-o-transition: -o-transform 0.3s ease-in, right 0.3s ease-in ;
	position:relative;
	right:0;
	transform: rotate(-90deg) scale(0.8) ;
	-moz-transform: rotate(-90deg) scale(0.8) ;
	-webkit-transform: rotate(-90deg) scale(0.8) ;
	-o-transform: rotate(-90deg) scale(0.8) ;	
	}
ul.rotout-right li:hover a {
	right:10px;
	transform: rotate(0deg) scale(1) ;
	-moz-transform: rotate(0deg) scale(1) ;
	-webkit-transform: rotate(0deg) scale(1) ;
	-o-transform: rotate(0deg) scale(1) ;	
	}
/* -------------END OF side90+ RIGHT-------------
---------------START OF side90+ LEFT-------------- */
ul.rotout-left li a {
	transition: transform 0.3s ease-in, left 0.3s ease-in ;
	-moz-transition: -moz-transform 0.3s ease-in, left 0.3s ease-in ;
	-webkit-transition: -webkit-transform 0.3s ease-in, left 0.3s ease-in ;
	-o-transition: -o-transform 0.3s ease-in, left 0.3s ease-in ;
	position:relative;
	left:0;
	transform: rotate(90deg) scale(0.8) ;
	-moz-transform: rotate(90deg) scale(0.8) ;
	-webkit-transform: rotate(90deg) scale(0.8) ;
	-o-transform: rotate(90deg) scale(0.8) ;	
	}
ul.rotout-left li:hover a {
	left:10px;
	transform: rotate(0deg) scale(1) ;
	-moz-transform: rotate(0deg) scale(1) ;
	-webkit-transform: rotate(0deg) scale(1) ;
	-o-transform: rotate(0deg) scale(1) ;	
	}
/* ------------------END OF side90+ RIGHT------------- 
----------------START OF climb ------------------------------*/
ul.climb li a {
	transition: background-position 0.3s ease-in ;
	-moz-transition: background-position 0.3s ease-in ;
	-webkit-transition: background-position 0.3s ease-in ;
	-o-transition: background-position 0.3s ease-in ;
	}
/* ------------------END OF climb------------- 
----------------START OF climb90 LEFT ------------------------------*/
ul.climb90-left li a {
	transition: transform 0.3s linear, background-position 0.3s linear ;
	-moz-transition: -moz-transform 0.3s linear, background-position 0.3s linear ;
	-webkit-transition: -webkit-transform 0.3s linear, background-position 0.3s linear ;
	-o-transition: -o-transform 0.3s linear, background-position 0.3s linear ;
	transform: rotate(90deg) ;
	-moz-transform: rotate(90deg) ;
	-webkit-transform: rotate(90deg) ;
	-o-transform: rotate(90deg) ;	
	}
ul.climb90-left li:hover a {
	transform: rotate(0deg) ;
	-moz-transform: rotate(0deg) ;
	-webkit-transform: rotate(0deg) ;
	-o-transform: rotate(0deg) ;	
	}
/* ------------------END OF climb90 LEFT------------- 
----------------START OF climb90 RIGHT ------------------------------*/	
ul.climb90-right li a {
	transition: transform 0.3s linear, background-position 0.3s linear ;
	-moz-transition: -moz-transform 0.3s linear, background-position 0.3s linear ;
	-webkit-transition: -webkit-transform 0.3s linear, background-position 0.3s linear ;
	-o-transition: -o-transform 0.3s linear, background-position 0.3s linear ;
	transform: rotate(-90deg) ;
	-moz-transform: rotate(-90deg) ;
	-webkit-transform: rotate(-90deg) ;
	-o-transform: rotate(-90deg) ;	
	}
ul.climb90-right li:hover a {
	transform: rotate(0deg) ;
	-moz-transform: rotate(0deg) ;
	-webkit-transform: rotate(0deg) ;
	-o-transform: rotate(0deg) ;	
	}
/* ------------------END OF climb90 RIGHT------------- */


/* ============================================================================================= */
/* you can delete from this point downward IF you DID NOT choose effect options other than the effect deffaults */

ul.speed-slow li a {
	transition-duration: 1s;
	-moz-transition-duration: 1s;
	-webkit-transition-duration: 1s;
	-o-transition-duration: 1s;
	}
ul.speed-normal li a {
	transition-duration: 0.8s;
	-moz-transition-duration: 0.8s;
	-webkit-transition-duration: 0.8s;
	-o-transition-duration: 0.8s;
	}
ul.speed-fast li a {
	transition-duration: 0.5s;
	-moz-transition-duration: 0.5s;
	-webkit-transition-duration: 0.5s;
	-o-transition-duration: 0.5s;
	}
ul.speed-superfast li a {
	transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	-webkit-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	}
/* you can modify the values or make your own class for the speed/duration of the hover effect */	

ul.func-linear li a {
	transition-timing-function: linear;
	-moz-transition-timing-function: linear;
	-webkit-transition-timing-function: linear;
	-o-transition-timing-function: linear;
	}
ul.func-ease li a {
	transition-timing-function: ease;
	-moz-transition-timing-function: ease;
	-webkit-transition-timing-function: ease;
	-o-transition-timing-function: ease;
	}
ul.func-easein li a {
	transition-timing-function: ease-in;
	-moz-transition-timing-function: ease-in;
	-webkit-transition-timing-function: ease-in;
	-o-transition-timing-function: ease-in;
	}
ul.func-easeout li a {
	transition-timing-function: ease-out;
	-moz-transition-timing-function: ease-out;
	-webkit-transition-timing-function: ease-out;
	-o-transition-timing-function: ease-out;
	}
ul.func-easeinout li a {
	transition-timing-function: ease-in-out;
	-moz-transition-timing-function: ease-in-out;
	-webkit-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	}