* {
    box-sizing: border-box;
    padding: 0px;
    margin: 0px;
    list-style-type: none; 
    text-decoration: none;
    cursor: pointer;
}

/* top-container */

.container {
    background-color:#293f50;
    /* height:42vh; */
    width:98%;
    /* margin:-1rem 1rem;
    padding-top:-0.1rem; */
}
body{
    background-color:#293f50; 
    /* height:100vh;  */
}





/* sup-menu */
.sup-menu {
    display: flex;
    justify-content: space-between;
    /* padding: 1rem 1rem; */
    margin: 2rem;

}

.conference {
    width: 10%;
    font-size: 1.1rem;
    color:#506270;
}

.august {
    width: 22rem;
    padding: 0px 2.0rem;
    text-align: right;
    font-size:1rem;
    color:#506270;
    margin: 1rem 0rem;
}

.il {
    text-align: right;
    padding-left: 6rem;
}

/* menu */
.menu {
    display: flex;
    
    justify-content :right;
    margin: 0 2em;

    /* text-align: right;
    margin: 3rem 0rem;
    padding-top:0rem; */
}

.unlist {
    display: flex;
    justify-content: right;
    padding: 2rem;
    margin-top:1rem;
}

.unlist li {
    padding: 0.5rem;
    list-style-type: none;
   
}
.unlist li a{
color: #fff;
}
.register{
    display: flex;
    flex-direction: column;
    text-align: center;
    align-items: center;
    background: linear-gradient(to right,#64e486,#f8f5a7);
    /* opacity: 0 7; */
    /* padding: -3rem 5rem;
    margin:-4rem 1rem;
    height:25vh;
     */
}
.register p{
    width:19rem;
    color: #506270;
}
.register h3{
    color: #537057;
}
/* third-container */
.third-container{
    display: flex;
   background:  #293f50;
   justify-content: space-between;
   text-align: center;
   width: 98%;
   margin:2rem 1rem ;
}
.third-container h6{
    margin:2.5rem 1rem;
    font-size: 1rem;
    color: #506270;
    

}
.secon-con{
    display: flex;
    justify-content: space-around;
    /* margin:1rem 1rem; */
    background-color:whitesmoke;
    padding: 4rem 0;
    
}
.purchases{
    display: flex;
    flex-direction: column;
    width:24rem;
    justify-content: space-evenly;
    font-size: larger;
    color: #506270;

}
.purchases h4{
    color: #13491b;
}
.pas{
    color: #13491b;
}
.pas h5{
    color: #506270;
}
.form{
    display: flex;
    flex-direction: column;
    width:15rem;
    line-height:2;
    color: #023a0a;
    font-weight: bolder;
}
#num{
    width: 5rem;
    height: 3rem;
    border-radius:8px;
    background-color: rgb(214, 178, 112);
    border: 2px solid whitesmoke;
}
#comnt{
    width: 13rem;
    height: 4rem;
    border-radius:5px;
    margin-top: -0.3rem;
    border:1px solid #506270;;
}
#btn{
    margin-top: 0.3rem;
    width:8rem;
    height:2rem;
    border-radius:5px;
    border: none;
    background-color: #13491b;
    color: white;
}
.menus{
    text-align: right;
    margin: 3rem 0rem;
    padding-top:0rem;
}
.unlit {
    display: flex;
    justify-content: right;
    
    margin-top:-1rem;
}

.unlit li {
    padding: 0.5rem;
    list-style-type: none;
   
}
.unlit li a{
color: #fff;
}
.name{
    border-radius: 4px;
    border:1px solid #506270;
    height:4vh;
}
.bars{
    display:none;
    align-items: center;
    
}
.mobile li{
    padding: 10px;
    
    }
    .mobile li  a{
        color: #efefd0
       ;
       }

.mobile{
display: none;
}
.mobile li{
padding: 10px;


}
.mobile li  a{
color: #fff;

} 
.mobile.show{
    list-style-type: none;
    display: block;
    background-color:#293f50;
width:fit-content;
margin: 0 1em;}
@media screen and (max-width:700px){
    .unlist,.unlit{display: none;}
    .bars{display: block;
    align-items:center;}
}
@media screen and (max-width:600px){
    .secon-con{flex-wrap: wrap;
    align-items: center;}
    .sup-menu{
        flex-direction: column;
    }
}
@media screen and (max-width:400px){
    .secon-con{flex-direction: column; align-items: center;}
    .register p{width: 100px;}
    .sup-menu{flex-wrap: wrap;
    align-items: center;}
    .conference,.august{font-size: small;
    width: 100%;}
}