@font-face {
  font-family: 'MySansSerif';
  src: url('./fonts/lato/LatoLatin-Regular.eot');
  src: url('./fonts/lato/LatoLatin-Regular.woff2') format("woff2"),
       url('./fonts/lato/LatoLatin-Regular.woff') format('woff'),
       url('./fonts/lato/LatoLatin-Regular.ttf') format('truetype');
}
@font-face {
  font-family: 'MySerif';
  src: url('./fonts/source-serif-pro/SourceSerifPro-Regular.otf') format('opentype');
}

.header {
  width: 70%;
  float: left;
  border: 1px outset white;
  background-color: blue;
}
.contents {
  width: 30%;
  float: left;
  background-color: red;
  border: 1px outset white;
}
.main {
  width: 69%;
  float: left;
  border: 1px outset white;
  background-color: green;
}

.WidthContents {
  width: 30%;
}
.WidthMain {
  width: 69%;
}

.StyleHeader {
  float: left;
  border: 1px outset white;
  background-color: blue;
}
.StyleContents {
  float: left;
  background-color: red;
  border: 1px outset white;
}
.StyleMain {
  float: left;
  border: 1px outset white;
  background-color: green;
}

body
{
  background-color: #ffffff;
  color: #000000;
  font-family: MySansSerif; /* font-family: verdana, arial, helvetica, sans-serif; */
}
a:link
{
  color: 000000;
  text-decoration: none;
}
a:visited
{
  color: 000000;
  text-decoration: none;
}
a:hover
{
  color: #aaaaaa;
  text-decoration: underline;
}
domain
{
  font-size: 140%;
  color: gray;
}
section
{
  font-size: 140%;
  color: #5588bb;
  font-family: MySerif;
}