Ajax Loader
×
HTML
<div id="webcam"></div>
1
<div id="webcam"></div>
2
  <div id="screen">
3
    <div id="screenshot"></div>
4
  </div>
5
<div id="gray-piece"></div>
6
<div id="apple"></div>
7
<div id="stand"></div>
 
CSS
#webcam {
1
#webcam {
2
  background: #444;
3
  border: 2px solid #777;
4
  border-radius: 30px;
5
  width: 6px;
6
  height: 6px;
7
  position: absolute;
8
  top: 2px;
9
  left: 186px;
10
}
11
#screen {
12
  width: 372px;
13
  height: 200px;
14
  border: 14px solid black;
15
  background: black;
16
  border-top-left-radius: 14px;
17
  border-top-right-radius: 14px;
18
}
19
#screenshot {
20
   background: url(http://forum.support.xerox.com/t5/image/serverpage/image-id/42iC79F36DC508B73E6/image-size/original?v=mpbl-1&px=-1) no-repeat;
21
  background-size: 100%;
22
  width: 372px;
23
  height: 230px;
24
  position: absolute;
25
  top: 12px;
26
}
27
#gray-piece {
28
  width: 400px;
29
  height: 50px;
30
  background: #ccc;
31
  border-bottom-left-radius: 14px;
32
  border-bottom-right-radius: 14px;
33
}
34
#apple {
35
  font-size: 26pt;
36
  color: #555;
37
  position: absolute;
38
  top: 232px;
39
  left: 180px;
40
}
41
#stand {
42
  /* I need to work in this */
43
}
 

iMac in CSS

CSSDeck G+