@charset "utf-8";
@import url(//fonts.googleapis.com/css?family=PT+Sans:400,700);
@import url(//fonts.googleapis.com/css?family=Roboto+Sans:400,700);
@import url(//fonts.googleapis.com/css?family=Lobster,400);
@import url(//fonts.googleapis.com/css?family=Nunito+Sans:400,700);
@import url(//fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700);
@import url(//fonts.googleapis.com/css?family=Armata,700);
@import url(//fonts.googleapis.com/css?family=Electrolize:400,700);
@import url(//fonts.googleapis.com/css?family=Orbitron:400,500,700,900,700);
/* font-family: "Electrolize"; */
/*<link href="//fonts.googleapis.com/css?family=Electrolize:400" rel="stylesheet" type="text/css">*/
/*<link href="//fonts.googleapis.com/css?family=Orbitron:400,500,700,900" rel="stylesheet" type="text/css">*/
/*
font-family: "Orbitron";
font-style: normal;
font-weight: 400;
*/
.cc {
	display:inline-block;
}

body { margin: 0px; padding: 0px; font-size: 100%; background: url("bg-footer2.jpg") repeat;
font-family: 'Electrolize'; }
p {	margin: 0px; padding: 0px; font-size: 100%; }
h1 { margin: 0px; padding: 0px; font-size: 100%; }
h2 { margin: 0px; padding: 0px; font-size: 100%; }
h3 { margin: 0px; padding: 0px; font-size: 100%; }
h4 { margin: 0px; padding: 0px; font-size: 100%; }
h5 { margin: 0px; padding: 0px; font-size: 100%; }
h6 { margin: 0px; padding: 0px; font-size: 100%; }
ul { margin: 0px; padding: 0px; font-size: 100%; }
ol { margin: 0px; padding: 0px; font-size: 100%; }
li { margin: 0px; padding: 0px; font-size: 100%; }
dl { margin: 0px; padding: 0px; font-size: 100%; }
dt { margin: 0px; padding: 0px; font-size: 100%; }
dd { margin: 0px; padding: 0px; font-size: 100%; }
table { margin: 0px; padding: 0px; font-size: 100%; }
th { margin: 0px; padding: 0px; font-size: 100%; }
td { margin: 0px; padding: 0px; font-size: 100%; }
form { margin: 0px; padding: 0px; font-size: 100%; }
fieldset { margin: 0px; padding: 0px; font-size: 100%; }
legend { margin: 0px; padding: 0px; font-size: 100%; }
input { margin: 0px; padding: 0px; font-size: 100%; }
textarea { margin: 0px; padding: 0px; font-size: 100%; }
button { margin: 0px; padding: 0px; font-size: 100%; }
select { margin: 0px; padding: 0px; font-size: 100%; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset { border: 0px currentColor; }
img { border: 0px currentColor; }
address { font-style: normal; font-weight: normal; }
caption { font-style: normal; font-weight: normal; }
em { font-style: normal; font-weight: normal; }
ul { list-style: none; }
ol { list-style: none; }
dl { list-style: none; }
hr { display: none; }
button { margin: 0px; padding: 0px; border: 0px currentColor; overflow: visible; cursor: pointer; }
caption { margin: 0px; padding: 0px; border: currentColor; line-height: 0; font-size: 0px; visibility: hidden; }
legend { left: -9999px; top: -9999px; width: 1px; height: 1px; line-height: 0; text-indent: -9999px; overflow: hidden; font-size: 0px; display: block; position: absolute; }
input {	font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; }
button { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; }
textarea { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; }
select { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; }
option { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; }

body { font-family:'Electrolize'; color: rgb(181, 181, 181); font-size-adjust: none; font-stretch: normal; }
html { line-height: 13px; }
body { 	line-height: 13px; }
a:link { color: rgb(181, 181, 181); text-decoration: none; }
a:visited { color: rgb(181, 181, 181); text-decoration: none; }
a:active { color: rgb(181, 181, 181); text-decoration: none; }
a:focus { color: rgb(196, 6, 69); }
a:hover { color: #CCC; }
label { cursor: pointer; }
.hide { display: none; }
.hidden { left: -9999px; top: -9999px; width: 1px; height: 1px; line-height: 0; text-indent: -9999px; overflow: hidden; font-size: 0px; display: block; position: absolute; }
.clearfix { }
.clearfix::after { clear: both; display: block; content: ""; }
html { overflow: scroll; -ms-overflow-x: auto; }
body { }
#content {   }
#realisations { margin:auto; width:90%; height:auto;  }
#realisations .img { width:100%; }
#header { background: url("back-menu.png") repeat 50% 80px; left: 0px; vertical-align:middle; bottom: 0px; width: 100%; overflow: visible; position: fixed; z-index: 9999; height:80px; } 
#header-mission { background: url("back-menu-darker.png") repeat 50% 70px; left: 0px; vertical-align:middle; bottom: 0px; width: 100%; overflow: visible; position: fixed; z-index: 9999; height:auto; } 
#header2 {background: url("back-menu.png") repeat 50% 80px;  left: 0px; vertical-align:middle; bottom: 80px; width: 100%; padding:5px; overflow: visible; position: fixed; z-index: 111; height:70px; padding-top:15px; padding-bottom:5px; }
#header2-tel {font-size:16px; color:#888; }
#header2-address {float:right; padding-right:20px; padding-top:5px; color:#888; }
#header2-social {float:right; padding-right:1%; }
#header-darker { background: url("bg-menu-darker.png") repeat 50% 60px; left: 0px; bottom: 0px; width: 100%; overflow: visible; position: fixed; z-index: 450; height:auto; padding-bottom:20px; }
#header .clearfix { height: 30px; }
#header-darker .clearfix { height: 30px; }


.left-column
{
float:left;
width:0%;
display:none;
}
.right-column
{
float:right;
width:0%;
display:none;
}
.center-column
{
	width:100%;
	text-align:left;
}
.left-1 {
	float:left;
	width:23%;
	padding:0px;
	padding-top:15px;
	text-align:right;
	vertical-align:middle;
}

.left-2 {
	float:right;
	width:76%;
	padding:0px;
	padding-top:13px;
	text-align:right;
	vertical-align:middle;
}

.left-1 img {width:100%; margin-top:5px;  }

.menu-header {
	margin:auto;
	max-width:1100px;
	z-index:9999999;
}


/*Initialize*/
ul#menu {
	z-index:999999;
	height:100%;
	padding:0;
    margin: 0;
	/*background: url("back-menu.png") repeat 50% 65px;*/
}
ul#menu:hover{
     display:block;
}
ul#menu ul.sub-menu {
    padding:0px;
    margin: 0;
	width:100%
	margin-left:10px;
	background-color:#333;
	z-index:9999999;
}
ul#menu li {
    list-style-type: none;
    display: inline-block;
	/*border-right:1px solid #888888;*/
	color: #FFF;
	font-size:0.8em;
	font-weight:none;
	letter-spacing:1px;
	text-transform:uppercase;
	font-family: "Orbitron";
	font-style: normal;
	font-weight: none;
}
ul#menu ul.sub-menu li {
    list-style-type: none;
    display: inline-block;
	width:200px;
	padding-left:17px;
	border-right:none;
	background: url("bg-menu.png") repeat;
	background-color:#333;
	z-index:9999999;
}

/*Link Appearance*/

ul#menu li a {
    text-decoration: none;
    color: #FFF;
    padding: 10px;
    display:inline-block;
	text-transform:uppercase;
	padding-top:22px;
	text-align:left;
}
ul#menu li a:hover {
    color: #CCC;
}
/*Link Appearance*/

ul#menu li ul.sub-menu li a {
    text-decoration: none;
    color: #FFF;
    padding-left:10px;
	padding-top:10px;
	padding-bottom:10px;
	text-transform:uppercase;
    display:block;
	border-bottom:1px solid #717171;
}
ul#menu li ul.sub-menu li a:hover {
	color:#888;
}


/*Make the parent of sub-menu relative*/
ul#menu li {
    position: relative;
}
/*sub menu*/
ul#menu li ul.sub-menu {
    display:none;
    position: absolute;
    bottom: 30px;
    left: 0;
    width: 100px;
	z-index:1000000000000000000020;
}
ul#menu li:hover ul.sub-menu {
    display:block;
}
.menu5_light { color:#ccc; }
.menu5_dark { color:#fff; }

/* MENU BOTTOM NEW */




#header h1 { padding: 9px 0px 0px 15px; float: left; }
#header-darker h1 { padding: 9px 0px 0px 15px; float: left; }


/* IMAGE HOVER */



.view {
   width: 225px;
   height: 225px;
   margin: 7px;
   float: left;
   /*border: 5px solid #fff;*/
   overflow: hidden;
   position: relative;
   text-align: center;
   box-shadow: 0px 0px 5px #aaa;
   cursor: default;
}

.view .mask, .view .content {
   width: 225px;
   height: 225px;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}

.view img {
   display: block;
   position: relative;
}

.view a.info {
   background:url(zonn-icon.png) center no-repeat;
   display: inline-block;
   text-decoration: none;
   padding:0;
   text-indent:-9999px;
   width:31px;
   height:31px;
}

.second-effect .mask {
   opacity: 0;
   overflow:visible;
   border:0px solid rgba(255,255,255,0.5);
   box-sizing:border-box;
   transition: all 0.4s ease-in-out;
}

.second-effect a.info {
   position:relative;
   top:-10px;
   opacity:0;
   transform:scale(0,0);
   transition: transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
}

.second-effect:hover .mask {
   opacity: 1;
   border:100px solid rgba(0,0,0,0.7);
}

.second-effect:hover a.info {
   opacity:1;
   transform:scale(1,1);
   transition-delay:0.3s;
}


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

.boxgrid{
	width: 225px;
	height: 225px;
	margin:10px;
	float:left;
	background:#161613;
	border: solid 2px #8399AF;
	overflow: hidden;
	position: relative;
}
.boxgrid img{
	position: absolute;
	top: 0;
	left: 0;
	border: 0;
}
.boxcaption{
	float: left;
	position: absolute;
	background: #000;
	height: 100px;
	width: 100%;
	opacity: .8;
	/* For IE 5-7 */
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
	/* For IE 8 */
	-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
 }
  .captionfull .boxcaption {
 	top: 260;
 	left: 0;
 }
 .caption .boxcaption {
 	top: 220;
 	left: 0;
 }
/* ------------------------ */


/* IMAGE HOVER */


.change_opacity:hover{
	/* FIRST (order is important) */
	opacity: 0.6;
	/* SECOND (IE8) */
	-ms-filter:”progid:DXImageTransform.Microsoft.Alpha(Opacity=60)”;
	/* THIRD (IE7) */
	filter: alpha(opacity=60);
} 

.img-over1{
	/* FIRST (order is important) */
	opacity: 0.7;
	/* SECOND (IE8) */
	-ms-filter:”progid:DXImageTransform.Microsoft.Alpha(Opacity=70)”;
	/* THIRD (IE7) */
	filter: alpha(opacity=70);
} 
.img-over:hover{
	/* FIRST (order is important) */
	opacity: 0.9;
	/* SECOND (IE8) */
	-ms-filter:”progid:DXImageTransform.Microsoft.Alpha(Opacity=90)”;
	/* THIRD (IE7) */
	filter: alpha(opacity=90);
} 



.img-gal {
	
}
.img-gal li {
    padding-right:10px;
}

/* Image Gallery */

ul#list-of-items {
	margin-left:10px;	
}
ul#list-of-items li {
    list-style-type:square;
	margin-left:10px;
	padding-bottom:15px;
}






.contents { margin: 0px auto; width: 960px; min-height: 160px;}
.first {padding-right:11px; padding-left:15px}
.second {padding-right:11px;}
.third {padding-right:11px;}
.fourth { padding:0px;}
.title {display:block; }

.header-items { text-transform:uppercase; font-size:36px; padding-left:15px; padding-bottom:25px; }


#sns_area { bottom: 130px; right: 20px; position: absolute; z-index:999; }
#sns_area a { margin: 0px; font-size:16px; display: inline-block; }
#parallax { overflow: hidden; position: relative; }
.fixed_bg {	background: url("../images/contents/bg_shadow.png") no-repeat 50% 0px; left: 0px; top: 60px; width: 100%; height: 100%; position: fixed; }
#parallax_container { height: 100%; width:100%; }
#parallax_container .show { display: block; }
.fixed_contents { left: 0px; top: 60px; width: 100%; height: 100%; position: fixed; z-index: 100; }
.fixed_contents > img { display: none; position: absolute; }
.bg_visual1 { margin: 0px 0px 0px -1100px; left: 50%; top: -30px; position: fixed; }
.bg_visual2 { margin: 0px 0px 0px -1164px; left: 50%; top: -10px; display: none; position: fixed; }
.bg_visual3 { margin: 0px 0px 0px -1020px; left: 50%; top: 60px; display: none; position: fixed; }
.fixed_contents_comments { left: 0px; bottom: 140px; width: 100%; height: 100%; position: fixed; z-index: 100; }
#sns_contact_form { bottom: 140px; right: 20px; position: absolute; }
#content-items {z-index:900; }

h2 {
  font: bold 14px/60px 'PT Sans', 'Trebuchet MS', Arial, "Helvetica Neue", Helvetica, sans-serif;
  text-transform: uppercase;
  color: #ffffff;
  letter-spacing: 2px;
  margin-bottom: 10px;
}
h3 {
  font: 700 16.400000000000002px 'Arial', sans-serif;
  line-height: 1.2em;
  color: #6e6e6e;
  text-transform: uppercase;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 52px 0px;
  letter-spacing: 2px;
}
#realisations {
	width:90%;
	max-width:1000px;
	margin:auto;
}

/*========================= jCarousel ===============================*/
#middle-area {
	margin:auto;
	max-width:1000px;
}

#middle-area {
  width: 100% !important;
}
#middle-area > ul {
  width: 100%;
  list-style: none;
  box-shadow: none;
  margin: 0;
}
#middle-area > ul > li {
  width: 32%;
  position: relative;
  float: left;
  margin-right: 1.2%;
}
#middle-area > ul > li > a  {
  width: 100%;
  height:auto;
  position: relative;
  display: inline-block;
}
.btnHolder1 {
  position: absolute;
  top: 170px;
  width: 62px;
  z-index: 1;
  right: 100px;
}
.btnHolder1 .prevBtn {
  float: left;
}
.btnHolder1 .nextBtn {
  float: right;
}
.btnHolder1 a {
  position: relative;
  width: 30px;
  height: 30px;
  overflow: hidden;
  margin-left: 1px;
}
.btnHolder1 a img {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.btnHolder1 a:hover img {
  top: -30px;
  left: 0;
}
/*========================= jCarousel ===============================*/

.list2 {
  margin-top: 34px;
  margin-bottom: 0px;
}
.list2 li {
  margin-bottom: 33px;
}
.list2 li.bottom {
  margin-bottom: 0;
}
.list2 li > a {
  position: relative;
  display: block;
  overflow: hidden;
  margin-bottom: 0px;
}
.list2 li div h5 {
  margin-bottom: 0px;
}
.list2 li div p {
  padding-bottom: 0px;
  margin-bottom: 0;
}
.thumbnail {
  box-shadow: none;
  border: none;
  padding: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  -webkit-box-shadow: 0 0 0;
  -moz-box-shadow: 0 0 0;
  box-shadow: 0 0 0;
}
.thumbnail:hover {
  border-color: transparent;
  -webkit-box-shadow: 0 0 0;
  -moz-box-shadow: 0 0 0;
  box-shadow: 0 0 0;
}
.mar_t_1 {
  margin-top: 10px;
  font-size:0.9em;
}
.pad_b_2 {
  padding-bottom: 20px;
}







@charset "utf-8";
/* CSS Document */
/* ----------------- thumbnails label  -------------------- */
.largeLabel{
	margin: 0px !important;
	padding: 0px !important;
	margin-right: 10px !important;
	margin-left: 10px !important;
	font-size:16px !important;
	font-weight:400 !important;
	line-height:20px !important;
	color:#FFFFFF !important;
	text-align:center !important;
}

.smallLabel{
	margin: 6px !important;
	margin-bottom:0px !important;
	padding: 0px !important;
	margin-right: 10px !important;
	margin-left: 10px !important;
	font-size:13px !important;
	line-height:16px !important;
	color:#AAAAAA !important;
	text-align:center !important;
}

/* -------- lighbox description window  ---------- */
.mediaDescriptionHeader{
	margin: 6px !important;
	margin-right: 10px !important;
	font-size:22px !important;
	line-height:22px !important;
	color:#fff;
	font-family: 'Electrolize';
}

.mediaDescriptionText{
	margin: 6px !important;
	margin-right: 10px !important;
	font-size:13px !important;
	line-height:18px !important;
	margin-bottom:8px;
	color:#fff;
	font-family: 'Electrolize';
}
p {
	margin: 6px !important;
	margin-right: 10px !important;
	font-size:13px !important;
	line-height:18px !important;
	margin-bottom:8px;
	color:#fff;
	font-family: 'Electrolize';
}
.mediaDescriptionText p{
	margin: 6px !important;
	margin-right: 10px !important;
	font-size:13px !important;
	line-height:18px !important;
	margin-bottom:8px;
	color:#fff;
	font-family: 'Electrolize';
}


/*  MISSION - PAGE SLIDER */


.page_anim_main_container {
	background:transparent;
	display:block;
	height:auto;
	margin:0;
	overflow:hidden;
	padding:0;
	position:absolute;
	width:auto;
}
	.page_anim_main_container .row {/*A horizontal row which holds any number of slides. Take note that all slides inside a row are not stacked on top of one another - they are next to each other.*/
		background:transparent;
		display:block;
		height:100%;/*This is set to the full height of the viewing window (usually the browser window, and is defined in the jQuery file). */
		margin:0;
		overflow:hidden;
		padding:0;
		position:relative;
		width:300%;/*This value should be set to:  100% * [number of slides in the longest row].  This value is overidden by a dynamically calculated value in jQuery.*/
	}
		.page_anim_main_container .slide {
			background:transparent;
			display:block;
			float:left;/*Slides are floated to the left so that they stack horizontally, and not vertically.*/
			height:100%;/*This means the slide will be as tall as its '.row' parent.*/
			margin:0;
			overflow:auto;/*If you have lots of content in a slide, we want the user to scroll to view the overflow.*/
			padding:0;
			position:relative;
			width:33.3333%;/*This value should be set to:  100% / [number of slides in the largest '.row']. This width is overidden in jQuery.*/
		}
	.page_anim {/*This holds the navigation buttons which advance to a specific slide when clicked.*/
		position:fixed;/*We want the navigation to be visible regardless of what slide we're on.*/
		_position:absolute;/*IE6 hack - it doesn't recognize fixed positioning. If you want your stylesheet to validate, just put this line into a separate IE6 stylesheet via conditional comments.*/
		width:auto;
		z-index:1000000000000000000000;/*The nav should be visible on top of the slider.*/
		/*It's best not to edit the styles above - you can edit the styles below.*/
		background:transparent;
		bottom:70px;
		right:0px;
		color:white;
		display:block;
		height:auto;
		margin:0;
		padding:5px 20px 10px 50px;
		right:4px;
		
	}
	.activeSlide0 {
		background: url("full-page-00-s.jpg") repeat 50% 70px;	
	}
	.activeSlide1 {
		background: url("full-page-01-s.jpg") repeat 50% 70px;
	}
	.activeSlide2 {
		background: url("full-page-02-s.jpg") repeat 50% 70px;
	}
	.activeSlide3 {
		background: url("full-page-03-s.jpg") repeat 50% 70px;
	}
	.activeSlide4 {
		background: url("full-page-04-s.jpg") repeat 50% 70px;
	}
	.activeSlide5 {
		background: url("full-page-05-s.jpg") repeat 50% 70px;
	}
	.activeSlide6 {
		background: url("full-page-06-s.jpg") repeat 50% 70px;
	}
	.activeSlide7 {
		background: url("full-page-07-s.jpg") repeat 50% 70px;
	}
	.activeSlide8 {
		background: url("full-page-09-s.jpg") repeat 50% 70px;
	}
		.page_anim .pageAnimate_trigger {/*When clicked, this will advance the user to a particular slide. The styles below are simply personal preference - change to whatever you want. Triggers can be automatically added to the HTML file by the pageAnimate jQuery script.*/
			background-color:rgba(0,0,0,.3);
			border:1px #333 solid;
			color:#333;
			display:inline-block;
			font-family:'PT Sans';
			font-size:18px;
			height:15px;
			margin:5px;
			outline:none;
			position:relative;
			width:15px;
			border:1px #333 solid;
		}
		
		.page_anim.pageAnimate_trigger:hover {
			background-color:rgba(0,0,0,.6);
		}
		.page_anim .pageAnimate_triggerActive, .page_anim .pageAnimate_triggerActive:hover {/*This class is added to the trigger just clicked by jQuery. Of course, if you don't want this to happen, just disable it in the script settings.*/
			background-color:rgba(0,0,0,.6);
			border:1px #333 solid;
		}
		.page_anim .pageAnimate_triggerActive:hover {/*This class is added to the trigger just clicked by jQuery. Of course, if you don't want this to happen, just disable it in the script settings.*/
			background-color:rgba(0,0,0,.9);
			border:1px #333 solid;
		}

		.container_index { padding: 5px 0px 0px 0px;  position: fixed; width:100%; bottom:80px; height:auto; background: url("back-menu.png") repeat; text-align:center;}
		.container_index-video { padding: 20px 0px 0px 0px;  position: fixed; width:100%; top:5%; height:auto;
		}
		.container_inside-video { margin:auto; text-align:center;}
		.container_inside { margin:0px; padding-top:50px;}
		
		#header2 h1 {
			text-decoration: none;
			color: #FFF;
			margin:0px;
			font-size:1.6em;
			text-transform:uppercase;
			padding-top:15px;
			text-transform:uppercase;
			font-family: "Orbitron";
			font-style: normal;
			font-weight: 400;
			letter-spacing:3px;

		}
		#header2 h2 {
			text-decoration: none;
			color: #FFF;
			margin:0px;
			font-size:1.3em;
			text-transform:uppercase;
			padding-top:3px;
			margin-bottom:10px;
			text-transform:uppercase;
			font-family: "Orbitron";
			font-style: normal;
			font-weight: 400;
			letter-spacing:3px;
		}
		.container_index h1 {
			text-decoration: none;
			color: #FFF;
			margin:0px;
			font-size:1.0em;
			display:inline-block;
			text-transform:uppercase;
			padding-top:12px;
			font-family: 'Armata', sans-serif;
			letter-spacing:3px;

		}
		
		.container_index h2 {
			text-decoration: none;
			color: #FFF;
			font-size:1.0em;
			margin:0px;
			display:inline-block;
			text-transform:uppercase;
			padding-top:12px;
			font-family: 'Armata', sans-serif;
		}
		.container_index h1 a{
			font-size:22px;
			color:#FFF;
		}
		.container_index h1 a:hover {
			color:#FFF;
		}
		
		
		#div_gallery {
			font-size:1.1em;
			color:#FFF;
			font-weight:bold;
			padding:0px;
			margin:0px;
			padding-top:30px;
			padding-bottom:20px;
			text-transform:uppercase;
			max-width:1000px;
			margin:auto;
		}
		.padding-bottom-120 {
			padding-bottom:120px;
		}
		
		.div_gallery h1 {
			font-size:1.2em;
			color:#CCC;
			font-weight:bold;
			padding:0px;
			margin:0px;
			padding-top:20px;
			padding-bottom:20px;
			text-transform:uppercase;
			max-width:1000px;
			margin:auto;
			text-align:left;

		}
		.div_gallery h1 a:link {
			color:#fff;
		}
		.div_gallery h1 a:hover {
			color:#888;
		}
		
		.container { padding: 0px 0px 120px 0px; position: relative; margin-top:0; height:auto;
		}
		.container-contact { padding: 0px 0px 120px 0px; margin:auto; text-align:center; height:auto; width:100%;
		}
		
		.container_inside { height:auto; margin:auto; max-width:1100px; }
		
		
		
		
		.container h1 a{
			font-size:22px;
			color:#FFF;
		}
		.container h1 a:hover {
			color:#FFF;
		}
		.container_inside h1 {
			text-decoration: none;
			color: #FFF;
			text-align:center;
			padding:0px;
			margin:0px;
			font-size:1.4em;
			display:block;
			text-transform:uppercase;
			text-align:left;
			font-family: "Orbitron";
			font-style: normal;
			font-weight: 400;
		}
		.container_inside h2 {
			text-decoration: none;
			color: #FFF;
			display:block;
			padding:0px;
			margin:0px;
			text-align:center;
			font-size:1.0em;
			text-transform:uppercase;
			text-align:left;
			font-family: "Orbitron";
			font-style: normal;
			font-weight: 400;
		}
		
		
		.mail_form
		{
			height:auto;
			padding:4%;
			border-radius:5px;
			line-height:18px;
			font-size:1.2em;
			background-color:rgba(255,255,255,.7);
			background-color:rgba(0,0,0,.7);
			max-width:1000px;
			margin:auto;
		}
		.message {
			display:block;
			height:auto;
			overflow:hidden;
			border-radius:5px;
			padding:10px;
			line-height:22px;
			font-size:1.0em;
			color:#CCC;
			max-width:1000px;
			margin:auto;
			width:100%;
			float:left;
			/*background: url("back-menu-lighter.png") repeat;*/
			padding-bottom:120px;
		}
		
		.message h1 {
			padding:0px;
			margin:0px;
			padding-left:7px;
			padding-bottom:20px;
		}
		.message h2 {
			padding:0px;
			padding-left:7px;
			margin:0px;
		}
		.message .section .file-group input[type="text"]{
	    border:1px solid #ccc;
		padding:12px;
		margin-bottom:10px;
		margin-top:5px;
	    outline:none;		
	    font-family:"Open Sans"; 
	    font-size:13px;
        color:#999;		
		box-shadow:none;
		font-style:italic;  
	    font-weight:normal;
		background-color:#fff;
		-webkit-border-radius:2px;
	       -moz-border-radius:2px; 
	            border-radius:2px;
	    -webkit-box-sizing:border-box;
	       -moz-box-sizing:border-box; 
	            box-sizing:border-box;
	}
		
/* MISSION - PAGE SLIDER */

.youtube {
	max-width:718px;
	max-height:477px;
	width:100%;
}
/* ------------------------------------------------------------------------------------
--  MAIN CONTENT LEFTSIDE
------------------------------------------------------------------------------------ */
.leftside{
	float:left;
	width:40.6666%; /*rule of thirds 1023.9989px 100% is equal to 1536px width of inner-wrap*/
	margin:20px 0;
	padding-left:0px;
	padding-right:10px;
	padding-top:5px;
}
.leftside p{
	color:#000;
	
}
.leftside section{
	float:left;
	width:100%;/*1023.9989px*/
	margin: 0 0 10px 0;
}
.leftside section.last{
	margin-bottom:0;
}
.leftside article{
	overflow:hidden;
	margin-bottom:5px;
}
.leftside figure{
	padding:0px;
	margin:0 20px 10px 0;
	float:left;
	
}
/* ------------------------------------------------------------------------------------
--  MAIN CONTENT RIGHTSIDE
------------------------------------------------------------------------------------ */
.rightside{
	float:right;
	width:48.3334%; /*rule of thirds 512.0010px 100% is equal to 1536px width of inner-wrap*/
	margin: 0px 10px 20px 0;/*46.08px*/
	padding-right:5px;
	padding-top:5px;
	line-height:20px;
}
.rightside p{
	color:#000;
}
.rightside section{
	float:left;
	width:100%;
	margin: 0 0px 40px 0px;
	padding-left:0px;
}

.rightside section a{
    text-decoration:none;
	outline:none;
	color:#000;
	font-size:12px;
	 opacity: 1;
	-moz-transition: opacity;
    -moz-transition-timing-function: ease-out;
    -moz-transition-duration: 500ms;
    -webkit-transition: opacity;
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 500ms;
	-o-transition: opacity;
    -o-transition-timing-function: ease-out;
    -o-transition-duration: 500ms;
	transition: opacity;
    transition-timing-function: ease-out;
    transition-duration: 500ms;	
}
.rightside section a:hover, a:focus, a:visited{
	opacity: 0.8;
	-moz-transition: opacity;
    -moz-transition-timing-function: ease-out;
    -moz-transition-duration: 500ms;
    -webkit-transition: opacity;
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 500ms;
	-o-transition: opacity;
    -o-transition-timing-function: ease-out;
    -o-transition-duration: 500ms;
	transition: opacity;
    transition-timing-function: ease-out;
    transition-duration: 500ms;
}
#contact_form {

}

#contact_form input[type="text"],
	#contact_form input[type="email"],
    #contact_form textarea
		{
	    border:1px solid #ccc;
		width:80%;
		padding:3px;
		margin-bottom:3px;
		margin-top:2px;
	    outline:none;		
	    font-family:"Open Sans"; 
	    font-size:13px;
        color:#999;		
		box-shadow:none;
		font-style:italic;  
	    font-weight:normal;
		background-color:#fff;
		-webkit-border-radius:2px;
	       -moz-border-radius:2px; 
	            border-radius:2px;
	    -webkit-box-sizing:border-box;
	       -moz-box-sizing:border-box; 
	            box-sizing:border-box;
	}
	
#contact_form label {
		padding:3px;
		margin-bottom:3px;
		margin-top:3px;
	    outline:none;		
	    font-family:"Open Sans"; 
	    font-size:13px;
        color:#CCC;		
		box-shadow:none;
		font-style:italic;  
	    font-weight:normal;
	}
.error_msg {
	padding:3px;
	margin-bottom:3px;
	margin-top:3px;
	outline:none;		
	font-family:"Open Sans"; 
	font-size:13px;
	color:#F60;		
	box-shadow:none;
	font-style:italic;  
	font-weight:normal;
}
#contact_form input[type="submit"] {
		font-style:normal; 
	    font-weight:normal; 
	    font-family:"Open Sans"; 
	    font-size:14px;
	    color:#FFF;
		background-color:#333;
        text-align:center;
		cursor:pointer;
		padding:5px;
    }

.errorTxt21 {
	color:#F60;
}

#social
{
	position: fixed;
	/*background: #000000;*/
	width: 25px;
	margin-top: auto;
	top: 0px;
	left: -10px;
	-webkit-animation: slide_left 3s forwards;
    -webkit-animation-delay: .5s;
    animation: slide_left 3s forwards;
    animation-delay: .5s;
	color: #FFFFFF;
	background-color:#666;
	font-size: 30px;
	padding: 6px 3px 6px 13px;
	z-index:9999999999999999999999;
}

#social img
{
	cursor: pointer;
	width: 24px;
	height: 24px;
	padding-bottom:5px;
	-webkit-transition: all .3s ease-in;
   -moz-transition: all .3s ease-in;
   -o-transition: all .3s ease-in;
    transition: all .3s ease-in;
	opacity: 0.7;
}

#social a:focus
{
	outline: none;
	box-shadow: 0px 1px 0px 0px #CCCCCC;
}


#social img:hover
{
	width: 24px;
	height: 24px;
	-moz-transform: opacity(1.1);
   -webkit-transform: opacity(1.1);
   -o-transform: opacity(1.1);
   transform: opacity(1.1);
   /*margin-left: 5px;*/
   opacity: 1.0;
}