/*------------------------------------------------------------------//
//      RESPONSIVE SYSTEM                                                                                 //
//------------------------------------------------------------------*/
@media screen and (min-width: 1400px) {
  /* PC 1400+  */ 
  .menuAc {display: none !important;}
}
@media screen and (max-width: 1399px) and (min-width: 1199px) {
  .menuAc {display: none !important;}
}
@media screen and (max-width: 1198px) and (min-width: 992px) {
  .menuAc {display: none !important;}
  main #blog .navigation button.post-prev, main #products .navigation button.prev {margin-left: -25px;}
  main #blog .navigation button.post-next, main #products .navigation button.next {margin-right: -25px;}
  main #contact {background-position: 25% center;}
}
@media screen and (max-width: 991px) and (min-width: 768px) {
  /* TABLET 768+ ~ 960 */
  html, body {overflow-x: hidden;}
  .mContact{display: block;}
  header .logo {margin-left: 20px;width: 200px;}
  .menuAc {display:  block !important; right: 20px !important;}
  main #blog .navigation button.post-prev, main #products .navigation button.prev {margin-left: -25px;}
  main #blog .navigation button.post-next, main #products .navigation button.next {margin-right: -25px;}
  header .head-right .top, header .head-right nav.menu {display: none !important;}
  footer .top .col {width: 100%; margin: 15px 0; display: block !important;flex-basis: auto;}
  main #contact {padding: 0 40px;}
  footer .top .col .icon {float: left;}
  footer .top .col .info {font-size: 15px;}
  footer nav.menu {display: none;}
}
@media screen and (max-width: 767px) and (min-width: 640px) {
  /* TABLET 640+ ~ 768 */
  html, body {overflow-x: hidden;}
  .mContact{display: block;}
  header .logo {margin-left: 20px;width: 120px;}
  .menuAc {display:  block !important; right: 20px !important;}
  main #blog .navigation button.post-prev, main #products .navigation button.prev {margin-left: 15px;}
  main #blog .navigation button.post-next, main #products .navigation button.next {margin-right: 15px;}
  main #information .info .text .slogan {font-size: 50px;}
  main #contact {padding: 0 40px;}
  header .head-right .top, header .head-right nav.menu {display: none !important;}
  footer .top .col {width: 100%; margin: 15px 0; display: block !important;flex-basis: auto;}
  footer .top .col .icon {float: left;}
  footer .top .col .info {font-size: 15px;}
  footer nav.menu {display: none;}
}
@media screen and (max-width: 639px) and (min-width: 480px) {
  /* MOBILE 480+ ~ 640 */
  html, body {overflow-x: hidden;}
  .mContact{display: block;}
  header .logo {margin-left: 20px;width: 120px;}
  .menuAc {display:  block !important; right: 20px !important;}
  main #blog .navigation button.post-prev, main #products .navigation button.prev {margin-left: 5px;width: 30px;height: 40px;line-height: 40px;font-size: 25px;}
  main #blog .navigation button.post-next, main #products .navigation button.next {margin-right: 5px;width: 30px;height: 40px;line-height: 40px;font-size: 25px;}
  main #information .info .text .slogan {font-size: 50px;}
  header .head-right .top, header .head-right nav.menu {display: none !important;}
  main #contact {padding: 0 40px;}
  main .h-title {font-size: 35px;}
  footer .top .col {width: 100%; margin: 15px 0; display: block !important;flex-basis: auto;}
  footer .top .col .icon {float: left;}
  footer .top .col .info {font-size: 15px;float: left;}
  footer .top .col .info a {text-align: left;}
  main #information .info .text p {font-size: 14px;}
  footer nav.menu {display: none;}
}

@media screen and (max-width: 479px) and (min-width: 320px) {
  /* MOBILE 320+ ~ 480 */
  html, body {overflow-x: hidden;}
  .mContact{display: block;}
  header .logo {margin-left: 20px;width: 110px;padding: 5px 0;}
  .menuAc {display:  block !important; right: 20px !important;}
  main #blog .navigation button.post-prev, main #products .navigation button.prev {margin-left: 5px;width: 30px;height: 40px;line-height: 40px;font-size: 25px;}
  main #blog .navigation button.post-next, main #products .navigation button.next {margin-right: 5px;width: 30px;height: 40px;line-height: 40px;font-size: 25px;}
  main #information .info .text {font-size: 13px;}
   main #information .info .text ul {padding-left: 18px;}
  main #information .info .text .slogan {font-size: 30px;}
  header .head-right .top, header .head-right nav.menu {display: none !important;}
  main #contact {padding: 0 40px;}
  main .h-title {font-size: 35px;}
  #copyright {margin-bottom: 55px;}
  footer .top .col {width: 100%; margin: 15px 0; display: block !important;flex-basis: auto;}
  footer .top .col .icon {float: left;}
  footer .top .col .info {font-size: 15px;float: left;}
  main #products {padding-bottom: 0;}
  main #products .product-list .product .in .desc span {font-size: 15px;}
  main #products .product-list .product .in .desc .title {font-size: 12px;}
  main #products .product-list .product .in .desc .title label {font-size: 9px;}
  main #products .product-list .product .in .desc a {font-size: 12px; padding: 0 5px; line-height: 25px;}
  main #contact .form .title {font-size: 70px;}
  footer .top .col .info a {text-align: left;}
  main #information .info .text p {font-size: 12px;}
  footer nav.menu {display: none;}
}