:focus{
  outline: 0;
}

::-moz-focus-inner{
  border: 0;
}

*{
  margin: 0;
  padding: 0;
}

.hide-text{
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

button{    color: #000;
  background: 0 0;
  border: none;
  margin: 0;
  padding: 0;
  line-height: normal;
  width: auto;
  overflow: visible;
}

.pull-right{
  float: right;
}

.pull-left{
  float: left;
}

.hide{
  display: none;
}

.show{
  display: block;
}

.invisible{
  visibility: hidden;
}

.affix{
  position: fixed;
}

body, html{
  height: 100%;
}



a, button{
  text-decoration: none;
}

a:active, a:focus, a:hover{
  outline: 0;
}




.hidden{
  visibility: hidden;
  display: none;
}


.valign-center{
  position: absolute;
  top: 50%;
  width: 100%;
}

.table{
  display: table;
  height: 100%;
  width: 100%;
}

.table-cell{
  display: table-cell;
  vertical-align: middle;
}

.garbage{
  position: absolute;
  left: -9999px;
  top: -9999px;
}



.icon{
  display: block;
}

html.svg .icon-play{
  background-image: url(../images/sprite.svg);
  background-position: -567px -124px;
  width: 9px;
  height: 12px;
}

html.svg .icon-arrow{
  background-image: url(../images/sprite.svg);
  background-position: -533px -117px;
  width: 7px;
  height: 18px;
}

html.svg .icon-facebook{
  background-image: url(../images/sprite.svg);
  background-position: -98px -224px;
  width: 12px;
  height: 21px;
}

html.svg .icon-facebook-bg{
  background-image: url(../images/sprite.svg);
  background-position: -377px -86px;
  width: 43px;
  height: 33px;
}

html.svg .icon-twitter-bg{
  background-image: url(../images/sprite.svg);
  background-position: -377px -140px;
  width: 43px;
  height: 33px;
}

html.svg .icon-twitter{
  background-image: url(../images/sprite.svg);
  background-position: -44px -226px;
  width: 21px;
  height: 21px;
}

html.svg .icon-bg-social{
  background-image: url(../images/sprite.svg);
  background-position: -377px -34px;
  width: 44px;
  height: 35px;
}

html.svg .icon-phone{
  background-image: url(../images/sprite.svg);
  background-position: -40px -296px;
  width: 33px;
  height: 33px;
}

html.svg .icon-donate{
  background-image: url(../images/sprite.svg);
  background-position: -85px -296px;
  width: 33px;
  height: 33px;
}

html.svg .icon-socials{
  background-image: url(../images/sprite.svg);
  background-position: -134px -296px;
  width: 33px;
  height: 33px;
}

html.svg .icon-facebook-nav{
  background-image: url(../images/sprite.svg);
  background-position: -109px -383px;
  width: 13px;
  height: 26px;
}

html.svg .icon-twitter-nav{
  background-image: url(../images/sprite.svg);
  background-position: -46px -387px;
  width: 25px;
  height: 21px;
}

html.svg .icon-close{
  background-image: url(../images/sprite.svg);
  background-position: -173px -433px;
  width: 47px;
  height: 47px;
}

html.svg .icon-close-back{
  background-image: url(../images/sprite.svg);
  background-position: -44px -433px;
  width: 47px;
  height: 47px;
}

html.no-svg .icon-play{
  background-image: url(../images/sprite-svg.png);
  background-position: -567px -124px;
  width: 9px;
  height: 12px;
}

html.no-svg .icon-arrow{
  background-image: url(../images/sprite-svg.png);
  background-position: -533px -117px;
  width: 7px;
  height: 18px;
}

html.no-svg .icon-facebook{
  background-image: url(../images/sprite-svg.png);
  background-position: -98px -224px;
  width: 12px;
  height: 21px;
}

html.no-svg .icon-twitter{
  background-image: url(../images/sprite-svg.png);
  background-position: -44px -226px;
  width: 21px;
  height: 21px;
}

html.no-svg .icon-facebook-bg{
  background-image: url(../images/sprite-svg.png);
  background-position: -377px -86px;
  width: 43px;
  height: 33px;
}

html.no-svg .icon-twitter-bg{
  background-image: url(../images/sprite-svg.png);
  background-position: -377px -140px;
  width: 43px;
  height: 33px;
}

html.no-svg .icon-bg-social{
  background-image: url(../images/sprite-svg.png);
  background-position: -377px -34px;
  width: 44px;
  height: 35px;
}

html.no-svg .icon-phone{
  background-image: url(../images/sprite-svg.png);
  background-position: -40px -296px;
  width: 33px;
  height: 33px;
}

html.no-svg .icon-donate{
  background-image: url(../images/sprite-svg.png);
  background-position: -85px -296px;
  width: 33px;
  height: 33px;
}

html.no-svg .icon-socials{
  background-image: url(../images/sprite-svg.png);
  background-position: -134px -296px;
  width: 33px;
  height: 33px;
}

html.no-svg .icon-facebook-nav{
  background-image: url(../images/sprite-svg.png);
  background-position: -109px -383px;
  width: 13px;
  height: 26px;
}

html.no-svg .icon-twitter-nav{
  background-image: url(../images/sprite-svg.png);
  background-position: -46px -387px;
  width: 25px;
  height: 21px;
}

html.no-svg .icon-close{
  background-image: url(../images/sprite-svg.png);
  background-position: -173px -433px;
  width: 47px;
  height: 47px;
}

html.no-svg .icon-close-back{
  background-image: url(../images/sprite-svg.png);
  background-position: -44px -433px;
  width: 47px;
  height: 47px;
}

#asideSection{
  width: 955px;
  position: absolute;
  height: 100%;
  z-index: 40;
  left: -817px;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
}

#asideContent{
  width: 529px;
  display: inline-block;
  vertical-align: top;
  height: 100%;
  background-color: #FFF;
  overflow: hidden;
  background-image: url(../images/pattern-aside-content.jpg);
  background-position: 0 0;
  background-repeat: repeat;
}

#asideContent .table-cell{
  vertical-align: middle;
}

#asideContent .aside-content{
  display: none;
  position: relative;
  color: #000;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
}

#asideContent h3{
  text-transform: uppercase;
  margin-bottom: 12px;
  position: relative;
  padding: 0 60px;
  height: 83px;
  font-weight: 400;
  font-size: 1em;
}

#asideContent h3:after{
  position: relative;
  content: "";
  display: inline-block;
  height: 1px;
  width: 419px;
  bottom: 23px;
  border-bottom: 1px dashed #000;
}

#asideContent .small{
  font-size: 1.5625em;
}

#asideContent .big{
  display: block;
  position: relative;
  top: -15px;
  font-size: 2.5em;
}

#asideContent h4{
  text-transform: uppercase;
  margin-bottom: 7px;
  padding: 10px 60px 0;
  font-weight: 400;
}

#asideContent p{
  font-family: Lato, Arial, sans-serif;
  font-size: .875em;
  padding: 0 60px;
  color: #636363;
  margin-bottom: 11px;
  line-height: 22px;
}

#asideContent a, #asideContent button {
    color: #FFFFFF;
}

#asideContent p.after-dashed:after{
  position: relative;
  content: "";
  display: inline-block;
  height: 1px;
  width: 419px;
  bottom: -3px;
  border-bottom: 1px dashed #000;
}

#asideContent a.cta{
  margin: 0 0 0 60px;
  padding: 0 25px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, .5);
  background-color: #c6a66d;
  display: inline-block;
  width:419px;    /* ex width: 231px; */
  height: 57px;
  position: relative;
  -webkit-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -moz-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -o-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
}

#asideContent a.cta .icon{
  position: absolute;
  -webkit-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -moz-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -o-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
}

#asideContent a.cta .container-icon{
  position: absolute;
  left: 0;
  top: 1px;
  bottom: 1px;
  width: 23px;
  border-right: 1px solid rgba(255, 255, 255, .2);
  -webkit-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -moz-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -o-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
}

#asideContent a.cta .icon-arrow{
  top: 19px;
  left: 9px;
}

#asideContent a.cta .label{
/*  font-family: claytonlight, Arial, sans-serif;        */
  font-size: .875em;
  -webkit-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -moz-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -o-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  text-transform: uppercase;
  display: block;
  position: relative;
  line-height: 18px;
  text-align: left;
  padding: 18px 0 0 38px;
  letter-spacing: 4px;
}

#asideContent a.cta.after-dashed:after{
  position: relative;
  content: "";
  display: block;
  height: 1px;
  width: 419px;
  bottom: -45px;
  left: -26px;
  border-bottom: 1px dashed #000;
}

#asideContent a.cta:hover .container-icon{
  width: 33px;
}

#asideContent a.cta:hover .container-icon .bg{
  width: 33px;
  opacity: 1;
  -webkit-transform: translate3d(33px, 0, 0);
  -moz-transform: translate3d(33px, 0, 0);
  -o-transform: translate3d(33px, 0, 0);
  transform: translate3d(33px, 0, 0);
}

#asideContent a.cta:hover .container-icon .icon{
  -webkit-transform: translate3d(5px, 0, 0);
  -moz-transform: translate3d(5px, 0, 0);
  -o-transform: translate3d(5px, 0, 0);
  transform: translate3d(5px, 0, 0);
}

#asideContent a.cta:hover .label{
  -webkit-transform: translate3d(10px, 0, 0);
  -moz-transform: translate3d(10px, 0, 0);
  -o-transform: translate3d(10px, 0, 0);
  transform: translate3d(10px, 0, 0);
}

#asideContent .logos{
  margin-top: 55px;
  padding: 0 60px;
}

#asideContent .logos li{
  display: inline-block;
  vertical-align: top;
  height: 70px;
}

#asideContent .logos a{
  text-indent: -9999px;
  display: block;
  margin: 0 auto;
  position: relative;
}

#asideContent .logos .logo-anzac{
  top: -2px;
}

#asideContent .logos .logo-rsl{
  left: 22px;
  top: -9px;
}

#asideContent .partners{
  text-align: center;
  margin-top: 27px;
  padding: 0 60px;
  background: url(../images/about-partners-shadow.png) 0 0 no-repeat;
}

#asideContent .partners .title-partners{
  padding-top: 20px;
  display: block;
  text-transform: uppercase;
  font-size: 1.125em;
}

#asideContent .partners ul{
  margin-top: 28px;
  height: 100px;
}

#asideContent .partners ul li{
  display: inline-block;
  vertical-align: middle;
  text-indent: -9999px;
  margin-right: 19px;
  margin-bottom: 25px;
}

#asideContent .partners ul .partner01{
  background-image: url(../images/sprite.png);
  background-position: -92px -79px;
  width: 64px;
  height: 12px;
}

#asideContent .partners ul .partner02{
  background-image: url(../images/partner_logos.svg);
  background-position: -90px 0px;
  width: 80px;
  height: 11.5px;
}

#asideContent .partners ul .partner03{
  background-image: url(../images/partner_logos.svg);
  background-position: 0px -60px;
  width: 65px;
  height: 20.5px;
}

#asideContent .partners ul .partner04{
  background-image: url(../images/partner_logos.svg);
  background-position: -180px -30px;
  width: 80px;
  height: 14px;
}

#asideContent .partners ul .partner05{
  background-image: url(../images/partner_logos.svg);
  background-position: 0 0px;
  width: 77px;
  height: 20px;
}

#asideContent .partners ul .partner06{
  background-image: url(../images/partner_logos.svg);
  background-position: 0 -30px;
  width: 70px;
  height: 21px;
}

#asideContent .partners ul .partner07{
  background-image: url(../images/sprite.png);
  background-position: 0 0;
  width: 29px;
  height: 33px;
}

#asideContent .partners ul .partner08{
  background-image: url(../images/partner_logos.svg);
  background-position: -90px -60px;
  width: 75px;
  height: 21px;
}

#asideContent .partners ul .partner10{
  background-image: url(../images/partner_logos.svg);
  background-position: -180px 0;
  width: 74px;
  height: 27px;
}

#asideContent .partners ul .partner11{
  background-image: url(../images/partner_logos.svg);
  background-position: -180px -60px;
  width: 82px;
  height: 21px;
}

#asideContent .partners ul .partner12{
  background-image: url(../images/sprite.png);
  background-position: -50px 0;
  width: 115px;
  height: 30px;
}

#asideContent .partners ul .partner13{
  background-image: url(../images/partner_logos.svg);
  background-position: -90px -30px;
  width: 80px;
  height: 20px;
}

#asideContent .partners ul .partner01,#asideContent .partners ul .partner03{
/*  margin-right: 0;     */
}

#asideContent .partners ul .partner08,#asideContent .partners ul .partner11,#asideContent .partners ul .partner12{
/*  margin-right: 6px; */
}

html.svg #asideContent .logo-rsl{
  background-image: url(../images/sprite.svg);
  background-position: -356px -295px;
  width: 62px;
  height: 65px;
}

html.svg #asideContent .logo-anzac{
  background-image: url(../images/sprite.svg);
  background-position: -258px -303px;
  width: 67px;
  height: 57px;
}

html.no-svg #asideContent .logo-rsl{
  background-image: url(../images/sprite-svg.png);
  background-position: -356px -295px;
  width: 62px;
  height: 65px;
}

html.no-svg #asideContent .logo-anzac{
  background-image: url(../images/sprite-svg.png);
  background-position: -258px -303px;
  width: 67px;
  height: 57px;
}

html.no-rgba #asideContent a.cta, html.no-rgba #asideContent a.cta:hover{
  background-color: #bc2224;
}

html.background-size #asideContent .partners{
  background-size: 150px 150px;
}

html.background-size #asideContent .partners .partner01{
  background-image: url(../images/sprite@2x.png);
  background-position: 0 -91px;
  background-repeat: no-repeat;
  background-size: 183px 103px;
  width: 64px;
  height: 12px;
}

html.background-size #asideContent .partners .partner02{
  background-image: url(../images/sprite@2x.png);
  background-position: 0 -33px;
  background-repeat: no-repeat;
  background-size: 183px 103px;
  width: 45px;
  height: 25px;
}

html.background-size #asideContent .partners .partner03{
  background-image: url(../images/sprite@2x.png);
  background-position: 0 -58px;
  background-repeat: no-repeat;
  background-size: 183px 103px;
  width: 46px;
  height: 17px;
}

html.background-size #asideContent .partners .partner04{
  background-image: url(../images/sprite@2x.png);
  background-position: 0 -75px;
  background-repeat: no-repeat;
  background-size: 183px 103px;
  width: 48px;
  height: 16px;
}

html.background-size #asideContent .partners .partner05{
  background-image: url(../images/sprite@2x.png);
  background-position: -50px 0;
  background-repeat: no-repeat;
  background-size: 183px 103px;
  width: 26px;
  height: 26px;
}

html.background-size #asideContent .partners .partner06{
  background-image: url(../images/sprite@2x.png);
  background-position: -129px -25px;
  background-repeat: no-repeat;
  background-size: 183px 103px;
  width: 44px;
  height: 20px;
}

html.background-size #asideContent .partners .partner07{
  background-image: url(../images/sprite@2x.png);
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 183px 103px;
  width: 29px;
  height: 33px;
}

html.background-size #asideContent .partners .partner08{
  background-image: url(../images/sprite@2x.png);
  background-position: -46px -58px;
  background-repeat: no-repeat;
  background-size: 183px 103px;
  width: 92px;
  height: 16px;
}

html.background-size #asideContent .partners .partner10{
  background-image: url(../images/sprite@2x.png);
  background-position: -29px 0;
  background-repeat: no-repeat;
  background-size: 183px 103px;
  width: 21px;
  height: 33px;
}

html.background-size #asideContent .partners .partner11{
  background-image: url(../images/sprite@2x.png);
  background-position: -48px -75px;
  background-repeat: no-repeat;
  background-size: 183px 103px;
  width: 129px;
  height: 15px;
}

html.background-size #asideContent .partners .partner12{
  background-image: url(../images/sprite@2x.png);
  background-position: -76px 0;
  background-repeat: no-repeat;
  background-size: 183px 103px;
  width: 107px;
  height: 25px;
}

html.background-size #asideContent .partners .partner13{
  background-image: url(../images/sprite@2x.png);
  background-position: -76px -25px;
  background-repeat: no-repeat;
  background-size: 183px 103px;
  width: 53px;
  height: 22px;
}





#menu{
  width: 288px;
  display: inline-block;
  vertical-align: top;
  top: 0;
  bottom: 0;
  background-color: #000;
  -webkit-backface-visibility: hidden;
}

#menu .nav{
  position: relative;
  z-index: 10;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
}


#menu ul {
    padding: 0px; margin: 0;
}

#menu .nav li{
  display: block;
  position: relative;
  height: 25%;
  text-align: center;
  background-color: #FFF;
}

#menu .nav li .bg{
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  -webkit-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -moz-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -o-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  background-color: #271f19;             /* braun:   #41342a;  #1f1f1f;   (#271f19 ist  #41342a plus alpha-40.png)            */
}

#menu .nav li:after{
  content: "";
  position: absolute;
  bottom: -25px;
  left: 0;
  background: url(../images/nav-item-shadow.png) 0 0 no-repeat;
  width: 100%;
  height: 25px;
  pointer-events: none;
}

#menu .nav li.thelook {   /* ex backToHP */
  z-index: 5;
}

#menu .nav li.thelook .big{
  letter-spacing: 5px;
}

#menu .nav li.about{
  z-index: 4;
}

#menu .nav li.myMinute{
  z-index: 3;
}

#menu .nav li.myMinute .big{
    letter-spacing: 5px;
}

#menu .nav li.newsletter{
  z-index: 2;
}

#menu .nav li .table-cell > span{
  height: 44px;
  position: relative;
  display: block;
}

#menu .nav li .table-cell > span:after{
  content: "";
  position: absolute;
  height: 3px;
  background-color: #FFF;
  width: 28px;
  bottom: -15px;
  left: 128px;
  opacity: 0;
  -webkit-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -moz-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -o-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-transition-delay: 130ms;
  -moz-transition-delay: 130ms;
  -o-transition-delay: 130ms;
  transition-delay: 130ms;
}

#menu .nav li .small{
  position: absolute;
  display: block;
  width: 100%;
  top: 0;
  left: 0;
  color: #c6a66d;
  -webkit-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -moz-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -o-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

#menu .nav li .big{
  position: absolute;
  display: block;
  width: 100%;
  bottom: 0;
  left: 0;
  color: #c6a66d;
  -webkit-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -moz-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -o-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -webkit-transition-delay: 50ms;
  -moz-transition-delay: 50ms;
  -o-transition-delay: 50ms;
  transition-delay: 50ms;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

#menu .nav li.current .bg,#menu .nav li:hover .bg{
  opacity: .97;                                                                         /*  background-image: url("../images/alpha-40.png");  */
}

#menu .nav li.current .big,#menu .nav li.current .small,#menu .nav li:hover .big,#menu .nav li:hover .small{
  -webkit-transform: translate3d(0, -15px, 0);
  -moz-transform: translate3d(0, -15px, 0);
  -o-transform: translate3d(0, -15px, 0);
  transform: translate3d(0, -15px, 0);
  color: #FFF;
}

#menu .nav li.current .table-cell > span:after,#menu .nav li:hover .table-cell > span:after{
  opacity: 1;
  -webkit-transform: translate3d(0, -15px, 0);
  -moz-transform: translate3d(0, -15px, 0);
  -o-transform: translate3d(0, -15px, 0);
  transform: translate3d(0, -15px, 0);
}

#menu .nav a{
  text-transform: uppercase;
  position: relative;
  z-index: 2;
}

#menu .nav .small{
  font-family: GothamMediumRegular, Arial, sans-serif;
  font-size: .875em;
  letter-spacing: 2px;
}

#menu .nav .big{
/* font-family: bebasregular, Arial, sans-serif;     */
  font-size: 1.125em;
  letter-spacing: 3px;
}

#menu .social{
  height: 68px;
  position: relative;
  z-index: 5;
}

#menu .social li{
  display: inline-block;
  vertical-align: top;
  position: relative;
  width: 144px;
  height: 100%;
}

#menu .social li a{
  background-image: url(../images/pattern-bg-socials-nav.png);
  background-position: 0 0;
  background-repeat: repeat;
}

#menu .social li.facebook a{
  background-color: #5473a3;
}

#menu .social li.facebook a:hover{
  background-color: #395d94;
}

#menu .social li.facebook .icon{
  top: 22px;
  left: 63px;
}

#menu .social li.twitter a{
  background-color: #56acef;
}

#menu .social li.twitter a:hover{
  background-color: #398ed0;
}

#menu .social li.twitter .icon{
  top: 26px;
  left: 63px;
}

#menu .social .icon{
  position: absolute;
}

#menu .social a{
  display: block;
  height: 100%;
}

.lt-ie9 #menu .social li.twitter{
  margin-left: -4px;
}

.btn-menu-wrapper{
  display: inline-block;
  vertical-align: top;
  height: 63px;
}

#btn-menu{
  padding: 29px 22px 22px 24px;
}

#btn-menu span{
  font-family: 'Open Sans', sans-serif;
  font-size: .875em;
  display: inline-block;
  vertical-align: middle;
  text-transform: uppercase;
}

#btn-menu .label{
  letter-spacing: 2px;
}

#btn-menu .icon-container{
  width: 29px;
  height: 19px;
  position: relative;
  top: 1px;
}

#btn-menu .line{
  position: absolute;
  width: 29px;
  height: 3px;
  background-color: #000;
  -webkit-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -moz-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -o-transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  transition: all 300ms cubic-bezier(0.215, .61, .355, 1);
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

#btn-menu .line01{
  top: 0;
  opacity: 1;
  -webkit-transition-delay: 210ms;
  -moz-transition-delay: 210ms;
  -o-transition-delay: 210ms;
  transition-delay: 210ms;
}

#btn-menu .line02{
  top: 7px;
  -webkit-transition-delay: 140ms;
  -moz-transition-delay: 140ms;
  -o-transition-delay: 140ms;
  transition-delay: 140ms;
}

#btn-menu .line03{
  top: 14px;
  -webkit-transition-delay: 70ms;
  -moz-transition-delay: 70ms;
  -o-transition-delay: 70ms;
  transition-delay: 70ms;
}

#btn-menu .line04{
  top: 21px;
  opacity: 0;
  -webkit-transition-delay: 0ms;
  -moz-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

#btn-menu:hover .line{
  -webkit-transform: translate3d(0, -7px, 0);
  -moz-transform: translate3d(0, -7px, 0);
  -o-transform: translate3d(0, -7px, 0);
  transform: translate3d(0, -7px, 0);
}

#btn-menu:hover .line01{
  opacity: 0;
  -webkit-transition-delay: 0ms;
  -moz-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

#btn-menu:hover .line02{
  -webkit-transition-delay: 70ms;
  -moz-transition-delay: 70ms;
  -o-transition-delay: 70ms;
  transition-delay: 70ms;
}

#btn-menu:hover .line03{
  -webkit-transition-delay: 140ms;
  -moz-transition-delay: 140ms;
  -o-transition-delay: 140ms;
  transition-delay: 140ms;
}

#btn-menu:hover .line04{
  opacity: 1;
  -webkit-transition-delay: 210ms;
  -moz-transition-delay: 210ms;
  -o-transition-delay: 210ms;
  transition-delay: 210ms;
}

.menu-open #btn-menu .line{
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  transition: all .3s;
}

.menu-open #btn-menu:hover .line{
  -webkit-transform: none;
  -moz-transform: none;
  -ms-transform: none;
  -o-transform: none;
  transform: none;
}

.menu-open #btn-menu .line:nth-child(2),.menu-open #btn-menu .line:nth-child(4){
  background: 0 0;
}

.menu-open #btn-menu .line:nth-child(1){
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  top: 7px;
  opacity: 1;
}

.menu-open #btn-menu .line:nth-child(3){
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  top: 7px;
  opacity: 1;
}