body {
	margin: 0;
	padding: 0;
	background: #fff;
	background-size: cover;
	transform: translate3d(0, 0, 0);
	color: #fff;
	width: 100vw;
	height: 100vh;
	height: calc(var(--vh, 1vh) * 100);
	position: relative;
	font-family: 'bebas_neue_pro', Sans-Serif;
	font-weight: normal;
	font-size: 14px;
	line-height: 22px;
}

.fa-home:before {
  content: "\f015"; }

.fa-chevron-down:before {
  content: "\f078"; }

.fa-chevron-left:before {
  content: "\f053"; }

.fa-chevron-right:before {
  content: "\f054"; }

.fa-chevron-up:before {
  content: "\f077"; }

.fa-times-thin:before {
	content: '\00d7'; }
	
.appleLinksWhite a {
	color: #ffffff;
	text-decoration: none;
}

.no-scrollbar::-webkit-scrollbar {
	display: none
}

.no-scroll {
	overflow: hidden
}

.color-yellow {
	color: #ffbf00;
}

.bg-yellow:hover {
	background: #ffbf00;
	color: #222;
	border: 1px solid #ffbf00;
	transition: all .3s ease-out;
}

.color-black {
	color: #000000;
}

.bg-black, .bg-black:hover {
	background: #000;
	color: #fff;
	border: 1px solid #000;
	transition: all .3s ease-out;
}

.color-red {
	color: #ff2b00;
}

.bg-red:hover {
	background: #ff2b00;
	color: #fff;
	border: 1px solid #ff2b00;
	transition: all .3s ease-out;
}

.color-orange {
	color: #ff9600;
}

.bg-orange:hover {
	background: #ff9600;
	color: #fff;
	border: 1px solid #ff9600;
	transition: all .3s ease-out;
}

.color-blue {
	color: #1574c4;	
}

.color-light-blue {
	color: #85e1ff;
}

.bg-blue:hover {
	background: #85e1ff;
	color: #0080ff;
	border: 1px solid #85e1ff;
	transition: all .3s ease-out;
}

.color-aqua {
	color: #00ffc6;
}

.bg-aqua:hover {
	background: #00ffc6;
	color: #71624a;
	border: 1px solid #00ffc6;
	transition: all .3s ease-out;
}

.color-green {
	color: #84d701;
}

.bg-green:hover {
	background: #84d701;
	color: #593521;
	border: 1px solid #84d701;
	transition: all .3s ease-out;
}

.color-white {
	color: #fff;
}

.bg-white:hover {
	background: #fff;
	color: #593521;
	border: 1px solid #fff;
	transition: all .3s ease-out;
}

.color-gray {
	color: #777;
}

.bg-gray:hover {
	background: #000;
	color: #777;
	border: 1px solid #777;
	transition: all .3s ease-out;
}

.color-pink {
	color: #ff9ed3;
}

.bg-pink:hover {
	background: #ff9ed3;
	color: #fff;
	border: 1px solid #ff9ed3;
	transition: all .3s ease-out;
}

.color-purple {
	color: #4142A6;
}

.bg-purple:hover {
	background: #4142A6;
	color: #fff;
	border: 1px solid #fff;
	transition: all .3s ease-out;
}

.top {
	/*background: #222;*/
}

#certifications-top {
	z-index: 100000000;	
	position: absolute;
	top:15px;
	left:155px;
	width: 200px;
	height: 64px;
	/*padding-left 80px;*/
}
#certifications-top.home {
	left:15px;
	/*padding-left 80px;*/	
}
#logo-top {
	z-index: 100000000;	
	position: absolute;
	top:15px;
	left:80px;
	width: 70px;
	height: 64px;
	/*padding-left 80px;*/	
}
#logo-top.home {
	display:  none;
}
#logo-top img {
	width:  100%;
}
.what-we-do {
	color: #2c3896;	
	font-weight: bold;
}

.project {
	height: 100vh;
	width: 100vw;
	display: block;
}

.description {
	width: 500px;
}

.description p {
	font-size: 20px;
	line-height: 24px;
}

.menu-button {
	color: #fff;
	opacity: 0.7;	
	display: inline-block;
	padding: 35px 20px 35px 0;
	border: none;
	cursor: pointer;
}

.menu-button-black {
	color: #000;
	display: inline-block;
	padding: 35px 20px 35px 0;
	border: none;
	cursor: pointer;
}

.content-middle {
	display: table-cell;
	vertical-align: middle;
	height: 100vh;
	width: 100vw;
	text-align: center;
	overflow: hidden;
}

.content-middle-left {
	display: table-cell;
	vertical-align: middle;
	height: 100vh;
	width: 100vw;	
	padding: 0 50px;
	margin: 0;
	transition: background .2s ease-out;
}

.content-middle-center {
	display: table-cell;
	vertical-align: middle;
	height: 100vh;
	width: 100vw;
	text-align: center;
	overflow: hidden;
}
.content-top {
	padding-top: 40px;
	padding-bottom: 40px;
	display: table-cell;
	vertical-align: top;
	width: 100vw;
	transition: background .2s ease-out;
}

.content-top:hover {
	transition: background .2s ease-out;
	background: rgba(0, 0, 0, 0.4);
}

.content-top .description {
	width: 80%;
	max-width: 640px;
	margin: auto;
}

.content-bottom {
	display: table-cell;
	vertical-align: bottom;
	height: 90vh;
	width: 100vw;
}

.content-bottom .description {
	width: 80%;
	max-width: 640px;
	margin: auto;
}

h1 {
	font-family: 'bebas_neue_pro', Sans-Serif;
	font-weight: bold;
	font-size: 32px;
	letter-spacing: 1px;
	color: #000;
	line-height: 48px;
	margin: 0 0 0 0;
	transition: all .3s ease-out;
}

h1.company {
	color: #fff;
	text-transform: uppercase;
	font-size: 600%;
	line-height: 1em;
}

h2 {
	font-family: 'bebas_neue_pro', Sans-Serif;
	font-weight: normal;
	font-size: 24px;
	letter-spacing: 1px;
	color: #000;
	line-height: 26px;
	transition: all .3s ease-out;
}

h2.company-tagline {
	color: #fff;
	text-transform: uppercase;
	font-size: 200%;
}

.company-description {
	margin-top: 3%;	
}

.company-description p, .about-description p {
	font-size: 22px;
	line-height: 30px;
	width:70%;
	margin:1.5% auto;
}

.info {
	padding: 40px 0 0 0;
	width: 70%;
}

.info p {
	font-size: 22px;
	line-height: 30px;
}

.center {
	display: block;
	margin: 0 auto;
}

.client-logo {
	width: 140px;
	height: 50px;
	padding: 20px 10px 0 10px;
	display: inline-block;
	vertical-align: middle;
	text-align: center;
}

.twocol {
	display: inline-block;
	width: 40%;
	min-width: 200px;
	padding: 0 3%;
	margin: 0;
	text-align: center;
	vertical-align: top;
}

.client-logo img {
	display: inline-block;
	height: 100%;
	width: 100%;
	vertical-align: middle;
}

.shrink {
	width: 65% !important;
	vertical-align: middle;
}

.content-middle h1,
.content-top h1,
.content-bottom h1 {
	text-align: center;
}

p {
	font-family: 'bebas_neue_pro_book', Sans-Serif;
	display: block;
	letter-spacing: 1px;
	font-weight: normal;
	font-size: 18px;
	line-height: 24px;
	margin-bottom: 15px;
	margin-top: 0;
	transition: all .3s ease-out;
}

.description h1, .capabilities h1, .about h1, .clients h1, .contact h1 {
	text-transform: uppercase;
}

.description h2 {
	font-size: 200%;
	line-height: 1.2em;
	text-transform: uppercase;
}

.content-top p {
	padding: 0 20%;
	text-align: center;
}

.project-button {
	display: block;
	font-family: 'bebas_neue_pro', Sans-Serif;
	padding: 10px 20px;
	font-size: 12px;
	text-align: center;
	outline: none;
	text-decoration: none;
	transition: all .3s ease-out;
	transform: matrix(1, 0, 0, 1, 0, 0);
	cursor: pointer;
	text-transform: uppercase;
	width: 100px;
}

.bg-brand {
	background: #fff;
	color: #000;
	padding: 1rem;
	/*border-width:3px;*/
	border: 6px solid;
	border-image-source: linear-gradient(90deg, rgb(51,218,130), rgb(24,205,195), rgb(0,193,255), rgb(108,100,235), rgb(225,0,213), rgb(0,193,255), rgb(24,205,195), rgb(51,218,130));
	border-image-slice: 1;
}

.bg-brand:hover {
	color:#fff;
	border: 6px solid;
	border-image-source: linear-gradient(90deg, rgb(51,218,130), rgb(24,205,195), rgb(0,193,255), rgb(108,100,235), rgb(225,0,213), rgb(0,193,255), rgb(24,205,195), rgb(51,218,130));
	background: linear-gradient(90deg, rgb(51,218,130), rgb(24,205,195), rgb(0,193,255), rgb(108,100,235), rgb(225,0,213), rgb(0,193,255), rgb(24,205,195), rgb(51,218,130));
	border-image-slice: 1;
	transition: all .3s ease-out;
}

.bg-web {
	background: #333;
	box-shadow: 10px 10px 5px rgba(51, 51, 51, 0.5);	
	color: #fff;
}

.bg-web:hover {
	background: #eec62b;
	box-shadow: 10px 10px 5px rgba(238, 198, 43, 0.5);	
	color: #333;
	transition: all .3s ease-out;
}

.bg-devops {
	background: transparent;
	color: #fff;
	border: 3px solid;
    border-color: #a7efc9;
    box-shadow: inset 0 0 20px rgb(51,218,130), 0 0 20px rgb(167, 239, 201);	
}

.bg-devops:hover {
	color: #0e0027;
	background: rgb(51,218,130);
	border: 3px solid;
    border-color: #a7efc9;
    box-shadow: inset 0 0 20px rgb(51,218,130), 0 0 20px rgb(167, 239, 201);	
	transition: all .3s ease-out;
}

.bg-data {
	background: #4142A6;
	color: #fff;
}

.bg-data:hover {
	background: #f48a71;
	color: #000;
}

.bg-tech {
	background: #33da82;
	color: #1049ff;
}

.bg-tech:hover {
	background: #85e1ff;
	color: #1049ff;
	transition: all .3s ease-out;
}

.bg-audio {
	background: #000;
	color: #fff;
}

.bg-audio:hover {
	background: #e100d5;
	color: #fff;
}

.obj-center {
	margin: auto;
}

ul {
	list-style: none;
	padding: 0;
}

li {
	font-family: 'bebas_neue_pro', Sans-Serif;
	font-weight: normal;
	font-size: 13px;
	line-height: 22px;
	letter-spacing: 3px;
	vertical-align: middle;
	margin-bottom: 20px;
}

li a {
	color: #fff;
	text-decoration: none;
}

#company {
	/*background: #7353eb;*/
	background: #000;	
	color:#fff;
}

#about {
	background: #d01666;
	color:#fff;
}

#contact {
	color:#000;
}

#menu-wrapper {
	position: fixed;
	right: 0px;
	top: 0px;
	text-align: right;
	z-index: 9999;
}

.controls, .controls-top {
	left: 0px;
	width: 100%;
	opacity: 0.7;
	letter-spacing: 5px;
	text-align: center;
	z-index: 1000;
}

.controls {
	position: relative;
	bottom:7vh;
	font-size: 250%;	
}

.controls-top {
	position:absolute;
	bottom: 4vh;
	font-size: 125%;
	text-transform: uppercase;	
}

.controls a,
.controls a:hover,
.controls-top a,
.controls-top a:hover {
	text-decoration: none;
	cursor: pointer;	
}

.blinky {
    -moz-transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    -ms-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
    order: name, direction, duration, iteration-count, timing-function */ -moz-animation:blink normal 2s infinite ease-in-out;
    -webkit-animation: blink normal 2s infinite ease-in-out;
    -ms-animation: blink normal 2s infinite ease-in-out;
    animation: blink normal 2s infinite ease-in-out;
}
​
@-moz-keyframes blink{0%,100%{opacity:1}50%{opacity:0}}@-webkit-keyframes blink{0%,100%{opacity:1}50%{opacity:0}}@-ms-keyframes blink{0%,100%{opacity:1}50%{opacity:0}}@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}


.brclear {
	clear: both;
}

.logosoup {
	padding: 40px 0 0 0;
	text-align: center;
	margin: auto;
	width: 80%;
	display: inline-block;
}

.logo-showcase {
	font-size: 14px;
	margin: 5% auto;	
}

.column-wrapper {
	display: block;
	width: 60%;
	margin: 2% auto 0%; 
}

.column {
	display: table-cell;
	width: 25%;
	text-align: left;
	margin:auto; 
	float:left;
}

.column ul {
	margin-right: 10%;
	margin-left: 10%;	
}

.column li {
	font-family: 'bebas_neue_pro_book', Sans-Serif;
	font-weight: normal;
	font-size: 120%;
	line-height: 22px;
	letter-spacing: 1px;
	vertical-align: middle;
	margin-bottom: 20px;
}

.column li:first-of-type {
	font-family: 'bebas_neue_pro', Sans-Serif;
	font-weight: bold;	
	text-transform: uppercase;
	letter-spacing: 3px;	
}

.v-spacer {
	display: block;
	height:5vh;	
}


.logo-pulse-container {
 	margin: 0 auto;    
}

.logo-top {
    display: block;
    max-width: 30%;
  	height: 100%;
  	padding:13% 0%;
 	margin: 0 auto;   	
	background: url('../assets/images/logo/nm_logo_1000px.svg') no-repeat center center;
	background-size: contain;
  	animation: heartbeat 8s infinite, shadow-pulse-big 8s infinite;		
}

.logo-overlay {
    display: block;	
 	margin: 0 auto;
	width:150px;
 	height:150px;   	
	background: url('../assets/images/logo/nm_logo_white_400px.svg') no-repeat center center;
	background-size: contain;	
}

@keyframes heartbeat {
  0%
  {
    transform: scale( .5 );
  }
  20%
  {
    transform: scale( .75 );
  }
  40%
  {
    transform: scale( .5 );
  }
  60%
  {
    transform: scale( .5 );
  }
  80%
  {
    transform: scale( .75 );
  }
  100%
  {
    transform: scale( .5 );
  }
}

@media screen and (max-aspect-ratio: 50/59) {
    @supports (-webkit-overflow-scrolling: touch) {
	    #brand .controls, #web .controls, #devops .controls, #data .controls, #consulting .controls, #audio .controls {
			position:relative;
			top:-200px;
		}
	}
}

@media screen and (max-device-width: 1024px) and (orientation: landscape) {
    @supports (-webkit-overflow-scrolling: touch) {
	    .controls {
			position:relative;
			bottom:75px;
		}
	}
}

@media screen and (max-aspect-ratio: 50/59) and (max-device-width: 767px) {
	.content-middle-left {
		vertical-align: top;
		padding: 50px 30px;
		transition: background .2s ease-out;
	}
	#logo-top {
	  top: 400px;
	  left: 24px;
	}	
	#certifications-top {
	  top: 403px;
	  left: 100px;
	}	
	#certifications-top.home {
	  top:15px;
	  left: 15px;
	}		
	.fp-viewing-7 #logo-top, .fp-viewing-7 #certifications-top,
	.fp-viewing-8 #logo-top, .fp-viewing-8 #certifications-top,
	.fp-viewing-9 #logo-top, .fp-viewing-9 #certifications-top,
	.fp-viewing-10 #logo-top, .fp-viewing-10 #certifications-top,
	.fp-viewing-11 #logo-top, .fp-viewing-11 #certifications-top {
		display:  none;
	}


}

@media screen and (max-aspect-ratio: 50/59) and (max-device-width: 767px) and (orientation: portrait) {
	@supports (-webkit-overflow-scrolling: touch) {
	  /* CSS specific to iOS devices */ 
	  .logo-top {
		  position:relative;
		  top:-45px;
	  }
	}
}

@media screen and (min-aspect-ratio: 80/57) {
}

@media screen and (min-aspect-ratio: 80/57) and (max-device-width: 1024px) {
	.controls {
	    bottom: 14vh;
    }
}

@media screen and (max-width: 760px) {
	.logo-top {
    	max-width: 50%;
		padding: 25% 0%;    	
	}
	.logo-overlay {
		width: 75px;
		height: 75px; 				
	}
	p.copyright {
		margin-top:50px;	
	}
	.controls-top {
		font-size: 100%;
	}	
	h1.company {
		font-size: 250%;
	}
	h2.company-tagline {
		font-size: 100%;
	}
	.description {
		width: 300px;
	}
	.company-description p, .about-description p  {
    	width: 90%;
	}	
	.address p {
		font-size: 14px;
		line-height: 20px;
		margin: 0;
	}
	.info {
		text-align: center;
		padding: 10px 0 0 0;
		width: 73%;
		margin: auto;
	}
	.company-description p{
		font-size: 16px;
		line-height: 20px;
	}
	.info p, .about-description p {
		font-size: 16px;
		line-height: 20px;
		margin: 3% 0;
	}	
	.controls {
		opacity: 0.9;
		font-size: 10px;
		bottom: 10px;
	}
	.twocol {
		width: 90%;
	}
	.content-middle h1, .content-top h1, .content-bottom h1 {
    	text-align: left;
	}	
	.content-middle {
		vertical-align: middle;
		height: 100vh;
		width: 100vw;
		text-align: left;
		padding-left: 30px;		
	}
	.content-middle-left {
		padding-left: 30px;
		width: 100%;
	}
	*::-webkit-media-controls-panel {
		display: none!important;
		-webkit-appearance: none;
	}
	/* Old shadow dom for play button */
	*::--webkit-media-controls-play-button {
		display: none!important;
		-webkit-appearance: none;
	}
	/* New shadow dom for play button */
	/* This one works */
	*::-webkit-media-controls-start-playback-button {
		display: none!important;
		-webkit-appearance: none;
	}
	.logosoup {
		padding: 10px 0 0 0;
		text-align: center;
		margin: auto;
		width:100%;
		display: inline-block;
	}
	.logo-showcase {
		width: 75%;					
	}
	.client-logo {
		width: 60px;
		height: 35px;
		padding: 10px 7px 0 7px;
	}
	.column {
		display: block;
		width:100%;
		text-align: center;
	}
	.column ul {
		margin:3% 0;
	}
	.mobile-hide {
		display: none;
	}				
}

@media screen and (min-width: 768px) and (max-width: 1022px) {
	.logo-top {
    	max-width: 50%;
		padding: 25% 0%;    	
	}
	#logo-top {
	  top: 15px;
	  left: 24px;
	}	
	#certifications-top {
	  top: 15px;
	  left: 100px;
	}	
	#certifications-top.home {
	  top: 15px;
	  left: 15px;
	}		   
	h2 {
		font-size: 16px;
		line-height: 20px;
		transition: all .3s ease-out;
	}
	h1 {
		font-size: 42px;
		letter-spacing: 1px;
		line-height: 50px;
		transition: all .3s ease-out;
	}
	p {
		font-size: 16px;
		margin-bottom: 20px;
		line-height: 16px;
		transition: all .3s ease-out;
	}
	.project-button {
		padding: 13px 25px;
		font-size: 12px;
		transition: all .3s ease-out;
		display: block;
	}
	.content-middle-left {
		width: 100vw;
		vertical-align: top;
		padding: 120px 30px 0 30px;
		transition: background .2s ease-out;
	}	    
    .column-wrapper {
    	width: 90%;
	}
	.client-logo {
		width: 120px;
		height: 55px;
		padding: 10px 20px 0 20px;
	}
	.controls {
	    bottom: 22vh;
    }		
	/*.controls {
	    display: none;
    }*/	
}

@media screen and (min-width: 768px) and (max-width: 1022px) and (orientation: portrait) {
	@supports (-webkit-overflow-scrolling: touch) {
	  /* CSS specific to iOS devices */ 
	  .logo-top {
		  position:relative;
		  top:-45px;
	  }
	}
}

@media screen and (min-width: 960px) {	
	.desktop-hide {
		display: none;
	}
	.description {
		padding-top: 60px;
	}
	h2 {
		font-size: 16px;
		line-height: 20px;
		transition: all .3s ease-out;
	}
	h1 {
		font-size: 42px;
		letter-spacing: 1px;
		line-height: 50px;
		transition: all .3s ease-out;
	}
	p {
		font-size: 16px;
		margin-bottom: 20px;
		line-height: 16px;
		transition: all .3s ease-out;
	}
	.project-button {
		padding: 13px 25px;
		font-size: 12px;
		transition: all .3s ease-out;
	}
	.content-middle-left {
		padding: 0 60px;
		transition: background .2s ease-out;
	}
	.client-logo {
		width: 120px;
		height: 55px;
		padding: 10px 20px 0 20px;
	}
	.half-left, .half-right{
		display: table-cell;
		width: 50%;
		padding: 0 2%;
		text-align: left;
	}	
}

@media screen and (max-width: 1112px) and (orientation: landscape) {
		#logo-top {
		  top: 15px;
		  left: 50px;
		}	
		#certifications-top {
		  top: 15px;
		  left: 126px;
		}	
		#certifications-top.home {
		  top: 15px;
		  left: 15px;
		}
}

video::-webkit-media-controls {
	display: none !important;
}

@media screen and (min-device-width: 1025px) {
	#bg-shade {
		background: #590000;
		position: fixed;
		opacity: 0.3;
		left: 0px;
		top: 0px;
		width: 100%;
		height: 100%;
		z-index: -2;
	}
	#bg-pattern {
		background-image: url('../assets/bg_pattern.png');
		position: fixed;
		opacity: 0.8;
		left: 0px;
		top: 0px;
		width: 100%;
		height: 100%;
		z-index: -1;
	}
}

.contact {
	display: block;
	margin: 0 auto;
}

@media screen and (min-width: 1280px) {
	.description {
		width: 500px;
	}
	.company-description p, .about-description p {
    	width: 45%;
	}
	h1 {
		font-size: 64px;
		letter-spacing: 1px;
		line-height: 72px;
		transition: all .3s ease-out;
	}
	.tech-consulting h1 {
		font-size: 62px;
	}	
	p {
		transition: all .3s ease-out;
	}
	.project-button {
		padding: 20px 40px;
		font-size: 18px;
		transition: all .3s ease-out;
	}
	.content-middle-left {
		padding: 0 80px;
		transition: background .2s ease-out;
	}
	.client-logo {
		width: 170px;
		height: 75px;
		padding: 30px 30px 0 30px;
	}	
}

.hidden {
	display: none;
}

.burger-icon, .close-icon {
	position: relative;
	margin-top: 8px;
	margin-bottom: 8px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.burger-icon,
.burger-icon::before,
.burger-icon::after,
.close-icon::before,
.close-icon::after {
	display: block;
	width: 35px;
	height: 4px;
	background-color: #000;
	/*background-color: #1574c4; BLUE */	
	-webkit-transition-property: background-color, -webkit-transform;
	-moz-transition-property: background-color, -moz-transform;
	-o-transition-property: background-color, -o-transform;
	transition-property: background-color, transform;
	-webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	transition-duration: 0.3s;
}

.burger-icon::before,
.burger-icon::after,
.close-icon::before,
.close-icon::after {
	position: absolute;
	content: "";
}

.burger-icon::before,
.close-icon::before {
	top: -12px;
}

.burger-icon::after,
.close-icon::after {
	top: 12px;
}

.close-icon:before, .close-icon::after {
	background:#fff;
}

.menu-button.is-active .burger-icon, .menu-button.is-active .close-icon {
	background-color: transparent;
}

.menu-button.is-active .burger-icon::before, .close-icon::before {
	-webkit-transform: translateY(12px) rotate(45deg);
	-moz-transform: translateY(12px) rotate(45deg);
	-ms-transform: translateY(12px) rotate(45deg);
	-o-transform: translateY(12px) rotate(45deg);
	transform: translateY(12px) rotate(45deg);
}

.menu-button.is-active .burger-icon::after, .close-icon::after {
	-webkit-transform: translateY(-12px) rotate(-45deg);
	-moz-transform: translateY(-12px) rotate(-45deg);
	-ms-transform: translateY(-12px) rotate(-45deg);
	-o-transform: translateY(-12px) rotate(-45deg);
	transform: translateY(-12px) rotate(-45deg);
}

.menu-state {
	padding: 20px;
	color: #fff;
}

.menu-state:hover {
	opacity: 1;
	color: #23c9ff;
}

.menu-normal {
	margin-top: -380px;
	transition: all .3s ease-in-out;
}

#main-menu {
	background: rgba(0, 0, 0, 0.9);
	/*background: rgba(21, 116, 196, 0.9); BLUE */ 	
	padding-top: 1px;
	padding-bottom: 1px;
	padding-right: 20px;
	font-size: 150%;
	text-transform: uppercase;
}

.activated {
	margin-top: 0;
	width: auto;
	opacity: 1;
	transition: all .3s ease-in-out;
}

.link {
	cursor: pointer;
}

p.copyright {
	font-size: 14px;
	color: #fff;
}

/*.click-me {
	font-size: 14px;
	color: #1574c4;
	position: absolute;
	bottom:10%;
	left:50%;
	margin:0 auto;
}*/

.popup_content {
  	width: 100%;
  	height: 100%;
  	background-color: rgba(21, 117, 196,0.9);
}

.popup1_open {
	cursor: pointer;
	color:transparent;	
}

.popup1_close {
	font-size: 400%;
	position: absolute;
	top:35px;
	right:55px;	
}

/*@media screen and (min-width: 320px) and (max-width: 767px) and (orientation: landscape) {
  html {
    transform: rotate(-90deg);
    transform-origin: left top;
    width: 100vh;
	height:100vw;
    overflow-x: hidden;
    position: absolute;
    top: 100%;
    left: 0;
  }
}*/


@media screen and (max-device-width: 767px) {
	#brand br, #web br, #devops br, #data br, #audio br {
		display: none;
	}
}

@media screen and (min-width: 1920px) {
	.info.center {
		width: 60%;
	}
}

.white-background .burger-icon, .white-background .burger-icon:before, .white-background .burger-icon:after {
	color:#000!important;
	background: #000!important;	
}

.black-background .burger-icon, .black-background .burger-icon:before, .black-background .burger-icon:after {
	color:#fff;
	background: #fff;	
}


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

	.company-description, .about-description {
		margin-top:1.5%;
	}	
	
	.company-description p, .about-description p {
		font-size: 200%;
		line-height: 150%;
		margin:0.75% auto;
	}
	
	.company-description p{
		width:45%;
	}	
	
	.about-description p{
		width:35%;
	}		
	
	.column-wrapper {
		font-size:115%;		
		width:50%;
	}
	
	.logo-showcase {
		font-size: 200%;		
	}
		
	.contact .info p {
		font-size: 250%;
		line-height: 150%;					
	}

}

@media screen and (min-width: 3000px) {
	
	.description {
		font-size: 200%;
		width:1000px;
	}
	
	.description h2 {
		margin:2% 0;
	}	
	
	.description p {
		font-size: 110%;
		line-height: 110%;
		width:800px;		
	}
	
	.project-button {
		margin-top:1%;
	}

	#brand br, #devops br {
		display: none;	
	}
	
	.company-description, .about-description {
		margin-top:1.25%;
	}	
	
	.company-description p, .about-description p {
		font-size: 200%;
		line-height: 150%;
		margin:0.75% auto;
	}
	
	.company-description p{
		width:35%;
	}	
	
	.about-description p{
		width:25%;
	}	
		
	.column-wrapper {
		font-size:120%;
		width:40%;
	}
	
	.logo-showcase {
		font-size: 150%;		
	}
	
	.contact .info p {
		font-size: 250%;
		line-height: 150%;					
	}	
		
}