/* 
- Name: megamenu.js - style.css
- Version: 1.0
- Latest update: 29.01.2016.
- Author: Mario Loncarek
- Author web site: http://marioloncarek.com
*/


/* ––––––––––––––––––––––––––––––––––––––––––––––––––
Body - not related to megamenu
–––––––––––––––––––––––––––––––––––––––––––––––––– */






/* ––––––––––––––––––––––––––––––––––––––––––––––––––
megamenu.js STYLE STARTS HERE
–––––––––––––––––––––––––––––––––––––––––––––––––– */


/* ––––––––––––––––––––––––––––––––––––––––––––––––––
Screen  style's
–––––––––––––––––––––––––––––––––––––––––––––––––– */

@font-face {
    font-family: "ionicons";
    src:url( "ionicons.min.css");

}

@font-face {
    font-family: "NunitoSans-Bold";
    src:url( "../../font/NunitoSans-Bold.ttf");

}


#navbar {
	padding-top: 1px;
	padding-bottom:2px; 
	width: 100%;
	height: auto;
	display: block;
	align-items: center;
	justify-content: center;
	background: #E0E0E0;
	border-bottom: 3px solid #fff;
	margin: 0;
	left: 0;
	right: 0;
	z-index: 160;
	margin-bottom:0px!important;
	clear:both;
}

.menu-mobile  {
	display: none;
	width: 100%;
	padding: 10px;
	color: #fff!important;
	text-decoration: none!important;
	list-style-image: none!important;
	list-style-type: none!important;
	background-position: 0% 0%;
	
}

.menu-mobile:after {
	content: "\f394";
	font-family:"ionicons";
	font-size:40px;
	font-weight:400;
	color: #fff;
	padding:10px;
	float: right;
	position: relative;
	margin-top:auto!important;
	margin-bottom: auto!important; 
	-webkit-transform: translateY(-22%);
	-ms-transform: translateY(-22%);
	transform: translateY(-22%);
	text-decoration: none!important;
	list-style-image: none!important;
	list-style-type: none!important;
	}

.menu-dropdown-icon:before {
    content: "\f123";
    font-family:"ionicons";
	width: 30px;
	height:30px;
	margin-top:7px; 
	margin-bottom: auto;
	margin-right:32px; 
	padding-top: 2px!important;
	padding-bottom: 13px!important;
	font-weight: 600;
    display: none;
    cursor: pointer;
    float: right;
    color: #C11013;
	text-align: center;
	align-content: center;
	transition: max-height 0.5s ease-out;

 }




.menu > ul {
	margin-top:0px;
	margin-bottom:0;
	width: 100%;
	max-width:1560px!important;
	list-style:none;
	padding:0; 
	/* IF .menu position=relative -> ul = container width, ELSE ul = 100% width */
	box-sizing: border-box;
}

.menu > ul:before,
.menu > ul:after {
    content: "";
    display: table;
	padding: 0 20px;
	
}

.menu > ul:after {
    clear: both;
	
}

.menu > ul > li {
    font-family: "NunitoSans Regular",sans-serif!important;
	font-weight: 600!important;
    font-size: 16px!important;
    font-style: normal;
    display: inline-block;
    padding-top: 0;
    padding-bottom: 0;
    margin: 0;
    text-align: justify;
    letter-spacing: normal;
    text-indent: 10px;
}

.menu > ul > li a {
	 
	width: 100%;
	height: auto;
	line-height: 40px;
	text-decoration: none;
	margin-top: -0.25rem;
	margin-bottom:-0.30rem;
	padding-top: 8px;
	padding-right: 15px;
	padding-left: 15px;
	padding-bottom: 8px;
	display: block;
	color: #454545;
	animation-name:slide;
	animation-iteration-count: infinite;
	animation-duration: 4s;
	transition: 4s;
	transition-property: animation-duration;
	z-index: 150;
	
	
}	
	
.menu > ul > li:hover >a{
	
	background-color:#fff !important;
	color: #e40521!important;
	
	
	
}

.menu > ul > li > ul {
	font-family: "NunitoSans Regular",sans-serif!important;
	display: none;
	width: 100%;
	max-width: 1920px!important;
	margin-top: 5px;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFFFFF;
	padding-bottom: 50px;
	padding-top: 25px;
	position: absolute;
	box-shadow: 0 5px 7px -6px rgb(0 0 0 / 50%);
	z-index: 99;
	left: 0;
	right: 0;
	list-style: none;
	box-sizing: border-box;
	background-image: url(  "../imagini/logo-bottomright.png");
	background-position: 100% bottom;
	background-repeat: no-repeat;
	padding-left: 100px!important;
	padding-right: 100px!important;
	transition: max-height 0.7s ease-in-out!important;
	transform: translateY(0);
	border-bottom-right-radius: 6px;
	border-bottom-left-radius: 6px;
}

.menu > ul > li > ul:before,
.menu > ul > li > ul:after {
	content: "";
	display: table;
	border-bottom-left-radius: 6px;	

}

.menu > ul > li > ul:after {
    clear: both;
		
}

.menu > ul > li > ul > li {
	
margin-top: 0px;
margin-bottom: 0px;
padding: 10px;
list-style: none;
width:25%;
float: left;
	
}

.menu > ul > li > ul > li a {
	 
font-weight:normal!important;
line-height:20px!important;
color:#e40521;
padding: 8px;
margin:0px; 
display: block;
	
}

.menu > ul > li > ul > li > ul {  
	
    display: block;
    padding: 0;
    margin: 10px 0 0;
    list-style: none;
    box-sizing: border-box;

}

.menu > ul > li > ul > li > ul:before,
.menu > ul > li > ul > li > ul:after {
    content: "";
    display: table;

}

.menu > ul > li > ul > li > ul:after {
    clear: both;
}

.menu > ul > li > ul > li > ul > li {
	float: left;
	width: 100%;
	padding-top: 3px;
	padding-right: 0;
	padding-bottom: 3px;
	margin: 0;
	font-weight: 300!important;
	
}
.evident{
	position: relative!important;
	font-family: "NunitoSans Bold",sans-serif;
	font-size: 16px!important;
	font-style: normal;
	border-bottom:0.14em solid #e40521;
	display: inline!important;
	text-transform: uppercase;
	padding: 0px!important;
	margin-bottom: 25px!important;
	margin-left:10px!important; 
}

.menu > ul > li > ul > li > ul > li a {
	border-bottom: 1px solid #DFDFDF;
	font-size:14px!important; 
	text-align: left;
  background-color:transparent;
	padding-bottom:7px!important;
	padding-top: 0px!important;
	color:#262626;
	 

}

.menu > ul > li > ul > li > ul > li a:hover {
	color:#e40521;
	font-weight: 400!important;
	background-color:transparent; 
}

.menu > ul > li > ul.normal-sub {
    width: 300px;
    left: auto;
    padding: 0 20px;
	
}

.menu > ul > li > ul.normal-sub > li {
    width: 100%;
		
}

.menu > ul > li > ul.normal-sub > li a {
    border: 0;
    padding: 1em 0;
	
}


@media (max-width:768px){
	
    .menu-mobile {
	display: block;
	font-weight: 600;
	color: #fff;
	background-color: #e40521;
		
		padding: 15px 15px;
	
		}
	.menu > ul > li > ul {
	
	padding-left: 30px;
	padding-right: 30px;
height:100%;

	text-align: center;
	
}
    .menu-dropdown-icon:before {
        display: block;
    }
    .menu > ul {
        display: none;
    }
    .menu > ul > li {
        width: 100%;
        float: none;
        display: block;
		
    }
    .menu > ul > li a {
		font-size: 16px;
        padding:0.5em  1.5em;
        width: 100%;
        display: block;
		
		
    }
	
	.menu > ul > li:hover >a{
	color: #e70101!important;
	background-color:#E7E7E7!important;
	
	
}

    .menu > ul > li > ul {
        position: relative;
		overflow: scroll!important;
		max-height:450px!important; 
		
    }
    .menu > ul > li > ul.normal-sub {
        width: 100%;

		
    }
    .menu > ul > li > ul > li {
        float: none;
        width: 100%;
        margin-top: 5px;
		padding: 0px!important;
    }
    .menu > ul > li > ul > li:first-child {
        margin: 0;
    }
    .menu > ul > li > ul > li > ul {
        position: relative;
    }
    .menu > ul > li > ul > li > ul > li {
        float: none;
    }
    .menu .show-on-mobile {
        display: block;
    }
	
}

/* =========================
   STICKY NAVBAR + LOGO
========================= */

/* =========================
   LOGO SCROLL ANIMAT
========================= */

#navbar{
 
    top: 0;
    width: 100%;
    transition: all 0.3s ease;
}

/* container meniu */
.menu > ul {
	margin-top:0px;
	margin-bottom:0;
	width: 100%;
	list-style:none;
	padding:0;
	box-sizing: border-box;

	/* CENTRARE */
	display:flex;
	justify-content:center;
	align-items:center;

	position: relative;
}

/* logo hidden initial */
.logo-scroll{
    display: flex;
    align-items: center;

    opacity: 0;
    visibility: hidden;

    transform: translateY(-80px);

    transition:
        transform 0.45s ease,
        opacity 0.45s ease;

    margin-right: 15px;
}

/* imagine logo */
.logo-scroll img{
    height: 45px;
    width: auto;
    display: block;
}

/* apare la scroll */
#navbar.scrolled .logo-scroll{
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
/* =======================================
   FIX CENTRARE MENIU DESKTOP + MOBILE
======================================= */

/* DESKTOP */
@media (min-width:769px){

    .menu > ul{

        text-align:center;

        width:100%;
        max-width:1560px;
        margin:0 auto;

        padding:0;

    }

    .menu > ul > li{

        display:block !important;
        float:none !important;

    }

    .menu > ul > li > a{

        display:block;
        text-align:center;

    }
	/* elementele principale pe centru */
.menu > ul > li{

    display:inline-block !important;
    float:none !important;
    text-align:left;

}

/* submenu full width */
.menu > ul > li > ul{

    position:absolute;
    left:0;
    right:0;
    width:100%;

}

    /* logo scroll */
    .logo-scroll{

        display:flex;
        align-items:center;

        margin-right:20px;

        opacity:0;
        visibility:hidden;

        transform:translateY(-70px);

        transition:
            transform .45s ease,
            opacity .45s ease;

    }

    .logo-scroll img{

        height:45px;
        width:45px;
        display:block;

    }

    #navbar.scrolled .logo-scroll{

        opacity:1;
        visibility:visible;
        transform:translateY(0);

    }

}


@media (max-width:768px){

    /* buton mobil */
    .menu-mobile{
        display:block;
        font-weight:600;
        color:#fff;
        background-color:#e40521;
        padding:15px;
    }

    /* meniu ascuns inițial */
    .menu > ul{

        display:none;
        width:100%;

        background:#fff;

        margin:0;
        padding:0;

    }

    /* meniu activ */
    .menu > ul.show{

        display:block;

    }

    .menu > ul > li{

        width:100%;
        display:block;
        float:none;

    }

    .menu > ul > li > a{

        display:block;
        width:100%;

        padding:14px 20px;

        border-bottom:1px solid #eee;

    }

    /* ascunde logo scroll pe mobil */
    .logo-scroll{

        display:none !important;

    }

    /* dropdown-uri */
    .menu > ul > li > ul{

        position:relative;
        padding-left:20px !important;
        padding-right:20px !important;

        max-height:none !important;
        overflow:visible !important;

    }

}
