/* All */
*{
    margin: 0px;
    padding: 0px;
    text-decoration: none;
    list-style: none;
    box-sizing: border-box;
}

a:link {
  text-decoration: none;
}

a:visited {
  text-decoration: none;
}

body{
    /* background: linear-gradient(45deg,transparent 34%, #b87848 35%, #b87848 40%, transparent 41%, transparent 59%, #b87848  60%, #b87848 65%, transparent 66%),linear-gradient(135deg,transparent 34%, #b87848 35%, #b87848 40%, transparent 41%, transparent 59%, #b87848  60%, #b87848 65%, transparent 66%);
    background-size: 1em 1em;
    background-color: #ffffff;
    opacity: 1 */
    background: #ffffff;
    /* background: #f7f3eb; */
}

#page-container {
  position: relative;
  min-height: 98vh;
}

#content-wrap {
  padding-bottom: 5rem;    /* Footer height */
}

#footer {
  background-color: rgba(255, 255, 255);
  border-top: 0px solid;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 4rem;            /* Footer height */
}

.footer {
  border-top: 0.25px solid;
}

.intro-avatar{
    background-color: antiquewhite;
}

.comingsoon{
    background-color: #ffffff;
    font-family: "poppins", sans-serif;
    font-size: 10vw;
    font-weight: 700;
    font-style: normal;
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    border: 2px solid black;
    box-shadow: 3px 3px;
}

  
/* Header bar */
.navbar{
    background-color: rgba(255, 255, 255, 0);
    border-bottom: 0px solid;
}

.navbar-inner{
    background-color: rgba(255, 255, 255, 0);
    border-bottom: 0.25px solid;
}

/* Alperen Yayla writing */
.navbar-brand{
    font-size: 2rem;
    border-bottom: 0px solid;
    font-family: "granville", sans-serif;
    font-weight: 900;
    font-style: normal;
}

.bi{
    font-size: 2rem;
    color: #000000;
}

/* Navigation */
.navbar-nav{
    font-family: "granville", sans-serif;
    font-weight: 400;
    font-style: normal;
    border-bottom: 0px solid;
}

/* Navigation links */
.nav-link{
    color: #000000;
}

/* Navigation links shadow */
.nav-link:hover{
    color: #ce521c;
}

.active-nav {
    color: #000000;  /* Change this to your desired color */
    font-weight:600;
}

.introduction-text{
    font-family: "forma-djr-display", sans-serif;
    font-weight: 500;
    font-style: normal;
    color: #000000;
    letter-spacing:0.075cap;
}

.main-title{
    font-family: "forma-djr-display", sans-serif;
    font-weight: 600;
    font-style: normal;
    border-bottom: 0px solid;
}

.main-title-publication{
    font-family: "forma-djr-display", sans-serif;
    font-weight: 600;
    font-style: normal;
    border-bottom: 0px solid;
}

.main-title-border{
    border-bottom: 0.25px solid;
}

.main-click-title{
    font-family: "forma-djr-display", sans-serif;
    font-weight: 600;
    font-style: normal;
    border-bottom: 0px solid;
    color: #dad6d6;
}

.main-click-title:hover{
    font-family: "forma-djr-display", sans-serif;
    font-weight: 600;
    font-style: normal;
    border-bottom: 0px solid;
    color: #ddb5b5;
}

.contact-text{
    font-family: "forma-djr-display", sans-serif;
    font-weight: 500;
    font-style: normal;
    border-bottom: 0px solid;
    letter-spacing:0.075cap;
}


.footer-text{
    font-family: "forma-djr-display", sans-serif;
    font-weight: 500;
    letter-spacing: 0.001cap;
    font-style: normal;
    border-bottom: 0px solid;
    color: #000000;
    
}

/* .email-click{
    color: #ff0000;
} */

.email-click:hover{
    color: #ff3300;
}

.card-index{
    background-color: #ffffff;
    border-radius: 0%;
    border: 0.25px solid #000000;

}

.card{
    background-color: #ffffff;
    border-radius: 0%;
    border: 0px solid #6d6b6b;
}

.card-title{
    border-radius: 0%;
    border: 0px solid #dad6d6;
    font-family: "forma-djr-display", sans-serif;
    font-weight: 700;
    font-style: normal;
    border-bottom: 0px solid;
}

.card-text{
    font-family: "granville", sans-serif;
    font-weight: 500;
    font-style: normal;
    border-bottom: 0px solid;
}


.card-1{
    background-color: #ffffff;
}

.middle-pattern{
    height: 100px;
    background-color: #ffffff;
    opacity: 0.8;
    background-image:  repeating-linear-gradient(45deg, #ce521c 25%, transparent 25%, transparent 75%, #ce521c 75%, #ce521c), repeating-linear-gradient(45deg, #ce521c 25%, #ffffff 25%, #ffffff 75%, #ce521c 75%, #ce521c);
    background-position: 0 0, 10px 10px;
    background-size: 20px 20px;
}

/* Show tooltip on hover */
.tooltip-box:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}


.s-home{
    background-color: rgb(237, 207, 163);
}

.s-research{
    background-color: rgb(222, 237, 197);
}

.s-design{
    background-color: rgb(244, 243, 193);
}



/* Base styling for square boxes */
.square {
    width: 50px;
    height: 50px;
    border: 0px solid rgb(255, 255, 255);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition: all 0.3s ease-in-out;
    white-space: nowrap;
    overflow: hidden; /* Hide overflowing text */
    text-align: center;
    font-family: "forma-djr-display", sans-serif;
    font-weight: 600;
    font-style: normal;
}

/* Hover effect: Enlarge the square */
.square:hover {
    width:fit-content;

    height: 50px;
}

.latest-title-link{
    color: #ff0000;
}

/* Hide full text initially */
.full-text {
    display: none;
    white-space: nowrap;
    text-align: left;

}

/* Show full text and hide short text on hover */
.square:hover .short-text {
    display: none;
    text-align: left;
}

.square:hover .full-text {
    display: inline-block;
    text-align: left; /* Left-align full text on hover */
    padding-left: 10px; /* Optional: Add a small padding for better appearance */
    width: 100%; /* Allow the full-text span to take up full width of the container */
}

.publication-body{
    border-bottom: 0px solid black;
}

.publication-text{
    border-bottom: 0.25px solid rgb(226, 216, 216);
    font-family: "forma-djr-display", sans-serif;
    font-weight: 500;
    font-style: normal;
    letter-spacing: 0.075cap;
}

.publication-text-last{
    border-bottom: 0px solid rgb(226, 216, 216);
    font-family: "forma-djr-display", sans-serif;
    font-weight: 500;
    font-style: normal;
    letter-spacing: 0.075cap;
}

.publication-info{
    font-family: "forma-djr-display", sans-serif;
    font-weight: 500;
    font-style: normal;
    letter-spacing: 0.075cap;
}

.research-profiles{
    color: #ce521c;
    font-family: "forma-djr-display", sans-serif;
    font-weight: 500;
    font-style: normal;
    letter-spacing: 0.075cap;
}


.journal-name{
    color: #0033ff;
    font-family: "forma-djr-display", sans-serif;
    font-weight: 500;
    font-style: italic;
    letter-spacing: 0.075cap;
}


.img-main{
    border: 1px solid black;
}

.card-img-top{
    border-radius: 0%;
}

.btn-title{
    color: #0033ff;

}

.btn-inline{
    color: #ce521c;

}

.navigation-text{
    color: #ce521c;
    font-family: "forma-djr-display", sans-serif;
    font-weight: 500;
    font-style: normal;
}

.navigation-text-showhide{
    color: #0022ff;
    font-family: "forma-djr-display", sans-serif;
    font-weight: 500;
    font-style: normal;
}

.basic-link{
    color: #0033ff;
}
