/* Custom Style */
@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,800,900');
body{font-family: 'Poppins', sans-serif; font-size:14px; line-height:20px; margin:0; padding:0; color:#3c3c3c;}
*{ box-sizing:border-box; margin:0; padding:0;}
.layout{ max-width:1470px; padding:0 15px; margin:0 auto;}
img{ max-width:100%;}

/*========================================== Banner Strat ===========================================*/
.banner{ float:left; width:100%; text-align:center; padding:150px 0 200px; background:url(../images/banner.jpg) no-repeat center center; background-size:cover; position:relative;}
.banner .layout{ max-width:900px;}
.banner h1{ display:block; color:#fff; font-size:48px; line-height:54px; font-weight:500; margin-bottom:20px; margin-top:40px; text-transform:uppercase;}
.banner h2{ color:#fff; text-transform:uppercase; font-size:18px; line-height:25px; font-weight:500; margin-bottom:30px;}
.banner p{ font-size:18px; line-height:25px; font-weight:400; color:#fff; margin-bottom:15px;}
.banner .btn, footer .btn{ display:inline-block; text-decoration:none; background:#f3b100; border:1px solid #f3b100; color:#fff; border-radius:5px; padding:8px 25px 7px; font-size:16px; line-height:20px; font-weight:400;transition: 0.5s ease; text-transform:uppercase;}
.banner .btn:hover, footer .btn:hover{ border-color:#fff; background:none;transition: 0.5s ease;}
.banner .arrow {position: absolute;bottom: 40px;left: 50%;margin-left:-20px;width: 40px;height: 40px; text-decoration:none; font-size:45px; line-height:45px; color:#fff;}
.banner .bounce { -moz-animation: bounce 2s infinite; -webkit-animation: bounce 2s infinite; animation: bounce 2s infinite;}
@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  60% {
    transform: translateY(-15px);
  }
}
/*========================================== Banner End ===========================================*/

/*========================================== Templates Demo Strat ===========================================*/
.templates-demo{ float:left; width:100%; padding:80px 0; text-align:center;}
.title{ float:left; width:100%; padding-bottom:70px; text-align:center;}
.title h2{ text-transform:uppercase; font-size:40px; line-height:45px; font-weight:600; position:relative; padding:0 0 20px 0;}
.title h2:after{ content: "";width: 70px;height: 2px;background-color: #f3b100;position: absolute;left: 50%;-webkit-transform: translate(-50%);bottom: 0;}
.templates-demo li{ float:left; width:50%; padding:0 50px; list-style:none;margin-bottom: 30px;}
.templates-demo li h2{ font-size:20px; font-weight:400; line-height:25px; color:#3c3c3c; padding:20px 0 0 0; text-transform:uppercase;margin-bottom: 40px;}
.templates-demo a{ display:inline-block; line-height:0;}
.templates-demo a:hover .inner{-webkit-transform: translateY(-20px);transform: translateY(-20px); -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
.templates-demo .inner{ box-shadow:0 0 35px rgba(0,0,0, 0.3); -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
/*========================================== Templates Demo End ===========================================*/

/*========================================== Theme Features Strat ===========================================*/
.theme-features{ float:left; width:100%; padding:80px 0 50px 0; background:#f6f6f6;}
.theme-features li{ float:left; width:33.333%; padding:0 15px; text-align:center; list-style:none; margin-bottom:30px;}
.theme-features li .inner{ float:left; width:100%; border:1px solid #eeeeee; background:#fff;min-height:250px; padding:50px 5px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
.theme-features li:hover .inner{ background:#e5e5e5; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
.theme-features li img{ border-radius:100%; border:1px solid #dcdcdc;}
.theme-features li:hover img{ border-color:#a5a4a4;}
.theme-features li h2{ font-weight:500; font-size:18px; line-height:25px; margin-top:20px;}
/*========================================== Theme Features End ===========================================*/

/*========================================== Rate Us Strat ===========================================*/
.rate-us{ float:left; width:100%; padding:150px 0; text-align:center;}
.rate-us .thanks{ width: 60%;margin: 0 auto;box-shadow: 0 0 25px rgba(0,0,0, 0.3);padding: 65px 0;}
.rate-us .thanks li{ list-style:none; display:inline-block; padding:0 1px;}
.rate-us .thanks li img{ max-width:20px;}
.rate-us .thanks p{font-size:25px; line-height:30px; margin:10px 0 25px 0; color:#817f8e;}
.rate-us .thanks span{font-size: 30px;color: #625e5c;}
/*========================================== Rate Us End ===========================================*/

footer{ float:left; width:100%;}
.footer-top{padding:80px 0; text-align:center; background:#333333;;}
footer h2{ color:#fff; font-weight:600; font-size:25px; line-height:30px; margin-bottom:20px;}
.copy-right{ float:left; width:100%; background:#474747; padding:20px 0; text-align:center;}
.copy-right p{ color:#fff;}
/*========================================== Media css Strat ===========================================*/
@media (max-width:1023px) {
.banner{ padding:150px 0;}
.banner h1{ font-size:40px; line-height:46px;}
.banner h2{ font-size:16px; line-height:20px;}
.templates-demo{ padding:50px 0;}
.templates-demo li{ padding:0 10px;}
.title{ padding-bottom:50px;}
.title h2{ font-size:34px; line-height:40px;}
.theme-features{ padding:50px 0 20px;}
.theme-features li{ width:50%;}
.rate-us{ padding:100px 0;}
.rate-us .thanks{ width:80%;}
.footer-top{ padding:50px 15px;}
}
@media (max-width:767px) {
.banner{ padding:100px 0;}
.banner h1{ font-size:28px; line-height:35px;}
.banner p{ font-size:16px;}
.title h2{ font-size:24px; line-height:28px;}
.templates-demo li{ width:100%; padding:0 30px; margin-bottom:40px;}
.templates-demo li:last-child{ margin-bottom:0;}
.theme-features li{ width:100%;}
.rate-us{ padding:80px 0;}
.rate-us .thanks{ width:90%;}
.rate-us .thanks p{ font-size:20px; line-height:25px; margin:5px 0 15px 0;}
.rate-us .thanks span{ font-size:24px; line-height:30px;}
footer h2{ font-size:20px; line-height:25px;}
.copy-right p{ font-size:12px;}
}
/*========================================== Media css End ===========================================*/