.W3C {

    margin-left: 50px;
}

/*_________________________________________________COLOURS OF THE CHARTER__*/

.primaryColor1_Bg { 

    background-color: #0065FC; /*BLUE*/
}

.primaryColor1 {

    color:#0065FC;
}

.primaryColor2_Bg { 

    background-color: #DEEBFF; /*LIGHT BLUE*/
}

.primaryColor3_Bg { 

    background-color: #F2F2F2; /*GREY*/
}

.primaryColor3 {

    color: #F2F2F2;
}

.primaryColor4 {

    color: #d9d9d9; /*DARK GREY*/

}


/*_________________________________________________________________________*/




/*____________________________________________________ADJUSTMENT CLASSES__*/

.adjustSpace {

    display: flex;
    justify-content: space-between;
    align-items: center;

}

.adjustCenter {

    display: flex;
    justify-content: center;
    align-items: center;

}

.adjustAround {

    display: flex;
    justify-content: space-around;
    align-items: center;

}

.adjustItems {

    display: flex;
    align-items: baseline;

}

.adjustFlex {

    display: flex;

}

.adjustTxt {

    margin-right: 25px;

}

/*_________________________________________________________________________*/
   




body {

    font-family : 'Raleway', sans-serif ;
    overflow-x: hidden;
    
}

main {

    padding: 0 50px;

}

header {

    padding: 0 50px;

}

a {

    text-decoration: none;
    color: currentColor;
    
}

ul {

    padding: inherit;
    margin: inherit;

}




/*_________________________________________________________HEADER_CONTENT_*/

.header__logo {

    width: 120px;
    height: 50px;
    cursor: pointer;
    margin-left: 45px;

}


.header__logo:hover{

    transform: scale(1.02);

}

/*________________________________________________________________________*/




/*_____________________________________________________HEADER NAV_CONTENT_*/

.header__nav {

    width: 140px;
    height: 97px;

}

.header__nav--border {

    border-top: transparent solid 3px;

}

.header__nav--border:hover {

    border-top: #0065FC solid 3px;
    color: #0065FC;

}

.header__nav--links {

    display: flex;
    align-items: center;
    justify-content: center;
    height: 90px;
    width: 140px ;
    color: black;
    font-weight: bold;
    padding: 5%;

}

.header__nav--links:hover {

    color: #0065FC;

}

/*________________________________________________________________________*/




/*______________________________________SEARCH = INPUT + BUTTON___CONTENT_*/

.search {

    padding: 0px;

}

.search__input {

    display: flex;
    height: 65px;
    align-items: center;
    margin-top: 30px;

}

input {
    
    height: 65px;
    width: 240px; 
    border: 0.5px solid #F2F2F2;
    padding: 10px;
    font-weight: bold;
    font-size: 16px;
    color: black;

}

.search__input--icon {

    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 65px;
    border-radius: 20px 0px 0px 20px;

}

.search__input--button {
    
    color: white;
    font-size: 16px;
    font-weight: bold;
    border: none;
    height: 65px;
    width: 145px;
    border-radius: 0px 20px 20px 0px;
    
}

.search__input--button2 {

    display: none;
    
}

.search__input--button:hover,.search__input--button2:hover {   
    
    background-color: #F2F2F2;
    cursor: pointer;
    color: black;
    transition: ease-out 0.2s;

}

.search__info--icon {
 
   width: 20px;
   height: 20px;
   color: #0065FC;
   border: solid 2px #F2F2F2;
   border-radius: 100%;
   margin-right: 15px;

}

.search__info {

    margin-top: 35px;
    margin-bottom: 35px;

}

/*________________________________________________________________________*/




/*__________________________________(Search)_AFFINITIES FILTERS___CONTENT_*/

.affinities {
   
    display: flex;
    flex-wrap: wrap; 
    margin-top: 20px;

}

.affinities__filters {

    border: solid 3px #d9d9d9;
    border-radius: 31px 31px 31px 31px;
    height: 50px;
    margin: 10px;
    display: flex;
    align-items: center;

}

.affinities__filters:hover{

    background: linear-gradient(0.25turn,#DEEBFF,#DEEBFF,#0065FC);
    cursor: pointer;
    transform: scale(1.02);
    transition: all 0.3s;
    cursor: pointer;
    box-shadow: 0 0 16px #0000002e;
    border: solid 3px #DEEBFF;

}


.fa-child:before {

    padding: 3px;

}

.affinities__filters--icons {
    
    border-radius: 100px;
    padding: 20px;
    margin: -4px;

}

.affinities__filters--select { 
    
    padding: 35px;
    font-size: 1.03em;
  
}



/*__________________________________________________________________________*/

            /* Hosting and Popular content + Stars + Hover Cards */

.container {

    display: flex;
    justify-content: space-between;

}

.stars {

    margin-top: 5px;
    margin-left: -3px;

}

.fa-star:hover {

    color: #0065FC;

}

.popular__stars {

    margin-top: 50px;

}

.fa-star:before {
    
    margin: 1px;

}

.hosting-popular__cards--prices {

    font-weight: bold; 
    
}

.cards--hover:hover {   

    transform: scale(1.02);
    transition: ease-out 0.2s;
    cursor: pointer;

}





/*_______________________________________________________HOSTING CONTENT____*/

.hosting {

    flex-basis: 65%;
    border-radius: 25px;
    padding: 50px;
    margin-right: 50px;

}

.hosting__title { 

    height: 30px;
  
}

.hosting__cards--container {

    display: flex;
    justify-content: space-between;
    margin-bottom: 40px;
    flex-wrap: wrap; 

}

.hosting__links {

    width: 30%;
}

.hosting__cards {

    background-color: white;
    padding: 4px;
    border-radius: 25px;
    box-shadow: 0 0 16px #0000002e;
    margin-left: 0px;
    margin-right: 0px;
    height: max-content;
    margin-bottom: 30px;

}

.hosting__cards--titles {

    font-size: 1.15em; 
    font-weight: bold;
    margin: 0px;
    margin-top: 10px;
    margin-bottom: 5px;

}

.hosting__cards--descrip {

    margin: 10px;
    line-height: 1.3;

}

.hosting__img {

    width: 100%;
    height: 155px; 
    border-radius: 25px 25px 0px 0px;
    object-fit: cover;
  
}

.hosting__text {

    margin-left: 0px;
    width: max-content;
    font-weight: bold;
    font-size: larger;
    letter-spacing: -1px;

}

/*__________________________________________________________________________*/





/*_______________________________________________________POPULAR CONTENT____*/

.popular {

    border-radius: 25px;
    padding: 50px;
    width: 25%;
    
}

.popular__title--icon { 
    
    display: flex;
    align-items: center;
    justify-content: space-between;
    
}

.fa-chart-line:before {

    font-size: x-large;

}

.popular__links {

   width: 97%;

}

.popular__cards {

    margin-right: 0px;
    margin-left: 0px;
    margin-bottom: 50px;
    background-color: white; 
    padding: 4px;
    border-radius: 25px;
    box-shadow: 0 0 16px #0000002e;
    display: flex;
    
}

.popular__cards--titles {

    font-size: 1.15em; 
    font-weight: bold;
    margin: 0px;
    margin-top: 10px;
    margin-bottom: 5px;
      
}



.popular__cards--descrip {

    line-height: 1.3;
    margin-left: 20px;
   
}

.popular__img { 

    width: 40%;
    height: 158px;
    border-radius: 25px 0px 0px 25px;
    object-fit: cover;

}


/*__________________________________________________________________________*/




/*__________________________________________________ACTIVITIES____CONTENT___*/ 

.activities {

    width: 100%;
    margin-top: 50px;
    margin-bottom: 50px;
    
}

.activities__title {

    margin-left: 0px;
    margin-top: 65px;

}

.activities__cards--container1 { /*All cards*/

    display: flex;
    justify-content: space-between;
    margin-top: -10px;

}



.activities__cards--descrip {

    font-size: 1.15em;
    font-weight: bold;
    margin-left: 20px;
    margin-top: 15px;

}
.activities__links1 {

    width: 23%;
    
}

.activities__cards1 {

    
    height: 665px;
    margin-left: 0px;
    margin-right: 0px; 
    border-radius: 25px;
    box-shadow: 5px 5px 5px 1px #F2F2F2;
    
}

.activities__img1 {

    width: 100%;
    height: 606px;
    border-radius: 25px 25px 0px 0px;
    object-fit: cover;

}

.activities__cards--container2,.activities__links2 { /* cards 2-3 & 4-5 */

    width: 23%

   

}

.activities__cards2 {

    width: 100%;
    height: 380px;
    margin-left: 0px;
    margin-right: 0px;
    border-radius: 25px;
    box-shadow: 5px 5px 5px 1px #F2F2F2;
    margin-bottom: 55px;
    
}

.activities__img2 {

    width: 100%;
    height: 320px;
    border-radius: 25px 25px 0px 0px;
    object-fit: cover;

}

.activities__cards3 {

    width: 100%;
    height: 230px;
    margin-left: 0px;
    margin-right: 0px;
    border-radius: 25px;
    box-shadow: 5px 5px 5px 1px #F2F2F2;
    margin-bottom: 40px;
    
}

.activities__img3 {

    width: 100%;
    height: 170px;
    border-radius: 25px 25px 0px 0px;
    object-fit: cover;

}

.activities__cards4 {

    width: 100%;
    height: 320px;
    margin-left: 0px;
    margin-right: 0px;
    border-radius: 25px;
    box-shadow: 5px 5px 5px 1px #F2F2F2;
    margin-bottom: 61px;

}

.activities__img4 {

    width: 100%;
    height: 260px;
    border-radius: 25px 25px 0px 0px;
    object-fit: cover;

}

.activities__cards5 {

    width: 100%;
    height: 285px;
    margin-left: 0px;
    margin-right: 0px;
    border-radius: 25px;
    box-shadow: 5px 5px 5px 1px #F2F2F2;
    margin-bottom: 60px;
    
}

.activities__img5 {

    width: 100%;
    height: 225px;
    border-radius: 25px 25px 0px 0px;
    object-fit: cover;

}

/*__________________________________________________________________________*/




/*______________________________________________________FOOTER____CONTENT___*/ 

footer {
    
    width: 100%;
    height: 220px;
    display: flex;
    align-items: center;
    padding: 0px;
    
}

li {

    list-style: none;

}

.footer__title {

    font-weight: bold;
    font-size: large;
    margin-top: 55px;
    margin-bottom: 10px;
    margin-left: 25px;

}

.footer__links {

    margin-left: 25px;
    font-weight: inherit;

}

.footer__links:hover {

    color: #0065FC;
    box-shadow: 5px 5px 5px 1px #F2F2F2;

}

.footer__links--container1,.footer__links--container2,.footer__links--container3 {    

    width: 30%;
    line-height: 1.7;
    height: 200px;
    
}


/*__________________________________________________________________________*/