h2{
    color:white !important;
}

.titles {
    position: relative;
    margin-top: 0; /* Remove any negative margin */
    padding-top: 0;
    padding:0 !important;
    width:60%;
}

/* Specific title adjustments (if necessary) */

#title1{
    margin-top:0%;
}


#title2{
    margin-top:0%;
}

#title3 {
    margin-top:0%;
    
}


#title4 {
    margin-top:0%;
    
}

#section1{
    padding-top:2%;
}

#section2{
    display:flex;
    flex-direction:row;
}

/* Container adjustments */
#section2FirstContainer {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: flex-start; /* Align items to start for consistency */
}

#section2SecondContainer{
    display:flex;
    flex-direction:column;
    width:40%;
    text-align:center;
    justify-content:center;
    padding-bottom:5%;
    
}


.paragraphNextPills{
 gap:40px !important;   
}


.pills{
    width:64%;
    margin:auto;
}


#section4Container{
    display:flex;
    flex-direction:row;
}

#section4LeftContainer{
    width:45%;
    display:flex;
    justify-content:center;
}

#section4RightContainer{
    width:45%;
    display:flex;
    justify-content:center;
    text-align:left;
}


#vitruvian{
    width: 80%; /* Adjusts the width to the container size */
    max-width: 500px; /* Prevents the image from exceeding 500px */
    height: auto; /* Maintains the aspect ratio */
}

#section5{
    padding-top:3%;
}

.gayeHaritasi{
    padding-top:1% !important;
}

#title5{
    color:#e9004c !important;
    margin-top:-3%;
}


#section7{
    padding-top:2%;
    padding-bottom:5%;
}
#endingMotto{
    color:white;
    font-size:45px;
    font-weight:200;
    padding-left:10%;
    padding-right:10%;
}

#quoteOpen{
    position:absolute;
    width:100px;
}

#quoteClose{
    position:absolute;
    width:100px;
    margin-top:8%;
    margin-left:70%;
}

@media screen and (max-width:1600px) and (min-width:1300px){
    #endingMotto{
    font-size:35px;
}
#quoteOpen,#quoteClose{
    width:60px;
}


h3 {
    font-size: 40px;
 
}
    
}




@media screen and (max-width:1300px) and (min-width:1000px){
    #endingMotto{
    font-size:35px;
}
#quoteOpen,#quoteClose{
    width:60px;
}


h3 {
    font-size: 35px;
 
}

#section2{
    flex-direction:column;
}

#section2SecondContainer{
    width:100%;

}
.pills{
    width:40%;
    margin:auto;
}

#section4Container{
   
    flex-direction:column;
}

#vitruvian{
    width: 70%; /* Adjusts the width to the container size */
    max-width: 400px; /* Prevents the image from exceeding 500px */
    height: auto; /* Maintains the aspect ratio */
}


#section4LeftContainer{
    width:100%;
    display:flex;
    justify-content:center;
}

#section4RightContainer{
    width:100%;
    display:flex;
    justify-content:center;
    text-align:left;
}

#endingMotto{
    font-size:30px;
 
}

#quoteClose{
    position:absolute;
    width:100px;
    margin-top:8%;
    margin-left:80%;
}

#quoteOpen,#quoteClose{
    width:40px;
}
}


@media screen and (max-width:1000px) and (min-width:300px){

p{
    padding-left:0;
}

#endingMotto{
    font-size:35px;
}
#quoteOpen,#quoteClose{
    width:60px;
}

.titles{
    width:100%;
}


h3 {
    font-size: 25px;
    line-height:40px;
}

#section2{
    flex-direction:column;
}

#section2SecondContainer{
    width:100%;

}
.pills{
    width:40%;
    margin:auto;
}

#section4Container{
   
    flex-direction:column;
}

#vitruvian{
    width: 60%; /* Adjusts the width to the container size */
    max-width: 300px; /* Prevents the image from exceeding 500px */
}

#section4LeftContainer{
    width:100%;
    display:flex;
    justify-content:center;
}

#section4RightContainer{
    width:100%;
    display:flex;
    justify-content:center;
    text-align:left;
}

#endingMotto{
    font-size:20px;
    line-height:30px;
 
}

#quoteClose{
    position:absolute;
    width:100px;
    margin-top:13%;
    margin-left:87%;
}

#quoteOpen,#quoteClose{
    width:40px;
}
}

@media screen and (max-width:600px) and (min-width:300px){
    .titles {
    width:100%;
}


#quoteOpen,#quoteClose{
    width:20px;
}


}

@media screen and (max-width:1300px) and (min-width:300px){
    #section4LeftContainer{
        padding-bottom:5%;
    }}