/*  ------------------------------------------------------

File : Main CSS
Project : La Chambre Marocaine de Commerce & d’Industrie Belgique Union Européenne
Version : 1.0
Developed by : YT - The Agencies
URL : www.the-agencies.co

------------------------------------------------------ */

/* General */ 

@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');


:root {
    --cmci-green: #599820; 
    --cmci-red: #D90A18; 
    --cmci-dark: #161615; 
    --cmci-grey: #A5A5A4; 
}


body {
    font-family: 'Lato', sans-serif;
}

a {
    text-decoration: none;
}

.btn-cmci {
    background-color:var(--cmci-green); 
    border-color: var(--cmci-green);
    color:white;
}


.btn-cmci:hover {
    background-color: white !important;
    color:var(--cmci-green) !important
}

/* Header */

.cmci-logo img {
    width:140px; 
}

header {
    height:120px; 
}

header ul {
    list-style: none;
    padding:0; 
}

.cmci-top-menu {
    display:flex;
    justify-content: flex-end;
    text-transform: uppercase;
    margin-bottom:0; 
    list-style-type: none;
}

.cmci-top-menu li {
    margin-left: 20px; 

}

.cmci-top-menu li a {
    color:white; 
    text-decoration: none;
}

.cmci-top-menu li a:hover {
    color:var(--cmci-green);
}

.cmci-mobile-menu {
    padding:0; 
    list-style:none; 
    text-transform: uppercase;
}


.cmci-mobile-menu li a {
    color:var(--cmci-dark); 
    text-decoration: none;
}

.cmci-mobile-menu li a:hover {
    color:var(--cmci-green);
}


.cmci-mobile-menu li {
    margin-bottom:10px;
}



/* Hero */

.cmci-bg {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    height: 700px; 
    display: flex;
    align-items:center;
    position: relative;
    z-index: -1;
    margin-top: -120px;
}

.cmci-bg:before {
    content:''; 
    position:absolute;
    width:100%; 
    height:100%; 
    background:linear-gradient(to right, var(--cmci-green), transparent); 
    opacity: .5;
    z-index: -1;

}

.cmci-heading h1 {
    z-index:10;
    color:white;
    font-weight: bolder;
}

/* Blocks */

.cmciblocks__item {
    background-position: center;
    background-size:cover; 
    background-repeat:no-repeat; 
    height:300px; 
    display: flex;
    align-items: center;
    justify-content: center;
    position:relative;
    z-index: -1;
    border-radius: 10px;
    transform: translateY(-50px);
}

.cmciblocks__item:before {
    content:''; 
    position:absolute;
    width:100%; 
    height: 100%;
    background-color: var(--cmci-green);
    opacity: .5; 
    z-index: -1;
    border-radius: 10px;
}

.cmciblocks__title {
    z-index: 10;
    color:white;
    font-weight: bolder;
}

a:hover .cmciblocks__item:before {
    opacity:.3;
    transition: all ease-in-out;
}

@media (max-width: 992px) {
    .cmciblocks__item {
        height:200px !important;
    }
}


.cmcibe_parent {
    display: flex;
    flex-wrap: wrap;
}

.cmcibe_item {
    width:33.3333%; 
    padding:5px;
}

.cmcibe_item:first-child {
    width:66.666%; 
}


.cmcibe_bg {
    border-radius: 20px;
    height:250px; 
    background-size: cover;
    background-position: center;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding:20px;
    color:white;
	position:relative;
	z-index:10;
}

.cmcibe_bg:before {
    position:absolute; 
    content:''; 
	top:0; 
    right:0;
    border-radius: 20px;
    width:100%; 
    height:100%; 
    background-image: linear-gradient(to top, black , transparent) ;
    opacity: .4;
	z-index:-1;
}