/*   This style sheet is used for both #header--large and #header--lvl2
changes to the lvl2.css are done on the corresponding css  */

/*SECTION*/
* {
    box-sizing: border-box;
}

#header--large .uk-section {
    height: 140px;
}
#header--large .uk-section-small {
    padding-top: 106px;
}

#header--large .uk-section .uk-sticky{
    border-bottom:5px solid #b1b3b3;
}

/************************    NAVBAR    ******************************/
#header--large .uk-navbar {
    width: 100%;
    background-color: #0033a0;
}

#header--large .uk-navbar-sticky {
    width: 100%;
    background-color: #0033a0;
}

#header--large .uk-navbar-left ul{
    padding-left:0px;
    width: 100%;

}
#header--large .uk-navbar-right ul{
    padding-right:0px;
    width: 100%;
}

#header--large a.droplink:hover {
    text-decoration: underline;
}
#header--large .uk-navbar-dropdown-nav>li{
    line-height: 14px;
  }

#header--large .uk-navbar-dropdown-nav>li>a {
    color: #000;
    font-size: 16px;
    font-weight: 500;
}

#header--large .uk-navbar-dropdown-nav>li>a:hover {
    text-decoration: underline;
    color: #0033a0;
}

#header--large .uk-navbar-dropdown-nav .uk-nav-header {
  color: #0033a0;
  font-weight: 700;
  font-size: 1.1em;
}

/********************    LOGO WITH TRIANGLE    ************************/

/*#header--large .uk-logo-hcc {
    position: relative;
    width: 100%;
    height: 100%;
}*/
#header--large .hcclogo--img {
    margin-top: -20px;
    z-index:6;
}

#header--large #hcclogo--lg {
    z-index:2;
}
#header--large .logoTriangle{
    width: 0;
    height: 0;
    border-right: 120px solid transparent;
    border-left: 120px solid transparent;
    border-top: 38px solid #b1b3b3;
    margin: auto;
    margin-top: 80px;
    position:sticky;
    z-index: 5;
    /* margin-left:100px; */
}

#header--large .logoBorder{
    width: 0;
    height: 0;
    border-right: 120px solid transparent;
    border-left: 120px solid transparent;
    border-top: 38px solid #0033a0;
    position:absolute;
    margin: auto;
    left:-119px;
    margin-top: -43px;
    z-index:2;
}

#header--large .uk-dropdown {
    z-index: 0;
    background-color: rgba(255, 255, 255, .9);
    padding: 35px 25px 25px 0px;
}

#header--large .search-header-large{
    position:absolute;
    top:20px;
    right:50px;
}

#header--large .search-header-large input{
   padding: 0px;
   padding-left: 10px;
   color: #fff;
}



[class*='uk-dropdown-bottom'] {
    margin-top: 5px;
}

.uk-sticky[class*='uk-animation-'] {
     -webkit-animation-duration: 0.0s;
     animation-duration: 0.0s;
}

.uk-sticky.uk-animation-reverse {
     -webkit-animation-duration: 0.0s;
     animation-duration: 0.0s;
}

#header--large .uk-button-hcchome {
    border: 0px;
    display: block;
    border-bottom: 5px solid #b1b3b3;
    background-color: #0033a0;
    color: #ffffff;
    margin-bottom: -5px;
    padding-right: 20px;
}

#header--large .uk-button-hcchome:hover {
    display: block;
    background: white;
    color: #0033a0;
    border-bottom: 5px solid white;
    padding-right: 20px;
}

#header--large .uk-container {
    padding-left: 0px;
    padding-right: 0px;
}

#header--large .uk-icon {
    color: #ffffff;
}

 #header--large .hcclogo-small {
    margin-top: 50px;
    display: none;
 }

#header--large .uk-drop-hcc {
    background: rgba(255, 255, 255, 0.9);
    z-index: 1;
}

/******************    MEDIA QUERIES    ***************************/

@media only screen and (max-width: 1200px) {

}




@media only screen and (max-width: 960px) {

    #header--large .uk-sticky {
        padding-top: 40px;
    }

    #header--large .uk-icon {
        position: absolute;
        left: 20px;
        top: 40px;
    }

    #header--large .hcclogo-small {
        margin-top: 40px;
        display: inline;
     }

    #header--large .uk-section {
        padding-top: 60px;
        height: 100px;
     }
    #offcanvas-menu > div > div > div > div > form {border: 1px solid gray;}
    #offcanvas-menu > div > div > div > div > form > input {border: 0px; width:80%;}

    #header--large .mobile-icon {
        color: white; margin-top: -80px; margin-left: 10px;
    }
    #header--large .mobile-icon :hover {
        color: #ccc;
    }
    #header--large #home-slideshow {
        margin-top: 80px;
    }

}

@media only screen and (max-width: 640px) {
 #header--large .hcclogo-small {
    margin-top: 30px;

 }

}


