/* iframe { position: fixed; width: 100%; height: 100vh; border: 0; z-index: 0; } #trigger { position: fixed; background: red; padding: 10px 20px; border-radius: 100px; color: white; z-index: 1009; bottom: 50%; transform: translateY(-50%); left: 10px; display: block; } */
.opened .page-content { right: 0px !important; -webkit-transition: none; transition: none; }

.opened .page-content::before { z-index: 0 !important; display: none !important; }

body.opened #hubspot-messages-iframe-container { z-index: 0 !important; }

#menu-full { z-index: 1001; position: fixed; width: 100%; height: 100%; min-height: 100vh; padding: 10px; top: 0; left: 0; -webkit-box-sizing: border-box; box-sizing: border-box; font-family: 'Montserrat', sans-serif; color: white; overflow-y: auto; display: block; opacity: 0; visibility: hidden; background-color: #222222; }

@media (min-width: 768px) { #menu-full { background-color: transparent; overflow: hidden; } }

#menu-full::before { content: ""; z-index: 999; position: absolute; width: 100%; height: 100%; min-height: 100vh; top: 0; left: 0; display: block; background: -webkit-gradient(linear, left top, left bottom, from(#222222), to(rgba(34, 34, 34, 0.9))); background: linear-gradient(to bottom, #222222 0%, rgba(34, 34, 34, 0.9) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#222222',endColorstr='#e6222222',GradientType=0); visibility: hidden; opacity: 0; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; }

body.opened #menu-full { opacity: 1; visibility: visible; }

body.opened #menu-full::before { opacity: 1; visibility: visible; }

body.opened #menu-full #promo { opacity: 1; visibility: visible; -webkit-transition-delay: 2s; transition-delay: 2s; }

@media (min-width: 576px) { body.opened #menu-full #promo { right: 20px; } }

body.opened #menu-full .header .logo { margin-top: 10px; opacity: 1; visibility: visible; }

body.opened #menu-full .header .slogan { margin-top: 20px; opacity: 1; visibility: visible; }

body.opened #menu-full .header .hr { width: 100%; opacity: 1; visibility: visible; }

body.opened #menu-full .the-menu .menu-col-1, body.opened #menu-full .the-menu .menu-col-2, body.opened #menu-full .the-menu .menu-col-3, body.opened #menu-full .the-menu .menu-col-4 { opacity: 1; margin-top: 0; -webkit-transition: all 0.4s ease-in; transition: all 0.4s ease-in; }

@media (min-width: 576px) { body.opened #menu-full .the-menu .menu-col-1 { -webkit-transition-delay: 0.5s; transition-delay: 0.5s; } }

@media (min-width: 576px) { body.opened #menu-full .the-menu .menu-col-2 { -webkit-transition-delay: 0.6s; transition-delay: 0.6s; } }

@media (min-width: 576px) { body.opened #menu-full .the-menu .menu-col-3 { -webkit-transition-delay: 0.7s; transition-delay: 0.7s; } }

@media (min-width: 576px) { body.opened #menu-full .the-menu .menu-col-4 { -webkit-transition-delay: 0.8s; transition-delay: 0.8s; } }

#menu-full .close-menu { position: relative; color: white; background-color: transparent; opacity: 1; display: block; cursor: pointer; text-align: center; vertical-align: middle; padding: 4px 4px 4px 10px; -webkit-box-sizing: border-box; box-sizing: border-box; border-radius: 3px; text-align: right; margin-bottom: 10px; font-size: 0.8125em; }

@media (min-width: 576px) { #menu-full .close-menu { text-align: center; right: 10px; position: absolute; margin-bottom: 0px; } }

#menu-full .close-menu:hover { background-color: rgba(0, 0, 0, 0.9); }

#menu-full .close-menu i.mdi { font-size: 24px; vertical-align: middle; line-height: 30px; }

#menu-full .header { z-index: 1001; position: relative; text-align: center; margin-bottom: 20px; }

#menu-full .header .logo { width: 200px; margin: 20px auto 20px auto; opacity: 0; visibility: hidden; -webkit-transition: all 0.4s ease-in; transition: all 0.4s ease-in; }

#menu-full .header .slogan { margin-top: 20px; opacity: 0; visibility: hidden; -webkit-transition: all 0.4s ease-in; transition: all 0.4s ease-in; }

#menu-full .header .slogan strong { color: #0FB3AF; }

#menu-full .header .hr { display: block; width: 0%; height: 1px; background-color: #0FB3AF; margin: 20px auto; position: relative; opacity: 0; visibility: hidden; -webkit-transition: all 1s ease-in; transition: all 1s ease-in; }

#menu-full .header .hr::before { background-color: #0FB3AF; position: absolute; content: ""; display: block; width: 20px; height: 4px; bottom: -4px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }

#menu-full .the-menu { z-index: 1001; position: relative; }

#menu-full .the-menu .row .menu-col-1, #menu-full .the-menu .row .menu-col-2, #menu-full .the-menu .row .menu-col-3, #menu-full .the-menu .row .menu-col-4 { opacity: 0; -webkit-transition: all 0s ease-in; transition: all 0s ease-in; }

@media (min-width: 576px) { #menu-full .the-menu .row .menu-col-1, #menu-full .the-menu .row .menu-col-2, #menu-full .the-menu .row .menu-col-3, #menu-full .the-menu .row .menu-col-4 { margin-top: 40px; } }

#menu-full .the-menu h3 { font-size: 20px; margin-bottom: 20px; margin-top: 0px; }

#menu-full .the-menu a { color: inherit; cursor: pointer; -webkit-transition: all 0.2s; transition: all 0.2s; }

#menu-full .the-menu a:hover { color: #0FB3AF; text-decoration: none; }

#menu-full .the-menu ul { color: #777; list-style: none; padding: 0px; margin: 0px 0px 0px 14px; -webkit-transition: all 0.2s; transition: all 0.2s; }

@media (min-width: 576px) { #menu-full .the-menu ul { margin: 0px; } }

#menu-full .the-menu ul:hover { color: #a7a7a7; }

#menu-full .the-menu ul:hover > li { color: #a7a7a7; }

#menu-full .the-menu ul:hover > li ul > li { color: #a7a7a7; }

#menu-full .the-menu ul > li { font-weight: 600; font-size: 15px; margin-bottom: 20px; position: relative; }

#menu-full .the-menu ul > li a { -webkit-transition: all 0.2s ease; transition: all 0.2s ease; }

#menu-full .the-menu ul > li a:hover { padding-left: 5px; color: white; }

#menu-full .the-menu ul > li i.mdi { display: inline-block; margin-left: -28px; margin-right: 10px; top: auto; font-size: 18px; line-height: 1; vertical-align: middle; }

#menu-full .the-menu ul > li i.mdi.mdi-star { color: #ccac00; }

#menu-full .the-menu ul > li i.mdi.mdi-star + a { color: #ccac00; }

#menu-full .the-menu ul > li i.mdi.mdi-star + a:hover { color: gold; }

#menu-full .the-menu ul > li > ul { list-style: none; padding: 0px; margin: 10px 0px 20px 2px; }

#menu-full .the-menu ul > li > ul > li { font-size: 14px; font-weight: 400; padding: 2px 0px; margin: 0px; }

#menu-full .the-menu ul > li > ul > li i.mdi { font-size: 16px; }

#menu-full #promo { z-index: 1000; width: 100%; max-width: 320px; height: auto; border: none; background-color: rgba(0, 0, 0, 0.85); -webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); border-radius: 4px; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 20px; bottom: 20px; margin-top: 20px; margin-bottom: 20px; opacity: 0; visibility: hidden; -webkit-transition: all 849ms cubic-bezier(0.74, 0.215, 0.125, 1.02) 0.06s, all 849ms cubic-bezier(0.74, 0.215, 0.125, 1.02); transition: all 849ms cubic-bezier(0.74, 0.215, 0.125, 1.02) 0.06s, all 849ms cubic-bezier(0.74, 0.215, 0.125, 1.02); -webkit-transition-delay: 0s; transition-delay: 0s; }

@media (min-width: 768px) { #menu-full #promo { position: absolute; width: 320px; display: block; right: -320px; } }

#menu-full #promo h4 { font-size: 15px; }
