.itopplus-background {
background-image:none; 
background-color:none; 

}
/* Selector '*' หมายถึงการเลือกทุก element ในหน้าเว็บ
  - font-family: กำหนด font หลักของทั้งเว็บเป็น "Kanit" และถ้าไม่มีให้ใช้ font ตระกูล sans-serif แทน
  - !important: เป็นการบังคับให้ใช้สไตล์นี้ทับสไตล์อื่นทั้งหมด (ควรใช้เท่าที่จำเป็น เพราะจะทำให้แก้ไขภายหลังได้ยาก)
*/
* {
  font-family: "Kanit", sans-serif !important;
}

/* เลือกแท็ก <a> (ลิงก์) ที่อยู่ใน <li> ของ Navbar
  - background: กำหนดสีพื้นหลังของปุ่มเมนู
  - color: กำหนดสีตัวอักษรของปุ่มเมนู
  - font-size: กำหนดขนาดตัวอักษร
*/
.navbar-default .navbar-nav>li>a{
  background:none;
	color: none;
  font-size: 16px;
}

/* @media query: คือเงื่อนไขในการแสดงผล
  โค้ดในปีกกานี้ จะทำงาน "เมื่อหน้าจอมีความกว้างตั้งแต่ 1024px ขึ้นไป" (สำหรับ Desktop)
*/
@media only screen and (min-width : 1024px) {

  /* กำหนดขนาดตัวอักษรสำหรับ Headings (h1-h6) และระยะห่างของย่อหน้า (p) */
  h1,.h1 { font-size: 2.250em;}
  h2,.h2 { font-size: 1.875em;}
  h3,.h3 { font-size: 1.500em;}
  h4,.h4 { font-size: 1.125em;}
  h5,.h5 { font-size: 0.875em;}
  h6,.h6 { font-size: 0.750em;}
  p { margin: 0 0 10px;}

  /* จัดเรียงรายการเมนู (li) ให้อยู่ในบรรทัดเดียวกัน (แนวนอน)
    - display:inline-block: ทำให้ element เรียงต่อกันเหมือนข้อความ แต่ยังกำหนดความกว้าง/สูงได้
    - *display:inline; และ *zoom:1; เป็นโค้ดสำหรับแก้ปัญหาบนเบราว์เซอร์ Internet Explorer 7 (ปัจจุบันไม่จำเป็นแล้ว)
  */
  .navbar .nav,
  .navbar .nav > li {
    float:none;
    display:inline-block;
    *display:inline; /* ie7 fix */
    *zoom:1; /* hasLayout ie7 trigger */
    vertical-align: center;
  }

  /* จัดให้เมนู #main-navbar-collapse อยู่ตรงกลาง และกำหนดสีพื้นหลัง/สีตัวอักษร
  */
  #main-navbar-collapse{
    text-align:center ;
    background:none;
	  color: none;
  }
}

/* โค้ดในปีกกานี้ จะทำงาน "เมื่อหน้าจอมีความกว้างตั้งแต่ 1366px ขึ้นไป" (สำหรับจอ Wide Screens)
  - สังเกตว่าโค้ดส่วนนี้ซ้ำซ้อนกับของ 1024px ซึ่งสามารถรวมกันได้
*/
@media only screen and (min-width : 1366px) {
  h1,.h1 { font-size: 2.250em;}
  h2,.h2 { font-size: 1.875em;}
  h3,.h3 { font-size: 1.500em;}
  h4,.h4 { font-size: 1.125em;}
  h5,.h5 { font-size: 0.875em;}
  h6,.h6 { font-size: 0.750em;}
  p { margin: 0 0 10px;}
  .navbar .nav,
  .navbar .nav > li {
    float:none;
    display:inline-block;
    *display:inline; /* ie7 fix */
    *zoom:1; /* hasLayout ie7 trigger */
    vertical-align: top;
  }
  #main-navbar-collapse{
    text-align:center ;
  }
}

/* กำหนดให้ <figure> ที่มีคลาส effect-selena มีพื้นหลังโปร่งใส
*/
figure.effect-selena {
  background: transparent;
}

/* มีการกำหนด @media ที่ความกว้าง 1024px ซ้ำอีกครั้ง
  - โค้ดในส่วนนี้จะ "เขียนทับ (override)" โค้ดที่ประกาศไว้ใน @media (min-width: 1024px) บล็อกแรก
*/
@media only screen and (min-width: 1024px) {
  /* เปลี่ยนสีพื้นหลังและสีตัวอักษรของ #main-navbar-collapse อีกครั้ง
    - สังเกต: color กับ background เป็นสีเดียวกัน (#4682B4) จะทำให้มองไม่เห็นตัวอักษร
  */
  #main-navbar-collapse {
    text-align: center;
    background: none;
    color: none; /* <- อาจเป็นข้อผิดพลาด ควรใช้สีที่ตัดกัน เช่น #FFFFFF (สีขาว) */
  }

  /*
    เปลี่ยนสีพื้นหลังและสีตัวอักษรของลิงก์เมนูอีกครั้ง
  */
  .navbar-default .navbar-nav>li>a {
    background: none;
    color: none;
    font-size: 16px;
  }

  /* กำหนดสไตล์สำหรับเมนูย่อย (Dropdown) เมื่อถูกเปิด (open)
    - !important ถูกใช้เพื่อบังคับให้มีผลเหนือสไตล์อื่น
  */
  .navbar-default .navbar-nav .open .dropdown-menu>li>a {
    background-color: #7dc1ee!important;
    color: #fff;
  }
}