@import url('https://fonts.googleapis.com/css?family=Muli:300,400,400i,600,600i');
@import url("font-awesome.min.css");

/* Preloader */
	body{
	  background: #0a0f1c;
	  font-family: 'Muli', sans-serif;
	  font-weight: 600;
	  padding: 5px;
	  margin: 0;
	}
	
	/*
	  text-align: center;
	 */
	
	#loader-wrapper {
	    position: fixed;
	    top: 0;
	    left: 0;
	    width: 100%;
	    height: 100%;
	    z-index: 1000;
	}
	
	.loader{
	  margin: 360px auto 10px;
	  /*
	  width: 100%;
	   */
	  height: 3px;
	  background: #222222;
	  overflow: hidden;
	  position: relative;
	  z-index: 100;
	  display: block;
	  /*
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #3498db;

	   */
	}
	
	.progress-bar{
	  height: inherit;
	  width: 0%;
	  border-radius: inherit;
	  position: relative;
	  overflow: hidden;
	  z-index: 1050;
	}
	
	.progress-stripes{
	  width: inherit;
	  height: inherit;
	  font-size: 180px;
	  font-weight: bold;
	  margin-top: -50px;
	  letter-spacing: -14px;
	  z-index: 2051;
	}
	
	.percentage{
		position: relative;
		font-weight: bold;
		font-size: 16px;
		font-family: 'Muli', sans-serif;
		font-weight: 600;
		text-align: center;
		margin: 0;
		z-index: 1050;
	}

	/* BELOW HERE IS SOLELY FOR AESTHETICS */
	/*
	color: #888888;
	 */
	
	.gray .progress-bar{
	  	background: #FFFFFF;
	}
	
	.gray .progress-stripes{
	  	color: #F2F2F2;
	}
	.gray .percentage{
	  	color: #FFFFFF;
	}
	
	/*** LOADED ***/
	span{
	  	color: #888;
	}
	
	span.loaded.gray{
		font-weight: 600;
	  	color: #FFFFFF;
	  	text-align: center;
	}


    .loader-section {
        position: fixed;
        width: 100%;
        height: 100%; 
        background: #000000;
        background: #0a0f1c;
        background: #11141c;
        
        opacity: 0.96;
        /*
         * height: 51%
         * #loader-wrapper .loader-section {
         * #222222
         */
        z-index: 10;
        -webkit-transform: translateY(0); 
        -ms-transform: translateY(0);  
        transform: translateY(0);  
    }
	
    .loader-section.section-left {
        top: 0;
    }

	/*
    .loader-section.section-right {
        bottom: 0;
    }
	
	 	
    .loaded .loader-section.section-left {
        -webkit-transform: translateY(-100%);  
            -ms-transform: translateY(-100%); 
                transform: translateY(-100%);  

        -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);  
                transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }

    .loaded .loader-section.section-right {
        -webkit-transform: translateY(100%);  
            -ms-transform: translateY(100%);  
                transform: translateY(100%); 

		-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);  
       		 transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }
	 */
    
     
    .loaded #loader-wrapper {
        opacity: 0;
        -webkit-transition: all 0.3s ease-out;  
                transition: all 0.3s ease-out;
        visibility: hidden;
    }
    
    /*
        visibility: hidden;

        -webkit-transform: translateY(-100%);  
            -ms-transform: translateY(-100%); 
                transform: translateY(-100%); 

        -webkit-transition: all 0.3s 1s ease-out;  
                transition: all 0.3s 1s ease-out;
                
    .loaded .progress-bar {
        opacity: 0;
        -webkit-transition: all 0.3s ease-out;  
                transition: all 0.3s ease-out;
    }
    
    .loaded .progress-stripes {
        opacity: 0;
        -webkit-transition: all 0.3s ease-out;  
                transition: all 0.3s ease-out;
    }
        
    .loaded .percentage {
        opacity: 0;
        -webkit-transition: all 0.3s ease-out;  
                transition: all 0.3s ease-out;
    }
	
     */
	
	/*    Helper classes   */

	/* Image replacement */
	.ir {
	    background-color: transparent;
	    border: 0;
	    overflow: hidden;
	    /* IE 6/7 fallback */
	    *text-indent: -9999px;
	}
	
	.ir:before {
	    content: "";
	    display: block;
	    width: 0;
	    height: 150%;
	}
	
	/* Hide from both screenreaders and browsers: h5bp.com/u */
	
	.hidden {
	    display: none !important;
	    visibility: hidden;
	}
	
	/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
	
	.visuallyhidden {
	    border: 0;
	    clip: rect(0 0 0 0);
	    height: 1px;
	    margin: -1px;
	    overflow: hidden;
	    padding: 0;
	    position: absolute;
	    width: 1px;
	}
	
	/* Extends the .visuallyhidden class to allow the element to be focusable
	 * when navigated to via the keyboard: h5bp.com/p */
	
	.visuallyhidden.focusable:active,
	.visuallyhidden.focusable:focus {
	    clip: auto;
	    height: auto;
	    margin: 0;
	    overflow: visible;
	    position: static;
	    width: auto;
	}
	
	/* Hide visually and from screenreaders, but maintain layout */
	
	.invisible {
	    visibility: hidden;
	}

	
	
	/*
	
    .no-js #loader-wrapper {
        display: none;
    }
    .no-js h1 {
        color: #222222;
    }
    
	
	 */

/*	Parallelism by HTML5 UP */

/* Reset */

	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, 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, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
		
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		font: inherit;
		vertical-align: baseline;
		/*
		color: #000000;
		 
		 */
	}

	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
		display: block;
	}

	body {
		line-height: 1;
	}

	ol, ul {
		list-style: none;
	}

	blockquote, q {
		quotes: none;
	}

	blockquote:before, blockquote:after, q:before, q:after {
		content: '';
		content: none;
	}

	table {
		border-collapse: collapse;
		border-spacing: 0;
	}

	body {
		-webkit-text-size-adjust: none;
	}

/* Box Model */

	*, *:before, *:after {
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}

/* Basic */

	body {
		position: relative;
		/*
		background-color: #11141c;
		color: #000000;
		 */
		background-color: #12151D;
		color: #999;
		color: rgba(255, 255, 255, 0.6);
		font-family: 'Muli', sans-serif;
		font-weight: 400;
	}

		body.is-loading *, body.is-loading *:before, body.is-loading *:after {
			-moz-animation: none !important;
			-webkit-animation: none !important;
			-ms-animation: none !important;
			animation: none !important;
			-moz-transition: none !important;
			-webkit-transition: none !important;
			-ms-transition: none !important;
			transition: none !important;
		}

	a {
		color: #000;
		color: rgba(0, 0, 0, 0.85);
		text-decoration: none;
		-moz-transition: color 0.25s ease-in-out;
		-webkit-transition: color 0.25s ease-in-out;
		-ms-transition: color 0.25s ease-in-out;
		transition: color 0.25s ease-in-out;
	}

		a:hover {
			color: #51c9e3;
			color: #5782f3;
		}

	h1, h2, h3, h4, h5, h6 {
		font-weight: 400;
		color: #fff;
		letter-spacing: -0.05em;
	}

	strong, b {
		color: #fff;
		color: rgba(255, 255, 255, 0.85);
		font-weight: 600;
	}

/* List */

	ul.contact {
		cursor: default;
		margin: 0 0 1em 0;
		
	}

		ul.contact li {
			display: inline-block;
			font-size: 1.5em;
			
		}

			ul.contact li span {
				display: none;
				
			}
			
			/*
			 * original FFF
			 */
			ul.contact li a {
				opacity: 0.35;
				color: #000000;

				-moz-transition: opacity 0.25s ease-in-out;
				-webkit-transition: opacity 0.25s ease-in-out;
				-ms-transition: opacity 0.25s ease-in-out;
				transition: opacity 0.25s ease-in-out;
			}

				ul.contact li a:hover {
					opacity: 1.0;
				}

/* Item */

	.item.thumb {
		display: block;
		position: relative;
		background: #1a1f2c;
		background: rgba(255, 255, 255, 0.25);
		cursor: default;

		/* 
		background: #000000;
		height: 50%;
		width: 50%;
		float: right;
		margin: 0 auto;
		text-align: right;
		vertical-align: middle;
		-webkit-align-self: center;  Safari 7.0+ 
		align-self: center;
		vertical-align: text-bottom;
		
	    display: -webkit-flex;
	    display: flex;
	    -webkit-flex-wrap: wrap;
	    flex-wrap: wrap;
	    -webkit-align-content: center;
	    align-content: center;
	    


		clear: both;
		position: fixed;
		vertical-align: bottom;			
		
		position: initial;
		position: relative;
		position: absolute;
		text-align: center;
		
		display: block;
		position: relative;
		
		position: fixed;
		position: absolute;
		 
		*/
		
	}
  
		.item.thumb img {
			display: block;
			z-index: 1;
			
		}

/* Icons */

	.icon {
		position: relative;
		text-decoration: none;
		z-index: 100
	}

		.icon:before {
			-moz-osx-font-smoothing: grayscale;
			-webkit-font-smoothing: antialiased;
			font-family: FontAwesome;
			font-style: normal;
			font-weight: normal;
			text-transform: none !important;
		}

		.icon > .label {
			display: none;
		}

/* Wrapper */

	#wrapper {
		position: relative;
		z-index: 1;
	}

/* Main */

/* Header */

	#header {
		position: relative;
		background: #1f1f1f url("images/overlay.png");
		color: #fff;
		cursor: default;
	}
		/* Sub Heading for text box */
		#header p {
			opacity: 0.65;
		}

/* Desktop */

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

			/* Disable scroll */
			.noscroll { overflow: hidden; }
			
			.overlay { 
			   position: fixed; 
			   overflow-x: scroll;
			   /* test
			   overflow: none
			    * 
			    */
			   top: 0; right: 0; bottom: 0; left: 0; }
			
			[aria-hidden="true"] { display: none; }
			[aria-hidden="false"] { display: block; }
		
			
		/* Basic */

			html {
				height: 100%;
			}

			body {
				/*
				background-image: url("../../images/bg.jpg");
				background-image: url("../../images/bg.jpg");
				background-image: url("../../images/bg.jpg");
				 */
				background-image: url("../../images/bg.jpg");
				background-position: top left, bottom left, auto;
				background-size: auto, 100% 100%, cover;
				background-size: 1440px 810px;
				background-size: auto, 75% 75%, cover;
				background-repeat: repeat, repeat, auto;
				padding: 0;
				font-size: 12pt;
				line-height: 1.75em;
				height: 100%;
				min-height: 450px;
				min-width: 1000px;
			}

		/* List */

			ul.contact {
				margin-bottom: 0.5em;
			}

				ul.contact li {
					margin-left: 1em;
				}

		/* Item */



		/* Wrapper */

			#wrapper {
				height: 100%;
				overflow: hidden;
				-moz-transition: -moz-filter 0.25s ease-in-out;
				-webkit-transition: -webkit-filter 0.25s ease-in-out;
				-ms-transition: -ms-filter 0.25s ease-in-out;
				transition: filter 0.25s ease-in-out;
			}

				#wrapper.overlayed {
					-moz-filter: blur(3px);
					-webkit-filter: blur(3px);
					-ms-filter: blur(3px);
					filter: blur(3px);
				}

		/* Main */

			#main {
				width: 100%;
				position: absolute;
				/* test
				overflow: hidden;
				 */
			}

		/* Reel */

			#reel {
				position: relative;
				opacity: 0;
			}

				#reel .item {
					display: block;
					float: left;
					position: relative;
					overflow: hidden;
				}

		/* Header */

			#header {
				background-color: #11141c;
				
				padding: 1.75em 3em;
				xmin-height: 212px;
				vertical-align: top;
			}

				#header:before {
					content: '';
					display: inline-block;
					height: 96%;
					vertical-align: middle;
				}

				#header .inner {
					display: inline-block;
					vertical-align: middle;
				}

				#header h1 {
					font-size: 2.22em;
					line-height: 1em;
				}

				#header p {
					font-size: 0.9em;	/*1.32em*/
					line-height: 0.5em;
					margin: 0.5em 0 0 0;
				}

		/* Footer */
			#footer {
				color: rgb(0,0,0, 0.6);
				position: fixed;
				bottom: 0;
				left: 0;
				width: 100%;
				overflow: hidden;
			}

				#footer h2 {
					font-size: 2.25em;
					margin: 0 0 1em 0;
				}

				#footer .left {
					padding: 2em;
					text-align: left;
				}

				#footer .right {
					
					position: absolute;
					bottom: 0;
					right: 0;
					padding: 2em;
					text-align: right;
				}

				#footer .copyright li {
					display: inline-block;
					border-left: 0;
					margin-left: 0;
					padding-left: 0;
					line-height: 1em;
					color: rgba(0, 0, 0, 0.6);
					color: #969696; /*test*/
					color: #7e7e7e;
					
				}
				
				/*
		 		border-right: solid 1px #333;
						border-right-color: #969696;
						border-right-color: #ff5000;
				 */

					#footer .copyright li:first-child {
						
						border-right: solid 1px #ff5000;
						border-right-color: rgba(0, 0, 0, 0.5);
						margin-right: 1em;
						padding-right: 1em;
					}

		
			/*
			
			#email {
				color: #000000;
				color: rgb(0,0,0, 0.6);

			script {
				color: #000000;
				color: rgb(0,0,0, 0.6);
				#email:hover {
					color: #9feeff;
				}
			*/

		/* Popup */

			.poptrox-popup {
				background: #1a1f2c;
				background: rgba(18, 21, 29, 0);
				/*box-shadow: 0px 0px 0px 0px #fff, 0px 0px 0px 0px rgba(8, 11, 19, 0.55);*/
				cursor: default;
			}

				.poptrox-popup .loader {
					display: block;
					width: 90px;
					height: 90px;
					position: absolute;
					top: 45%;
					left: 50%;
					margin: -24px 0 0 -24px;
					background: url("images/loader.gif");
					opacity: 0.8;
				}

				.poptrox-popup .caption {
					position: relative;
					height: 3em;
					margin: auto;
					padding: 8px 0px;
					left: 0;
					background: #1a1f2c;
					background: rgba(18, 21, 29, 0);
					display: block;
					width: 80%;
					line-height: 1.2em;
					text-align: center;
					font-size: .9em;
					color: #fff;
				}

				
				.poptrox-popup .nav-next, .poptrox-popup .nav-previous, .poptrox-popup .closer {
					text-decoration: none;
					font-weight: normal;
					font-style: normal;
					-moz-transition: opacity 0.05s ease-in-out;
					-webkit-transition: opacity 0.05s ease-in-out;
					-ms-transition: opacity 0.05s ease-in-out;
					transition: opacity 0.05s ease-in-out;
					opacity: 0.45;
				}

					.poptrox-popup .nav-next:hover, .poptrox-popup .nav-previous:hover, .poptrox-popup .closer:hover {
						opacity: 1.0;
					}
				

				.poptrox-popup .nav-next, .poptrox-popup .nav-previous {
					-moz-osx-font-smoothing: grayscale;
					-webkit-font-smoothing: antialiased;
					font-family: FontAwesome;
					font-style: normal;
					font-weight: normal;
					text-transform: none !important;
					width: 150px;
					height: 55%;
					position: fixed;
					bottom: 0;
					cursor: pointer;
					font-size: 5em;
					line-height: 75px;
				}

				.poptrox-popup .nav-next {
					right: 0;
					text-align: center;
					padding-right: 7%;
				}

					.poptrox-popup .nav-next:before {
						content: '\f105';
					}

				.poptrox-popup .nav-previous {
					left: 0;
					text-align: center;
					padding-left: 7%;
				}

					.poptrox-popup .nav-previous:before {
						content: '\f104';
					}

				.poptrox-popup .closer {
					width: 35px;
					height: 35px;
					font-size: 2em;
					line-height: 35px;
					text-align: center;
					position: absolute;
					top: -70px;
					right: -70px;
					cursor: pointer;
					border-radius: 40px;
					box-shadow: 0px 0px 0px 1px #fff;
				}

					.poptrox-popup .closer:before {
						content: "\00d7";
					}
	}



/* Mobile */

	@media screen and (max-width: 1236px) {
		/* Disable scroll */
		.noscroll { overflow: hidden; }
		
		.overlay { 
		   position: fixed; 
		   overflow-y: scroll;
		   /* test
		   overflow: none
		    * 
		    */
		   top: 0; right: 0; bottom: 0; left: 0; }
		
		[aria-hidden="true"] { display: none; }
		[aria-hidden="false"] { display: block; }
	 
		 
		 .loader-section {
		        position: fixed;
		        width: 100%;
		        height: 100%; 
		        background: #000000;
		        background-color: #11141c;
		        opacity: 1.0;
		        /*
		         * height: 51%
		         * #loader-wrapper .loader-section {
		         * #222222
		         */
		        z-index: 900;
		        -webkit-transform: translateY(0); 
		        -ms-transform: translateY(0);  
		        transform: translateY(0);  
		    }
	    
    	.percentage {
    		color: #FFFFFF;
    	}

		a {
			color: #FFFFFF;
			color: rgba(255, 255, 255, 0.85);
			text-decoration: none;
			-moz-transition: color 0.25s ease-in-out;
			-webkit-transition: color 0.25s ease-in-out;
			-ms-transition: color 0.25s ease-in-out;
			transition: color 0.25s ease-in-out;
		}
	
			a:hover {
				color: #51c9e3;
				color: #5782f3;
			}

		/* Basic */

			body {
				font-size: 12pt;
				line-height: 1.75em;
			}

		/* List */

			ul.contact li {
				margin: 0 0.35em 0 0.35em;
			}

		/* Item */

			.item {
				border: 0;
			}

				.item.thumb {
					width: 33.33%;
					float: left;
					height: 10em;
					position: relative;
					border-top: solid 0.5px rgba(255, 255, 255, 1);
					border-right: solid 0.5px rgba(255, 255, 255, 1);
					/*border-left: solid 0.5px rgba(255, 255, 255, 1);
					border-bottom: solid 0.5px rgba(255, 255, 255, 1);*/
					
					/*margin-right: 1px;
					
					*/
					
					
				}

					.item.thumb h2 {
						display: none;
					}

					.item.thumb a {
						position: absolute;
						left: 0;
						top: 0;
						width: 100%;
						height: 100%;
						
					}

					.item.thumb img {
						display: none;
					}

		/* Wrapper default 1px 

			#wrapper.overlayed {
				-moz-filter: blur(0px);
				-webkit-filter: blur(0px);
				-ms-filter: blur(0px);
				filter: blur(0px);
			}
		*/
		
		/* Header */

			#header {
				padding: 2.5em 1.5em;
				text-align: center;
				
				background-color: #11141c;
				/*border-bottom: solid 1px rgba(255, 255, 255, 1);*/
			}

				#header h1 {
					font-size: 2em;
				}

				#header p {
					font-size: 1em;
					line-height: 0.5em;
					margin: 0.75em 0 0 0;
				}

		/* Main */

			#main {
				overflow: hidden;
				background-color: #11141c;
			}

		/* Footer */

			#footer {
				background-color: #11141c;
				padding: 1em 1em;
				text-align: center;
			}

				#footer br {
					display: none;
				}

				#footer .right {
					border-top: solid 1px rgba(255, 255, 255, 0.1);
					margin: 1em 0 0 0;
					padding: 1em 0 0 0;
				}

				#footer .copyright {
					
					margin: 1em 0 0 0;
				}
			

			
		/* Popup default shadow 0,0,30px,10px*/

			.poptrox-popup {
				background: #0a0f1c;
				background: rgba(18, 21, 29, 0);
				/*
				 box-shadow: 0px 0px 30px 10px rgba(8, 11, 19, 0.85);
				border: solid 0.5px #fff;
				 */
				-moz-box-sizing: content-box;
				-webkit-box-sizing: content-box;
				-ms-box-sizing: content-box;
				box-sizing: content-box;
			}
				.poptrox-popup .caption {
					position: relative;
					height: 3em;
					margin: auto;
					/*margin for popup captions, edge limits
					bottom: -20;*/
					padding: 8px 0px;
					left: 0;
					display: block;
					width: 92%;
					line-height: 1.2em;
					text-align: center;
					font-size: .9em;
					color: #fff;
				}
	

	}
	
	@media screen and (max-height: 2000px) {
		.loader{
		margin: 750px auto 10px;
		}
	}
	
	@media screen and (max-height: 1600px) {
		.loader{
		margin: 620px auto 10px;
		}
	}

	@media screen and (max-height: 1300px) {
		.loader{
		margin: 500px auto 10px;
		}
	}
	
	@media screen and (max-height: 1150px) {
		.loader{
		margin: 410px auto 10px;
		}
	}

	@media screen and (max-height: 1000px) {
		.loader{
		margin: 400px auto 10px;
		}
	}
	
	@media screen and (max-height: 800px) {
		.loader{
		margin: 300px auto 10px;
		}
	}

	@media screen and (max-height: 650px) {
		.loader{
		margin: 230px auto 10px;
		}
	}
	
	@media screen and (max-height: 500px) {
		.loader{
		margin: 150px auto 10px;
		}
	}
	
	@media screen and (max-height: 400px) {
		.loader{
		margin: 130px auto 10px;
		}
	}
	
	@media screen and (max-height: 350px) {
		.loader{
		margin: 110px auto 10px;
		}
	}
	
	
	/*
	 * 
	 */