html { -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
body { background:#5ABEE4; font-family:Helvetica, Arial; margin:10px; padding:10px; max-width:950px; }

#header { position:relative; height:78px; z-index:0; }
#header .logo { display:inline-block; height:78px; border:0px; }
#header .logo img { height:78px; border:0px; }
#header .title { font-size:140%; font-weight:bold; display:inline-block; padding-left:30px; padding-top:10px; vertical-align:top; }
#header .menu_button { position:absolute; top:0px; right:0px; display:none; }
#header .menu_button img { width:30px; border:0px; }

#header .menu { position:absolute; display:inline; left:0px; width:100%; padding-left:0px; padding-top:85px; z-index:99; }
#header .menu ul {  display: flex; align-items: center; list-style:none; margin:0; padding:0; }
#header .menu li:last-of-type { margin-left:auto;  }
#header .menu li a { display:inline; font-size:110%; font-weight:bold; padding:16px; color:black; text-decoration:none; }
#header .menu li a:hover { color:gray; }
#header .menu li.curr a { text-decoration:underline; text-underline-offset:5px; text-decoration-thickness:2px; }
#content { position:relative; margin-left:2px; margin-top:100px; z-index:0; }
#content .left { display:inline-block; width:70%; float:left; vertical-align:top; padding-bottom:20px; }
#content .right { display:inline-block; width:30%; float:right; text-align:right; vertical-align:top; }
#content .right.centered { display:inline-block; width:30%; float:right; text-align:right; padding-top:30px; }
#content .right img { max-width:100%; }
#content .right img.small { max-width:49%; }
#content .break { clear:both; }
#content .head { font-size:24px; font-weight:bold; margin:0px; padding-bottom:10px; }
#content .head2 { font-size:18px; font-weight:bold; margin:0px; padding-bottom:10px; }
#content .head3 { font-size:16px; font-weight:bold; padding-bottom:10px; }
#content p { font-size:16px; line-height:18px; margin-top:0px;margin-bottom:10px; }
#content li { font-size:16px; }
#content ul { margin-top:0px; margin-bottom:0px; margin-left:0px; padding-left:20px; }
#content li { font-size:16px; margin-top:0px; margin-bottom:0px; margin-left:0px; }

#content .wrap { width: 100%; overflow-x: auto; }
#content .wrap p { font-size:12px; }

#content_start { position:relative; margin-left:2px; margin-top:100px; z-index:0; }

#content_start .left { display:inline-block; float:left; vertical-align:top; padding-bottom:20px; }
#content_start .left img { height:300px; }
#content_start .middle { position:absolute; top:140px; left:220px; width:300px; height:300px; font-size:220%; font-weight:bold; line-height:60px; text-align:center; word-spacing:30000px; z-index:2; }
#content_start .right { display:inline-block; float:right; vertical-align:top; }
#content_start .right img { height:300px; }
#content_start .break { clear:both; }
#content_start .text_centered { font-size:160%; font-weight:bold; text-align:center; padding-top:20px; }
#content_start .text_centered_break { display:none; }

@media(max-width:950px) {
  body { min-width:0px; }
  #header { height:auto; }
  #header .menu_button { display:inline; }
  #header .menu_button { display:inline; }
  #header .menu { display:none; padding-left:5px; padding-top:20px; }
  #header .menu hr { display:none }
  #header .menu ul { display:inline; margin-top:5px; margin-bottom:5px; }
  #header .menu li { float:none; }
  #header .menu li a { display:block; font-size:larger; text-align:left; padding:0px; margin-bottom:20px; }
  
  #content { margin-top:30px; }
  #content .right.centered { display:inline-block; width:30%; float:right; text-align:right; padding-top:60px; }

  #content_start { margin-top:20px; }
  #content_start .left:first-child { padding-bottom:80px; }
  #content_start .middle { top:310px; left:20px; width:100%; height:40px; word-spacing:0px; }
  #content_start .text_centered { padding-top:0px; }
}

@media(max-width:680px) {
  body { background-image: url("images/bg.jpg"); background-repeat: no-repeat; background-size: cover; }
  
  #content .left { width:100%; float:left; vertical-align:top; padding-bottom:10px; }
  #content .right { width:100%; float:left; text-align:center; vertical-align:top; }
  #content .right.centered { width:100%; float:left; text-align:center; vertical-align:top; padding-top:0px; }
  #content .break { padding-bottom:20px; }
  #content .right img.small { max-width:100%; }

  #content_start .left { display:block; float:none; text-align: center; }
  #content_start .left img { width:auto; height:auto; text-align:center; padding-top:20px; }
  #content_start .left:first-child { padding-top:40px; padding-bottom:20px; }
  #content_start .middle { font-size:150%; top:0px; left:0px; width:100%; height:40px; word-spacing:0px; }
  #content_start .right { display:block; float:none; text-align: center; }
  #content_start .right:first-child {  }
  #content_start .right img { max-width:90%; height:auto; text-align:center; }
  #content_start .text_centered { font-size:150%; padding-top:20px; }
  #content_start .text_centered_break { display:block; }
}

@media(max-width:400px) {
  #header .menu li a { font-size:100%; }
  #content_start .middle { font-size:120%;  }
  #content_start .text_centered { font-size:120%; }
}

@media(max-width:350px) {
  #header { height:68px; }
  #header .logo { height:68px; }
  #header .logo img { height:68px; }
  #header .title { font-size:120%; padding-left: 10px; }
  #header .menu li a { font-size:100%; }
  #content_start .left img { max-width:90%; }
  #content_start .middle { font-size:100%; }
  #content_start .text_centered { font-size:100%; }
}