@charset "utf-8";

html, body {
  margin: 0px;
  border: 0px;
  padding: 0px;
  color: #000000;
  background-color: #000000;
}

html, body {
  font: 1em Arial, Helvetica, sans-serif;
}

a:link { color: #000000; text-decoration: none; }
a:visited { color: #000000; text-decoration: none; }
a:hover { color: #0033CC; text-decoration: none; }
a:active { color: #0033CC; text-decoration: none; }

.header {
  height: 100px;
  display: flex;
}

.logo {
  width: 170px;
}

.title {
  padding-top: 20px;
  text-align: center;
  color: #F9F2EC;
  /*background-image: url('../img/bg.png');*/
  background-color: #336699;
  flex: 1;
}

.body {
  text-align: center;
}

.column {
  margin: 20px;
  display: inline-block;
}

.text {
  margin-top: 5px;
  border-radius: 10px;
  padding: 10px;
  padding-left: 90px;
  text-align: left;
  background-color: #F9F2EC;
}

.footer {
  padding: 10px;
  text-align: center;
  background-color: #336699;
}

// Display Desktop Div
#desktop {display:block;}
#mobile {display:none;}

// Mobile Screen CSS
@media screen and (max-width: 480px) {
  
  // Display Mobile Div
  #desktop {display:none;}
  #mobile {display:block;}

  html, body {
    background-color: #99CCFF;
  }

  .title {
    padding-top: 5px;
  }

  .column {
    margin: 0px;
	margin-top: 5px;
	margin-bottom: 20px;
  }

  .text {
    border-radius: 0px;
  }

}