/* css variable
 background-color: var(--my-white-background-color);
 
 Dark Background::
 background-color: var(--my-background-color);
 color: var(--my-text-color);
 color: var(--my-text-color-darker);

*/


:root {
  --my-background-color : #031c2b;
  --my-white-background-color : #cfd6e7;
  --my-text-color:  #e5d7d7; 
  --my-text-color-darker:  #534646; 
 
}


body {
  font-family: "Rajdhani";
  /* font-style: italic; */
  /* font-optical-sizing: auto; */
  font-weight: 400;
  /* font-style: normal; */
  margin-right: none;
  background-color: var(--my-white-background-color);
}


article {
  text-align: left;
  color: #9b9797;
}

.btn {
  /* background-color: #052a3f; */
  background-color: var(--my-background-color);
  margin-top: 1.2%;
  
}

a {
  /* color: var(--my-text-color-darker); */
  color: var(--my-background-color);
  text-decoration: none !important;
}

a:hover {
  color: #2174b4;
  text-decoration: none !important;
}




/* Navbar */


#navbarIndex{
  background-color: var(--my-background-color);
  padding: 0%;
  margin-right: 0%;
}

.navbar-brand{
  color: rgb(192, 213, 213);
  font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
  font-size: 1.8rem;
}




/* Modify the background color */
.navbar-custom {
  /* background-color: #87b3cc; */
  background-color: var(--my-background-color);
}

.navbar-custom .navbar-brand {
  color: #efe7e7;
}

.navbar-custom .navbar-text {
  color: #f4e9e9;
  
}

/* Set the border color */

.custom-toggler.navbar-toggler {
  border-color: #0e3458;
  color: #b8cdd8;
  
}

.custom-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(239, 231, 231, 0.8)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.nav-item :active {
  color: #8e99a3;
}

.nav-link {
  color: #b9b9c7;
  font-size: 1.2em;
}

.dropdown-menu{
  background-color: var(--my-white-background-color);
}
.dropdown-item{
  color: #363739;
  font-size: 1.2em;

}
.dropdown-item:hover {
  color: #111315;
  background-color: #b1bed2;
}


/* Text after navbar */


#textInAboutMe {
  background-color: var(--my-background-color);
}

#textInAboutMe p {
  font-size: 1.2em;
  color: var(--my-text-color);
}

#textInAboutMe a {
  color:#8e99a3;
}

main {
  background-color: var(--my-background-color);
  padding-top: 25%;
}

#photosUnderDescription {
  background-color: var(--my-white-background-color);
  margin-top: 2%;
}

.btn {
  background-color: var(--my-background-color);
  margin-top: 1.2%;
}

.navbar {
  background-color: var(--my-background-color);
}

#photoAndButtonAutomationsAndRobotics {
  text-align: center;
}

#photoAndButtonMobileRobots {
  text-align: center;
}

#photoAndButtonSoftwareDevelopment {
  text-align: center;
}

img {
  margin-top: 0.1%;
  margin-bottom: 2%;
  transition: all 2s, transform 0.5s, box-shadow 0.5s;
  border-radius: 3%;
}

img:hover {
  box-shadow: 6px 6px 20px rgba(0, 0, 0, 0.6);
  transform: scale(1.02);
}

img:focus {
  box-shadow: 12px 12px 25px rgba(0, 0, 0, 0.7);
  width: 86%;
  transform: none;
}

footer {
  background-color: var(--my-white-background-color);
  text-align: center;
  font-size: 1em;
  padding-bottom: 0.5%;
}

#linkedInFooter {
  margin-left: 2%;
  margin-right: 2%;
}

.bi {
  margin-top: 1%;
}
h1 {
  font-size: 1.6em;
  color: var(--my-text-color);
  padding-bottom: 0.5%;
}