:root {
    --dove-gray: rgba(112, 112, 112, 1);
    --jaguar: rgba(8, 1, 21, 1);
    --licorice: rgba(21, 19, 19, 1);
    --mercury: rgba(231, 228, 237, 1);
    --rich-gold: rgba(163, 83, 14, 1);
    --white-pointer: rgba(252, 250, 255, 1);
    --header-text: #FFCC00;
    --super-grey: #6c757d;
    --svj-blue: rgb(48, 152, 243);
    --cool-blue: rgb(116 177 231);
  }


@import url('https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap');

/* @font-face {
    font-family: "Architects Daughter";
    font-weight: 1 1000;
    src: url('https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap');
} */

.logo {
    height: 60px
}

.topbarshadow {
    border: 0px solid transparent;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    background: #EDEDED;
}

.tbar {
    margin-top: 100px;
}

.topbar-40px {
    color: var(--jaguar)!important;
    font-family: "Architects Daughter", Arial, serif;
    font-size: 40px;
    font-style: normal;
    font-weight: 400;
}

.topbar-30px {
    color: var(--jaguar)!important;
    font-family: "Architects Daughter", Arial, serif;
    font-size: 30px;
    font-style: normal;
    font-weight: 200;
}

.tbar-left {
    margin-left: auto;
}

#hm {
    color: inherit;
    text-decoration: inherit;
}

/* .template-contactpage {
    text-rendering: optimizeLegibility;
    background-color: rgb(48, 152, 243) !important;
} */

.notfound-emoji {
    text-align: center;
    font-size: 150px;
    color: var(--jaguar);
    font-family: 'Didact Gothic', Arial, sans-serif;
    font-style: normal;
    font-weight: 275;
}

.btn-30px {
    font-family: "Architects Daughter", Architects Daughter, Arial, serif;
    font-size: 30px;
    font-style: normal;
    font-weight: 200;

    background-color: var(--header-text);
    color:  var(--jaguar);
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    border: 2px solid var(--jaguar);
    border-radius: 10px;
    width: 202px;
}

.Oops-txt {
    color: var(--jaguar);
    font-size: 40px;
    font-family: 'Didact Gothic', Arial, sans-serif;
    font-style: normal;
    font-weight: 225;
}

.btn-outline-warning {
    border-color: transparent;
    color: #ffc107;
}

.btn-outline-warning:hover {
    border-color: #ffc107 !important;
    background-color: transparent !important; 
}

/* padding 14 35 */
.size {
    padding: 20px 35px;
    width: 110px;
    border-radius: 10px;
  }
  
  nav ul {
    gap: 5px;
  }
  
  nav ul li .nav-col {
    text-decoration: none;
  }

  .center-txt {
    text-align: -webkit-center;
  }

  .svj-button-c {
    background-color: var(--header-text);
    color:  var(--jaguar);
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    border: 2px solid var(--jaguar);
    border-radius: 10px;
}

.svj-button-c:hover {
    background-color: var(--mercury);
    border-color: var(--svj-blue);
    border: 2px solid var(--jaguar);
}

.svj-cool-button {
    background-color: var(--cool-blue);
    color:  var(--jaguar);
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    border: 2px solid var(--jaguar);
    border-radius: 10px;
}

.svj-cool-button-sm {
    background-color: var(--cool-blue);
    color:  var(--jaguar);
    padding: 7px 15px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    border: 2px solid var(--jaguar);
    border-radius: 10px;
}


.dropdown-item.active {
    background-color: var(--cool-blue) !important; /* Green background */
    color: white !important;
}


.badge.bg-info {
    border-radius: 10px; /* Adjust the border-radius */
    border: 2px solid var(--jaguar); /* Change border color */
    padding: 5px 10px; /* Adjust padding for better appearance */
    color:  var(--jaguar);
}

.badge.bg-warning {
    border-radius: 10px; /* Adjust the border-radius */
    border: 2px solid var(--jaguar); /* Change border color */
    padding: 5px 10px; /* Adjust padding for better appearance */
    color:  var(--jaguar);
}

.badge.bg-success {
    border-radius: 10px; /* Adjust the border-radius */
    border: 2px solid var(--jaguar); /* Change border color */
    padding: 5px 10px; /* Adjust padding for better appearance */
    color:  var(--jaguar);
}

.badge.bg-danger {
    border-radius: 10px; /* Adjust the border-radius */
    border: 2px solid var(--jaguar); /* Change border color */
    padding: 5px 10px; /* Adjust padding for better appearance */
    color:  var(--jaguar);
}
