

#nav-trigger *,
#nav-trigger *:before,
#nav-trigger *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }



/* =Nav
-------------------------------------------------------------- */
#nav-trigger {
  display: none;
  text-align: center; 
  }
  #nav-trigger span {
    display: inline-block;
    padding: 10px 30px;
    background-color: #b94f7d;
    color: white;
    cursor: pointer;
    text-transform: uppercase; }
    #nav-trigger span:after {
      display: inline-block;
      margin-left: 10px;
      width: 20px;
      height: 10px;
      content: "";
      border-left: solid 10px transparent;
      border-top: solid 10px #fff;
      border-right: solid 10px transparent; }
    #nav-trigger span.open:after {
      border-left: solid 10px transparent;
      border-top: none;
      border-bottom: solid 10px #fff;
      border-right: solid 10px transparent; }



nav#nav-main {
  background-color: #b94f7d;
  padding: 0px;
 }
  nav#nav-main ul {
list-style:none; padding: 0px; margin: 0px;}
  nav#nav-main li {
    display: inline-block;
    border-right: solid 1px #000000;
    padding: 0px;
}
    nav#nav-main li:last-child {
      border-right: none; }
  nav#nav-main a {
float:left;color:#ffffff;padding:5px 5px 5px 5px;  }
    nav#nav-main a:hover {
background-color: #ffffff;
color: #b94f7d; }

nav#nav-mobile {
  position: relative;
  display: none; }
  nav#nav-mobile ul {
    display: none;
    list-style-type: none;
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    background-color: #b94f7d; }
  nav#nav-mobile li {
    display: block;
    padding: 5px 0;
    margin: 0 5px;
    border-bottom: solid 1px #000000; }
    nav#nav-mobile li:last-child {
      border-bottom: none; }
  nav#nav-mobile a {
    display: block;
    color: white;
    padding: 10px 30px; }
    nav#nav-mobile a:hover {
      background-color: #ffffff;
      color: #b94f7d; }
	  

/* This is the first breakpoint and is for screen sizes between 1024 and 1300 pixels. 
If there is no difference in the classes above, you would use the classes above or if you need to make changes at this resolution, add them below*/
@media screen and (max-width: 1330px) {

  nav#nav-mobile li {
    display: block;
    padding: 5px 0;
    margin: 0 5px;
	font-size: 0.9em;
    border-bottom: solid 1px #000000; }

}



/* =Media Queries
-------------------------------------------------------------- */
@media all and (max-width: 1000px) {
  #nav-trigger {
    display: block;
	
	 }

  nav#nav-main {
    display: none; }

  nav#nav-mobile {
    display: block;
	z-index: 2; } }

