
@font-face {
  font-family: 'OpenSansBold';
  src: url('../../_fonts/opensans-bold.woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'OpenSans';
  src: url('../../_fonts/opensans-regular.woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'OpenSansLight';
  src: url('../../_fonts/opensans-light.woff');
  font-weight: light;
  font-style: normal;
}

html, body
{
	height: 100%;
	width: 100%;
	margin: 0px;
	padding: 0px;
	cursor: default;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	font-family: 'OpenSansLight';
	overflow:hidden;
}


.number{position:absolute;left:0px;text-align:center;border:4px solid white;border-radius:80px;height:80px;width:80px;color:white;font-size:60px;line-height:1.2;margin-right:20px}

.headline{color:white;font-size:40px;font-family:'OpenSans'}

.text{position:absolute;left:100px;color:white;font-size:32px;line-height:1.2;width:1000px;}

.content{position:absolute;width:100%;left:110%;top:25%;}

.imac-content{position:absolute;top:6px;left:12px;max-width:calc(100% - 24px);max-height:calc(100% - 24px)}

.imac-content.button{visibility:hidden;padding:10px; border: 5px solid #FFF; border-radius: 20px; height:100px; width:200px; color:#FFF; background-color:rgba(255,0,0,0.7); text-align:center; font-size:24px; margin-left:calc(50% - 130px); margin-top:calc(50% - 140px);}
.imac-content.button:hover{background-color:#F00;}
.imac-content.button:active{color:#F00;background-color:#FFF;}