/* Top hook CSS */
#htmlcontent_top ul {
  margin-bottom: 0; }
  #htmlcontent_top ul li {
    margin-bottom: 30px; }
    @media (max-width: 767px) {
      #htmlcontent_top ul li {
        width: 50%; } }
    @media (max-width: 480px) {
      #htmlcontent_top ul li {
        width: 100%;
        float: none; } }
    #htmlcontent_top ul li a {
      display: block;
      position: relative;
      overflow: hidden; }
      @media (max-width: 1200px) {
        #htmlcontent_top ul li a {
          font-size: 0.66em; } }
      @media (max-width: 991px) {
        #htmlcontent_top ul li a {
          font-size: 0.55em; } }
      @media (max-width: 767px) {
        #htmlcontent_top ul li a {
          font-size: 0.75em; } }
      @media (max-width: 480px) {
        #htmlcontent_top ul li a {
          font-size: 1em; } }
      #htmlcontent_top ul li a img {
        max-width: 100%;
        height: auto;
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1);
        -moz-transition: all 0.2s linear;
        -o-transition: all 0.2s linear;
        -webkit-transition: all 0.2s linear;
        transition: all 0.2s linear; }
        @media (max-width: 767px) {
          #htmlcontent_top ul li a img {
            width: 100%; } }
      #htmlcontent_top ul li a .item-html {
        position: absolute;
        left: 0;
        top: 42%;
        width: 100%;
        text-align: center;
        -moz-transition: all 0.2s linear;
        -o-transition: all 0.2s linear;
        -webkit-transition: all 0.2s linear;
        transition: all 0.2s linear;
        padding: 13px 15px 15px; }
        @media (max-width: 991px) {
          #htmlcontent_top ul li a .item-html {
            padding: 10px 15px 12px; } }
        @media (max-width: 480px) {
          #htmlcontent_top ul li a .item-html {
            padding: 13px 15px 15px; } }
        #htmlcontent_top ul li a .item-html h4 {
          color: #ffffff;
          margin: 0;
          padding: 0;
          font: 700 2.538em/1.2em "Trebuchet MS", Arial, Helvetica, sans-serif; }
          @media (min-width: 767px) and (max-width: 991px) {
            #htmlcontent_top ul li a .item-html h4 {
              margin: 0 0 10px 0; } }
        #htmlcontent_top ul li a .item-html h3 {
          color: #ffffff;
          margin: 0 0 10px 0;
          padding: 0 20px;
          font: 400 1.154em/1.3em "Trebuchet MS", Arial, Helvetica, sans-serif; }
          @media (min-width: 767px) and (max-width: 991px) {
            #htmlcontent_top ul li a .item-html h3 {
              display: none; } }
        #htmlcontent_top ul li a .item-html span.bnt1 {
          background: url("../img/btn1.png") no-repeat scroll 0 0 transparent;
          display: block;
          height: 32px;
          margin: 0 auto;
          transition: all 0.4s ease 0s;
          width: 32px; }
      #htmlcontent_top ul li a:hover span:hover {
        color: #a9a9a9;
        text-decoration: none; }
      #htmlcontent_top ul li a:hover span.bnt1 {
        transform: rotate(360deg);
        transition: all 0.8s ease 0s; }
      #htmlcontent_top ul li a:hover h4 {
        transform: translate(0px, 25px) scale(1.5);
        transition: all 0.4s ease 0s; }
        @media (min-width: 767px) and (max-width: 991px) {
          #htmlcontent_top ul li a:hover h4 {
            transform: translate(0px, 5px) scale(1.1); } }
      #htmlcontent_top ul li a:hover h3 {
        opacity: 0;
        transition: all 0.4s ease 0s; }

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