@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:300);

.anim-slider { height: 560px; left: 0; list-style-type: none; margin: 0; overflow: hidden; padding: 0; position: relative; text-align: center; top: 20px; width: 100%; z-index:0}

.anim-dots span {border-radius: 100%; background: none repeat scroll 0 0 #99a3ad; cursor: pointer; display: inline-block;height: 14px; margin: 3px; position: relative;width: 14px;}

.anim-dots span.anim-dots-this:after { background: none repeat scroll 0 0 #2d3d4f;border-radius: 100%; content: ""; height: 14px;left: 0; position: absolute;top: 0; width: 14px;}
  .anim-slide h1 { color:#FFF; font-weight: 300; font-size: 6em; }
  .anim-slide h2 { color: #FFF; font-size: 15px; }
  .anim-slide h3 { color: #FFF; font-size: 15px; }
 
  .anim-slide h1#slider3{text-shadow: -1px 1px 0px;top:0%; padding: 0% 90% 1% 0% ; width:100% ; font-size:35px  }
  .anim-slide h1#slider{text-shadow: -1px 1px 0px;top: 8%;padding: 15% 80% 0% 0% ; width:100%; font-size:150px ;font-family: 'Rouge Script', cursive; }
  .anim-slide h1#slider2{text-shadow: -1px 1px 0px; top: 15%; padding: 12% 80% 0% 0% ; width:100%; font-size:150px ;font-family: 'Rouge Script', cursive;  }
  .anim-slide h2#plugin{ width:100%; top: 54%; left:5%;padding: 6% 0% 1% 25% ; line-height:10px ; font-size:35px}
  .anim-slide h4#address{ color:#FFF; width:100%; top: 54%; left:5%;padding: 10% 15% 1% 0% ; line-height:30px ; font-size:35px ; font-family: 'Dancing Script', cursive;}
  .anim-slide h2#listing{ width:100%;top: 54%; left:12%;padding: 0% 0% 1% 2% ; line-height:22px}
  .anim-slide h2#listing1{ width:100%;top: 58%; left:12%;padding: 0% 0% 1% 2% ; line-height:22px}
  .anim-slide h2#listing2{ width:100%;top: 62%; left:12%;padding: 0% 0% 1% 2% ; line-height:22px}
  .anim-slide h2#listing3{ width:100%;top: 66%; left:12%;padding: 0% 0% 1% 2% ; line-height:22px}
  .anim-slide h1#header_slider{text-shadow: -1px 1px 0px;top: 8%; left:13% ; width:100%; font-size:35px  }
  .anim-slide h1#header_slider2{text-shadow: -1px 1px 0px;top: 15%;left:24%; width:100%; font-size:55px  }
  .anim-slide h1#logo_slider{text-shadow: -1px 1px 0px;top: -2%; left:-12% ; width:100%; font-size:65px }
  .anim-slide h1#logosub_slider{text-shadow: -1px 1px 0px;top: 10%; left:-29% ; width:100%; font-size:40px }
  
 
  .anim-slide h3#license{  position: absolute;   top: 43% ; left:44%; vertical-align: middle; }
  .anim-slide h3#license span#letter{ color:#999; top:10px ; left: 30px; font-size:16px ; padding:0px; margin:0px }
  .anim-slide h3#license span#numbers{ color:#999; top:35px ; left: 25px; font-size:20px ; padding:0px; margin:0px; font-weight:bold}
  .anim-slide h3#license span#letter2{ color:#999; top:60px ; left: 25px; font-size:20px ; padding:0px; margin:0px}
  
   .anim-slide h3#price{ background: #FFF;  border-radius: 50%;  height: 100px;  position: absolute;  width: 100px; top: 40% ; left:40%; vertical-align: middle; }
  .anim-slide h3#price span#letter{ color:#999; top:10px ; left: 30px; font-size:16px ; padding:0px; margin:0px }
  .anim-slide h3#price span#numbers{ color:#999; top:35px ; left: 25px; font-size:20px ; padding:0px; margin:0px; font-weight:bold}
  .anim-slide h3#price span#letter2{ color:#999; top:60px ; left: 25px; font-size:20px ; padding:0px; margin:0px}
  
  
  
  
  .anim-slide h4#version{ background: #2db34a;  border-radius: 50%;  height: 180px;  position: absolute;  width: 180px; top: 55% ; left:50%; vertical-align: middle;  }
  .anim-slide h4#version span#letter{ color:#FFF; top:35px ; left: 35px; font-size:30px ; padding:0px; margin:0px }
  .anim-slide h4#version span#numbers{ color:#FFF; top:80px ; left: 40px; font-size:40px ; padding:0px; margin:0px; font-weight:bold}
  .anim-slide h4#version span#letter2{ color:#FFF; top:120px ; left: 50px; font-size:30px ; padding:0px; margin:0px}
  
  .anim-slide h4#price2{ background: #2db34a;  border-radius: 50%;  height: 180px;  position: absolute;  width: 180px; top: 55% ; left:35%; vertical-align: middle;  }
  .anim-slide h4#price2 span#letter{ color:#FFF; top:35px ; left: 35px; font-size:30px ; padding:0px; margin:0px }
  .anim-slide h4#price2 span#numbers{ color:#FFF; top:80px ; left: 40px; font-size:40px ; padding:0px; margin:0px; font-weight:bold}
  .anim-slide h4#price2 span#letter2{ color:#FFF; top:120px ; left: 50px; font-size:30px ; padding:0px; margin:0px}
  
  .anim-slide img#css31{left: 66%;top: 42%; width:30%}
  
  .anim-slide img#imgsec{top: 0%;left: 0%;}
  
  .anim-slide h3#todo{top: 0%;left: 20%;}
  .anim-slide h3#lightspeed{top: 15%;left: 45%;}
  .anim-slide h4#zoomup{top: 15%;left: 60%;}
  .anim-slide h4#bounceRight{top: 15%;left: 75%;}
  .anim-slide h3#rollin{top:31%;left: 20%;}
  .anim-slide h4#fadeDown{top: 43%;left: 28%;}
  .anim-slide h4#fadeUp{top: 31%;left: 28%;}
  .anim-slide h3#rotate{top: 50%;left: 49%;}
  .anim-slide h4#rotateRight{top: 50%;left: 61%;}
  .anim-slide h4#rotateLeft{top: 50%;left: 80%;}

  .anim-slide img#css3{left: 22%;top: 60%;}
   .anim-slide img#html5{left: 35%;top: 60%;}
    .anim-slide img#magento{left: 50%;top: 75%;}
  .anim-slide img#wordpress{left: 70%;top: 60%;}
 
  .anim-slide img#jquery{top: 75%;left: 70%;}
  .anim-slide img#modernizr{top: 60%;left: 50%;}
  .anim-slide img#seo{top:14%;left: 60%;color: #f35626;}
  
 
  
  .anim-slide h4#start_now{height: 100px;  position: absolute;  width: 100px;vertical-align: middle;top: 85%;left: 90%;color: #FFF; font-weight:bold ; font-size:5px  }
  .anim-slide h4#start_now span#letter{ color:#FFF; top:35px ; left: 7px; font-size:15px ; padding:0px; margin:0px}
  .anim-slide h4#start_now span#numbers{ color:#FFF; top:60px ; left: -5px; font-size:18px ; padding:0px; margin:0px; font-weight:bold}
  
  .anim-slide h5#start_now{height: 100px;  position: absolute;  width: 100px; vertical-align: middle;top: 83%;left: 90%;color: #FFF; font-weight:bold ; font-size:5px  }
  .anim-slide h5#start_now span#letter{ color:#FFF; top:35px ; left: 7px; font-size:15px ; padding:0px; margin:0px}
  .anim-slide h5#start_now span#numbers{ color:#FFF; top:60px ; left: -5px; font-size:18px ; padding:0px; margin:0px; font-weight:bold}
  
  .anim-slide h6#start_now{height: 100px;  position: absolute;  width: 100px;vertical-align: middle;top: 83%;left: 90%;color: #FFF; font-weight:bold ; font-size:5px  }
  .anim-slide h6#start_now span#letter{ color:#FFF; top:35px ; left: 7px; font-size:15px ; padding:0px; margin:0px}
  .anim-slide h6#start_now span#numbers{ color:#FFF; top:60px ; left: -5px; font-size:18px ; padding:0px; margin:0px; font-weight:bold}
  
  
  
  
  
  
  
  div#demo{text-align: center;}
  div#demo>a{display:inline-block;text-decoration: none;}
  div#demo>a>h4{padding: 5px 8px;margin: 20px;background-color: #225A86;color: #fff;box-shadow:inset 0 -2px 0 rgba(0,0,0,0.15);}
  p#credits{z-index:-1;position: fixed;bottom: 0px;width: 100%;text-align: center;font-size: 14px;}
  p#credits>a{font-weight: bold;color: #999;text-decoration: none;}
  img#github-logo{z-index:-1;position: fixed;bottom: -20px;right: 2%;opacity: 0.4;}
  .wpb_content_element{height:650px}
  @media (max-width: 479px){
   .anim-slide h1#slider{text-shadow: -1px 1px 0px;top: 10%;padding: 15% 80% 0% 0% ; width:100%; font-size:50px ;font-family: 'Rouge Script', cursive; } 
   .anim-slide h1#slider2{text-shadow: -1px 1px 0px; top: 20%; padding: 12% 60% 0% 0% ; width:100%; font-size:50px ;font-family: 'Rouge Script', cursive;  }
   .anim-slide h3#license{  position: absolute;   top: 20% ; left:44%; vertical-align: middle; }
   .anim-slide h2#plugin{ width:100%; top: 40%; left:5%;padding: 6% 0% 1% 15% ; line-height:10px ; font-size:20px}
   .anim-slide h4#address{ color:#FFF; width:100%; top: 45%; left:5%;padding: 10% 15% 1% 0% ; line-height:30px ; font-size:25px ; font-family: 'Dancing Script', cursive;}
    .wpb_content_element{height:300px}
   }