@charset "utf-8";


.start_bg_animation{
	animation: mybg 4s;
	animation-fill-mode: forwards;
	animation-timing-function: ease-in;
}

@keyframes mybg {
	0% {opacity: 0;}
	47% {opacity: 0;}
	67% {opacity: 1;}
	100% {opacity: 1;}
}

.sub_title{
	animation: my_sub_title 2s;
	animation-fill-mode: forwards;
	animation-timing-function: ease-in;
}

@keyframes my_sub_title {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

.title{
	animation: mytitle 3s;
	animation-fill-mode: forwards;
	animation-timing-function: ease-in-out;
}

@keyframes mytitle {
	0% {opacity: 0; margin-top:-50vh;}
	30% {opacity: 1;}
	60% {margin-top:-50vh;}
	90% {margin-top:0vh;}
	100% {margin-top:0vh;}
}

@media (orientation:landscape){

body {
	background-color: black;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}

.container-fluid .vertical-centre-landscape {
	padding-left: 0;
	margin: auto;
	padding-right: 0;
	bottom: 0;
	left: 0;
	position: absolute;
	top: 0;
	right: 0;
}
.vertical-centre-landscape .row .col-xl-12.col-md-12.col-xs-12 {
	margin-top: 0;
}
div.home_bottom {
	position:fixed;
	width:100vw;
	left:0;
	bottom:10px;
}
p.name {
	font-family: sans-serif;
	font-size: 6em;
	font-weight: 600;
	color: lightpink;
	opacity:0.6;
	text-align: center;
	text-shadow: 2px 2px 2px black;
}
p.sub {
	margin-top: -40px;
	font-family: sans-serif;
	font-size: 1.85em;
	font-weight: 300;
	color: white;
	text-shadow: 2px 2px 2px black;
	letter-spacing: 3px;
	text-align: center;
}
.container-fluid .vertical-centre-portrait {
	display: none;
}

}

@media (orientation:portrait) and (min-aspect-ratio:2/3){

	body {
		background-color: white;
		margin-left: 0px;
		margin-top: 0px;
		margin-right: 0px;
		margin-bottom: 0px;
	}
	.container-fluid .vertical-centre-portrait {
		padding-left: 0;
		margin: auto;
		padding-right: 0;
		bottom: 0;
		left: 0;
		position: absolute;
		top: 0;
		right: 0;
	}
	.vertical-centre-portrait .row .col-xl12.col-md-12.col-xs-12 {
		margin-top: 0;
	}
	div.home_bottom {
		position:fixed;
		width:100vw;
		left:0;
		bottom: 20vh;
	}
	p.name {
		font-family: sans-serif;
		font-size: 4em;
		font-weight: 600;
		color: rgb(37, 8, 8);
		text-shadow: -1px 1px 1px #ffffff99;
		text-align: center;
	}
	p.sub {
		margin-top: -30px;
		font-family: sans-serif;
		font-size: 1.5em;
		font-weight: 400;
		color: rgb(37, 8, 8);
		text-align: center;
		text-shadow: -1px 1px 1px #ffffff99;
		letter-spacing: 1px;
	}
	.container-fluid .vertical-centre-landscape {
		display: none;
	}
}

	@media (orientation:portrait) and (max-aspect-ratio:2/3){

		body {
			background-color: white;
			margin-left: 0px;
			margin-top: 0px;
			margin-right: 0px;
			margin-bottom: 0px;
		}
		.container-fluid .vertical-centre-portrait {
			padding-left: 0;
			margin: auto;
			padding-right: 0;
			bottom: 0;
			left: 0;
			position: absolute;
			top: 0;
			right: 0;
		}
		.vertical-centre-portrait .row .col-md-12.col-md-12.col-xs-12 {
			margin-top: 0;
		}
		div.home_bottom {
			position:fixed;
			width:100vw;
			left:0;
			bottom: 30vh;
		}
		p.name {
			font-family: sans-serif;
			font-size: 4em;
			font-weight: 600;
			color: rgb(37, 8, 8);
			text-shadow: -1px 1px 1px #ffffff99;
			text-align: center;
		}
		p.sub {
			margin-top: -30px;
			font-family: sans-serif;
			font-size: 1.4em;
			font-weight: 400;
			color: rgb(37, 8, 8);
			text-align: center;
			text-shadow: -1px 1px 1px #ffffff99;
			letter-spacing: 1px;
		}
		.container-fluid .vertical-centre-landscape {
			display: none;
		}
	}