@import url(http://fonts.googleapis.com/css?family=PT+Sans);
@import url("base.css");				/* Default Reset, Typography, Forms, etc. */ 
@import url("skeleton.css");			/* 960 Grid + Media Query Layouts */
@import url("../plugins/font-awesome/css/font-awesome.css");

* { margin:0; padding:0; }
body { font-family:Arial,Tahoma,Verdana; font-size:14px; background:#fff; color:#929292; margin:0; padding:0; }

h1, h2, h3, h4, h5, h6 { font-family:"PT Sans", Verdana, Tahoma, serif; color:#4c4c4c; font-weight: normal; }
h1 { font-size:26px; line-height:30px; }
h2 { font-size:29px; line-height:34px; }
h3 { font-size:22px; line-height:32px; }
h4 { font-size:20px; line-height:30px; }
h5 { font-size:18px; line-height:26px; }
h6 { font-size:16px; line-height:24px; }

span.active { color:#cc092f; }

/* #HERO
================================================== */
.hero { position:relative; width:100%; height:400px; background:url(../images/intro/hero_bg.png) no-repeat center center fixed; background-size:cover; color:#fff; }
.hero { text-align:center; padding:90px 0 120px 0; }
.hero h2 { color:#fff; margin-bottom:30px; }
.hero h3 { display:inline-block; background:#fff; margin-bottom:50px; padding:5px 15px; }

.hero a.btn_demos { border:1px solid #fff; color:#fff; text-decoration:none; padding:10px 15px;
    -moz-transition: border-color 0.3s ease-in-out,color 0.3s ease-in-out,background-color 0.3s ease-in-out;
    -o-transition: border-color 0.3s ease-in-out,color 0.3s ease-in-out,background-color 0.3s ease-in-out;
    -webkit-transition: border-color 0.3s ease-in-out,color 0.3s ease-in-out,background-color 0.3s ease-in-out;
    transition: border-color 0.3s ease-in-out,color 0.3s ease-in-out,background-color 0.3s ease-in-out;
}
.hero a.btn_demos i { margin-left:5px; }
.hero a.btn_demos:hover { background:#ffffff; color:#000; }

.hero .social { margin-top:40px; }
.hero .social .social_item { display:inline-block; vertical-align:top; margin-left:30px; }


/* #DEMOS
================================================== */
.demos { padding:40px 0; text-align:center; }
.demos h2 { margin-bottom:50px; }
.demos .demo { margin-bottom:10px; }
.demos .demo img.preview { width:100%; border:1px solid #f3f3f3; box-shadow:0 0 5px #dddddd; padding:2px; }


/* #FEATURES
================================================== */
.features { background:#fafafa; padding:50px 0; text-align:center; }
.features h2 { margin-bottom:50px; }
.features .feature { margin-bottom:10px; }
.features .feature .icon { display:inline-block; width:60px; height:60px; background:#cc092f; border-radius:50%; margin-bottom:10px; }
.features .feature .icon i { margin-top:17px; color:#fff; font-size:25px; }


/* #TECHNOLOGIES
================================================== */
.technologies { padding:50px 0; text-align:center; }
.technologies h2 { margin-bottom:50px; }


/* #FOOTER
================================================== */
.footer { background:#4c4c4c; color:#D9D9D9; padding:20px 0; }
.footer strong, .footer a { color:#ffffff; text-decoration:none; border-bottom:1px dotted #fff; font-weight:bold; }
.footer a:hover { color:#cc092f; }

.footer a#btn_goto_top { float:right; text-decoration:none; border-bottom:none; font-size:18px; color:#fff; }
.footer a#btn_goto_top:hover { color:#cc092f; }



/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
    .hero { background:url(../images/intro/hero_bg_mobile.png) no-repeat center center fixed; background-size:cover; }
}
/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
    
}
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (min-width: 320px) and (max-width: 480px) {
    .hero { padding:30px 0 210px 0; }
    .hero h2 { font-size:21px; }
    .hero h3 { font-size:19px; }
    .hero .social .social_item.facebook { margin-bottom:20px; }
}