/*
 * @file
 * global.base
 *
 * - normalize with small modifications for Drupal and AT: http://necolas.github.com/normalize.css/
 * - Gutter widths, see $gutter-width in _custom.scss
 * - Default container alignment.
 * - Flexible images and media declarations.
 * - Copies of the SCSS mixins for reference, which includes an improved
 *   element-invisible and focusable styles.
 */
/* =============================================================================
    HTML5 display definitions
   ========================================================================== */
/*
 * Corrects block display not defined in IE6/7/8/9 & FF3
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
summary {
    display: block;
}

/*
 * Corrects inline-block display not defined in IE6/7/8/9 & FF3
 */
audio,
canvas,
video {
    display: inline-block;
    *display: inline;
    *zoom: 1;
}

/*
 * Prevents modern browsers from displaying 'audio' without controls
 * Remove excess height in iOS5 devices
 */
audio:not([controls]) {
    display: none;
    height: 0;
}

/*
 * Addresses styling for 'hidden' attribute not present in IE7/8/9, FF3, S4
 * Known issue: no IE6 support
 */
[hidden] {
    display: none;
}

/* =============================================================================
    Base
   ========================================================================== */
/*
 * If you are using the themes Responsive JS feature (media_queries.js) do not
 * set a font-family on the html element, use body.
 *
 * 1. Corrects text resizing oddly in IE6/7 when body font-size is set using em units
 *    http://clagnut.com/blog/348/#c790
 * 2. Prevents iOS text size adjust after orientation change, without disabling user zoom
 *    www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
 */
html {
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    line-height: 1.5;
    height: 100%;
    overflow-y: scroll;
}

/*
 * 1 . Addresses margins handled incorrectly in IE6/7
 */
body {
    min-height: 100%;
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    text-rendering: optimizeLegibility\9;
    /* Only IE, can mess with Android */
}

/*
 * Addresses font-family inconsistency between 'textarea' and other form elements.
 */
button,
input,
select,
textarea {
    font-family: sans-serif;
}

/* =============================================================================
    Links
   ========================================================================== */
/*
 * Addresses outline displayed oddly in Chrome
 */
a:focus {
    outline: thin dotted;
}

/*
 * Improves readability when focused and also mouse hovered in all browsers
 * people.opera.com/patrickl/experiments/keyboard/test
 */
a:hover,
a:active {
    outline: 0;
}

/* =============================================================================
    Typography
   ========================================================================== */
/*
 * Headings
 *
 * Addresses font sizes and margins set differently in IE6/7
 * Addresses font sizes within 'section' and 'article' in FF4+, Chrome, S5
 */
h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

h2 {
    font-size: 1.5em;
    margin: 0;
}

h3 {
    font-size: 1.17em;
    margin: 1em 0;
}

h4 {
    font-size: 1em;
    margin: 1.33em 0;
}

h5 {
    font-size: 0.83em;
    margin: 1.67em 0;
}

h6 {
    font-size: 0.75em;
    margin: 2.33em 0;
}

/*
 * Addresses styling not present in IE7/8/9, S5, Chrome
 */
abbr[title] {
    border-bottom: 1px dotted;
}

/*
 * Addresses style set to 'bolder' in FF3+, S4/5, Chrome
 */
b,
strong {
    font-weight: 700;
}

blockquote {
    margin: 1em 40px;
}

/*
 * Addresses styling not present in S5, Chrome
 */
dfn {
    font-style: italic;
}

/*
 * Addresses styling not present in IE6/7/8/9
 */
mark {
    background: #ff0;
    color: #000;
}

/*
 * Addresses margins set differently in IE6/7
 */
p,
pre {
    margin: 0 0 1.5em;
}

/*
 * Corrects font family set oddly in IE6, S4/5, Chrome
 * en.wikipedia.org/wiki/User:Davidgothberg/Test59
 */
pre,
code,
kbd,
samp {
    font-family: monospace, serif;
    _font-family: 'courier new', monospace;
    font-size: 1em;
}

/*
 * Improves readability of pre-formatted text in all browsers
 */
pre {
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/*
 * 1. Addresses CSS quotes not supported in IE6/7
 * 2. Addresses quote property not supported in S4
 */
q {
    quotes: none;
}

q:before,
q:after {
    content: '';
    content: none;
}

small {
    font-size: 75%;
}

/*
 * Prevents sub and sup affecting line-height in all browsers
 * gist.github.com/413930
 */
sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

/* =============================================================================
    Lists
   ========================================================================== */
/*
 * Addresses margins set differently in IE6/7
 */
dl,
menu,
ol,
ul {
    margin: 1em 0;
}

dd {
    margin: 0 0 0 40px;
}

/*
 * Addresses paddings set differently in IE6/7
 */
menu,
ol,
ul {
    padding: 0 0 0 40px;
}

/*
 * Corrects list images handled incorrectly in IE7
 */
nav ul,
nav ol {
    list-style: none;
    list-style-image: none;
}

/* =============================================================================
    Embedded content
   ========================================================================== */
/*
 * 1. Remove border when inside 'a' element in IE6/7/8/9, FF3
 * 2. Improves image quality when scaled in IE7
 *    code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
 */
img {
    /* border: 0; */
    /* Drupal core already does this, uncomment if you need it */
    -ms-interpolation-mode: bicubic;
}

/*
 * Corrects overflow displayed oddly in IE9
 */
svg:not(:root) {
    overflow: hidden;
}

/* =============================================================================
    Figures
   ========================================================================== */
/*
 * Addresses margin not present in IE6/7/8/9, S5, O11
 */
figure {
    margin: 0;
}

/* =============================================================================
    Forms
   ========================================================================== */
/*
 * Corrects margin displayed oddly in IE6/7
 */
form {
    margin: 0;
}

/*
 * Define consistent border, margin, and padding
 */
fieldset {
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

/*
 * 1. Corrects color not being inherited in IE6/7/8/9
 * 2. Corrects text not wrapping in FF3
 * 3. Corrects alignment displayed oddly in IE6/7
 */
legend {
    border: 0;
    padding: 0;
    white-space: normal;
    *margin-left: -7px;
}

/*
 * 1. Corrects font size not being inherited in all browsers
 * 2. Addresses margins set differently in IE6/7, FF3+, S5, Chrome
 * 3. Improves appearance and consistency in all browsers
 */
button,
input,
select,
textarea {
    font-size: 100%;
    margin: 0;
    vertical-align: baseline;
    *vertical-align: middle;
}

/*
 * Addresses FF3/4 setting line-height on 'input' using !important in the UA stylesheet
 */
button,
input {
    line-height: normal;
}

/*
 * 1. Improves usability and consistency of cursor style between image-type 'input' and others
 * 2. Corrects inability to style clickable 'input' types in iOS
 * 3. Removes inner spacing in IE7 without affecting normal text inputs
 *    Known issue: inner spacing remains in IE6
 */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    cursor: pointer;
    -webkit-appearance: button;
    *overflow: visible;
}

/*
 * Re-set default cursor for disabled elements
 */
button[disabled],
input[disabled] {
    cursor: default;
}

/*
 * 1. Addresses box sizing set to content-box in IE8/9
 * 2. Removes excess padding in IE8/9
 * 3. Removes excess padding in IE7
 *    Known issue: excess padding remains in IE6
 */
input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
    *height: 13px;
    *width: 13px;
}

/*
 * 1. Addresses appearance set to searchfield in S5, Chrome
 * 2. Addresses box-sizing set to border-box in S5, Chrome (include -moz to future-proof)
 */
input[type="search"] {
    -webkit-appearance: textfield;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}

/*
 * Removes inner padding and search cancel button in S5, Chrome on OS X
 */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
}

/*
 * Removes inner padding and border in FF3+
 * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/*
 * 1. Removes default vertical scrollbar in IE6/7/8/9
 * 2. Improves readability and alignment in all browsers
 */
textarea {
    overflow: auto;
    vertical-align: top;
}

/* =============================================================================
    Tables
   ========================================================================== */
/*
 * 1. Remove most spacing between table cells
 */
table {
    border: 1px solid;
    border-spacing: 0;
    border-collapse: collapse;
    font-size: inherit;
    font: 100%;
}

/* =============================================================================
    Gutters
   ========================================================================== */
/*
 * If gutters are set in theme settings they will override these values,
 * see Extensions > Modify Output > Design
 * $gutter-width is set in _base.scss
 */
#main-content,
.block-inner,
.pane-inner,
.menu-wrapper,
.branding-elements,
.breadcrumb-wrapper,
.attribution,
.at-panel .rounded-corner,
.block-panels-mini > .block-title,
div.messages {
    margin-left: 10px;
    margin-right: 10px;
}

/*
 * Panel pages need negative margin equal to the gutter width applied to #content,
 * this is taken care of in theme settings as per above for normal gutters
 */
#content .panel-display,
#content .panel-flexible {
    margin-left: -10px;
    margin-right: -10px;
}

/* =============================================================================
    Flexible Media and Cross browser improvements
   ========================================================================== */
/*
 * - This can cause issues in table cells where no width is set on the column,
 *   only in some versions of webkit and IE 7/8.
 * - declaring the width attribute on image elements and using max-width causes
 *   the "dissappering images" bug in IE8.
 * - Mapping services such as Google Maps may break also, see below for fixes.
 */
img {
    height: auto;
    -ms-interpolation-mode: bicubic;
}

/* Ethan Marcotte - http://front.ie/l8rJaA */
img,
embed,
object,
video {
    max-width: 100%;
}

/* Disable flexiblity for IE8 and below */
.lt-ie9 img,
.lt-ie9 object,
.lt-ie9 embed,
.lt-ie9 video {
    max-width: none;
}

/* Override max-width 100% for map displays */
#map img,
.gmap img,
.view-gmap img,
.openlayers-map img,
#getlocations_map_canvas img,
#locationmap_map img,
.geofieldMap img,
.views_horizontal_slider img {
    max-width: none !important;
}

/* =============================================================================
    Misc helpers, Accessibility classes etc
   ========================================================================== */
/* Prevent overflowing content */
header[role=banner],
.content-inner,
.nav,
.region-sidebar-first,
.region-sidebar-second,
.region-secondary-content,
.region-tertiary-content,
.region-footer {
    overflow: visible;
    word-wrap: break-word;
}

/**
 * General classes for hiding content. These are all included as SASS mixins.
 * @SEE: sass/_custom.scss
 */
/**
 * Image replacement
 * Kellum Method: http://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement
 * Additional helpers from http://html5boilerplate.com/docs/css/
 */
.ir {
    /* Kellum Method */
    display: block !important;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    /* Remove the default border from elements like button */
    border: 0;
    /* Crush the text down to take up no space */
    font: 0/0 a;
    /* Remove any text shadows */
    text-shadow: none;
    /* Hide any residual text in Safari 4 and any mobile devices that may need it */
    color: transparent;
    /* Hide the default background color on elements like button */
    background-color: transparent;
}

/* More robust element-invisible and element-focuable classes */
.element-invisible {
    border: 0;
    clip: rect(1px 1px 1px 1px);
    /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
    height: 1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.element-invisible.element-focusable:active,
.element-invisible.element-focusable:focus {
    clip: auto;
    height: auto;
    overflow: visible;
    position: static;
    width: auto;
}

/* Shift content offscreen, can be usefull when you reall need to do this */
.offscreen {
    position: absolute;
    top: -99999em;
    width: 1px;
    height: 1px;
    overflow: hidden;
    outline: 0;
}

/* Hide content from all users */
.element-hidden {
    display: none;
}

.flexslider .flex-direction-nav a, .flexslider .flex-direction-nav a{
    display:block;
}

.flex-direction-nav a:before {
    content: "";
    display: inline-block;
    font-family: "flexslider-icon";
    font-size: 40px;
}
.flexslider .flex-direction-nav a, .flexslider .flex-direction-nav a {
    display: block;
}
.flex-direction-nav a.prev {            
    background: url("../images/slider-left-d.png") no-repeat 0 0;    
}

.flex-direction-nav a.next{
    background: url("../images/slider-right-d.png") center top no-repeat;
}
.flex-direction-nav a {  
    z-index: 10;
}

/* Common styles of menus */
@font-face {
    font-family: 'icomoon';
    src:url('../fonts/icomoon.eot');
    src:url('../fonts/icomoon.eot?#iefix') format('embedded-opentype'),
       url('../fonts/icomoon.woff') format('woff'),
       url('../fonts/icomoon.ttf') format('truetype'),
       url('../fonts/icomoon.svg#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

.dl-menuwrapper {
    width: 100%;
    /*max-width: 300px;*/
    float: left;
    position: relative;
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    perspective: 1000px;
    -webkit-perspective-origin: 50% 200%;
    -moz-perspective-origin: 50% 200%;
    perspective-origin: 50% 200%;
    max-width: 100% !important;
}

.dl-menuwrapper:first-child {
    margin-right: 100px;
}

.dl-menuwrapper button {
    background: #666;
    border: none;
    width: 36px;
    height: 36px;
    text-indent: -900em;
    overflow: hidden;
    position: absolute;
   top: 0;
   right: 0;
    cursor: pointer;
    outline: none;
}

.dl-menuwrapper button:hover,
.dl-menuwrapper button.dl-active,
.dl-menuwrapper ul {
    background: #666;
}

.dl-menuwrapper button:after {
   content: '';
   position: absolute;
   width: 48%;
   height: 3px;
   background: #fff;
   top: 10px;
   left: 26%;
   box-shadow: 0 6px 0 #fff, 0 12px 0 #fff;
}

.dl-menuwrapper ul {
    padding: 0;
    list-style: none;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.nav .dl-menuwrapper li {
    position: relative;
   float: none;
}

.dl-menuwrapper li a {
    display: block;
    position: relative;
    padding: 15px 20px;
    font-size: 16px;
    line-height: 50px;
    font-weight: 300;
    color: #fff;
    outline: none;
}

.no-touch .dl-menuwrapper li a:hover {    
    background: #333;
    color: #fff;
}

.dl-menuwrapper li.dl-back > a {
    padding-left: 30px;
    background: rgba(0,0,0,0.25);
}

.dl-menuwrapper li.dl-back:after,
.dl-menuwrapper li > a:not(:only-child):after {
    position: absolute;
    top: 0;
    line-height: 50px;
    font-family: 'icomoon';
    speak: none;
    -webkit-font-smoothing: antialiased;
    content: "\e000";
    color: #eee;
}

.dl-menuwrapper li.dl-back:after {
    left: 10px;
    color: rgba(212,204,198,0.3);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    transform: rotate(180deg);
    color: #fff;
}

.dl-menuwrapper li > a:after {
    right: 10px;
    color: rgba(0,0,0,0.15);
}

.dl-menuwrapper .dl-menu {
    margin: 0;
    position: absolute;
    width: 100%;
    opacity: 0;
    pointer-events: none;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
}

.dl-menuwrapper .dl-menu.dl-menu-toggle {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.dl-menuwrapper .dl-menu.dl-menuopen {
    opacity: 1;
    pointer-events: auto;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    transform: translateY(0px);
}

.dl-menuwrapper .dl-menu.dl-menuopen .closebtn {
   position: absolute;
   display: block;
   top: -12px;
   right: -12px;
   width: 36px;
   height: 36px;
   cursor: pointer;
   z-index: 3000;
   background: url('images/popup_close.png') no-repeat scroll 50% 50% transparent;
}


/* Hide the inner submenus */
.dl-menuwrapper li .dl-submenu {
    display: none;
}

/* 
When a submenu is openend, we will hide all li siblings.
For that we give a class to the parent menu called "dl-subview".
We also hide the submenu link. 
The opened submenu will get the class "dl-subviewopen".
All this is done for any sub-level being entered.
*/
.dl-menu.dl-subview li,
.dl-menu.dl-subview li.dl-subviewopen > a,
.dl-menu.dl-subview li.dl-subview > a {
    display: none;
}

.dl-menu.dl-subview li.dl-subview,
.dl-menu.dl-subview li.dl-subview .dl-submenu,
.dl-menu.dl-subview li.dl-subviewopen,
.dl-menu.dl-subview li.dl-subviewopen > .dl-submenu,
.dl-menu.dl-subview li.dl-subviewopen > .dl-submenu > li {
    display: block;
}

/* Dynamically added submenu outside of the menu context */
.dl-menuwrapper > .dl-submenu {
    position: absolute;
    width: 100%;
    top: 0px;
    left: 0;
    margin: 0;
}

/* Animation classes for moving out and in */

.dl-menu.dl-animate-out-1 {
    -webkit-animation: MenuAnimOut1 0.4s;
    -moz-animation: MenuAnimOut1 0.4s;
    animation: MenuAnimOut1 0.4s;
}

.dl-menu.dl-animate-out-2 {
    -webkit-animation: MenuAnimOut2 0.3s ease-in-out;
    -moz-animation: MenuAnimOut2 0.3s ease-in-out;
    animation: MenuAnimOut2 0.3s ease-in-out;
}

.dl-menu.dl-animate-out-3 {
    -webkit-animation: MenuAnimOut3 0.4s ease;
    -moz-animation: MenuAnimOut3 0.4s ease;
    animation: MenuAnimOut3 0.4s ease;
}

.dl-menu.dl-animate-out-4 {
    -webkit-animation: MenuAnimOut4 0.4s ease;
    -moz-animation: MenuAnimOut4 0.4s ease;
    animation: MenuAnimOut4 0.4s ease;
}

.dl-menu.dl-animate-out-5 {
    -webkit-animation: MenuAnimOut5 0.4s ease;
    -moz-animation: MenuAnimOut5 0.4s ease;
    animation: MenuAnimOut5 0.4s ease;
}

@-webkit-keyframes MenuAnimOut1 {
    50% {
    -webkit-transform: translateZ(-250px) rotateY(30deg);
}
75% {
    -webkit-transform: translateZ(-372.5px) rotateY(15deg);
    opacity: .5;
}
100% {
    -webkit-transform: translateZ(-500px) rotateY(0deg);
    opacity: 0;
}
}

@-webkit-keyframes MenuAnimOut2 {
    100% {
    -webkit-transform: translateX(-100%);
    opacity: 0;
}
}

@-webkit-keyframes MenuAnimOut3 {
    100% {
    -webkit-transform: translateZ(300px);
    opacity: 0;
}
}

@-webkit-keyframes MenuAnimOut4 {
    100% {
    -webkit-transform: translateZ(-300px);
    opacity: 0;
}
}

@-webkit-keyframes MenuAnimOut5 {
    100% {
    -webkit-transform: translateY(40%);
    opacity: 0;
}
}

@-moz-keyframes MenuAnimOut1 {
    50% {
    -moz-transform: translateZ(-250px) rotateY(30deg);
}
75% {
    -moz-transform: translateZ(-372.5px) rotateY(15deg);
    opacity: .5;
}
100% {
    -moz-transform: translateZ(-500px) rotateY(0deg);
    opacity: 0;
}
}

@-moz-keyframes MenuAnimOut2 {
    100% {
    -moz-transform: translateX(-100%);
    opacity: 0;
}
}

@-moz-keyframes MenuAnimOut3 {
    100% {
    -moz-transform: translateZ(300px);
    opacity: 0;
}
}

@-moz-keyframes MenuAnimOut4 {
    100% {
    -moz-transform: translateZ(-300px);
    opacity: 0;
}
}

@-moz-keyframes MenuAnimOut5 {
    100% {
    -moz-transform: translateY(40%);
    opacity: 0;
}
}

@keyframes MenuAnimOut1 {
    50% {
    transform: translateZ(-250px) rotateY(30deg);
}
75% {
    transform: translateZ(-372.5px) rotateY(15deg);
    opacity: .5;
}
100% {
    transform: translateZ(-500px) rotateY(0deg);
    opacity: 0;
}
}

@keyframes MenuAnimOut2 {
    100% {
    transform: translateX(-100%);
    opacity: 0;
}
}

@keyframes MenuAnimOut3 {
    100% {
    transform: translateZ(300px);
    opacity: 0;
}
}

@keyframes MenuAnimOut4 {
    100% {
    transform: translateZ(-300px);
    opacity: 0;
}
}

@keyframes MenuAnimOut5 {
    100% {
    transform: translateY(40%);
    opacity: 0;
}
}

.dl-menu.dl-animate-in-1 {
    -webkit-animation: MenuAnimIn1 0.3s;
    -moz-animation: MenuAnimIn1 0.3s;
    animation: MenuAnimIn1 0.3s;
}

.dl-menu.dl-animate-in-2 {
    -webkit-animation: MenuAnimIn2 0.3s ease-in-out;
    -moz-animation: MenuAnimIn2 0.3s ease-in-out;
    animation: MenuAnimIn2 0.3s ease-in-out;
}

.dl-menu.dl-animate-in-3 {
    -webkit-animation: MenuAnimIn3 0.4s ease;
    -moz-animation: MenuAnimIn3 0.4s ease;
    animation: MenuAnimIn3 0.4s ease;
}

.dl-menu.dl-animate-in-4 {
    -webkit-animation: MenuAnimIn4 0.4s ease;
    -moz-animation: MenuAnimIn4 0.4s ease;
    animation: MenuAnimIn4 0.4s ease;
}

.dl-menu.dl-animate-in-5 {
    -webkit-animation: MenuAnimIn5 0.4s ease;
    -moz-animation: MenuAnimIn5 0.4s ease;
    animation: MenuAnimIn5 0.4s ease;
}

@-webkit-keyframes MenuAnimIn1 {
    0% {
    -webkit-transform: translateZ(-500px) rotateY(0deg);
    opacity: 0;
}
20% {
    -webkit-transform: translateZ(-250px) rotateY(30deg);
    opacity: 0.5;
}
100% {
    -webkit-transform: translateZ(0px) rotateY(0deg);
    opacity: 1;
}
}

@-webkit-keyframes MenuAnimIn2 {
    0% {
    -webkit-transform: translateX(-100%);
    opacity: 0;
}
100% {
    -webkit-transform: translateX(0px);
    opacity: 1;
}
}

@-webkit-keyframes MenuAnimIn3 {
    0% {
    -webkit-transform: translateZ(300px);
    opacity: 0;
}
100% {
    -webkit-transform: translateZ(0px);
    opacity: 1;
}
}

@-webkit-keyframes MenuAnimIn4 {
    0% {
    -webkit-transform: translateZ(-300px);
    opacity: 0;
}
100% {
    -webkit-transform: translateZ(0px);
    opacity: 1;
}
}

@-webkit-keyframes MenuAnimIn5 {
    0% {
    -webkit-transform: translateY(40%);
    opacity: 0;
}
100% {
    -webkit-transform: translateY(0);
    opacity: 1;
}
}

@-moz-keyframes MenuAnimIn1 {
    0% {
    -moz-transform: translateZ(-500px) rotateY(0deg);
    opacity: 0;
}
20% {
    -moz-transform: translateZ(-250px) rotateY(30deg);
    opacity: 0.5;
}
100% {
    -moz-transform: translateZ(0px) rotateY(0deg);
    opacity: 1;
}
}

@-moz-keyframes MenuAnimIn2 {
    0% {
    -moz-transform: translateX(-100%);
    opacity: 0;
}
100% {
    -moz-transform: translateX(0px);
    opacity: 1;
}
}

@-moz-keyframes MenuAnimIn3 {
    0% {
    -moz-transform: translateZ(300px);
    opacity: 0;
}
100% {
    -moz-transform: translateZ(0px);
    opacity: 1;
}
}

@-moz-keyframes MenuAnimIn4 {
    0% {
    -moz-transform: translateZ(-300px);
    opacity: 0;
}
100% {
    -moz-transform: translateZ(0px);
    opacity: 1;
}
}

@-moz-keyframes MenuAnimIn5 {
    0% {
    -moz-transform: translateY(40%);
    opacity: 0;
}
100% {
    -moz-transform: translateY(0);
    opacity: 1;
}
}

@keyframes MenuAnimIn1 {
    0% {
    transform: translateZ(-500px) rotateY(0deg);
    opacity: 0;
}
20% {
    transform: translateZ(-250px) rotateY(30deg);
    opacity: 0.5;
}
100% {
    transform: translateZ(0px) rotateY(0deg);
    opacity: 1;
}
}

@keyframes MenuAnimIn2 {
    0% {
    transform: translateX(-100%);
    opacity: 0;
}
100% {
    transform: translateX(0px);
    opacity: 1;
}
}

@keyframes MenuAnimIn3 {
    0% {
    transform: translateZ(300px);
    opacity: 0;
}
100% {
    transform: translateZ(0px);
    opacity: 1;
}
}

@keyframes MenuAnimIn4 {
    0% {
    transform: translateZ(-300px);
    opacity: 0;
}
100% {
    transform: translateZ(0px);
    opacity: 1;
}
}

@keyframes MenuAnimIn5 {
    0% {
    transform: translateY(40%);
    opacity: 0;
}
100% {
    transform: translateY(0);
    opacity: 1;
}
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-1 {
    -webkit-animation: SubMenuAnimIn1 0.4s ease;
    -moz-animation: SubMenuAnimIn1 0.4s ease;
    animation: SubMenuAnimIn1 0.4s ease;
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-2 {
    -webkit-animation: SubMenuAnimIn2 0.3s ease-in-out;
    -moz-animation: SubMenuAnimIn2 0.3s ease-in-out;
    animation: SubMenuAnimIn2 0.3s ease-in-out;
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-3 {
    -webkit-animation: SubMenuAnimIn3 0.4s ease;
    -moz-animation: SubMenuAnimIn3 0.4s ease;
    animation: SubMenuAnimIn3 0.4s ease;
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-4 {
    -webkit-animation: SubMenuAnimIn4 0.4s ease;
    -moz-animation: SubMenuAnimIn4 0.4s ease;
    animation: SubMenuAnimIn4 0.4s ease;
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-5 {
    -webkit-animation: SubMenuAnimIn5 0.4s ease;
    -moz-animation: SubMenuAnimIn5 0.4s ease;
    animation: SubMenuAnimIn5 0.4s ease;
}

@-webkit-keyframes SubMenuAnimIn1 {
    0% {
    -webkit-transform: translateX(50%);
    opacity: 0;
}
100% {
    -webkit-transform: translateX(0px);
    opacity: 1;
}
}

@-webkit-keyframes SubMenuAnimIn2 {
    0% {
    -webkit-transform: translateX(100%);
    opacity: 0;
}
100% {
    -webkit-transform: translateX(0px);
    opacity: 1;
}
}

@-webkit-keyframes SubMenuAnimIn3 {
    0% {
    -webkit-transform: translateZ(-300px);
    opacity: 0;
}
100% {
    -webkit-transform: translateZ(0px);
    opacity: 1;
}
}

@-webkit-keyframes SubMenuAnimIn4 {
    0% {
    -webkit-transform: translateZ(300px);
    opacity: 0;
}
100% {
    -webkit-transform: translateZ(0px);
    opacity: 1;
}
}

@-webkit-keyframes SubMenuAnimIn5 {
    0% {
    -webkit-transform: translateZ(-200px);
    opacity: 0;
}
100% {
    -webkit-transform: translateZ(0);
    opacity: 1;
}
}

@-moz-keyframes SubMenuAnimIn1 {
    0% {
    -moz-transform: translateX(50%);
    opacity: 0;
}
100% {
    -moz-transform: translateX(0px);
    opacity: 1;
}
}

@-moz-keyframes SubMenuAnimIn2 {
    0% {
    -moz-transform: translateX(100%);
    opacity: 0;
}
100% {
    -moz-transform: translateX(0px);
    opacity: 1;
}
}

@-moz-keyframes SubMenuAnimIn3 {
    0% {
    -moz-transform: translateZ(-300px);
    opacity: 0;
}
100% {
    -moz-transform: translateZ(0px);
    opacity: 1;
}
}

@-moz-keyframes SubMenuAnimIn4 {
    0% {
    -moz-transform: translateZ(300px);
    opacity: 0;
}
100% {
    -moz-transform: translateZ(0px);
    opacity: 1;
}
}

@-moz-keyframes SubMenuAnimIn5 {
    0% {
    -moz-transform: translateZ(-200px);
    opacity: 0;
}
100% {
    -moz-transform: translateZ(0);
    opacity: 1;
}
}

@keyframes SubMenuAnimIn1 {
    0% {
    transform: translateX(50%);
    opacity: 0;
}
100% {
    transform: translateX(0px);
    opacity: 1;
}
}

@keyframes SubMenuAnimIn2 {
    0% {
    transform: translateX(100%);
    opacity: 0;
}
100% {
    transform: translateX(0px);
    opacity: 1;
}
}

@keyframes SubMenuAnimIn3 {
    0% {
    transform: translateZ(-300px);
    opacity: 0;
}
100% {
    transform: translateZ(0px);
    opacity: 1;
}
}

@keyframes SubMenuAnimIn4 {
    0% {
    transform: translateZ(300px);
    opacity: 0;
}
100% {
    transform: translateZ(0px);
    opacity: 1;
}
}

@keyframes SubMenuAnimIn5 {
    0% {
    transform: translateZ(-200px);
    opacity: 0;
}
100% {
    transform: translateZ(0);
    opacity: 1;
}
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-1 {
    -webkit-animation: SubMenuAnimOut1 0.4s ease;
    -moz-animation: SubMenuAnimOut1 0.4s ease;
    animation: SubMenuAnimOut1 0.4s ease;
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-2 {
    -webkit-animation: SubMenuAnimOut2 0.3s ease-in-out;
    -moz-animation: SubMenuAnimOut2 0.3s ease-in-out;
    animation: SubMenuAnimOut2 0.3s ease-in-out;
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-3 {
    -webkit-animation: SubMenuAnimOut3 0.4s ease;
    -moz-animation: SubMenuAnimOut3 0.4s ease;
    animation: SubMenuAnimOut3 0.4s ease;
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-4 {
    -webkit-animation: SubMenuAnimOut4 0.4s ease;
    -moz-animation: SubMenuAnimOut4 0.4s ease;
    animation: SubMenuAnimOut4 0.4s ease;
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-5 {
    -webkit-animation: SubMenuAnimOut5 0.4s ease;
    -moz-animation: SubMenuAnimOut5 0.4s ease;
    animation: SubMenuAnimOut5 0.4s ease;
}

@-webkit-keyframes SubMenuAnimOut1 {
    0% {
    -webkit-transform: translateX(0%);
    opacity: 1;
}
100% {
    -webkit-transform: translateX(50%);
    opacity: 0;
}
}

@-webkit-keyframes SubMenuAnimOut2 {
    0% {
    -webkit-transform: translateX(0%);
    opacity: 1;
}
100% {
    -webkit-transform: translateX(100%);
    opacity: 0;
}
}

@-webkit-keyframes SubMenuAnimOut3 {
    0% {
    -webkit-transform: translateZ(0px);
    opacity: 1;
}
100% {
    -webkit-transform: translateZ(-300px);
    opacity: 0;
}
}

@-webkit-keyframes SubMenuAnimOut4 {
    0% {
    -webkit-transform: translateZ(0px);
    opacity: 1;
}
100% {
    -webkit-transform: translateZ(300px);
    opacity: 0;
}
}

@-webkit-keyframes SubMenuAnimOut5 {
    0% {
    -webkit-transform: translateZ(0);
    opacity: 1;
}
100% {
    -webkit-transform: translateZ(-200px);
    opacity: 0;
}
}

@-moz-keyframes SubMenuAnimOut1 {
    0% {
    -moz-transform: translateX(0%);
    opacity: 1;
}
100% {
    -moz-transform: translateX(50%);
    opacity: 0;
}
}

@-moz-keyframes SubMenuAnimOut2 {
    0% {
    -moz-transform: translateX(0%);
    opacity: 1;
}
100% {
    -moz-transform: translateX(100%);
    opacity: 0;
}
}

@-moz-keyframes SubMenuAnimOut3 {
    0% {
    -moz-transform: translateZ(0px);
    opacity: 1;
}
100% {
    -moz-transform: translateZ(-300px);
    opacity: 0;
}
}

@-moz-keyframes SubMenuAnimOut4 {
    0% {
    -moz-transform: translateZ(0px);
    opacity: 1;
}
100% {
    -moz-transform: translateZ(300px);
    opacity: 0;
}
}

@-moz-keyframes SubMenuAnimOut5 {
    0% {
    -moz-transform: translateZ(0);
    opacity: 1;
}
100% {
    -moz-transform: translateZ(-200px);
    opacity: 0;
}
}

@keyframes SubMenuAnimOut1 {
    0% {
    transform: translateX(0%);
    opacity: 1;
}
100% {
    transform: translateX(50%);
    opacity: 0;
}
}

@keyframes SubMenuAnimOut2 {
    0% {
    transform: translateX(0%);
    opacity: 1;
}
100% {
    transform: translateX(100%);
    opacity: 0;
}
}

@keyframes SubMenuAnimOut3 {
    0% {
    transform: translateZ(0px);
    opacity: 1;
}
100% {
    transform: translateZ(-300px);
    opacity: 0;
}
}

@keyframes SubMenuAnimOut4 {
    0% {
    transform: translateZ(0px);
    opacity: 1;
}
100% {
    transform: translateZ(300px);
    opacity: 0;
}
}

@keyframes SubMenuAnimOut5 {
    0% {
    transform: translateZ(0);
    opacity: 1;
}
100% {
    transform: translateZ(-200px);
    opacity: 0;
}
}

/* No JS Fallback */
.no-js .dl-menuwrapper .dl-menu {
    position: relative;
    opacity: 1;
    -webkit-transform: none;
    -moz-transform: none;
    transform: none;
}

.no-js .dl-menuwrapper li .dl-submenu {
    display: block;
}

.no-js .dl-menuwrapper li.dl-back {
    display: none;
}

.no-js .dl-menuwrapper li > a:not(:only-child) {
    background: rgba(0,0,0,0.1);
}

.no-js .dl-menuwrapper li > a:not(:only-child):after {
    content: '';
}

/* Colors for demos */

/* Demo 1 */
.demo-1 .dl-menuwrapper button {
    background: #c62860;
}

.demo-1 .dl-menuwrapper button:hover,
.demo-1 .dl-menuwrapper button.dl-active,
.demo-1 .dl-menuwrapper ul {
    background: #9e1847;
}

/* Demo 2 */
.demo-2 .dl-menuwrapper button {
    background: #e86814;
}

.demo-2 .dl-menuwrapper button:hover,
.demo-2 .dl-menuwrapper button.dl-active,
.demo-2 .dl-menuwrapper ul {
    background: #D35400;
}

/* Demo 3 */
.demo-3 .dl-menuwrapper button {
    background: #08cbc4;
}

.demo-3 .dl-menuwrapper button:hover,
.demo-3 .dl-menuwrapper button.dl-active,
.demo-3 .dl-menuwrapper ul {
    background: #00b4ae;
}

/* Demo 4 */
.demo-4 .dl-menuwrapper button {
    background: #90b912;
}

.demo-4 .dl-menuwrapper button:hover,
.demo-4 .dl-menuwrapper button.dl-active,
.demo-4 .dl-menuwrapper ul {
    background: #79a002;
}

/* Demo 5 */
.demo-5 .dl-menuwrapper button {
    background: #744783;
}

.demo-5 .dl-menuwrapper button:hover,
.demo-5 .dl-menuwrapper button.dl-active,
.demo-5 .dl-menuwrapper ul {
    background: #643771;
}

#block-block-5 {
   display: none;
}


