.itopplus-background {
background-image:none;background-color :#ffffff;
}
  .itopplus-banner {
    background: #fff !important;
    color: #000 !important;
    transition: 0.3s;
  }
 

.navbar-default .navbar-nav > li > a {
  color: #444;
  margin: 0;
  padding: 8px 15px;
  border-radius: 0;
}

.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:active,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .open > a:hover {
  color: #444;
  box-shadow: none;
  border-color: transparent;
  background: transparent;
  background-color: transparent;
}


@media screen and (min-width: 1024px) {




}

/*เมนูชิดขวา*/
/* Medium Devices, Desktops */
@media only screen and (min-width: 1024px) {
  h1,
  .h1 {
    font-size: 2.25em;
  }
  h2,
  .h2 {
    font-size: 1.875em;
  }
  h3,
  .h3 {
    font-size: 1.5em;
  }
  h4,
  .h4 {
    font-size: 1.125em;
  }
  h5,
  .h5 {
    font-size: 0.875em;
  }
  h6,
  .h6 {
    font-size: 0.75em;
  }
  p {
    margin: 0 0 10px;
  }
  .navbar .nav,
  .navbar .nav > li {
    float: none;
    display: inline-block;
    vertical-align: top;
  }
  #main-navbar-collapse {
    text-align: right;
  }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width: 1366px) {
  h1,
  .h1 {
    font-size: 2.25em;
  }
  h2,
  .h2 {
    font-size: 1.875em;
  }
  h3,
  .h3 {
    font-size: 1.5em;
  }
  h4,
  .h4 {
    font-size: 1.125em;
  }
  h5,
  .h5 {
    font-size: 0.875em;
  }
  h6,
  .h6 {
    font-size: 0.75em;
  }
  p {
    margin: 0 0 10px;
  }
  .navbar .nav,
  .navbar .nav > li {
    float: none;
    display: inline-block;
    vertical-align: top;
  }
  #main-navbar-collapse {
    text-align: right;
  }
}

/* Album */

figure.effect-jazz figcaption::after {
  border-top: 0px solid transparent;
  border-bottom: 0px solid transparent;
}
figure.effect-jazz {
  background: transparent;
}

.thumbnail {
  border: none;
  border-radius: 0px;
  background-color: #fff;
  box-shadow: 0 0px 5px rgba(0, 0, 0, 0.3);
  padding: 0px !important;
  color: #ef7533;
}
.thumbnail:hover {
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
  background-color: #ef7533;
  border-radius: 0px;
  color: #fff;
}

h2,
.h2 {
  padding: 10px;
  color: #0d3048;
}
.thumbnail:hover span {
  color: #fff !important;
}

/* photo */

.picf {
  transition: 0.5s;
}
.picf:hover {
  transform: translate(0px, -8px);
  transition: 0.5s;
}

/*เนื้อหาระบบ*/
.nav-template li:hover {
  background-color: #fff;
  text-decoration: underline !important;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
  padding-top: 10px;
}
.nav-template li {
  padding-top: 10px;
  border: solid 1px #d5d9db;
}
li.col-md-6.col-sm-6.col-xs-12 {
  margin: 5px 8px !important;
  width: 22.6%;
  background-color: #fff;
}
.col-md-4.col-sm-4.col-xs-12.padding-col {
  width: 100%;
}

.col-md-8.col-sm-8.col-xs-12.padding-col {
  width: 100%;
  font-size: 16px;
  text-align: center;
  padding-top: 15px;
}
.col-md-8.col-sm-8.col-xs-12.padding-col strong {
  font-weight: 100;
  color: #00599b;
}
.col-md-8.col-sm-8.col-xs-12.padding-col strong:hover {
  font-weight: 100;
  color: #0095d2;
}
.img-container {
  width: 100%;
  height: 0;
  padding-bottom: 90%;
  position: relative;
}
.col-md-8.col-sm-8.col-xs-12.padding-col p {
  display: block;
  font-size: 14px;
}

.col-md-8.col-sm-8.col-xs-12.padding-col p:after {
  display: block;
  content: "ข้อมูลสินค้า";
  color: #444444;
  background: transparent;
  width: 50%;
  margin-top: 10% !important;
  margin-bottom: 5% !important;
  padding: 8px;
  font-size: 14px;
  text-align: center;
  margin-bottom: 2px;
  border: solid 1px #b7bfc1;
  margin: 0 auto;
}

.img-container .img {
  background-position: center !important;
}

@media (max-width: 414px) {
  li.col-md-6.col-sm-6.col-xs-12 {
    width: 100% !important;
  }
}

@media only screen and (max-width: 320px) {
  li.col-md-6.col-sm-6.col-xs-12 {
    width: 100% !important;
  }
}

@media only screen and (max-width: 375px) {
  li.col-md-6.col-sm-6.col-xs-12 {
    width: 100% !important;
  }
}

@media only screen and (max-width: 768px) {
  li.col-xs-12 {
    width: 100% !important;
  }
  #imagesControl5bf660b0b82f55001bbe8e0a {
    padding: 0px !important;
  }
}

@media only screen and (max-width: 922px) {
  li.col-sm-6 {
    width: 46.1% !important;
  }
  #imagesControl5bf66107df632d001a71e53c,
  #imagesControl5bf6651ddcdd4b001ef68beb {
    margin: 10px;
  }
}

.nav-template li a {
  font-size: 16px;
}
.fbcomments,
.fbcomments span[style],
.fbcomments iframe[style] {
  display: none;
}

/*Phone*/

@media only screen and (min-width: 360px) {
  .navbar-default .navbar-toggle {
    border-color: #66b2ff;
    border: none !important;
    background: none !important;
  }

  .text-bar {
    color: #66b2ff !important;
    font-size: 0px !important;
  }
}

@media only screen and (max-width: 768px) {
  .navbar-default .navbar-brand {
    padding: 11px;
  }
  #imagesControl5c11d6a3f5802f001e220ce3 {
    padding: 0px !important;
  }
  .table-responsive {
    white-space: nowrap;
  }
}

@media only screen and (min-width: 320px) {
  .navbar-default .navbar-toggle {
    border-color: #66b2ff;
    border: none !important;
    background: none !important;
  }

  .text-bar {
    color: #66b2ff !important;
    font-size: 0px !important;
  }
}

/*Hide Menu Phone*/
.navbar-default .navbar-toggle {
  border-color: #f68e1f00;
}
.navbar-inline .text-bar {
  display: none;
}
.navbar-inline {
  margin-top: 5px;
  margin-right: 2px;
  margin-left: -2px;
  margin-bottom: 9px;
}
.glyphicon-phone-alt:before {
  content: "\e182";
}
p.search_urlSearch {
  word-wrap: break-word;
}
/*Hide Menu Phone*/



.itopplus-bgmain {
  background-image: none;
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: bottom;
  background-color: #fff;
  color: #fff;
}

.itopplus-footer {
  background-image: none;
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: bottom;
  background-color: #fff;
  color: #000;
}

@media only screen and (min-width: 1900px) {
  .container {
    width: 1660px;
  }
}



@media (max-width: 1023px) {
  label.col-xs-12.col-sm-3.col-md-3.control-label {
    width: 33%;
  }
  
  div#main-navbar-collapse {
    background: #fff !important;
}
  
  .navbar-header {
    background: #0d3048;
}
  
  button#navbar-btn {
    height: 50px;
    margin: 0 !important;
    padding: 0 10px !important;
}

}