/* Top hook CSS */
#htmlcontent_top ul {
  margin-bottom: 30px; }
  @media (max-width: 767px) {
    #htmlcontent_top ul {
      margin-bottom: 0; } }
  @media (max-width: 767px) {
    #htmlcontent_top ul li {
      width: 50%;
      margin-bottom: 30px; } }
  #htmlcontent_top ul li a {
    display: block;
    overflow: hidden; }
    #htmlcontent_top ul li a img {
      max-width: 100%;
      height: auto;
      -moz-transform: scale(1);
      -webkit-transform: scale(1);
      -o-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1);
      -moz-transition: all 0.3s linear;
      -o-transition: all 0.3s linear;
      -webkit-transition: all 0.3s linear;
      transition: all 0.3s linear; }
      @media (max-width: 767px) {
        #htmlcontent_top ul li a img {
          width: 100%; } }
    #htmlcontent_top ul li a .item-html h2 {
      background: #0c090b;
      color: white;
      font: 700 29px/33px "Roboto", sans-serif;
      text-transform: uppercase;
      padding: 8px 15px 9px 15px;
      position: relative;
      overflow: hidden;
      margin: 0; }
      @media (max-width: 1200px) {
        #htmlcontent_top ul li a .item-html h2 {
          font-size: 26px;
          line-height: 29px; } }
      @media (max-width: 991px) {
        #htmlcontent_top ul li a .item-html h2 {
          font-size: 21px;
          padding: 3px 15px 3px 15px; } }
      #htmlcontent_top ul li a .item-html h2:after {
        top: 0;
        left: 0px;
        bottom: 0;
        width: 0;
        position: absolute;
        content: "";
        white-space: nowrap;
        z-index: 1px;
        -moz-transition: all 0.3s linear;
        -o-transition: all 0.3s linear;
        -webkit-transition: all 0.3s linear;
        transition: all 0.3s linear; }
      #htmlcontent_top ul li a .item-html h2 span {
        position: relative;
        z-index: 2; }
    #htmlcontent_top ul li a:hover h2:after {
      width: 500px;
      content: "";
      background: #b62810;
      -moz-transition: all 0.3s linear;
      -o-transition: all 0.3s linear;
      -webkit-transition: all 0.3s linear;
      transition: all 0.3s linear; }
    #htmlcontent_top ul li a:hover img {
      -moz-transform: scale(1.1);
      -moz-transition: all 0.3s linear;
      -o-transition: all 0.3s linear;
      -webkit-transition: all 0.3s linear;
      transition: all 0.3s linear;
      -webkit-transform: scale(1.1);
      -o-transform: scale(1.1);
      -ms-transform: scale(1.1);
      transform: scale(1.1); }

/* Left hook CSS */
/* Right hook CSS */
#htmlcontent_home img {
  max-width: 100%;
  height: auto; }

/* Footer hook CSS */
#footer #htmlcontent_footer {
  padding: 17px 0 0 17px;
  margin-bottom: -88px;
  /*margin-top:10%;*/
  z-index:10000;}
  @media (max-width: 767px) {
    #footer #htmlcontent_footer {
      padding-left: 0; } }
  #footer #htmlcontent_footer ul {
    margin: 0 0 0 0;
    display: inline-block; }
    @media (max-width: 767px) {
      #footer #htmlcontent_footer ul {
        display: block; } }
    #footer #htmlcontent_footer ul li a {
      background: none;
      display: block; }
      #footer #htmlcontent_footer ul li a .item-html {
        text-align: center; }
        #footer #htmlcontent_footer ul li a .item-html h2 {
          margin: 0;
          padding: 0;
          font: 900 63px/65px "Roboto", sans-serif;
          letter-spacing: -0.04em;
          text-transform: uppercase;
          color: white;
          -moz-transition: all 0.2s linear;
          -o-transition: all 0.2s linear;
          -webkit-transition: all 0.2s linear;
          transition: all 0.2s linear;
          animation-duration: 3s;
          animation-name: slidein;
          animation-iteration-count: infinite;
          animation-direction: alternate; }
          @media (max-width: 480px) {
            #footer #htmlcontent_footer ul li a .item-html h2 {
              font-size: 50px;
              line-height: 60px;
              letter-spacing: -0.02em; } }
        #footer #htmlcontent_footer ul li a .item-html h3 {
          margin: -7px 0 0 0;
          padding: 0;
          font: 900 26px/29px "Roboto", sans-serif;
          letter-spacing: -0.025em;
          text-transform: uppercase;
          color: #939393;
          -moz-transition: all 0.2s linear;
          -o-transition: all 0.2s linear;
          -webkit-transition: all 0.2s linear;
          transition: all 0.2s linear;
          animation-duration: 3s;
          animation-name: slidein;
          animation-iteration-count: infinite;
          animation-direction: alternate; }
          @media (max-width: 480px) {
            #footer #htmlcontent_footer ul li a .item-html h3 {
              font-size: 20px;
              line-height: 25px;
              letter-spacing: -0.01em; } }
      #footer #htmlcontent_footer ul li a:hover h2, #footer #htmlcontent_footer ul li a:hover h3 {
        color: #666666;
        text-shadow: rgba(0, 0, 0, 0.17) 0 0 7px;
        -moz-transition: all 0.2s linear;
        -o-transition: all 0.2s linear;
        -webkit-transition: all 0.2s linear;
        transition: all 0.2s linear; }

@keyframes slidein {
  0% {
    opacity: 1;
    text-shadow: rgba(0, 0, 0, 0.17) 0 0 0; }

  50% {
    opacity: 0.85;
    text-shadow: rgba(0, 0, 0, 0.17) 0 0 7px; }

  100% {
    opacity: 0.7;
    text-shadow: rgba(0, 0, 0, 0.17) 0 0 7px; } }
