/*=========================== start menu ===============================*/
#hidden_menu
{
  width: 100vw ;
  height: 58px ;
  z-index: 0 ;
}

/*------------------------------------*/

#menu
{
  width: 100vw ;
  position: fixed ;
  background: #172457 ;
  background: #346F92 ;
  background: #fff ;

  background :  #0072ac ; 

  background-color: #043148;
  background-repeat: no-repeat ;
  color: #eee ;

  font-family: Helvetica, Arial, sans-serif;

  background: #064064 ;
  z-index: 1000;
}
 
/*=====================  top  ============================*/

nav
{
  font-family : 'Montserrat', sans-serif ;
  margin-right : 10% ;
  float : right ;  
}

#shoe_menu
{ 
  float: right;
  display: none ;
  color: #222222 ;
  font-size: 20px;
  font-family: 'Montserrat', sans-serif;
  font-weight: 400; 
  padding: 35px 15px;
  margin-right: 30px 5px;
}

nav>ul
{
  direction: rtl ;
  list-style: none ; 
}

.dropdown-content ul 
{
  color: black;
  padding: 5px 16px;
  text-decoration: none;
  display: block;
}

#nav-item
{
 border-bottom: 1px solid #064064 ; 
}

nav>ul>li , nav>ul>a , nav>ul>b 
{
  display: inline-block ;
  text-decoration: none;
 
  color: #fff ;
  font-family: 'Montserrat', sans-serif;
  border-bottom: 3px solid #064064 ; 
 
  text-transform: uppercase;
 
  padding: 16px 15px ;
  cursor: pointer;
  word-spacing: 3px ;
  font-weight:bold;
}

nav>ul>li:hover , nav>ul>a:hover
{
  border-bottom: 3px solid /*#ffba00*/#fff ;
  background-color:/*#05212f*/ none ;
  color: #eee ;
  transition: 0.3s ;
  cursor: pointer ; 
}

.selected
{
  background-color : #05212f ;
  border-bottom: 3px solid #fff ;
  color : #fff ;
}



#list_down
{
  width: 200px ;
  margin-top: 5px ; 
  background: #fff  ;
  display: none ;
  position: fixed ;
  box-shadow: 0 16px 24px 2px rgba(29,17,51,.04),0 6px 32px 4px rgba(9,32,77,.12),0 8px 12px -5px rgba(29,17,51,.12) ;
  margin-right: 10px;
  border: solid 1px darkblue;
  border-radius: 3px ;
}
 
#list_down_item
{
  width: 100% ;
  padding: 10px 10% ;
  display: block ;
  cursor: pointer;
  background: #fff ;
  color: #222 ;
  border-bottom: solid 1px #ccc ;  
}

#list_down_item:hover { background: #eee; }

#nav_item:hover #list_down { display: block; }

.sine
{
  text-align: left ;
  padding: 10px ;
  color: ccc ;
}



#logo
{ 
  padding:6px 2%;
  color: #ff541d ;
  margin-left: 8% ;
  font-size: 35px ; 
  float: left;
  display: inline-block ;
  color: #ffa68a ;
  text-shadow: 1px 1px #ff6737;   
  background: #064064;
  text-align: left;
}

.GFG
{ 
  color: white; 
  font-size: 50px; 
  text-shadow: -1px 1px 0 #000, 
                1px 1px 0 #000, 
                1px -1px 0 #000,
                -1px -1px 0 #000; 
} 

/*=========================== End menu ===============================*/
/*========== Start responsive ==========*/ 


@media screen and (max-width: 1014px) 
{    
  #menu
  {
    background :  #0072ac ;
    background-color: #043148;
    background-repeat: no-repeat ;
    background:none;  
  }

  #hidden_menu { height: 41px ; }

  #shoe_menu
  {
    display: block ;
    cursor: pointer;  
    padding:7px 5px;
    border-radius: 10px ;
    color: #fff ;
  }

  #shoe_menu:hover{ color:#e7a510 ;  }

  nav
  {
    margin: 0 ;
    width: 100% ;
    color: #111 ;
    display: none ; 
    z-index: 9999 ; 
    margin: 0 ;  
  }
      
  nav>ul>li , nav>ul>a , nav>ul>b , #nav_item
  {
    width: 100% ;
    padding: 15px 0 ; 
    text-align: center ;
    color: #444 ; 
    font-size: 12px ;
    display: block ;   
    background-color: #fff ;  
    border-bottom:solid 1px #ccc;
  }

  nav>ul>li:hover , nav>ul>a:hover , nav>ul>b:hover , #nav_item:hover
  {
    background : #ffa68a ; 
    color : #fff ; 
    border-bottom:solid 1px #ccc;
  }
  
  nav>ul>b
  {
    padding-right: 0 ;
    padding-left: 0 ;
  } 

  #list_down
  {
    position: relative;
    width: 100% ;
    margin: 0 ;
    margin-top: 20px ;
  } 

  #list_down_item
  {
    width: 90% ;
    padding: 15px 5% ;
  }  

  .selected
  {
    background-color : #eee ;
    color: /*#ffba00*/#333 ;
    border-bottom:solid 1px ;
  }

  #logo
  {
    width:96vw ;
    padding:3px 2vw;
    margin:0;
    font-size:30px; 
    color:#e90;
  }   

  #logo_text
  {
    display:none;
  }  

}

/*============================ Start responsive =================================*/ 

@media screen and (max-width: 800px) 
{
  
  .top-line{ display: none; } 
  
  nav
   {
      margin: 0 ;
      width: 100% ;
      color: #111 ;
      display: block ; 
      z-index: 9999 ; 
      margin: 0 ;
      box-shadow: 2px 5px 37px -12px;
      display: none;
   }
  
  nav > ul 
  {
    direction: rtl;
    list-style: none;
    width: 60vw;
    float: right;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgb(53, 78, 93) !important; 
  }

  nav>ul>li , nav>ul>b
   {
      width: 100% ;
      text-align: center ;
      border-bottom: #ffba00 ;
      color: #111 ;
      background: #fff ;
      font-size: 16px ;
      display: block;
   }

  #nav_item:hover {padding-bottom:0;}
 
  

}