/*=========================================================
Author       : Syed Ekram.
Template Name: Restart - Responsive App Landing Page
Version      : 1.0
==============================================================*/

/*=============================================================
    CSS INDEX
    =============================
    01. GENERAL STYLE (body, link color, section-title, preloader btn, overlay, section-padding etc)
    02. BOOTSTRAP NAVIGATION OVERRIDES
    03. START HOME DESIGN
    04. START ABOUT US DESIGN
    05. START FEATURE DESIGN
    06. START AMAZING FEATURES DESIGN
    07. START HOW IT WORKS DESIGN
    08. START APP SCREENSHOT DESIGN
    09. START OWN VIDEO DESIGN
    10. START PRICING DESIGN
    11. START TESTIMONIAL DESIGN
    12. START DOWNLOAD DESIGN
    13. START CUNTING DESIGN
    14. START NEWSSITE DESIGN
    15. START NEWSLETTER DESIGN
    16. START CONTACT FORM & CONTACT ADDRESS DESIGN
    17. START FOOTER DESIGN
 *=============================================================*/
  
/*==========================*
  01.START GENERAL STYLE
 *=========================*/
body {
color: #555;
font-family: 'Ubuntu', sans-serif;
font-size: 16px;
font-weight: 300;
line-height: 30px;
background:#fff;
overflow-x:hidden;
}
html,
body { height: 100% }
h1,
h2,
h3,
h4,
h5,
h6 {
  letter-spacing: 0px;
  margin-top: 0px; 
  color: #333;
  font-weight: 400;
}
a {
text-decoration: none;
transition: all 0.2s ease 0s;
}
a:hover {
    color: #fff;
    text-decoration: none;
}
a:focus {
    outline: none;
    text-decoration: none;
}
p {
    margin-bottom: 0;
}
ul,
li {
    margin: 0;
    padding: 0;
}

::-webkit-input-placeholder {
  font-weight: 300;
  font-family: 'Ubuntu', sans-serif; }

:-moz-placeholder {
  font-weight: 300;
  font-family: 'Ubuntu', sans-serif; }

::-moz-placeholder {
  font-weight: 300;
  font-family: 'Ubuntu', sans-serif; }

:-ms-input-placeholder {
  font-weight: 300;
  font-family: 'Ubuntu', sans-serif; }
fieldset {
    border: 0 none;
    margin: 0 auto;
    padding: 0;
}
/*START PRELOADER DESIGN*/
.preloader {
    background: #fff;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 99999;
}

.status-mes {
    width: 80px;
    height: 80px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -40px 0 0 -40px;
    font-size: 10px;
    text-indent: -12345px;
    border-top: 5px solid rgba(0, 0, 0, 0.08);
    border-right: 5px solid rgba(0, 0, 0, 0.08);
    border-bottom: 5px solid rgba(0, 0, 0, 0.08);
    border-left: 5px solid #ffb900;
    border-radius: 50%;
    -webkit-animation: spinner 700ms infinite linear;
    animation: spinner 700ms infinite linear;
    z-index: 10000;
}
/*END PRELOADER DESIGN*/

@-webkit-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
.section-padding { padding: 60px 0 }
.no-padding { padding: 0 }

/* BTN START */
.btn {
background: #ffb900 none repeat scroll 0 0;
border-radius: 5px;
color: #fff;
padding: 12px 35px;
text-transform: capitalize;
}
.btn:hover{
background: #333 none repeat scroll 0 0;
color:#fff;
}
/* BTN END */

/*START SCROLL TO TOP*/
.topcontrol {
background: #ffb900 none repeat scroll 0 0;
border-radius: 30px;
bottom: 5px;
box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
color: #fff;
cursor: pointer;
font-size: 30px;
height: 50px;
line-height: 47px;
opacity: 1;
position: fixed;
right: 5px;
text-align: center;
transition: all 0.2s ease 0s;
width: 50px;
}
.topcontrol:hover {
    background: #333;
    color: #fff;
}
/*END SCROLL TO TOP*/

/*START SECTION TITLE DESIGN*/
.section-title { margin-bottom: 60px }
.section-title  h2 {
font-size: 46px;
font-weight: 500;
margin-bottom: 0;
margin-top: 0;
position: relative;
text-transform: capitalize;
}
.section-title p {
font-weight: 400;
line-height: 25px;
position: relative;
}
.line{
background: #ffb900 none repeat scroll 0 0;
border-radius: 2px;
display: block;
height: 4px;
margin: 20px auto;
width: 60px;
}
@media only screen and (max-width:480px) { 
.section-title  p{padding:0 15px}
}
/*END SECTION TITLE DESIGN*/
/*==========================*
  01.END GENERAL STYLE
 *=========================*/

/*==========================================*
  02.START BOOTSTRAP NAVIGATION OVERRIDES
 *==========================================*/
.navbar-default {
    border: none;
    border-radius: 0;
    margin-bottom: 0;
    width: 100%;
    padding: 20px 0;
    background: none;
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
}
.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus {
background-color: transparent;
color: #ffb900 !important;
}
.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:hover,
.navbar-default .navbar-nav>.open>a:focus {
    color: #171717 !important;
    background-color: transparent;
}
.navbar-brand { padding: 0px }
.navbar-brand img {
    width: 150px;
    margin-left: 10px;
}
@media only screen and (max-width:768px) { 
  .navbar-brand img {
  width: 110px;
}
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form { border-color: #fff }
.menu-top li a {
	color: #fff !important;
	font-size: 15px;
	text-transform: uppercase;
	font-weight: 500;
}
.menu-top li a:hover { color: #ffb900 !important }
@media only screen and (max-width:768px) { 
    .navbar-default .navbar-nav > li > a {
        margin-top: 10px;
        padding: 5px;
    }
}
@media only screen and (max-width:480px) { 
    .menu-top { background-color: #fff }
    .navbar-default .navbar-nav > li > a { color: #313131  !important }
}
.navbar-default.menu-shrink {
background: #fff none repeat scroll 0 0;
box-shadow: 0 5px 40px 0 rgba(42, 111, 199, 0.2);
margin-top: 0;
padding: 10px 0;
width: 100%;
}
@media only screen and (max-width:480px) { 
    .menu-top {
        color: #fff !important;
        margin-left: 0px;
    }
}
.navbar-default.menu-shrink li a {color:#333 !important; }
.navbar-default.menu-shrink li a:hover { color: #ffb900 !important; }
.navbar-default .navbar-toggle { background: #fff none repeat scroll 0 0 }
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus { background-color: #fff }
.navbar-default .navbar-toggle .icon-bar { background-color: #ffb900 }

.btn_download{
float: right;
margin-left: 10px;
margin-top: 2px;
}
@media only screen and (max-width:480px) { 
.btn_download {
float: none;
margin-left: 3px;
}
}
.btn_download {
background: #ffb900 none repeat scroll 0 0;
border: 2px solid #ffb900;
border-radius: 30px;
color: #fff;
font-weight: 500;
padding:14px 35px!important;
text-transform: uppercase;
box-shadow:0 5px 40px 0 rgba(42, 111, 199, 0.2);
}
.btn_download:hover{
background:#fff!important;
border: 2px solid #fff!important;
color:#fff!important;
}
.navbar-default.menu-shrink li a.btn_download {
background: #ffb900 none repeat scroll 0 0!important; 
border: 2px solid #ffb900!important;
color:#fff !important; }

.navbar-default.menu-shrink li a.btn_download:hover { color:#333 !important; }
@media only screen and (max-width:480px) { 
    .navbar-default .navbar-nav > li > a.btn_download{color:#333  !important }
    .navbar-default .navbar-nav > li > a.btn_download:hover{color:#333  !important }
}
/*==========================================*
  02.END BOOTSTRAP NAVIGATION OVERRIDES
 *==========================================*/
 
/*========================* 
  03.START HOME DESIGN
 *=======================*/
 #particles-js {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
}

.home_bg {
	
    height: 750px;
    position: relative;
}
@media only screen and (max-width:768px) { 
.home_bg {height: 1180px ;}
}

@media only screen and (max-width:480px) { 
.home_bg {height: 1000px ;}
}

@media only screen and (max-width:375px) { 
.home_bg {height: 970px;}
}
@media only screen and (max-width:360px) { 
.home_bg {height: 950px;}
}
@media only screen and (max-width:320px) { 
.home_bg {height: 930px;}
}
.home_bg:before {
    background: rgba(0, 0, 0, 0.4);
    content: "";
    height: 100%;
    filter: alpha(opacity=80);
    position: absolute;
    width: 100%;
}


.hero-text {
	margin-top: 0;
}
@media only screen and (max-width:768px) { 
.hero-text {
margin-top: 70px ;
text-align: center;
}
}
@media only screen and (max-width:480px) { 
.hero-text {
margin-top: 20px;

}
}
@media only screen and (max-width:375px) { 
.hero-text {
margin-top: 10px ;

}
}
@media only screen and (max-width:360px) { 
.hero-text {
margin-top: 0px;

}
}

.hero-text h2 {
color: #fff;
font-size: 60px;
padding-top: 250px;
text-transform: capitalize;
}
@media only screen and (max-width:768px) { 
.hero-text h2 {
font-size: 50px;
line-height: 56px;
padding-top:150px;
}
}
@media only screen and (max-width:480px) { 
    .hero-text h2 {
		font-size: 50px;
        line-height: 55px;
    }
}
@media only screen and (max-width:414px) { 
    .hero-text h2 {
		font-size: 45px;
        line-height: 50px;
    }
}
@media only screen and (max-width:375px) { 
    .hero-text h2 {
        font-size: 40px;
		line-height: 45px;
    }
}
@media only screen and (max-width:320px) { 
    .hero-text h2 {
       font-size: 35px;
	   line-height: 40px;
	}
}
.hero-text p {
color: #fff;
margin-top:20px;
}

.home_btn{
margin-left: -10px;
margin-top: 30px;
}
.home_btn a {
background: transparent none repeat scroll 0 0;
border: 2px solid #fff;
border-radius: 50px;
color: #fff;
display: inline-block;
margin: 0 10px 15px;
padding: 12px 40px;
transition: all 0.3s ease 0s;
}
.home_btn a:hover{
background:#fff;color:#333;
}
.home_btn a i{
font-size: 20px;
margin-right: 5px;
vertical-align: middle;
}

.app-btn {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
border: 2px solid #ffb900 !important;
color: #fff !important;
margin-right: 20px;
transition: all 0.3s ease 0s;
}
@media only screen and (max-width:414px) { 
    .app-btn {
	margin-bottom:30px;
	margin-right: 0;
}
}
.app-btn:hover{
background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
border: 2px solid #fff !important;
color:#fff !important;
}

.hero-text-img {
    padding-top: 250px;
    text-align: center;
}
.hero-text-img img {
  
}

.hero-img-reward {
	display: inline-block;
    margin-left: auto;
    margin-right: auto;
    height: 180px;
    width: 180px;
    margin: 10px;
}

@media only screen and (max-width:768px) { 
.hero-text-img{padding-top: 45px; }
}
@media only screen and (max-width:480px) { 
.hero-text-img img {width: 120px; height: 120px;}
}
@media only screen and (max-width:320px) { 
.hero-text-img{padding-top: 40px; }
}

/*========================* 
  03.END HOME DESIGN
 *=======================*/

/*============================*
  04.START ABOUT US DESIGN
 *==========================*/
 .about-content {
padding-bottom: 60px;
padding-top: 60px;
}
 .about-title {
  margin: 0 auto;
  width: 65%;
}
.aboutBox{ margin-top: 10px; }
@media only screen and (max-width:990px){
    .aboutBox{ margin-bottom: 30px; }
}
.aboutBox .aboutBox-title{
font-size: 22px;
margin: 0 0 20px;
text-align: center;
text-transform: capitalize;
}
.aboutBox .about-content{
    padding: 25px 20px 25px 50px;
    border-top: 2px solid #eee;
    border-right: 2px solid #eee;
    position: relative;
    transition: all 0.3s ease 0s;
}
.aboutBox:hover .about-content{
    border-top-color: #ffb900;
    border-right-color: #ffb900;
}
.aboutBox .about-content:before{
    content: "";
    width: 0;
    height: 2px;
    background: #eee;
    position: absolute;
    bottom: 0;
    right: 0;
    transition: all 0.3s ease 0s;
}
.aboutBox:hover .about-content:before{
    width: 50%;
    background: #ffb900;
}
.aboutBox .box-description{
line-height: 25px;
margin: 0;
padding: 0;
}
.aboutBox .about-icon{
background: #fff none repeat scroll 0 0;
border: 2px solid #eee;
border-radius: 50%;
color: #333;
font-size: 23px;
height: 50px;
left: 0;
line-height: 47px;
position: absolute;
text-align: center;
top: -25px;
transition: all 0.3s ease 0s;
width: 50px;
}
.aboutBox:hover .about-icon{
    border-color: #ffb900;
    color: #ffb900;
}

/*============================*
  04.END ABOUT US DESIGN
 *==========================*/
 
/*==========================*
  05.START FEATURE DESIGN
 *==========================*/
.feature {
background: #e3f2fd none repeat scroll 0 0;
}
.single_feature_img{text-align: center;}
@media only screen and (max-width:480px){
    .single_feature_img{ margin-bottom: 60px; }
}
.single_feature_img img {
display: inline-block;;
}
.single_feature {
padding: 40px 45px 0;
	
}
@media only screen and (max-width:768px) { 
.single_feature {padding:0 20px;}
}
@media only screen and (max-width:480px) { 
.single_feature {text-align:center;}
}
.single_feature h2{
color: #666;
font-size: 40px;
font-weight: 500;
} 
.single_feature h1 {
color: #333;
font-size: 35px;
font-weight: 700;
text-transform: capitalize;
}
@media only screen and (max-width:768px) { 
.single_feature h3{
font-size: 28px;
line-height: 40px;
margin-bottom: -20px;
}
}
@media only screen and (max-width:480px) { 
.single_feature h3{
font-size: 25px;
margin-top: 40px;
}
}
@media only screen and (max-width:414px) { 
.single_feature h3{font-size: 21px;}
}
@media only screen and (max-width:375px) { 
.single_feature h3{font-size: 25px;}
}
@media only screen and (max-width:360px) { 
.single_feature h3{font-size: 25px;}
}
@media only screen and (max-width:320px) { 
.single_feature h3{font-size: 22px;}
}
.single_feature p{
margin-top:20px;
margin-bottom:30px;

}
.single_feature i {
	color: #fc5004;
	margin-right: 10px;
}

/*==========================*
  05.END FEATURE DESIGN
 *==========================*/
 
/*===================================*
  06.START AMAZING FEATURES DESIGN
 *====================================*/
.amazing_feature{
padding-top:60px;
padding-bottom:30px;
}
.serviceBox{
border: 1px solid #eee;
margin-bottom: 30px;
margin-left: 40px;
padding: 30px 30px 30px 60px;
position: relative;
transition: all 0.3s ease 0s;
}
.serviceBox:hover{ background: #ffb900; }
.serviceBox .service-icon{
background: #ffb900 none repeat scroll 0 0;
bottom: 0;
color: #fff;
font-size: 30px;
height: 60px;
left: -30px;
line-height: 60px;
margin: auto 0;
position: absolute;
text-align: center;
top: 0;
transform: rotate(45deg);
transition: all 0.3s ease 0s;
width: 60px;
}
.serviceBox:hover .service-icon{
    color: #fff;
    background: #ffb900;
}
.serviceBox .service-icon i{
transform: rotate(-45deg);
color:#fff;
 }
.serviceBox .service-icon:after{
border: 1px solid #ffb900;
content: "";
height: 63px;
left: -4px;
position: absolute;
top: -4px;
transition: all 0.3s ease 0s;
width: 63px;
}
.serviceBox:hover .service-icon:after{ top: 1px; }
.serviceBox .title{
color: #333;
font-size: 20px;
font-weight: 500;
margin: 0 0 15px;
text-transform: capitalize;
}
.serviceBox:hover .title{color:#fff;}
.serviceBox .description{
color: #676666;
line-height: 25px;
margin-bottom: 0;
position: relative;
transition: all 0.3s ease 0s;
}
.serviceBox:hover .description{color:#fff;}
@media only screen and (max-width:990px){
    .serviceBox{ margin-bottom: 30px; }
}

/*===================================*
  06.END AMAZING FEATURES DESIGN
 *====================================*/

/*===============================*
  07.START HOW IT WORKS DESIGN
 *================================*/
.work_action {
background: #ffb900 none repeat scroll 0 0;
padding: 100px 0;
}
@media only screen and (max-width:768px) { 
	.work_action_text {text-align: center;}
}

.work_action_text h2 {
color: #fff;
font-size: 50px;
font-weight: 500;
margin-bottom: 20px;
margin-top: 0;
}
.work_action_text p {
  color: #fff;
  font-size: 20px;
}
@media only screen and (max-width:768px) { 
	.work_action_btn {text-align: center;}
}
.btn_action {
background: #fff none repeat scroll 0 0;
border-radius: 500px;
color: #333;
float: right;
margin-top: 20px;
padding: 16px 60px;
letter-spacing: 1px;
}
@media only screen and (max-width:768px) { 
	.btn_action {
	float:none;
	margin-top:40px;
}
}

/*===============================*
  07.END HOW IT WORKS DESIGN
 *================================*/

/*===================================*
  08.START APP SCREENSHOT DESIGN
 *==================================*/
.app-screenshot {
	background: #e3f2fd none repeat scroll 0 0;
}
.s-slider .item { margin: 15px }
.s-slider .item img {
    display: block;
    width: 100%;
    height: auto;
}
.owl-theme .owl-controls{
    width: 100%;
    height: 50px;
    opacity: 1;
    position: absolute;
    top: 38%;
}
.owl-theme .owl-controls .owl-buttons div{
    width: 50px;
    height: 50px;
    line-height: 40px;
    border-radius: 0;
    background: transparent;
}

.owl-prev{
    position: absolute;
    left: -5%;
}
.owl-next{
    position: absolute;
    right: -5%;
}
.owl-prev:after,
.owl-next:after{
background: #ffb900 none repeat scroll 0 0;
color: #fff;
content: "";
font-family: "FontAwesome";
font-size: 30px;
opacity: 1;
padding: 5px 15px;
}
.owl-next:after{ content: "\f105"; }

/*===================================*
  08.END APP SCREENSHOT DESIGN
 *==================================*/

/*============================*
  09.START OWN VIDEO DESIGN
 *============================*/
.own-video {
	padding: 80px 0;
	position: relative;
	
}
.own-video:before {
    background: rgba(0, 0, 0, 0.5);
    content: "";
    height: 100%;
    left: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    position: absolute;
    top: 0;
    width: 100%;
}
.video-play {
	display: inline-block;
	position: relative;
}
.own-video h3 {
color: #ffb900;
font-size: 60px;
font-weight: 700;
margin-bottom: 30px;
margin-top: 0;
position: relative;
text-transform: capitalize;
}
.video-play img {
 width: 100px;
}
.own-video p {
color: #fff;
font-size: 25px;
margin-top: 20px;
position: relative;
}
@media only screen and (max-width:480px) { 
    .own-video h3 { font-size: 40px }
	.own-video p{font-size: 22px }
}
@media only screen and (max-width:414px) { 
    .own-video h3 { font-size: 35px }
	.own-video p{font-size: 20px }
}
@media only screen and (max-width:375px) { 
    .own-video h3 { font-size: 32px }
	.own-video p{font-size: 19px }
}
@media only screen and (max-width:360px) { 
    .own-video h3 { font-size: 30px }
	.own-video p{font-size: 17px }
}
@media only screen and (max-width:320px) { 
    .own-video h3 { font-size: 28px }
	.own-video p{font-size: 16px }
}
/*============================*
  09.END OWN VIDEO DESIGN
 *============================*/

/*==========================*
  10.START PRICING DESIGN
 *============================*/
.our_pricing {
	padding-top: 60px;
	padding-bottom: 30px;
}
.pricingTable{
border: 1px solid #eee;
margin-bottom: 30px;
padding: 60px 0;
text-align: center;
transition: all 0.3s ease 0s;
}
.pricingTable:hover {
 box-shadow: 0 5px 40px 0 rgba(42, 111, 199, 0.2);
}
.pricingTable .price-value{
color: #333;
font-size: 60px;
font-weight: 600;
margin-bottom: 30px;
}
.pricingTable .month{
display: block;
font-size: 18px;
font-weight: normal;
margin-top: 30px;
text-transform: uppercase;
}
.pricingTable .title{
    display: inline-block;
    padding: 15px 40px;
    margin: 0 0 20px 0;
    background: #ffb900;
    font-size: 20px;
    color: #fff;
    text-transform: capitalize;
    letter-spacing: 1px;
    position: relative;
    transition: all 0.3s ease 0s;
}
.pricingTable:hover .title{
    background: #333;
    color: #fff;
}
.pricingTable .title:before,
.pricingTable .title:after{
    content: "";
    border-right: 26px solid #ffb900;
    border-top: 26px solid transparent;
    border-bottom: 26px solid transparent;
    position: absolute;
    top: 0;
    left: -26px;
    transition: all 0.3s ease 0s;
}
.pricingTable .title:after{
    border-right: none;
    border-left: 26px solid #ffb900;
    left: auto;
    right: -26px;
}
.pricingTable:hover .title:before{ border-right-color: #333; }
.pricingTable:hover .title:after{ border-left-color: #333; }
.pricingTable .pricing-content{
    padding: 0;
    margin: 0 0 25px 0;
    list-style: none;
}
.pricingTable .pricing-content li{
    font-size: 17px;
    line-height: 40px;
}
.pricingTable .pricingTable-signup{
background: #ffb900 none repeat scroll 0 0;
color: #fff;
display: inline-block;
font-size: 17px;
font-weight: 700;
letter-spacing: 1px;
padding: 7px 30px;
position: relative;
text-transform: uppercase;
transition: all 0.3s ease 0s;
}
.pricingTable:hover .pricingTable-signup{
    background: #333;
    color: #fff;
}
.pricingTable .pricingTable-signup:before,
.pricingTable .pricingTable-signup:after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    transition: all 0.5s ease 0s;
}
.pricingTable .pricingTable-signup:hover:before{
    background: rgba(255, 255, 255, 0.7);
    left: 60%;
    right: 60%;
    z-index: 1;
}
.pricingTable .pricingTable-signup:hover:after{
    background: rgba(255, 255, 255, 0.7);
    top: 60%;
    bottom: 60%;
}
.pricing_active{
border: 1px solid #ffb900;
}
@media only screen and (max-width: 990px){
    .pricingTable{ margin-bottom: 30px; }
}
/*==========================*
  10.END PRICING DESIGN
 *============================*/

/*===============================*
  11.START TESTIMONIAL DESIGN
 *=============================*/
.our_testimonial{background:url(../img/bg/testimonial-bg.jpg); position: relative;}
.our_testimonial:before {
    background: rgba(0, 0, 0, 0.5);
    content: "";
    height: 100%;
    left: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    position: absolute;
    top: 0;
    width: 100%;
}
.testimonial{
    padding: 70px 30px 50px;
    margin: 50px 30px 30px;
    position: relative;
}
@media only screen and (max-width: 414px){
    .testimonial{ padding: 70px 10px 30px; }
}
.testimonial .pic{
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 5px solid #ffb900;
    overflow: hidden;
    margin: 0 auto;
    position: absolute;
    top: -50px;
    left: 0;
    right: 0;
}
.testimonial .pic img{
    width: 100%;
    height: auto;
}
.testimonial .title {
  text-align: center;
}
.testimonial .title h3{
color: #ffb900;
display: inline-block;
font-size: 20px;
font-weight: 700;
letter-spacing: 1px;
margin: 0 349px 20px;
text-transform: uppercase;
}
@media only screen and (max-width: 768px){
	.testimonial .title h3{margin: 20px 0; }
}
@media only screen and (max-width: 414px){
	.testimonial .title{ font-size: 12px; }
    .testimonial .post{ font-size: 11px; }
}
.testimonial .post{
	color: #fff;
    font-size: 15px;
}
@media only screen and (max-width: 414px){
	.testimonial .post{ display:inline-block; }
}
.testimonial .description{
color: #fff;
font-size: 25px;
line-height: 35px;
margin: 0 150px;
position: relative;
width: 90%;
}
@media only screen and (max-width: 768px){
    .testimonial .description{
		font-size: 18px;
		line-height: 25px;
		margin: 0 100px;
	}
}
@media only screen and (max-width: 480px){
    .testimonial .description{
	line-height: 20px;
}
}
@media only screen and (max-width: 414px){
    .testimonial .description{
	font-size: 16px;
	margin: 0 90px;
	width: 85%;
}
}
@media only screen and (max-width: 360px){
    .testimonial .description{
	font-size: 14px;
	margin: 0 85px;
	width: 80%;
}
}
.testimonial .description:before{
color: #ffb900;
content: "";
font-family: "FontAwesome";
font-size: 165px;
left: -180px;
position: absolute;
top: 45px;
}
@media only screen and (max-width: 768px){
    .testimonial .description:before{
		font-size: 135px;
		left: -140px; 
	}
}
@media only screen and (max-width: 480px){
    .testimonial .description:before{
		top: 60px; 
	}
}
@media only screen and (max-width: 414px){
    .testimonial .description:before{
		font-size: 120px;
		left: -130px;
		 
	}
}
@media only screen and (max-width: 360px){
    .testimonial .description:before{
		font-size: 115px;
		left: -125px;
		 
	}
}
.owl-theme .owl-controls {
    margin-top: 50px ;
    text-align: center;
	display: inline-block !important ;
}
.owl-theme .owl-controls .owl-page {
display: inline-block ;

}
.owl-controls .owl-page,
.owl-controls .owl-buttons div { cursor: pointer }
.owl-theme .owl-controls .owl-page span {
background-color: #ffb900 !important;
border-radius: 20px;
display: block;
height: 12px;
margin: 180px 5px 7px ;
width: 12px;
}
@media only screen and (max-width: 480px){
    .owl-theme .owl-controls .owl-page span{margin: 200px 5px 7px ;}
}
@media only screen and (max-width: 375px){
    .owl-theme .owl-controls .owl-page span{margin: 220px 5px 7px ;}
}
@media only screen and (max-width: 320px){
    .owl-theme .owl-controls .owl-page span{margin: 250px 5px 7px ;}
}
.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span { background-color: #fff !important }
.owl-theme .owl-controls {
  display: block !important;
  margin-top: 20px;
  text-align: center;
}
/*===============================*
  11.END TESTIMONIAL DESIGN
 *=============================*/
 
/*=============================*
  12.START DOWNLOAD DESIGN
*============================*/
.download {background:#ffb900 none repeat scroll 0 0;}
.download_text {padding-top: 60px;}
@media only screen and (max-width: 768px){
    .download_img {

}
}
@media only screen and (max-width: 480px){
    .download_img {
	margin-top: 0;
}
}
@media only screen and (max-width: 480px){
.download_text {
margin-top: 60px;
text-align: center;
}
}
.download_text h3 {
  color: #333;
  font-size: 30px;
}
@media only screen and (max-width: 768px){
    .download_text h3 {
	font-size: 25px;
}
}
.download_text h2 {
color: #fff;
font-size: 44px;
font-weight: 700;
margin-bottom: 20px;
margin-top: 0;
}
@media only screen and (max-width: 768px){
    .download_text h2 {
	font-size: 40px;
}
}
.download_text p{
color:#fff; 
margin-bottom: 30px;
}
.download_btn {
  margin-right: 20px;
}
@media only screen and (max-width: 768px){
.download_btn {
  display: block;
  margin-bottom: 30px;
}
}@media only screen and (max-width: 480px){
.download_btn {
margin-right: 0px;
}
}
@media only screen and (max-width: 414px){
.download_btn {
margin-right: 0;
margin-bottom:30px
}
}
/*=============================*
  12.END DOWNLOAD DESIGN
*============================*/

/*============================* 
  13.START CUNTING DESIGN
 *===========================*/

.cunting {
	padding-top: 80px;
	padding-bottom: 50px;
	position: relative;
	width:100%
}
.cunting::before {
  background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  opacity: 0.95;
  position: absolute;
  top: 0;
  width: 100%;
 }
.cunting_content {
margin-bottom: 30px;
padding: 50px;
}
.cunting_content i {
color: #fff;
font-size: 40px;
margin-bottom: 20px;
}
.cunting_content h4 {
  font-size: 35px;
  color: #fff;
}
.cunting_content p {
color: #fff;
font-weight: 500;
text-transform: uppercase;
}
/*============================* 
  13.END CUNTING DESIGN
 *===========================*/

/*=========================* 
  14.START NEWSSITE DESIGN
 *==========================*/
 .news-area {
  background: #e3f2fd none repeat scroll 0 0;
  padding-top:60px;
  padding-bottom:30px;
}
.news_box {
  background: #fff none repeat scroll 0 0;
  display: inline-block;
  border-radius: 10px;
  margin-bottom: 30px;
}
.news_content_img {
border-radius: 10px 10px 0 0;
height: 250px;
width: 100%;
}
.news_content_text {
  display: inline-block;
  padding: 0 15px 15px;
}
.news_comment > span {
  margin-right: 10px;
}
.news_title a{
color: #333;
font-size: 25px;
font-weight: 700;
margin-top: 20px;
display: block;
transition:0.3s;
}
.news_title a:hover{color:#ffb900;}
.news_date {
  margin-bottom: 15px;
}
.news_name {
  float: left;
  height: 25px;
  margin-top: 30px;
}
.news_name img {
  float: left;
  height: 25px;
  width: 25px;
}
.news_name span {
  margin-left: 10px;
}
.news_comment {
  float: right;
  margin-top: 30px;
}
.news_comment i {
 margin-right: 5px;
}
/*=========================* 
  14.END NEWSSITE DESIGN
 *==========================*/
 
/*===============================* 
  15.START NEWSLETTER DESIGN
 *===============================*/
.signup_form h3 {
color: #333;
font-size: 40px;
font-weight: 600;
margin-bottom: 30px;
margin-top: 0;
}
.signup_form input {
	background: #fff none repeat scroll 0 0;
	border: 2px solid #ffb900;
	border-radius: 30px;
	box-shadow: none;
	color: #333;
	height: 50px;
	margin-bottom: 30px;
	/* width: 612px; */
}
@media only screen and (max-width:768px) { 
.signup_form input {width:100%}
}
.signup_form input:hover, .signup_form input:focus{
box-shadow: none;
border:2px solid #ffb900;
border-radius: 30px;
}
.signup_form button {
background: #ffb900 none repeat scroll 0 0;
border-radius: 30px;
color: #fff;
font-size: 12px;
letter-spacing: 1px;
outline: medium none;
padding: 14px 40px;
text-transform: uppercase;
transition: all 0.2s ease 0s;
}
.signup_form button:hover,
.signup_form button:focus {
    background: #333;
    color: #fff;
}
/*===============================* 
  15.END NEWSLETTER DESIGN
 *===============================*/

/*====================================================*
  16.START CONTACT FORM & CONTACT ADDRESS DESIGN
 *===================================================*/
.contact_area{
background: #e3f2fd none repeat scroll 0 0;
padding-top:60px;
padding-bottom:50px;
}
.contact {

}
@media only screen and (max-width:768px) { 
.contact {margin-bottom:40px;}
}
.input_padding {
    overflow: hidden;
    padding: 0 40px 56px;
}
.form-control {
background: #fff none repeat scroll 0 0;
border: 1px solid #fff;
border-radius: 5px;
box-shadow: none;
color: #333;
height: 50px;
}
.form-control:hover,
.form-control:focus {
    border: 1px solid #ffb900;
    box-shadow: none;
    outline: 0 none;
}
.btn-contact-bg {
background: #ffb900 none repeat scroll 0 0;
border-radius: 3px;
color: #fff;
font-size: 12px;
letter-spacing: 2px;
outline: medium none !important;
padding: 15px;
text-transform: uppercase;
transition: all 0.3s ease 0s;
width: 100%;
}
.btn-contact-bg:hover,
.btn-contact-bg:focus {
    background: #333;
    color: #fff;
}
@media only screen and (max-width:320px) { 
    .btn-contact-bg { padding: 10px 25px }
}
.mb0 { margin-bottom: 0 }

/*START CONTACT ADDRESS*/
.single-address {
margin-bottom: 30px;
}
.single-address i {
color: #ffb900;
float: left;
font-size: 20px;
height: 30px;
line-height: 30px;
margin-right: 10px;
width: 30px;
}
.single-address h4 {
font-weight: 700;
text-transform: uppercase;
overflow: hidden;
}
.single-address p {
    margin-bottom: 0;
	overflow: hidden;
}
.contact_social ul {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
.contact_social ul li { display: inline-block }
.contact_social ul li a {
border-radius: 30px;
color: #fff;
display: block;
font-size: 18px;
height: 45px;
line-height: 45px;
margin-right: 3px;
text-align: center;
transition: all 0.2s ease 0s;
width: 45px;
}
@media only screen and (max-width:320px) { 
.contact_social ul li a {margin-bottom: 3px; }
}
.contact_social ul li a:hover { color: #fff;background:#fc5004; }
.f_facebook{background:#3B5998;}
.f_twitter{background:#1A90D9;}
.f_google{background:#FF5252;}
.f_linkedin{background:#0077B5;}
.f_youtube{background:#D32322;}
.f_skype{background:#01A4E0;}
/*END CONTACT ADDRESS*/

/*====================================================*
  16.START CONTACT FORM & CONTACT ADDRESS DESIGN
 *===================================================*/

/*==========================*
  17.START FOOTER DESIGN
 *==========================*/
.footer {
background: #161616 none repeat scroll 0 0;
  padding:30px 0;
}
.footer_logo{margin-bottom:10px;}
.footer_logo img {
  width: 200px;
}
/*START FOOTER SOCIAL DESIGN*/
.footer_social {
  margin-bottom: 10px;
}
.footer_social ul {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
@media only screen and (max-width:320px) { 
    .footer_social ul li a{
height: 40px;
line-height: 40px;
margin-right: 2px;
width: 40px;
}
}
.footer_social ul li { display: inline-block }
.footer_social ul li a {
border-radius: 30px;
color: #fff;
display: block;
font-size: 18px;
height: 45px;
line-height: 48px;
margin-right: 3px;
text-align: center;
transition: all 0.2s ease 0s;
width: 45px;
}
@media only screen and (max-width:320px) { 
.footer_social ul li a {margin-bottom: 3px; }
}
.footer_social ul li a:hover { color: #333;background:#fff; }
.f_facebook{background:#3B5998;}
.f_twitter{background:#1A90D9;}
.f_google{background:#FF5252;}
.f_linkedin{background:#0077B5;}
.f_youtube{background:#D32322;}
.f_skype{background:#01A4E0;}
.copyright p {
color:#fff;
margin-bottom: 0;
padding-top: 10px;
}
/*==========================*
  17.END FOOTER DESIGN
*===========================*/

.padding-left {
	padding-left: 40px;
}

.footer_menu > a {
	color: #c0c0c0;
	font-weight: 100;
}

.top-content {
	padding-top:120px;
	padding-bottom:60px;
}

privacy h3 {
	padding-top: 10px;
	padding-bottom: 20px;
}
privacy h4 {
	padding-top: 10px;
	padding-bottom: 10px;
}
privacy p {
	padding-bottom: 10px;
}