/**/

/* fonts */

/**/



@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700,900,400italic&subset=latin,latin-ext);

@font-face {

    font-family: Open Sans;

    src: url(../fonts/OpenSans-Regular.ttf);

}



.main-nav ul, ol, li, select {

  margin: 0;

  padding: 0;

  border: 0;

  outline: none;

  background: none;

  font-size: 100%;

  font: inherit;

  vertical-align: baseline;

}

.mobile-main-nav ul, ol, li, select {

  margin: 0;

  padding: 0;

  border: 0;

  outline: none;

  background: none;

  font-size: 100%;

  font: inherit;

  vertical-align: baseline;

}



dl, dt, dd, ul, ol, li {

  list-style: none;

}



 





/**/

/* main nav */

/**/

nav p{

  text-indent: 0px;

}

.main-nav {

  z-index:20;

  position: absolute;

  top: 0;

  right: 50%;

  margin-right: -585px;

}

.main-nav li {

  position: relative;

  float: left;

}

.main-nav li a {

  position: relative;

  display: block;

  padding: 60px 10px 33px;

  font-size: 14px;

  line-height: 15px;

  color: #000;

  -webkit-transform: translate3d(0,0,0);

  -moz-transform: translate3d(0,0,0);

  -ms-transform: translate3d(0,0,0);

  transform: translate3d(0,0,0);

  font-family: Open Sans;

  text-decoration:none;

  text-transform:uppercase;

}

.second-sticky.sticky-container .main-nav>ul>li>a {

  padding-bottom: 12px;

  padding-top: 26px;

}

.main-nav li a .fa-plus,.main-nav li a .fa-heart-o {

  position: absolute;

  opacity: 0;

  top: 26px;

  right: 0;

  left: 50%;

  width: 13px;

  margin-left: -6px;

  font-size: 14px;

  line-height: 14px;

  text-align: center;

  color: #fff;

}

.main-nav li a.active .fa-plus,

.main-nav li a:hover .fa-plus{

  opacity: 1;

}

.second-sticky.sticky-container .main-nav li a .fa-plus,.main-nav li a .fa-heart-o{

  top: 9px;

}

.main-nav li .active {

  z-index: 51;

  color: #fff;

}

.main-nav li ul {

  position: absolute;

  z-index: 49;

  top: 100%;

  left: -9999px;

  width: 220px;

  box-shadow: 0 0 0 10px rgba(255,255,255,0.5);

  color: #fff;

  opacity: 0;

  -o-transition: opacity 0.3s;

  -ms-transition: opacity 0.3s;

  -moz-transition: opacity 0.3s;

  -webkit-transition: opacity 0.3s;

  -webkit-transform: scale(1);

}

.main-nav li:hover > a {

  z-index: 50;



  color: #fff;

}

.main-nav li:hover > ul {

  left: 0;

  opacity: 1;

}

.main-nav .right:hover > ul {

  right: 0;

  left: auto;

}

.main-nav li li {

  float: none;

}

.main-nav li li a {

  padding: 15px 20px;

  box-shadow: none;

  font-size: 13px;

  line-height: 17px;

  color: #fff;

}

.main-nav li li a:after {

  display: none;

}

.main-nav li li a:before {

  content: '- ';

  position: static;

  width: auto;

  height: auto;

  margin: 0;

  background: none;

}

.main-nav .text .more:before {

  content: '';

}

.main-nav li li ul {

  top: 0;

  margin-left: 10px;

}

.main-nav .right li ul {

  margin-right: 10px;

  margin-left: 0;

}

.main-nav li li ul:after {

  content: '';

  position: absolute;

  top: 47px;

  bottom: 0;

  right: 100%;

  width: 10px;

}

.main-nav li li ul:before {

  content: '';

  position: absolute;

  top: 0;

  right: 100%;

  width: 10px;

  height: 47px;

}

.main-nav .right li ul:before {

  right: auto;

  left: 100%;

}

.main-nav li li:hover > a {

  box-shadow: none;

}

.main-nav li:hover li:hover ul {

  left: 100%;

}

.main-nav .right:hover li:hover ul {

  right: 100%;

  left: auto;

}

.main-nav .text {

  padding: 29px 25px;

}

.main-nav .text h2 {

  font-size: 21px;

  line-height: 27px;

  text-transform: uppercase;

}

.main-nav .text hr {

  text-align:left;

  display: block;

  width: 50px;

  margin: 16px 0;

  border-top: 1px solid #fff;

  opacity: 0.4;

  border-bottom:none;

  height:auto;

}

.main-nav .text .more {

  position: absolute;

  right: 0;

  bottom: 0;

  width: 42px;

  height: 42px;

  padding: 0;

  text-align: center;

}

.main-nav .text .more i {

  position: static;

  display: block;

  font-size: 20px;

  line-height: 42px;

}

@media screen and (max-width: 1190px) { /* laptop */

  .main-nav {

    margin-right: -470px;

  }

  .main-nav li a {

    padding-right: 15px;

    padding-left: 15px;

  }

}

@media screen and (max-width: 980px) { /* pad */

  .main-nav {

    margin-right: -369px;

  }

  .main-nav li a {

    padding-right: 10px;

    padding-left: 10px;

    font-size: 13px;

    font-weight: 400;

  }

}

@media screen and (max-width: 767px) { /* phone */

  .main-nav {

    display: none;

  }

}





/**/

/* mobile main nav */

/**/

.mobile-main-nav {

  z-index:20;

  display: none;

  width: 300px;

  margin: 20px auto 0;

  font-weight: 300;

  text-transform: uppercase;

  color: #fff;

}

.mobile-main-nav a {

  display: block;

  padding-left: 15px;

  font-size: 14px;

  line-height: 39px;

  color: #fff;

  font-family: Open Sans;

  text-decoration:none;

  text-transform:uppercase;

}

.mobile-main-nav i {

  position: relative;

  display: block;

  float: right;

  width: 39px;

  height: 39px;

  margin-left: 10px;

  border-left: 1px solid #fff;

  font-size: 18px;

  line-height: 40px;

  text-align: center;

  font-weight: 400;

  cursor: pointer;

}

.mobile-main-nav ul {

  display: none;

}

.mobile-main-nav li {

  margin-top: 1px;

}

.mobile-main-nav li i {

  border-left: 0;

}

.mobile-main-nav li i:after,

.mobile-main-nav li i:before {

  content: '';

  position: absolute;

  top: 11px;

  left: 19px;

  width: 1px;

  height: 17px;

  background: #fff;

}

.mobile-main-nav li i:before {

  top: 19px;

  left: 11px;

  width: 17px;

  height: 1px;

}

.mobile-main-nav li li {

  text-transform: none;

}

.mobile-main-nav li li a:before {

  content: '- ';

}

.mobile-main-nav li li li a:before {

  content: '-- ';

}

.mobile-main-nav .text {

  position: relative;

  padding: 10px 15px;

}

.mobile-main-nav .text h2 {

  font-size: 21px;

  line-height: 27px;

  text-transform: uppercase;

}

.mobile-main-nav .text hr {

  text-align:left;

  display: block;

  width: 50px;

  margin: 16px 0;

  border-top: 1px solid #fff;

  opacity: 0.4;

}

.mobile-main-nav .text .more {

  position: absolute;

  right: 0;

  bottom: 0;

  width: 42px;

  height: 42px;

  padding: 0;

  font-size: 20px;

  line-height: 42px;

  text-align: center;

}

.mobile-main-nav .text .more:before {

  content: "\f101";

}

@media screen and (max-width: 767px) { /* phone */

  .mobile-main-nav {

    display: block;

  }

}