/**
* Theme Name: NT Metropol Child
* Description: This is a child theme of NT Metropol, generated by Merlin WP.
* Author: <a href="http://ninetheme.com/about">Ninetheme</a>
* Template: nt-metropol
* Version: 1.5.2
* Developer: Lewaa Shaaban
*/
/* Limit header logo size */


:root{
	green-color : #60A070;
	light-blue-color: #4080B0;
	dark-blue-color: #305090;
	orange-color: #D06040;
	purple-color: #905080;
	yellow-color: #D6AD4C;
	white-color: #D6AD4C;
	red-color: #FF2511;
}

:root {
    --green-color:       #60A070;
    --light-blue-color:  #4080B0;
    --dark-blue-color:   #305090;
    --orange-color:      #D06040;
    --purple-color:      #905080;
    --yellow-color:      #D6AD4C;
	--white-color: 		 #D6AD4C;
	--red-color: 		 #FF2511;
	
}

.header-area .logo img,
.header-area .logo .custom-logo {
    max-height: 70px;
    width: auto;
}

.mobile-menu .logo img,
.mobile-menu  .logo .custom-logo {
	max-height: 50px;
    width: auto;
}
/* Align logo to the left and vertically center it in the header */
.header-area .logo {
    text-align: left;  
	padding: 20px 0px 20px;
}

.header-area .logo img,
.header-area .logo .custom-logo {
    display: block;
    margin: 0;                 /* remove auto-centering margin  */
}

.header-area .col-md-2:first-child {
    display: flex;
    align-items: center;       /* vertical centering in header  */
}

.home .page-cover{
	max-width: 1000px;
}

.page-cover .breadcrubms{
	display:none !important;
}

/* Colored words in hero subtitle */
.mosaic-unique {
    color: var(--orange-color);
    font-weight: 700;
}

.mosaic-intentional {
    color: var(--light-blue-color);
    font-weight: 700;
}

.mosaic-powerful {
    color: var(--purple-color);
    font-weight: 700;
}

/* "How are we useful for you" – 3 equal centered columns */
.mosaic-useful-row {
    display: flex;
    justify-content: space-between;   /* spread them evenly */
    flex-wrap: wrap;
}

.mosaic-useful-row > .wpb_column {
    float: none !important;           /* kill WPBakery floats */
    flex: 0 0 32%;                    /* a bit less than 1/3 so 3 fit easily */
    max-width: 32%;
    text-align: center;
}

/* Stack nicely on mobile */
@media (max-width: 767px) {
    .mosaic-useful-row {
        display: block;
    }

    .mosaic-useful-row > .wpb_column {
        max-width: 100%;
        flex: 0 0 100%;
        margin-bottom: 30px;
    }
}