
  @font-face { font-family: OpenSansRegular; src: url('/css/fonts/Open_Sans/OpenSans-Regular.ttf'); }
  @font-face { font-family: OpenSansLight; src: url('/css/fonts/Open_Sans/OpenSans-Light.ttf'); }
  @font-face { font-family: OpenSansItalic; src: url('/css/fonts/Open_Sans/OpenSans-Italic.ttf'); }
  @font-face { font-family: OpenSansBold; src: url('/css/fonts/Open_Sans/OpenSans-Bold.ttf'); }
  @font-face { font-family: OpenSansBoldItalic; src: url('/css/fonts/Open_Sans/OpenSans-BoldItalic.ttf'); }
  @font-face { font-family: SpaceMono; src: url('/css/fonts/Space_Mono/SpaceMono-Regular.ttf'); }
  @font-face { font-family: SpaceItalic; src: url('/css/fonts/Space_Mono/SpaceMono-Italic.ttf'); }
  @font-face { font-family: SpaceBold; src: url('/css/fonts/Space_Mono/SpaceMono-Bold.ttf'); }
  @font-face { font-family: SpaceBoldItalic; src: url('/css/fonts/Space_Mono/SpaceMono-BoldItalic.ttf'); }

h1 {
  font-family: OpenSansRegular;
  font-size: 200%;
  }

p{
  font-family: OpenSansLight;
  font-size: 110%;
  }
b{
  font-family: SpaceBold;
  font-size: 100%;
 }

li{
    font-family: OpenSansLight;
    font-size: 100%;
  }

pre{
  font-family: OpenSansRegular, monospace, serif;
  font-size: 100%;
  margin-bottom: 10px;
  overflow: auto;
  width: 650px;
  padding: 5px;
  background-color: #eee;
  width: 650px!ie7;
  padding-bottom: 20px!ie7;
  max-height: 600px;
}

body{
  background-color: #FFF;
  padding: 0;
  margin: 0;
}

.huge{
  font-family: SpaceItalic;
  font-size: 200%;
  }

.emf{
  font-family: SpaceMono;
  font-size: 140%;
  }

.em{
    font-family: OpenSansItalic;
    font-size: 100%;
    }

.code{
      font-family: SpaceMono;
      font-size: 100%;
   }

.tm{
  font-family: OpenSansItalic;
  font-size: 100%;
  }

.italic {
  font-family:SpaceItalic;
  font-size: 100%;
}

.wrapper {
    width : 1200px;
    display:flex;
    overflow: hidden;
}
.left {
    width : 600px;
    float:left;
    display:inline-block;
        overflow: hidden;
}
.middle {
    width : 10px;
    float:left;
    display:inline-block;
        overflow: hidden;
}
.right {
   backgound-color: #f8f8f8;
    width : 400px;
    float: left;
    display:inline-block;
        overflow: hidden;
}
.contents {
    display:block;
}
.codeblock{
  border-style: dashed;
  border-width: 1px;
  border-color: #BBB;
}

.sm{
  font-family: OpenSansItalic;
  font-size: 70%;
  }

.Q{
    font-family: SpaceMono;
    font-size: 110%;
   }

#navigation {
   top: 0;
   width: 100%;
   color: #ffffff;
   height: 25px;
   text-align: center;
   padding-top: 10px;
   background-color: rgba(0, 0, 240, 0.8);
   color: rgba(0, 0, 240, 0.8);
   }

#navigation button {
   font-size: 14px;
   padding-left: 15px;
   padding-right: 15px;
   color: #770;
   text-decoration: none;
   }

#navigation button:hover {
   color: #00F;
   }

#toTop {
	display:none;
	text-decoration:none;
	position:fixed;
	bottom:10px;
	right:10px;
	overflow:hidden;
	width:51px;
	height:51px;
	border:none;
	text-indent:100%;
  background:url(../img/output.png);
}