/* Top hook CSS */
#htmlcontent_top {
  margin-bottom: 30px; }
  @media (max-width: 767px) {
    #htmlcontent_top {
      margin-bottom: 15px; } }
  #htmlcontent_top ul {
    margin-bottom: 0px; }
    @media (max-width: 767px) {
      #htmlcontent_top ul li {
        width: 50%; } }
    @media (max-width: 379px) {
      #htmlcontent_top ul li {
        width: 100%;
        margin-top: 30px; }
        #htmlcontent_top ul li:first-child {
          margin-top: 0; } }
    #htmlcontent_top ul li .bannerBox {
      overflow: hidden;
      position: relative;
      padding-top: 90px;
      -moz-transition: all 500ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
      -o-transition: all 500ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
      -webkit-transition: all 500ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
      transition: all 500ms cubic-bezier(0.785, 0.135, 0.15, 0.86); }
      #htmlcontent_top ul li .bannerBox .item-html {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        text-align: center;
        border-bottom: 2px solid #0f262d;
        font: normal 30px/40px "Lora", serif;
        color: #141218;
        text-transform: uppercase;
        padding: 9px 0 18px;
        -moz-transition: all 500ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
        -o-transition: all 500ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
        -webkit-transition: all 500ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
        transition: all 500ms cubic-bezier(0.785, 0.135, 0.15, 0.86); }
      #htmlcontent_top ul li .bannerBox img {
        max-width: 100%;
        height: auto; }
      #htmlcontent_top ul li .bannerBox .item-html-2 {
        display: none; }
        @media (min-width: 1200px) {
          #htmlcontent_top ul li .bannerBox .item-html-2 {
            display: block;
            position: absolute;
            bottom: -100%;
            left: 0;
            width: 100%;
            text-align: center;
            border-top: 2px solid #e1c36f;
            font: normal 30px/40px "Lora", serif;
            color: #e1c36f;
            text-transform: uppercase;
            padding: 18px 0 9px;
            -moz-transition: all 500ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
            -o-transition: all 500ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
            -webkit-transition: all 500ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
            transition: all 500ms cubic-bezier(0.785, 0.135, 0.15, 0.86); } }
    @media (min-width: 992px) and (max-width: 1199px) {
      #htmlcontent_top ul li .bannerBox .item-html {
        font-size: 22px; } }
    @media (min-width: 768px) and (max-width: 991px) {
      #htmlcontent_top ul li .bannerBox .item-html {
        font-size: 18px; } }
    @media (max-width: 767px) {
      #htmlcontent_top ul li .bannerBox .item-html {
        font-size: 22px; } }
    @media (max-width: 479px) {
      #htmlcontent_top ul li .bannerBox .item-html {
        font-size: 18px; } }
    @media (max-width: 379px) {
      #htmlcontent_top ul li .bannerBox .item-html {
        font-size: 25px; } }
    @media (min-width: 1200px) {
      #htmlcontent_top ul li a:hover .bannerBox {
        padding: 0 0 90px; }
        #htmlcontent_top ul li a:hover .bannerBox .item-html {
          top: -100%; }
        #htmlcontent_top ul li a:hover .bannerBox .item-html-2 {
          bottom: 0; } }

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