html,
body {
    background-color: rgb(8, 3, 36);
    color: white;
    cursor: url("../images/axecursor.png"), grab;
}

.Career {
    color: white;
}
/*Lua container*/
.lua {
    border: solid 2px;
    border-width: 2px;
    border-color: rgb(88, 87, 87);
    padding: 10px;
    
    height: auto;
   
    max-width: 1400px;
    
    margin: 0 auto;
   
    background: linear-gradient(to right, darkblue, blue, rgb(1, 42, 56));
    border-radius: 50px;
}

.lua h2 {
    margin-left: 40px;
}

#Studioimg {
    margin-left: 30px;
    border-radius: 20px;
    box-shadow: -4px 0 6px rgba(255, 255, 255, 0.5), 4px 0 6px rgba(255, 255, 255, 0.5);
    width: 120px;
    
    height: auto;
}

.lua p {
    text-align: right;
    margin-right: 200px;
    
}

.lua button {
    margin-left: auto;
    margin-right: 200px;
    
    padding: 10px 20px;
}

#title {
    text-align: center;
    font-size: 60px;
    text-decoration: 2.5px underline;
}

#openings {
    text-align: right;
    margin-right: 200px;
    color: lightblue;
    text-decoration: underline;
}

#test {
    background: #1c1c1c;
    color: #ffffff;
    font-family: 'Cinzel', serif;
    font-size: 16px;
    text-transform: uppercase;
    border: 2px solid #866bce;
    padding: 12px 30px;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
}

#luajob {
    background: #1c1c1c;
    color: #ffffff;
    font-family: 'Cinzel', serif;
    font-size: 16px;
    text-transform: uppercase;
    border: 2px solid #866bce;
   margin-left: auto;
    margin-right: 200px;
    padding: 10px 10px;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
width: 99px;
text-decoration: none;
}

#luajob:hover {
    color: #f7e6db;
    background-color: #2f2d70;
    transform: scale(1.1);
}

#test:hover {
    color: #f7e6db;
    background-color: #2f2d70;
    transform: scale(1.1);
}



.highlight {
    color: #2aceda;
}



.highlight2 {
    color: #2aceda;
}
/*Builder container*/
.builder {
    border: solid 2px;
    border-width: 2px;
    border-color: rgb(88, 87, 87);
    padding: 10px;
   
    height: auto;
   
    max-width: 1400px;
    
    margin: 0 auto;
   
    background: linear-gradient(to right, darkblue, blue, rgb(1, 42, 56));
    border-radius: 50px;
}

.highlight3 {
    color: #2aceda;

}

.highlight4 {
    color: #2aceda;

}

#openings1 {
    text-align: right;
    margin-right: 200px;
    color: lightblue;
    text-decoration: underline;
}


#buildjob {
    background: #1c1c1c;
    color: #ffffff;
    font-family: 'Cinzel', serif;
    font-size: 16px;
    text-transform: uppercase;
    border: 2px solid #866bce;
   margin-left: auto;
    margin-right: 200px;
    padding: 10px 10px;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
width: 99px;
text-decoration: none;
}

#buildjob:hover {
    color: #f7e6db;
    background-color: #2f2d70;
    transform: scale(1.1);
}

.builder h2 {
    margin-left: 40px;
}

.builder p {
    text-align: right;
    margin-right: 200px;
   
}

.builder button {
    margin-left: auto;
    margin-right: 200px;
    
    padding: 10px 20px;
}


/*Animator container*/
.animator {
    border: solid 2px;
    border-width: 2px;
    border-color: rgb(88, 87, 87);
    padding: 10px;
   
    height: auto;
   
    max-width: 1400px;
    
    margin: 0 auto;
   
    background: linear-gradient(to right, darkblue, blue, rgb(1, 42, 56));
    border-radius: 50px;
}

.highlight5 {
    color: #2aceda;

}

.highlight6 {
    color: #2aceda;

}

#openings2 {
    text-align: right;
    margin-right: 200px;
    color: lightblue;
    text-decoration: underline;
}



#Anijob {
    background: #1c1c1c;
    color: #ffffff;
    font-family: 'Cinzel', serif;
    font-size: 16px;
    text-transform: uppercase;
    border: 2px solid #866bce;
   margin-left: auto;
    margin-right: 200px;
    padding: 10px 10px;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
width: 99px;
text-decoration: none;
}

#Anijob:hover {
    color: #f7e6db;
    background-color: #2f2d70;
    transform: scale(1.1);
}

.animator h2 {
    margin-left: 40px;
}

.animator p {
    text-align: right;
    margin-right: 200px;
   
}

.animator button {
    margin-left: auto;
    margin-right: 200px;
    
    padding: 10px 20px;
}

/*Ui Design container*/
.GUI {
    border: solid 2px;
    border-width: 2px;
    border-color: rgb(88, 87, 87);
    padding: 10px;
   
    height: auto;
   
    max-width: 1400px;
    
    margin: 0 auto;
   
    background: linear-gradient(to right, darkblue, blue, rgb(1, 42, 56));
    border-radius: 50px;
}

.highlight7 {
    color: #2aceda;

}

.highlight8 {
    color: #2aceda;

}

#openings3 {
    text-align: right;
    margin-right: 200px;
    color: lightblue;
    text-decoration: underline;
}



#GUIjob {
    background: #1c1c1c;
    color: #ffffff;
    font-family: 'Cinzel', serif;
    font-size: 16px;
    text-transform: uppercase;
    border: 2px solid #866bce;
   margin-left: auto;
    margin-right: 200px;
    padding: 10px 10px;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
width: 99px;
text-decoration: none;
}

#GUIjob:hover {
    color: #f7e6db;
    background-color: #2f2d70;
    transform: scale(1.1);
}

.GUI h2 {
    margin-left: 40px;
}

.GUI p {
    text-align: right;
    margin-right: 200px;
   
}

.GUI button {
    margin-left: auto;
    margin-right: 200px;
    
    padding: 10px 20px;
}

/* frontend developer container*/
.Frontend {
    border: solid 2px;
    border-width: 2px;
    border-color: rgb(88, 87, 87);
    padding: 10px;
   
    height: auto;
   
    max-width: 1400px;
    
    margin: 0 auto;
   
    background: linear-gradient(to right, darkblue, blue, rgb(1, 42, 56));
    border-radius: 50px;
}

.highlight9 {
    color: #2aceda;

}

.highlight10 {
    color: #2aceda;

}

#openings4 {
    text-align: right;
    margin-right: 200px;
    color: lightblue;
    text-decoration: underline;
}



#Fronjob {
    background: #1c1c1c;
    color: #ffffff;
    font-family: 'Cinzel', serif;
    font-size: 16px;
    text-transform: uppercase;
    border: 2px solid #866bce;
   margin-left: auto;
    margin-right: 200px;
    padding: 10px 10px;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
width: 99px;
text-decoration: none;
}

#Fronjob:hover {
    color: #f7e6db;
    background-color: #2f2d70;
    transform: scale(1.1);
}

.Frontend h2 {
    margin-left: 40px;
}

.Frontend p {
    text-align: right;
    margin-right: 200px;
   
}

.Frontend button {
    margin-left: auto;
    margin-right: 200px;
    
    padding: 10px 20px;
}


/* backend developer container*/
.backend {
    border: solid 2px;
    border-width: 2px;
    border-color: rgb(88, 87, 87);
    padding: 10px;
   
    height: auto;
   
    max-width: 1400px;
    
    margin: 0 auto;
   
    background: linear-gradient(to right, darkblue, blue, rgb(1, 42, 56));
    border-radius: 50px;
}

.highlight11 {
    color: #2aceda;

}

.highlight12 {
    color: #2aceda;

}

#openings5 {
    text-align: right;
    margin-right: 200px;
    color: lightblue;
    text-decoration: underline;
}



#Backjob {
    background: #1c1c1c;
    color: #ffffff;
    font-family: 'Cinzel', serif;
    font-size: 16px;
    text-transform: uppercase;
    border: 2px solid #866bce;
   margin-left: auto;
    margin-right: 200px;
    padding: 10px 10px;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
width: 99px;
text-decoration: none;
}

#Backjob:hover {
    color: #f7e6db;
    background-color: #2f2d70;
    transform: scale(1.1);
}

.backend h2 {
    margin-left: 40px;
}

.backend p {
    text-align: right;
    margin-right: 200px;
   
}

.backend button {
    margin-left: auto;
    margin-right: 200px;
    
    padding: 10px 20px;
}
/*Tester container*/
.WebTest {
    border: solid 2px;
    border-width: 2px;
    border-color: rgb(88, 87, 87);
    padding: 10px;
   
    height: auto;
   
    max-width: 1400px;
    
    margin: 0 auto;
   
    background: linear-gradient(to right, darkblue, blue, rgb(1, 42, 56));
    border-radius: 50px;
}

.highlight13 {
    color: #2aceda;

}

.highlight14 {
    color: #2aceda;

}

#openings6 {
    text-align: right;
    margin-right: 200px;
    color: lightblue;
    text-decoration: underline;
}



#Testjob {
    background: #1c1c1c;
    color: #ffffff;
    font-family: 'Cinzel', serif;
    font-size: 16px;
    text-transform: uppercase;
    border: 2px solid #866bce;
   margin-left: auto;
    margin-right: 200px;
    padding: 10px 10px;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
width: 99px;
text-decoration: none;
}

#Testjob:hover {
    color: #f7e6db;
    background-color: #2f2d70;
    transform: scale(1.1);
}

.WebTest h2 {
    margin-left: 40px;
}

.WebTest p {
    text-align: right;
    margin-right: 200px;
   
}

.WebTest button {
    margin-left: auto;
    margin-right: 200px;
    
    padding: 10px 20px;
}


/* roblox tester */

.RobTest {
    border: solid 2px;
    border-width: 2px;
    border-color: rgb(88, 87, 87);
    padding: 10px;
   
    height: auto;
   
    max-width: 1400px;
    
    margin: 0 auto;
   
    background: linear-gradient(to right, darkblue, blue, rgb(1, 42, 56));
    border-radius: 50px;
}

.highlight15 {
    color: #2aceda;

}

.highlight16 {
    color: #2aceda;

}

#openings7 {
    text-align: right;
    margin-right: 200px;
    color: lightblue;
    text-decoration: underline;
}



#Robjob {
    background: #1c1c1c;
    color: #ffffff;
    font-family: 'Cinzel', serif;
    font-size: 16px;
    text-transform: uppercase;
    border: 2px solid #866bce;
   margin-left: auto;
    margin-right: 200px;
    padding: 10px 10px;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
width: 99px;
text-decoration: none;
}

#Robjob:hover {
    color: #f7e6db;
    background-color: #2f2d70;
    transform: scale(1.1);
}

.RobTest h2 {
    margin-left: 40px;
}

.RobTest p {
    text-align: right;
    margin-right: 200px;
   
}

.RobTest button {
    margin-left: auto;
    margin-right: 200px;
    
    padding: 10px 20px;
}

.divselect{
    background: linear-gradient(to right, darkblue, blue, rgb(1, 42, 56));
    width: 250px;
    text-align: center;
    height: 250px;
    padding: 3px 1px;
    border-radius: 35px;
    border: solid 2px rgb(133, 17, 133);
    float: left;
}

.divselect button{
    border: none;
    border-radius: 20px;
    background: linear-gradient(to right, darkblue, blue, rgb(1, 42, 56));
    color: white;
    font-size: 20px;
   
}

#footer {
    font-family: 'viking', serif;
    text-align: center;
    padding: 10px;
    background: rgba(34, 34, 34, 0.6); /* Semi-transparent background */
    color: white;
    font-size: 1.1rem;
    text-shadow: 1px 1px 5px #ffcc00;
    position: fixed;
    bottom: 0;
    width: 100%;
    
}


h1{
    text-align: center;
}


ᚦᛁᛞᚩᚾ #f0d18a ⚔ ᛟ⛁
/*
#luajob{
    background: #1c1c1c;
    color: #bfa76f;
    font-family: 'Cinzel', serif;
    font-size: 16px;
    text-transform: uppercase;
    border: 2px solid #8b5e3c;
    padding: 12px 30px;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    cursor: pointer;
    transition: all 0.3s ease;
}

#luajob:hover{
color: #e47d3d;
background-color: #7a5d46;
transform: scale(1.1);
}
*/