Styles.css

@font-face {
	font-family: "Montserrat";
	scr: url(fonts/Montserrat-SemiBold.ttf);
}
* {
	font-size: 100%;
	font-family: "Montserrat";
}

body{
	width: 100%;
	margin: auto;
	background-color: #ebebeb; #Grey
}

img {
	vertical-align: middle;
}

header{
	width: 100%;
	background-color: #373c3f;
	height: 100px;
	display: inline-block; 
} 

header a{
	margin: 40px 2vw;
	display: inline-block;
	color: #ebebeb;
	text-decoration: none;
	transition: all 0.3s cubic-bezier(.25,.8,.25,1);
}

.without-menu, .hide-menu {
	display: none;
}

.resource {
	padding: 192px 12% 192px 7%;
	background: linear-gradient(to top left, #078aa4, #19b4c6);
	font-size: 30px;
	color: #a8d7e0;
}

.resource h2{
	font-size: 70px;
	color: #ffffff;
}

.link-box{
	display: flex;
	height: 25vw;
}

.text-left{
	width: 75%;
	background-color: #462660;
	justify-content: center;
	display: inline-flex;
	align-items: center;
	color: #756b83;
}

.link-right{
	width: 25%;
	background-color: #bc3183;
	justify-content: center;
	display: inline-flex;
	align-items: center;
	float: right;
}

.link-box h2{
	font-size: 30px;
	color: #64586e; 
}

.blockpic {
    display: flex;
	flex-flow: row;
	padding: 0;
	margin: 0;
	list-style-type: none; 
}

.blockpic img {
	display: inline;
	margin: 0;
}

.blockpic-pic{
	width: 33.333%;
}

.blockpic-pic img{
	width: 100%; 
	height: auto;
}

.arrowPic-box{
	background-color: #5b0fa1;
	width: 33.333%;
	justify-content: center;
	display: inline-flex;
	align-items: center;
}

.arrowPic-box img{
	width: 10% !important; 
}

.info {
	background-color: #ebebeb;
	padding: 40px;
}

.info  h1 {
	padding-left: 15px;
	font-size: 30pt;
	color: #088ca5;
}

.info-position{
	display: flex;
	flex-flow: row wrap;
}

.info-position p {
	color: #515151;
	flex: 1 1 400px;
	text-align: justify;
	padding: 0;
	margin: 15px;
}