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

@font-face{
	font-family: standard;
	src: url(../fonts/SourceSansPro-Light.otf);
}
@font-face{
	font-family: bold;
	src: url(../fonts/SourceSansPro-Regular.otf);
}



body{
	font-family: standard;
	margin: 0;
	padding: 0;
	background-color: #dcdcdc;
}
h1, h2, h3, b{
	font-family: bold;	
}
a{
	text-decoration: none;
	color: inherit;
}


.top{
	margin-top: 90vh;
}
.full-width{
	width:100%;
	height:auto;
	padding:50px 0px;
}
.content{
	width: 1280px;
}
.hero{
	position:fixed;
	top: 0; 
	left: 0;
	overflow:hidden;
	height: 90vh;
	padding-top: 0px !important;
	background-position:center;
	background-size:cover;
	background-repeat:no-repeat;
	z-index:-1;
}
.bubble{
	text-align:justify;
	width: 300px;
	display: inline-block;
	margin: 0px 25px;
	padding: 25px;
	border-radius: 25px;
}
.bubble img{
	width: 150px;
	height: 150px;
	float:left;
	margin: 20px 20px 20px 0px;
	border-radius: 25px;
}
.bubble.right{
	direction:rtl;
	text-align: justify;
}
.bubble.right img{
	float:right;
}
.bubble h2{
	border-bottom: 1px solid;
}


.imageCapsule{
	padding: 100px 0px;
}
.imageCapsule div{
	display:inline-block;
	overflow:hidden;
	height:400px;
}
.imageCapsule img{
	margin: 0px 75px;
	border-radius: 25px;
}

.imageCapsule img:hover{
	height:auto;
	
	animation-name : imgSwell;
	animation-duration : 0.25s;
	animation-iteration-count :1;
	animation-fill-mode : forwards;
}
.imageCapsule img.defalte{
	animation-name : imgDeflate;
	animation-duration : 0.25s;
	animation-iteration-count :1;
	animation-fill-mode : forwards;
}
.imageCapsule a{
	color: #FFF;
	text-decoration:none;
}



.map{
	text-align:left;
}
.map img{
	margin: 0px 75px;
	border-radius: 25px;
	width: 500px;
}
.map img, .map div{
	display: inline-block;
	vertical-align: top;
}



/*Colours*/
.darkGrey{
	background-color: #3d3d3d;
	color: #fff;
}
.deepGrey{
	background-color: #dcdcdc;
}
.lightGrey{
	background-color: #eeeeee;
}
.lightOrange{
	background-color: #ffbe8f;
}
.darkOrange{
	color: #fff;
	background-color: #f7761b;
}
.lightGreen{
	background-color: #b3e2c5;
}
.darkGreen{
	color: #fff;
	background-color: #00ac5b;
}





/* Chrome, Safari, Opera */
@-webkit-keyframes imgSwell {
    0% {width: 256px;}
	100%{width: 300px;}
}

/* Standard syntax */
@keyframes imgSwell {
	 0% {width: 256px;}
	100%{width: 300px;}
} 


@-webkit-keyframes imgDeflate {
	 0% {width: 300px}
	100%{width: 256px;}
} 
@keyframes imgDeflate {
	 0% {width: 300px}
	100%{width: 256px;}
} 



@media all and (max-width: 1280px)
{
	.content{
		width:768px;
	}
	.bubble{
		width: 718px;
		margin: 25px 0px;
	}
	
	.imageCapsule img {
		margin: 25px;
	}
	.imageCapsule img:hover, .imageCapsule img.defalte{
		animation: none;
	}
	.map, .map img, .map div{
		margin-left: auto;
		margin-right: auto;
	}
	.map img{
		width: 400px;
	}
	.map{
		text-align:center;
	}
	.map div{
		text-align:left;
	}

}
@media all and (max-width: 930px)
{
	.imageCapsule div {
		display:block;
	}
}
@media all and (max-width: 780px)
{
	body{
		min-width:768px;
	}
	.content{
		width:768px;
	}
	.bubble{
		width: 350px;
		margin: 25px 0px;
	}

}