/* Start:color setup */
/*#headercomp .headercomp-btn i { color: #719400; }*/
#headercomp .headercomp-btn i { color: #E54600; }

/*#headercomp .headercomp-btn.active-state,
#headercomp .headercomp-btn:hover{ background-color: #719400;}*/
#headercomp .headercomp-btn.active-state,
#headercomp .headercomp-btn:hover{ background-color: #E54600;}

/*#headercomp .responsive-menus.blue-menu{ background-color: #719400; }*/
#headercomp .responsive-menus.blue-menu{ background-color: #ffffff; }

#headercomp .search-form .searchcloser{ color: #888888; }
/* End:color setup */

/* Start:Animation definition */
@keyframes fadeInDownHeader {
	from {opacity:0; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";  transform:translate3d(0,-100%,0)}
	to {opacity:1; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; transform:translate3d(0,0,0) }
}
@keyframes SearchAnim {
	0% { width: 140px; }
	100% { width: 300px; }
}
/* End:Animation definition */

#headercomp{ box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px; border-radius: 0 0 3px 3px; background-color: #FFFFFF; }
#headercomp .holder{ position:relative; }
#headercomp.sticky-switch-on{
    position: -webkit-sticky; position: fixed; top: 0px; left: 0px; right: 0px; margin-top:0px;
    background-color: #FFF; box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
    z-index: 1040;
}
/*animation play*/
.sticky-switch-on{ 	animation: fadeInDownHeader; animation-duration: 1s; animation-fill-mode: both; }


/* Satrt: navigation-buttons definitions */
#headercomp .headercomp-btn{
    display: inline-block; width: 60px; height:60px; text-align: center; vertical-align: middle;
    display: flex; flex-direction: column; justify-content:center; font-size: 20px;
}
#headercomp .headercomp-btn.active-state,
#headercomp .headercomp-btn:hover{ text-decoration: none; }
#headercomp .headercomp-btn.active-state i,
#headercomp .headercomp-btn:hover i{ color: #FFFFFF; }
#headercomp .headercomp-btn.border-left{ border-left: 1px solid #ccc; }
#headercomp .headercomp-btn.border-right{ border-right: 1px solid #ccc; }
/* End: navigation-buttons definitions */

/* Start: flex - sizes definitions */
#headercomp .headercomp-flex{ position: relative;  }
#headercomp .headercomp-flex .menu-button { flex: 0 0 60px; }
#headercomp .headercomp-flex .logo{ flex: 0 0 148px; padding: 13px 0px 17px 20px; }
#headercomp .headercomp-flex .menus{ flex: 1 1; padding: 17px 0px; }
#headercomp .headercomp-flex .menus.white-menu{ text-align: left; }
#headercomp .headercomp-flex .menus.white-menu nav ul{ margin:0px;  }
#headercomp .headercomp-flex .menus.white-menu nav ul li{ font-size: 16px; font-weight:400; margin-right: 16px; }
#headercomp .headercomp-flex .search{ flex: 0 0 60px; text-align: right; }
/* Start: flex - sizes definitions */


#headercomp .responsive-menus.blue-menu{ box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px; }
#headercomp .responsive-menus.blue-menu a{ color: #000000; }

/* Start: search form */
#headercomp .search-form{  display: none; width:260px; height: 60px; position:absolute; right:0px; top:0px; background-color:#FFFFFF; }
/*animation play*/
#headercomp .search-form.active-state{ 
    animation: SearchAnim; animation-duration: 1s; animation-fill-mode: both;
    display: flex !important; flex-direction: column; justify-content: center;
}

#headercomp .search-form .input-group{ width:100%; position: relative; padding-right: 10px; padding-left: 10px; }
#headercomp .search-form input{ border-radius: 3px !important; padding-left: 40px; height:42px; font-size: 16px; }
#headercomp .search-form button{ border-radius: 3px !important; }
#headercomp .search-form .searchcloser{ 
    width:36px; height:42px; text-align: center; line-height: 42px; font-size: 20px; font-weight: 100;
    position:absolute; top: 3px; left: 10px; z-index: 100; opacity: 0.6;
}
#headercomp .search-form .searchcloser:hover{ opacity: 1;}
/* ENd: search form */

/* Start:media queries responsive */

@media (max-width: 767px) {
    #headercomp .responsive-menus.blue-menu { display:none; }
    #headercomp .responsive-menus.blue-menu.active-state{
        position: absolute; top: 60px; left:0px; width:100%;
        display: flex !important; flex-direction: column; align-items: stretch;
        z-index: 1000; 
    }
    #headercomp .responsive-menus.blue-menu ul{ width:100%; }
    #headercomp .responsive-menus.blue-menu ul .list-inline-item{ width:100% !important; line-height: 40px; border-bottom: 1px solid #efefef; }
    #headercomp .responsive-menus.blue-menu ul .list-inline-item a{ display:block;  }
    #headercomp .responsive-menus.blue-menu ul .list-inline-item:hover{ background-color: #E54600; }
    #headercomp .responsive-menus.blue-menu ul .list-inline-item:hover a{ color: #FFFFFF; }
}

@media (max-width: 575px) {
    @keyframes SearchAnim {
        0% { width: 120px; }
        100% { width: 100%;}
    }
    #headercomp .search-form{ padding-top: 10px; }
}

/* End:media queries responsive */
