/* FONT */
@font-face {
    font-family: swikif;
    font-weight: 100;
    font-style: normal;
    src: url(https://static.igem.wiki/teams/5162/montserrat-thin.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 100;
    font-style: italic;
    src: url(https://static.igem.wiki/teams/5162/montserrat-thinitalic.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 200;
    font-style: normal;
    src: url(https://static.igem.wiki/teams/5162/montserrat-extralight.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 200;
    font-style: italic;
    src: url(https://static.igem.wiki/teams/5162/montserrat-extralightitalic.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 300;
    font-style: normal;
    src: url(https://static.igem.wiki/teams/5162/montserrat-light.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 300;
    font-style: italic;
    src: url(https://static.igem.wiki/teams/5162/montserrat-lightitalic.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 400;
    font-style: normal;
    src: url(https://static.igem.wiki/teams/5162/montserrat-regular.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 400;
    font-style: italic;
    src: url(https://static.igem.wiki/teams/5162/montserrat-italic.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 500;
    font-style: normal;
    src: url(https://static.igem.wiki/teams/5162/montserrat-medium.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 500;
    font-style: italic;
    src: url(https://static.igem.wiki/teams/5162/montserrat-mediumitalc.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 600;
    font-style: normal;
    src: url(https://static.igem.wiki/teams/5162/montserrat-semibold.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 600;
    font-style: italic;
    src: url(https://static.igem.wiki/teams/5162/montserrat-semibolditalic.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 700;
    font-style: normal;
    src: url(https://static.igem.wiki/teams/5162/montserrat-bold.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 700;
    font-style: italic;
    src: url(https://static.igem.wiki/teams/5162/montserrat-bolditalic.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 800;
    font-style: normal;
    src: url(https://static.igem.wiki/teams/5162/montserrat-extrabold.off) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 800;
    font-style: italic;
    src: url(https://static.igem.wiki/teams/5162/montserrat-extrabolditalic.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 900;
    font-style: normal;
    src: url(https://static.igem.wiki/teams/5162/montserrat-black.woff) format("woff");
}

@font-face {
    font-family: swikif;
    font-weight: 900;
    font-style: italic;
    src: url(https://static.igem.wiki/teams/5162/montserrat-blackitalic.woff) format("woff");
}

@font-face {
    font-family: swikif22;
    font-weight: 400;
    font-style: normal;
    src: url(https://static.igem.wiki/teams/5613/font/a.woff) format("woff");
}

/* FONT */

body {
    padding-top: 56px;
}

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

/* CALLOUT */
.bd-callout {
    padding: 1.25rem;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    border: 1px solid #e9ecef;
    border-left-width: .25rem;
    border-radius: .25rem
}

.bd-callout h4 {
    margin-bottom: 1.25rem
}

.bd-callout p:last-child {
    margin-bottom: 0
}

.bd-callout code {
    border-radius: .25rem
}

.bd-callout+.bd-callout {
    margin-top: -.25rem
}

.bd-callout-info {
    border-left-color: #5bc0de
}

.bd-callout-warning {
    border-left-color: #f0ad4e
}

.bd-callout-danger {
    border-left-color: #d9534f
}

.sp {
    font-family: swikif22;
}

.dn {
    display: none;
}

.fu {
    width: 100% !important;
}

.hs span {
    color: var(--william);
    /* font-size: 3rem !important; */
    font-weight: 700;
}

.hs h1 {
    font-weight: 300;
}

footer a {
    color: lightblue;
    text-decoration: underline;
}

footer a:hover {
    color: white;
    font-weight: bold;
}

footer a:visited {
    color: lightcyan;
    text-decoration: underline;
}

footer {
    background-color: var(--george) !important;
    color: white !important;
    font-family: swikif;
    /* font-family: swikif22; */
    position: relative;
    text-align: center;
    align-items: center;
    justify-content: center;
    height: 42rem;
    font-weight: 100 !important;
    /* font-style: italic; */

}

body {
    font-weight: 300;
}

.footerc {
    text-align: center !important;
}

/* COLOURCODES */
:root {
    --charles: #000000;
    --edward: #510000;
    --george: #590000;
    --henry:#590000;
    /* --henry: #8d1111; */
    --william: #a30000;
    --charlesii: #ffb7c5;
    --edwardii: #ffc5d0;
    --georgeii: #ffd3dc;
    --henryii: #fde4f1;
    --williamii: #fff7f9;
    /* 
Charles I of England - 1625 - 1649, Charles II of England - 1660 - 1683 
Edward I of England - 1272 - 1307, Edward II of England - 1307 - 1327
George I of Great Britain - 1714 - 1727, George II of Great Britain - 1727 - 1760
Henry I of England - 1100 - 1135, Henry II of England - 1154 - 1189
William I of England - 1066 - 1087, William II of England - 1087 - 1100 
193 - 197 : for the Demo Site
*/
}

/* COLOURCODES */
.underline {
    border-bottom: 1px solid white;
    display: block;
    width: 90%;
    margin: 0 auto;
}

body {
    font-family: swikif;
    background-color: var(--charles);
    color: white;
    padding-top: 56px;
}
.dbody{
    /* background-color: var(--williamii) !important;
    color: black !important;
    padding-top: 0px; */
}

.navbar {
    /* background: none; */
    border-radius: 15px;
    width: 67.5%;
    margin-left: auto;
    margin-right: auto;
    height: 84px;
}

#navbar {
    height: 84px;
}

.dropdown-menua {
    transition: all 250ms;
    background: var(--henry);
    border-radius: 0px 0px 20px 20px;
    padding-bottom: unset;
    outline: none;
    border: none;
}

.dropdown-menua>li>a:hover {
    background-image: none;
    background-color: var(--william);
    text-decoration: none !important;
    color: white !important;
    /* border-radius: 20px; */
}

.dropdown-itema {
    color: white;
    border-radius: 15px;

    padding: 7px 20px;
    /* background: var(--henry); */
    transition: all 250ms;
}

.dropdowna a {
    border-radius: 25px;
}

.dropdowna>a:hover {
    background-image: none;
    text-decoration: none !important;
    /* color: blue !important; */
    background-color: var(--william);
}

.navbar .nav-item:hover .dropdown-menua {
    display: block;
    transition-behavior: allow-discrete;
    transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out, display 500ms ease-in-out;
}

.nav-item>a>span {
    color: white;
}

.navbar .nav-item .dropdown-menua {
    display: none
}

.nav-item>a:hover {
    text-decoration: none
}

.dropdowna>a>span {
    padding: 2px 8px;
}

#navbarover {
    background: var(--henry);
    width: 100%;
    height: 84px;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding-top: .5rem;
    padding-bottom: .5rem;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1000;
    transition: top 0.3s;
}

.navbar-toggler {
    background: var(--henry);
    border: 2px solid white !important;
    color: white !important;
}

.navbar-collapse {
    width: 100%;
    background: var(--henry);
}

.navbar {
    /* background: none; */
    border-radius: 15px;
    width: 67.5%;
    margin-left: auto;
    margin-right: auto;
    height: 84px !important;
    background-color: var(--henry) !important;
    transition: top 0.3s;
}

nav a {
    transition: all ease-out 250ms;
}

.hkssc3 {
    /* background: var(--charles); */
    border-radius: 12px;
}

.st {
    color: darkblue;
    text-align: center;
}

.t {
    color: darkblue;
    text-align: center;
    font-weight: 700 !important;
}

.ho {
    position: relative;
    color: darkblue !important;
    /* background-color: var(--edward) !important; */
    background-color: black !important;
    font-weight: bold;
    background-image: url();
    background-repeat: no-repeat;
    background-size: 100% 100%;
    height: 100% !important;
    /* 57vw Adjust as needed, to height of photo, in relation to width, 100vw, in viewport-width's, kindly */
}

.a,
.c,
.con,
.d,
.de,
.ed,
.eng,
.ent,
.exp,
.ha,
.ho,
.hp,
.i,
.mea,
.mem,
.mo,
.n,
.p,
.r,
.s,
.so,
.su {
    font-weight: lighter;
    /* font-family: 'Courier New', Courier, monospace !important; */
    font-family: swikif !important;
    width: 100%;
    height: 25vw;
    margin-bottom: 1.5rem !important;
    background-color: var(--edward);
    font-weight: 200;
}

/* .mem {
    background-color: var(--george) !important;
} */
.row>.col-lg-12>h1 {
    color: white !important;
    font-weight: lighter;
    /* font-family: 'Courier New', Courier, monospace !important; */
    font-family: swikif !important;
    font-weight: lighter !important;
}

.fr a {
    text-decoration: none !important;
}

.fr {
    font-size: 1.5em;
}

.menu {
    position: sticky;
    top: 30px;
    height: 1px;
    /* THANK YOU SO MUCH FORUM SQUARESPACE */
    z-index: 10;
    font-size: 1.2rem;
    bottom: 0px;
    /*margin-bottom: 100vh;*/
    /* THANK YOU STACK OVERFLOW */
}

@media (max-width: 1199.98px) {
    .menu1 {
        display: none;
    }

    .col3m {
        width: 0% !important;
    }

    .col9m {
        width: 100% !important;
    }
}

/* I LOVE RESPONSIVE */
.col3m {
    flex: 0 0 auto;
    width: 25%;
}

.col9m {
    flex: 0 0 auto;
    width: 75%;
}

@media (max-width: 991.98px) {
    .im {
        width: 0 !important;
    }

    .dev {
        width: 100% !important;
    }
}

.menu1 {
    position: sticky !important;
    height: 1px;
    padding-bottom: 16em;
    position: -webkit-sticky;
    top: 95px;
}

.pbi {

    padding-bottom: 32em !important;
}

.active {
    color: darkblue !important;
    font-weight: bold;
    /* font-size: 95%; */
}

.menu1>div>ul>.nav-item>a {
    color: white !important;
    text-decoration: none !important;
}

table,
tr,
td {
    border: 1px solid white;
    border-collapse: collapse;
}

.sphere {
    border-radius: 50%;
    display: inline-block;
    display: inline-block;
    margin-right: 10px;
    height: 100%;
    aspect-ratio: 1 / 1;
    background-color: var(--henry);
}

.filledcontaining2spheres {
    background-color: var(--henry);
    display: flex;
    height: 200px;
    width: 100%;
}

.ce {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
    /* background-color: wheat !important; */
}

html,
body {
    max-width: 100vw;
    overflow-x: clip;
}

.pa {
    position: absolute;
}

.pr {
    position: relative;
}

.df {
    display: flex;
}

.taf {
    right: 0 !important;
    padding-right: 5%;
}

.tac {
    text-align: center !important;
}

.tar {
    left: 0 !important;
    padding-left: 5%;
}

header {
    margin-bottom: 5rem !important;
}

/* DRAGGABLE BUTTON */
.db {
    height: 72px;
    width: 72px;
    background-color: #ffffff;
    /* background: #525252; */
    background-image: linear-gradient(to bottom right, #ff00ff, #00ffff);
    border-radius: 50%;
    /* background: radial-gradient(circle at center, gray, black); */
    position: absolute;
    /* position: sticky; */
    top: 48px;
    left: 48px;
    cursor: pointer;
    display: flex;
    align-items: center !important;
    justify-content: center !important;
    z-index: 1000;
}
.db::before {
    content: '';
    position: absolute;
    top: -18px; /* Adjust to control shadow spread */
    left: -18px; /* Adjust to control shadow spread */
    right: -18px; /* Adjust to control shadow spread */
    bottom: -18px; /* Adjust to control shadow spread */
    z-index: -1; /* Places the shadow behind the button */
    background: radial-gradient(circle at center, #ff00ff, #00ffff, transparent 70%); /* Gradient colors and spread */
    filter: blur(36px); /* Blurs the gradient to create the shadow effect */
    border-radius: 75%px; /* Slightly larger than button's border-radius for smooth shadow */
    opacity: 0.7; /* Adjust shadow intensity */
}

.btna {
    position: sticky;
}
.oae h1 {
    /* font-weight: 700 !important; */
    text-shadow: 0 10px 10px white !important;
}
.db .btna {
    z-index: 1000;
    background: transparent !important;
    color: black;
    font-size: 36px;
    user-select: none;
    transition: all 250ms;
    text-align: center !important;
    border: none !important;
    font-weight: bold !important;
}

.db.active2 .btna {
    transform: rotateZ(45deg);
}

.db .bb,
.db .bs,
.db .bh {
    border: none !important;
    z-index: 1000;
    height: 48px;
    width: 48px;
    border-radius: 50%;
    /* background: #525252; */
    background: radial-gradient(circle at center, #ff00ff, #00ffff, transparent 70%);
    display: flex;
    align-items: center !important;
    justify-content: center !important;
    position: absolute;
    opacity: 0 !important;
    pointer-events: none;
    bottom: +12px;
}
.db .bb::before,
.db .bs::before,
.db .bh::before {
    content: '';
    position: absolute;
    top: -12px; /* Adjust to control shadow spread */
    left: -12px; /* Adjust to control shadow spread */
    right: -12px; /* Adjust to control shadow spread */
    bottom: -12px; /* Adjust to control shadow spread */
    z-index: -1; /* Places the shadow behind the button */
    background: radial-gradient(circle at center, #ff00ff, #00ffff, transparent 70%); /* Gradient colors and spread */
    filter: blur(15px); /* Blurs the gradient to create the shadow effect */
    border-radius: 12px; /* Slightly larger than button's border-radius for smooth shadow */
    opacity: 0.7; /* Adjust shadow intensity */
}

.db.active2 .bh {
    transform: translateX(36px);
    opacity: 1 !important;
    pointer-events: auto !important;
    /* left: +84px;     */
    transition: all 500ms;
}

.db.active2 .bs {
    transform: translateX(96px);
    opacity: 1 !important;
    pointer-events: auto !important;
    /* left: +144px; */
    transition: all 1000ms;
}

.db.active2 .bb {
    transform: translateX(156px);
    opacity: 1 !important;
    pointer-events: auto !important;
    /* left: +204px; */
    transition: all 1500ms;
}

/* DRAGGABLE BUTTON */
.veinticuatro {
    font-size: 24px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.spam img {
    margin: auto;
    padding: 56px;
}

.sdc div img:hover {
    text-decoration: none !important;
    background-color: black !important;
}

.aoeu {
    text-align: center !important;
    font-size: 1.5rem !important;
    font-weight: bold !important;
    border: wheat 3px solid !important;
    border-radius: 20px !important;
}

.sdc {
    background-color: black !important;
    border-radius: 20px !important;
    border: wheat 2px solid !important;
}

.row3 {
    flex: 0 0 auto;
    width: 300%
}

.sd:hover .sdc {
    display: block !important;
    /* transition: all 250ms; */
    /* display: flex; */
    justify-content: center;
    align-items: center;
    /* height: 100%; */
    /* width: 100%; */
}
.co-3{
    flex:0 0 auto;
    width:37.5%
}
/* COL DECIMAL */
.cd-05{
    flex:0 0 auto;
    width:5%
}
.cd-95{
    flex:0 0 auto;
    width:95%
}
.cd-02{
    flex:0 0 auto;
    width:2%
}
.cd-98{
    flex:0 0 auto;
    width:98%
}
.cd-1{
    flex:0 0 auto;
    width:10%
}
/* COL DECIMAL */
.cd-2 {
    flex: 0 0 auto;
    width: 20%
}

.cd-3 {
    flex: 0 0 auto;
    width: 30%
}

.cd-4 {
    flex: 0 0 auto;
    width: 40%
}

.cd-5 {
    flex: 0 0 auto;
    width: 50%
}

.cd-6 {
    flex: 0 0 auto;
    width: 60%
}

.cd-7 {
    flex: 0 0 auto;
    width: 70%
}

.cd-8 {
    flex: 0 0 auto;
    width: 80%
}

.cd-9 {
    flex: 0 0 auto;
    width: 90%
}

.cd-10 {
    flex: 0 0 auto;
    width: 100%
}

/* COL DECIMAL */
.jcc {
    justify-content: center !important;
}

footer h1 {
    padding-top: 0rem !important;
    margin-top: 1rem !important;
}

.laz h1 {
    font-size: 20px !important;
    font-weight: bold !important;
    padding-top: .5rem !important;
    padding-bottom: 1rem !important;
    text-transform: uppercase !important;
}

.lazbig h1 {
    font-size: 32px !important;
    font-weight: bold !important;
    padding-top: .5rem !important;
    padding-bottom: 1rem !important;
    text-transform: uppercase !important;
}

.lazbig h3 {
    font-weight: bold;
    padding: .75rem;
}

.iac {
    align-items: center !important;
}

.tal {
    text-align: left !important;
}

.tara {
    text-align: right !important;
}

.respimg {
    z-index: 1 !important;
    height: 100%;
    width: auto;
}

.respimg85 {
    z-index: 1 !important;
    height: 85%;
    width: auto;
    top: 7.5%;
}

.respimg95 {
    z-index: 1 !important;
    height: 95%;
    width: auto;
    top: 2.5%;
}

.respimg77 {
    z-index: 1 !important;
    height: 77%;
    width: auto;
    top: 11.5%;
}

.respimg33 {
    z-index: 1 !important;
    height: 33%;
    width: auto;
    top: 33.5%;
}

.respimg50 {
    z-index: 1 !important;
    height: 50%;
    width: auto;
    top: 25%;
}

.respimg65 {
    z-index: 1 !important;
    height: 65%;
    width: auto;
    top: 17.5%;
}

.im {
    z-index: -5;
}
.rev {
    z-index: 1 !important;
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .respimg {
        height: 56% !important;
        width: auto;
        align-items: center !important;
        justify-content: center !important;
        top: 22%;
    }

    .respimg85 {
        height: 47.6% !important;
        width: auto;
        align-items: center !important;
        justify-content: center !important;
        top: 26.2%;
    }

    .respimg95 {
        height: 53.2% !important;
        width: auto;
        align-items: center !important;
        justify-content: center !important;
        top: 23.4%;
    }

    .respimg33 {
        height: 18.48% !important;
        width: auto;
        align-items: center !important;
        justify-content: center !important;
        top: 40.76%;
    }

    .respimg50 {
        height: 28% !important;
        width: auto;
        align-items: center !important;
        justify-content: center !important;
        top: 36%;
    }

    .respimg65 {
        height: 36.4% !important;
        width: auto;
        align-items: center !important;
        justify-content: center !important;
        top: 31.8%;
    }
}

@media (min-width: 1200px) and (max-width: 1399.98px) {
    .respimg {
        height: 77% !important;
        width: auto;
        top: 11.5%;
    }

    .respimg85 {
        top: 17.275%;
        height: 65.45% !important;
        width: auto;
    }

    .respimg95 {
        top: 13.425%;
        height: 73.15% !important;
        width: auto;
    }

    .respimg77 {
        top: 20.355%;
        height: 59.29% !important;
        width: auto;
    }

    .respimg33 {
        top: 37.295%;
        height: 25.41% !important;
        width: auto;
    }

    .respimg50 {
        top: 30.75%;
        height: 38.5% !important;
        width: auto;
    }

    .respimg65 {
        top: 24.975%;
        height: 50.05% !important;
        width: auto;
    }
}

.sdc {
    margin-top: 2rem !important;
}

#buton {
    display: none;
    /* display: block; */
    position: fixed;
    bottom: 20px;
    right: 30px;
    z-index: 99;
    border: none;
    outline: none;
    background-color: white;
    color: white;
    cursor: pointer;
    border-radius: 10px;
    font-size: 200%;
    border-radius: 50%;
    height: 50px;
    width: 50px;
    color: black;
}

.menu1 .nav-item {
    width: 12em !important;
}

/* TABS */
.tab {
    overflow: hidden;
    /* border: 1px solid #ccc; */
    color: white !important;
    border: 1px solid white !important;
    /* border-bottom: 0px !important; */
}

span {
    color: white;
}

button {
    color: white;
}

.tab button {
    text-align: center !important;
    background-color: inherit;
    border: none;
    outline: none;
    cursor: pointer;
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    margin-top: .5rem;
    margin-bottom: .5rem;
    transition: 0.3s;
    border-radius: 50px;
    font-size: 14px;
    width: 100%;
}

.tab button:hover {
    background-color: var(--edward);
}

.tab button.active3 {
    /* background-color: #ccc; */
    background-color: var(--william);
}

.tabcontent {
    display: none;
    padding: 6px 12px;
    border: 1px solid #fff;
    border-top: none;
}

.tabcontent {
    animation: fadeEffect 1s;
    /* Fading effect takes 1 second */
}

/* TABS */
@keyframes fadeEffect {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.naha {
    text-decoration: none;
}

.naha :hover {
    text-decoration: underline !important;
}

.laz section {
    text-align: justify !important;
}
.taj {
    text-align: justify !important;
}
.brd {
    border: 1px solid white;
}
.vrr {
    border-right: 2px solid white;
}
.vrl {
    border-left:2px solid white;
}
.cols{--bs-gutter-x:1.5rem;--bs-gutter-y:0;display:flex;flex-wrap:wrap;margin-top:calc(-.5 * var(--bs-gutter-y));margin-right:calc(-.5 * var(--bs-gutter-x));margin-left:calc(-.5 * var(--bs-gutter-x));margin-bottom: calc(-.5 * var(--bs-gutter-y));}

.brd {
    border: 1px solid white;
}

.cols {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-.5 * var(--bs-gutter-y));
    margin-right: calc(-.5 * var(--bs-gutter-x));
    margin-left: calc(-.5 * var(--bs-gutter-x));
    margin-bottom: calc(-.5 * var(--bs-gutter-y));
}

.rows-4 {
    display: flex;
    flex: 0 0 auto;
    height: 33.33333%;
    text-align: left;
    /* justify-content: center !important; */
    /* align-items: center !important; */
    /* align-content: center !important; */
}

.rows-4 a {
    top: 50% !important;
    /* vertical-align: middle !important; */
    /* display: inline-block !important; */
    /* display: table-cell !important; */
    /* line-height: normal !important; */
}

.rows-4 a span {
    font-weight: 100;
    font-size: 1.5rem !important;
    /* vertical-align: middle !important; */
    /* display: inline-block !important; */
    /* line-height: normal !important; */
}

.d1 {
    background-image: linear-gradient(to bottom, var(--henry) 15%, white 97% );
}

i {
    font-style: italic !important;
    font-weight: 400 !important;
}

.dbody h1 {
    font-weight: 400 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.dbody {
    background-color: white !important;
}

.sphr {
    background: linear-gradient(to right, #ffffff, #ee74b1, #f7bbdd, #f7bbdd, #ee74b1, #ffffff) !important;
    border: none !important;
    height: .5rem !important;
    opacity: 100% !important;
}
.sphre {
    background: linear-gradient(to right, #ee7474, #f7bbbb,#ffffff,#ffffff,#f7bbbb,#ee7474) !important;
    border: none !important;
    height: .2rem !important;
    opacity: 100% !important;
}

.sphro {
    background: linear-gradient(to right, #000000, #ee74b1, #f7bbdd, #f7bbdd, #ee74b1, #000000) !important;
    border: none !important;
    height: .5rem !important;
    opacity: 100% !important;
}

.sphr2 {
    background: linear-gradient(to right, #ffffff, #ee74b1, #f7bbdd, #f7bbdd, #ee74b1, #ffffff) !important;
    border: none !important;
    height: .75rem !important;
    opacity: 100% !important;
}

.sphr2o {
    background: linear-gradient(to right, #000000, #ee74b1, #f7bbdd, #f7bbdd, #ee74b1, #000000) !important;
    border: none !important;
    height: .75rem !important;
    opacity: 100% !important;
}

.dbody h4 {
    font-weight: 400;
}

.d2 {
    background-image: linear-gradient(to bottom, white, black) !important;
    height: 10rem !important;
}

.bl {
    background-color: black !important;
    color: white !important;
}

.dbody p {
    font-size: 1.5em;
    font-weight: 500;

}

.dbody li {
    font-size: 1.5em;
    font-weight: 500;
}

.dbody span {
    font-size: 1.5em;
    font-weight: 500;
}
/* .entr h3{
    font-size: 1.25em;
} */

/* .entr h3 {
    font-size: 1.25em;
}

.entr p {
    font-size: 1.25em;
}

.entr h2 {
    font-size: 1.5em;
} */

.soft .title {
    font-size: 2.1em;
    text-align: center;
    font-weight: bold;
}

.soft h1 {
    font-size: 1.85em;
    font-weight: 600;
    color: #00FFFF;
    margin-top: 20px;
}

.soft h2 {
    font-size: 1.4em;
    font-weight: 500;
    color: #FFFF00;
    margin-top: 15px;
}

.soft h3 {
    font-size: 1.2em;
    font-weight: 400;
    color: #FF00FF;
    ;
    margin-top: 10px;
}

.soft p {
    font-size: 1em;
    color: #e0e0e0;
    font-weight: 300;
}

.soft .subtitle {
    font-size: 1em;
    color: #5eff00;
    text-align: center;
}
.mt-5n {
    margin-top: -3rem !important;
}
/* The flip card container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
.flip-card {
  background-color: transparent;
  aspect-ratio: 3 / 4;
  /* border: 1px solid #f1f1f1; */
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
    background-color: black;
    border: 1px solid white;
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {
  color: black;
}

/* Style the back side */
.flip-card-back {
  color: white;
  transform: rotateY(180deg);
}
.flip-card img {
    height: 100%;
    object-fit: contain;
    width: 100%;
    /* width: 100%; */
}
.dsb img{
    object-fit: cover !important;
}
/* .dsb .tle img {
    object-fit: cover !important;
} */
.tri {
    transform: rotate(90deg);
}
.tle {
    transform: rotate(-90deg);
}
.especiale {
    height: 75% !important;
    width: 133.33% !important;
    object-fit: contain !important;
    margin-top: 16.67% !important;
    margin-left: -16.67% !important;
}
.memberso h3 {
    margin-top: 2rem;
}
.memberso h5 {
    margin-bottom: 2rem;
}
.bot3 a img:hover {
    opacity: 120% !important;
    transition: 300ms ease-in-out;
}
.bot3 a img{
    opacity: 70%;
    transition: 300ms ease-in-out;
}
.homepager .row{
    margin-top: 15rem;
    margin-bottom: 15rem;
}
.arrow {
  border: solid black;
  border-width: 0 12px 12px 0;
  display: inline-block;
  padding: 3px;
}
.down {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.t3 {
    font-weight: 300 !important;
}
.eh {
    background-color: var(--edward) !important;
}
.ec {
    /* background-color: var(--edward) !important; */
    /* opacity: 50% !important; */
    background-color: rgba(81, 0, 0, 0.5);
    
}
.entm p {
    font-size: 140%;
}
.entm p li {
    font-size: 140%;
}
.mini {
    font-size: 85% !important;
}
b {
    font-weight: bold !important;
}
.entm table td {
    padding: .5rem !important;
}
.h10r {
    height: 20rem !important;
    margin-right: 2rem !important;
    vertical-align: middle !important;
}
.h10r .cd9 {
    vertical-align: middle !important;
    display: inline-block !important;
    line-height: normal !important;
}


.mx-12345{
    padding-left: 7.5rem;
    padding-right: 7.5rem;
}
.pl-2r div {
    padding-left: 2rem !important;
}
.cd98 {
    margin-bottom: 5rem !important;
}
.secondsoft p{
    font-weight: 500;
    font-size: 120%;
    text-align: justify;
}