a.arrow {
	display: block;
	border-radius: 3.125em;
}

a.arrow:hover {
	background: #b60d18;
	color: #fff;
}

a.arrow-sm {
	height: 24px;
	width: 24px;
	border: 1px solid #dadade;
	color: #050423;
	font-size: 12px;
	line-height: 24px;
	text-align: center;
}

a.arrow-sm:hover {
	border: 1px solid #b60d18;
}

a.arrow-lg {
	height: 5em;
	width: 5em;
	border: 2px solid #fff;
	color: #fff;
}

a.arrow-lg:hover {
	border: 2px solid #b60d18;
}

a.arrow-lg i {
	margin: 11px 0 0 0;
	font-size: 48px;
}

#tiles-container {
	padding: 0px 0 64px;
}
.tile-wrapper.right {
	padding-right: 12px;
}

.tile-wrapper.left {
	padding-left: 13px;
}

.tile-link {
	top: 0;
	left: 0;
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
}

.tile-link:hover {
	background: #fff;
	opacity: 0.10;
}

#tile-1 {
	position: relative;
	background:url(../img/computer_science_institute.jpg) no-repeat;
	height: 744px;
	background-size: cover;
}

#tile-3 {
	position: relative;
	background:url(../img/cerc.jpg) no-repeat;
	height: 360px;
	background-size: cover;
}

#tile-2 {
	position: relative;
	background:url(../img/naskdayfoto.jpg) no-repeat;
	height: 360px;
	margin-top: 25px;
	background-size: cover;
}

.tile .name {
	text-align: right;
	color: red;
}

.tile .news-box {
	position: absolute;
	bottom: 0;
	background: rgba(255,255,255,0.9);
	padding: 14px 24px;
	height: 110px;
	width: 145px;
}

.tile .news-box:hover {
	background: #eee;
}

.tile .news-box li {
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1.125em;
	line-height: 1.125em;
	margin-bottom: 0.625em;
}

.tile .news-box li a.title {
	color: #b60d18;
}

.tile .news-box li.date {
	color: #050423;
	margin-bottom: 1.250em;
}

.tile a.arrow-sm {
	position: absolute;
	top: 100px;
}

.tile a.arrow-lg {
	position: absolute;
	bottom: 16px;
	right: 16px;
	text-align: center;

}

.name {
	padding: 1em 2em 0 0;
	width: 70%;
	float: right;
}

.name h2 {
	color: #fff;
	font-weight: 700;
	font-size: 3.75em;
}

.name p {
	color: #fff;
	font-weight: 300;
	font-size: 24px;
}

.tile .name h2{
	text-shadow: -1px 0 #CCC, 0 1px #CCC, 1px 0 #CCC, 0 -1px #CCC
}

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

	#tiles-container {
		margin-top: 36px;
	}

	#tile-1, #tile-2, #tile-3 {
		height: 410px;
	}

    .tile-wrapper.right {
		padding-right: 0px;
	}

	.tile-wrapper.left {
		padding-left: 0px;
	}

    .name p {
    	display: none;
    }

    #tile-3 {
    	margin-top: 25px;
    }

    .name h2 {
        font-size: 32px;
    }
}