@charset "UTF-8";
@font-face {
  font-family: 'responsivenav';
  src: url(../fonts/responsivenav.eot?optmfy);
  src: url(../fonts/responsivenav.eot?#iefixoptmfy) format("embedded-opentype"), url(../fonts/responsivenav.woff?optmfy) format("woff"), url(../fonts/responsivenav.ttf?optmfy) format("truetype"), url(../fonts/responsivenav.svg?optmfy#responsivenav) format("svg");
  font-weight: normal;
  font-style: normal; }
[class^="icon-"], [class*=" icon-"] {
  font-family: 'responsivenav';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }



/*! normalize.css v3.0.0 | MIT License | git.io/normalize */
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
  display: block; }



[hidden], template {
  display: none; }

a {
  background: transparent; }

a:active, a:hover {
  outline: 0; }



dfn {
  font-style: italic; }

h1 {
  font-size: 1em;
  margin: .67em 0; }

mark {
  background: #ff0;
  color: #000; }

small {
  font-size: 80%; }


img {
  border: 0; }

svg:not(:root) {
  overflow: hidden; }



hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0; }




b, strong, optgroup {
  font-weight: 700; }



*, *:before, *:after {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box; }

html,
body {
  height: 100%; }

html {
  font-family: sans-serif;
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }

body {
 
  line-height: 1.6;
  text-rendering: optimizeLegibility;
 font-family: 'Open Sans', sans-serif;    /* controls body and nav font both short and long web  */
  color: #4c4c4c;
  background-color: #fff;
  margin: 0;
  min-width: 100%; }

div {
  position: relative; }



a {
  color: #3c717f;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  font-weight: 400; }

a:focus,
a:hover {
  color: #000000; }



.text-center {
  text-align: center; }


hr {
  margin-bottom: 20px; }


/* Micro Clearfix
============================================================ */
.cf:before, .cf:after, .row:before, .row:after {
  content: "";
  display: table; }

.cf:after, .row:after {
  clear: both; }

.cf, .row {
  zoom: 1; }

/* For IE 6/7 (trigger hasLayout) */
/* 12 Column Mobile First Grid
============================================================ */
.container {
  
  width: 95%;
  margin: 0px auto;
  position: relative; }





/* ==  Layout
================================================= */
.page-frame {
  position: relative;
  overflow: hidden;
  /* height: 100%; */ }

.page {
  position: relative;
  height: 100%; }

.content-frame {
  height: 100%;
  position: relative;
  padding: 0;
  background-color: #fff;
  -ms-transform: translate(0px, 0);
  -moz-transform: translate(0px, 0);
  -webkit-transform: translate3d(0px, 0, 0);
  transform: translate(0px, 0);
  -ms-transition: -ms-transform 0.28s ease-in-out;
  -moz-transition: -moz-transform 0.28s ease-in-out;
  -webkit-transition: -webkit-transform 0.28s ease-in-out;
  transition: transform 0.28s ease-in-out;
  border-top: 1px solid transparent;
   }

.nav-collapsed .content-frame {
  -ms-transform: translate(0px, 0);
  -moz-transform: translate(0px, 0);
  -webkit-transform: translate3d(0px, 0, 0);
  transform: translate(0px, 0); }

/* ==  Header
================================================= */
.header {
  width: 100%;
  position: relative;
  margin: 0px auto;
  background: url("../img/121.jpg") no-repeat center center;
  background-size: cover;
  padding: 10px 0; }

body.example .header {
  padding: 1em 0; }



.menu-toggle {
  position: absolute;
  top: 0;
  left: 0;
  padding: 5px 11px;
  color: #222;
  z-index: 999; }

.menu-toggle:hover {
  color: #555; }

.toggle-me {
  font-size: 2em; }




.scroll {
  position: absolute;
  overflow-y: scroll;
  width: 100%;
  height: 100%; }






/* ==  Main
================================================= */
section {
  margin-bottom: 2.5em; }

.margin-bottom {
  margin-bottom: 1.5em; }






/*
[contenteditable] {
  -webkit-user-modify: read-write-plaintext-only;
}
style {
  display: block; 
  padding: 20px; 
  font-size: 1em; 
  white-space: pre;
  white-space:pre; 
  border: 1px solid #aaa; 
  background-color:#dedede; 
  margin: 0px auto 1.5em; width: 100%; 
  font-family:"Courier New", Courier, monospace;
  overflow: hidden;
  overflow-x: scroll;
}
*/
@media all and (min-width: 480px) {

  h1.heavy {
    font-size: 1em;
    padding-top: 0; } 
    
    }
    
    
@media all and (min-width: 640px) {
  body {
    padding-left: 0px; }

  .menu-toggle {
    display: none; }

  .aligncenter {
    display: block;
    margin: 0 auto 1em; }

  .alignleft {
    display: inline;
    float: left;
    margin: 0 1em 1em 0; }

  .alignright {
    display: block;
    float: right;
    margin: 0 0 1em 1em; }


  h1.heavy {
    text-align: left;
    float: left;
    margin-bottom: 0; }

 }
 
 
 
@media all and (min-width: 885px) {
  h1.heavy {
    font-size: 1.5em; }
    


code[class*="language-"],