/*

	ARCHIVO ---------------------------------------------------------------
	
		./css/main.css
		
	UBICACION -------------------------------------------------------------
	
		/

	DESCRIPCIÓN------------------------------------------------------------
			
		Hoja de estilos principal.
		
	REGISTRO --------------------------------------------------------------
	

*/

body {
	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */

	background-color	: White;

	color				: Black;
	font-family			: Exo2, Verdana, Arial, Helvetica, Sans-serif;
	font-size			: 18px;

	margin				: 0 0 0 0;
	padding				: 0 0 0 0;
}

.work {
	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */

	display				: block;
	position			: relative;
	
	width				: 100%;
	height				: inherit;
	
	background-color	: #ffffffcc;
	color				: black;
	border				: solid 0px dimgray;

	font-family			: Exo2, Verdana, Arial, Helvetica, Sans-serif;
	font-size			: 18px;

	margin				: auto;
	padding				: 0 0 0 0;
}

.work .header {
	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */
	
	background-color	: white;
	
	display				: block;
	height				: auto;
	width				: 95%;
		max-width		: 20em;
	
	padding				: 1em 1em 1em 1em;
	position			: relative;

	font-size			: inherit;

	text-decoration		: none;
	color				: dimgray;
	
	border				: solid 0px transparent;
	
	margin				: auto;
}

.work .header .title {
	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */
	
	background-color	: transparent;
	
	display				: block;
	height				: auto;
	width				: 100%;
	
	padding				: 0;
	position			: relative;

	font-size			: 125%;

	text-decoration		: none;
	text-align			: center;

	color				: inherit;
	
	border				: solid 0px transparent;
	
	margin				: 1em 0;
}

.work .header .description {
	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */
	
	background-color	: transparent;
	
	display				: block;
	height				: auto;
	width				: 100%;
	
	padding				: 0;
	position			: relative;

	font-size			: 75%;
	font-style			: italic;

	text-decoration		: none;
	text-align			: center;

	color				: inherit;
	
	border				: solid 0px transparent;
	
	margin				: 1em 0;
}


.work .actions {
	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */
	
	background-color	: transparent;

	display				: block;
	height				: auto;
	width				: 95%;
		max-width		: 20em;
	
	padding				: 1em 1em 1em 1em;
	position			: relative;

	font-size			: inherit;

	text-decoration		: none;
	color				: dimgray;
	
	border				: solid 0px transparent;
	
	margin				: auto;
}

.work .actions input {
	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */
	
	background-color	: whitesmoke;
	
	border				: solid 1px silver;
	border-radius		: 0.5em;

	color				: inherit;

	display				: block;

	height				: auto;
	width				: 100%;

	padding				: 0.5em;
	position			: relative;

	font-size			: inherit;

	text-align			: center;
	text-decoration		: none;

	margin				: 1em 0;

	transition			: all 500ms ease;
}
.work .actions input:hover {
	box-shadow			: dimgray 0 0 0.5em 0;
	transition			: all 500ms ease;
}

.work .actions input.button {
	display				: block;
	
	width				: 50%;
	
	background-color	: black;

	border				: solid 1px black;

	color				: white;
	
	text-transform		: uppercase;

	transition			: all 500ms ease;
	
	cursor				: pointer;
}
.work .actions input.button.previous {
	float				: left;
	background-color	: firebrick;
	border-radius		: .5em 0 0 .5em;
}
.work .actions input.button.next {
	float				: right;
	background-color	: green;
	border-radius		: 0 .5em .5em 0;
}
.work .actions input.button:hover {
	transition			: all 500ms ease;
}
.work .actions input.button.previous:hover {
	background-color	: red;
}
.work .actions input.button.next:hover {
	background-color	: limegreen;
}