@font-face {
  font-family: 'Spinnaker';
  src: url("../../fonts/Spinnaker-Regular.ttf");
}

@font-face {
  font-family: 'Helvetica W01 Light';
  src: url("../../fonts/Helvetica W01 Light.woff.ttf");
}

.banner img {
	width: 100%;
}

#first-layer {
	background-color: #004573;
}

#first-layer h1 {
	font-family: Spinnaker, sans-serif;
	font-size: 55px;
	color: #fff;
}

.it-solutions {
	position: sticky;
	margin-top: -193px;
}

.main-top {
	min-height: 420.20px!important;
	/*width: 0%;*/
}

.solutions-box {
	background-color: #f2f2f2;
	min-height: 260px;
	/*width: 0%;*/
}

/*.box-content-main {
	display: none;
}*/

.solutions-box h2 {
	font-family: Spinnaker, sans-serif;
	font-size: 66px;
	color: #004573;
	margin: 54px 0px 37px 0;
}

#short-line {
	width: 90%;
	height: 5px;
	border-bottom: 3px solid #004573;
	margin-top: 9px;
}

.text-solutions p {
	font-family: Helvetica W01 Light, sans-serif;
}

/*.find-more {
	display: flex;
	align-items: center;
  	justify-content: center;
}*/

.find-out-box {
	display: flex;
}

/*.find-out-box a {
	display: table-row;	
}*/

.find-out {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1 1;
	font-family: Helvetica W01 Light, sans-serif;
	font-size: 17px;
	color: #fff;
	width: 100%;
	text-align: center;
	background-color: #e31e2b;
}

.find-out:hover {
	background-color: #004573;
	color: #fff!important;
}

.find-out span {
	color: #fff;
}

.plus {
	display:inline-block;
  	width:52px;
  	height:52px;
  	background: linear-gradient(#fff,#fff), linear-gradient(#fff,#fff), #004573;
  	background-position:center;
  	background-size: 25% 1px,1px 25%; /*thickness = 2px, length = 50% (25px)*/
  	background-repeat:no-repeat;
}

.plus:hover {
	background-color: #e31e2b;
}

.service-back {
	display: flex;
	justify-content: center;
	flex-direction: row;
	color: #fff;
	background-image: none;
}

#back-sign-serv {
	position: relative;
	top: 25%; 	
}

#back-sign-serv:hover {
	color: #fff;
}

.first {
	display: flex;
}

.box {
	background-color: #f2f2f2;
	padding: 30px;
	height: inherit;
	max-width: 279px;
	min-height: 329px;
}

.second{
	flex-shrink: 0;
	z-index: 1;
}

.second-box-content, .second-row-box-content, .testimonials-content, #form-heading {
	/*opacity: 0;*/
}

.third {
	top: 12px;
	left: -87.5%;
	position: relative;
	border: 3px solid #f2f2f2;
	background-color: transparent;
	min-width: 279px;
}

.box h4 {
	font-family: Spinnaker, sans-serif;
	font-size: 25px;
	color: #004573;
}

.box p {
	font-family: Helvetica W01 Light, sans-serif;
	letter-spacing: 1px;
}

#last-box {
	font-size: 23px;
}

#last-box-par {
	line-height: 26.5px;
}

.box a {
	color: #e31e2b;
	font-family: Helvetica W01 Light, sans-serif;
}

.box a:hover {
	color: #0a0a0a;
}

#first-layer {
	padding-top: 7px;
}

#second-layer {
	position: relative;
	top: -95px;
}

.second-row h4 {
	font-size: 24px;
}

#testimonials-container {
	position: relative;
	background-color: #f2f2f2;
}

.testimonial-header {
	color: #004573;
}

#testimonials-container h5 {
	font-family: Spinnaker, sans-serif;
	font-size: 28px;
}

#testimonials-container p {
	font-family: Spinnaker, sans-serif;
}

.first-slide p {
	font-size: 26px;
	line-height: 33.8px
}

.not-first p {
	font-size: 35px;
	line-height: 45.5px;
}

.user-info {
	font-family: Helvetica W01 Light, sans-serif;
	color: #e31e2b;
	font-weight: 600;
}

.arrows {
	cursor: pointer;
	position: absolute;
	top: 50%;
	transform: translate(-50%,-50%);
}

.arrow-left {
    left: 9.5%;
}

.arrow-right {
	float: right;
    right: 7%;
}

.arrows:hover {
	opacity: 0.6;
}

.arrows svg {
	fill: #004573;
}

.arrows .left {
	transform: rotate(180deg);
}

.circle {
  	height: 6px;
  	width: 6px;
	margin: 0 5px;
  	background-color: #004573;
  	cursor: pointer;
}

.active {
	background-color: transparent;
	border: 2px solid #004573;
	height: 9px;
	width: 9px;
	border-radius: 50%;
}

#divider {
	border-top: 16px solid #004573;
}

.top-line {
	height: 149px;
	background-color: #004573;
}

/*.service-container {
	background-color: #f2f2f2;
}*/

.first-row-container {
	top: -92px;
	position: relative;
}

/*.title-container {
	background-color: #fff;
}*/

.title {
	font-family: Spinnaker, sans-serif;
	font-size: 63px;
	letter-spacing: 0.66px;
	color: #004573;
	padding: 23px 57px 23px;
	/*background-color: #fff;*/
	background-color: transparent;
	/*width: 0%;*/
}

.subpage-second {
	flex-grow: 0;
   	flex-shrink: 0;
	flex-basis: 100%;
	background-color: #f2f2f2;
}

.subpage-behind {
	flex-grow: 0;
   	flex-shrink: 0;
	flex-basis: 100%;
 	top: 12px;
	right: 98.5%;
	position: relative;
	border: 3px solid #f2f2f2;
	background-color: transparent;
}

.paragraphs {
	font-family: Helvetica W01 Light, sans-serif;
	letter-spacing: 0.5px;
	line-height: 27.2px;
	/*opacity: 0;*/
}

.data-prot-par {
	opacity: 1;
}

.back-button {
	color: #e31e2b;
}

.paragraph-heading {
	font-family: Spinnaker, sans-serif;
	font-size: 28px;
	letter-spacing: 0.84px;
	line-height: 33.6px;
	color: #004573;
	word-break: break-word;
}

.paragraph-subheading {
	font-size: 20px;
}

.analyse-heading {
	font-size: 24px;
	letter-spacing: 0px;
}

.cta {
	font-weight: 600;
	color: #004573;
}

.cta:hover {
	color: #1779ba;
}

.file-types {
	list-style-type: none;
}

#data-prot-heading {
	margin-top: 60px;
	font-size: 55px;
}
	
#data-prot-title {
	font-size: 55px;
}

@media only screen and (max-width:1024px) {
	.it-solutions {
	    position: relative;
	    margin-top: 0px;
	}
	
	.solutions-box {
		min-height: inherit;
		
	}
	
	.solutions-box h2 {
		margin-top: 37px;
	}
	
	.box-content {
		padding: 0 10px;
	}
	
	h2 {
		font-size: 30px!important;
	}
	
	#data-prot-heading {
		font-size: 29px!important;
	}
	
	.modal-form h4 {
	    font-size: 55px!important;
	}
}

@media only screen and (max-width:768px) {
	#first-layer h1 {
    	font-size: 35px;
	}
	
	.solutions-box {
		min-height: inherit;
		
	}
	
	.solutions-box h2 {
		margin-top: 37px;
	}
	
	.second{
		max-width: -moz-available;
		max-width: fit-content;
	}
	
	.third {
		right: 81.5%;
		left: auto;	
	}
	
	#testimonials-container p {
	    font-size: 21px;
		line-height: 30px;
	}
	
	.arrows {
		display: none;
	}
	
	.title {
		font-size: 35px;
		position: relative;
		/*z-index: 1;*/
	}
	
	.subpage-behind {
	    right: 97.5%;
	}
	
	#data-prot-title {
		font-size: 28px;
		letter-spacing: normal;
		padding: 23px 15px;
	}
	
	.modal-form h4 {
	    font-size: 55px!important;
	}
}