:root{
    --primarycolor: #FFF2E1;
    --secondarycolor: #23bdeee6;
    --textclr1: #252641;
    --textclr2: #ffffff;
    --textclr3:#6C6C6C;
    --buttoncolor: #F48C06;
    --buttonclr2 :#F4C467;
    
    --textclr4: #2F327D;
    --textclr5: #464646;
    --textclr6:#696984;
    --textclr7: #525596;
    --textclr8: #B2B3CF;
    --textclr9: #83839A;
    --shadowclr:# ;
}





.login:hover{
background-color: var(--buttoncolor);   
color: var(--textclr2); 
}
.signup:hover{
    background-color: var(--textclr2);
color: var(--textclr3);

}
.joinfree:hover{
    background-color: var(--textclr2);
color: var(--textclr3);

}


#imgcard1 a:hover{
     background-color: var(--secondarycolor);
     border: 1px solid transparent;
}

#imgcard2 a:hover{
    background-color: transparent;
    border: 1px solid var(--textclr2);
}


.seebuttons:hover{
color: var(--textclr2);
background-color: var(--buttoncolor);
}

#seeintegrations a:hover{
color: var(--textclr2);
background-color: var(--buttoncolor);
}

#writeassignment p:hover{
   color: var(--textclr2);
background-color: var(--buttoncolor); 
}