/* CSS DIRECTORY
	1. =GLOBAL
	2. =HEADER
	3. =SECTION
	4. =TESTIMONIAL
	5. =FORM
	6. =FOOTER
*/

/* COLORS
	BLUE: 00CBFF;
	GOLD: F7C22F;
	PURPLE: 552DA7;
*/

/* ===GLOBAL=== */

	.container-fluid{
		padding: 0;
	}

	.btn-primary{
		background-color: #00CBFF;
		border:transparent;
		border-radius: 25px;
		padding: 10px 35px;
		cursor: pointer;
	}

	h2{
		margin-bottom: 50px;
		font-family: 'Poppins', sans-serif;
		font-weight: 300;
	}

	body{
		overflow-x: hidden;
	}


/* ===HEADER=== */
	header.home{
		background: 
		    linear-gradient(
		      rgba(119,51,179,.8), 
		      rgba(85,45,167,.8)
		    ),
		    url("../img/home-header.jpg");
		background-size: cover;
		background-position: top;
		padding-bottom: 60px;


	}

	header.features{
		background: 
		    linear-gradient(
		      rgba(119,51,179,.8), 
		      rgba(85,45,167,.8)
		    ),
		    url("../img/features-header.jpg");
		background-size: cover;
		background-position: center;
		padding-bottom: 60px;

	}

	header.about{
		background: 
		    linear-gradient(
		      rgba(119,51,179,.8), 
		      rgba(85,45,167,.8)
		    ),
		    url("../img/about-header.jpg");
		background-size: cover;
		background-position: top;
		padding-bottom: 60px;

	}

	header.contact{
		background: 
		    linear-gradient(
		      rgba(119,51,179,.8), 
		      rgba(85,45,167,.8)
		    ),
		    url("../img/contact-header.jpg");
		background-size: cover;
		background-position: center;
		padding-bottom: 60px;

	}

	.navbar-nav li{
		margin-right: 50px;
		padding-top: 3px;
	}

	.navbar-nav li:hover a{
		color: #00CBFF;
		font-weight: 400;
	}

	.navbar-nav li.active{
		background-color: #00CBFF;
		border-radius: 35px;
		padding: 3px 20px 3px 20px;
	}

	.navbar-nav li.active:hover a{
		color:#fff;
		font-weight: 300;
	}

	.navbar-nav li a{
		color:#fff;
		font-family: 'Poppins', sans-serif;
		font-weight: 300;
	}

	header h1{
		margin-top: 155px;
		color:#fff;
		font-family: 'Poppins', sans-serif;
		font-weight: 700;
	}

	header p{
		margin-top: 20px;
		color:#F7C22F;
		font-family: 'Poppins', sans-serif;
		font-weight: 400;

	}

	header .btn{
		margin-top: 50px;
	}

	header img.app-store{
		margin-top: 75px;
	}

/* ===Section=== */
	section{
		margin-top: 100px;
		margin-bottom: 50px;
	}

	section h1{
		color:#201C52;
		margin-bottom: 50px;
		font-family: 'Poppins', sans-serif;
		font-weight: 300;
	}

	section p{
		color:#8B98AB;
		margin-bottom: 50px;
		font-family: 'Poppins', sans-serif;
		font-weight: 400;
	}



	.collage{
		background-image: url('../img/about-collage.png') ;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: top;
		height: 850px;
	}

/* ===TESTIMONIAL=== */
	/* Show in Large desktops and laptops */
	@media (min-width: 1200px) {

	.testimonial-container{
		background-image: url('../img/user-cloud.svg') ;
		background-repeat: no-repeat;
		background-position: top;
		background-size: 100% 90%;
		min-height: 550px;
	}

	.testimonial-container h2{
		margin-bottom: 125px;
	}

	.collage{
		margin-top: -50px;
	}

	}

	/*Hide in Other Small Devices */


	/* Landscape tablets and medium desktops */
	@media (min-width: 992px) and (max-width: 1199px) {

	    .testimonial-container {
	        background-image: none;
	    }

	    .collage{
			margin-top: -150px;
		}

	}

	/* Portrait tablets and small desktops */
	@media (min-width: 768px) and (max-width: 991px) {

	    .testimonial-container {
	        background-image: none;
	    }

	    .collage{
			margin-top: -150px;
		}

	}

	/* Landscape phones and portrait tablets */
	@media (max-width: 767px) {

	    .testimonial-container {
	        background-image: none;
	    }

	    .collage{
			margin-top: -150px;
		}

	}

	/* Portrait phones and smaller */
	@media (max-width: 480px) {

	    .testimonial-container {
	        background-image: none;
	    }

	    .collage{
			margin-top: -300px;
		}

	}

	

	.testimonial{
		border:1px #00CBFF solid;
		background-color: #fff;
		margin-bottom: 30px;
		min-height: 150px;
	}



	.testimonial h3{
		font-size: 18px;
		font-weight: 700;
	}

	.testimonial p{
		font-size: 13px;
		margin-bottom: 10px !important;
	}




/* ===FORM=== */
	.contact-title{
		color:#552DA7;
		font-family: 'Poppins', sans-serif;
		font-weight: 300;
	}

	.contact-title span{
		color:#00CBFF;
		font-weight: 400;
	}
	 
	label{
		color:#8B98AB;
		font-family: 'Poppins', sans-serif;
		font-weight: 300;
	}

	input, textarea{
		color:#552DA7 !important;
	}

	input:focus, textarea:focus{
	    border-color: #552DA7 !important;
	    box-shadow: 0 0 0 0.2rem rgba(85,45,167,.18) !important;
	}

	.invalid{
		border:red 1px solid !important;
	}



/* ===FOOTER=== */

	footer{
		margin-top: 100px;
		background: 
		    linear-gradient(
		      rgba(119,51,179,.8), 
		      rgba(85,45,167,.8)
		    ),
		    url("../img/footer.jpg");
		background-size: cover;
		background-position: center; 
		padding-bottom: 60px;
		padding-top: 100px;
		
	}

	footer .footer-menu{
		margin-top: 200px;
	}

	footer .footer-menu p{
		color:#fff;
		font-family: 'Poppins', sans-serif;
		font-weight: 300;
		font-size: 16px;
	}

	footer .footer-menu p a{
		color:#8ED1F1;
		text-decoration: underline;
	}

	footer .footer-menu .nav a{
		color:#fff;
		font-family: 'Poppins', sans-serif;
		font-weight: 400;
		font-size: 16px;
	}

	.social{
		min-width: 100px !important;
	}