body {
  width: 1280px;
  height: 720px;
  background: #FFFFFF;
  margin: 0px;
}
.container_left {
  width: 605;
  height: 680px;
  left: 35px;
  top: 20px;
  position: absolute;
  margin: 0px;
}
.container_right {
  width: 605px;
  height: 680px;
  left: 640px;
  top: 20px;
  position: absolute;
  margin: 0px;
}
.container_top {
  width: 1280px;
  height: 262px;
  left: 0px;
  top: 20px;
  position: absolute;
  margin: 0px;
}
.container_bottom {
  width: 1210px;
  height: 415px;
  left: 35px;
  top: 283px;
  position: absolute;
  margin: 0px;
}
.container_all {
  width: 1210px;
  height: 720px;
  left: 35px;
  top: 20px;
  position: absolute;
  margin: 0px;
  clip: rect(0px,1210px,720px,0px);
}
.container_full {
  width: 1210px;
  height: 680px;
  left: 25px;
  top: 20px;
  position: absolute;
  margin: 0px;
}
.clock {
  width: 550px;
  height: 550px;
  left: 23px;
  top: 0px;
  position: absolute;
  margin: 5px;
  background-image: url("../images/clock_face_720.png");
  z-index: 0;
}
.bogen-logo {
  width: 261px;
  height: 41px;
  left: 0px;
  top: 20px;
  position: absolute;
  margin: 0px;
  background-image: url("../images/bogen_logo_720.png");
   z-index: -1;
}
.messages{
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;		
}
.messages2{
	padding-top: 0px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 20px;		
}
.message{
  border-radius: 15px;
  padding: 10px; 
  margin: 15px;
  width: 550px;	
  height: auto;
  white-space: normal;
  overflow: hidden;
  text-overflow: clip;
}
.message_2_column{
  border-radius: 15px;
  padding: 5px; 
  margin: 5px;
  width: 575px;	
  height: auto;
  white-space: normal;
  overflow: hidden;
  text-overflow: clip;
}
.message_3_column{
  border-radius: 15px;
  padding: 5px; 
  margin: 5px;
  width: 375px;	
  height: auto;
  white-space: normal;
  overflow: hidden;
  text-overflow: clip;
}
.message_full{
  border-radius: 15px;
  padding: 13px; 
  margin-top: 12px;
  margin-bottom: 10px;
  margin-left: -25px;
  margin-right: 0px;
  width: 1190px;	
  height: auto;
  white-space: normal;
  overflow: hidden;
  text-overflow: clip;
}
.second-hand {
  position: absolute;
  z-index: 3;
  width: 17px;
  height: 509px;
  left: 267px;
  top: 20px;
  background-image: url("../images/second_hand_720.png");
}
.minute-hand {
  position: absolute;
  z-index: 2;
  width: 17px;
  height: 509px;
  left: 267px;
  top: 20px;
  background-image: url("../images/minute_hand_720.png");
}
.hour-hand {
  position: absolute;
  z-index: 1;
  width: 16px;
  height: 344px;
  left: 267px;
  top: 102px;
  background-image: url("../images/hour_hand_720.png");
}
.info {
  position: absolute;
  width: 550px;
  height: 50px;
  text-align: center;
  line-height: 50px;
  font-weight: bold;
  z-index: 4;
  margin-left: 0px;
  white-space: nowrap;
}
.date {
	left: 28px;
	top: 560px;
}
.event {
	left: 28px;
	top: 615px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.date-digital {
	position: absolute;
	left: 640px;
	top: 196px;
	width: 640px;
	height: 83px;
	text-align: center;
	font-family: Liberation-Sans;
	font-size: 55px;
	white-space: nowrap;
}
.event-digital {
	position: absolute;
	left: 0px;
	top: 196px;
	width: 640px;
	height: 83px;
	text-align: center;
	font-family: Liberation-Sans;
	font-size: 55px;
	
	white-space: nowrap; 
  	overflow: hidden;
 	text-overflow: ellipsis;
}
.time-digital {
	position: absolute;
	left: 323px;
	top: -30px;
	width: auto;
	height: auto;
	text-align: left;
	font-family: Liberation-Sans;
}
.hour-digital {
	position: absolute;
	left: 323px;
	top: -30px;
	width: auto;
	height: auto;
	text-align: right;
	font-family: Liberation-Sans;
}
.colon-digital {
	position: absolute;
	left: 323px;
	top: -30px;
	width: auto;
	height: auto;
	text-align: left;
	font-family: Liberation-Sans;
}
.minute-digital {
	position: absolute;
	left: 323px;
	top: -30px;
	width: auto;
	height: auto;
	text-align: left;
	font-family: Liberation-Sans;
}
.ampm-digital {
	position: absolute;
	left: 323px;
	top: -30px;
	width: auto;
	height: auto;
	text-align: left;
	font-family: Liberation-Sans;
}
.check-digital {
	position: absolute;
	left:0px;
	top: -1000px;
	width: auto;
	height: auto;
	text-align: left;
	font-family: Liberation-Sans;
}
.messages_flex{
	display: flex;
  	flex-direction: column;
  	flex-wrap: wrap;
	width: 0px;
	height: 680px;
	margin: 0px;
	padding: 10px;
	flex: 1 0 auto;
}
.full_screen_img{
	height: auto;
	width: auto;
	max-width: 1280px;
	max-height: 720px;
}
.half_screen_img{
	height: auto;
	width: auto;
	max-width: 605px;
	max-height: 680px;
}

@font-face {
    font-family: Comic-Relief;
    src: url(../fonts/ComicRelief.ttf) format('truetype')
}
@font-face {
    font-family: Courier-Prime;
    src: url(../fonts/CourierPrime.ttf) format('truetype')
}
@font-face {
    font-family: Gelasio;
    src: url(../fonts/Gelasio-Regular.ttf) format('truetype')
}	
@font-face {
    font-family: Liberation-Sans;
    src: url(../fonts/LiberationSans-Regular.ttf) format('truetype')
}
@font-face {
    font-family: Linux-Libertine;
    src: url(../fonts/LinLibertine_Rah.ttf) format('truetype')
}