body {
	font-family: 'Rubik', Arial, sans-serif;
	background: #1a1a1a;
	color: white;
	font-size: 18px;
	line-height: 1.5;
}

h1, h2, h3, h4, h5 {
	font-weight: 100;
	/* font-family: 'Fjalla One', sans-serif; */
	font-family: 'Saira Extra Condensed', sans-serif;
	font-weight: 500;
	/* letter-spacing: -1px; */
	color: #01abef;
}

h6 {
	text-transform: uppercase;
	font-weight: normal;
	font-size: 18px;

	/* font-family: 'Fjalla One', sans-serif; */
	font-family: 'Saira Extra Condensed', sans-serif;
	font-weight: 500;
	/* letter-spacing: -1px; */
	font-size: 16px;
}

.container { max-width: 1100px }
.hidden { display: none }
img { width: 100% }
a { cursor: pointer }

section h3, section h4 {
	text-transform: uppercase;
	margin-top: 0;
}

section h3 {
	text-align: center;
	font-size: 68px;
}

#rob {
	position: relative;
	min-height: 100vh;
	width: 100%;
	background: url('/assets/img/rob1a1a1a.jpg');
	background-size: auto 140%;
  background-repeat: no-repeat;
  background-position: left 90% top;
	padding-bottom: 100px;
}

#rob ul {
  list-style-type: none;
  margin-top: 40px;
  margin-left: 10px;
}

#rob ul a {
	text-decoration: none;
	color: white;
}

#rob h1 {
	text-transform: uppercase;
	font-size: 68px;
}

#rob .logo img {
	margin-top: 70px;
	max-width: 200px;
}

#rob .intro {
	padding: 10px;
	margin-left: 30px;
	margin-top: 70px;
	/*position: absolute;*/
	/*width: 40%;*/
	width: 77%;
	/* background-color: rgba(30, 30, 30, 0.3); */
	border-radius: 7px;

}

#rob.horizontal ul {
	float: right;
	margin-top: 40px;
}

#rob.horizontal ul li {
	display: inline-block;
	margin-right: 20px;
	font-size: 16px;
}

#rob.horizontal .logo img {
	margin-top: 30px;
}

#rob.horizontal {
	background-position: left 80% top 100px;
}

#rob.horizontal .intro {
	padding-left: 20px;
	padding-top: 10vh;
	width: auto;
	position: relative;
}

#intro-quotes {
	display: none;
}

@media (min-height: 850px) {
	#intro-quotes {
		margin-top: 60px;
		display: block;
	}
}

#rob blockquote {
	margin-left: 0;
}

#rob .quote-footer {
	font-size: 13px;
	text-align: right;
	margin-right: 50px;
}


#menu-icon {
	width: 64px;
	cursor: pointer;
}

#menu-icon path {
	fill: white;
}

#menu-icon .bar {
	-webkit-transform: rotate(0) translateY(0) translateX(0);
	transform: rotate(0) translateY(0) translateX(0);
	opacity:1;
	-webkit-transform-origin: 20px 10px;
	transform-origin: 20px 10px;
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.2s ease-in-out;
  transition: transform 0.3s ease-in-out, opacity 0.2s ease-in-out;
}
#menu-icon .bar:nth-of-type(1) {
  -webkit-transform-origin: 20px 10px;
  transform-origin: 20px 10px;
}
#menu-icon .bar:nth-of-type(3) {
  -webkit-transform-origin: 20px 20px;
  transform-origin: 20px 20px;
}
.open #menu-icon .bar:nth-of-type(1) {
	-webkit-transform: rotate(-45deg) translateY(0) translateX(0);
	transform: rotate(-45deg) translateY(0) translateX(0);
}
.open #menu-icon .bar:nth-of-type(2) {
	opacity: 0;
}
.open #menu-icon .bar:nth-of-type(3) {
	-webkit-transform: rotate(45deg) translateY(0em) translateX(0em);
	transform: rotate(45deg) translateY(0em) translateX(0em);
}

#rob #menu-icon {
	opacity: 0;
	position: fixed;
	margin-top: -100px;
	transition: opacity 0.3s, margin-top 0.3s, background 0.3s;
	margin-left: -84px;
}

#rob #menu.sticky #menu-icon {
  margin-top: 0px;
	background: rgba(50,50,50,0.2);
	padding: 3px 0px 10px 20px;
	opacity: 1;
}

#rob #menu.sticky.open #menu-icon {
	background: #555;
}

#rob #menu.sticky {
  position: fixed;
  z-index: 2;
  margin: 0;
  top: 0;
  margin-left: -10px;
}

#rob #menu ul li {
	padding: 0px 20px 0;
}

#rob #menu ul li:nth-of-type(1) {
	padding-top: 20px;
}

#rob #menu.sticky ul {
	/*padding: 20px 20px 0;*/
	margin: 0;
	transition: opacity 0.3s;
	overflow: hidden;
	background: #555;
	opacity: 0;
	height: 0;
}

#rob #menu.sticky.open ul {
	opacity: 1;
	height: auto;
}

section {
	padding-top: 100px;
	padding-bottom: 100px;
}

section.white {
	background: white;
	color: #222;
}

section.gray {
	background: #fefefe;
	color: #222;
}

section.blue {
	background: #0f2027;
	background: -webkit-linear-gradient(to top, #0f2027, #203a43, #2c5364);
	background: linear-gradient(to top, #0f2027, #203a43, #2c5364);
}


#specialities .columns {
	text-align: center;
	flex-wrap: wrap;
	margin-top: 30px;
	margin-bottom: 20px;
}

#specialities img.icon {
  max-width: 120px;
  margin-bottom: 20px;
}



#value .value-intro {
	max-width: 620px;
	padding-left: 20px;
	padding-right: 20px;
	margin:50px auto;
	margin-bottom:100px
}

#value {
	padding-bottom: 0;
	position: relative;
}

.design2 #value:after {
	content: ".";
	position: absolute;
	border: 1px solid red;
	width: 100%;
	top: 0;
	background: url('/assets/img/circles.svg');
	/*background-attachment: fixed;*/
	background-size: 200%;
	height: 3700px;
	pointer-events: none;
}

#value .row {
	background: white;
	overflow: hidden;
	border-bottom: 1px solid #eee;
	min-height: 80vh;
}

#value .row:last-of-type {
	border-bottom: 0px;
}

#value .columns {
	/*text-align: center;*/
	/*background: #ccc;*/
}

#value .columns h6 {
	color: #01abef;
	font-size: 52px;
	line-height: 64px;
	position: relative;
	/*min-height: 120px;*/
	/*text-align: center;*/
}

#value .container {
	/* display: table; */
}

#value .columns {
	/* max-height: 80%; */
	/* max-height: 80vh; */
	min-height: 600px !important;
	/* margin-bottom: 100px; */
}

#value .row.padding {
	padding-top: 100px;
}

#value .columns.text {
	display: table-cell;
	vertical-align: middle;
	/* padding: 10% 0; */
}

#value .columns.text > div {
	background-color: rgba(255, 255, 255, 0.7);
	border-radius: 7px;
	padding: 10px;
}

#value .columns.image {
	max-width: 500px;
	margin-bottom: -10px;
}

#value .columns.image img {
	width: auto;
	height: 100%;
}

#value .columns.image img.color {
	display: none;
}

.design1 #value .columns.image img {
	display: none;
}
.design1 #value .columns.image img.color {
	display: block !important;
}

#value blockquote {
	margin: 0;
	margin-top: 40px;
}

#value .quote-footer {
	font-size: 13px;
	text-align: right;
}

img.seq3 {
	margin-left: 50px;
}
img.seq4 {
	margin-left: 70px;
}

#overview {
	background-color: #444;
}

#overview {
	background-color: #000011;
	background-size: cover;
	background-image: url('/assets/img/pattern-tiled.svg?2')
}

#overview p.spec {
	text-indent: -56px;
	margin-left: 56px;
}

#overview p.spec b {
	text-transform: uppercase;
	margin-right: 10px;
}

#references .white {
	display: none;
}

#references img {
	display: none;
}

#references img.white {
	display: inline-block;
}

#references {
	background-color: #000011;
	background-image: url('/assets/img/pattern-tiled.svg?2');
	background-size: cover;
}

#references .row {
	display: flex;
	align-items: center;
}

.design1 #references {

}

#references h3 {
	margin-bottom: 50px;
}

#references .row {
	margin-top: 75px;
}

.wartsila {
	margin-top:-77px
}

#recommendations {
	padding-bottom: 0;
}

#recommendations hr {
	border-top: 3px double #eee;
	max-width: 75%;
	max-width: calc(100% - 70px);
	text-align: center;
	margin-bottom: 0;
}

#recommendations hr:after {
  content: '« »';
  display: inline-block;
  position: relative;
  top: -15px;
  padding: 0 10px;
  color: #eee;
  font-size: 18px;
}

#show-more-quotes {
	display: block;
	text-align: center;
	margin-top: -20px;
	font-size: 25px;
}

.design1 #recommendations {
	background-image: url('/assets/img/pattern.png');
}

#quotes {
	max-width: 800px;
	margin: auto;
	margin-top: 75px;
	margin-bottom: 50px;
}

.quote {
	/*border-bottom: 1px solid #eee;*/
	padding-bottom: 50px;
	margin-bottom: 40px;
}

.quote .footer {
	text-align: right;
	margin-right: 40px;
}

blockquote {
	margin-bottom: 0px;
}

blockquote span {
	quotes: "“" "”" "‘" "’";
}

.design1 blockquote span {
	quotes: "\00ab" "\00bb";
}


blockquote span:before {
  content: open-quote;
}
blockquote span:after {
  content: close-quote;
}

blockquote span:before, blockquote span:after {
	font-size: 42px;
  color: #ccc;
  margin: 5px;
  line-height: 18px;
  vertical-align: middle;
}

#value blockquote span:before, #value blockquote span:after,
.quote.open blockquote span:before, .quote.open blockquote span:after
{
	vertical-align: text-bottom;
	line-height: 5px;
}

blockquote span {
	height: 0;
	opacity: 0;
	overflow: hidden;
	transition: opacity 1s;
	display: inline-block;
}

blockquote span.show {
	height: auto;
	opacity: 1;
}

blockquote span.brief {
	height: auto;
	opacity: 1;
	white-space: pre-line;
}

.open blockquote span.brief {
	height: 0;
	opacity: 0;
}

blockquote span.full {
	height: 0;
	opacity: 0;
	white-space: pre-line;
}

.open blockquote span.full {
	height: auto;
	opacity: 1;
}


.quote a.read-full {
	float: right;
	font-size: 14px;
}
.quote .brief {
	font-size: 28px;
}
.quote .onclose {
	display: inline;
}
.quote .onopen {
	display: none;
}
.quote.open .onclose {
	display: none;
}
.quote.open .onopen {
	display: inline;
}


.fade {
	transition: opacity 1s;
	opacity: 0;
}

.fade.in {
	opacity: 1;
}

.contact-icon {
	width: 32px;
	margin-right: 5px;
	vertical-align: middle;
}

.footer-info {
	text-align: right;
}

.footer-info ul {
	list-style-type: none;
}

.footer-info svg {
  margin-right: 5px;
  vertical-align: middle;
}

.footer-info .logo {
	position: absolute;
	bottom: 20px;
	right: 0px;
}

.footer-info .logo img {
	width: 64px;
	vertical-align: middle;
	/* margin-right: -10px; */
	margin-left: 20px;
	filter: contrast(0.5);
}

#contact {
	padding-bottom: 0;
}
#contact .min-height {
	min-height: 470px;
}

#contact {
	color: #fff;
	background-color: #000007;
	background-size: cover;
	background-image: url('/assets/img/pattern-tiled.svg?2')
}

#contact label {
	font-weight: normal;
}

#contact input, #contact textarea {
	background-color: #555;
	color: #fff;
	border: #222;
}

#contact .button {
	background: #0494cd;
}

#contact .quote-footer {
	margin-bottom: 30px;
	font-size: 13px;
}


@media (min-width: 550px) {
	.container {
	   width: 90%;
	}
}
@media (min-width: 400px) {
	.container {
    width: 90%;
    padding: 0;
	}
}

@media (max-width: 1280px) {
	#rob {
		background: url('/assets/img/rob1a1a1a.jpg');
		background-size: auto 140%;
	  background-repeat: no-repeat;
	  background-position: left 100% top;
	}
}

@media (max-width: 1110px) {

	#rob #menu.sticky {
	  top: 0;
	  left: 0;
	  margin-left: 78px;
	}
}

@media (max-width: 850px) {
	#rob {
		background: url('/assets/img/rob1a1a1a.jpg');
		background-size: auto 140%;
	  background-repeat: no-repeat;
	  background-position: right -220px top
	}

	#rob .three.columns,
	#rob .six.columns {
		width: 100%;
		float: left;
	}

	#rob .intro {
		padding-left: 0;
		width: 60%;
	}

	#rob #menu {
	  position: fixed;
	  z-index: 2;
	  margin: 0;
	  top: 0;
	  left: 0;
	  margin-left: 78px;
	}

	#rob #menu ul li {
		padding: 10px 20px 0;
	}

	#rob #menu #menu-icon {
	  margin-top: 0px;
		background: #555;
		padding: 3px 0px 10px 20px;
		opacity: 1;
	}
	#rob #menu ul {
		/*padding: 20px 20px 0;*/
		margin: 0;
		transition: opacity 0.3s;
		overflow: hidden;
		background: #555;
		opacity: 0;
		height: 0;
	}

	#rob #menu.open ul {
		opacity: 1;
		height: auto;
	}

	#value .columns {
		margin: 0;
	}
	#value .two.columns {
		display: none;
	}
	#value .four.columns {
		width: 43%;
		margin: 0;
	}
	#value .four.columns.text {
		/*padding: 0;*/
	}

	#value blockquote, #value .quote-footer {
		/* display: none; */
	}

	.quote .brief {
		font-size: 24px;
	}
}

@media (max-width: 980px) {
	#value .columns.text {
		padding: 0 !important;
	}

	#value .columns.text blockquote {
		font-size: 14px;
	}
}


@media (max-width: 700px) {
	#value .first .four.columns.text>div,
	#value .third .four.columns.text>div  {
		position: absolute;
		width: 50%;
		z-index: 1;
	}

	#value .first .six.columns.image img {
		margin-left: -100px;
	}
	#value .third .six.columns.image {
		margin-left: -100px;
	}
	#value .six.columns.image img {
		margin-top: 250px;
		border: 1px solid transparent;
	}

	#value .second .six.columns.image img {
		margin-top: 422	px;
	}
}

@media (max-width: 550px) {

	.hide-mobile { display: none; }

	#rob {
		background: linear-gradient(
      rgba(0, 0, 0, 0.3),
      rgba(0, 0, 0, 0.3)
    ), url('/assets/img/rob1a1a1a.jpg');
		background-size: auto, auto 140%;
	  background-repeat: repeat, no-repeat;
	  background-position: 50%, right -299px top -48px;
	}
	#rob .logo img {
		margin-top: 80px;
		max-width: 120px;
	}

	#rob .intro {
		padding-top: 30px;
		margin-left: 5px;
	}

	#value .row.padding {
		margin-top: 20px;
		padding-top: 0;
	}
	#value .columns {
		/* max-height: 90vh; */
		min-height: auto !important;
		margin-bottom: 20px;
	}
	#value .columns h6 {
		font-size: 38px;
		line-height: 40px;
	}
	#value .four.columns.text {
		padding: 0;
	}
	#value .four.columns.text>div {
		margin-left: 10px;
		position: absolute;
		width: 50% !important;
		z-index: 1;
	}
	#value .six.columns.image img {
		float: right;
		margin-right: -160px;
	}
	#value .third .six.columns.image img {
		margin-right: -330px;
	}

	#references .row {
		display: block;
		margin-top: 0;
	}

	#references .four.columns {
		width: 80%;
		margin: auto;
		margin-bottom: 30px;
		float: none;
	}

	.wartsila {
		margin-top:0px
	}

	section {
		padding-top: 50px;
		padding-bottom: 50px;
	}

	blockquote {
		margin: 0px;
		font-size: 20px;
	}
	.quote .brief {
		font-size: 20px;
	}

	.quote .footer {
		margin-right: 0px;
	}

	.footer-info h4 {
		display: none;
	}
	.footer-info .logo {
		position: relative;
		bottom: 0;
	}
}

@media (max-width: 400px) {
	#rob {
		background: linear-gradient(
      rgba(0, 0, 0, 0.3),
      rgba(0, 0, 0, 0.3)
    ), url('/assets/img/rob1a1a1a.jpg');
		background-size: auto, auto 140%;
	  background-repeat: repeat, no-repeat;
	  background-position: 50%, right -230px top;
	}

	#value .six.columns.image  {
		filter: opacity(0.8);
	}
}

@media (min-device-width : 1024px) and (max-device-width : 1366px) and (min-device-height : 1024px) and (max-device-height : 1366px) and (min-width: 1024px) and (max-width: 1024px)  {
	#rob {
		background: url('/assets/img/rob1a1a1a.jpg');
		background-size: auto 140%;
	  background-repeat: no-repeat;
	  background-position: right -160% top;
	}

	#value .columns {
		margin: 0px;
	}
}

@media (min-device-width : 1024px) and (max-device-width : 1366px) and (min-device-height : 1024px) and (max-device-height : 1366px) and (min-width: 1366px) and (max-width: 1366px) {
	#rob {
		background: url('/assets/img/rob1a1a1a.jpg');
		background-size: auto 140%;
	  background-repeat: no-repeat;
	  background-position: left 100% top;
	}

	#value .columns {
		margin-bottom: 0px;
	}
}