#cssmenu,

#cssmenu ul,

#cssmenu ul li,

#cssmenu ul li a {

  margin: 0;

  padding: 0;

  border: 0;

  list-style: none;

  line-height: 1;

  display: block;

  position: relative;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  text-align:center;

}

#cssmenu ul li:last-child { border-bottom:none;}

#cssmenu {

 width: 100%;
    margin: 0 0 0;
    padding: 0;
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    transform: translateY(-50%);
}

#cssmenu ul ul {

  display: none;

}

#cssmenu > ul > li.active > ul {

  display: block;

}

.align-right {

  float: right;

}

#cssmenu > ul > li > a {

  padding:12px 0;

  cursor: pointer;

  z-index: 2;

  font-size: 22px; letter-spacing:-0.2px;

  text-decoration: none;

  color:#231f20;

  -webkit-transition: color .2s ease;

  -o-transition: color .2s ease;

  transition: color .2s ease;

}

#cssmenu > ul > li > a:hover {

  color:#87764f;

}

#cssmenu ul ul li a {

  padding:10px 0;

  cursor: pointer;

  z-index: 2;

  font-size: 16px;

  text-decoration: none;

  color: #87764f;

  -webkit-transition: color .2s ease;

  -o-transition: color .2s ease;

  transition: color .2s ease;

}

#cssmenu ul ul ul li a {

  padding-left: 32px;

}

#cssmenu ul ul li a:hover {

  color:#231f20;

}

#cssmenu ul ul > li.has-sub > a:after {

  top: 16px;

  right: 26px;

  background: #dddddd;

}

#cssmenu ul ul > li.has-sub > a:before {

  top: 20px;

  background: #dddddd;

}



.nav-conten { width:100%; float:left; margin:82px 0 30px;}

.nav-conten p { font-size:17px; color:#fff; line-height:24px;}

.nav-conten p a { color:#fff;}

.nav-social li { margin:0 2px;}

.nav-social li a { border:none;}

.nav-social li a:hover{opacity:0.7;}


/*Smartphone css*/


@media screen and (max-width: 480px) {

#cssmenu { padding:0 5% 0;}

#cssmenu > ul > li > a { font-size:20px; padding:14px 0;}

}



@media screen and (min-width:481px) and (max-width:600px) {

#cssmenu { padding:0 5% 0;}

#cssmenu > ul > li > a { font-size:20px; padding:14px 0;}

}



@media screen and (min-width:601px) and (max-width:767px) {

#cssmenu { padding:0 5% 0;}

#cssmenu > ul > li > a { font-size:20px; padding:14px 0;}

}



@media screen and (min-width:768px) and (max-width:900px) {

#cssmenu > ul > li > a { font-size:20px; padding:12px 0;}

}



@media screen and (min-width:901px) and (max-width:1024px) {

#cssmenu > ul > li > a { font-size:22px; padding:14px 0;}

}



@media screen and (min-width:1025px) and (max-width:1240px) {



}
@media screen and (min-height:900px) {
#cssmenu > ul > li > a {

  padding:12px 0 !important;

 font-size: 23px!important;
}
#cssmenu {
    top: 53%!important;
}
}
@media screen and (max-height:700px) {
#cssmenu > ul > li > a {
    padding: 5px 0;
}
}
@media screen and (max-height: 568px){
#cssmenu > ul > li > a {
    padding: 7px 0;
    font-size: 19px;
}
}