@charset "utf-8";
/* CSS Document */

#curve1 { width:202%; background:#fafbfa; border-radius:50%; overflow:hidden; display:inline-block; transform:translate(-50%, 0%); margin:-100px 0 0; position:relative; left:50%; top:0; z-index:999;}
#curve2 { width:160%; background:#8eaed7; border-radius:50%; overflow:hidden; display:inline-block; transform:translate(-50%, 0%); margin:-260px 0 0; position:relative; left:50%; top:0; z-index:99;}
#curve3 { width:172%; background:#97d3e5; border-radius:50%; overflow:hidden; display:inline-block; transform:translate(-50%, 0%); margin:-266px 0 0; position:relative; left:50%; top:0; z-index:9;}
#curve4 { width:172%; background:#d7e5ea; border-radius:50%; overflow:hidden; display:inline-block; transform:translate(-50%, 0%); margin:-199px 0 25px; position:relative; left:50%; top:0; z-index:9;}

/*Smartphone css*/
@media screen and (max-width: 480px) {
#curve1 { width:100%; border-radius:inherit; transform:none; display:block; margin:0 0 0; position:relative; left:inherit;}
#curve2 { width:100%; border-radius:inherit; transform:none; display:block; margin:0 0 0; position:relative; left:inherit;}
#curve3 { width:100%; border-radius:inherit; transform:none; display:block; margin:0 0 0; position:relative; left:inherit;}
#curve4 { width:100%; border-radius:inherit; transform:none; display:block; margin:0 0 0; position:relative; left:inherit;}
}

@media screen and (min-width:481px) and (max-width:600px) {
#curve1 { width:100%; border-radius:inherit; transform:none; display:block; margin:0 0 0; position:relative; left:inherit;}
#curve2 { width:100%; border-radius:inherit; transform:none; display:block; margin:0 0 0; position:relative; left:inherit;}
#curve3 { width:100%; border-radius:inherit; transform:none; display:block; margin:0 0 0; position:relative; left:inherit;}
#curve4 { width:100%; border-radius:inherit; transform:none; display:block; margin:0 0 0; position:relative; left:inherit;}
}

@media screen and (min-width:601px) and (max-width:767px) {
#curve1 { width:100%; border-radius:inherit; transform:none; display:block; margin:0 0 0; position:relative; left:inherit;}
#curve2 { width:100%; border-radius:inherit; transform:none; display:block; margin:0 0 0; position:relative; left:inherit;}
#curve3 { width:100%; border-radius:inherit; transform:none; display:block; margin:0 0 0; position:relative; left:inherit;}
#curve4 { width:100%; border-radius:inherit; transform:none; display:block; margin:0 0 0; position:relative; left:inherit;}
}

@media screen and (min-width:768px) and (max-width:900px) {

}

@media screen and (min-width:901px) and (max-width:1024px) {

}

@media screen and (min-width:1025px) and (max-width:1240px) {

}

@media screen and (min-width:1241px) and (max-width:1340px) {
#curve1 { margin:-654px 0 0;}
}