@import url('https://fonts.googleapis.com/css?family=Playfair+Display|Roboto');
*{box-sizing: border-box;}

ul {
  margin: 0;
  padding: 0;
}

.top-menu:after, 
.submenu:after {
  content: "";
  display: table;
  clear: both;
}
.top-menu > li {
  display: inline-block;
}
.top-menu > li > a {
  padding-top: 18px;
  padding-bottom: 18px;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #000;
  transition: .2s linear;
}
.top-menu > li > a:hover {color: #B03062;}
.dropdown:after {
  content: "\f107";
  font-family: FontAwesome;
  margin-left: 4px;
}
.submenu, 
.submenu-standart {
  box-shadow: 3px 3px 5px 3px rgba(0,0,0,.07);
  background: white;
  padding: 25px 0;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 5;
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0,30px,0);
  transition: .5s ease-out;
  transform-origin: 0% 0%;
  border-radius: 5px;
}
.submenu {width: 100%;}
.submenu-standart {
min-width: 218px;
padding: 15px 0 15px 18px;
}
.dropdown-standart {position: relative;}
.top-menu > li:hover .submenu, 
.top-menu > li:hover .submenu-standart {
  opacity: 1;
  visibility: visible;
  transform: translate3d(0,0,0);
}
.submenu > li {
  float: left;
  width: calc(100% / 3);
  padding: 0 18px;
  border-right: 1px solid #e5e5e5;
}
.submenu-standart li {padding: 5px 18px;}
.submenu > li:last-child {border-right: none;}
.submenu img {
  display: block;
  width: 100%;
}
.submenu li a, 
.submenu-standart li a {
  display: block;
  padding: 5px 0;
  color: #666;
  font-size: 14px;
}
.submenu li .link-image {padding: 0;}
.submenu li a:hover {color: #B03062;}
.submenu h3 {
  font-family: 'Playfair Display', serif;
  font-size: 20px;
  font-weight: 400;
  margin: 10px 0;
}
.container {
  max-width: 1160px;
  margin: 0 auto;
}
.content {
  margin: 20px auto;
  padding: 0 20px;
}

@media(max-width:768px) {
  .top-menu li {
    width: 100%;
    height: auto!important;
    
  }
  .top-menu > li {border-bottom: 1px solid #e5e5e5;}
  .top-menu > li > a {padding: 18px}
  .submenu,
  .submenu-standart {
    position: relative;
    display: none;
    box-shadow: none;
    padding: 0;
    background: rgba(0,0,0,.02);
  }
  .submenu-standart {padding: 10px 0;}
  .submenu > li {
    border-right: none;
    border-bottom: 1px solid #e5e5e5;
    padding: 18px;
  }
  .submenu h3 {margin: 0 0 10px}
  .submenu .image-header {margin: 10px 0}
  .submenu li:last-of-type {border-bottom: none}
  .top-menu > li:hover .submenu,
  .top-menu > li:hover .submenu-standart {display: block;}
}