.sky-mega-menu,.sky-mega-menu * {
    margin: 0;
    padding: 0;
    outline: 0;
    border: 0;
    background: 0 0
}

.sky-mega-menu li a img {
    border-radius: 50px
}

.sky-mega-menu {
    font-family: Roboto,sans-serif;
    font-size: 14px;
    font-weight: 400
}

.sky-mega-menu {
    position: relative;
    z-index: 10;
    background: rgba(255,255,255,.9);
    font-size: 0;
    line-height: 0;
    text-align: right;
    border: 1px solid #d2d2d2;
    background: #fff;
    width: 100%;
    max-width: 336px;
    border-radius: 10px 10px 0 0;
    overflow: hidden
}

.sky-mega-menu:after {
    content: '';
    display: table;
    clear: both
}

.sky-mega-menu li {
    position: relative;
    display: inline-block;
    float: left;
    border-style: solid;
    border-color: rgba(0,0,0,.1);
    border-right-width: 1px;
    font-size: 13px;
    line-height: 45px;
    text-align: left;
    white-space: nowrap
}

li.list-product {
    background: var(--color-red);
    padding: 19px 12px;
    color: #fff;
    font-family: Roboto;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: normal
}

li.list-product svg {
    margin-right: 10px
}

.sky-mega-menu>li>a {
    box-shadow: 0 -6px 12px -8px #8f1920 inset
}

.sky-mega-menu li a {
    display: block;
    padding: 8px 8px;
    text-decoration: none;
    color: #666;
    transition: background .4s,color .4s;
    -o-transition: background .4s,color .4s;
    -ms-transition: background .4s,color .4s;
    -moz-transition: background .4s,color .4s;
    -webkit-transition: background .4s,color .4s;
    color: #333;
    font-family: rm;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    position: relative;
    transition: all .3s ease-in-out
}

li.list-product {
    background: #8f1920;
    padding: 19px 12px;
    color: #fff;
    font-family: rb;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: normal
}

li.list-product svg {
    margin-right: 10px
}

.sky-mega-menu li>div:after {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 0;
    width: 100%;
    height: 8px;
    background: 0 0
}

.sky-mega-menu li>div:before {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 24px;
    border-right: 5px solid transparent;
    border-bottom: 5px solid rgba(255,255,255,.9);
    border-left: 5px solid transparent
}

.sky-mega-menu li.current>a,.sky-mega-menu li:hover>a {
    background: var(--color-yellow)
}

.sky-mega-menu .right {
    float: none;
    border-right-width: 0;
    border-left-width: 1px
}

.sky-mega-menu .right>div {
    -o-transform-origin-x: 100%;
    -ms-transform-origin-x: 100%;
    -moz-transform-origin-x: 100%;
    -webkit-transform-origin-x: 100%
}

.sky-mega-menu .right:hover>div {
    right: 0;
    left: auto
}

.sky-mega-menu .right:hover>div:before {
    right: 24px;
    left: auto
}

.sky-mega-menu .switcher {
    display: none
}

.sky-mega-menu li li {
    display: block;
    float: none;
    border-width: 0;
    border-top-width: 1px;
    line-height: 21px;
    white-space: normal
}

.sky-mega-menu li li:first-child {
    border-top: 0
}

.sky-mega-menu li li a {
    padding-top: 16px;
    padding-bottom: 16px;
    min-height: 60px;
    font-family: rr
}

.sky-mega-menu li li>div {
    top: 0;
    margin: 0 0 0 8px
}

.sky-mega-menu li li>div:after {
    top: 0;
    right: 100%;
    bottom: auto;
    left: auto;
    width: 8px;
    height: 100%
}

.sky-mega-menu li li>div:before {
    top: 22px;
    right: 100%;
    bottom: auto;
    left: auto;
    border-top: 5px solid transparent;
    border-right: 5px solid rgba(255,255,255,.9);
    border-bottom: 5px solid transparent
}

.sky-mega-menu li li:hover>div {
    left: 100%
}

.sky-mega-menu .right li>div {
    margin: 0 8px 0 0;
    -o-transform-origin-x: 100%;
    -ms-transform-origin-x: 100%;
    -moz-transform-origin-x: 100%;
    -webkit-transform-origin-x: 100%
}

.sky-mega-menu .right li>div:after {
    right: auto;
    left: 100%
}

.sky-mega-menu .right li>div:before {
    right: auto;
    left: 100%;
    border-right: none;
    border-left: 5px solid rgba(255,255,255,.9)
}

.sky-mega-menu .right li:hover>div {
    right: 100%;
    left: auto
}

.sky-mega-menu-fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%
}

.sky-mega-menu-pos-bottom li>div {
    top: auto;
    bottom: 100%;
    margin: 0 0 8px;
    -o-transform-origin-y: 100%;
    -ms-transform-origin-y: 100%;
    -moz-transform-origin-y: 100%;
    -webkit-transform-origin-y: 100%
}

.sky-mega-menu-pos-bottom li>div:after {
    top: 100%;
    bottom: auto
}

.sky-mega-menu-pos-bottom li>div:before {
    top: 100%;
    bottom: auto;
    border-top: 5px solid rgba(255,255,255,.9);
    border-right: 5px solid transparent;
    border-bottom: none;
    border-left: 5px solid transparent
}

.sky-mega-menu-pos-bottom li li>div {
    top: auto;
    bottom: 0
}

.sky-mega-menu-pos-bottom li li>div:before {
    top: auto;
    bottom: 22px
}

.sky-mega-menu-pos-bottom.sky-mega-menu-fixed {
    top: auto;
    bottom: 0
}

.sky-mega-menu-pos-left li,.sky-mega-menu-pos-right li {
    display: block;
    float: none;
    border-width: 0;
    position: relative
}

.sky-mega-menu-pos-left li a::after {
    padding-right: 9px;
    vertical-align: middle;
    content: "\f101";
    font-family: FontAwesome;
    position: absolute;
    right: 0
}

.sky-mega-menu li a::before {
    position: absolute;
    content: "";
    background: #f97b00;
    height: 100%;
    width: 0%;
    transition: all .3s ease-in-out;
    left: 0;
    top: 0;
    z-index: -1
}

.sky-mega-menu>li a:hover::before {
    width: 100%
}

.sky-mega-menu>li a:hover {
    color: #fff
}

.sky-mega-menu-pos-left li:first-child,.sky-mega-menu-pos-right li:first-child {
    border-top: 0
}

.sky-mega-menu-pos-left li>div,.sky-mega-menu-pos-right li>div {
    top: 0
}

.sky-mega-menu-pos-left li>div {
    margin: 0 0 0 8px
}

.sky-mega-menu-pos-right li>div {
    margin: 0 8px 0 0;
    -o-transform-origin-x: 100%;
    -ms-transform-origin-x: 100%;
    -moz-transform-origin-x: 100%;
    -webkit-transform-origin-x: 100%
}

.sky-mega-menu-pos-left li>div:after,.sky-mega-menu-pos-right li>div:after {
    top: 0;
    bottom: auto;
    width: 8px;
    height: 100%
}

.sky-mega-menu-pos-left li>div:after {
    right: 100%;
    left: auto
}

.sky-mega-menu-pos-right li>div:after {
    right: auto;
    left: 100%
}

.sky-mega-menu-pos-left li>div:before,.sky-mega-menu-pos-right li>div:before {
    top: 22px;
    bottom: auto;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent
}

.sky-mega-menu-pos-left li>div:before {
    right: 100%;
    left: auto;
    border-right: 5px solid rgba(255,255,255,.9)
}

.sky-mega-menu-pos-right li>div:before {
    right: auto;
    left: 100%;
    border-left: 5px solid rgba(255,255,255,.9)
}

.sky-mega-menu-pos-right li:hover>div {
    right: 100%;
    left: auto
}

.sky-mega-menu-pos-left .bottom>div,.sky-mega-menu-pos-right .bottom>div {
    top: auto;
    bottom: 0;
    -o-transform-origin-y: 100%;
    -ms-transform-origin-y: 100%;
    -moz-transform-origin-y: 100%;
    -webkit-transform-origin-y: 100%
}

.sky-mega-menu-pos-left .bottom>div:before,.sky-mega-menu-pos-right .bottom>div:before {
    top: auto;
    bottom: 22px
}

.sky-mega-menu-pos-right li li>div {
    margin: 0 8px 0 0;
    -o-transform-origin-x: 100%;
    -ms-transform-origin-x: 100%;
    -moz-transform-origin-x: 100%;
    -webkit-transform-origin-x: 100%
}

.sky-mega-menu-pos-right li li>div:after {
    right: auto;
    left: 100%
}

.sky-mega-menu-pos-right li li>div:before {
    right: auto;
    left: 100%;
    border-right: none;
    border-left: 5px solid rgba(255,255,255,.9)
}

.sky-mega-menu-pos-right li li:hover>div {
    right: 100%;
    left: auto
}

.sky-mega-menu-pos-left.sky-mega-menu-fixed {
    top: 0;
    right: auto;
    bottom: 0;
    left: 0;
    width: auto
}

.sky-mega-menu-pos-right.sky-mega-menu-fixed {
    top: 0;
    right: 0;
    bottom: 0;
    left: auto;
    width: auto
}

.sky-mega-menu-anim-slide li>div {
    -o-transform: translate(0,60px);
    -ms-transform: translate(0,60px);
    -moz-transform: translate(0,60px);
    -webkit-transform: translate(0,60px)
}

.sky-mega-menu-pos-bottom.sky-mega-menu-anim-slide li>div {
    -o-transform: translate(0,-60px);
    -ms-transform: translate(0,-60px);
    -moz-transform: translate(0,-60px);
    -webkit-transform: translate(0,-60px)
}

.sky-mega-menu-anim-slide li:hover>div {
    -o-transform: translate(0,0);
    -ms-transform: translate(0,0);
    -moz-transform: translate(0,0);
    -webkit-transform: translate(0,0)
}

.sky-mega-menu-anim-scale li:hover>div {
    -o-transform: scale(1,1);
    -ms-transform: scale(1,1);
    -moz-transform: scale(1,1);
    -webkit-transform: scale(1,1)
}

.sky-mega-menu-anim-flip {
    perspective: 2000px;
    -o-perspective: 2000px;
    -moz-perspective: 2000px;
    -webkit-perspective: 2000px
}

.sky-mega-menu-anim-flip li>div {
    transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    transform: rotateX(-75deg);
    -o-transform: rotateX(-75deg);
    -moz-transform: rotateX(-75deg);
    -webkit-transform: rotateX(-75deg)
}

.sky-mega-menu-anim-flip li:hover>div {
    transform: rotateX(0);
    -o-transform: rotateX(0);
    -moz-transform: rotateX(0);
    -webkit-transform: rotateX(0)
}

.sky-mega-menu .grid-column {
    float: left;
    border-color: #d9d9d9;
    border-left-width: 1px;
    border-left-style: solid
}

.sky-mega-menu .grid-column:first-child {
    margin-left: 0;
    border-left: 0
}

.sky-mega-menu .grid-column2,.sky-mega-menu .grid-container2 {
    width: 155px
}

.sky-mega-menu .grid-column3,.sky-mega-menu .grid-container3 {
    width: 100%;
    position: relative;
    margin: 0!important
}

.grid-container3 ul li a::after {
    display: none
}

.sky-mega-menu .grid-column4,.sky-mega-menu .grid-container4 {
    width: 311px
}

.sky-mega-menu .grid-column5,.sky-mega-menu .grid-container5 {
    width: 389px
}

.sky-mega-menu .grid-column6,.sky-mega-menu .grid-container6 {
    width: 467px
}

.sky-mega-menu .grid-column7,.sky-mega-menu .grid-container7 {
    width: 545px
}

.sky-mega-menu .grid-column8,.sky-mega-menu .grid-container8 {
    width: 623px
}

.sky-mega-menu .grid-column9,.sky-mega-menu .grid-container9 {
    width: 701px
}

.sky-mega-menu .grid-column10,.sky-mega-menu .grid-container10 {
    width: 779px
}

.sky-mega-menu .grid-column11,.sky-mega-menu .grid-container11 {
    width: 857px
}

.sky-mega-menu .grid-column12,.sky-mega-menu .grid-container12 {
    width: 935px
}

.sky-mega-menu li a>.fa {
    display: block;
    float: left;
    width: 16px;
    margin: 0 10px 0 -4px;
    font-size: 16px;
    line-height: inherit;
    text-align: center
}

.sky-mega-menu li a>.fa-single {
    float: none;
    margin: 0
}

.sky-mega-menu li a>.fa-indicator {
    position: relative;
    top: -1px;
    float: none;
    display: inline-block;
    vertical-align: middle;
    width: auto;
    margin: 0 -10px 0 10px;
    font-size: 9px;
    line-height: 1;
    text-align: right
}

.sky-mega-menu li li a>.fa-indicator {
    top: 0;
    float: right;
    display: block;
    line-height: inherit
}

.sky-mega-menu form fieldset {
    display: block;
    padding: 25px 30px
}

.sky-mega-menu form fieldset+fieldset {
    border-top: 1px solid rgba(0,0,0,.1)
}

.sky-mega-menu form section {
    margin-bottom: 20px
}

.sky-mega-menu form .button,.sky-mega-menu form .checkbox,.sky-mega-menu form .input,.sky-mega-menu form .radio,.sky-mega-menu form .textarea {
    position: relative;
    display: block
}

.sky-mega-menu form .input input,.sky-mega-menu form .textarea textarea {
    display: block;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%;
    height: 39px;
    padding: 8px 10px;
    outline: 0;
    border: 2px solid #e5e5e5;
    border-radius: 0;
    background: #fff;
    font: 13px/19px 'Open Sans',Helvetica,Arial,sans-serif;
    color: #404040;
    appearance: normal;
    -moz-appearance: none;
    -webkit-appearance: none;
    transition: border-color .3s;
    -o-transition: border-color .3s;
    -ms-transition: border-color .3s;
    -moz-transition: border-color .3s;
    -webkit-transition: border-color .3s
}

.sky-mega-menu form .textarea textarea {
    height: auto;
    resize: none
}

.sky-mega-menu form .button {
    float: right;
    height: 39px;
    overflow: hidden;
    margin-left: 20px;
    padding: 0 20px;
    outline: 0;
    border: 0;
    background-color: #2da5da;
    font: 300 13px/39px 'Open Sans',Helvetica,Arial,sans-serif;
    text-decoration: none;
    color: #fff;
    cursor: pointer;
    opacity: .8;
    transition: opacity .2s;
    -o-transition: opacity .2s;
    -ms-transition: opacity .2s;
    -moz-transition: opacity .2s;
    -webkit-transition: opacity .2s
}

.sky-mega-menu form .fa-append {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 29px;
    height: 29px;
    padding-left: 3px;
    border-left: 1px solid #e5e5e5;
    font-size: 15px;
    line-height: 29px;
    text-align: center;
    color: #ccc
}

.sky-mega-menu form .input .fa-append+input,.sky-mega-menu form .textarea .fa-append+textarea {
    padding-right: 46px
}

.sky-mega-menu form .row {
    margin: 0 -15px
}

.sky-mega-menu form .row:after {
    content: '';
    display: table;
    clear: both
}

.sky-mega-menu form .col {
    float: left;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    box-sizing: border-box;
    -moz-box-sizing: border-box
}

.sky-mega-menu form .col-6 {
    width: 50%
}

.sky-mega-menu form .checkbox:hover i,.sky-mega-menu form .input:hover input,.sky-mega-menu form .textarea:hover textarea {
    border-color: #8dc9e5
}

.sky-mega-menu form .button:hover {
    opacity: 1
}

.sky-mega-menu form .checkbox input:focus+i,.sky-mega-menu form .input input:focus,.sky-mega-menu form .textarea textarea:focus {
    border-color: #2da5da
}

.sky-mega-menu .search {
    border-left: 0
}

.sky-mega-menu .search .input {
    margin: 3px 3px 3px 3px
}

.sky-mega-menu .search .input input {
    width: 240px;
    padding-right: 65px
}

.sky-mega-menu .search .button {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0
}
