@media (max-width: 1024px) {

  #menu {
	position: absolute;
    width: 100%;
	float: right;
	margin: -65px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
  }
  
  #menu ul {
    width: 100%;
	background: #fffcd7;
    display: none;
  }
  
  #menu.align-center > ul {
    text-align: left;
  }
  #menu ul li {
    width: 100%;
    border-bottom: 1px solid #dde298;
	padding-left: 35px;
  }

  #menu ul li a{
    width: 100%;
    border-bottom: 0;
	color: #f79154;
  }
  #menu > ul > li {
    float: none;	
  }
 
  #menu ul li a:hover, #menu li a:focus, #menu li:active {
	color: #afc26c;
  }


  #menu #menu-button {
  	font-size: 24px;
 	letter-spacing: 1px;
  	text-decoration: none;
  	font-style: normal;
	font-weight: normal;
	color: #E7BA68;
    display: block;
    padding: 17px;
    cursor: pointer;
  }
  
  #menu #menu-button:after {
    position: absolute;
    top: -46px;
    right: 30px;
    display: block;
    height: 35px;
    width: 40px;
    border-top: 3px solid #f79154;
    border-bottom: 3px solid #f79154;
    content: '';
  }
  #menu #menu-button:before {
    position: absolute;
    top: -30px;
    right: 30px;
    display: block;
    height: 3px;
    width: 40px;
    background: #f79154;
    content: '';
  }
  #menu #menu-button.menu-opened:after {
    top: -30px;
	right: 25px;
    border: 0;
    height: 3px;
    width: 53px;
    background: #f79154;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  #menu #menu-button.menu-opened:before {
    top: -30px;
	right: 25px;
    border: 0;
    height: 3px;
    width: 53px;
    background: #f79154;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
}


@media (max-width: 580px) {

  #menu {
	margin: -54px 0px 0px 0px;
  }
  
  #menu ul {

    display: none;

  }
  
  #menu ul li {
	padding-left: 25px;
  }
	
  #menu #menu-button:after {
    top: -22px;
    right: 20px;
    height: 26px;
    width: 30px;
	border-top: 2px solid #f79154;
    border-bottom: 2px solid #f79154;
  }
  #menu #menu-button:before {
    top: -10px;
    right: 20px;
    height: 2px;
    width: 30px;
  }
  #menu #menu-button.menu-opened:after {
    top: -10px;
	right: 15px;
    height: 2px;
    width: 40px;
  }
  #menu #menu-button.menu-opened:before {
    top: -10px;
	right: 15px;
    height: 2px;
    width: 40px;
  }
}