/* * * * * * * * * * * * * * * *
ACTIONLINKS / BUTTONS
* * * * * * * * * * * * * * * */


/* Size */
/* ---- */

.actionLink {
	font-size: 1em !important;
	}
	

/* Color settings */
/* -------------- */


/* Default button color */			.actionLink { border-color: white !important; background: #fff; } 				
/* Default button hover color */	.actionLink:hover { border-color: white;  background: #fff; } 					

/* Default icon color */			.icon { background-color: red; } 												
/* Default icon hover color */		.icon:hover, .actionLink:hover .icon { background-color: orange; }				
	
/* Default link color */			.actionLink a { color: lightgray !important; } 									
/* Default link hover color */ 		.actionLink:hover a { color: orange !important; } 								
	

/* Icons */
/* ----- */
	
.icon.archive {
	background-image: url(img/icon_box.png);
	}
	
.icon.box {
	background-image: url(img/icon_box.png);
	}
	
.icon.arrowUpLeft {
	width: 1em !important;
	background-image: url(img/icon_arrowUpL.png);
	}
	
.icon.arrowUp {
	width: 1em !important;
	background-image: url(img/icon_arrowUp.png);	
	}
	
.icon.arrowUpRight {
	width: 1em !important;
	background-image: url(img/icon_arrowUpR.png);
	}

.icon.arrowLeft {
	width: 1em !important;
	background-image: url(img/icon_arrowLeft.png);
	}
	
.icon.arrowRight {
	width: 1em !important;
	background-image: url(img/icon_arrowRight.png);
	}
	
.icon.arrowDownLeft {
	width: 1em !important;
	background-image: url(img/icon_arrowDownL.png);	
	}
	
.icon.arrowDown {
	width: 1em !important;
	background-image: url(img/icon_arrowDown.png);
	}
	
.icon.arrowDownRight {
	width: 1em !important;
	background-image: url(img/icon_arrowDownR.png);
	}
	

.icon.center {
	width: 1em !important;
	}



/* Display settings */
/* ---------------- */


section.settingArea1,
section.settingArea2,
section.settingArea3 {
	padding: 2em;
	}
	
section.settingArea2 {
	background-color: lightgray;
	}
	
.actionLink {
	display: inline-block;
	padding: 0.35em 0.5em 0.1525em;
	border: 0.15em solid lightgray;
	-webkit-border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	border-radius: 0.5em;
	cursor: pointer;
	}
	
.actionLink a, .actionLink .icon {
	text-decoration: none !important;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;  
	transition: all 0.3s ease-in-out;
	}
	
.actionLink a {
	margin: 0;
	height: 1.5em;
	}	

.icon {
	position: relative;
	display: inline-block;
	margin: 0 0.3em 0 0;
	padding: 0 0.1em;
	width: 2em;
	height: 1.5em;
	border: 1px #fff solid;
	-webkit-border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	border-radius: 0.5em;
	background-position: center center;
	background-repeat: no-repeat;
	vertical-align: middle;
	cursor: pointer;
	}