#topmenu{
    width: 100%;
    height: 40px;
    position: fixed;
box-shadow: 0 0 10px 0.1px #144552 ;
z-index: 100;
background: #e2ece9;

}
.topmenu{
width: 83%;
height: 100%;
margin: 0 auto;

}
.topmenu>ul{
    width: 100%;

    }
.topmenu>ul>li{
float: right;

 }

 .topmenu>ul>li>a{
   line-height: 40px;
      color: #144552;   
      font-size: 18px;
      margin-left: 30px;
      

}
.topmenu>ul>li>a:hover{
       color: #8bbbb9;   
       font-size: 18px;
       margin-left: 30px;
       
 
 }
 .search{
    float: left;
    line-height: 40px;

 }
 .search>form>input{
    border: 1px solid #8bbbb9;
    border-radius: 4px;
    padding: 2px 5px;
    font-family: tanha;
    font-size: 14px;
    width: 100%;

 }
 .search>form>input:focus{
    outline: none;

 }
 /************************banner***********/
#banner{
width: 100%;
height: 120px;
position: relative;

top: 40px;
background: url('../img/banner02.jpg') repeat-x 0 40px fixed;
opacity: 50%;
display: flex;
flex-flow: row;
justify-content: center;

}
.banner{
max-width: max-content;
line-height: 120px;
position: fixed;

}

.banner>.title{
  margin: 0 auto;
    


}

.banner>.title>a{
    color: #144552;
    text-align: center;
    font-size: 34px;

        
 }
.banner>.title>a:hover{
         color: black;   
        font-size: 40px;
            
        }


.logo{
width: 120px;
height: 120px;
position: absolute;
top:0;
left: 0;
background:url('../img/logo2.jpg') no-repeat 0 40px fixed;
opacity: 70%;
}

.logo:hover{
    opacity: 100%;

    }