﻿.main-nav-rev-sublayout {
    height: 40px;
    z-index: 10;
}

.mobile-menu-sublayout {
    display: none;
}

.main-nav-rev-sublayout ul {
    height: 40px;
    margin: 0;
    white-space: nowrap;
    font-size: 1px;
    right: 0;
}

.main-nav-rev-ul {
    float: right;
    right: 0;
}

.main-nav-rev-sublayout ul li {
    /*position: relative;*/
    display: block;
    float: left;
    height: 40px;
    margin: 0px;
    /*margin: 0 0 0 20px;*/
}

.main-nav-rev-sublayout .nav-overlay {
    padding: 15px 5px;
}

.main-nav-rev-sublayout .gradient-blue-bottom {
    width: 100%;
    height: 20px;
    background-color: #00c0f2;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 10;
}

.main-nav-rev-sublayout ul li.main-nav-rev-item-active a {
    box-shadow: 0px -1px 1px 1px rgba(0, 0, 0, 0.25);
    height: 50px;
    background: #FFF;
}

.main-nav-rev-sublayout ul li a {
    display: block;
    font-size: 13px;
    font-weight: 600; /* Bold. */
    color: #636467;
    line-height: 40px;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
    margin-right: 1px;
    padding: 0 10px;
}

    .main-nav-rev-sublayout ul li a.current {
        color: #00a4df;
    }

    .main-nav-rev-sublayout ul li a.currentwork{
        color:#6CA43E;
    }

.main-nav-rev-sublayout ul li ul {
    width: auto;
    height: 250px;
    position: absolute;
    overflow: hidden;
    background: #fff;
    float: left;
    border-left: 1px solid rgba(0,0,0,0.35);
    border-right: 1px solid rgba(0,0,0,0.35);
    box-sizing: border-box;
    padding-left: 24px;
    padding-right: 24px;
}

    .main-nav-rev-sublayout ul li ul li {
        float: left;
        height: 250px;
        width: 240px;
        margin: 0;
        padding-right: 10px;
    }

        .main-nav-rev-sublayout ul li ul li .black-border-right {
            height: 200px;
            border-right: 1px solid rgba(0, 0, 0, 0.55);
        }

        .main-nav-rev-sublayout ul li ul li:last-of-type .black-border-right {
            height: 200px;
            border-right: none;
        }

        .main-nav-rev-sublayout ul li ul li a {
            padding: 4px 10px;
            font-size: 13px;
            font-weight: 600; /* Bold. */
            line-height: normal;
            color: white;
        }

            .main-nav-rev-sublayout ul li ul li a:hover {
                /*background: #ddd;*/
                text-decoration: underline;
                text-decoration-color: #00c0f2;
                color: white;
            }

        .main-nav-rev-sublayout ul li ul li p {
            padding: 4px 10px;
            font-size: 13px;
            font-weight: 600; /* Bold. */
            line-height: normal;
            color: white;
            margin: 0px;
            text-transform: uppercase;
        }

.main-nav-rev-sublayout ul li.main-nav-rev-item-active ul li a {
    color: #00c0f2;
    box-shadow: none;
    font-size: 13px;
    padding: 0px 2px 10px 0px;
    height: auto;
}

.main-nav-rev-sublayout ul li.main-nav-rev-item-active ul li p {
    color: #00c0f2;
    box-shadow: none;
    font-size: 13px;
    padding: 0px 2px 10px 0px;
    height: auto;
    margin: 0px;
    text-transform: uppercase;
}

.main-nav-rev-sublayout ul li ul li ul {
    width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
    background: #fff;
    box-shadow: none;
    border: none;
    box-sizing: border-box;
    -moz-column-count: 1;
    -webkit-column-count: 1;
    column-count: 1;
    padding: 0px;
}

    .main-nav-rev-sublayout ul li ul li ul li {
        float: none;
        height: auto;
        width: inherit;
        margin: 0;
        padding: 0px;
    }

        .main-nav-rev-sublayout ul li ul li ul li a {
            padding: 1px 0px;
            font-size: 13px;
            font-weight: 600; /* Bold. */
            line-height: normal;
            color: white;
            text-transform: none;
        }

.main-nav-rev-sublayout ul li.main-nav-rev-item-active ul li ul li a {
    color: #636467;
    box-shadow: none;
    font-size: 13px;
    padding: 1px 0px;
    height: auto;
    line-height: 16px;
}

    .main-nav-rev-sublayout ul li.main-nav-rev-item-active ul li ul li a:hover {
        color: #00c0df;
    }

.main-nav-rev-sublayout ul li ul li.nav-inset a {
    padding: 3px 10px 3px 15px;
    font-size: 11px;
    font-weight: 400; /* Regular. */
}

.main-nav-rev-sublayout ul li ul li > div {
    float: none;
    height: auto;
    width: inherit;
    margin: 0;
    padding: 0px;
}

/* #Media Queries
================================================== */

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 1024px) {
    .main-nav-rev-sublayout ul li {
        /*margin: 0 15px 0 0;*/
        margin: 0px;
        padding: 0px;
    }

    #main-nav-rev-promotion {
        width: 75%;
    }

    .main-nav-rev-sublayout ul li ul li {
        width: auto;
    }

        .main-nav-rev-sublayout ul li ul li ul li {
            width: auto;
            padding: 0 5px 0 0;
        }
}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
    .main-nav-rev-sublayout ul li {
        /*margin: 0 15px 0 0;*/
        margin: 0px;
        padding: 0px;
    }

        .main-nav-rev-sublayout ul li a {
            font-size: 13px;
            font-weight: 600; /* Semi-bold. */
        }

        /*.main-nav-rev-sublayout ul li:last-child ul {
			left: -80px;
		}*/
        .main-nav-rev-sublayout ul li ul li {
            width: auto;
        }

        .main-nav-rev-sublayout ul li.main-nav-rev-item-active ul li ul li a {
            font-size: 12px;
        }
}

/* All Mobile Sizes to Tablet Portrait (devices and browsers) */
@media only screen and (max-width: 767px) {
    .mobile-menu-sublayout {
    display: block;
}
    .main-nav-rev-sublayout {
        display: none;
    }

    .mobile-menu-sublayout {
        height: auto;
        background-color: #FFFFFF;
        z-index: 10;
    }

        .mobile-menu-sublayout .nav-mobile-menu {
            display: block;
            height: 40px;
            top: 0px;
            position: absolute;
            z-index: 10;
            width:100%;
        }

        

       .nav-mobile-menu a {
            display: block;
            height: 40px;
            padding-left: 46px;
            font-size: 16px;
            font-weight: 600;
            color: #FFF;
            line-height: 40px;
            text-decoration: none;
            text-transform: uppercase;
            position: absolute;
            background: url( '/assets/images/global/menu-icon.jpg' ) left top no-repeat;
            z-index:10;
        }

        .mobile-menu-sublayout .mobile-phone-num {
            display: block;
            position: relative;
            background: #00C0F2;
            text-align: center;
            padding-top: 10px 0;
        }

            .mobile-menu-sublayout .mobile-phone-num a {
                color: #FFF;
                font-size: 16px;
                position:relative;        
                background:none;
                padding-left:0;
            }
                .mobile-menu-sublayout .mobile-phone-num a:hover {
                text-decoration:underline;
                }
        .mobile-menu-sublayout .nav-mobile-closed {
            display: none;
        }

   .mobile-menu-sublayout .mobile-menu-ul {
        position: relative;
        width: 100%;
    }

    .mobile-menu-sublayout ul {
        height: auto;
        padding: 0 0 5px 0;
        width: 100%;
        background-color: #333;
        position: relative;
        top: 40px;
    }

        .mobile-menu-sublayout ul li {
            float: none;
            height: auto;
            margin: 0;
            padding-top: 2px;
            display: block;
        }

            .mobile-menu-sublayout ul li p {
           padding: 0 10px;
    background: #414141;
    color: #FFF;
    width: 100%;
    font-weight: 600;
    font-size: 14px;
    margin: 0;
    text-transform: uppercase;
    line-height: 48px;
            }

                /*.mobile-menu-sublayout ul li p:hover {
                    background: #00c0F2;
                }*/

    .mobile-menu-sublayout ul li ul {       
        top: 0;
        margin:0;
    }

        .mobile-menu-sublayout ul li ul li {
            padding: 0;
        }

            .mobile-menu-sublayout ul li ul li a, .mobile-menu-sublayout ul li ul li p {
                background: #333;
                color: #FFF;
            padding: 0 25px;
            font-size:14px;
            color: #FFF;
            height:auto;
            position: relative;
            }

               .mobile-menu-sublayout ul li ul li a:hover, .mobile-menu-sublayout ul li ul li p:hover {
                    background: #00c0F2;
                }
}