.appProject {
	width: 350px;
	height: 100px;
	padding-top: 5px;
	color: #535353;
    font-family: Gilroy-Regular;
    font-size: 12px;
    line-height: 1.5em;
	position: relative;
}

.appProject strong {
	color: #000000;
}

.appProject img {
	float:left;
	margin-right: 10px;
	margin-top:5px;
}

.appProject a:link, .appProject a:active, .appProject a:visited {
	text-decoration: none;
	color: #fff;
	background-color:#333333;
	padding: 2px;
}

.appProject a:hover {
	background-color: #5CE3FF;
	color: #000000;
}

.appLink {
	position: absolute;	
	top:5px; 
	right:0px;
}

.appContent {
	margin-top:10px;
}


.section.biography {
	background: #000 !important;
	color: #FFF !important;
}

.biography .row {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
}

.biography-description {
	padding: 140px 15px !important;
}

.biography p {
	font-size: 15px;
	font-family: "cousine", monospace;
}

.biography .cita {
	letter-spacing: 5px;
	font-size: 20px;
	font-family: "Montserrat", sans-serif;
	font-weight: 900;
	line-height: 27px;
}

.biography .biography-image {
	background-size: cover !important;
	background-position: center center !important;
	display: block;
}

.productLnk {
	background-color:#5CE3FF;
	padding: 2px 5px 2px 5px;
        text-decoration: none !important;
	color: #000000 !important;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
}

body {
	background-color: #f9f8fa;
	font-family: Gilroy-Regular;
}

.btnImprint, .btnTerms, .btnPrivacy {
	cursor: pointer;
}

.bg-blue {
	background-color: #0083cb;
}

.container-full {
	margin: 0 auto;
	width: 98%;
}

.error {
	margin-top: 10px !important;
	margin-bottom: 5px !important;
	color: white;
	background-color: red;
	padding: 5px 5px 5px 5px !important;
	position: relative !important;
}

#footer ul li {
	text-align: left;
	list-style-type: none;
	color: #333;
	margin-left: -40px;
}

.cardbox {

}

.cardbox_inner {
	padding-top: 20px;
	min-height: 250px;
	border-radius: 5px;
}

.cardimage {

	margin-top: 20px;
	text-align: center;
}

.cardimage img {

	height: 60px;
	width: auto;
}

.cardtext {

	text-align: center;
	padding: 20px 10px 20px 10px;
	font-weight: bold;
	color:white;
}

.ceo {
	position:absolute; 
	background-color:#fff; 
	color:#000; 
	font-family:Gilroy-Regular;
	font-size:12px; 
	padding: 2px 5px 2px 5px;
}

.font50 {
	font-family: Gilroy-Regular;
    font-size: 50px;
	color: #000;
	background-color: #ffffff;
	margin-right: auto;
}

.fontTextNormal12 {
    font-family: Gilroy-Regular;
    font-size: 12px;
	line-height: 1.5em;
	color: #535353; 
}

#footer {
	color: #333 !important;
	background-color: #ddd;
	padding-top: 20px;
	margin-top: 30px;
	padding-bottom: 40px;
	font-size: 12px;
	line-height: 24px;
}

#footerContent {
	font-family: Gilroy-Regular;
    font-size: 11px;
	color: #000;
}

#footer a:link, #footer a:active, #footer a:visited {
	text-decoration: none;
	color: #000000;
	padding: 5px;
}

#footer a:hover {
	text-decoration: none;
	color: #000000;
	background-color:#5CE3FF;
	padding: 5px;
}



h1 {
	font-family: Gilroy-SemiBold;
	font-weight: normal;
	font-style: normal;
	font-size: 45px;
}

H2 {
	font-family: Gilroy-Regular;
    font-size: 24px;
    line-height: 24px;
    margin-bottom: 10px;
	font-weight: normal;
}

h3 {
	font-size: 16px;
	font-weight: bold;
}


/* HOME */
.innerlefttopcontainer {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 450px;
	height: 450px;
	background-image:url(../imgs/square1.jpg);
	background-position:0 0;
	background-repeat: no-repeat;
        cursor: pointer;
}

.innerrighttopcontainer {
	position: absolute;
	left: 450px;
	top: 0px;
	width: 450px;
	height: 450px;
	background-image:url(../imgs/square2.jpg);
	background-position:0 0;
	background-repeat: no-repeat;
        cursor: pointer;
}

.innerleftbottomcontainer {
	position: absolute;
	left: 0px;
	top: 450px;
	width: 450px;
	height: 450px;
	background-image:url(../imgs/square3.jpg);
	background-position:0 0;
	background-repeat: no-repeat;
        cursor: pointer;
}

.innerrightbottomcontainer {
	position: absolute;
	left: 450px;
	top: 450px;
	width: 450px;
	height: 450px;
	background-image:url(../imgs/square4.jpg);
	background-position:0 0;
	background-repeat: no-repeat;
        cursor: pointer;
}


/* WHO WE ARE */
.innerlefttopcontainer_whoweare {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 250px;
	height: 320px;
	padding: 25px;
}

.innermiddletopcontainer_whoweare {
	position: absolute;
	left: 300px;
	top: 0px;
	width: 250px;
	height: 320px;
	padding: 25px;
}

.innerrighttopcontainer_whoweare {
	position: absolute;
	left: 600px;
	top: 0px;
	width: 250px;
	height: 320px;
	padding: 25px;
}

.innerleftbottomcontainer_whoweare {
	position: absolute;
	left: 0px;
	top: 340px;
	width: 250px;
	height: 300px;
	padding: 25px;
}

.innermiddlebottomcontainer_whoweare {
	position: absolute;
	left: 300px;
	top: 340px;
	width: 250px;
	height: 300px;
	padding: 25px;
}

.innerrightbottomcontainer_whoweare {
	position: absolute;
	left: 600px;
	top: 340px;
	width: 250px;
	height: 300px;
	padding: 25px;
}


/* OINK */

.oinkTitle {
    font-family: Gilroy-Regular;
    font-size: 40px;
    padding: 50px 50px 50px 50px;
}


.innerlefttopcontainer1_oink {
	position: absolute;
	left: 0px;
	top: 820px;
	width: 350px;
	height: 900px;
	padding: 25px 50px 25px 50px;
}

.innerrighttopcontainer1_oink {
	position: absolute;
	left: 450px;
	top: 0px;
	width: 350px;
	height: 450px;
	padding: 25px 50px 25px 50px;
}

.innerbottomcontainer3_oink {
    position: absolute;
    left: 0px;
    top: 1300px;
    width: 700px;
    height: 450px;
    padding: 25px 50px 25px 50px;
}

#windows_oinkText_left {
    position: relative;
    left: 10px;
    top: 0px;
    width: 400px;
    float: left;
    display: block;
}

#windows_oinkText_right {
    position: relative;
    left: 0px;
    top: 0px;
    width: 200px;
    padding: 25px 50px 25px 50px;
    float:left;
    display:block;
}

/* SOFTWARE */ 
.innerlefttopcontainer_soft {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 350px;
	height: 900px;
	padding: 25px 50px 25px 50px;
}

.innerrighttopcontainer_soft {
	position: absolute;
	left: 450px;
	top: 0px;
	width: 350px;
	height: 450px;
	padding: 25px 50px 25px 50px;
}

/* INTERNET */
.innerlefttopcontainer_internet {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 350px;
	height: 800px;
	padding: 25px 50px 25px 50px;
}

.innerrighttopcontainer_internet {
	position: absolute;
	left: 450px;
	top: 0px;
	width: 350px;
	height: 450px;
	padding: 25px 50px 25px 50px;
}

/* CONTACT */
.topcontainer_contact {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 900px;
	height: 400px;
	padding: 0px;
}

.inner1bottomcontainer_contact {
	position: absolute;
	left: 10px;
	top: 450px;
	width: 100px;
	height: 220px;
	padding-top: 25px;
}

.inner2bottomcontainer_contact {
	position: absolute;
	left: 100px;
	top: 450px;
	width: 225px;
	height: 220px;
	padding-left: 60px;
}

.inner3bottomcontainer_contact {
	position: absolute;
	left: 375px;
	top: 450px;
	width: 275px;
	height: 220px;
	padding: 0px;
}

.inner4bottomcontainer_contact {
	position: absolute;
	left: 650px;
	top: 450px;
	width: 200px;
	height: 220px;
	padding: 0px;
}

/* AGBS */
.innercontainer_agbs {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 800px;
	padding: 50px;
}

/* CONTACT */
.inner1topcontainer_about {
	position: absolute;
	left: 50px;
	top: 0px;
	width: 250px;
	height: 250px;
	padding-top:50px;
}

.inner2topcontainer_about {
	position: absolute;
	left: 350px;
	top: 0px;
	width: 250px;
	height: 250px;
	padding-top:50px;
}

.inner3topcontainer_about {
	position: absolute;
	left: 650px;
	top: 0px;
	width: 250px;
	height: 250px;
	padding-top:50px;
}

.innermiddlecontainer_about {
	position: absolute;
	left: 1px;
	top: 213px;
	width: 900px;
	text-align: center;
}

.innerbottomcontainer_about {
	position: absolute;
	left: 50px;
	top: 600px;
	width: 800px;
}


.competences {

}

.competences_inner {
	margin-top: 20px;
	padding: 140px 5px !important;
	display: block;
	border-radius: 10px;
	text-align: center;
}

.competences p {
	color:white;
}

#logo {
	margin:20px 20px 20px 20px;
}

#logo img {
	max-height: 120px;
	max-width: 500px;
}


#map {
	width: 880px; 
	height: 400px; 
	border-width:10px; 
	border-color:#fff; 
	border-style:solid;
}

#maincontainer {
	background-color:#fff;
	margin-left: auto;
	margin-right: auto;
	width: 900px;
	padding: 0px;
	position: relative;
}

#mainMenu {
	width:950px;
	margin: 0px auto 10px auto;
}

.menuItem {
	color: #000000;
	font-family: Gilroy-Regular;
    font-size: 14px;
	float: right;
	margin-left: 5px;
	margin-right: 5px;
	padding: 4px;
	padding-top: 13px;
	background-color:#FFFFFF;
}

.menuItem a:link, .menuItem a:active, .menuItem a:visited {
	text-decoration: none;
	color: #000;
	padding-top:20px;
}

.menuItem:hover {
	text-decoration: none;
	color: #000;
	background-color: #5CE3FF;
}

.menuItemActive {
	color: #fff;
	font-family: Gilroy-Regular;
        font-size: 14px;
	float: right;
	margin-left: 5px;
	margin-right: 5px;
	padding: 4px;
	padding-top: 13px;
	background-color:#000;
}

.menuItemActive a:link, .menuItemActive a:active, .menuItemActive a:hover, .menuItemActive a:visited {
	text-decoration: none;
	color: #fff;
}

#page {
	width:100%;
}

.language-switch {
	background: black !important;
	width: 50px !important;
	left: 165px !important;
}

.language-switch:hover {
	background: #222 !important;
}

.language-switch a {
	color: white !important;
	display: block !important;
}















.circle {
	padding: 13px 20px;
	border-radius: 50%;
	background-color: #007bff;
	color: #fff;
	max-height: 50px;
	z-index: 2;
}

.how-it-works.row .col-2 {
	align-self: stretch;
}
.how-it-works.row .col-2::after {
	content: "";
	position: absolute;
	border-left: 5px solid #007bff;
	z-index: 1;
}
.how-it-works.row .col-2.bottom::after {
	height: 50%;
	left: 50%;
	top: 50%;
}
.how-it-works.row .col-2.full::after {
	height: 100%;
	left: calc(50% - 5px);
}

.how-it-works.row .col-2.fullleft::after {
	height: 100%;
	left: 50%;
}

.how-it-works.row .col-2.top::after {
	height: 50%;
	left: 50%;
	top: 0;
}


.timeline div {
	padding: 0;
	height: 40px;
}
.timeline hr {
	border-top: 5px solid #007bff;
	margin: 0;
	top: 15px;
	position: relative;
}
.timeline .col-2 {
	display: flex;
	overflow: hidden;
}
.timeline .corner {
	border: 5px solid #007bff;
	width: 100%;
	position: relative;
	border-radius: 15px;
}
.timeline .top-right {
	left: 50%;
	top: -50%;
}
.timeline .left-bottom {
	left: -50%;
	top: calc(50% - 5px);
}
.timeline .top-left {
	left: -50%;
	top: -50%;
}
.timeline .right-bottom {
	left: 50%;
	top: calc(50% - 5px);
}





















@media only screen and (max-width:1660px) {
	h1 {
		font-family: Gilroy-SemiBold;
		font-weight: 500;
		font-size: 35px !important;
		line-height: 35px !important;
	}

	H2 {
		font-family: Gilroy-Regular;
		font-size: 18px !important;
		line-height: 18px !important;
		margin-bottom: 10px;
		font-weight: normal;
	}
}



@media only screen and (max-width:1330px) {
	h1 {
		font-family: Gilroy-SemiBold;
		font-weight: 500;
		font-size: 25px !important;
		line-height: 25px !important;
	}

	H2 {
		font-family: Gilroy-Regular;
		font-size: 16px !important;
		line-height: 16px !important;
		margin-bottom: 10px;
		font-weight: normal;
	}
}


@media only screen and (max-width:990px) {

	.cardbox {
		margin-top: 20px;
	}

	.cardbox_inner {
		padding-top: 20px;
		min-height: 250px;
		border-radius: 5px;
	}

	.cardimage {

		margin-top: 20px;
		text-align: center;
	}

	.cardimage img {

		height: 60px;
		width: auto;
	}

	.cardtext {

		text-align: center;
		padding: 20px 10px 20px 10px;
		font-weight: bold;
		color:white;
	}

	h1 {
		font-family: Gilroy-SemiBold;
		font-weight: 500;
		font-size: 18px !important;
		line-height: 18px !important;
	}

	H2 {
		font-family: Gilroy-Regular;
		font-size: 16px !important;
		line-height: 16px !important;
		margin-bottom: 10px;
		font-weight: normal;
	}

	#logo {
		margin-top: 50px !important;
	}

	#logo img {
		max-height: 100%;
		max-width: 100%;
	}
}


@media only screen and (max-width:768px) {

	.cardbox {
		margin-top: 20px;
	}

	.cardbox_inner {
		padding-top: 20px;
		min-height: 250px;
		border-radius: 5px;
	}

	.cardimage {

		margin-top: 20px;
		text-align: center;
	}

	.cardimage img {

		height: 60px;
		width: auto;
	}

	.cardtext {

		text-align: center;
		padding: 20px 10px 20px 10px;
		font-weight: bold;
		color:white;
	}



	h1 {
		font-family: Gilroy-SemiBold;
		font-weight: 500;
		font-size: 35px !important;
		line-height: 35px !important;
	}

	H2 {
		font-family: Gilroy-Regular;
		font-size: 25px !important;
		line-height: 25px !important;
		margin-bottom: 10px;
		font-weight: normal;
	}

	#logo {
		margin-top: 50px !important;
	}

	#logo img {
		max-height: 100%;
		max-width: 100%;
	}

	#footer {
		text-align: center !important;
	}

	#footer ul li {
		text-align: center !important;
	}
}