/* <uniquifier>: Use a unique and descriptive class name
 <weight>: Use a value from 200 to 1000*/

.nunito-sans-dz42 {
  font-family: "Nunito Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
    "wdth" 100,
    "YTLC" 500;
}


* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}



body { 
    font-family: "Nunito Sans", sans-serif;
    line-height: 1.5;
	height:100vh;
	background-color: #1b2a41;
}

header {
    
    color: #f0e9d2;
    padding: 1rem 0;
}

.container {
    width: 90%;
    margin: 0 auto;
    max-width: 1200px;
}

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

.col-12 {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 1rem;
}


.col-6 {
    flex: 0 0 50%;
    max-width: 50%;
    padding: 1rem;
}

.logo_container {
    display: flex;
    align-items: center;
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 90%;
    margin: 0 auto;
    max-width: 1200px;
}

.main-content{
	display: flex;
    justify-content: space-between;
    align-items: center;
    width: 50%;
    margin: 0 auto;
	height:66%;
	
}

 img.logo {
    height: 50px;
    margin-right: 1rem;
}

 img.sign{
	height: 100px;
    margin-right: 1rem;
}

nav ul {
    list-style: none;
    display: flex;
    justify-content: flex-end;
}

nav ul li {
    margin-left: 1rem;
}

nav ul li a {
    color: #f0e9d2;
    text-decoration: none;
    font-size: 1rem;
}
nav ul li a:hover {
    color: #FFF;
    text-decoration: none;
}
main {
    background-color: #1b2a41;
    color: #f0e9d2;
    padding: 5rem 0;
}

#home{
	height: calc(100vh - 182px);
    text-align: center;
}

#nothome{
	min-height: calc(100vh - 182px);
    height: auto;
}

footer {
    background-color: #112131;
    color: #c1baa1;
    text-align: center;
    padding: 1rem 0;
	font-size:0.75rem;
}

.main-content h1 {
     font-size: 60px;
		line-height:1.2;
		font-weight: 200;
}





/* Margins */
.m-0 { margin: 0 !important; }
.m-1 { margin: 0.25rem !important; }
.m-2 { margin: 0.5rem !important; }
.m-3 { margin: 1rem !important; }
.m-4 { margin: 1.5rem !important; }
.m-5 { margin: 3rem !important; }

.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: 0.25rem !important; }
.mt-2 { margin-top: 0.5rem !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mt-5 { margin-top: 3rem !important; }

.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 0.25rem !important; }
.mb-2 { margin-bottom: 0.5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mb-5 { margin-bottom: 3rem !important; }

.ms-0 { margin-left: 0 !important; }
.ms-1 { margin-left: 0.25rem !important; }
.ms-2 { margin-left: 0.5rem !important; }
.ms-3 { margin-left: 1rem !important; }
.ms-4 { margin-left: 1.5rem !important; }
.ms-5 { margin-left: 3rem !important; }

.me-0 { margin-right: 0 !important; }
.me-1 { margin-right: 0.25rem !important; }
.me-2 { margin-right: 0.5rem !important; }
.me-3 { margin-right: 1rem !important; }
.me-4 { margin-right: 1.5rem !important; }
.me-5 { margin-right: 3rem !important; }

/* Paddings */
.p-0 { padding: 0 !important; }
.p-1 { padding: 0.25rem !important; }
.p-2 { padding: 0.5rem !important; }
.p-3 { padding: 1rem !important; }
.p-4 { padding: 1.5rem !important; }
.p-5 { padding: 3rem !important; }

.pt-0 { padding-top: 0 !important; }
.pt-1 { padding-top: 0.25rem !important; }
.pt-2 { padding-top: 0.5rem !important; }
.pt-3 { padding-top: 1rem !important; }
.pt-4 { padding-top: 1.5rem !important; }
.pt-5 { padding-top: 3rem !important; }

.pb-0 { padding-bottom: 0 !important; }
.pb-1 { padding-bottom: 0.25rem !important; }
.pb-2 { padding-bottom: 0.5rem !important; }
.pb-3 { padding-bottom: 1rem !important; }
.pb-4 { padding-bottom: 1.5rem !important; }
.pb-5 { padding-bottom: 3rem !important; }

.ps-0 { padding-left: 0 !important; }
.ps-1 { padding-left: 0.25rem !important; }
.ps-2 { padding-left: 0.5rem !important; }
.ps-3 { padding-left: 1rem !important; }
.ps-4 { padding-left: 1.5rem !important; }
.ps-5 { padding-left: 3rem !important; }

.pe-0 { padding-right: 0 !important; }
.pe-1 { padding-right: 0.25rem !important; }
.pe-2 { padding-right: 0.5rem !important; }
.pe-3 { padding-right: 1rem !important; }
.pe-4 { padding-right: 1.5rem !important; }
.pe-5 { padding-right: 3rem !important; }

/* Paragraphs and Headings with Padding Bottom */
p, h1, h2, h3, h4, h5, h6 {
    padding-bottom: 1rem;
}


/* Font Sizes */
.fs-1 { font-size: 2.5rem !important; /* 40px */ }
.fs-2 { font-size: 2rem !important; /* 32px */ }
.fs-3 { font-size: 1.75rem !important; /* 28px */ }
.fs-4 { font-size: 1.5rem !important; /* 24px */ }
.fs-5 { font-size: 1.25rem !important; /* 20px */ }
.fs-6 { font-size: 1rem !important; /* 16px */ }
.fs-7 { font-size: 0.875rem !important; /* 14px */ }
.fs-8 { font-size: 0.75rem !important; /* 12px */ }
.fs-9 { font-size: 0.625rem !important; /* 10px */ }

/* Font Weights */
.font-weight-100 { font-weight: 100 !important; /* Thin */ }
.font-weight-200 { font-weight: 200 !important; /* Extra Light */ }
.font-weight-300 { font-weight: 300 !important; /* Light */ }
.font-weight-400 { font-weight: 400 !important; /* Normal */ }
.font-weight-500 { font-weight: 500 !important; /* Medium */ }
.font-weight-600 { font-weight: 600 !important; /* Semi Bold */ }
.font-weight-700 { font-weight: 700 !important; /* Bold */ }
.font-weight-800 { font-weight: 800 !important; /* Extra Bold */ }
.font-weight-900 { font-weight: 900 !important; /* Black */ }

/* Text Transformations */
.text-uppercase { text-transform: uppercase !important; }
.text-lowercase { text-transform: lowercase !important; }
.text-capitalize { text-transform: capitalize !important; }

@media (max-width: 768px) {
    
    nav ul {
        flex-direction: column;
        align-items: center;
    }

    nav ul li {
        margin: 0.5rem 0;
    }

    .main-content h1 {
        font-size: 28px;
    }
	nav {
		display:none;
	}
	
	#home{
		height: calc(100vh - 320px);
	}

    .col-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }
}