body{
  margin:0;
  padding:0;
}
.handle{
  width:100px;
  background:#000;
  height:70px;
  margin:0 auto;
  border-radius:50px;
  margin-bottom:-60px;
  margin-top:50px;
  box-shadow:5px 5px #444;
}
.clrHandle{
  width:60px;
  background:#fff;
  height:15px;
  margin:0 auto;
  border-radius:50px 50px 0px 0px;
}
.keyBody{
  height:200px;
  width:150px;
  background:#000;
  margin:0 auto;
  border-radius:30px 30px 50px 50px;
  box-shadow:5px 4px #111;
  position:relative;
}
.smallBtns{
  height:70px;
}
.panic{
  background:#d80000;
  width:50px;
  height:40px;
  float:left;
  border-radius:5px;
  margin:20px 5px 0px 15px;
  border:none;
  outline:none;
  color:#fff;
  position:relative;
}
.panic:hover{
  cursor:pointer;
}
.panic p{
  font-size:8px;
  margin:8px 0px 0px 30px;
  -ms-transform: rotate(-180deg); /* IE 9 */
  -webkit-transform: rotate(-180deg); /* Chrome, Safari, Opera */
  transform: rotate(-180deg);
}
.speakerBase{
  height:6px;
  width:3px;
  margin:-3px 0px 0px 5px;
  background:#fff;
  float:left;
}
.speaker{
	border-top: 5px solid transparent;
	border-right: 10px solid #fff;
  border-bottom:5px solid transparent;
	width: 4px;
  height:0px;
  float:left;
  margin:-2px 0px 0px -5px;
}
.sound{
  height:8px;
  width:5px;
  border-radius:50%;
  background:#d80000;
  position:absolute;
  left:20px;
  top:14px;
  z-index:6;
}
.sound1{
  height:8px;
  width:7px;
  border-radius:50%;
  background:#fff;
  position:absolute;
  left:20px;
  top:14px;
  z-index:5;
}
.sound2{
  height:12px;
  width:10px;
  border-radius:50%;
  background:#d80000;
  position:absolute;
  left:21px;
  top:12px;
  z-index:4;
}
.sound3{
  height:10px;
  width:8px;
  border-radius:50%;
  background:#fff;
  position:absolute;
  left:25px;
  top:13px;
  z-index:3;
}
.sound4{
  height:12px;
  width:10px;
  border-radius:50%;
  background:#d80000;
  position:absolute;
  left:27px;
  top:12px;
  z-index:2;
}
.sound5{
  height:12px;
  width:9px;
  border-radius:50%;
  background:#fff;
  position:absolute;
  left:30px;
  top:12px;
  z-index:1;
}
/*OPEN TRUNK*/
.trunk{
  background:#222;
  width:50px;
  height:40px;
  float:left;
  border-radius:5px;
  margin:20px 0px 0px 15px;
  padding-top:10px;
  border:none;
  outline:none;
  color:#fff;
  cursor:pointer;
}
.trunk p{
  font-size:8px;
  margin:2px 0px 0px 0px;
  -ms-transform: rotate(-180deg); /* IE 9 */
  -webkit-transform: rotate(-180deg); /* Chrome, Safari, Opera */
  transform: rotate(-180deg);
}
.wheel1{
  width:6px;
  height:6px;
  background:#fff;
  border-radius:50px;
  margin: -4px 0px 0px 8px;
  float:left;
}
.wheel2{
  width:6px;
  height:6px;
  background:#fff;
  border-radius:50px;
  margin:-6px 0px 0px 26px;
  float:left;
}
.car{
  width:35px;
  height:8px;
  margin:0 auto;
  background:#fff;
  border-radius:2px 2px 6px 2px;
}
.carRoof{
  border-top: 6px solid #fff;
	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
	height: 0;
	width: 7px;
  margin:0px 0px 0px 8px;
}
.carRoof2{
  border-top: 5px solid #222;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	height: 0;
	width: 3px;
  margin:-6px 0px 0px -3px;
  border-radius:0px 0px 50px 50px;
}
.trunkPic{
  width:2px;
  height:7px;
  background:#fff;
  -ms-transform: rotate(30deg); /* IE 9 */
  -webkit-transform: rotate(30deg); /* Chrome, Safari, Opera */
  transform: rotate(30deg);
  margin:-7px 0px 0px 6px;
}
.trunkPic1{
  width:2px;
  height:4px;
  background:#fff;
  -ms-transform: rotate(-90deg); /* IE 9 */
  -webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
  transform: rotate(-90deg);
  margin:-3px 0px 0px 3px;
}
/*UNLOCK BUTTON*/
.unlock{
  width:85px;
  height:40px;
  border-radius:5px;
  background:#222;
  margin-left:33px;
  margin-bottom:10px;
  outline:none;
  border:none;
  position:relative;
  cursor:pointer;
}
.unlockBase{
  width:18px;
  height:14px;
  background:#fff;
  margin:0 auto;
  margin-bottom:15px;
  position:absolute;
  left:32px;
  top:10px;
  z-index:1;
}
.unlockBottom{
	border-top: 5px solid #222;
	border-left: 3px solid transparent;
	border-right: 3px solid transparent;
	height: 0;
	width: 3px;
  margin:3px 0px -8px 5px;
  float:left;
}

.unlockTop{
  width:7px;
  height:6px;
  background:#222;
  margin:7px 0px 0px 6px;
  float:left;
  border-radius:50px;
}
.unlockFullCurve{
  height:15px;
  width:15px;
  border-radius:40%;
  margin:-4px 0px 20px 30px;
  background:#fff;
  position:absolute;
  z-index:0;
  top:24px;
  left:4px;
}
.unlockInnerCurve{
  height:13px;
  width:16px;
  border-radius:10px 0px 0px 10px;
  margin:-4px 0px 20px 31px;
  background:#222;
  position:absolute;
  z-index:0;
  top:24px;
  left:6px;
}
/*LOCK BUTTON*/
.lock{
  width:85px;
  height:40px;
  border-radius:5px 5px 15px 15px;
  background:#222;
  margin-left:33px;
  outline:none;
  border:none;
  position:relative;
  cursor:pointer;
}
.lockBase{
  width:18px;
  height:14px;
  background:#fff;
  margin:0 auto;
  top:10px;
  position:absolute;
  left:32px;
  z-index:2
}
.lockBottom{
	border-top: 5px solid #222;
	border-left: 3px solid transparent;
	border-right: 3px solid transparent;
	height: 0;
	width: 3px;
  margin:3px 0px -8px 5px;
  float:left;
}
.lockTop{
  width:7px;
  height:6px;
  background:#222;
  margin:7px 0px 0px 6px;
  float:left;
  border-radius:50px;
}
.lockFullCurve{
  height:15px;
  width:15px;
  border-radius:50%;
  margin:-4px 0px 20px 30px;
  background:#fff;
  position:absolute;
  z-index:1;
  top:24px;
  left:4px;
}
.lockInnerCurve{
  height:13px;
  width:9px;
  border-radius:50%;
  margin:-4px 0px 20px 31px;
  background:#222;
  position:absolute;
  z-index:1;
  top:24px;
  left:6px;
}
/************************/
.key{
  height:140px;
  width:35px;
  background:#ccc;
  margin:0 auto;
}
.grooveLeft{
  height:120px;
  width:6px;
  background:#bbb;
}
.grooveLeft2{
  height:8px;
  background:#fff;
  width:6px;
  margin-left:-2px;
  -ms-transform: skew(-30deg,10deg); /* IE 9 */
    -webkit-transform: skew(-30deg,10deg); /* Chrome, Safari, Opera */
    transform: skew(-30deg,10deg);
}
.grooveLeft3{
  height:12px;
  background:#ffffff;
  width:10px;
  margin-top:15px;
  margin-left:-2px;
  -ms-transform: skew(-530deg,0deg); /* IE 9 */
  -webkit-transform: skew(-350deg,0deg); /* Chrome, Safari, Opera */
  transform: skew(-530deg,0deg);
  border-bottom-right-radius:6px;
}
.grooveRight{
  height:150px;
  width:3px;
  background:#bbb;
  margin:-155px 0px 0px 20px;
}
.keyPoint{
  height:0px;
  width:15px;
  margin:0 auto;
  border-left:10px solid transparent;
  border-right:10px solid transparent;
  border-top:51px solid #ccc;
  border-bottom-left-radius:30px;
  border-bottom-right-radius:10px;
}
.grooveRight2{
  height:52px;
  width:3px;
  background:#bbb;
  margin:-54px 25px 0px 10px;
  border-bottom-left-radius:30px;
}
.grooveRight3{
  height:20px;
  width:6px;
  background:#fff;
  margin:-20px 0px 0px 32px;
  -ms-transform: skew(10deg,220deg); /* IE 9 */
  -webkit-transform: skew(10deg,220deg); /* Chrome, Safari, Opera */
  transform: skew(10deg,220deg);
  border-top-left-radius:5px;
  position:relative;
}
.bump{
  height:25px;
  width:8px;
  background:#ccc;
  margin:-23px 0px 0px 15px;
  border-radius:0px 30px 50px 50px;
  -ms-transform: skew(-9deg,-10deg); /* IE 9 */
  -webkit-transform: skew(-9deg,-10deg); /* Chrome, Safari, Opera */
  transform: skew(-9deg,-10deg);
}
/*MODEL CAR*/
.modelCarBody{
  width:350px;
  height:130px;
  background:blue;
  margin:90px 0px 0px 60px;
  border-radius:60px 100% 0px 0px;
  position:relative;
  z-index:0;
  border-top:2px solid #000;
  border-right:2px solid #000;
  z-index:1;
}
.clearTrunk{
  height:60px;
  width:20px;
  background:background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #ffffff 48%, #000000 48%, #000000 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(48%,#ffffff), color-stop(48%,#000000), color-stop(100%,#000000)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffffff 0%,#ffffff 54%,#000000 45%,#000000 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffffff 0%,#ffffff 54%,#000000 45%,#000000 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffffff 0%,#ffffff 54%,#000000 45%,#000000 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 54%,#000000 45%,#000000 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
;
  position:absolute;
  margin:18px 0px 0px 0px;
  border-radius:50px 0px 0px 0px;
}
.modelCarTrunk{
  width:61px;
  height:8px;
  background:blue;
  border-radius:80% 100% 0px 0px;
  transform:rotate(-90deg);
  position:absolute;
  top:30px;
  left:-28px;
  transition: all 1s ease;
  border-top:25px solid transparent;
  border-right:2px solid black;
}
.modelCarTrunk.up{
  transform:rotateX(-350deg) rotateY(-30deg);
  transform:translateY(-45px) translateX(-15px);
  top:35px;
  left:-25px;
}
.antenna{
  width:3px;
  height:40px;
  background:#000;
  margin:-22px 0px 0px 50px;
  position:absolute;
  -ms-transform:rotate(-50deg);
  -webkit-transform:rotate(-50deg);
  transform: rotate(-50deg);
}
.window{
  width:50px;
  height:35px;
  background:rgba(255,255,255,0.3);
  position:absolute;
  right:125px;
  top:45px;
  border-radius:0px 10px 0px 0px;
}
.windshield{
  height:40px;
  width:40px;
  background:rgba(255,255,255,0.3);
  position:absolute;
  right:70px;
  top:20px;
  transform:rotate(-40deg);
  transform: skew(10deg, 315deg);
}
.windowBack{
  width:60px;
  height:35px;
  background:rgba(255,255,255,0.3);
  position:absolute;
  left:90px;
  top:45px;
  border-radius:0px 0px 0px 0px;
}
.windowLock{
  width:2px;
  height:5px;
  background:#000;
  margin:30px 0px 0px 5px;
}
.headlight{
  height:25px;
  width:10px;
  background:rgba(211,211,4,.8);
  position:absolute;
  right:18px;
  top:78px;
  border-radius:0px 50% 50% 0px;
  border-top:7px solid #fff;
}
#headlightFlash{
  height:10px;
  width:30px;
  border-radius:50%;
  background:yellow;
  margin:20px 0px 0px 550px;
  position:absolute;
  z-index:1;
}
#headlightFlash1{
  height:10px;
  width:30px;
  border-radius:50%;
  background:yellow;
  margin:70px 0px 0px 550px;
  position:absolute;
  z-index:1;
}
#brake{
  height:18px;
  width:12px;
  position:absolute;
  bottom:5px;
  border-radius:0px 5px 0px 0px;
  z-index:1;
  background:red;
  left:0px;
  margin:0;
}
.flash.panic{
    -webkit-animation-name: blinker;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;  
    -moz-animation-name: blinker;
    -moz-animation-duration: 1s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;  
    animation-name: blinker;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
.grill{
  height:2px;
  width:10px;
  background:#000;
  position:absolute;
  right:0px;
  top:118px;
  border-radius:0 80% 80% 0;
}
.grill1{
  height:2px;
  width:10px;
  background:#000;
  position:absolute;
  right:0px;
  top:112px;
  border-radius:0 80% 80% 0;
}
.grill2{
  height:2px;
  width:10px;
  background:#000;
  position:absolute;
  right:0px;
  top:106px;
  border-radius:0 80% 80% 0;
}
.under{
  height:6px;
  width:100%;
  background:#000;
  position:absolute;
  right:0px;
  bottom:0px;
  border-radius:0 80% 80% 0;
}
.wheelGap{
  height:60px;
  width:60px;
  border-radius:50%;
  background:#fff;
  margin:-30px 0px 0px 80px;
  position:absolute;
  z-index:1;
}
.wheelGap1{
  height:60px;
  width:60px;
  border-radius:50%;
  background:#fff;
  margin:-30px 0px 0px 285px;
  position:absolute;
  z-index:1;
}
.tire{
  height:60px;
  width:60px;
  background:rgba(0,0,0,.8);
  border-radius:50%;
  margin:0px 0px 0px 0px;
  -webkit-animation: rotation 1.5s linear infinite;
  -moz-animation: rotation 1.5s linear infinite;
  -ms-animation: rotation 1.5s linear infinite;
}
.hub{
	width: 0;
	height: 0;
	border: 4px solid transparent;
	border-bottom: 15px solid #222;
	position: absolute;
  left:42px;
	top: 5px;
  transform:rotate(46deg);
}
.hub:after {
	content: '';
	position: absolute;
	left: -4px; top: 14px;
	width: 0;
	height: 0;
	border: 4px solid transparent;
	border-top: 15px solid #111;
  position:absolute;
}
.hub1{
	width: 0;
	height: 0;
	border: 4px solid transparent;
	border-bottom: 15px solid #111;
	position: absolute;
  left:28px;
	top: 22px;
  transform:rotate(-54deg);
}
.hub1:after {
	content: '';
	position: absolute;
	left: -4px; top: 14px;
	width: 0;
	height: 0;
	border: 4px solid transparent;
	border-top: 15px solid #222;
  position:absolute;
}
.hub2{
	width: 0;
	height: 0;
	border: 4px solid transparent;
	border-bottom: 15px solid #111;
	position: absolute;
  left:25px;
	top:22px;
  transform:rotate(21deg);
}
.hub2:after {
	content: '';
	position: absolute;
	left: -4px; top: 14px;
	width: 0;
	height: 0;
	border: 4px solid transparent;
	border-top: 15px solid #222;
  position:absolute;
}
.hub3{
	width: 0;
	height: 0;
	border: 4px solid transparent;
	border-bottom: 15px solid #111;
	position: absolute;
  left:21px;
	top:20px;
  transform:rotate(85deg);
}
.hub3:after {
	content: '';
	position: absolute;
	left: -4px; top: 15px;
	width: 0;
	height: 0;
	border: 4px solid transparent;
	border-top: 15px solid #222;
  position:absolute;
}
.hub4{
	width: 0;
	height: 0;
	border: 4px solid transparent;
	border-bottom: 15px solid #111;
	position: absolute;
  left:25px;
	top:16px;
  transform:rotate(160deg);
}
.hub4:after {
	content: '';
	position: absolute;
	left: -4px; top: 14px;
	width: 0;
	height: 0;
	border: 4px solid transparent;
	border-top: 15px solid #222;
  position:absolute;
}
/**ROAD**/
.road{
  height:245px;
  width:100%;
  background:#000;
  margin:-80px 0px 0px 0px;
  position:relative;
  z-index:0;
}
.yellowLines{
  width:100%;
  height:120px;
  border-top:3px dashed yellow;
  margin:140px 0px 0px 0px;
  float:left;
}
@-webkit-keyframes rotation {
    0%   { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}
@-moz-keyframes rotation {
    0%   { -moz-transform: rotate(0deg); }
    100% { -moz-transform: rotate(360deg); }
}
@-ms-keyframes rotation {
    0%   { -ms-transform: rotate(0deg); }
    100% { -ms-transform: rotate(360deg); }
}

@-moz-keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}

@-webkit-keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}

@keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}