/* Generated by Font Squirrel (http://www.fontsquirrel.com) on October 27, 2011 */

@font-face {
    font-family: 'FontinRegular';
    src: url('_fontin/fontin-regular-webfont.eot');
    src: url('_fontin/fontin-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('_fontin/fontin-regular-webfont.woff') format('woff'),
         url('_fontin/fontin-regular-webfont.ttf') format('truetype'),
         url('_fontin/fontin-regular-webfont.svg#FontinRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'FontinItalic';
    src: url('_fontin/fontin-italic-webfont.eot');
    src: url('_fontin/fontin-italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('_fontin/fontin-italic-webfont.woff') format('woff'),
         url('_fontin/fontin-italic-webfont.ttf') format('truetype'),
         url('_fontin/fontin-italic-webfont.svg#FontinItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'FontinBold';
    src: url('_fontin/fontin-bold-webfont.eot');
    src: url('_fontin/fontin-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('_fontin/fontin-bold-webfont.woff') format('woff'),
         url('_fontin/fontin-bold-webfont.ttf') format('truetype'),
         url('_fontin/fontin-bold-webfont.svg#FontinBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* ------------------------------------------------------

	RESETS

--------------------------------------------------------*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, 
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, 
img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, 
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figure, figcaption, hgroup, 
menu, footer, header, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
}

article, aside, canvas, figure, figure img, figcaption, hgroup,
footer, header, nav, section, audio, video {
	display: block;
}

a img { border: 0; }

li { list-style: none; }


/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
sub, sup { font-size: 55%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

small { font-size: .8em; line-height: 0; position: relative; vertical-align: baseline; }


/* Selection colours (easy to forget) */

::selection 	 	{ background: rgb(250,190,130); }
::-moz-selection 	{ background: rgb(250,190,130); }
img::selection 		{ background: transparent; }
img::-moz-selection	{ background: transparent; }
body { -webkit-tap-highlight-color: rgb(250,190,130); }




/* ------------------------------------------------------

	GENERAL FORMATTING

--------------------------------------------------------*/

body { background: url('bg_html_lightblue.png') top left repeat-x; }

html { font:normal .81em 'Helvetica Neue',helvetica,arial,sans-serif; color: #333; line-height: 1.8; letter-spacing: .04em; background: url('bg_greypattern.png') bottom left repeat; }


/* My Style */

header { height: 177px; background: url('bg_navbar_lightblue.png') top left repeat-x; }


h1 a {
	position: absolute;
	height: 100px;
	width: 210px;
	z-index: 10000;
	text-indent:-99999px;
	top:46px;
	
	background: url(logo.png) no-repeat top;
}

h1 a:hover {
	background: url(logo.png) no-repeat bottom;
}

h2 { 
	font: 3em 'FontinRegular', cursive;
	padding: 28px 0 0;
	color: #67B6D4;
	text-shadow: 2px 1px 2px rgb(210,245,250);
}

h3 {  
    font: 1.85em 'FontinRegular', cursive;
    letter-spacing: 0;
    color: #666;
    
    text-shadow: 1px 1px 1px #fff;
        
    margin-bottom: 10px; 
    padding: 15px 0 0;
}

h3 span {  
    text-shadow: 1px 0px 1px #fff;
	color: #67B6D4;
}


h3.contact { background:url("../contact-app/images/icon-mail.png") no-repeat scroll 0px 47% ;padding: 10px 0 10px 66px; margin-bottom: 10px; margin-left: -15px; }

h4 {  
    font: 1.85em 'FontinItalic', cursive;
    letter-spacing: 0;
    color: #666;
    
    text-shadow: 1px 1px 1px #fff;
        
    margin-bottom: 10px; 
    padding: 15px 0 0;
}


	h4 span {  
	   text-shadow: 1px 0px 1px #fff;
	   color: #67B6D4;
	}
	   								/* ------------------------------------------------------
									
										HEADER + BANNER + H's
									
									--------------------------------------------------------*/
									
										#banner { background: url('bg_banner_lightblue.png') bottom left repeat-x; }
																			
										#banner img { float:right; margin-top:-132px; }
										
										#slidecontainer { width: 770px; float: left; margin-left: -40px; margin-top: 10px; }
										
										#hiboo { width: 230px; height: 500px; float: right; margin-right: -10px;
											background: url(hiboo_webgraphicprint.png) bottom right no-repeat; }
										
										#hiboo_hover {
											float: left;
											margin: 60px 0 300px -110px;
										}


/* ------------------------------------------------------

	NAV

--------------------------------------------------------*/			

nav {
	display:block;
	float: right;
	margin: 84px 40px 0;
	position: relative;
}

nav li{
	font: 1.45em 'FontinItalic', cursive;
	list-style: none;
	display: inline;	
	padding: 0 20px;
	float: left;
}


nav li.last {
	padding-right: 30px }

nav a{
	color: #666;
	letter-spacing: .1em;
	text-decoration: none;
	padding: 4px 8px;
	
	text-shadow: 1px 1px 1px #fff;
	
   -webkit-transition:color 250ms ease-in;  
   -moz-transition:color 250ms ease-in;  
   -o-transition:color 250ms ease-in;  
   transition:color 250ms ease-in;  
}

	nav a.active {
		color: #EE8025;
	}
	
	
	nav a:hover { 
		color: #67B6D4; 
	}



		nav ul li a.home { position: absolute; width: 30px; height: 30px; background: url(home.png) no-repeat top left; top:-6px; right: 0; padding: 0; }
		
		nav ul li a.home.active { background: url(home.png) no-repeat top right; }
		nav ul li a.home:hover { background: url(home.png) no-repeat bottom left; }
								
												/* ------------------------------------------------------
												
													MAIN
												
												--------------------------------------------------------*/
	
													#main {
														min-height: 336px;
														background: url('bg_main_light.png') top left; 
													}	
													
													#main p { text-shadow: 1px 0px 1px #fff; padding: 0px 30px 8px 0; }
													
													#main.home { text-align: center; }
													
													
													#main a { color: #67B6D4; text-decoration: none; font-size: 1.1em; }
														
														#main a:hover { border-bottom: 1px dashed #67B6D4; }
													
													
													#main.home p {
														text-shadow: 1px 0px 1px #fff;
														margin: none;
														padding: 0 0 8px;
													}
													
														#homelinks { text-align: center; margin-top: 70px; }
														
														#homelinks li { 
															font: 1.45em 'FontinItalic', cursive; 
															list-style: none; 
															display: inline; 
															padding: 19px 9px; 
															margin: 0 60px; 
															background: rgba(255,255,255,.5); 
															border: 1px solid rgba(220,220,220,.5);
															-webkit-border-radius: 4px;
															-moz-border-radius: 4px;
															border-radius: 4px; 
														}
														
														#homelinks li a { 
															padding: 10px 30px; 
															text-decoration: none; 
															
															color: rgb(60,130,160); 
		    												text-shadow: 1px 1px 1px rgb(180,220,240); 
		    												
		    												background: rgb(148,204,222); /* Old browsers */
		    												background: -moz-linear-gradient(top, rgb(148,204,222) 25%, rgb(104,183,212) 100%); /* FF3.6+ */
		    												background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,rgb(148,204,222)), color-stop(100%,rgb(104,183,212))); /* Chrome,Safari4+ */
		    												background: -webkit-linear-gradient(top, rgb(148,204,222) 25%,rgb(104,183,212) 100%); /* Chrome10+,Safari5.1+ */
		    												background: -o-linear-gradient(top, rgb(148,204,222) 25%,rgb(104,183,212) 100%); /* Opera 11.10+ */
		    												background: -ms-linear-gradient(top, rgb(148,204,222) 25%,rgb(104,183,212) 100%); /* IE10+ */
		    												background: linear-gradient(top, rgb(148,204,222) 25%,rgb(104,183,212) 100%); /* W3C */
		    												filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#94ccde', endColorstr='#68b7d4',GradientType=0 ); /* IE6-9 */
		 														    
		    												border-bottom: 1px solid rgb(60,120,150);
		    												border-right: 1px solid rgb(60,120,150);
		    												border-top: 1px solid rgb(180,220,240);
		    												border-left: 1px solid rgb(180,220,240);
															
															-webkit-border-radius: 3px;
															-moz-border-radius: 3px;
															border-radius: 3px; 
																														
														}
														
														#homelinks li a:hover { 
																													
															background: -moz-linear-gradient(top, rgb(104,183,212) 25%, rgb(148,204,222) 100%); /* FF3.6+ */
		    												background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,rgb(104,183,212)), color-stop(100%,rgb(148,204,222))); /* Chrome,Safari4+ */
		    												background: -webkit-linear-gradient(top, rgb(104,183,212) 25%,rgb(148,204,222) 100%); /* Chrome10+,Safari5.1+ */
		    												background: -o-linear-gradient(top, rgb(104,183,212) 25%,rgb(148,204,222) 100%); /* Opera 11.10+ */
		    												background: -ms-linear-gradient(top, rgb(104,183,212) 25%,rgb(148,204,222) 100%); /* IE10+ */
		    												background: linear-gradient(top, rgb(104,183,212) 25%,rgb(148,204,222) 100%); /* W3C */
		    												filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#68b7d4', endColorstr='#94ccde',GradientType=0 ); /* IE6-9 */
															
		    												border-bottom: 1px solid rgb(180,220,240);
		    												border-right: 1px solid rgb(180,220,240);
		    												border-top: 1px solid rgb(60,120,150);
		    												border-left: 1px solid rgb(60,120,150);
														}



	/* ------------------------------------------------------
												
	    HEADER LINKS
	
	--------------------------------------------------------*/	
								
				
#headerlinks { margin-top: -33px; margin-left: 175px; margin-bottom: 10px; }

#headerlinks li { 
    font: 1.25em 'FontinItalic', cursive; 
    list-style: none; 
    display: inline; 
    padding: 13px 8px; 
    margin: 0 8px; 
    background: rgba(255,255,255,.3); 
    border: 1px solid rgba(220,220,220,.5);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -khtml-border-radius: 4px;
    border-radius: 4px; 
}

#headerlinks li a { 
    padding: 5px 15px; 
    text-decoration: none;  
    
    color: rgb(60,130,160); 
    text-shadow: 1px 1px 1px rgb(180,220,240); 
    
    background: rgb(148,204,222); /* Old browsers */
    background: -moz-linear-gradient(top, rgb(148,204,222) 25%, rgb(104,183,212) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,rgb(148,204,222)), color-stop(100%,rgb(104,183,212))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgb(148,204,222) 25%,rgb(104,183,212) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgb(148,204,222) 25%,rgb(104,183,212) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgb(148,204,222) 25%,rgb(104,183,212) 100%); /* IE10+ */
    background: linear-gradient(top, rgb(148,204,222) 25%,rgb(104,183,212) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#94ccde', endColorstr='#68b7d4',GradientType=0 ); /* IE6-9 */
 		    
    border-bottom: 1px solid rgb(60,120,150);
    border-right: 1px solid rgb(60,120,150);
    border-top: 1px solid rgb(180,220,240);
    border-left: 1px solid rgb(180,220,240);
    
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -khtml-border-radius: 3px;
    border-radius: 3px; 						
}

#headerlinks li a:hover { 
    background: -moz-linear-gradient(top, rgb(104,183,212) 25%, rgb(148,204,222) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,rgb(104,183,212)), color-stop(100%,rgb(148,204,222))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgb(104,183,212) 25%,rgb(148,204,222) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgb(104,183,212) 25%,rgb(148,204,222) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgb(104,183,212) 25%,rgb(148,204,222) 100%); /* IE10+ */
	background: linear-gradient(top, rgb(104,183,212) 25%,rgb(148,204,222) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#68b7d4', endColorstr='#94ccde',GradientType=0 ); /* IE6-9 */
	
    border-bottom: 1px solid rgb(180,220,240);
    border-right: 1px solid rgb(180,220,240);
    border-top: 1px solid rgb(60,120,150);
    border-left: 1px solid rgb(60,120,150);
}


	/* ------------------------------------------------------
												
	    FOLIO BOX
	
	--------------------------------------------------------*/			

		ul.box a { text-decoration: none; position: relative; }
		
		ul.box a p { text-align: center; color: grey; margin-right: -32px; font-size:0.9em;  }
	
		ul.box {
			position: relative;
			z-index: 1; /* prevent shadows falling behind containers with backgrounds */
			overflow: hidden;
			list-style: none;
			margin: 0 -25px;
		}
		
		
		
		ul.box li {
			position: relative;
			float: left;
			margin: 15px 0;
   			height: 230px;
   			width: 270px;
		}
		
		ul.box li a {
   			height: 230px;
   			width: 270px;
   		}
		
		ul.box li a span {
   			width: 200px;
			padding: 10px 10px 4px;
			background: #fff;
			position: relative;
			float: left;
			border: 1px solid #efefef;
			margin: 5px 24px 10px;
			-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
			-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset; 
			box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset; 
		}
		
			ul.box li a:hover span {
				background: #d9f5fe;
			}
		
		ul.box li a span img {
			border: 1px solid rgb(220,220,220);
		}
		
		ul.box li a span:before,
		ul.box li a span:after #service
		
		
		ul.box li a span:after {
			left: auto;
			right: 10px;
			-webkit-transform: skew(15deg) rotate(6deg);
			-moz-transform: skew(15deg) rotate(6deg);
			-ms-transform: skew(15deg) rotate(6deg);
			-o-transform: skew(15deg) rotate(6deg);
			transform: skew(15deg) rotate(6deg); 
		}							
				
		ul.box a:hover p { color: #67B6D4 }
				
	/* -----------------------------------------------------------------
	
		SERVICE
		
	------------------------------------------------------------------ */
	
	
						

table#service h3 {
	font-size: 6em;
	line-height: 1.8em;
	padding: 0;
	margin: 0 0 0 20px;
	color: #ccc;
	text-shadow: 2px 2px 2px #fff;
}

table#service p {
	margin: 0 0 30px 30px;
	text-shadow: 1px 0px 1px #fff; 
}

table#service tr td img { vertical-align: center; }

table#service tr td { vertical-align: center; }

table#service tr td table th { text-align: center; height: 230px; vertical-align: top; }

table#service tr td table tr { vertical-align: top; }





table#service ul li { 
    font: 1.25em 'FontinItalic', cursive; 
	color: #444;
	text-shadow: 1px 1px 1px #fff;
    list-style: none; 
	position: relative;
    padding: 13px 15px; 
    margin: 0 15px 10px; 
    background: rgba(255,255,255,.3); 
    border: 1px solid rgba(220,220,220,.5); 
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px; 
}
	table#service ul:after{ 
		content: ".";  
    	visibility: hidden;  
    	display: block;  
    	clear: both;  
    	height: 0;  
    	font-size: 0;
    }
	table#service ul li:after{ 
		content: ".";  
    	visibility: hidden;  
    	display: block;  
    	clear: both;  
    	height: 0;  
    	font-size: 0;
    }

table#service ul li ul {
	padding-top: 2px
}

table#service ul li ul li { 
    font: .95em 'FontinItalic', cursive; 
	color: #555;
	text-shadow: 1px 1px 1px #fff;
    list-style: none; 
	position: relative;
    padding: 10px 20px; 
    margin: 0; 
    background: none; 
    border: none; 
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px; 
}			
				
				
		
												/* ------------------------------------------------------
												
													FOOTER
												
												--------------------------------------------------------*/			
												
												#main.home #backtotop {
													display: none;
												}
												
												#main #backtotop {
													text-align: center;
													Padding: 40px 0 50px;
												}
												
												#main #backtotop a:hover {
													border: none;
												}
												
												
												footer {
													min-height: 250px;
													padding-top: 110px;
													padding-bottom: 60px;
													background: url('bg_footer_lightblue.png') top left repeat-x;
												}
												
												footer h2 span.oo { background: url(oo.png) no-repeat; height: 25px; width:44px; }

												footer h2 { color: #eee; text-shadow: none; padding: 5px 0 0; }
												footer h2 span { color: #ef8126; text-shadow: none; }
												
												footer h3 { color: #eee; text-shadow: none; padding: 15px 0 0px; }
												footer h3 span { color: #ef8126; text-shadow: none; font-weight: normal; }
													
													footer h3 span#more_news {
														
														margin-left: 15px;
														font-size: .6em;
													}
													
													footer p { color: #eee; text-shadow: #555;}
													
													footer a { 
														color: #000; 
														background: #888; 
														text-shadow: #555; 
														text-decoration: none; 
														padding: 3px;
    													-webkit-border-radius: 4px;
    													-moz-border-radius: 4px;
    													border-radius: 4px;
    												}
    												
														footer a:hover { 
															color: #ef8126;
    														background: #111;
    													}
													
													
													
													
												
													#twtr-widget-1 { margin-bottom: 60px; }

														.twtr-hd { display:none; }
														
														.twtr-user { display:none; }
														
														.twtr-tweet-wrap { margin: 5px 0 15px; }


												footer ul:after {
													content: ".";  
    												visibility: hidden;  
    												display: block;  
    												clear: both;  
    												height: 0;  
    												font-size: 0;
    												}
												
												footer ul li {
    												padding: 6px 5px; 
													float: left;
    											}
												
												footer ul li a {  
													color: #000;
    												text-decoration: none;
    												padding: 6px 15px; 
    												background: #888; 
    												border: 1px solid #000; 
    												-webkit-border-radius: 4px;
    												-moz-border-radius: 4px;
    												border-radius: 4px; 
    											}
    											
    											footer ul li a:hover {
    												color: #fff;
    												background: #111;
    												border-color: #ef8126;
    											}
													
													

				
				
												.tumblr_post, .tumblr_photo_post { padding-right: 20px; }
												
												.tumblr_post img, .tumblr_photo_post img {
													max-width: 200px; 
													padding: 10px; 
													margin: 0 80px 0 5px; 
													background: #aaa;
    												-webkit-border-radius: 4px;
    												-moz-border-radius: 4px;
    												border-radius: 4px; 
												 }
												
												
												
												

			
			


/* ==================================================================================================================== */
/* ! The 1140px Grid V2 by Andy Taylor \ http://cssgrid.net \ http://www.twitter.com/andytlr \ http://www.andytlr.com   */
/* ==================================================================================================================== */

.container {
padding-left: 40px;
padding-right: 40px;
}

.row {
width: 1040px;
margin: 0 auto;

}

	.row:after {
	content: ".";  
    visibility: hidden;  
    display: block;  
    clear: both;  
    height: 0;  
    font-size: 0;
	}

.onecol, .twocol, .threecol, .fourcol, .fivecol, .sixcol, .sevencol, .eightcol, .ninecol, .tencol, .elevencol {
margin-right: 3.8%;
float: left;
min-height: 1px;
}

.row .onecol {
width: 4.85%;
}

.row .twocol {
width: 13.45%;
}

.row .threecol {
width: 22.05%;
}

.row .fourcol {
width: 30.75%;
}

.row .fivecol {
width: 39.45%;
}

.row .sixcol {
width: 48%;
}

.row .sevencol {
width: 56.75%;
}

.row .eightcol {
width: 65.4%;
}

.row .ninecol {
width: 74.05%;
}

.row .tencol {
width: 82.7%;
}

.row .elevencol {
width: 91.35%;
}

.row .twelvecol {
width: 100%;
float: left;
}

.last {
margin-right: 0px;
}

.last:after {
	content: ".";  
    visibility: hidden;  
    display: block;  
    clear: both;  
    height: 0;  
    font-size: 0;
	}

img, object, embed {
max-width: 100%;
}

img {
	height: auto;
}