:root{
/*color*/
--bg1:#f2f1ef;
--bg2:#f7f4f2;
--bg3:#897d6f;
--bg4:#c08947;
--bg5:#323b45;
--bg6:#c1614b;
--bg7:#7f3626;
--bg8:#dcd8d5;
--bg9:#efe9e5;
--color1:#757678;
--color2:#81653f;
--color3:#b98f5c;
--color4:#4f698d;
--color5:#24282e;
--color6:#565c66;
--color7:#646c78;
--color8:#40464f;
--color9:#a0a6af;
--color10:#6c7c92;
--color11:#2a3c55;
--color12:#314258;
--color13:#546273;
--color14:#333;
--color15:#666;
--border1:#6b6e72;
--border2:#bfc5cd;
--border3:#ccc3bd;


/*border-radius*/
--radius1:5px;
--radius2:10px;
--radius3:15px;
--radius4:25px;


/*font*/
--fsize1:16px; 
--fsize2:24px;
--fsize3:32px;
--fsize4:55px;
--fsize5:15px;
--fsize6:16px;
--fsize7:45px;
--fsize8:20px;
--fsize9:65px;
--fsize10:75px;
}

@media (max-width:1024px){
:root{
--fsize1:16px; 
--fsize2:18px;
--fsize3:32px;
--fsize4:45px;
--fsize5:15px;
--fsize6:16px;
--fsize7:32px;
--fsize8:20px;
--fsize9:55px;
--fsize10:55px;
}
}

@media (max-width:768px){
:root{
--fsize1:16px; 
--fsize2:17px;
--fsize3:20px;
--fsize4:32px;
--fsize5:15px;
--fsize6:16px;
--fsize7:24px;
--fsize8:17px;
--fsize9:28px;
--fsize10:35px;

/*border-radius*/
--radius1:5px;
--radius2:10px;
--radius3:7px;
--radius4:25px;
}
}