/*Mobile*/
@media (max-width: 767px) {
	
	.menubar.logo, #wht-logo {
		display: none;
	}
	
	.topbar {
		display:none;
	}

	.navbar-brand {
		display: inline-block;
		width: 70%;
		height: auto;
		padding: 5px;
	}

	.navbar-brand:hover {
		border-bottom: none;
	}

	.navbar-brand img{
		width: 80%;
		height: auto;
	}
	
	.header {
		text-align: center;
	}
	
	.navbar-default {
		/*float: none;*/
		text-align: center;
		height: auto!important;
		margin-top: 0!important;
	}
	
	.navbar-default .navbar-toggle {
		border-color: #6abd92;
	}
	
	.menubar {
		position: absolute;
	    width: 100%;
	    z-index: 999;
	    margin-top: 0px!important;
	}
	
	#navbar {
		background-color: #fff;
		margin-top:20px;
	}
	
	.navbar-toggle {
		/*float: none;*/
		background-color: #6abd92;
		border-radius: 0;
		padding: 15px 20px;
		margin-right: 0;
		margin-top: 20px;
	}
	
	.navbar-default .navbar-toggle .icon-bar {
		background-color: #fff;
		
	}
	
	.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
		background-color: #6abd92;
		border-radius: 0;
		border-color: #6abd92;
	}
	
	.navbar .navbar-nav>li>a {
		text-align: center!important;
		font-size: 20px;
		padding: 10px;
		color: #000!important;
	}
	
	.navbar .navbar-nav>li>a>i {
		color: #000!important;
	}
	
	.navbar-nav li {
		display: block;
	}
	
	.navbar {
		margin-bottom: 0;
	}
	
	/*Home page*/
	.slide1 {
		min-height: 350px;
	}
	
	.slide-header {
		margin-top: 120px;
		margin-bottom: 20px;
	}
	
	.slide-header h1 {
		font-size: 35px;
	}
	
	.slide-header h2 {
		font-size: 40px;
	}
	
	.home-intro {
		padding-top: 20px;
		padding-bottom: 20px;
	}
	
	.slide-header h1 {
		
	}
	
	.home-intro h2 {
		margin-top: 20px;
	}
	
	.home-intro input {
		width: 100%;
	}
	
	.home-smart {
		padding-top: 20px;
		height: auto;
		background-image: none;
		background-color: #f1f1f1;
	}
	
	.home-smart h2 {
		font-size: 60px;
	}
	
	.home-smart #make, #decisions {
		line-height: 40px;
		font-size: 30px;
	}
	
	.home-smart .btn-primary.grn {
		margin-bottom: 20px;
		width: auto;
		font-size: 15px;
		margin-right: 0;
	}
	
	.flip-container {
		display: none;
	}
	
	.mobile-gig {
		display: block!important;
	}
	
	.mobile-back-overlay {
		padding: 10px;
	}
	
	.home-easyequities {
		height: auto;
		padding-bottom: 20px;
		padding-top: 20px;
	}
	
	.home-easyequities h2 {
		font-size: 40px;
		margin-top: 0;
	}
	
	.home-easyequities img {
		width: 80%;
	}
	
	/*About page*/
	
	.about-header {
		height: 200px;
		text-align: center;
	}
	
	.about-header h1 {
		margin-top: 100px;
	}
	
	.about-register {
		height: 650px;
	}
	
	.about-register h2 {
		padding-top: 0;
	}
	
	/*Login page*/
	
	.login {
		padding-top: 80px;
	}
	
	#form-wrapper{
		margin:20px
	}
	
	/*Pre-register step1 page*/
	
	.social-login .btn-primary.facebook, .social-login .btn-primary.google {
		border-radius: 15px;
		color: #fff;
		margin-bottom: 20px;
		min-width: 100px!important;
		font-size: 15px;
		padding-left: 0px!important;
		padding-right: 0px!important;
	}
	
	.social-login .btn-primary i {
		font-size: 20px;
		padding-right: 10px;
		vertical-align: middle;
	}
	
	/*FAQ's page*/
	.faqs-header {
		height: 200px;
		text-align: center;
	}
	
	.faqs-header h1 {
		margin-top: 30px;
	}
	
	/*Costs page*/
	.cost-header {
		height: 200px;
		text-align: center;
	}
	
	.cost-header h1 {
		margin-top: 100px;
	}
	
	/*Signup*/
	.signup {
	    padding-top: 40px;
	    padding-bottom: 40px;
	}
	
	/*Contact page*/
	
	.contact-header {
		height: 200px;
		text-align: center;
	}
	
	.contact-header h1 {
		margin-top: 120px;
	}
	
	.contact-details {
		padding-left: 0;
	}
	
	.contact-details i {
		width: 15%;
	}
	
	.contact-details span {
		width: 85%;
	}
	
	/*footer*/
	
	.footer img {
		width: 60%;
	}
	
	.footer-navbar-nav {
		display: none;
	}
	
	.footer-lower {
		text-align: center;
	}
	
	.footer-lower p, .footer-lower a {
		font-size: 13px;
		text-align: center!important;
		padding-top: 10px;
		padding-bottom: 0px;
	}
}

/*Tablet & small screens:*/
@media (min-width: 768px) and (max-width: 991px) {
	.other-pages {
		padding-top: 20px;
	}
	
	.navbar-default {
		float: none;
		text-align: center;
	}
	
	.navbar-nav {
		float: none;
		text-align: center;
	}
	
	.navbar .navbar-nav>li>a {
		font-size: 15px!important;
		padding-left:5px;
		padding-right: 5px;
	}
	
	.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
		font-size: 15px;
	}

	.navbar .navbar-nav>li>a>i {
		display: none;
	}
	
	#logo img {
		width: 100%;
	}
	
	#menubar {
		width: 70%;
		float: none;
		text-align: right;
		margin-right: auto;
		margin-left: auto;
	}
	
	.topbar {
		background-color: #6abd92;
		color: #fff;
		text-align: center!important;
	}
	
	#top-navbar {
		float: none;
		text-align: center!important;
	}
	
	.topbar p {
		color:#fff;
		font-size: 17px;
	/* 	text-align: right; */
	}
	
	/*Home page*/
	header #logo{
		width: 30%;
		float: left;
		margin-right: auto;
		margin-left: auto;
	}
	
	header #logo img {
		width: 80%;
	}
	
	header #menubar {
		width: 60%;
		float: left;
		margin-right: auto;
		margin-left: auto;
	}
	
	header.smaller .logo #col-logo {
		width: 100%;
	}
	
	header .logo {
		text-align: center;
	}
	
	header .logo #wht-logo {
		width: 100%;
		margin-top: 10px;
	}
	
	header .header-navbar .navbar-default{
		margin-top: 30px;
	}
	
	header.smaller .header-navbar .navbar-default{
		margin-top: 30px;
	}
	
	.flip-container {
		display: none;
	}
	
	.mobile-gig {
		display: block!important;
	}
	
	.mobile-back-overlay {
		padding: 10px;
	}
	
	.gig-cats .col-md-3 {
		width: 50%;
		float: left;
		margin-right: auto;
		margin-left: auto;
		height: 500px;
	}
	
	.home-easyequities h2 {
		margin-top: 80px;
	}
	
	/*About page*/
	
	.about-header {
		height: 300px;
		text-align: center;
	}
	
	.about-header h1 {
		margin-top: 200px;
	}
	
	.about-register {
		height: 500px;
	}
	
	.about-register h2 {
		padding-top: 10%;
	}
	
	/*FAQ's page*/
	
	.faqs-header {
		height: 300px;
		text-align: center;
	}
	
	.faqs-header h1 {
		margin-top: 200px;
	}
	
	/*Costs page*/
	.cost-header {
		height: 300px;
		text-align: center;
	}
	
	.cost-header h1 {
		margin-top: 200px;
	}
	
	/*pre-register step1 page*/
	.pre-register {
		min-height: auto;
		padding-top: 40px;
		padding-bottom: 40px;
	}
	
	.pre-register .col-md-6 {
		width: 50%;
		float: left;
		margin-right: auto;
		margin-left: auto;
	}
	
	.pre-register #form-wrapper {
		min-height: 400px;
	}
	
	/*Login page*/
	.login-form .col-md-6 {
		width: 50%;
		float: left;
		margin-right: auto;
		margin-left: auto;
	}
	
	
	/*Contact page*/
	
	.contact-header {
		height: 300px;
		text-align: center;
	}
	
	.contact-header h1 {
		margin-top: 200px;
	}
	
	.contact .col-md-7, .contact .col-md-5 {
		width: 50%;
		float: left;
		margin-right: auto;
		margin-left: auto;
	}
	
	.contact-details i {
		width: 10%;
		font-size: 30px;
		padding-right: 20px;
	}
	
	/*Footer*/
	.footer {
		padding-top: 10px;
		padding-bottom: 10px;
	}
	
	.footer img {
		width: 35%;
	}
	
	.footer .col-md-3, .footer .col-md-6 {
		width: 50%;
		float: left;
		margin-right: auto;
		margin-left: auto;
	}
	
	.footer-navbar-nav {
		display: none;
	}
	
	.footer-lower .col-md-8, .footer-lower .col-md-4 {
		width: 50%;
		float: left;
		margin-right:auto;
		margin-left:auto;
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	
	.menubar .logo img {
		width: 50%;
	}
	
	.nav>li>a {
		padding: 10px;
	}
	
	/*Home page*/
	
	.flip-container {
		display: none;
	}
	
	.mobile-gig {
		display: block!important;
	}
	
	.mobile-back-overlay {
		padding: 10px;
	}
	
	.gig-cats .col-md-3 {
		width: 50%;
		float: left;
		margin-right: auto;
		margin-left: auto;
		min-height: 550px;
	}
	
	.home-easyequities h2 {
		margin-top: 70px;
	}
	
	/*Pre-register step 1 page*/
	
	.social-login .btn-primary.facebook, .social-login .btn-primary.google {
	    padding: 15px 30px;
	    color: #fff;
	    margin-bottom: 20px;
	    min-width: auto;
	    width: 100%;
	    font-size: 15px;
	}
}

@media (min-width: 1199px) and (max-width: 1300px) {
	.flip-container {
		display: none;
	}
	
	.mobile-gig {
		display: block!important;
	}
	
	.mobile-back-overlay {
		padding: 10px;
	}
	
	.gig-cats .col-md-3 {
		width: 25%;
		float: left;
		margin-right: auto;
		margin-left: auto;
		min-height: 550px;
	}
}

/*Laptop:*/
@media (min-width: 1300px) and (max-width: 1600px) {
	
	.back-overlay {
		position: absolute;
		top:  0px;
		right: 0px;
		left: 0px;
		bottom: 0px;
		background-color: rgba(106, 189, 146, 0.8);
		padding: 20px;
		height: 215px!important;
	}
	
	.back-overlay p {
		line-height: 1.5;
	}
	
	.gig-cats .overlay {
		position: absolute;
		top: 6.5px;
		left: 6.5px;
		right: 6.5px;
		bottom: 7.5px;
		background-color: rgba(0,0,0,0.3);
		text-align: center;
		color: #fff;
		padding-top: 0px!important;
		height: 200px!important;
	}
	
	.flip-container, .front {
		height: 213px!important;
	}
	
	
	.back {
		width: 100%;
		height: 200px!important;
	}
	
	.back-overlay {
	    padding: 10px; 
	    height: inherit;
	}
	
	
}