CheatS

heet-CS
SS
i
mpl
eS
hapes

madebyl
and-of
-web.
c
om

<di
vi
d="
par
al
l
el
ogr
am2"
></
di
v
>

<di
vi
d="
par
al
l
el
ogr
am"
></
di
v
>

<di
vi
d="
s
quar
e"
></
di
v
>
#s
quar
e{
wi
dt
h:100px;
hei
ght
:100px;
bac
kgr
ound:bl
ue;

wi
dt
h:100px;

wi
dt
h:100px;

#di
amond{

hei
ght
:70px;

hei
ght
:70px;

wi
dt
h:80px;

bac
kgr
ound:bl
ue;

bac
kgr
ound:bl
ue;

hei
ght
:80px;

t
-t
r
ans
f
or
m:s
kew(
-20deg)
;
-webki
t
-t
r
ans
f
or
m:s
kew(
20deg)
; -webki

<di
vi
d="
r
ec
t
angl
e"
></
di
v
>

<di
vi
d="
di
amond"
></
di
v
>

#par
al
l
el
ogr
am {

#par
al
l
el
ogr
am2{

bac
kgr
ound:bl
ue;

-moz-t
r
ans
f
or
m:s
kew(
20deg)
;

-moz-t
r
ans
f
or
m:s
kew(
-20deg)
;

mar
gi
n:3px0030px;

-o-t
r
ans
f
or
m:s
kew(
20deg)
;

-o-t
r
ans
f
or
m:s
kew(
-20deg)
;

-webki
t
-t
r
ans
f
or
m:r
ot
at
e(
-45deg)
;

t
r
ans
f
or
m:s
kew(
20deg)
;

t
r
ans
f
or
m:s
kew(
-20deg)
;

-moz-t
r
ans
f
or
m:r
ot
at
e(
-45deg)
;

-ms
-t
r
ans
f
or
m:r
ot
at
e(
-45deg)
;
-o-t
r
ans
f
or
m:r
ot
at
e(
-45deg)
;

#r
ec
t
angl
e{

t
r
ans
f
or
m:r
ot
at
e(
-45deg)
;

wi
dt
h:100px;

-webki
t
-t
r
ans
f
or
m-or
i
gi
n:0100%;

hei
ght
:60px;

-moz-t
r
ans
f
or
m-or
i
gi
n:0100%;

bac
kgr
ound:bl
ue;

-ms
-t
r
ans
f
or
m-or
i
gi
n:0100%;

-o-t
r
ans
f
or
m-or
i
gi
n:0100%;
t
r
ans
f
or
m-or
i
gi
n:0100%;
}

<di
vi
d="
t
r
apez"
></
di
v
>

<di
vi
d="
t
r
apez2"
></
di
v
>

hei
ght
:0;

hei
ght
:0;

hei
ght
:100px;

wi
dt
h:100px;

wi
dt
h:0;

<di
vi
d="
t
r
apez3"
></
di
v
>

#t
r
apez2{

#t
r
apez{

wi
dt
h:100px;

#t
r
apez3{

der
-t
op:100pxs
ol
i
dgr
een;
bor
der
-bot
t
om:100pxs
ol
i
dgr
een; bor

bor
der
-r
i
ght
:100pxs
ol
i
dgr
een;

der
-l
ef
t
:60pxs
ol
i
dt
r
ans
par
ent
;
bor
der
-l
ef
t
:60pxs
ol
i
dt
r
ans
par
ent
; bor

bor
der
-t
op:60pxs
ol
i
dt
r
ans
par
ent
;

<di
vi
d="
t
r
apez4"
></
di
v
>
#t
r
apez4{

hei
ght
:100px;
wi
dt
h:0;
bor
der
-l
ef
t
:100pxs
ol
i
dgr
een;
bor
der
-t
op:60pxs
ol
i
dt
r
ans
par
ent
;

der
-bot
t
om:60pxs
ol
i
dt
r
ans
par
ent
;
der
-r
i
ght
:60pxs
ol
i
dt
r
ans
par
ent
; bor
der
-bot
t
om:60pxs
ol
i
dt
r
ans
par
ent
; bor
or
der
-r
i
ght
:60pxs
ol
i
dt
r
ans
par
ent
; bor
}
}
}
}

<di
vi
d="
t
r
i
angl
eDown"
></
di
v
>

<di
vi
d="
t
r
i
angl
eL
ef
t
"
></
di
v
>

#t
r
i
angl
eUp{

#t
r
i
angl
eRi
ght{

#t
r
i
angl
eDown{

#t
r
i
angl
eL
ef
t{

wi
dt
h:0;

wi
dt
h:0;

wi
dt
h:0;

wi
dt
h:0;

hei
ght
:0;

hei
ght
:0;

hei
ght
:0;

hei
ght
:0;

bor
der
-bot
t
om:100pxs
ol
i
dr
ed;

bor
der
-l
ef
t
:100pxs
ol
i
dr
ed;

bor
der
-t
op:100pxs
ol
i
dr
ed;

bor
der
-r
i
ght
:100pxs
ol
i
dr
ed;

bor
der
-l
ef
t
:50pxs
ol
i
dt
r
ans
par
ent
;

bor
der
-t
op:50pxs
ol
i
dt
r
ans
par
ent
;

der
-t
op:50pxs
ol
i
dt
r
ans
par
ent
;
bor
der
-l
ef
t
:50pxs
ol
i
dt
r
ans
par
ent
; bor

<di
vi
d="
t
r
i
angl
eUp"
></
di
v
>

<di
vi
d="
t
r
i
angl
eRi
ght
"
></
di
v
>

der
-bot
t
om:50pxs
ol
i
dt
r
ans
par
ent
;
der
-r
i
ght
:50pxs
ol
i
dt
r
ans
par
ent
; bor
bor
der
-r
i
ght
:50pxs
ol
i
dt
r
ans
par
ent
; bor
der
-bot
t
om:50pxs
ol
i
dt
r
ans
par
ent
;bor
}

<di
vi
d="
hal
f
-c
i
r
c
l
eTop"
></
di
v
>

<di
vi
d="
hal
f
-c
i
r
c
l
eBot
t
om"
></
di
v
>

<di
vi
d="
hal
f
-c
i
r
c
l
eRi
ght
"
></
di
v
>

#hal
f
-c
i
r
c
l
eTop{
bac
kgr
ound:or
ange;
hei
ght
:45px;
wi
dt
h:90px;
-moz-bor
der
-r
adi
us
:
90px90px00;

#hal
f
-c
i
r
c
l
eRi
ght{

#hal
f
-c
i
r
c
l
eBot
t
om{

bac
kgr
ound:or
ange;

bac
kgr
ound:or
ange;

hei
ght
:90px;

hei
ght
:45px;

wi
dt
h:45px;

wi
dt
h:90px;

<di
vi
d="
hal
f
-c
i
r
c
l
eL
ef
t
"
></
di
v
>
#hal
f
-c
i
r
c
l
eL
ef
t{
bac
kgr
ound:or
ange;
hei
ght
:90px;
wi
dt
h:45px;

der
-r
adi
us
:
90px0090px;
-moz-bor
der
-r
adi
us
:
090px90px0; -moz-bor
der
-r
adi
us
:0090px90px; -moz-bor
-webki
t
-bor
der
-r
adi
us
:
90px90px00;
w
e
b
k
i
t
b
o
r
d
e
r
r
a
d
i
u
s
:
90px0090px;
-webki
t
-bor
der
-r
adi
us
:
090px90px0;
-webki
t
-bor
der
-r
adi
us
: 0090px90px;
bor
der
-r
adi
us
:
90px90px 00;
bor
der
-r
adi
us
:
90px0090px;
bor
der
-r
adi
us
:
090px90px0;
bor
der
-r
adi
us
:
0090px90px;
}
}
}
}

<di
vi
d="
c
i
r
c
l
e"
></
di
v
>

<di
vi
d="
ov
al
Hor
"
></
di
v
>

#c
i
r
c
l
e{
wi
dt
h:90px;
hei
ght
:90px;
bac
kgr
ound:y
el
l
ow;
-moz-bor
der
-r
adi
us
:45px;
-webki
t
-bor
der
-r
adi
us
:45px;
bor
der
-r
adi
us
:45px;
}

#ov
al
Hor{
wi
dt
h:180px;
hei
ght
:90px;
bac
kgr
ound:or
ange;
-moz-bor
der
-r
adi
us
:
90px/45px;
-webki
t
-bor
der
-r
adi
us
:
90px/
45px;
bor
der
-r
adi
us
:
90px/
45px;
}

<di
vi
d="
ov
al
Ver
t
"
></
di
v
>
#ov
al
Ver
t
{

<di
vi
d="
c
har
t
Col
or
f
ul
"
></
di
v
>
#c
har
t
Col
or
f
ul
{
wi
dt
h:0px;

wi
dt
h:90px;
hei
ght
:180px;
bac
kgr
ound:or
ange;
-moz-bor
der
-r
adi
us
:
45px/
90px;
-webki
t
-bor
der
-r
adi
us
:
45px/
90px;
bor
der
-r
adi
us
:
45px/
90px;
}

hei
ght
:0px;
bor
der
-r
i
ght
:60pxs
ol
i
dpur
pl
e;
bor
der
-t
op:60pxs
ol
i
dy
el
l
ow;
bor
der
-l
ef
t
:60pxs
ol
i
dbl
ac
k;
bor
der
-bot
t
om:60pxs
ol
i
dbl
ue;
-moz-bor
der
-r
adi
us
:
60px;
-webki
t
-bor
der
-r
adi
us
:
60px;
bor
der
-r
adi
us
:60px;
}

<di
vi
d="
quar
t
er
c
i
r
c
l
eTop"
></
di
v
>
#quar
t
er
c
i
r
c
l
eTop{
wi
dt
h:90px;
hei
ght
:90px;
bac
kgr
ound:
y
el
l
ow;
-moz-bor
der
-r
adi
us
:90px000;

<di
vi
d="
quar
t
er
c
i
r
c
l
eRi
ght
"
></
di
v
>

<di
vi
d="
quar
t
er
c
i
r
c
l
eBot
t
om"
></
di
v
> <di
vi
d="
quar
t
er
c
i
r
c
l
eL
ef
t
"
></
di
v
>

#quar
t
er
c
i
r
c
l
eRi
ght
{

#quar
t
er
c
i
r
c
l
eBot
t
om{

wi
dt
h:90px;

wi
dt
h:90px;

hei
ght
:90px;

hei
ght
:90px;

bac
kgr
ound:
y
el
l
ow;

bac
kgr
ound:
y
el
l
ow;

-moz-bor
der
-r
adi
us
:090px 00;

-moz-bor
der
-r
adi
us
:0090px0;

#quar
t
er
c
i
r
c
l
eL
ef
t
{
wi
dt
h:90px;
hei
ght
:90px;
bac
kgr
ound:
y
el
l
ow;
-moz-bor
der
-r
adi
us
:00090px;

t
-bor
der
-r
adi
us
:0090px0;
t
-bor
der
-r
adi
us
:090px 00; -webki
-webki
t
-bor
der
-r
adi
us
:90px000; -webki
bor
der
-r
adi
us
:
0090px0;
bor
der
-r
adi
us
:
090px 00;
bor
der
-r
adi
us
:90px000;
}

<di
vi
d="
c
har
t
Top"
></
di
v
>
#c
har
t
Top{
wi
dt
h:0px;
hei
ght
:0px;
bor
der
-r
i
ght
:60pxs
ol
i
dpur
pl
e;
bor
der
-t
op:60pxs
ol
i
dt
r
ans
par
ent
;
bor
der
-l
ef
t
:60pxs
ol
i
dpur
pl
e;
bor
der
-bot
t
om:60pxs
ol
i
dpur
pl
e;
-moz-bor
der
-r
adi
us
:
60px;
-webki
t
-bor
der
-r
adi
us
:
60px;
bor
der
-r
adi
us
:
60px;
}

<di
vi
d="
c
har
t
Bot
t
om"
></
di
v
>

#c
har
t
Ri
ght
{

#c
har
t
Bot
t
om{

bor
der
-s
t
y
l
e:dot
t
ed;
bor
der
-wi
dt
h:080px80px0;
}

bor
der
-r
i
ght
:60pxs
ol
i
dt
r
ans
par
ent
;
bor
der
-t
op:60pxs
ol
i
dpur
pl
e;

-webki
t
-bor
der
-r
adi
us
:
60px;
bor
der
-r
adi
us
:
60px;
}

<di
vi
d="
t
r
i
angl
eUpL
ef
t
"
></
di
v
>

wi
dt
h:0;
hei
ght
:0;
bor
der
-c
ol
or
:r
ed;
bor
der
-s
t
y
l
e:dot
t
ed;
bor
der
-wi
dt
h:
0080px80px;
}

#t
r
i
angl
eUpL
ef
t
{
wi
dt
h:0;

<di
vi
d="
t
r
i
angl
eUpRi
ght
"
></
di
v
>
#t
r
i
angl
eUpRi
ght
"
{
wi
dt
h:0;
hei
ght
:0;

hei
ght
:0;
bor
der
-t
op:50pxs
ol
i
dr
ed;

bor
der
-t
op:50pxs
ol
i
dr
ed;

bor
der
-r
i
ght
:50pxs
ol
i
dt
r
ans
par
ent
;

bor
der
-r
i
ght
:50pxs
ol
i
dr
ed;

der
-bot
t
om:50pxs
ol
i
dt
r
ans
par
ent
;
bor
der
-bot
t
om:50pxs
ol
i
dt
r
ans
par
ent
; bor
b
o
r
d
e
r
l
e
f
t
:
5
0
p
x
s
o
l
i
d
t
r
a
n
s
p
a
r
e
n
t
;
bor
der
-l
ef
t
:50pxs
ol
i
dr
ed;
}

<di
vi
d="
f
unky
hour
gl
as
s
es
"
></
di
v
>

wi
dt
h:0;

wi
dt
h:0px;

#f
unky
hour
gl
as
s
es{
bor
der
-t
op:100pxdot
t
edr
ed;
bor
der
-l
ef
t
:90pxs
ol
i
dt
r
ans
par
ent
;
bor
der
-r
i
ght
:90pxs
ol
i
dt
r
ans
par
ent
;
bor
der
-bot
t
om:100px dot
t
edr
ed;
-moz-bor
der
-r
adi
us
:
200px;
-webki
t
-bor
der
-r
adi
us
:
200px;
}

-moz-bor
der
-r
adi
us
:
60px;

bor
der
-r
adi
us
:
200px;

bor
der
-l
ef
t
:60pxs
ol
i
dt
r
ans
par
ent
;

bor
der
-r
adi
us
:60px;

bor
der
-r
adi
us
:60px;

<di
vi
d="
bookmar
k-r
i
bbon"
></
di
v
>
#bookmar
k-r
i
bbon{

bor
der
-t
op:60pxs
ol
i
dpur
pl
e;

-webki
t
-bor
der
-r
adi
us
:
60px;

-webki
t
-bor
der
-r
adi
us
:
60px;

bor
der
-bot
t
om:35pxs
ol
i
dt
r
ans
par
ent
;

bor
der
-r
i
ght
:60pxs
ol
i
dpur
pl
e;

bor
der
-t
op:60pxs
ol
i
dpur
pl
e;

-moz-bor
der
-r
adi
us
:
60px;

-moz-bor
der
-r
adi
us
:
60px;

bor
der
-r
i
ght
:50pxs
ol
i
dr
ed;

hei
ght
:0px;

bor
der
-r
i
ght
:60pxs
ol
i
dpur
pl
e;

bor
der
-bot
t
om:60pxs
ol
i
dt
r
ans
par
ent
; bor
der
-bot
t
om:60pxs
ol
i
dpur
pl
e;

bor
der
-bot
t
om:60pxs
ol
i
dpur
pl
e;

bor
der
-l
ef
t
:50pxs
ol
i
dr
ed;

wi
dt
h:0px;

bor
der
-l
ef
t
:60pxs
ol
i
dpur
pl
e;

bor
der
-l
ef
t
:60pxs
ol
i
dpur
pl
e;

hei
ght
:100px;

#c
har
t
L
ef
t
t
{

hei
ght
:0px;

hei
ght
:0px;

#hear
t
Ri
ght{

<di
vi
d="
c
har
t
L
ef
t
"
></
di
v
>

wi
dt
h:0px;

wi
dt
h:0px;

#hear
tL
ef
t
{

bor
der
-c
ol
or
:r
ed;

<di
vi
d="
c
har
t
Ri
ght
></
di
v
>

<di
vi
d="
hear
t
Ri
ght
"
></
di
v
>

hei
ght
:0;

bor
der
-r
adi
us
:
00090px;

<di
vi
d="
hear
t
L
ef
t
"
></
di
v
>
wi
dt
h:0;

-webki
t
-bor
der
-r
adi
us
:00090px;

<di
vi
d="
t
woCi
r
c
l
es
"
></
di
v
>
#t
woCi
r
c
l
es
{
wi
dt
h:0px;
bor
der
-t
op:50pxs
ol
i
dt
r
ans
par
ent
;
bor
der
-l
ef
t
:100pxdot
t
ed r
ed;
bor
der
-r
i
ght
:100pxdot
t
edr
ed;
bor
der
-bot
t
om:50pxs
ol
i
dt
r
ans
par
ent
;
-moz-bor
der
-r
adi
us
:
150px;
-webki
t
-bor
der
-r
adi
us
:
150px;
bor
der
-r
adi
us
:
150px;
}
l
and-of
-web.
c
om