
@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');
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200..1000&family=Noto+Kufi+Arabic:wght@100..900&display=swap');

/* ------------------- font  */

html[lang='en'] {
    font-family: "Lato", sans-serif !important;
}

html[lang='ar'] {
    font-family:"Cairo", serif !important;
}

body {
    font-family: inherit !important;
    padding : 0 !important;
    background: 
    linear-gradient(to left, #778d91 -5%, #168996 5%, #011668 40% ,  #02303f 95.5%),
    url('Images/IN_DARK_PATTERN_NEW_2.png');
    background-size: contain;
    background-position: center;
    background-repeat: repeat-y;
    background-blend-mode: overlay; 
}

/* ------------------- reset */
* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

ul {
    list-style: none;
}
a {
    text-decoration: none !important;
}

.body-content {
    max-width: 1500px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 2rem;
    padding: 2rem 0 ;
}
h1 {
    margin: 0;
    text-align: center;
    font-size: 4rem !important;
    line-height: 3rem !important; 
    color : #ccecee ; 
    font-weight: 500 !important;
    /* font-family: inherit !important; */
    font-family: "Lato", sans-serif !important;
}
h1 span {
    font-weight: 900 !important;
    letter-spacing: 0.3rem;
}
.current-version  span a {
    transition: all 0.28s ease-in-out;
    -webkit-transition: all 0.28s ease-in-out;
    -moz-transition: all 0.28s ease-in-out;
    -ms-transition: all 0.28s ease-in-out;
    -o-transition: all 0.28s ease-in-out;
    /* -------------- */
    color : #16967f !important; 
    font-weight: 800;
}
.current-version  span a:hover {
    color : #ccecee !important; 
    text-decoration : underline !important;
}

.content{
    padding: 0;
    max-width: 100%;
}
.grid{
    padding: 0;
    display: grid;
    grid-template-columns : 1fr 1fr ;
    gap: 2rem;
    max-width: 100%;
}
.effect-chico{
    font-family: "Lato", sans-serif !important;
    transition: all 0.28s ease-in-out;
    -webkit-transition: all 0.28s ease-in-out;
    -moz-transition: all 0.28s ease-in-out;
    -ms-transition: all 0.28s ease-in-out;
    -o-transition: all 0.28s ease-in-out;
    /* -------------- */
    border-radius: 0.6rem;
    -webkit-border-radius: 0.6rem;
    -moz-border-radius: 0.6rem;
    -ms-border-radius: 0.6rem;
    -o-border-radius: 0.6rem;
    /* -------------- */
    margin: 0 !important;
    width: 100% !important;
}
@media screen and (max-width: 990px) {
    .grid{
        grid-template-columns: 1fr !important;
        gap: 1rem;
        padding: 2px;
        overflow: hidden;
    }
    .effect-chico {
        max-width: 100% !important ;
        overflow: hidden;
    }
}

.effect-chico img {
    display: block;
    width: 100% !important;
    object-fit: cover
}

figure.effect-chico p {
    color :  #ccecee; 
}

figure.effect-chico h2 {
	color :#ccecee;
}
figure.effect-chico figcaption::before {
    border-radius: 0.6rem;
    -webkit-border-radius: 0.6rem;
    -moz-border-radius: 0.6rem;
    -ms-border-radius: 0.6rem;
    -o-border-radius: 0.6rem;
    /* -------------- */
    border-color: #ccecee;
}

/* figure.effect-chico figcaption {

} */