body, html {
      height: 100%;
      width:100%;
    }

    html {
      scroll-behavior: smooth;
    }    

    html, body {
      font-size: 18px;
      font-family:"Helvetica","PingFang TC", "Heiti TC", "微軟正黑體","黑體-繁",sans-serif;
      line-height: 1.75;
    }

    h1, h2, h3, h4, h5, h6 {
      font-weight: 600;
      line-height: 1.5;
    }
    h1 {
      font-size: 2.5rem;
    }
    h2 {
      font-size: 2rem;
    }
    h3 {
      font-size: 1.7rem;
    }
    h4 {
      font-size: 1.5rem;
    }
    h5 {
      font-size: 1.2rem;
    }
    h6 {
      font-size: 1.1rem;
    }
    a  {
      font-size:1.0rem;
    }
    p  {
      margin-top: 1em;
      margin-bottom: 1em;
    }

    hr {
      margin-top: 16px;
      margin-bottom: 16px;
    }
	a {
	  color:blue;
	}
    a:link {
      color: blue;
      text-decoration: none;
    }

    a:link:active, a:visited:active {
      color: blue;
    }
	
    .navbar {
	  background-color:black;
	  text-decoration:none;
	  position: fixed; 
	  width:100%;
	  top:50px;
	  left:0px;
	  z-index:2;
	  }
    .navbar a {
      font-size:1.0em;
	  padding:12px;
	}
	.navbar a:hover {
      background-color:gray;
	}
    #collapsibleNavbar ul li a{
	  color:white;
    }
	.active {
      background-color:gray;
	}
 
	span{
	  font-size:1.0em;
	  vertical-align:bottom;
    }
    .first {
	  position:fixed;
	  width:100%;
	  height:50px;
	  background-color:white;
	  top:0px;
	  left:20px;          /* 原始100px */
	  z-index:3;
    }
    .second {
	  position:fixed;
	  width:750px;
	  height:50px;
	  background-color:white;
	  top:5px;
	  left:720px;
	  z-index:2;
    }
    .third {
	  position:fixed;
	  width:100%;
	  height:50px;
	  background-color:white;
	  top:0px;
	  left:0px;
	  z-index:2;
    }	
	img {
      max-width:100%;
    }
	/*
	<576
    >=576 container 540px
	>=768 container 720px
	>=992 container 960px
	>=1200  container 1140px
	*/
	@media screen and (min-width:576px) { 
      .first {
	    position:fixed;
	    width:100%;
	    height:50px;
	    background-color:white;
	    top:0px;
	    left:20px;          /* 原始100px */
	    z-index:3;
      }

    }	
	@media screen and (min-width:1200px) { 
      .first {
	    position:fixed;
	    width:100%;
	    height:50px;
	    background-color:white;
	    top:0px;
	    left:100px;          /* 原始100px */
	    z-index:3;
      }

    }
	@media screen and (min-width:1400px) { 
      .first {
	    position:fixed;
	    width:100%;
	    height:50px;
	    background-color:white;
	    top:0px;
	    left:380px;          /* 原始100px */
	    z-index:3;
      }

    }	

    @media screen and (min-width:991px){	
	/* 下拉選單hover自動呈現 */
    .dropdown-menu li:hover .sub-menu {visibility: visible;}
    .dropdown:hover .dropdown-menu {display: block;}
    }   
 	 /* 主畫面產品 */    
	 .div_main{
	  width:100%;
	  overflow: hidden;
      margin: 0 auto;
    }
    .div_main img{
      width:100%;
      padding-top:0px;
      padding-left:0px;
      opacity;1;
	  overflow-y:hidden;
	  text-decoration:none;
    } 
 
    .div_main:hover img{
      opacity:0.7;
	  
	  border:3px green dotted;
	  overflow-x:hidden;
	  overflow-y:hidden;
    }
	.div_main h6{
      text-align:center;
	  color:black;
    } 
 
    .div_main:hover h6{
      text-align:center;
	  color:#00CCCC;
    }	
    /* Computer association */
	 .div_logo{
      width:280px;
	  height:100px;
	  overflow: hidden;
	  color:white;
	  text-decoration:none;
	  text-align:center;
    }
 
    .div_logo:hover{
	  color:white;
	  background-color:#688486;
    }
	 /* 旗艦產品 */
	.div_4{
      height:250px;
      width:280px;
      margin-top:5px;
      margin-left:5px;
      transition:0.5s;
      border:2px #000000 solid;
    }
	@media screen and (max-width:768px) { 
	.div_4{
      height:220px;
      width:232px;
      margin-top:5px;
      margin-left:5px;
      transition:0.5s;
      border:2px #000000 solid;
    }
	}
	
    .div_4 img{
      height:70%;
      width:100%;
      padding-top:0px;
      padding-left:0px;
      opacity;0.6;
    } 
    .div_4 p{
      margin-bottom:5px;
      color:black;
    } 
    .div_4:hover img{
      opacity:1
    }
    .div_4:hover p{
      opacity:1;
      color:red;
    }
	
	/* 旗艦 Logo */

	.div_4c{
      position: relative;
      height:200px;
      width:280px;
      margin-top:5px;
      margin-left:5px;
      transition:0.5s;
      border:2px #000000 solid;
      text-align:center;
    }
	@media screen and (max-width:768px) { 
     .div_4c{
      position: relative;
      height:160px;
      width:232px;
      margin-top:5px;
      margin-left:5px;
      transition:0.5s;
      border:2px #000000 solid;
      text-align:center;
     }
    }
	  
    .div_4c:hover .overlay {
      background-color: green;
      opacity: 1;
    }

    .div_4c img{
      height:70%;
      width:100%;
      padding:10px;
    } 
	.overlay {
      position: absolute; 
      bottom: 0; 
      background-color: gray;
      width: 100%;
      transition: .5s ease;
      opacity:0.8;
      color: white;
      font-size: 1em;
      padding: 5px;
      text-align: center;
    }
	/* 產品分類 */
	.div_show {
      position: relative;
      width: 275px; /* [1.1] Set it as per your need */
      height:auto;
      overflow: hidden; /* [1.2] Hide the overflowing of child elements */
      margin-top:10px;
      margin-left:5px;
    }
	@media screen and (max-width:768px) { 
     .div_show {
      position: relative;
      width: 232px; /* [1.1] Set it as per your need */
      height:auto;
      overflow: hidden; /* [1.2] Hide the overflowing of child elements */
      margin-top:10px;
      margin-left:5px;
     }
	}
    .div_show img{
      opacity:1;
      transition: transform 1.5s ease;
    }
  
    .div_show:hover .overlay {
	  background-color: green;
      opacity:1;
    }
	
	.img-hover-zoom img {
      opacity:1;
      transition: transform .5s ease;
    }
    .img-hover-zoom:hover img {
      transform: scale(1.2);
      opacity:0.4;
    }
	
	.modal-dialog{
      overflow-y: initial !important
    }

    .modal-body{
      height: 470px;
      overflow-y: auto;
    }
    
	#calendar {
      max-width: 900px;
      margin: 0 auto;
    }