Code: [ Select all ]
:root[webcolor="green"] {
--main-color: #0F0;
--light1-color: hsla(104, 73%, 46%, 0.8);
--light2-color: rgba(0, 255, 0, 0.5);
--light3-color: rgb(123, 255, 123);
--light4-color: rgb(179, 255, 182);
--dark1-color: #008600;
--dark2-color: rgba(0, 255, 20, 0.5);
--dark3-color: #26f626;
--img-rotate: 0deg;
--som-rotate: 0deg;
--donation-color: #0F0;
--img-corners: url(../images/corners.png);
--butt-color1: #caefab;
--butt-color2: #0F0;
--butt-color3: #007a00;
--dono-glow1: rgba(0,255,0,.2);
--dono-glow2: rgba(0,255,0,.1);
--dono-glow3: rgba(0,255,0,.6);
--dono-glow4: rgba(0,255,0,.4);
}
:root[webcolor="blue"] {
--main-color: #1b63ff;
--light1-color: hsla(207, 73%, 46%, 0.8);
--light2-color: rgba(0, 140, 255, 0.5);
--light3-color: rgb(123, 169, 255);
--light4-color: rgb(179, 184, 255);
--dark1-color: #005586;
--dark2-color: rgba(0, 89, 255, 0.5);
--dark3-color: #264cf6;
--img-rotate: 125deg;
--som-rotate: 100deg;
--donation-color: rgb(0, 119, 255);
--img-corners: url(../images/corners-b.png);
--butt-color1: #abb2ef;
--butt-color2: #007bce ;
--butt-color3: #003983;
--dono-glow1: rgba(0, 132, 255, 0.2);
--dono-glow2: rgba(0, 132, 255, 0.1);
--dono-glow3: rgba(0, 140, 255, 0.6);
--dono-glow4: rgba(0, 140, 255, 0.4);
}
:root[webcolor="red"] {
--main-color: #ff1b1b;
--light1-color: hsla(0, 73%, 46%, 0.8);
--light2-color: rgba(255, 0, 0, 0.5);
--light3-color: rgb(255, 123, 123);
--light4-color: rgb(255, 179, 179);
--dark1-color: #860000;
--dark2-color: rgba(255, 0, 0, 0.5);
--dark3-color: #f62626;
--img-rotate: -125deg;
--som-rotate: -100deg;
--donation-color: rgb(255, 0, 0);
--img-corners: url(../images/corners-r.png);
--butt-color1: #efabab;
--butt-color2: #ce0000 ;
--butt-color3: #830000;
--dono-glow1: rgba(255, 0, 0, 0.2);
--dono-glow2: rgba(255, 0, 0, 0.1);
--dono-glow3: rgba(255, 0, 0, 0.6);
--dono-glow4: rgba(255, 0, 0, 0.4);
}