*{
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
} 

:root{
  --family:BentonSans,Arial,Noto Sans,sans-serif;
  --shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}

.box{
  background-color: white;
  box-shadow: var(--shadow);
  padding-left: 10px;
  font-family: var(--family);
}

body{
 background-color: #f9f9fb;
 
}

#container{

 width: 98%;
 margin: auto;
 /* border: 1px solid red; */
 
 display: flex;
 justify-content: space-around;

}

#left{

  /* border: 1px solid black; */
  width: 22%;
}

#mid{

/* border: 1px solid black; */
width: 48%;

}

#right{

  /* border: 1px solid black; */
  width: 25%;

}

#left_1{

 /* border: 1px solid red; */
 padding: 1rem;
 background-color: white;
 box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
 border-radius: 8px;
}

#left_1>div{

  /* border: 1px solid black; */
  
   
}




#left_1>div>div{

  /* border: 1px solid red; */

}


#left_1>div>div:first-child>img{

  width: 55%;
  display: block;
  margin: auto;

  
}

#left_1>div>div:nth-child(2){

 margin-top: 20px;

}

#left_1>div>div:nth-child(2)>span{

  
  font-family: BentonSans,Arial,Noto Sans,sans-serif;
  text-align: justify;
  line-height: inherit;
  font-size: 15px;
  line-height: 24px;
  color: rgb(70, 70, 70);

}

#left_1>div>div:nth-child(2)>span>span{

  display: block;
  text-align: center;
  font-size: 14px;
}

#left_1>div>div:last-child{

 margin-top: 20px;

}

#left_1>div>div:last-child>button{

  padding: 8px 5px;
  width: 100%;
  background-color: white;
  border: 1px solid #04a9f4;
  font-size: 15px;
  font-weight: bolder;
  color: #04a9f4;
  display: block;
  margin: auto;
  border-radius: 15px;

}

#left_1>div>div:last-child>button>span{

margin-right: 9px;

}

ul{

  list-style-type: none;
  background-color: white;
  padding-left: 15px;
  padding-top: 15px;
  padding-bottom: 12px;
  
}

#leftInfo>li{

  padding: 5px; 
  font-family: BentonSans,Arial,Noto Sans,sans-serif;
  font-size: 12px;

}

#leftInfo>li:hover{
  
  background-color: #b2dbee;
}

.left_2 {
 margin-top: 20px;




}

.left_2>div:first-child{

  box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
background-color: white;
padding: 10px;
font-weight: bold;
font-family: BentonSans,Arial,Noto Sans,sans-serif;
font-size: 12px;
padding-left: 13px;
color: rgb(75, 74, 74);
border-radius: 10px 10px 0px 0px;
}
.txt_space{
  margin-left: 10px;
}

.colour_blue{

  color: #04a9f4;
}

.left_2>div:last-child{

  /* border: 2px solid blue */
  /* margin-top: 1px; */
  /* padding-bottom: 8px; */
 
  box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}



#mid_0{

/* border: 1px solid red; */
}

#mid_0>div:first-child{
border-radius: 10px 10px 0px 0px;
padding: 1rem;
}
#mid_0>div:first-child>p{
font-size: 12px;
color: gray;
}

#mid_0>div:last-child>div{
/* border: 1px solid red; */
display: flex;
justify-content: space-between;
padding: 0px 10px;
padding: 7px;
}

#mid_0>div:last-child>div>div{
display: flex;
align-items: center;

}
#mid_0>div:last-child>div>div>img{

width: 20%;
/* border: 1px solid red; */
}

#WIscore1{
color: gray;
font-size: 12px;
padding-right: 7px;
}

.WIscore2{
font-weight: bold;
}

#display{

 font-weight: bold;
 color: red;
 font-family: var(--family);
}

#mid_0>div:last-child>div:last-child>img{
width: 8%;
}

#name{
   font-weight: bold;
   margin-left: 15px;
}

#name2{
 
  font-weight: bold;
  margin-left: 10px;
  color: gray;  
}

#mid_1{

  /* border: 1px solid red; */
  margin-top: 1rem;
}

.zoom {
  position: relative;
  overflow: hidden;
  max-width: 100%;
  z-index: 1;
  border-radius: 13px 13px 13px 13px;
}
.zoom::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #e5e5e5;
  opacity: 0;
  transition: .5s ease all;
}
img {transition: .5s ease all; width: 100%; object-fit:cover;}
.zoom:hover img {
  transform: scale(1.1);
}

/* #mid_1>div:nth-child(2){
 border: 2px solid red;
 position: absolute;
 background-color: yellow;
 height: 50px;
} */


#mid_1>div:nth-child(2){

  /* border: 1px solid green; */
  color: rgb(255, 255, 255);
  background-color: black;
  font-family: BentonSans,Arial,Noto Sans,sans-serif;
  
  font-size: 15px;
}

#mid_1>div:nth-child(2)>h1{
  padding-left: 10px;
  font-weight: 600;
  
}

#mid_1>div:nth-child(2)>div{

  padding: 10px;
  padding-bottom: 16px;
  color: gray;
}

#mid_1>div:nth-child(3){

  /* border: 1px solid red; */
  display: flex;
  background-color: white;
  box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}

#mid_1>div:nth-child(3)>div:first-child{

   width: 50%;
   padding: 1em;

}

#mid_1>div:nth-child(3)>div:first-child>div>img{

  border-radius: 10px;
}

#mid_1>div:nth-child(3)>div:last-child{

  font-family: BentonSans,Arial,Noto Sans,sans-serif;
  margin-top: 1rem;
  font-size: 14px;
  padding-right: 10px;
  line-height: 20px
}

#mid_1>div:nth-child(3)>div:last-child>p{
  margin-top: 5px;
}


#mid_1>div:nth-child(4){
 
  padding-top: 1rem;
 display: grid;
 grid-template-columns: repeat(3,1fr);
 /* border: 1px solid red; */
 box-shadow: var(--shadow);
 background-color: white;

}

#mid_1>div:nth-child(4)>div{

  padding:10px;
}

#mid_1>div:nth-child(4)>div>p{
  margin-top: 8px;
  font-size: 12px;
  font-weight:550;
  font-family: var(--family);
  line-height: 18px;
  /* border: 1px solid red; */

}


#mid_2{

 /* border: 1px solid red; */
 margin-top: 1rem;
  
}


#mid_2>div:nth-child(1){

  /* border: 1px solid black; */
  padding: 10px;
  border-radius: 10px 10px 0px 0px;
  box-shadow: var(--shadow);
  background-color: white;
}
#mid_2>div:nth-child(1)>h3{

  font-family: var(--family);
}

#mid_2>div:nth-child(2){
   
  padding: 1rem;
  background-color: white;
  box-shadow: var(--shadow);
}

#mid_2>div:nth-child(3){

  font-size: 17px;

}

#mid_2>div:nth-child(3)>p{

  margin-top: 8px;
  font-size: 14px;
  padding-bottom: 1rem;
  color: gray;
}

#mid_2>div:nth-child(4){

  display: flex;
}

#mid_2>div:nth-child(4)>div:first-child{

  width: 65%;
  padding: 8px;
}

#mid_2>div:nth-child(4)>div:last-child{

  padding-top: 1rem;
}

#mid_2>div:nth-child(4)>div:last-child>p{

 color: gray;
 margin-top: 6px;
 font-size: 15px;

}


#mid_2>div:nth-child(5){
 
  display: flex;
  padding: 1rem;

}
#mid_2>div:nth-child(5)>div>span{
   
  font-size: 13px;

}

#mid_2>div:nth-child(5)>div:hover{

  color:#04a9f4

}


#mid_3{


  /* border: 1px solid red; */
  margin-top: 1rem;
}

#mid_3>div:first-child{

  padding: 1rem;
  border-radius: 10px 10px 0px 0px;

}

#mid_3>div:nth-child(2)>div:first-child{

  padding: 1rem;
}

#mid_3>div:nth-child(2)>div:nth-child(2)>p{
 
  /* border: 1px solid red; */
  margin-top: 10px;
  font-size: 14px;
  color: gray;
  padding-bottom: 1rem;

}



#mid_4{


  /* border: 1px solid red; */
  margin-top: 1rem;
}

#mid_4>div:first-child{

  padding: 1rem;
  border-radius: 10px 10px 0px 0px;

}

#mid_4>div:nth-child(2)>div:first-child{

  padding: 1rem;
}

#mid_4>div:nth-child(2)>div:nth-child(2)>p{
 
  /* border: 1px solid red; */
  margin-top: 10px;
  font-size: 14px;
  color: gray;
  padding-bottom: 1rem;

}





#mid_5{

  margin-top: 1rem;
}

#mid_5>div:first-child{

 padding: 1rem;
 border-radius: 10px 10px 0px 0px;

}
#mid_5>div:first-child>p{

  font-size: 11px;
  margin-top: 5px;
  color: gray;
}

#mid_5>div:last-child{

 display: grid;
 grid-template-columns: repeat(3,1fr);
  
}

#mid_5>div:last-child>div{
  padding: 5px;
}


#mid_5>div:last-child>div>p{

  font-size: 13px;
  color: gray;
  margin-top: 7px;
  margin-bottom: 1rem;
}




#mid_6{


  /* border: 1px solid red; */
  margin-top: 1rem;
}

#mid_6>div:first-child{

  padding: 1rem;
  border-radius: 10px 10px 0px 0px;

}

#mid_6>div:nth-child(2)>div:first-child{

  padding: 1rem;
}

#mid_6>div:nth-child(2)>div:nth-child(2)>p{
 
  /* border: 1px solid red; */
  margin-top: 10px;
  font-size: 14px;
  color: gray;
  padding-bottom: 1rem;

}

#mid_7{


  /* border: 1px solid red; */
  margin-top: 1rem;
}

#mid_7>div:first-child{

  padding: 1rem;
  border-radius: 10px 10px 0px 0px;

}

#mid_7>div:nth-child(2)>div:first-child{

  padding: 1rem;
}

#mid_7>div:nth-child(2)>div:nth-child(2)>p{
 
  /* border: 1px solid red; */
  margin-top: 10px;
  font-size: 14px;
  color: gray;
  padding-bottom: 1rem;

}




#right>div{

  margin-top: 1rem;
 
 
}

 #right .txt_space{
 
   font-weight: bold;
 }

 #right_2>div{

  padding: 1rem;
  
 }

 #right_2>div:first-child{

  border-radius: 10px 10px 0px 0px;
 }

 #right_2>div>p{
    margin-top: 7px;
    font-size: 12px;
    font-weight: bold;
 }


#footer{

  /* border: 1px solid red; */
  
  display: flex;
 justify-content: space-between;


 width: 90%;
 margin: auto;

 margin-top: 1rem;
 border-radius: 10px;
 padding: 1rem;
}


#footer>div{
  

  /* border: 1px solid black; */
  height: 100%;
}

#footer>div>h3{

 margin-bottom: 1rem;
 padding-left: 1rem; 
}

#footer>div>ul>li{

  margin-bottom: 10px;
  /* border: 1px solid red; */
  color: gray;
  font-size: 14px;
}

#footer>div>ul>li:hover{

  text-decoration: underline;
}

#policy{

 padding: 2rem;
 /* border: 1px solid red; */
 display: flex;
 width: 95%;
 margin: auto;
 justify-content: space-between;

}

#policy>div:first-child>span:hover{
  text-decoration: underline;
}

#policy>div:last-child>span{
  font-size: 13px;
}