/* Dropdown list tasarım */
.dropdown-item:focus {
    background-color: black !important;
    color: white !important;
}

.dropdown-item:hover {
    background-color: white !important;
    color: black !important;
}

/* Genel sayfa tasarımı */


#topbar {

    color: black !important;


}



:root {
    --mainColor: rgb(18, 53, 74);
    --mainimage: url('images/mainpage/anasayfa3.png');
    --productsBack: url('images/products-background.png');
    --servicesBack: url('images/services-background.png');
    --mainLogo: url('./images/logo/rfpi_logo_webicin3.svg');
    --newsImages: url('/images/news/rrysersonphoto.jpeg');

}


.topbar-container {
    margin-top: .9rem;
    margin-bottom: .9rem;

}

/* .topbar-container a {
    color: white !important;


} */

.topbar-container a:hover {
    color: black !important;

}

.topbar-container span {
    color: var(--mainColor);
    font-size: 1.5rem;
}

.topbar-container img {

    margin-left: .5rem;
    width: 15%;
    height: auto;
}



#textes {
    padding-bottom: .5rem;
    margin-top: .5rem;
    margin-bottom: .5rem;
    margin-right: 2rem;
    margin-left: auto;
    float: right;
    color: var(--mainColor);
    font-size: 1vw;
    font-family: 'Roboto',
        sans-serif;

}

#textes p {
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: .8em !important;
    display: inline-block;
}

#buttons {
    padding-bottom: .5rem;

    background-color: var(--mainColor);
    color: white;
    /* border: 3px solid; */
    margin-top: .5rem;
    margin-bottom: .5rem;
    margin-right: .5rem;
    float: right;

}



#buttons:hover {
    background-color: white;
    color: black;

}



#colorButton {
    background-color: var(--mainColor);
}

@media only screen and (max-width: 1124px) {
    #textes {
        padding-bottom: .1rem;
        margin-top: .1rem;
        margin-bottom: .1rem;
        margin-right: .2rem;
        margin-left: auto;
        float: right;
        /* color: rgb(102, 31, 2); */
        font-size: .5rem;
        display: none;
    }

    #buttons {

        padding-bottom: .3rem;
        /* background-color: white;
                color: black; */
        border: .1rem solid;
        margin-top: .1rem;
        margin-bottom: .1rem;
        margin-right: .2rem;
        float: right;
        text-align: center;
        display: none;


    }



    #mainimageontext {
        font-size: 100% !important;
    }

}

@media (max-width: 1400px) {

    .topbar-container {
        padding-right: 2em !important;
        padding-bottom: 2em !important;
    }
}




#researchertext>p {
    font-family: 'Roboto',
        sans-serif;
    font-weight: bold;
    font-size: .4rem;

}





@media (min-width: 768px) {}

/* navbar */

.navbar {
    background-color: rgb(18, 53, 74) !important;
}

.navbar a {
    color: aliceblue !important;
    margin-left: .2rem;
    padding-inline-end: 3rem !important;
}




/* Navbar textes*/
.navbar a {

    font-family: 'Spartan', sans-serif;
    font-size: large;
    /* font-weight: bolder; */
}


/* Researcher Text  */

#researchertext>p {
    font-family: 'Roboto',
        sans-serif;
    font-weight: bold;
    font-size: 1rem;
}

@font-face {
    font-family: HelveticaNowDisplayXBlk;
    src: url("fonts/HelveticaNowDisplayXBlk.otf") format("opentype");
}

/* MainPage Design */

.about-button {

    display: none !important;
    visibility: hidden;

}

.about-button-active {

    width: 20vw !important;
    border-radius: 10px;
    background-color: rgb(18, 53, 74);
    font-size: 2vw;
    visibility: visible;

}



#mainSlider {
    margin-top: 1% !important;
}

/* .mainimage {
    height: 30vw;
    min-height: 500px;
    background-image: var(--mainimage);
    object-fit: cover;
    background-size: 100% 100%;
    background-size: contain; 
    background-position: center;
    background-repeat: no-repeat;
    margin-top: .1rem;
    background-attachment: fixed; 
    background-color: rgba(255, 255, 255, 0);
    background-blend-mode: lighten;


} */

.carousel-content-left {
    position: absolute;
    left: 5%;
    top: 50%;
    color: white;
    font-size: 3vw;

}

.carousel-content-right {
    position: absolute;
    right: 5%;
    top: 50%;
    color: white;
    font-size: 3vw;
}

#carouselTextes {
    color: white;
    font-weight: bold;
    font-size: 3vw;
    font-family: 'Segoe UI', sans-serif !important;

}


.mainseperator {
    border: none;
    border-top: 3px double #333;
    color: black !important;
    overflow: visible;
    text-align: center;
    height: 5px;

}

.mainseperator:after {
    background: #fff;
    content: url('images/lungs.png');
    padding: 0 4px;
    position: relative;
    top: -13px;
}


.imageontext {
    visibility: hidden;
    background-color: black;
    opacity: 0.5;
    float: left;
    height: 15vh;
    text-align: center;
    margin-top: inherit;
    width: 50%;
    transform: translateY(180%);

    /* border-top-right-radius: 25px; */

}

.imageontext p {
    font-size: medium;
    color: whitesmoke
}


#mainimagebuttonright {
    position: absolute;
    left: 95%;
    top: 35%;
    color: white;
    font-size: 3rem;
    cursor: pointer;

}

#mainimagebuttonleft {
    position: absolute;
    left: 5%;
    top: 35%;
    color: white;
    font-size: 3rem;
    cursor: pointer;
}


.mainimage button {
    /* visibility: hidden; */
    background: none;
    border: none;
    color: white;
}

#mainimageLogo {
    position: absolute;
    left: 8%;
    top: 15%;
}

#mainimageLogo img {
    width: 11%;
    float: left;

}

#mainimageontext {
    font-size: 2em;
}

/* Footer Design */
.endofpage img {
    /* background-image: url('images/mainpage/footer.png');
    background-size: 30vw; */
    width: 100%;
    height: auto;

}

.endofpage {
    position: relative;
    width: 100%;
    height: 100%;
}


.container-footer-image-text {
    position: absolute;
    color: white;
    font-size: 2vw;
    width: 100%;
    height: 100%;


}

.footer-grid {
    height: 10vw;
    width: auto;
    padding: 2vw !important;


}

.footer-grid h1 {
    font-size: 2vw;

}

.footer-grid h3 {
    font-size: 1vw;


}

.footer-grid-logo {
    margin-top: 10vw;

}

.footer-grid-logo img {
    width: 30vw;
    height: auto;

}

.endofpage a {
    text-decoration: none;
    color: white;

}

.endofpage a:hover {
    text-decoration: none;
    color: white;

}

.footer-grid h3:hover {
    width: 10vw;
    background-color: white;
    color: black;

}


.footer-top {
    border-bottom: 1px solid black;
    margin-bottom: 1%;
}

/* Map */
.map {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;

}

.map iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

/* Products Bar */

.products {

    background: var(--productsBack);
    /* background-repeat: no-repeat; */
    background-repeat: no-repeat;
    background-size: 100% 100%;
    object-fit: cover;
    background-position: center;
}

.products p {
    font-family: Calibri;
    font-size: 2.5vw;
    padding-left: 1vw;

}

.products img {
    width: auto;
    height: 15vw;

}

/* Services Bar */

.services {

    background: var(--servicesBack);
    /* background-repeat: no-repeat; */
    background-repeat: no-repeat;
    background-size: 100% 100%;
    object-fit: cover;
    background-position: center;

}

.services p {
    font-family: Calibri;
    font-size: 3vh;
    /* padding-left: 1em; */

}

.services img {
    width: auto;
    height: 11vw;


}

.services .row {
    padding-left: 0 !important;
}


/* Teams */
#popoverImage {
    text-decoration: none;
}

.popover__title {
    font-size: 24px;
    line-height: 36px;
    text-decoration: none;
    color: rgb(228, 68, 68);
    text-align: center;
    padding: 15px 0;
}

.popover__wrapper {
    position: relative;

    display: inline-block;
}

.popover__content {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    left: -150px;
    transform: translate(0, 10px);
    background-color: #bfbfbf;
    padding: 1.5rem;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    width: auto;

}

.popover__content p {

    color: rgb(18, 53, 74) !important;

}

.popover__content:before {
    position: absolute;
    z-index: -1;
    content: "";
    right: calc(50% - 10px);
    top: -8px;
    border-style: solid;
    border-width: 0 10px 10px 10px;
    border-color: transparent transparent #bfbfbf transparent;
    transition-duration: 0.3s;
    transition-property: transform;

}

.popover__wrapper:hover .popover__content {
    z-index: 10;
    opacity: 1;
    visibility: visible;
    transform: translate(0, -20px);
    transition: all 0.5s cubic-bezier(0.75, -0.02, 0.2, 0.97);
}

.popover__message {
    text-align: center;

}