/* ============================================================================================= */
/* =====>>> Table of contents <<<=============================================================== */
/*
			BASE
				Reset
				Tools
			
			DEFAULT STYLES
				Typography
				Images
				Tables
				Forms
			
			GLOBAL LAYOUT			
				Structure
				Body section
				Header section
				Content section
				Footer section
				
			PAGE SPECIFIC LAYOUT
				Home
				Portfolio	
				Clients				
				
			COLOR SCHEMES
				Light
				Dark	
				
*/
/* ============================================================================================= */



/* ============================================================================================= */
/* =====>>> BASE <<<============================================================================ */
/* ============================================================================================= */

/* ----->>> RESET <<<--------------------------------------------------------------------------- */

/* By Eric Meyer */
html, body, div, span, applet, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0; 
	padding: 0; 
	border: 0; 
	outline: 0; 
	font-size: 100%; 
	vertical-align: baseline; 
	background: transparent; 
}

body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }

/* Add permanent vertical scrollbar to Firefox */
html { overflow: -moz-scrollbars-vertical; }


/* ----->>> TOOLS <<<--------------------------------------------------------------------------- */

/* Clearfix */
.clearfix:after { 
	content: "."; 
	display: block; 
	clear: both; 
	visibility: hidden; 
	line-height: 0; 
	height: 0; 
}
.clearfix { 
	display: inline-block; 
}
html[xmlns] .clearfix { 
	display: block; 
}
* html .clearfix { 
	height: 1%; 
}

/* ----->>> TYPOGRAPHY <<<---------------------------------------------------------------------- */

body { 
	font-size: 12px; 
	line-height: 18px; 
	font-family: Arial, Helvetica, Verdana, sans-serif; 
	font-weight: normal; 	
}
input, select, textarea, button { 
	margin: 0;
	font-size: 12px; 
	line-height: 18px; 
	font-family: Arial, Helvetica, Verdana, sans-serif; 
	font-weight: normal; 	
}

h1 { margin: 27px 0 27px 0; font-size: 36px; line-height: 36px; font-weight: normal; }
h2 { margin: 0 0 18px 0; font-size: 24px; line-height: 24px; font-weight: normal; }  
h3 { margin: 0 0 18px 0; font-size: 18px; font-weight: bold; }
h4 { margin: 0 0 18px 0; font-size: 14px; font-weight: bold; }
h5 { margin: 0; font-size: 12px; font-weight: bold; }
h6 { margin: 0; font-size: 11px; font-weight: bold; }

ul { margin: 0 0 18px 2em; list-style-type: disc; }
ol { margin: 0 0 18px 2em; list-style-type: decimal; }
dl { margin: 0 0 18px 0; }

p { margin: 0 0 18px 0; }
address { margin: 0 0 18px 0; }

dfn { font-style: italic; }

pre, code {
	font-family: "Lucida Console", Courier, "DejaVu Sans Mono", monospace;
}
pre { overflow: auto; margin: 0 0 18px 0; }
code { padding: 0 2px; display: block; border-width: 1px; border-style: dotted; background: url(./../images/code_zebra.png) repeat; }


blockquote { 
	min-height: 32px;
	padding: 0 30px 0 30px; 
	margin: 0 0 18px 0; 	
	font-size: 14px; 
	line-height: 21px; 
	font-style: italic; 
	font-family: Georgia, serif;	 
}
q { font-style: italic; }
cite { font-style: italic; }

a { cursor: pointer; text-decoration: underline; }
strong { font-weight: bold; font-style: normal; }
em { font-weight: normal; font-style: italic; }
del { text-decoration: line-through; }

hr { border-width: 1px 0 0 0; border-style: solid; }

/* ----->>> IMAGES <<<-------------------------------------------------------------------------- */

.alignleft { margin: 7px 15px 7px 0; float:left;  }
.alignright { margin: 7px 0 7px 15px; float:right; }
.aligncenter { margin: 0px auto; display:block;  }


/* ----->>> TABLES <<<-------------------------------------------------------------------------- */

table { margin: 0 0 18px 0; }
th { border-width: 1px 0; text-align: left; border-style: solid; }
td, th { padding: 4px 10px; }


/* ============================================================================================= */
/* =====>>> GLOBAL LAYOUT <<<=================================================================== */
/* ============================================================================================= */
 

/* ----->>> STRUCTURE <<<----------------------------------------------------------------------- */

#page { }

#header { width: 870px; padding: 0 30px; margin: 0 auto; }
#header-inner {}


#content { width: 870px; padding: 0 30px; margin: 0 auto; }
#content-inner {} 

#footer { width: 870px; padding: 0 30px; margin: 0 auto; }
#footer-inner {}

/* --- Grid system ----------------------------------------------------------------------------- */
.grid:after { 
	content: "."; 
	display: block; 
	clear: both; 
	visibility: hidden; 
	line-height: 0; 
	height: 0; 
}
.grid { 
	display: inline-block; 
}
html[xmlns] .grid { 
	display: block; 
}
* html .grid { 
	height: 1%; 
}

.c-1, .c-2, .c-3, .c-4, .c-5, .c-6, .c-7, .c-8, .c-9, .c-10, .c-11, .c-12 { 
	margin: 0 0 0 30px; display: inline; float: left; 
}

.c-1  { width: 45px; }
.c-2  { width: 120px; }
.c-3  { width: 195px; }
.c-4  { width: 270px; }
.c-5  { width: 345px; }
.c-6  { width: 420px; }
.c-7  { width: 495px; }
.c-8  { width: 570px; }
.c-9  { width: 645px; }
.c-10 { width: 720px; }
.c-11 { width: 795px; }
.c-12 { width: 870px; }


.c-1:first-child, .c-2:first-child, .c-3:first-child, .c-4:first-child,
.c-5:first-child, .c-6:first-child, .c-7:first-child, .c-8:first-child,
.c-9:first-child, .c-10:first-child, .c-11:first-child, .c-12:first-child {
	margin-left: 0; 
}



/* ----->>> BODY SECTION <<<-------------------------------------------------------------------- */

/* Meta information */
.meta { font-size: 11px; font-family: Georgia, serif; font-style: italic; }

/* Preloader indicator for images */
.preload { background-position: center center; background-repeat: no-repeat; }

  
/* --- Buttons --- */  
.button { display: inline-block; text-transform: uppercase; background-repeat: no-repeat; }
  .button span { display: inline-block; background-repeat: no-repeat; }

.button { height: 24px; margin-right: 20px; line-height: 24px; font-weight: normal; }
  .button span { height: 24px; padding: 0 10px 0 0; margin: 0 -10px 0 10px; }
  
.button { background-position: left top; }
  .button span { background-position: right top; }  

.button:hover { background-position: left -24px; } 
  .button:hover span { background-position: right -24px; }


.header { padding: 10px 20px 6px 20px; margin: 0 0 18px 0; border-width: 1px 0 0 0; border-style: solid; }  

.header h2 { margin-bottom: 3px; }
.header h3 { margin-bottom: 3px; }
.header h4 { margin-bottom: 3px; }  
.header p { margin-bottom: 0; }
.header a { text-decoration: none; }



span.path { padding: 0 0.5em; background: #ddd; }
  

#toc { }

h4 span { 
	display: block; 
	font-size: 12px;
	font-weight: normal;	
}


 /* --- System messages --- */
.message { 
	margin: 0 75px;

	-moz-border-radius: 2px; 
	-webkit-border-radius: 2px; 
	border-radius: 2px;
}
.message-inner {
	padding: 18px 31px 18px 72px; 
	margin: 0 0 36px 0;
}
.message.success { 
	color: #0e6200; 
	background-color: #d8ffcc;
	background-image: -moz-linear-gradient(top, #f5fff2, #d8ffcc);
	background-image: -webkit-gradient(linear,left top,left bottom, from(#f5fff2), to(#d8ffcc));
	
	-moz-box-shadow: 0 1px 0 #b3f39f;
	-webkit-box-shadow: 0 1px 0 #b3f39f;
	box-shadow: 0 1px 0 #b3f39f;
}
.message.success .message-inner {
	background: url(./../images/icon_message_success.png) 31px 15px no-repeat;
}
.message.info {	 
	color: #004a79;
	background-color: #cbebff; 
	background-image: -moz-linear-gradient(top, #f2faff, #cbebff);
	background-image: -webkit-gradient(linear,left top,left bottom, from(#f2faff), to(#cbebff));
	
	-moz-box-shadow: 0 1px 0 #a0daff;
	-webkit-box-shadow: 0 1px 0 #a0daff;
	box-shadow: 0 1px 0 #a0daff;
}
.message.info .message-inner {
	background: url(./../images/icon_message_info.png) 31px 15px no-repeat;
}
.message.warning {	 
	color: #7f4800;
	background-color: #fff8c0; 
	background-image: -moz-linear-gradient(top, #fffdef, #fff8c0);
	background-image: -webkit-gradient(linear,left top,left bottom, from(#fffdef), to(#fff8c0));
	
	-moz-box-shadow: 0 1px 0 #ffef6f;	
	-webkit-box-shadow: 0 1px 0 #ffef6f;
	box-shadow: 0 1px 0 #ffef6f;
}
.message.warning .message-inner {
	background: url(./../images/icon_message_warning.png) 31px 15px no-repeat;
}
.message.error { 	
	color: #ca0000;
	background-color: #ffe0e0;
	background-image: -moz-linear-gradient(top, #fff7f7, #ffe0e0);
	background-image: -webkit-gradient(linear,left top,left bottom, from(#fff7f7), to(#ffe0e0));
	
	-moz-box-shadow: 0 1px 0 #ffcccc;
	-webkit-box-shadow: 0 1px 0 #ffcccc;
	box-shadow: 0 1px 0 #ffcccc;
}
.message.error .message-inner {
	background: url(./../images/icon_message_error.png) 31px 15px no-repeat;
}



  
/* ----->>> HEADER SECTION <<<------------------------------------------------------------------ */


/* ----->>> CONTENT SECTION <<<----------------------------------------------------------------- */


/* ----->>> FOOTER SECTION <<<------------------------------------------------------------------ */




/* ============================================================================================= */
/* =====>>> COLOR SCHEMES <<<=================================================================== */
/* ============================================================================================= */

body 			{ color: #333; }
a			 	{ color: #00accb; }
a:hover			{ color: #7a4b38; }

hr { border-color: #ccc; }

.meta 			{ color: #999; }  
.meta a 			{ color: #666; }
.meta a:hover 	{ color: #000; }

.header {
	border-color: #e5e5e5;	
	background: #d9d9d9;	
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
	background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ededed));
	background: -moz-linear-gradient(top,  #ffffff,  #ededed);
}

.header-2 {
	color: #fff;
	border-color: #00accb;	
	background: #00accb;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#20c6e4', endColorstr='#00accb');
	background: -webkit-gradient(linear, left top, left bottom, from(#20c6e4), to(#00accb));
	background: -moz-linear-gradient(top,  #20c6e4,  #00accb);	
}

.header-2 .meta 			{ color: #8edae8; }
.header-2 .meta a 		{ color: #d1eff4; }
.header-2 .meta a:hover	{ color: #fff; }