/* Top hook CSS */
#htmlcontent_top ul {
  margin-bottom: 0; }
  #htmlcontent_top ul li {
    padding-top: 30px; }
    #htmlcontent_top ul li img {
      max-width: 100%;
      height: auto; }
    #htmlcontent_top ul li .bannerBox {
      position: relative; }
    #htmlcontent_top ul li a {
      display: block; }
      @media only screen and (min-width: 1200px) {
        #htmlcontent_top ul li a:hover .item-html {
          padding: 4% 1%;
          opacity: 0.5; } }
    #htmlcontent_top ul li .item-html {
      background: #c6213b;
      bottom: 0;
      display: block;
      left: 0;
      padding: 13% 1% 15.2%;
      position: absolute;
      right: 0;
      text-align: center;
      font: 300 20px/26px "Roboto", sans-serif;
      color: #fff;
      -moz-transition: 0.3s;
      -o-transition: 0.3s;
      -webkit-transition: 0.3s;
      transition: 0.3s;
      opacity: 1; }
      #htmlcontent_top ul li .item-html h2 {
        font: normal 90px/90px "Just Another Hand", cursive;
        margin: -2px 0 -5px;
        color: #fff; }
      #htmlcontent_top ul li .item-html p {
        margin: 0 0 15px;
        text-transform: uppercase; }
      #htmlcontent_top ul li .item-html .btn.btn-default {
        border-color: #fff;
        color: #fff;
        min-width: 133px; }
        #htmlcontent_top ul li .item-html .btn.btn-default:hover, #htmlcontent_top ul li .item-html .btn.btn-default:active, #htmlcontent_top ul li .item-html .btn.btn-default:active:focus, #htmlcontent_top ul li .item-html .btn.btn-default:focus {
          background: #fff;
          color: #c6213b; }
@media (min-width: 992px) and (max-width: 1199px) {
  #htmlcontent_top ul li .item-html {
    padding: 10% 1% 10%; }
    #htmlcontent_top ul li .item-html h2 {
      font: normal 70px/70px "Just Another Hand", cursive; } }
@media (min-width: 768px) and (max-width: 991px) {
  #htmlcontent_top ul li .item-html {
    padding: 5% 1%;
    font: 300 16px/20px "Roboto", sans-serif; }
    #htmlcontent_top ul li .item-html h2 {
      font: normal 60px/60px "Just Another Hand", cursive; }
    #htmlcontent_top ul li .item-html .btn.btn-default {
      display: none; } }
@media only screen and (max-width: 767px) {
  #htmlcontent_top ul {
    margin: 0 -5px; }
    #htmlcontent_top ul li {
      padding: 10px 5px; }
      #htmlcontent_top ul li .item-html {
        padding: 5% 1%;
        font: 300 16px/20px "Roboto", sans-serif; }
        #htmlcontent_top ul li .item-html h2 {
          font: normal 60px/60px "Just Another Hand", cursive; }
        #htmlcontent_top ul li .item-html .btn.btn-default {
          display: none; } }
@media (max-width: 479px) {
  #htmlcontent_top ul li .item-html {
    padding: 5% 1%;
    font: 300 16px/20px "Roboto", sans-serif; }
    #htmlcontent_top ul li .item-html h2 {
      font: normal 25px/40px "Just Another Hand", cursive; }
    #htmlcontent_top ul li .item-html .btn.btn-default, #htmlcontent_top ul li .item-html p {
      display: none; } }

/* Home hook CSS */
#htmlcontent_home ul {
  margin-bottom: 14px; }
  #htmlcontent_home ul li {
    padding-bottom: 30px; }
    #htmlcontent_home ul li img {
      max-width: 100%;
      height: auto; }
    #htmlcontent_home ul li .item-html {
      border: 1px solid #131418;
      padding: 37px 0;
      text-align: center;
      -moz-transition: 0.3s;
      -o-transition: 0.3s;
      -webkit-transition: 0.3s;
      transition: 0.3s;
      font-size: 20px;
      letter-spacing: 0.05em;
      line-height: 20px;
      color: #9aa0b1; }
      #htmlcontent_home ul li .item-html h2 {
        font: normal 72px/72px "Just Another Hand", cursive;
        margin: 0;
        color: #131418;
        -moz-transition: 0.3s;
        -o-transition: 0.3s;
        -webkit-transition: 0.3s;
        transition: 0.3s; }
      #htmlcontent_home ul li .item-html p {
        margin: -5px 0 4px; }
    #htmlcontent_home ul li.htmlcontent-item-1 .item-html {
      color: #bbbbbb;
      border-color: #bbbbbb; }
      #htmlcontent_home ul li.htmlcontent-item-1 .item-html h2 {
        color: #c2c1c6; }
    #htmlcontent_home ul li.htmlcontent-item-2 .item-html {
      color: #f8788c;
      border-color: #c6213b; }
      #htmlcontent_home ul li.htmlcontent-item-2 .item-html h2 {
        color: #c6213b; }
    #htmlcontent_home ul li a {
      display: block; }
      #htmlcontent_home ul li a:hover .item-html {
        background: #131418; }
        #htmlcontent_home ul li a:hover .item-html h2 {
          color: #fff; }
    #htmlcontent_home ul li.htmlcontent-item-1 a:hover .item-html {
      background: #9aa0b1;
      border-color: #9aa0b1;
      color: #dadfed; }
      #htmlcontent_home ul li.htmlcontent-item-1 a:hover .item-html h2 {
        color: #fff; }
    #htmlcontent_home ul li.htmlcontent-item-2 a:hover .item-html {
      background: #c6213b; }
      #htmlcontent_home ul li.htmlcontent-item-2 a:hover .item-html h2 {
        color: #fff; }
@media (min-width: 992px) and (max-width: 1199px) {
  #htmlcontent_home ul li .item-html h2 {
    font: normal 52px/52px "Just Another Hand", cursive; } }
@media (min-width: 768px) and (max-width: 991px) {
  #htmlcontent_home ul li .item-html {
    font-size: 16px; }
    #htmlcontent_home ul li .item-html h2 {
      font: normal 42px/42px "Just Another Hand", cursive; } }
@media (min-width: 480px) and (max-width: 767px) {
  #htmlcontent_home ul {
    margin-left: -5px;
    margin-right: -5px; }
    #htmlcontent_home ul li {
      padding-left: 5px;
      padding-right: 5px; }
      #htmlcontent_home ul li .item-html {
        padding: 20px 0; }
        #htmlcontent_home ul li .item-html p {
          font-size: 13px;
          letter-spacing: 0; }
        #htmlcontent_home ul li .item-html h2 {
          font: normal 30px/40px "Just Another Hand", cursive; } }
@media (max-width: 479px) {
  #htmlcontent_home ul li {
    width: 100%; } }

/* Left hook CSS */
/* Right hook CSS */
/* Footer hook CSS */