@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');


.roboto-thin {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.roboto-light {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.roboto-regular {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.roboto-medium {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.roboto-bold {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.roboto-black {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.roboto-thin-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: italic;
}

.roboto-light-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.roboto-regular-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.roboto-medium-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: italic;
}

.roboto-bold-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.roboto-black-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-style: italic;
}


body, html{
	margin: 0;
	padding: 0;
	width: 100%;
	height: auto;
	background-color: rgb(237 237 237);
	font-family: "Roboto", sans-serif;
	font-weight: 300;
 	font-style: normal;
	font-size: 17px;
}

a{
	text-decoration: none !important
}

a:link{
	color: #fff;
	text-decoration: none !important;
}
a:visited{
	color: #fff;
	text-decoration: none !important;
}
a:hover{
	color: #fff;
	text-decoration: none !important;
}
a:active{
	color: #fff;
	text-decoration: none !important;
}

p{
	margin-top: 0px;
	margin-bottom: 12px;
	letter-spacing: 0; 
}

.clear{
	clear: both;
}

.container_relative{
	position: relative;
	width: 440px;
	height: 440px;
}

.container{
	width: 100%;
	max-width: 980px;
	margin: 37px auto;
}

.title img{
	height: 48px;
	width: auto;
}

.vision_title img{
	height: 130px;
	width: auto;
	position: absolute;
	bottom: 30px;
}

#image_text{
	width: 380px;
	height: auto
}

.element_full{
		width: 440px;  
		height: 440px;
		background-color: #ffffff; 
		margin: 25px;
		float: left;
}

.element{
		width: 440px;  
		height: 440px;
		background-color: #ffffff; 
		margin: 25px;
		float: left;
		position: relative;
}
	.logo{
	}
	.logo img{
			width: 80%;
			height: auto;
		    position:absolute;
			margin:auto;
			top:0;
			bottom:0;
			left: 0;
	     right: 0;
	}
.element_main{
		width: 440px;  
		height: 440px;
		background-color: #ffffff; 
		margin: 25px;
		float: left;
		position: relative;
}
	.logo{
	}
	.logo img{
			width: 80%;
			height: auto;
		    position:absolute;
			margin:auto;
			top:0;
			bottom:0;
			left: 0;
	     right: 0;
	}
	
.vision{	
	padding: 22px;	
}
	.contact{
		background-color: #4a4a4a;
		color: #f6f6f6;
		padding: 20px;
		height: calc(100% - 40px);
		position: relative;
		text-decoration: none !important
	}
	.contact a{
		text-decoration: none !important
	}
	.contact a:link{
		text-decoration: none !important
	}
	.contact a:visited{
		text-decoration: none !important
	}
	.contact a:hover{
		text-decoration: none !important
	}
	.contact a:active{
		text-decoration: none !important
	}
		.vertical-text {
			display: inline-block;
			transform: rotate(-90deg);
			position: absolute;
			font-size: 9px;
			right: 0;
			bottom: 45px;
			z-index: 1000;
		}
		.vertical-text a:link {
			color: rgba(255,255,255,0.40)
	}