* {box-sizing: border-box;}


h3{
   
    background-color:  #1f2024;
	font-family: "Arial";
	font-size: 15;
    font-weight: 10;
    margin-left: 3%;
    margin-right: 3%;
    color:  #f4f1eb;
    vertical-align: top;
    
 }

h7{
     font-family: "Times";
    color: rgb(248, 231, 198);
    font-size: 30;
    font-weight: 10;
    letter-spacing: 4px;
    word-spacing: 3px;
    margin-left: 15px;
    margin-top: 40px;
    margin-bottom: 40px;
}

.text-box{    
    position: fixed ;
    width: 100%;
    z-index: 2;
    top: 5px;
    left: 0x;
    background-color: rgba(37, 34, 75, 0.99);
}

.catalog_box {
  margin-top: 30px;
  margin-left: 50px;
} 


.annotation-box{ 
	border-width: 0px;
	border-style:groove;
	border-color:  rgba(227, 230, 250, 0.99);
	background-color:  #1f2024;
    position: fixed ;
    width: 40%;
    z-index: 1;
    top: 47px;
    left: 40%;
    
}
.indexinfo-box{ 
	border-width: 0px;
	border-style:groove;
	border-color:  rgba(227, 230, 250, 0.99);
	background-color:  #1f2024;
    position: fixed ;
    width: 40%;
    z-index: 1;
    top: 47px;
    left: 200;
    
}



.border { 
	border-width: 2px; 
	border-color:  rgba(227, 230, 250, 0.99); 
	border-style:groove;
}

.companyphilosophy{    
    position:absolute;
    z-index: 2;
    width: 80%;
    top: 80px;
    left: 30px;
}



  /*navigation*/
.navigation{
    position: fixed;
    z-index: 5;
    top: 45px;
    left:10px;
     
}



.btn:link{
    text-transform: uppercase;
    width: 110px;
    font-family: 'arial';
    font-size: 13;
    display:inline-block;
    padding: 1px 10px; 
    font-weight: 100;
    text-decoration:none;
    border-radius: 4px;
    border:1px solid rgba(255, 255, 255, 0.96);  
    transition: background-color 0.4s, border 0.4s, color 0.4s;
}

.btn:hover,
.btn:active{
 background-color: rgba(114, 134, 152, 0.99); 
    border:1px solid  rgba(227, 230, 250, 0.99);
     color:  #400d0d;
    
    
}

.btn1{
  background-color:  #1f2024;
     /*border:1px solid rgb(248, 180, 73);*/
     color: #b7e3e5;
	
	border-color: rgba(227, 230, 250, 0.99);
	
    
}

 /* Target the image class */
.zoom-image {
  /* Make sure the image behaves well */
  width: 30%;
  height: auto;
  /* Add the transition speed here (e.g., 0.5s for half a second) */
  transition: transform 0.5s ease-in-out;
}

/* Define what happens when the mouse is over the image */
.zoom-image:hover {
  /* This makes the image 2 larger. Increase or decrease this number as needed */
  transform: scale(2); 
}