﻿
body, ul, li {
    font-size: 14px;
    font-family: Arial, Helvetica, sans-serif;
    line-height: 21px;
    text-align: left;
    font-family: 'Roboto', sans-serif;

    /*    padding-left: 20px;
    padding-right: 20px;*/
}
/*#navbarSupportedContent {
    height: 68px;
}*/
/* Navigation Bar */
#menu {
    list-style: none;
    width: 100%;
    padding-left: 0;
    /*    margin: 30px auto 0px auto;*/
    height: 68px;
    /*padding: 50px 20px 50px 15px;*/
    /* Rounded Corners */
    /*-moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;*/
    /* Background color and gradients */
    /*background: #B6381F;*/
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#B6381F), to(#B6381F));
    /*background: -moz-linear-gradient(top, #0272a7, #013953);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#B6381F), to(#B6381F));*/
    /* Borders */
    /*border: 1px solid #002232;*/
    /*-moz-box-shadow: inset 0px 0px 1px #edf9ff;
    -webkit-box-shadow: inset 0px 0px 1px #edf9ff;
    box-shadow: inset 0px 0px 1px #edf9ff;*/
    /*overflow: hidden;*/
}
    #menu .icon {
    display: none;
}

    #menu .activator {
/*        margin-top: 25px;*/
/*        border: 1px solid white;*/

    }
        #menu .activator:hover {
            background-color: #EBD89E;
            color: black;
            z-index: 9991
        }


/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 700px) {
    .activator {
        text-align: left;
        border-bottom: 2px solid white;
        background-color: #B6381F;
        width: 100%;
        color: black;
        margin-left: 0;
        z-index: 100;
        display: block;
        width: 100%
    }
    .navbar-expand-custom .navbar-toggler {
        display: block;
    }
    #menu a:not(:first-child) {
        display: none;
    }
    .btnli {
        margin-right:0;
        text-align:center
    }
    #menu a.icon {
        float: right;
        display: block;
    }
    #menu .activator {
        /*        margin-top: 25px;*/
                border: 1px solid white;
    }
}
/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 500px) {
    .activator {
        text-align: left;
        border-bottom: 2px solid white;
        background-color: #B6381F;
        width: 100%;
        color: black;
        margin-left: 0;
        z-index: 100;
        display: block;
        width: 100%
    }
    .navbar-expand-custom .navbar-toggler {
        display: block;
    }

    .btnli {
        margin-right: 0;
        text-align: center
    }
    #menu.responsive {
        position: relative;
    }

        #menu.responsive a.icon {
            position: absolute;
            right: 0;
            top: 0;
        }

        #menu.responsive a {
            float: none;
            display: block;
            text-align: left;
        }
    #menu li {
        width: 100%;
    }
        #menu li a {
            margin-left: 0px;
            text-align: left;
            padding-left: 5px;
            font-family: Arial, Helvetica, sans-serif;
            font-size: 14px;
            color: #FFF;
            display: block;
            outline: 0;
            text-decoration: none;
            width: 60px
        }

    .dropdown_1column,
    .dropdown_2columns,
    .dropdown_3columns,
    .dropdown_4columns,
    .dropdown_5columns {
        float: left;
        text-align: left;
        padding: 10px 5px 10px 5px;
        border: 1px solid #F4F4F4;
        border-top: none;
        background: #F4F4F4;
        width: 100%;

    }

    #menu li:hover .dropdown_1column,
    #menu li:hover .dropdown_2columns,
    #menu li:hover .dropdown_3columns,
    #menu li:hover .dropdown_4columns,
    #menu li:hover .dropdown_5columns {
        left: -1px;
        top: auto;
        width: 100%;
    }
}
/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 700px) {
    .navbar-expand-custom .navbar-toggler {
        display: block;
    }
    #menu .activator {
        /*        margin-top: 25px;*/
        border: 1px solid white;
    }
    #menu.responsive {
        position: relative;
    }

        #menu.responsive a.icon {
            position: absolute;
            right: 0;
            top: 0;
        }

        #menu.responsive a {
            float: none;
            display: block;
            text-align: left;
        }
    .activator {
        text-align: left;
        border-bottom: 2px solid white;
        background-color: #B6381F;
        width: 100%;
        color: black;
        margin-left: 0;
        z-index: 100;
        display: block;
        width: 100%
    }
}
    /* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width:800px) {
    .navbar-expand-custom .navbar-toggler {
        display: block;
    }
    #xxx {
        display: none
    }
    #sub1 {
        display: none
    }
    #menu {
        margin-left: 0
    }
        #menu .activator {
            /*        margin-top: 25px;*/
            border: 1px solid white;
        }
    .activator {
        text-align: left;
        border-bottom: 2px solid white;
        background-color: #B6381F;
        width: 100%;
        color: black;
        margin-left: 0;
        z-index: 100;
        display: block;
        width:100%
    }

    #5c :hover {
        background-color: grey;
        width: 100%;
        height: 50px;
    }

    #menu li a {
        margin-left: 0px;
        text-align: left;
        padding-left: 5px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 14px;
        color: #EEEEEE;
        display: block;
        outline: 0;
        text-decoration: none;
    }

    .dropdown_1column,
    .dropdown_2columns,
    .dropdown_3columns,
    .dropdown_4columns,
    .dropdown_5columns {
        float: left;
        text-align: left;
        padding: 10px 5px 10px 5px;
        border: 1px solid #F4F4F4;
        border-top: none;
        background: #F4F4F4;
        width: 100%;
    }


    #menu li:hover .dropdown_1column,
    #menu li:hover .dropdown_2columns,
    #menu li:hover .dropdown_3columns,
    #menu li:hover .dropdown_4columns,
    #menu li:hover .dropdown_5columns {
        left: -1px;
        top: auto;
        width: 100%;
    }
}

#menu li {
    float: left;
    text-align: center;
    position: relative;
    /*padding: 4px 10px 4px 10px;*/
    /*margin-right: 20px;*/
/*    margin-top: 5px;*/
    border: none;
    z-index: 100;
}

        #menu li:hover {
            /*margin-top: 26px;*/
            /*border: 35px solid #636393;*/
            padding: 4px 9px 4px 9px;
            /* Background color and gradients */
            /*background: #FADEAF;
            background: -moz-linear-gradient(top, #FADEAF, #FADEAF);
            background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FADEAF), to(#FADEAF));*/
            /* Rounded corners */
            /*-moz-border-radius: 5px 5px 0px 0px;
            -webkit-border-radius: 5px 5px 0px 0px;
            border-radius: 5px 5px 0px 0px;*/
        }

        #menu li a {
            /*margin-top:15px;*/
            font-family: Arial, Helvetica, sans-serif;
            font-size: 14px;
            color: #EEEEEE;
            display: block;
            height:60px;
            padding-top:15px;
            outline: 0;
            text-decoration: none;
            /*text-shadow: 1px 1px 1px #000;*/
            width:100%
        }

        #menu li:hover a {
            color: #333333;
            font-size: 14px;
            /*text-shadow: 1px 1px 1px #FFFFFF;*/
        }

        #menu li .drop {
            padding-right: 21px;
            background: url("img/drop.png") no-repeat right 8px;
        }

        #menu li:hover .drop {
            background: url("img/drop.png") no-repeat right 7px;
        }

/* Drop Down */

.dropdown_1column,
.dropdown_2columns,
.dropdown_3columns,
.dropdown_4columns,
.dropdown_5columns {
    margin: 4px auto;
    float: left;
    position: absolute;
    left: -999em; /* Hides the drop down */
    text-align: left;
    padding: 10px 5px 10px 5px;
    border: 1px solid #F4F4F4;
    border-top: none;
    /* Gradient background */
    background: #F4F4F4;
    /*background: -moz-linear-gradient(top, #FFF, #FFF);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFF), to(#FFF));*/
    /* Rounded Corners */
    /*-moz-border-radius: 0px 5px 5px 5px;
    -webkit-border-radius: 0px 5px 5px 5px;
    border-radius: 0px 5px 5px 5px;*/
}
.dont {
    /*padding:2px 4px 2px 4px;*/
    margin-top:0
}
.subList {
    display: block;
    background-color: #F4F4F4;
    color: black;
}
    .dropdown_1column {
    width: 140px;
}

.dropdown_2columns {
    width: 280px;
}

.dropdown_3columns {
    width: 420px;
}

.dropdown_4columns {
    width: 220px;
}

.dropdown_5columns {
    width: 272px;
}

#menu li:hover .dropdown_1column,
#menu li:hover .dropdown_2columns,
#menu li:hover .dropdown_3columns,
#menu li:hover .dropdown_4columns,
#menu li:hover .dropdown_5columns {
    left: -1px;
    top: auto;
}

/* Columns */

.col_1,
.col_2,
.col_3,
.col_4,
.col_5 {
    display: inline;
    /*float: left;*/
    text-align: center;
    position: relative;
    margin-left: 5px;
    margin-right: 5px;
}

.col_1 {
    width: 220px;
}

.col_2 {
    width: 270px;
}

.col_3 {
    width: 410px;
}

.col_4 {
    width: 100%;
    display:block;
    border-bottom:1px solid gray;
    
}
    .col_4 :hover {
        color: #B6381F;
    }
.col_5 {
    width: 690px;
}

/* Right alignment */

#menu .menu_right {
    float: right;
    margin-right: 0px;
}

#menu li .align_right {
    /* Rounded Corners */
    -moz-border-radius: 5px 0px 5px 5px;
    -webkit-border-radius: 5px 0px 5px 5px;
    border-radius: 5px 0px 5px 5px;
}

#menu li:hover .align_right {
    left: auto;
    right: -1px;
    top: auto;
}

/* Drop Down Content Stylings */

#menu p, #menu h2, #menu h3, #menu ul li {
    font-family: Arial, Helvetica, sans-serif;
    /*line-height: 15px;*/
    font-size: 12px;
    text-align: left;
    /*text-shadow: 1px 1px 1px #FFFFFF;*/
}

#menu h2 {
    font-size: 21px;
    font-weight: 400;
    letter-spacing: -1px;
    /*margin: 7px 0 14px 0;*/
    padding-left: 4px;
    /*border-bottom: 1px solid #666666;*/
}

#menu h3 {
    font-size: 14px;
    margin: 7px 0 14px 0;
    /*padding-bottom: 7px;*/
    /*border-bottom: 1px solid #888888;*/
}

#menu p {
    line-height: 18px;
    margin: 0 0 10px 0;
}
#menu li:hover div a {
    font-size: 12px;
    color: #015b86;

}

    #menu li:hover div a:hover {
        color: #029feb;
    }

.strong {
    font-weight: bold;
}

.italic {
    font-style: italic;
}

.imgshadow {
    background: #FFFFFF;
    padding: 4px;
    border: 1px solid #777777;
    margin-top: 5px;
    -moz-box-shadow: 0px 0px 5px #666666;
    -webkit-box-shadow: 0px 0px 5px #666666;
    box-shadow: 0px 0px 5px #666666;
}

.img_left { /* Image sticks to the left */
    width: auto;
    float: left;
    margin: 5px 15px 5px 5px;
}

#menu li .black_box {
    background-color: #333333;
    color: #eeeeee;
    font-size: 10px;
    text-align:center;
    /*text-shadow: 1px 1px 1px #000;*/
    padding: 4px 8px 4px 8px;
    /* Rounded Corners */
    /*-moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;*/
    /* Shadow */
    /*-webkit-box-shadow: inset 0 0 3px #000000;
    -moz-box-shadow: inset 0 0 3px #000000;
    box-shadow: inset 0 0 3px #000000;*/
}

#menu li ul {
    list-style: none;
    padding: 0;
    margin: 0 0 12px 0;
}

    #menu li ul li {
        font-size: 12px;
        line-height: 24px;
        position: relative;
        /*text-shadow: 1px 1px 1px #ffffff;*/
        padding: 0;
        margin: 0;
        float: none;
        text-align: left;
        width: 130px;

    }

        #menu li ul li:hover {
            background: none;
            border: none;
            padding: 0;
            margin: 0;
        }

#menu li .greybox li {
    background: #F4F4F4;
    border: 1px solid #bbbbbb;
    margin: 0px 0px 4px 0px;
    padding: 4px 6px 4px 6px;
    width: 116px;
    /* Rounded Corners */
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

    #menu li .greybox li:hover {
        background: #ffffff;
        border: 1px solid #aaaaaa;
        padding: 4px 6px 4px 6px;
        margin: 0px 0px 4px 0px;
    }



.btnBackToTop {
    background: none;
    margin: 0;
    position: fixed;
    bottom: 0;
    right: 0;
    width: 70px;
    height: 70px;
    z-index: 100;
    display: inline;
    text-decoration: none;
    cursor: pointer;
}

    .btnBackToTop i {
        font-size: 60px;
        color: #c7c7c7;
    }

        .btnBackToTop i:hover {
            color: #e0e0e0;
        }

.footerUp {
    padding-bottom: 26px;
    /*background: #6f6f6f;*/
    background-color: white;
}

.footerDown {
    background: black;
}

    .footerDown p {
        margin: 16px 0px;
    }

.wrapper {
    display: -webkit-box;
    display: flex;
    min-height: 100%;
    height: 100vh;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
}

.content {
    -webkit-box-flex: 1;
    flex: 1 0 auto;
    margin-bottom: 40px;
}

footer {
    flex: none;
    color: white;
}

    footer a {
        color: #cecaca;
    }

        footer a:hover,
        footer a:focus {
            color: #fff;
        }

    footer h4 {
        margin-top: 32px;
        border-bottom:1px solid white
    }
.liTest{
    text-align:left;
    margin-left:70px
}
.dddl {
    color: white
}
.dddl:hover{
    border:none;
    color:goldenrod
}


