@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/
*/

/*@import url(http://fonts.googleapis.com/css?family=Titillium+Web:200italic,300italic,700italic|Fondamento:400italic,400|Open+Sans+Condensed:300,700&subset=latin,latin-ext);
@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700&subset=latin,latin-ext);
@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900&subset=latin,latin-ext);*/

@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400&subset=latin,latin-ext);

/*@import url(http://fonts.googleapis.com/css?family=Cutive+Mono&subset=latin,latin-ext);*/

img, object, embed, video, iframe/**/ {
	max-width: 100%;
}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}




/*html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video, a {*/
html, body, body div, span, object, iframe, img, article, p {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	/*font-size: 100%;
	background: transparent;*/
	vertical-align: baseline;
	color:#333;
	font-style: normal;
}


article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
	display: block
}
img, object, embed, iframe {
	max-width: 100%
}
[hidden] {
display:none
}
html {
	font-size: 100%;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	overflow-y: scroll
}
html, button, input, select, textarea {
	color: #222;
	/*line-height: 1.4;*/
}
body {
	margin: 0;
	font-size: 1em;
	/*background-color:#3d66a8;
	background-color:#3d66a8;
	background-color:#000;*/
	height:100%;
	background-color: #111;
}

html,body,#gridContainer {
	/*font-family: 'PT Sans Caption', sans-serif;
	letter-spacing:0.01em;
	font-family: 'Antonio Bold', sans-serif;
	letter-spacing:-0.04em;
	font-family: 'Titillium Web', sans-serif;			/italic 200,300,700
	http://www.google.com/fonts#UsePlace:use/Collection:Titillium+Web:400italic,700italic,300italic,200italic,300,200
	font-family: 'Fondamento', cursive;*/
	/*font-family: 'Open Sans Condensed', sans-serif;		300+700*/
	font-family: 'Source Sans Pro', sans-serif;
	font-weight:300;

	/*font-family: 'Titillium Web', sans-serif;
	font-style:italic;
	font-weight:200;*/
}
h1,h2,h3,h4,h5,h6 {
	letter-spacing:-0.04em;
	font-family: 'Source Sans Pro', sans-serif;
	font-weight:600;*/	
}

p.text {
	padding: .7em 0;
}

img {
	background-color: transparent !important;
	background-color: none !important;
	/*vertical-align: middle;*/
}


a:link {
	color: #009;
	text-decoration: none;/**/
}
a:visited {
	color: #009;
	text-decoration: none;/**/
}
a:hover {
	/*
	background-color: #000;
    border-bottom: 2px dotted #FFF;
    padding-bottom: 6px;*/
	color: #C00;
}
a:active {
	/**/background-color:#000;
	color: #CCC;
}






 .linkAsText a:link {
	color: #333;
}
 .linkAsText a:visited {
	color: #333;
}
 .linkAsText a:hover {
	color: #009;
}
 .linkAsText a:active {
	/**/background-color:#C2B59B;
	color: #ddd;
}




#loaderDiv {
	position: fixed;
	bottom: 0;
	width: 0%;
	height: 100px;
	z-index: 10000;
	background-color: #000;
	opacity: .2;
}



/* Mobile Layout: 480px and below. */

#gridContainer {
	position:relative;
	margin-left: auto;
	margin-right: auto;
	/*width: 96.7391%;
	padding-left: 1.6304%;
	padding-right: 1.6304%;*/
	/*background: #3d66a8 url(v4/images/energetika-bg1-800x50px.png) repeat left top;
	height:100%;
	padding-bottom: 10%;*/
	cursor: default;
}

#layoutContainer {
	position:relative;
	margin: 0;
	/* height:800px;
	padding-bottom: 5%;		to include bg-image, use padding */
	/*width:100%;height:100%;
	
	position:relative;
	padding-bottom: 10%;*/
	
}





	#LayoutDiv1 {
		display: block;
		position: relative;
		padding: 0;
		margin: 0;
		float: left;
		width: 100%;
	}






#videoDiv {
	/*overflow: hidden;
	position: absolute;*/
	position: fixed;
}
#videoDiv > img,
#videoDiv > video {
	/*CHANGE THIS TO SCALE THE IMAGES*/
	width: 100%;
	height: 100%;
}

#videoDivOverlay {
	/*
	position: absolute;*/
	position: fixed;
}
#videoDivOverlay > img {
	/*CHANGE THIS TO SCALE THE IMAGES*/
	width: 100%;
	height: 100%;
}



#namePanel {
	/*overflow: hidden;
	position: absolute;*/
	position: fixed;
	z-index: 2;
/*	width: 100%;*/
	/*height: 100%;*/
}
#namePanelContent {
	/*CHANGE THIS TO SCALE THE IMAGES*/
	/*position: relative;
	width: 100%;
	height: 100%;*/
}

#namePanelContent h1 {
	/*CHANGE THIS TO SCALE THE IMAGES*/
	/*position: relative;
	width: 100%;
	height: 100%;
	text-align: center;
	background-color: #000;*/
	text-align: left;
	padding: 4px 10px 4px 12px;
	margin: 50px 0 0;
	background-color: #fff;
}




	::selection {
	  background: #ffb7b7; /* WebKit/Blink Browsers */
	}
	::-moz-selection {
	  background: #ffb7b7; /* Gecko Browsers */
	}

	h1::selection, h2::selection {
	  background: transparent;
	}
	h1::-moz-selection, h2::-moz-selection {
	  background: transparent;
	}


	.smaller {
		font-size: 60%;
		text-transform: lowercase;
	}










ul {
    list-style-type: none !important;
}




ul.inline-items li {
	display: inline-block
}








/* Very small layout */

@media only screen and (max-width: 481px) {
	/*@media only screen and (min-width: 1160px) {*/
	
}


@media only screen and (max-width: 1360px) {
	/*@media only screen and (min-width: 1160px) {*/
	

}













/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

/*@media only screen and (min-width: 769px) {*/
@media only screen and (min-width: 481px) {
	
	#mainDiv {
		/**/position: relative;
		height: 100%;
		width: 100%;
	}

	#mainDiv, #LayoutDiv1 {
		/**/width: 100%;
		max-width: 100%;
	}


}



/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
@media only screen and (min-width: 1024px) {
/* originally 769 */

		
	#mainDiv {
		/**/position: relative;
		height: 50%;
		width: 50%;
				margin-left: 50%;
	}

	/**/#mainDiv, #LayoutDiv1 {
		width: 50%;
		max-width: 50%;
	}

}



/* Bigscreen Layout */

@media only screen and (min-width: 1360px) {

	#mainDiv {
		/*max-width: 760px;*/
	}
	#gridContainer {
		width:auto;
		margin: auto 1% auto 1%;
	}

}



@media only screen and (min-width: 2100px) {
	/*@media only screen and (min-width: 1160px) {*/
	#gridContainer {
		/*max-width: 2100px;
		margin: auto 20% auto 20%;*/
		margin: auto 10% auto 10%;
	}
}












@media print
  {
  	/*#LayoutDiv1 header h1 {display:block;}*/
  }





/* =============================================================================
       Links
       ========================================================================== */
/*
     * Addresses `outline` inconsistency between Chrome and other browsers.
     */

a:focus {
  outline: thin dotted;
}

/*
     * Improves readability when focused and also mouse hovered in all browsers.
     */

a:active,
a:hover {
  outline: 0;
}