
.mega-menu{position: absolute; top:0; left:0; width:100%; height:100px; background: transparent; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; z-index:200;}

.mega-menu.js-fixed,
.mega-menu.js-dropdown-open,
.mega-menu.js-hovering { background: #fff; position:fixed;}

.mega-menu.js-fixed:after,
.mega-menu.js-dropdown-open:after,
.mega-menu.js-hovering:after{content: ''; display: block; width:100%; height:1px; background-color: #a9a9a9; position: absolute; bottom:0; left:0; z-index: 201;}
.mega-menu.js-dropdown-open,
.mega-menu.js-hovering{background-color: rgba(255,255,255,0.97);}

.mega-menu.js-fixed:hover::after{
display:none;
}

.mega-menu__wrapper{display: block; width:100%; max-width: 1280px; background: transparent; padding:0 20px; margin:0 auto; height:100%; position: relative; z-index:201;}


.mega-menu__mobile{position: absolute; width:25px; height:25px; left:18px; top:27px; cursor: pointer; display: none;}
.mega-menu__mobile-icon{ position: absolute; left:0; top:11px; width:25px; height:3px; background-color: #a9a9a9; }
.mega-menu__mobile-icon:before,
.mega-menu__mobile-icon:after{content: ''; display: block; width:100%; height:100%; background-color: #a9a9a9; position: absolute; left:0;}
.mega-menu__mobile-icon:before{ top: -6px; }
.mega-menu__mobile-icon:after{ bottom: -6px;}


.mega-menu__logo{display: block; float:left; width:144px; height:100%; background: url(/sites/default/themes/delphix/images/delphix-logo-light.png) no-repeat; background-size: 100% auto; background-position: center 66%;}

html.js-mobile-menu-open .mega-menu__logo,
.mega-menu.js-fixed .mega-menu__logo,
.mega-menu.js-hovering .mega-menu__logo{
  background-image: url(/sites/default/themes/delphix/images/delphix-logo.png);
}

.mega-menu__demo{display: none; position: absolute; right: 20px; top:27px; font-size:13px; padding:5px 15px; background-color: #e63c2e; color: #fff; border-radius:50px;}
.mega-menu__demo:hover{color: #fff;}

.mega-menu__primaries{margin: 0;padding: 0;list-style: none; float:right; margin-top:58px; margin-right:40px;}
.mega-menu.js-search-opened .mega-menu__primaries{opacity:0; pointer-events: none;}
.mega-menu__primary{display: inline-block; margin-left:20px;}

.mega-menu__primary a{ color: #fff; font-size:15px; padding-bottom:8px;}
.mega-menu__primary a:hover,
.mega-menu__primary a.js-open{ color: #fff; border-bottom:2px solid #e23c1c;}
.mega-menu__primary a.visiting{ color: #fff; border-bottom:2px solid #e23c1c;}

.mega-menu.js-fixed .mega-menu__primary a,
.mega-menu.js-fixed .mega-menu__primary a:hover,
.mega-menu.js-fixed .mega-menu__primary a.js-open,
.mega-menu.js-fixed .mega-menu__primary a.visiting,
.mega-menu.js-hovering .mega-menu__primary a,
.mega-menu.js-hovering .mega-menu__primary a:hover,
.mega-menu.js-hovering .mega-menu__primary a.js-open,
.mega-menu.js-hovering .mega-menu__primary a.visiting,
.mega-menu.js-dropdown-open .mega-menu__primary a,
.mega-menu.js-dropdown-open .mega-menu__primary a:hover,
.mega-menu.js-dropdown-open .mega-menu__primary a.js-open,
.mega-menu.js-dropdown-open .mega-menu__primary a.visiting{ color: #a9a9a9; }


.mega-menu__search{position: absolute; right:20px; top:57px; width:21px; height:25px; overflow:hidden; position: absolute;}
.mega-menu__search .ui-input-text{position: absolute; display: block; height:25px; width:100%; margin-left:30px; right:30px; border:0; background: transparent url(/sites/default/themes/delphix/images/search-icon.png) no-repeat center;}
.mega-menu__search > input[type="text"]{display:none;}
.mega-menu__search input[type="text"]{height:25px; width: 100%; border:0; background-color:#f3f3f3; box-sizing: border-box; color: #ccc;}
.mega-menu__search input[type="submit"]{position: absolute; left:0; top:3px; width:21px; height:20px; border:0; text-indent:-999px; overflow:hidden; background: transparent url(/sites/default/themes/delphix/images/search-icon.png) no-repeat center;}
.mega-menu__search-close{position: absolute; right:0; top:3px; width:20px; height:20px;   visibility: hidden; cursor: pointer;}
.mega-menu__search-close:before,
.mega-menu__search-close:after{content: ''; display: block; position: absolute; width:100%; height:3px; background-color: #fff; top:7px;}

.mega-menu__search input[type="submit"]{ -webkit-filter: brightness(10); -o-filter: brightness(10); filter: brightness(10); }
.mega-menu.js-fixed .mega-menu__search input[type="submit"],
.mega-menu.js-dropdown-open .mega-menu__search input[type="submit"],
.mega-menu.js-hovering .mega-menu__search input[type="submit"]{ -webkit-filter: brightness(1); -o-filter: brightness(1); filter: brightness(1); }
.mega-menu.js-fixed .mega-menu__search-close:before,
.mega-menu.js-dropdown-open .mega-menu__search-close:before,
.mega-menu.js-hovering .mega-menu__search-close:before,
.mega-menu.js-fixed .mega-menu__search-close:after,
.mega-menu.js-dropdown-open .mega-menu__search-close:after,
.mega-menu.js-hovering .mega-menu__search-close:after{background-color: #a9a9a9;}

.mega-menu.js-search-opened .mega-menu__search{width: 75%; overflow:visible;}
.mega-menu.js-search-opened .mega-menu__search input[type="text"]{ padding: 0 10px;}
.mega-menu.js-search-opened .mega-menu__search input[type="submit"]{left:-60px;}
.mega-menu.js-search-opened .mega-menu__search-close{visibility: visible;}


.mega-menu__dropdowns{position: absolute; top:100%; width:100%; z-index:200; }
.mega-menu__dropdown{position: absolute; top:0; background-color: rgba(255,255,255,0.97); width:100%; border-bottom:1px solid #a9a9a9; padding-left:140px; padding-top:60px; padding-bottom:60px;}

.mega-menu__columns{display: table; table-layout:fixed; width: 100%; max-width: 1140px; padding:0 20px; margin:0 auto;}
.mega-menu__column{display: table-cell; vertical-align: top;}
.mega-menu__column-title{font-size:18px; color:#e23c1c; margin-bottom:28px;}

.mega-menu__secondaries{margin: 0;padding: 0;list-style: none;}
.mega-menu__secondary{margin-bottom:15px;}
.mega-menu__secondary a{color: #818389; font-size:18px;}

.mega-menu__flag{display: inline-block;}
.mega-menu__flag-content{ display: block; float:left; width:75%; padding-right:15px;}
.mega-menu__flag-header{font-size:20px; font-weight:regular; display: inline-block; margin-bottom:10px;}
.mega-menu__flag-copy{font-size:17px; line-height:20px; margin:0;}
.mega-menu__flag-image{ display: block; float:left; width:25%; padding-bottom:25%; border-radius:100%; background-size: cover;}

.mega-menu__column--rule{border-left:1px solid #a9a9a9; padding-left:50px;}
.mega-menu__column--space-right{padding-right:50px;}




@media screen and (max-width:970px){
  .mega-menu__dropdown{padding-left:20px; padding-right:20px;}
  .mega-menu.js-search-opened .mega-menu__search{ width: 60%; }
}
@media screen and (max-width:800px){
  .mega-menu__primary{margin-left:8px;}
}
@media screen and (max-width:720px){
  html{padding-top:70px;}
  .mega-menu__primaries, .mega-menu__search{display:none;}
  .mega-menu__logo{position: relative; margin-left:40px; top:-8px; width:90px; background-image: url(/sites/default/themes/delphix/images/delphix-logo.png) !important;}
  .mega-menu.js-fixed .mega-menu__logo{opacity:0.8;}
  .mega-menu__mobile{display: block;}
  .mega-menu__demo{display: block;}
  .mega-menu{height:70px; background: #fff; position:fixed; }
  
  .mega-menu.js-fixed:hover::after{
		display:block;
	}

}




/* Effects */



/* For static to 'sticky' transition... */
.mega-menu{
  -webkit-transition: background 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -moz-transition: background 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -ms-transition: background 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -o-transition: background 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  transition: background 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
}
.mega-menu__wrapper{
  -webkit-transition: background 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -moz-transition: background 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -ms-transition: background 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -o-transition: background 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  transition: background 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
}
.mega-menu__logo{
  -webkit-transition: all 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -moz-transition: all 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -ms-transition: all 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -o-transition: all 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  transition: all 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
}
.mega-menu__primary a{
  -webkit-transition: color 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -moz-transition: color 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -ms-transition: color 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -o-transition: color 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  transition: color 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
}


.mega-menu__mobile-icon,
.mega-menu__mobile-icon:before,
.mega-menu__mobile-icon:after{
  -webkit-transition: all 300ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -moz-transition: all 300ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -ms-transition: all 300ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -o-transition: all 300ms cubic-bezier(0.115, 1, 0.430, 0.975);
  transition: all 300ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -webkit-transform-origin: center center;
  -moz-transform-origin: center center;
  -ms-transform-origin: center center;
  -o-transform-origin: center center;
  transform-origin: center center;
}

.js-mobile-menu-open .mega-menu__mobile-icon{ background-color: transparent !important; }
.js-mobile-menu-open .mega-menu__mobile-icon:before{
  top: 0px;
  -webkit-transform: rotateZ(135deg);
  -moz-transform: rotateZ(135deg);
  -o-transform: rotateZ(135deg);
  -ms-transform: rotateZ(135deg);
  transform: rotateZ(135deg);
}
.js-mobile-menu-open .mega-menu__mobile-icon:after{
  bottom: 0px;
  -webkit-transform: rotateZ(-135deg);
  -moz-transform: rotateZ(-135deg);
  -o-transform: rotateZ(-135deg);
  -ms-transform: rotateZ(-135deg);
  transform: rotateZ(-135deg);
}
.mega-menu__search{
  -webkit-transition: all 500ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -moz-transition: all 500ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -ms-transition: all 500ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -o-transition: all 500ms cubic-bezier(0.115, 1, 0.430, 0.975);
  transition: all 500ms cubic-bezier(0.115, 1, 0.430, 0.975);
}
.mega-menu__search-close:before,
.mega-menu__search-close:after{
  -webkit-transition: all 500ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -moz-transition: all 500ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -ms-transition: all 500ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -o-transition: all 500ms cubic-bezier(0.115, 1, 0.430, 0.975);
  transition: all 500ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -webkit-transform-origin: center center;
  -moz-transform-origin: center center;
  -ms-transform-origin: center center;
  -o-transform-origin: center center;
  transform-origin: center center;
  opacity:0;
}
.mega-menu.js-search-opened .mega-menu__search-close:before{
  -webkit-transform: rotateZ(-45deg);
  -moz-transform: rotateZ(-45deg);
  -o-transform: rotateZ(-45deg);
  -ms-transform: rotateZ(-45deg);
  transform: rotateZ(-45deg);
  opacity:1;
}
.mega-menu.js-search-opened .mega-menu__search-close:after{
  -webkit-transform: rotateZ(45deg);
  -moz-transform: rotateZ(45deg);
  -o-transform: rotateZ(45deg);
  -ms-transform: rotateZ(45deg);
  transform: rotateZ(45deg);
  opacity:1;
}

.mega-menu__dropdown{

  visibility:hidden;

  -webkit-transition: all 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -moz-transition: all 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -ms-transition: all 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -o-transition: all 700ms cubic-bezier(0.115, 1, 0.430, 0.975);
  transition: all 700ms cubic-bezier(0.115, 1, 0.430, 0.975);

  -webkit-transform: translate3d(0px,-100px,0px);
  -moz-transform: translate3d(0px,-100px,0px);
  -o-transform: translate3d(0px,-100px,0px);
  -ms-transform: translate3d(0px,-100px,0px);
  transform:  translate3d(0px,-100px,0px);
  opacity:0;
}
.mega-menu__dropdown .mega-menu__column{

  -webkit-transition: all 900ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -moz-transition: all 900ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -ms-transition: all 900ms cubic-bezier(0.115, 1, 0.430, 0.975);
  -o-transition: all 900ms cubic-bezier(0.115, 1, 0.430, 0.975);
  transition: all 900ms cubic-bezier(0.115, 1, 0.430, 0.975);

}
.mega-menu__dropdown .mega-menu__column:nth-child(even){

  -webkit-transform: translate3d(0px,-5px,0px);
  -moz-transform: translate3d(0px,-5px,0px);
  -o-transform: translate3d(0px,-5px,0px);
  -ms-transform: translate3d(0px,-5px,0px);
  transform:  translate3d(0px,-5px,0px);

}
.mega-menu__dropdown .mega-menu__column:nth-child(odd){

  -webkit-transform: translate3d(0px,115px,0px);
  -moz-transform: translate3d(0px,115px,0px);
  -o-transform: translate3d(0px,115px,0px);
  -ms-transform: translate3d(0px,115px,0px);
  transform:  translate3d(0px,115px,0px);

}

.mega-menu__dropdown.js-open{
  visibility:visible;
  -webkit-transform: translate3d(0px,0px,0px);
  -moz-transform: translate3d(0px,0px,0px);
  -o-transform: translate3d(0px,0px,0px);
  -ms-transform: translate3d(0px,0px,0px);
  transform:  translate3d(0px,0px,0px);
  opacity:1;
}

.mega-menu__dropdown.js-open .mega-menu__column{
  -webkit-transform: translate3d(0px,0px,0px);
  -moz-transform: translate3d(0px,0px,0px);
  -o-transform: translate3d(0px,0px,0px);
  -ms-transform: translate3d(0px,0px,0px);
  transform:  translate3d(0px,0px,0px);
}
