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

/* Main Styling */

html, body {height: 100%; width: 100%; margin: 0; padding: 0;}

body {background-image: url(img/bg.png); background-size: cover; background-repeat: no-repeat; font-family: 'Open Sans', sans-serif; color: #686868;}

body {font-family: 'Hind', sans-serif;}

a {text-decoration: none;}
	
#wrapper {max-width: 1100px; margin-left: auto; margin-right: auto;}

#mainContent {margin-top: 38px;}
	
#description {width: 51%; float: right; margin-right: 80px; margin-top: 120px; font-size: 18px;}

.titleDescription {font-weight: bold; margin-top: 30px;}

.copyDescription {font-weight: normal;}

#phone {width: 30%; float: left; margin-left: 80px;}

#bgvideo {position: relative; z-index: 0; left: 0px; top: 0px;}

#logo {max-width: 259px;}

.iphone {max-width: 300px; }

.video {position: absolute; z-index: 1; width: 255px; top: 76px; left: 23px;}

#button {width: 225px; height: 38px; background-color: #01C1FC; border-radius: 4px; padding-top: 10px; box-shadow: 0px 2px 0px 0px rgba(133,133,133,0.3);}

/* New blue for Medio #19a9e5 */

.buttonCopy {text-align: center; color: #fff;}

.strapline {font-size: 12px; font-weight: lighter; color: #7D7D7D; margin-top: 18px;}

#organisers {margin-top: 34px; text-align: center;}

#organisers a {color: #686868; font-weight: bold;}

.organiserLogo {max-width: 175px; margin-right: 12px; margin-right: 12px; margin-top: 36px;}

#footer {background-color: #153341; width: 100%; text-align: center; margin-top: 60px; padding-top: 36px;}

.links {color: #fff; font-size: 20px; font-weight: 500; margin-right: 35px; margin-left: 35px;}

.footerLegal {margin-top: 52px; max-width: 726px; font-size: 12px; color: #979797; margin-left: auto; margin-right: auto; margin-bottom: 40px;}

.socialIcon {max-width: 30px; margin-right: 9px; margin-left: 9px;}


/* Tablet and fixes */

@media (max-width: 991px) {
	#description {margin-right: 50px; font-size: 16px;}
	#phone {margin-left: 50px;}
}

/* Mobile */

@media (max-width: 800px) {
	#description {text-align: center; font-size: 16px; float: none; margin-right: auto; margin-left: auto; margin-top: 48px; width: 85%;}
	#phone {text-align: center; float: none; margin-right: auto; margin-left: auto; width: 100%; margin-top: 48px;}
	#button {width: 100%; margin-top: 15px; height: 35px;}
	.buttonCopy {font-weight: bold;}
	.links {margin-right: 24px; margin-left: 24px;}
	.footerLegal {width: 80%;}
	#logo {margin-bottom: 12px;}
	.copyDescription {margin-bottom: 24px;}
	.socialIcon {margin-right: 24px; margin-left: 24px;}
	.titleDescription {margin-top:18px;}
	.video {display: none;}
}