/* #Basic Styles
	----------------------------------- */

html,
body {
	height: 100%; margin: 0; padding: 0;
}

body {
	background: #fff; text-align: left; font: 300 0.75em 'Open Sans', sans-serif; color: #000;
	
	-webkit-font-smoothing:	antialiased;
	-moz-font-smoothing:	antialiased;
	-o-font-smoothing:		antialiased;
	font-smoothing:			antialiased;
}

*,
*:after,
*:before {
	-webkit-box-sizing:	border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: 	border-box; /* Firefox, other Gecko */
	box-sizing: 		border-box; /* Opera/IE 8+ */
}

body > header,
body > section,
body > footer {
	display: block; width: 100%; float: left; clear: both;
}


/* #Typography
	----------------------------------- */

h1,
h2,
h3,
h4,
h5,
h6 {
	line-height: 1.5em; margin: .45em 0; padding: 0; font-weight: normal;
}

h1,
h2,
h3 {
	font-weight: 700; letter-spacing: -.05em; color: #000;
}

h1 { font-size: 1.5em; }
h2 { font-size: 1.250em; }
h3 { font-size: 1.125em; }

p { line-height: 1.5; margin: 0 0 1.5em; }
p, ul { font-size: 0.875em; }


/* #Links
	----------------------------------- */

a {
	-webkit-transition: 0.5s ease;
	-moz-transition: 	0.5s ease;
	-o-transition: 		0.5s ease;
	transition: 		0.5s ease;
}
a,
a:hover {
	text-decoration: none;
}

/* remove outline */
a,
a:hover,
a:active,
a:focus {
	outline: 0 none;
}


/* #Lists
	----------------------------------- */

ul { line-height: 1.5; margin: 0 0 1.5em; }


/* #Images
	----------------------------------- */

img { max-width: 100%; height: auto; border: 0; }


/* #Forms
	----------------------------------- */

input,
select,
textarea {
	border-width: 1px; border-style: solid; border-color: #b7b7b7 #e7e7e7 #e7e7e7 #b7b7b7;
	
	-webkit-transition: border-color 0.35s ease-in-out;
	-moz-transition: 	border-color 0.35s ease-in-out;
	-o-transition: 		border-color 0.35s ease-in-out;
	transition: 		border-color 0.35s ease-in-out;
	
	-webkit-box-shadow: inset 0 1px 2px #ddd, 0 1px 0 #fff; /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
	-moz-box-shadow: 	inset 0 1px 2px #ddd, 0 1px 0 #fff; /* Firefox 3.5 - 3.6 */
	box-shadow: 		inset 0 1px 2px #ddd, 0 1px 0 #fff; /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
}

input:hover,
select:hover,
textarea:hover {
	border: 1px solid #777;
	
	-webkit-transition:	border-color 0.3s ease-in-out;
	-moz-transition:	border-color 0.3s ease-in-out;
	-o-transition:		border-color 0.3s ease-in-out;
	transition:			border-color 0.3s ease-in-out;
}

input:focus,
select:focus,
textarea:focus {
	outline: 0; border: 1px solid #a9b9c2;
	
	-webkit-box-shadow: 0 0 5px rgba(81, 203, 238, 1);
	-moz-box-shadow: 	0 0 5px rgba(81, 203, 238, 1);
	box-shadow: 		0 0 5px rgba(81, 203, 238, 1);
}

input[type="reset"],
input[type="button"],
input[type="submit"],
input[type="file"] > input[type="button"] {
	border: 1px dotted transparent;
}

/* placeholder */
::-webkit-input-placeholder { color: #888; }
:-moz-placeholder { color: #888; }
::-moz-placeholder { color: #888; }
:-ms-input-placeholder { color: #888; }

/* responsive web form */
.webform { font-size: 0.938em; color: #000; }
.webform label span { display: block; margin: 0.375em 0; font-weight: 400; color: #707070; cursor: pointer; }
.webform label.icheck { margin-right: 1em; margin-left: 0.375em; }
.webform p { margin: 0.625em 0; }
.webform div.antispam { display: block; float: left; }
.webform div.antispam img { margin-bottom: 0.375em; vertical-align: top; cursor: pointer; }
.webform div.antispam input { display: inline; float: none; }
.webform div.antispam label.frm-error { display: block; clear: both; float: none; text-align: left; }

.webform input[type="text"],
.webform input[type="email"],
.webform input[type="tel"],
.webform input[type="url"],
.webform select,
.webform textarea {
	width: 100%; margin: 0 0 0.375em; padding: 0.375em; font-weight: 300; font-size: 0.875em;
}

.webform select,
.webform textarea {
	max-width: 100%;
}

.webform textarea { height: 7.5em; }

/* submit button */
.webform button[type="submit"] {
	width: 100%; padding: 0.5em; border: none; font-size: 1.5em; color: #fff; cursor: pointer;
	
	background-color: #2a7cf7;
	background-image: -webkit-linear-gradient(bottom, #2a7cf7 0%, #4aaaff 52%);
	background-image: -moz-linear-gradient(bottom, #2a7cf7 0%, #4aaaff 52%);
	background-image: linear-gradient(bottom, #2a7cf7 0%, #4aaaff 52%);
}
.webform button[type="submit"]:hover {
	color: #fff;
	background-image: -webkit-linear-gradient(bottom, #1e1e1e 0%, #4b4b4b 52%);
	background-image: -moz-linear-gradient(bottom, #1e1e1e 0%, #4b4b4b 52%);
	background-image: linear-gradient(bottom, #1e1e1e 0%, #4b4b4b 52%);
	
	-webkit-transition:	background 0.3s ease-in-out;
	-moz-transition:	background 0.3s ease-in-out;
	-o-transition:		background 0.3s ease-in-out;
	transition:			background-color 0.3s ease-in-out;
}
.webform button[type="submit"]:active {
	-webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.5); /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
	-moz-box-shadow: 	inset 0 1px 3px rgba(0,0,0,0.5); /* Firefox 3.5 - 3.6 */
	box-shadow: 		inset 0 1px 3px rgba(0,0,0,0.5); /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
}

/* form errors */
form.webform input.frm-error,
form.webform select.frm-error,
form.webform textarea.frm-error {
	border: 1px solid #f00;
}

form.webform input.frm-success,
form.webform select.frm-success,
form.webform textarea.frm-success {
	border: 1px solid #a1d909;
}

form.webform label.frm-error { display: block; font-weight: 300; font-size: 0.875em; color: #f00; }


/* #Tables
	末末末末末末末末末末末末末末末末末末末末末末末末末 */
	
	table { width: 100%; border-collapse: collapse; border: 1px solid #777; }
	
	/* Zebra striping */
	tr:nth-of-type(odd) { background: #eee; }
	
	th { background: #333;  font-weight: 700; color: #fff; }
	
	th,
	td {
		padding: 0.750rem 0.938rem; /*border-bottom: 1px solid #eee;*/ text-align: left;
	}
	
	/*
	th:first-child,
	td:first-child {
		padding-left: 0;
	}
	
	th:last-child,
	td:last-child {
		padding-right: 0;
	}
	*/


/* Responsive layout grid -> http://cobyism.com/gridism/
	----------------------------------- */

.grid { display: block; clear: both; }
.grid .unit { float: left; width: 100%; padding: 0.625em; }

/* resize grid effects */
.grid,
.unit {
	-webkit-transition: all .25s ease-in-out;
	-moz-transition: 	all .25s ease-in-out;
	-o-transition: 		all .25s ease-in-out;
	transition: 		all .25s ease-in-out;
}

/* This ensures the outer gutters are equal to the (doubled) inner gutters. */
.grid .unit:first-child { padding-left: 1.250em; }
.grid .unit:last-child { padding-right: 1.250em; }

/* Nested grids already have padding though, so let's nuke it */
.unit .unit:first-child { padding-left: 0; }
.unit .unit:last-child { padding-right: 0; }
.unit .grid:first-child > .unit { padding-top: 0; }
.unit .grid:last-child > .unit { padding-bottom: 0; }

/* Let people nuke the gutters/padding completely in a couple of ways */
.no-gutters .unit,
.unit.no-gutters {
	padding: 0 !important;
}

.gutters .unit,
.unit.gutters {
	padding: 0.625em !important;
}

/* Wrapping at a maximum width is optional */
.wrap .grid,
.grid.wrap {
	max-width: 978px; margin: 0 auto;
}

/* grid units width */
.grid .w-1-1 { width: 100%; }
.grid .w-1-2 { width: 50%; }
.grid .w-1-3 { width: 33.3332%; }
.grid .w-2-3 { width: 66.6665%; }
.grid .w-1-4 { width: 25%; }
.grid .w-3-4 { width: 75%; }
.grid .w-1-5 { width: 20%; }
.grid .w-2-5 { width: 40%; }
.grid .w-3-5 { width: 60%; }
.grid .w-4-5 { width: 80%; }
	

/* #clearfix
	----------------------------------- */

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after,
/* Clearfix after every .grid */
.grid:before,
.grid:after {
	display: table; /* 2 */
	content: ""; /* 1 */
	line-height: 0;
}

.clearfix:after,
.grid:after {
	clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 * Clearfix after every .grid
 */
.clearfix,
.grid {
	*zoom: 1;
}


/* #utility misc.
	----------------------------------- */

.clear { clear: both; }
.clear-left { clear: left; }
.clear-right { clear: right; }
.abscenter { position: absolute; margin: auto; top: 0; right: 0; bottom: 0; left: 0; }
.float-left { float: left; }
.float-right { float: right; }
.align-center { text-align: center; }
.align-left { text-align: left; }
.align-right { text-align: right; }
.hide-on-mobile { display: none !important; width: 0; height: 0; }

.rotate {
	overflow: hidden;
	
	-moz-transition-duration: 		0.8s;
	-webkit-transition-duration: 	0.8s;
	-o-transition-duration: 		0.8s;
	transition-duration: 			0.8s;
	
	-webkit-transition-property: 	-webkit-transform;
	-moz-transition-property: 		-moz-transform;
	-o-transition-property: 		-o-transform;
	transition-property: 			transform;
} 
 
.rotate:hover {
    -moz-transform: 	rotate(360deg);
    -webkit-transform: 	rotate(360deg);
    -khtml-transform: 	rotate(360deg);
    -o-transform: 		rotate(360deg);
} 

/* #Site Styles
	----------------------------------- */

	/* no script warning */
	#nsm {
		position: fixed; width: 100%; line-height: 55px; top: 0; left: 0; padding: 5px 0;
		background: #c10000; text-align: center; font-weight: bold; font-size: 1em; color: #fff; z-index: 100;
	}
		.nsi {
			display: inline-block; width: 64px; height: 64px; background: url("../images/common/css-sprite.png") no-repeat 0 -240px; vertical-align: middle;
		}
	
	/* lt IE 9 warning */
	
	.iewarning { padding: 5px; background: #fffbb2; text-align: center; z-index: 9999; }
	.iewarning p { margin: 5px 0; font-size: 1em; }
	.iewarning ul { position: relative; clear: both; margin: 10px 0 0; }
	.iewarning ul li { display: inline; margin-right: 1.250em; }
	.iewarning ul li.norm { margin: 0; }


/* #Layout Styles
	----------------------------------- */

.page-wrap {
	position: relative;
	height: auto !important; /* real browsers */
	height: 100%; /* IE6: treaded as min-height */
	min-height: 100%; /* real browsers */
	margin: 0 auto -13.375em;
	z-index: 0;
}
.sticky-footer-push-hack { height: 13.375em; }

/* full container */
.fc100 { position: relative; width: 100%; z-index: 0; }
.fc100 .grid { padding: 0 0.625em; }

/* #Header
	----------------------------------- */

header,
div.html5header {
	min-height: 10em; height: auto !important; height: 10em; margin: 0; padding: 0;
}
.scroll-to-fixed-fixed .grid { padding-bottom: 0.5em; border-bottom: 1px dotted #073377; background-color: #fff; z-index: 25; }

	/* #Header props
	----------------------------------- */
	
	.fchd1 { padding: 0.25em 0 1em; background: #fff; z-index: 0; }
	
	/* #Navigation
	----------------------------------- */
	
	.logo { margin: 0 !important; padding: 0 !important; }
	.logo h1 {
		margin: 0 !important; padding: 0 !important; font-weight: 300 !important; font-size: 1.25em;
	}
	
	/* #Navigation
	----------------------------------- */
	
	.toggleMenu { display: none; width: 100%; margin: 0 auto 0.25em; padding: 0.625em 1em; font-size: 1.5em; color: #000; }
	.toggleMenu span { margin-right: 0.25em; }
	.menu { padding: 0 !important; padding-top: 2em; }
	
	/* menu */
	nav { clear: both; text-align: center; margin: 0 auto 1em; padding: 0; z-index: 20; }
	nav ul { margin: 1.125em 0 0; padding: 0 !important; list-style: none; }
	nav ul li { display: inline-block; margin: 0 !important; vertical-align: middle; }
	nav ul li img { vertical-align: middle; }
	nav ul li a { padding: 0.875em 0.25em; font-size: 1.5em; color: #06254b; }
	nav ul li a.selected:hover, nav ul li a:hover { background: #458ce3; color: #fff; }
	nav ul li a.selected { background: #102360; color: #fff; }
	nav ul li.langs { margin-left: 1em !important; }
	nav ul li.langs a { display: inline !important; background: none !important; }
	
	/* #Banner / Image slider
	----------------------------------- */
	
	#slider { position: relative; clear: both; margin: 0 auto; border-bottom: 1px dotted #073377; }
		
		/* slides */
		#slides { position: relative; height: 500px; clear: both; }
		#slides .slides-container { display: none; }
		#slides .scrollable {
			position: relative; *zoom: 1; overflow-y: auto; height: 100%; top: 0; left: 0;
			-webkit-overflow-scrolling: touch;
		}
		#slides .scrollable:after { display: table; clear: both; content: ""; }
		
		/* slides navigation */
		.slides-navigation { position: absolute; width: 100%; margin: 0 auto; top: 45%; z-index: 3; }
		.slides-navigation a { position: absolute; display: block; }
		.slides-navigation a.prev, .slides-navigation a.next { width: 48px; height: 48px; opacity: 0.7; }
		.slides-navigation a.prev { left: 10px; background: url("../images/slideshow/arrows.png") 0 0; }
		.slides-navigation a.next { right: 10px; background: url("../images/slideshow/arrows.png") -48px 0; }
		.slides-navigation a.prev:hover, .slides-navigation a.next:hover { opacity: 1; }
		
		/* slides pagination */
		.slides-pagination { position: absolute; width: 100%; bottom: 20px; text-align: center; z-index: 3; }
		.slides-pagination a {
			display: -moz-inline-stack; display: inline-block; *display: inline; width: 20px; height: 20px; margin-right: 0.25rem;
			border: 1px solid rgba(255,255,255,0.3); background: #000; text-indent: -100rem; overflow: hidden;
		}
		.slides-pagination a.current { background: #2a7cf7; }


/* #Sections
	----------------------------------- */

section,
div.html5section {
	width: 100%; text-align: left; font-size: 1.125em; color: #000; z-index: 0;
}
section h1,
section h2,
section h3,
div.html5section h1,
div.html5section h2,
div.html5section h3 {
	text-align: center; font-weight: 400; font-size: 1.75em; color: #073377;
}
section ul,
div.html5section ul {
	margin: 0; padding: 0; list-style: none;
}

	/* #breadcrumbs
	----------------------------------- */
	
	.breadcrumbs { position: relative; clear: both; min-height: 3em; height: auto !important; height: 3em; font-weight: 300 !important; color: #777; }
	.breadcrumbs a { font-weight: 300; color: #777; }
	.breadcrumbs a:hover { color: #2a7cf7; }
	.breadcrumbs h6 { padding-bottom: 0.375em; font-weight: 300 !important; font-size: 1.125em; color: 777; }
	
	/* #content
	----------------------------------- */
	
	.grid .unit p { margin: 0; padding: 0; font-size: 1em; }
	.page-content { margin-bottom: 2em !important; text-align: justify; }
	.page-content p { margin: 0.5em 0 !important; }
	.page-content p.heading { margin-top: 0 !important; font-weight: 700; font-size: 1.15em; color: #4aaaff; }
	.page-content p.warning { font-weight: 700; font-size: 1.75em; color: #f1c800; }
	.page-content .message { text-align: center; }
	.page-content.align-center { text-align: center; }
	
	/* #blockquote
	----------------------------------- */
	
	blockquote { margin: 1.5em 10px; padding: 0.5em 10px; border-left: 7px solid #ccc; quotes: "\201C""\201D""\2018""\2019"; }
	blockquote:before { line-height: 0.1em; margin-right: 0.25em; vertical-align: -0.5em; font-size: 5em; content: open-quote; color: #ccc; }
	blockquote p { display: inline; font-style: italic; }
	blockquote p span { display: block; font-style: normal; }
	blockquote p span.menzel { display: inline-block; vertical-align: middle; }
	
	/* #list overwrite
	----------------------------------- */
	
	ul.ul-list { margin-bottom: 1em; }
	ul.ul-list li {
		margin-bottom: 0.625em; padding-left: 1.875em; background: url("../images/common/check.png") no-repeat 0 0.25em; font-size: 1.15em !important;
	}
	ul.ul-list.circle { list-style-type: disc; }
	ul.ul-list.circle li { margin-left: 1em; padding-left: 0; background: none; }
	
	/* #Index services
	----------------------------------- */
	
	.grid.main-serv { margin-top: 2em; margin-bottom: 2em; text-align: center; }
	.main-serv img { text-align: center; }
	.grid.main-serv div { }
	.grid.main-serv .unit { min-height: 20em !important; height: auto !important; height: 20em !important; padding-top: 0.5em !important; }
	.main-serv div:hover {
		background: #f1f6fc;
		
		-webkit-box-shadow: 1px 3px 5px #d5e2f2;
		-moz-box-shadow:	1px 3px 5px #d5e2f2;
		box-shadow:			1px 3px 5px #d5e2f2;
	}
	
	.main-serv div:hover img {
		-moz-transform: 	rotate(360deg);
		-webkit-transform: 	rotate(360deg);
		-khtml-transform: 	rotate(360deg);
		-o-transform: 		rotate(360deg);
    }
	
	/* #Services
	----------------------------------- */
	
	.services { padding: 1.5em !important; border: 1px dotted #a0c9de; background: #f1f9fd; font-size: 0.938em !important; color: #102360; }
	
	.page-content table { margin-bottom: 0.5em;  }
	.page-content table tr td:nth-child(1) { width: 10%; }
	.page-content table tr td:nth-child(2) { width: 40%; }
	.page-content table tr td:nth-child(3) { width: 35%; }
	.page-content table tr td:nth-child(4) { width: 15%; }
	
	/* #Effects
	-----------------------------------
	[Article on Codrops] > http://tympanus.net/codrops/2014/06/19/ideas-for-subtle-hover-effects/
	*/
	
	.effects { display: block; position: relative; float: left; width: 33.3332%; height: auto; padding: 0; z-index: 0; }
	.effects figure {
		position: relative; overflow: hidden; width: 100%; margin: 0; padding: 0;
		background: #252525; vertical-align: middle; text-align: center; cursor: pointer;
	}
	.effects figure img { display: block; position: relative; width: 100%; opacity: 0.9; }
	.effects figure figcaption {
		padding: 0.25em; text-transform: uppercase; font-size: 1.15em; color: #fff;
		
		-webkit-backface-visibility: 	hidden;
		backface-visibility: 			hidden;
	}
	.effects figure figcaption::before,
	.effects figure figcaption::after {
		pointer-events: none;
	}
	.effects figure figcaption,
	.effects figure figcaption > a {
		position: absolute; width: 100%; height: 100%; top: 0; left: 0;
	}
	
	/* Anchor will cover the whole item by default */
	/* For some effects it will show as a button */
	.effects figure figcaption > a { white-space: nowrap; text-indent: 200%; font-size: 0; opacity: 0; }
	.effects figure h2 { word-spacing: 0.15em; font-weight: 300; font-size: 1em; color: #e4e1fb; }
	.effects figure p { word-spacing: -0.15em; font-weight: 300; font-size: 1em !important; color: #fff; }
	.effects figure p span { word-spacing: 0.15em; padding-left: 0.375em; font-weight: 700; }
	.effects figure h2,
	.effects figure p {
		text-align: center; margin: 0;
	}
	
	/* special effects */
	figure.effect-chico img {
		-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
		-moz-transition: 	opacity 0.35s, -moz-transform 0.35s;
		-o-transition: 		opacity 0.35s, -o-transform 0.35s;
		transition: 		opacity 0.35s, transform 0.35s;
		
		-webkit-transform: 	scale(1.12);
		-moz-transform: 	scale(1.12);
		-o-transform: 		scale(1.12);
		transform: 			scale(1.12);
	}
	
	figure.effect-chico:hover img {
		opacity: 0.5;
		
		-webkit-transform: 	scale(1);
		-moz-transform: 	scale(1);
		-o-transform: 		scale(1);
		transform: 			scale(1);
	}
	
	/* #customers
	----------------------------------- */
	
	.ads { clear: both; }
	.ads .unit { margin-bottom: 2em; }
	
	/* #customers
	----------------------------------- */
	
	.customers { text-align: center; }
	.customers .unit { min-height: 15em; height: auto !important; height: 15em; }
	.customers p.heading { margin-top: 0.25em; margin-bottom: 0.25em; font-weight: 700; font-size: 1.25em; color: #4aaaff; }
	
	/* #contact
	----------------------------------- */
	
	.contact { margin-bottom: 2em !important; }
	.contact h3,
	.contact p.heading {
		font-weight: 700; font-size: 1.5em; color: #4aaaff;
	}
	.contact p.heading { margin-top: 0.25em; margin-bottom: 0.25em; font-size: 1em; }
	
	/* #Google Maps
	----------------------------------- */
	
	#google-map {
		position: relative; min-height: 37em; height: auto !important; height: 37em; border: 0.25em solid #f5f1f1;
		
		-webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);
		-moz-box-shadow: 	0 3px 5px rgba(0, 0, 0, 0.5);
		box-shadow: 		0 3px 5px rgba(0, 0, 0, 0.5);
	}
	

/* #Footer
	----------------------------------- */

footer,
div.html5footer {
	position: relative; width: 100%; margin: 0; padding: 0; background: #06254b; font-size: 1.125em; color: #fff;
}
footer a,
div.html5footer a {
	color: #fff;
}

	/* #Footer props
	----------------------------------- */
	
	.fcft1 { padding-top: 1.5em; padding-bottom: 1.5em; border-top: 1px dotted #eee; }
	
	/* #Web Design Author
	----------------------------------- */
	
	.webdesign { font-size: 0.875em !important; color: #fff; }
	.webdesign a { font-size: 0.875em !important; color: #fff; }
	.webdesign a:hover { color: #fff; }
	.webdesign em { font-style: normal; font-weight: 400; color: #5e9f1f; }
	.webdesign strong { color: #fff; }
	.webdesign strong em { color: #fff; }
	
	/* #Ads
	----------------------------------- */
	
	.ads { margin-top: 1em; }
	
	/* #Certificates
	----------------------------------- */
	
	.unit.certificates {
		padding: 0.625em !important; /*background: #fff;*/ text-align: center;
		
		/*-moz-box-shadow: 	inset 0 0 10px #888;
		-webkit-box-shadow: inset 0 0 10px #888;
		box-shadow: 		inset 0 0 10px #888;*/
	}
	.unit.certificates img { margin-right: 0.5em; }
	.unit.certificates img:last-child { margin-right: 0; }
	
	/* #Social links
	----------------------------------- */
	
	.social { text-align: right; }
	.social a { display: inline-block; margin-right: 0.5em; }
	.social a span { display: inline-block; }
	.social a img { margin-right: 0.625em; margin-bottom: 0.625em; vertical-align: middle; }
	
	/* #Go Top
	----------------------------------- */
	
	a#gotop {
		display: none; position: fixed; width: 48px; height: 48px; right: 0; bottom: 75px;
		background: url("../images/common/gotop.png") no-repeat; opacity: 0.7; z-index: 100;
	}
	a:hover#gotop { opacity: 1; }


/* #Common HTML 5 props
	----------------------------------- */

header .grid,
div.html5header .grid,
section .grid,
div.html5section .grid,
footer .grid,
div.html5footer .grid {
	padding: 0 0.625em;
}


/*	#Plugin: fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license
	-------------------------------------------------- */

.fancybox-wrap,
.fancybox-skin,
.fancybox-outer,
.fancybox-inner,
.fancybox-image,
.fancybox-wrap iframe,
.fancybox-wrap object,
.fancybox-nav,
.fancybox-nav span,
.fancybox-tmp {
	padding: 0; margin: 0; border: 0; outline: none; vertical-align: top;
}

.fancybox-wrap { position: absolute; top: 0; left: 0; z-index: 8020; }
.fancybox-skin { position: relative; background: #f9f9f9; text-shadow: none; color: #444; }
.fancybox-opened { z-index: 8030; }
.fancybox-opened .fancybox-skin {
	-webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 	0 10px 25px rgba(0, 0, 0, 0.5);
	box-shadow: 		0 10px 25px rgba(0, 0, 0, 0.5);
}
.fancybox-outer,
.fancybox-inner {
	position: relative;
}

.fancybox-inner { overflow: hidden; }
.fancybox-error {
	margin: 0; padding: 15px; white-space: nowrap; font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; color: #444;
}

.fancybox-image,
.fancybox-iframe {
	display: block; width: 100%; height: 100%;
}
.fancybox-type-iframe .fancybox-inner {
	-webkit-overflow-scrolling: touch;
}
.fancybox-image { max-width: 100%; max-height: 100%; }

#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
	background-image: url('../images/jquery.fancybox/fancybox_sprite.png');
}
#fancybox-loading {
	position: fixed; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; background-position: 0 -108px;
	opacity: 0.8; cursor: pointer; z-index: 8060;
}
#fancybox-loading div {
	width: 44px; height: 44px; background: url('../images/jquery.fancybox/fancybox_loading.gif') center center no-repeat;
}

.fancybox-close { position: absolute; width: 36px; height: 36px; top: -18px; right: -18px; cursor: pointer; z-index: 8040; }
.fancybox-nav {
	position: absolute; width: 40%; height: 100%; top: 0; background: transparent url('../images/jquery.fancybox/blank.gif');
	cursor: pointer; z-index: 8040;
	
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.fancybox-prev { left: 0; }
.fancybox-next { right: 0; }
.fancybox-nav span {
	position: absolute; visibility: hidden; width: 36px; height: 34px; margin-top: -18px; top: 50%; cursor: pointer; z-index: 8040;
}
.fancybox-prev span { left: 10px; background-position: 0 -36px; }
.fancybox-next span { right: 10px; background-position: 0 -72px; }
.fancybox-nav:hover span { visibility: visible; }

.fancybox-tmp {
	position: absolute; visibility: hidden; max-width: 99999px; max-height: 99999px; top: -99999px; left: -99999px;
	overflow: visible !important;
}

/* Overlay helper */
.fancybox-lock { width: auto; overflow: hidden !important; }
.fancybox-lock body { overflow: hidden !important; }
.fancybox-lock-test { overflow-y: hidden !important; }
.fancybox-overlay {
	display: none; position: absolute; top: 0; left: 0; overflow: hidden;
	background: url('../images/jquery.fancybox/fancybox_overlay.png'); z-index: 8010;
}
.fancybox-overlay-fixed { position: fixed; right: 0; bottom: 0; }
.fancybox-lock .fancybox-overlay { overflow: auto; overflow-y: scroll; }

/* Title helper */
.fancybox-title {
	position: relative; visibility: hidden; text-shadow: none;
	font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; z-index: 8050;
}
.fancybox-opened .fancybox-title { visibility: visible; }
.fancybox-title-float-wrap { position: absolute; margin-bottom: -35px; right: 50%; bottom: 0; text-align: center; z-index: 8050; }

.fancybox-title-float-wrap .child {
	display: inline-block; line-height: 24px; margin-right: -100%; padding: 2px 20px;
	background: transparent; /* Fallback for web browsers that doesn't support RGBa */
	background: rgba(0, 0, 0, 0.8); font-weight: bold; white-space: nowrap; color: #fff;
	text-shadow: 			0 1px 2px #222;
}
.fancybox-title-outside-wrap { position: relative; margin-top: 10px; color: #fff; }
.fancybox-title-inside-wrap { padding-top: 10px; }
.fancybox-title-over-wrap {
	position: absolute; bottom: 0; left: 0; padding: 10px; color: #fff; background: #000; background: rgba(0, 0, 0, .8);
}

/* Retina graphics! */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
	   only screen and (min--moz-device-pixel-ratio: 1.5),
	   only screen and (min-device-pixel-ratio: 1.5){

	#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
		background-image: url('../images/jquery.fancybox/fancybox_sprite@2x.png');
		background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/
	}

	#fancybox-loading div {
		background-image: url('../images/jquery.fancybox/fancybox_loading@2x.gif');
		background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/
	}
}


/* #Common styles
	----------------------------------- */
	
	/* #Image sprites
	----------------------------------- */
	
	.icb { display: inline-block; vertical-align: middle; }
	.icb.p64x64 { width: 48px; height: 48px; }
	.icb.p48x48 { width: 48px; height: 48px; }
	.icb.p32x32 { width: 32px; height: 32px; }
	.icb.p24x24 { width: 24px; height: 24px; }
	.icb.p16x16 { width: 16px; height: 16px; }
	.icb.info { background: url("../images/common/css-sprite.png") no-repeat 0 -144px; }
	.icb.firefox { background: url("../images/common/css-sprite.png") no-repeat 0 -192px; }
	.icb.opera { background: url("../images/common/css-sprite.png") no-repeat -48px -192px; }
	.icb.chrome { background: url("../images/common/css-sprite.png") no-repeat -96px -192px; }
	.icb.safari { background: url("../images/common/css-sprite.png") no-repeat -144px -192px; }
	.icb.ie { background: url("../images/common/css-sprite.png") no-repeat -192px -192px; }
	.icb.alert { background: url("../images/common/css-sprite.png") no-repeat -96px -0; }
	.icb.frmerr { background: url("../images/common/css-sprite.png") no-repeat -112px 0; }
	.icb.menu-100p { background: url("../images/common/css-sprite.png") no-repeat 0 -80px; }
	
	/* #Site messages
	----------------------------------- */
	
	.message { display: block; clear: both; margin: 2px 0; padding: 5px 5px 5px 0; font-size: 1em; }
	.msg-success div, .msg-error div, .msg-warning div, .msg-tip div {
		display: inline-block; width: 16px; height: 16px; margin-right: 5px; vertical-align: middle;
		background: url("../images/common/css-sprite.png") no-repeat scroll 0 0 transparent;
	}
	.msg-success big, .msg-warning big, .msg-error big, .msg-tip big { font-weight: bold; font-size: 1em; }
	
	.msg-success div { } .message.msg-success, .message.msg-success a { color: #3d9711; }
	.msg-error div { background-position: -16px 0; } .message.msg-error, .message.msg-error a { color: #df0510; }
	.msg-warning div { background-position: -32px 0; } .message.msg-warning, .message.msg-warning a { color: #d87b0e; }
	.msg-tip div { background-position: -48px 0; } .message.msg-tip, .message.msg-tip a { color: #000; }
	.msg-options div { background-position: -64px 0; }


/* #Media Queries
	----------------------------------- */
	
	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 480px){
		
		/* #Tables
		末末末末末末末末末末末末末末末末末末末末末末末末末 */
		
		table { border: 1px solid #777; /*border: 0;*/ }
		table thead { display: none; }
		table tr { display: block; margin-bottom: 0.5rem; border-bottom: 1px solid #ddd; }
		table td { display: block; border-bottom: 1px solid #ccc; text-align: right; font-size: 0.875em; }
		table tr td:first-child { font-weight: 700; color: #2a7cf7; }
		table td:last-child { border-bottom: 0; }
		table td:before { float: left; content: attr(data-label); text-transform: uppercase; font-weight: 700; font-size: 0.65em; }
		
		/* #Index services
		----------------------------------- */
		
		.grid.main-serv div { min-height: auto; height: auto !important; height: auto; padding-bottom: 0.5em !important; }
		
		/* #Services
		----------------------------------- */
		
		.page-content table tr td { width: auto !important; }
		
	}
	
	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 481px) and (max-width: 768px){}
	
	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 768px){
		
		.boxfc100 { width: 100% !important; }
		.boxclear { clear: both; }
		
		/* #Navigation
		----------------------------------- */
		
		.toggleMenu { display: block; }
		.showNavMenu { display: table; }
		.menu { padding-top: 0; }
		nav { display: none; }
		nav ul li a { padding: 0.5em 0.25em; background: none !important; font-size: 1.5em; }
		nav ul li a:hover, nav ul a.selected { color: #2a7cf7 !important; }
		nav ul li.langs { display: block; margin-top: 1em !important; margin-left: 0 !important; }
		
		/* #Web Design Author
		----------------------------------- */
		
		.webdesign p span:nth-child(2) { display: block; }
		
		/* #Certificates
		----------------------------------- */
		
		.unit.certificates { margin-top: 1em !important; }
		
		/* #Social
		----------------------------------- */
		
		.unit.social { margin-top: 1em; }
		
		/* Sometimes, you just want to be different on small screens */
		.center-on-mobiles { text-align: center !important; }
		.hide-on-mobiles { display: none !important; }
	}
	
	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 769px) and (max-width: 960px){}
	
	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 960px){
		
		/* #Social links
		----------------------------------- */
		
		.social a span { display: none; }
	}
	
	/* Expand the wrap a bit further on larger screens */
	@media screen and (min-width: 1024px){
		.wrap .grid { max-width: 1024px; }
	}


/* HTML5 Boilerplate Print styles. Inlined to avoid required HTTP connection: h5bp.com/r
	----------------------------------- */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

	a,
	a:visited {
		text-decoration: underline;
	}
	
	a[href]:after { content: " (" attr(href) ")"; }
	
	abbr[title]:after { content: " (" attr(title) ")"; }
	
	/* Don't show links for images, or javascript/internal links */
	
	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after {
		content: "";
	}
	
	pre,
	blockquote {
		border: 1px solid #999;
		page-break-inside: avoid;
	}
	
	thead { display: table-header-group; /* h5bp.com/t */ }
	
	tr,
	img {
		page-break-inside: avoid;
	}
	
	img { max-width: 100% !important; }
	
	@page { margin: 0.5cm; }
	
	p,
	h2,
	h3 {
		orphans: 3;
		widows: 3;
	}
	
	h2,
	h3 {
		page-break-after: avoid;
	}
}