@charset "UTF-8";


@media screen and (max-width:740px){
    #navi ul,
  #navi ul.sub-menu,
  #navi ul.children{
    background: none;
  }

  #navi ul li a{
    color: #333;
    background: none;
    background-color: #EAF6FD;
    border: none;
    border-radius: 5px;
  }

  #navi ul li a:hover{
    color: #333;
    background-color: #9FD9F6;
    -webkit-tap-highlight-color: #9FD9F6;
  }

  #navi ul.sub-menu{
    margin-top: 5px;
    margin-bottom: 5px;
  }

  #navi ul.sub-menu li{
    padding-top: 0px;
    padding-bottom: 0px;
    margin-top: 5px;
    margin-bottom: 5px;
  }

  div#main:before,
  div#main:after{
    display: none;
  }

  .article h1{
    position: relative;
    background-color: #EAF6FD;
    margin: 20px 0px 20px 12px;
  }

  .article h1:before{
    font-family: 'FontAwesome';
    content: '\f111';
    color: #9FD9F6;
    font-size: 53px;
    position:absolute;
    top: 11px;
    left: -20px;
  }

  div .article h1:after{
    font-family: 'FontAwesome';
    content: '\f1d8';
    color: #FFF;
    font-size: 25px;
    position:absolute;
    top: 12px;
    left: -11px;
  }

  .article h2{
    font-size: 22px;
    margin: 20px 0px 20px 10px;
    padding: 10px 5px 2px 30px;
    border: none;
    border-bottom: 1px solid #9FD9F6;
    position: relative;
  }

  .article h2:before{
    font-family: 'FontAwesome';
    content: '\f111';
    color: #9FD9F6;
    font-size: 40px;
    position:absolute;
    left: -15px;
  }

  .article h2:after{
    font-family: 'FontAwesome';
    content: '\f0c2';
    color: #FFF;
    font-size: 23px;
    position:absolute;
    top: 10px;
    left: -10px;
  }

  .article h3{
    font-size: 20px;
    margin: 20px 0px 20px 10px;
    padding: 10px 5px 1px 25px;
    border: none;
    border-bottom: 1px dashed #9FD9F6;
    position: relative;
  }

  .article h3:before{
    font-family: 'FontAwesome';
    content: '\f111';
    color: #FFF;
    font-size: 35px;
    position:absolute;
    top: 10px;
    left: -15px;
  }

  .article h3:after{
    font-family: 'FontAwesome';
    content: '\f10c';
    color: #9FD9F6;
    font-size: 35px;
    position:absolute;
    top: 8px;
    left: -15px;
  }

  .article h4{
    font-size: 18px;
    margin: 20px 0px 20px 5px;
    padding: 0px 5px 1px 25px;
    border: none;
    position: relative;
  }

  .article h4:before{
    font-family: 'FontAwesome';
    content: '\f111';
    color: #9FD9F6;
    font-size: 20px;
    position:absolute;
    left: -5px;
  }

  #sidebar aside h3{
    padding-left: 20px;
  }

  #sidebar aside h3::before,
  #sidebar aside h3::after{
    left: -12px;
    top: -2px;
  }
}