﻿html {
  height: 100%;
  width: 100%;


}


body {
    background-color: #FFF;
	margin:0;
	padding:0;
	height: 100%;
	-webkit-font-smoothing: antialiased;
	font-family: CharleFont;

}




	a:link {
    color: #000;
	text-decoration: none;
	-o-transition:1s;
    -ms-transition:1s;
    -moz-transition:1s;
    -webkit-transition:1s;
    transition:1s;
}
a:visited {
	color: #000;
	text-decoration: none;
}
a:hover {
    color: #000;
	text-decoration: none;
}

a:active {
    color: #000;
	text-decoration: none;
	}


h1 {

	margin: 0;
	padding: 0;
	font-weight:normal;

	}


#heading {

	font-family: CharleFont;
}


#section5-container {

	opacity: 0;
}



h5, h4 {
	
	font-weight: normal;
}




/****************************** LOADING PAGE ******************************/


#loadingcontainer {

	background: #FFF;
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	z-index: 30;


	}

#loadinglogo {

	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	text-align: center;
	width: 58px;
	opacity: 0;


	}


	#leftswipe {

		position: fixed;
		background: #FFF;
		width: 0%;
		height: 100%;
		z-index: 100;
		top:0;
		left: 0;
	}





/** NAVAGATION **/


/* EXTRA LARGE SCREEN */
@media only screen and (min-width: 1600px) {

	
	/*** SHOPIFY PLUS BAR ***/
	
	
	#shopifyplusbar { 
	
	 background: url(../image/plusbarbkg.jpg) no-repeat #030c22;
  
   background-position: bottom;
	background-size: 120%;
    width: 92%;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    box-shadow: 0px 0px 80px 10px rgb(0 0 0 / 20%);
    border-radius: 60px;
    padding-top: 50px;
    padding-bottom: 50px;
    margin-bottom: 40px;
    padding-left: 3%;
    z-index: 2;
    position: relative;
	color: #FFF;
	
	
	}
	
	
	#plusbarheading {
		
		font-size: 40px;
		letter-spacing: -2px;
	}
	
	#plusbartext {
		
		font-size: 16px;
		padding-top: 25px;
		padding-bottom:25px;
		width: 55%;
		line-height: 30px;
		
		 
	}
	
	#plusbarlogo {
		
		width:220px;
		padding-bottom: 10px;
	
	}
	
	


/*** SERVICE BAR ***/


	#servicesbarbkg {


		width: 100%;
		background: #efefef;
		padding-top: 55px;
		padding-bottom: 55px;
	}

	#servicesbarcontainer {

		width: 80%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;

	}


	#servicesbaritem {

		width: 23%;
		padding-left: 1%;
		padding-right: 1%;
		float: left;
		font-size: 29px;

		text-align: left;
	}

	#serviceicon {

		width: 43px;
		position: relative;
		top: 0px;
		float: left;
		padding-right: 20px;

	}

	#servicesbarheading {

		width: calc(25% - 43px);
		float: left;
		font-size: 29px;

		text-align: left;
	}

	#learnmoregreyarrow {

		font-size: 14px;
		color: #c9c9c9;
		padding-top: 4px;
		cursor: pointer;
		transition: all 0.5s ease;
		position: relative;
		left: 0px;


	}

	#learnmoregreyarrow:hover {

		left:10px;
		position: relative;
	}

	#greyarrowimg {

		width: 22px;
	}


	#serviceiconsrow2mobile {

		display: none;
	}

	#servicebarparagraph {

		width: 100%;
		padding-right: 3%;
		position: relative;
		font-size: 14px;
		line-height: 25px;
		padding-top: 20px;
		float: left;
	}





/*** EMAIL POP UP **/


	#emailpopup {

		position: fixed;

		background: #000;
		width: 90%;
		max-width: 620px;
		z-index: 100;
		padding: 20px;
		padding-top: 30px;
		color: #FFF;
		box-shadow: 0px 0px 25px 10px rgba(0, 0, 0, 0.3);
		display:none;
			border-radius: 5px;
		padding-left: 25px;
		padding-bottom: 25px;
		left: -5px;
		bottom: -5px;
	}

	#emailtitle {

		font-size: 27px;
		padding-bottom: 15px;
	}

	#emailsubtitle {
		font-size: 13px;
		padding-bottom: 15px;
	}

	#emailcookie {

			font-size: 9px;
		padding-bottom: 10px;
		padding-top: 10px;
		opacity: 0.5;
	}

		#mce-EMAIL {

		width: 50%;
		background: #FFF;
		border: 0;
		padding-top: 10px;
		padding-bottom: 10px;

		padding-left: 10px;
		padding-right: 10px;

		font-family: CharleFont;
		font-size: 17px;
		color: #c9c9c9;
		outline: none;
		position: relative;
		z-index: 10;
		border: 2px solid #FFF;

		margin-top: 5px;
			float: left;


}

	#mc-embedded-subscribe {
		float: left;
		background: #000;
		border: 2px solid #FFF;
		padding-top: 10px;
		padding-bottom: 10px;
		padding-left: 20px;
		padding-right: 20px;
		font-size: 17px;
		margin-top: 5px;
		margin-left: 20px;
		cursor: pointer;
	}

	#closeicon {

		position: absolute;
		right: 20px;
		top: 20px;
		width: 28px;
		cursor: pointer
	}








	#logo {
	  left: 50px;
	  top: 50px;
	  position: absolute;
	  z-index: 10;
	  width: 150px;
      transition: all 0.5s ease;
	  opacity: 1;

}
	
	#logogradient {
		
		position: absolute;
		height: 200px;
		width: 100%;
		z-index: 9;

background: rgb(0,0,0);
background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 100%);
	}

	#logo:hover {

		opacity: 0.5;
	}



	#navagation {

		position: absolute;
		right: 25%;
		font-family: CharleFont;
		color: #000000;
		font-size: 15px;
		margin-left: 4%;
		top: 70px;
		z-index: 41;

	}



	#navlinks {

		float: left;
		padding-right: 10px;
		padding-left: 10px;
		  transition: all 0.5s ease;
		bottom: 0px;
		position: relative;
	}


	#navlinks-container:hover > #navlinks {
  	opacity: 0.5;

	}



	#navlinks-container:hover > #navlinks:hover {
  	opacity: 1.0;
	bottom: 7px;

	}



	#navagation-CTA {

		position: fixed;
		right: 0;
		margin-right: 4%;
		font-family: CharleFont;
		color: #FFF;
		font-size: 15px;
		margin-left: 10%;
		top: 50px;
		padding: 25px;
		background: #000;
		transition: all 0.5s ease;
		cursor: pointer;
		z-index: 40;
		border-radius: 15px;

	}




	#navagation-CTA:hover {

		transform: scale(1.2);

	}


	#navagation-CTA-mobile {

		display: none;
	}


	#nav-icon {

		display: none;
	}




/* STANDARD ELEMNETS */
#heading {

		font-size: 52px;
		margin-bottom: 20px;
	line-height: 52px;

	}

	#bodytext {

		font-size: 32px;
		line-height: 55px;

	}

	#smallbodytext {

		font-size: 20px;
		line-height: 40px;
	}


	#Button{

		font-size: 18px;
		font-family: CharleFont;
		color: #000;
	margin-top: 15px;
		transition: all 0.5s ease;
		position: relative;
		opacity: 1;
	}

	#Button:hover {

		opacity: 0.1;
	}




/***** SECTION CONTAINER ******/

	#sectioncontainer {


		background: #FFF;
		width: 100%;
		padding-top: 60px;
		padding-bottom: 60px;
		position: relative;
	}


		#sectioncontentcontainer {



		width: 80%;
			max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
			right: 0;
		position: relative;
	}



	/*** BLACK BUTTON ****/


		#blackbutton {

		background: #000;
		color: #FFF;
		font-size: 20px;
			padding: 15px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
			border-radius: 15px;
	}



		#blackbutton:hover {

		  transform: scale(1.2);
		z-index:12 !important;
	}

	
		/*** WHITE BUTTON ****/


		#whitebutton {

		background: #FFF;
		color: #000;
		font-size: 20px;
			padding: 15px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
			border-radius: 15px;
	}



		#whitebutton:hover {

		  transform: scale(1.2);
		z-index:12 !important;
	}
	
		#outlinebutton {

	
		color: #FFF;
		font-size: 15px;
			padding: 10px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
			border-radius: 15px;
			border: 2px #FFF solid;
	}



		#outlinebutton:hover {

		  transform: scale(1.1);
		z-index:12 !important;
	}




}



/* LARGE SCREEN  */
@media only screen and (min-width: 1200px)  and (max-width: 1599px) {



	#shopifyplusbar { 
	
	 background: url(../image/plusbarbkg.jpg) no-repeat #030c22;
  
   background-position: bottom;
	background-size: 150%;
    width: 92%;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    box-shadow: 0px 0px 80px 10px rgb(0 0 0 / 20%);
    border-radius: 60px;
    padding-top: 50px;
    padding-bottom: 50px;
    margin-bottom: 40px;
    padding-left: 3%;
    z-index: 2;
    position: relative;
	color: #FFF;
	
	
	}
	
	
	#plusbarheading {
		
		font-size: 40px;
		letter-spacing: -2px;
	}
	
	#plusbartext {
		
		font-size: 16px;
		padding-top: 25px;
		padding-bottom:25px;
		width: 50%;
		line-height: 30px;
		 
	}
	
	#plusbarlogo {
		
		width:180px;
		padding-bottom: 10px;
	
	}

/*** SERVICE BAR ***/



	#servicesbarbkg {


		width: 100%;
		background: #efefef;
		padding-top: 55px;
		padding-bottom: 55px;
	}

	#servicesbarcontainer {

		width: 80%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;

	}


	#servicesbaritem {

		width: 23%;
		padding-left: 1%;
		padding-right: 1%;
		float: left;
		font-size: 25px;

		text-align: left;
	}

	#serviceicon {

		width: 38px;
		position: relative;
		top: 5px;
		float: left;
		padding-right: 20px;

	}

	#servicebarheading {

		width: calc(23%-38px);
			float: left;
		font-size: 25px;

		text-align: left;
	}

	#learnmoregreyarrow {

		font-size: 14px;
		color: #c9c9c9;
		padding-top: 4px;
		cursor: pointer;
		transition: all 0.5s ease;
		position: relative;
		left: 0px;


	}

	#learnmoregreyarrow:hover {

		left:10px;
		position: relative;
	}

		#greyarrowimg {

		width: 22px;
	}

	#serviceiconsrow2mobile {

		display: none;
	}


		#servicebarparagraph {

		width: 100%;

		position: relative;
		font-size: 14px;
		line-height: 25px;
		padding-top: 20px;
		float: left;
	}






	#emailpopup {

		position: fixed;

		background: #000;
		width: 90%;
		max-width: 620px;
		z-index: 100;
		padding: 20px;
		padding-top: 30px;
		color: #FFF;
		box-shadow: 0px 0px 25px 10px rgba(0, 0, 0, 0.3);
		display:none;
		border-radius: 5px;
		padding-left: 25px;
		padding-bottom: 25px;
		left: -5px;
		bottom: -5px;

	}

	#emailtitle {

		font-size: 27px;
		padding-bottom: 15px;
	}

	#emailsubtitle {
		font-size: 13px;
		padding-bottom: 15px;
	}

	#emailcookie {

		font-size: 9px;
		padding-top: 10px;
		padding-bottom: 10px;
		opacity: 0.5;
	}

		#mce-EMAIL {

		width: 50%;
		background: #FFF;
		border: 0;
		padding-top: 10px;
		padding-bottom: 10px;

		padding-left: 10px;
		padding-right: 10px;

		font-family: CharleFont;
		font-size: 17px;
		color: #c9c9c9;
		outline: none;
		position: relative;
		z-index: 10;
		border: 2px solid #FFF;

		margin-top: 5px;
			float: left;


}

	#mc-embedded-subscribe {
		float: left;
		background: #000;
		border: 2px solid #FFF;
		padding-top: 10px;
		padding-bottom: 10px;
		padding-left: 20px;
		padding-right: 20px;
		font-size: 17px;
		margin-top: 5px;
		margin-left: 20px;
		cursor: pointer;
	}

	#closeicon {

		position: absolute;
		right: 20px;
		top: 20px;
		width: 28px;
		cursor: pointer
	}



	#logo {
	  left: 15px;
	  top: 50px;
	  position: absolute;
	  z-index: 10;
	  width: 150px;
      transition: all 0.5s ease;
	  opacity: 1;

}
	
		#logogradient {
		
		position: absolute;
		height: 200px;
		width: 100%;
		z-index: 9;

background: rgb(0,0,0);
background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 100%);
	}

	#logo:hover {

		opacity: 0.5;
	}



	#navagation {

		position: absolute;
		right: 22%;
		font-family: CharleFont;
		color: #000000;
		font-size: 15px;
		margin-left: 4%;
		top: 70px;
		z-index: 41;

	}

	#nav-icon {

		display: none;
	}



	#navlinks {

		float: left;
		padding-right: 20px;
		  transition: all 0.5s ease;
		bottom: 0px;
		position: relative;
	}


	#navlinks-container:hover > #navlinks {
  	opacity: 0.5;

	}



	#navlinks-container:hover > #navlinks:hover {
  	opacity: 1.0;
	bottom: 7px;

	}



	#navagation-CTA {

		position: fixed;
		right: 0;
		margin-right: 2%;
		font-family: CharleFont;
		color: #FFF;
		font-size: 12px;
		margin-left: 10%;
		top: 50px;
		padding: 25px;
		background: #000;
		transition: all 0.5s ease;
		cursor: pointer;
		z-index: 40;
		border-radius: 15px;

	}




	#navagation-CTA:hover {

		  transform: scale(1.2);

	}

	#navagation-CTA-mobile {

		display: none;
	}




		/* STANDARD ELEMENTS */

	#heading {

		font-size: 40px;
		margin-bottom: 20px;
		line-height: 40px;

	}

	#bodytext {

		font-size: 25px;
		line-height: 45px;

	}

		#smallbodytext {

		font-size: 18px;
		line-height: 32px;
	}



	#Button{

		font-size: 18px;
		font-family: CharleFont;
		color: #000;
	margin-top: 15px;
		transition: all 0.5s ease;
		position: relative;
		opacity: 1;
	}

	#Button:hover {

		opacity: 0.1;
	}




/***** SECTION CONTAINER ******/

	#sectioncontainer {


		background: #FFF;
		width: 100%;
		padding-top: 30px;
		padding-bottom: 30px;
		position: relative;
		z-index: 1;
	}

			#sectioncontentcontainer {



		width: 80%;
		margin-left: auto;
		margin-right: auto;
		left: 0;
			right: 0;
		position: relative;
	}


		/*** BLACK BUTTON ****/


		#blackbutton {

		background: #000;
		color: #FFF;
		font-size: 18px;
			padding: 15px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
					border-radius: 15px;
	}



		#blackbutton:hover {

		  transform: scale(1.2);
		z-index:12 !important;
	}

		/*** WHITE BUTTON ****/


		#whitebutton {

		background: #FFF;
		color: #000;
		font-size: 18px;
			padding: 15px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
			border-radius: 15px;
	}



		#whitebutton:hover {

		  transform: scale(1.2);
		z-index:12 !important;
	}
	
		#outlinebutton {

	
		color: #FFF;
		font-size: 15px;
			padding: 10px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
			border-radius: 15px;
			border: 2px #FFF solid;
	}



		#outlinebutton:hover {

		  transform: scale(1.1);
		z-index:12 !important;
	}



}



/*MEDIUM SCREEN */
@media only screen and (min-width: 992px)  and (max-width: 1199px) {


	#shopifyplusbar { 
	
	 background: url(../image/plusbarbkg.jpg) no-repeat #030c22;
  
   background-position: bottom;
	background-size: 180%;
    width: 92%;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    box-shadow: 0px 0px 80px 10px rgb(0 0 0 / 20%);
    border-radius: 60px;
    padding-top: 50px;
    padding-bottom: 50px;
    margin-bottom: 40px;
    padding-left: 3%;
    z-index: 2;
    position: relative;
	color: #FFF;
	
	
	}
	
	
	#plusbarheading {
		
		font-size: 35px;
		letter-spacing: -1px;
		
	}
	
	#plusbartext {
		
		font-size: 15px;
		padding-top: 25px;
		padding-bottom:25px;
		width: 50%;
		line-height: 28px;
		 
	}
	
	#plusbarlogo {
		
		width:180px;
		padding-bottom: 10px;
	
	}


/*** SERVICE BAR ***/


	#servicesbarbkg {


		width: 100%;
		background: #efefef;
		padding-top: 55px;
		padding-bottom: 55px;
	}

	#servicesbarcontainer {

		width: 90%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;

	}


	#servicesbaritem {

		width: 23%;
		padding-left: 1%;
		padding-right: 1%;

		float: left;
		font-size: 22px;

		text-align: left;
	}

	#serviceicon {

		width: 38px;
		position: relative;
		top: 5px;
		float: left;
		padding-right: 20px;

	}


		#servicesbarheading {

		width: calc(23% - 38px);
		padding-left: 1%;
		padding-right: 1%;

		float: left;
		font-size: 22px;

		text-align: left;
	}

	#learnmoregreyarrow {

		font-size: 14px;
		color: #c9c9c9;
		padding-top: 4px;
		cursor: pointer;
		transition: all 0.5s ease;
		position: relative;
		left: 0px;


	}

	#learnmoregreyarrow:hover {

		left:10px;
		position: relative;
	}

		#greyarrowimg {

		width: 20px;
	}


	#serviceiconsrow2mobile {

		display: none;
	}


		#servicebarparagraph {

		width: 100%;
		padding-right: 3%;
		position: relative;
		font-size: 14px;
		line-height: 25px;
		padding-top: 20px;
		float: left;
	}







	#emailpopup {

		position: fixed;

		background: #000;
		width: 90%;
		max-width: 620px;
		z-index: 100;
		padding: 20px;
		padding-top: 30px;
		color: #FFF;
		box-shadow: 0px 0px 25px 10px rgba(0, 0, 0, 0.3);
		display:none;
			border-radius: 5px;
		padding-left: 25px;
		padding-bottom: 25px;
		left: -5px;
		bottom: -5px;
	}

	#emailtitle {

		font-size: 27px;
		padding-bottom: 15px;
	}

	#emailsubtitle {
		font-size: 13px;
		padding-bottom: 15px;
	}

	#emailcookie {

		font-size: 9px;
		padding-top: 10px;
		padding-bottom: 10px;
		opacity: 0.5;
	}

		#mce-EMAIL {

		width: 50%;
		background: #FFF;
		border: 0;
		padding-top: 10px;
		padding-bottom: 10px;

		padding-left: 10px;
		padding-right: 10px;

		font-family: CharleFont;
		font-size: 17px;
		color: #c9c9c9;
		outline: none;
		position: relative;
		z-index: 10;
		border: 2px solid #FFF;

		margin-top: 5px;
			float: left;


}

	#mc-embedded-subscribe {
		float: left;
		background: #000;
		border: 2px solid #FFF;
		padding-top: 10px;
		padding-bottom: 10px;
		padding-left: 20px;
		padding-right: 20px;
		font-size: 17px;
		margin-top: 5px;
		margin-left: 20px;
		cursor: pointer;
	}

	#closeicon {

		position: absolute;
		right: 20px;
		top: 20px;
		width: 28px;
		cursor: pointer
	}



	#logo {
	  left: 40px;
	  top: 40px;
	  position: absolute;
	  z-index: 10;
	  width: 150px;
      transition: all 0.5s ease;
	  opacity: 1;

}
	
		#logogradient {
		
		position: absolute;
		height: 200px;
		width: 100%;
		z-index: 9;

background: rgb(0,0,0);
background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 100%);
	}

	#logo:hover {

		opacity: 0.5;
	}




#navagation {

		position: fixed;
		overflow: scroll;
		left: 0;
		top: 0;
		height: 100%;
		width: 100%;
		font-family: CharleFont;
		color: #000000;
		font-size: 20px;
		z-index: 10;
		background: #FFF;
		display: none;



	}



	#navlinks-container {


  position: absolute;
    top: 10%;
    left: 50%;
    margin-top: -50px;
    margin-left: -50px;
	border: 0px solid #000;
		z-index: 12;

	}




	#navlinks {


		  transition: all 0.5s ease;
		bottom: 0px;
		position: relative;
		padding-top: 50px;
		text-align: center;

	}



	#navlinks-container:hover > #navlinks {
  	opacity: 0.5;

	}



	#navlinks-container:hover > #navlinks:hover {
  	opacity: 1.0;
	bottom: 7px;

	}

	#CTA-container {

		position: fixed;
		right:0;
		margin-right: 4%;
		top:50px;
		z-index: 40;

	}





	#navagation-CTA-mobile {

		font-family: CharleFont;
		color: #FFF;
		font-size: 15px;
		padding: 25px;
		background: #000;
		transition: all 0.5s ease;
		cursor: pointer;
		z-index: 40;
		float: left;
		border-radius: 15px;


	}

		#navagation-CTA {

		display: none;
	}





	#navagation-CTA-mobile:hover {

		  transform: scale(1.2);

	}


	#nav-icon {


		font-family: CharleFont;
		font-size: 15px;
		z-index: 5;
		width: 30px;
		float: left;
		margin-right: 30px;
		margin-top: 20px;



	}

	#nav-icon span {

  background: #000;

	}



#navlinkscontainer {

	z-index: 12;
}




	/*STANDARD ELEMENTS*/

	#heading {

		font-size: 40px;
		margin-bottom: 20px;
		line-height: 40px;

	}

	#bodytext {

		font-size: 20px;
		line-height: 40px;

	}

			#smallbodytext {

		font-size: 16px;
		line-height: 28px;
	}





	#Button{

		font-size: 18px;
		font-family: CharleFont;
		color: #000;
	margin-top: 15px;
		transition: all 0.5s ease;
		position: relative;
		opacity: 1;
	}

	#Button:hover {

		opacity: 0.1;
	}




/***** SECTION CONTAINER ******/

	#sectioncontainer {


		background: #FFF;
		width: 100%;
		padding-top: 30px;
		padding-bottom: 30px;
		position: relative;
		z-index: 1;
	}

			#sectioncontentcontainer {



		width: 90%;
		margin-left: auto;
		margin-right: auto;
		left: 0;
			right: 0;
		position: relative;
	}


		/*** BLACK BUTTON ****/


		#blackbutton {

		background: #000;
		color: #FFF;
		font-size: 16px;
			padding: 15px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
					border-radius: 15px;
	}



		#blackbutton:hover {

		  transform: scale(1.2);
		z-index:12 !important;
	}
	
	/*** WHITE BUTTON ****/


		#whitebutton {

		background: #FFF;
		color: #000;
		font-size: 16px;
			padding: 15px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
			border-radius: 15px;
	}



		#whitebutton:hover {

		  transform: scale(1.2);
		z-index:12 !important;
	}

	
	
			#outlinebutton {

	
		color: #FFF;
		font-size: 15px;
			padding: 10px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
			border-radius: 15px;
			border: 2px #FFF solid;
	}



		#outlinebutton:hover {

		  transform: scale(1.1);
		z-index:12 !important;
	}





	}


/*SMALL SCREEN */
@media only screen and (min-width: 768px)  and (max-width: 991px) {


	#shopifyplusbar { 
	
	 background: url(../image/bkg.jpg) no-repeat #030c22;
  
   background-position: bottom;
	background-size: 150%;
    width: 92%;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    box-shadow: 0px 0px 80px 10px rgb(0 0 0 / 20%);
    border-radius: 60px;
    padding-top: 50px;
    padding-bottom: 50px;
    margin-bottom: 40px;
	margin-top: 30px;
    padding-left: 3%;
    z-index: 2;
    position: relative;
	color: #FFF;
	
	
	}
	
	
	#plusbarheading {
		
		font-size: 30px;
		letter-spacing: -0.1px;
	}
	
	
	#plusbartext {
		
		font-size: 15px;
		padding-top: 25px;
		padding-bottom:25px;
		 
	}
	
	#plusbarlogo {
		
		width:180px;
		padding-bottom: 10px;
	
	}
	

/*** SERVICE BAR ***/


	#servicesbarbkg {


		width: 100%;
		background: #efefef;
		padding-top: 55px;
		padding-bottom: 55px;
	}

	#servicesbarcontainer {

		width: 90%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;

	}


	#servicesbaritem {

		width: 23%;
		padding-left: 1%;
		padding-right: 1%;
		float: left;
		font-size: 18px;

		text-align: left;
	}

	#serviceicon {

		width: 30px;
		position: relative;
		top: 5px;
		float: left;
		padding-right: 20px;

	}

		#servicesbarheading {

		width: calc(23% - 30px);
		padding-left: 1%;
		padding-right: 1%;
		float: left;
		font-size: 18px;

		text-align: left;
	}

	#learnmoregreyarrow {

		font-size: 12px;
		color: #c9c9c9;
		padding-top: 4px;
		cursor: pointer;
		transition: all 0.5s ease;
		position: relative;
		left: 0px;



	}

	#learnmoregreyarrow:hover {

		left:10px;
		position: relative;
	}

		#greyarrowimg {

		width: 18px;
	}


	#serviceiconsrow2mobile {

		display: none;
	}


		#servicebarparagraph {

		width: 100%;
		padding-right: 3%;
		position: relative;
		font-size: 13px;
		line-height: 20px;
		padding-top: 20px;
		float: left;
	}




	#emailpopup {

		position: fixed;

		background: #000;
		width: 90%;
		max-width: 620px;
		z-index: 100;
		padding: 20px;
		padding-top: 30px;
		color: #FFF;
		box-shadow: 0px 0px 25px 10px rgba(0, 0, 0, 0.3);
		display:none;
			border-radius: 5px;
		padding-left: 25px;
		padding-bottom: 25px;
		left: -5px;
		bottom: -5px;
	}

	#emailtitle {

		font-size: 27px;
		padding-bottom: 15px;
	}

	#emailsubtitle {
		font-size: 13px;
		padding-bottom: 15px;
	}

	#emailcookie {

		font-size: 9px;
		padding-top: 5px;
		padding-bottom: 5px;
		opacity: 0.5;
	}

		#mce-EMAIL {

		width: 50%;
		background: #FFF;
		border: 0;
		padding-top: 10px;
		padding-bottom: 10px;

		padding-left: 10px;
		padding-right: 10px;

		font-family: CharleFont;
		font-size: 17px;
		color: #c9c9c9;
		outline: none;
		position: relative;
		z-index: 10;
		border: 2px solid #FFF;

		margin-top: 5px;
			float: left;


}

	#mc-embedded-subscribe {
		float: left;
		background: #000;
		border: 2px solid #FFF;
		padding-top: 10px;
		padding-bottom: 10px;
		padding-left: 20px;
		padding-right: 20px;
		font-size: 17px;
		margin-top: 5px;
		margin-left: 20px;
		cursor: pointer;
	}

	#closeicon {

		position: absolute;
		right: 20px;
		top: 20px;
		width: 28px;
		cursor: pointer
	}



	#logo {
	  left: 30px;
	  top: 30px;
	  position: absolute;
	  z-index: 10;
	  width: 150px;
      transition: all 0.5s ease;
	  opacity: 1;

}
	
		#logogradient {
		
		position: absolute;
		height: 200px;
		width: 100%;
		z-index: 9;

background: rgb(0,0,0);
background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 100%);
	}

	#logo:hover {

		opacity: 0.5;
	}




	#navagation {

		position: fixed;
		overflow: scroll;
		left: 0;
		top: 0;
		height: 100%;
		width: 100%;
		font-family: CharleFont;
		color: #000000;
		font-size: 20px;
		z-index: 10;
		background: #FFF;
		display: none;



	}



	#navlinks-container {


  position: absolute;
    top: 10%;
    left: 50%;
    margin-top: -50px;
    margin-left: -50px;
	border: 0px solid #000;
		z-index: 12;

	}





	#navlinks {


		  transition: all 0.5s ease;
		bottom: 0px;
		position: relative;
		padding-top: 50px;
		text-align: center;

	}



	#navlinks-container:hover > #navlinks {
  	opacity: 0.5;

	}



	#navlinks-container:hover > #navlinks:hover {
  	opacity: 1.0;
	bottom: 7px;

	}



	#CTA-container {

		position: fixed;
		right:0;
		margin-right: 4%;
		top:50px;
		z-index: 40;

	}





	#navagation-CTA-mobile {

		font-family: CharleFont;
		color: #FFF;
		font-size: 15px;
		padding: 25px;
		background: #000;
		transition: all 0.5s ease;
		cursor: pointer;
		z-index: 40;
		float: left;
		border-radius: 15px;

	}




	#navagation-CTA-mobile:hover {

		  transform: scale(1.2);

	}

		#navagation-CTA {

		display: none;
	}



	#nav-icon {


		font-family: CharleFont;
		font-size: 15px;
		z-index: 3;
		width: 30px;
		float: left;
		margin-right: 30px;
		margin-top: 20px;



	}

	#nav-icon span {

  background: #000;

	}

	/*STANDARD ELEMENT*/

	#heading {

		font-size: 35px;
		margin-bottom: 20px;
		line-height: 35px;

	}

	#bodytext {

		font-size: 16px;
		line-height: 40px;

	}

			#smallbodytext {

		font-size: 16px;
		line-height: 32px;
	}



	#Button{

		font-size: 18px;
		font-family: CharleFont;
		color: #000;
	margin-top: 15px;
		transition: all 0.5s ease;
		position: relative;
		opacity: 1;
	}

	#Button:hover {

		opacity: 0.1;
	}




/***** SECTION CONTAINER ******/

	#sectioncontainer {


		background: #FFF;
		width: 100%;
		padding-top: 30px;
		padding-bottom: 30px;
		position: relative;
	}

			#sectioncontentcontainer {



		width: 90%;
		margin-left: auto;
		margin-right: auto;
		left: 0;
			right: 0;
		position: relative;
				z-index: 1;
	}


		/*** BLACK BUTTON ****/


		#blackbutton {

		background: #000;
		color: #FFF;
		font-size: 16px;
			padding: 15px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
					border-radius: 15px;
	}



		#blackbutton:hover {

		  transform: scale(1.2);
		z-index:12 !important;
	}
	
	/*** WHITE BUTTON ****/


		#whitebutton {

		background: #FFF;
		color: #000;
		font-size: 16px;
			padding: 15px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
			border-radius: 15px;
	}



		#whitebutton:hover {

		  transform: scale(1.2);
		z-index:12 !important;
	}
	
	
				#outlinebutton {

	
		color: #FFF;
		font-size: 15px;
			padding: 10px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
			border-radius: 15px;
			border: 2px #FFF solid;
	}



		#outlinebutton:hover {

		  transform: scale(1.1);
		z-index:12 !important;
	}








	}

/*MOBILE SCREEN */



@media only screen and (max-width: 767px) {

	
		#shopifyplusbar { 
	
	 background: url(../image/bkg.jpg) no-repeat #030c22;
  
   background-position: bottom;
	background-size: 160%;
    width: 92%;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    box-shadow: 0px 0px 80px 10px rgb(0 0 0 / 20%);
    border-radius: 30px;
    padding-top: 30px;
    padding-bottom: 30px;
			margin-top: 0px;
    margin-bottom: 20px;
    padding-left: 5%;
    z-index: 2;
    position: relative;
	color: #FFF;
	
	
	}
	
	
	#plusbarheading {
		
		font-size: 20px;
		letter-spacing: -0.5px
	}
	
	
	#plusbartext {
		
		font-size: 11px;
		line-height: 20px;
		padding-top: 15px;
		padding-bottom:15px;
		 
	}
	
	#plusbarlogo {
		
		width:100px;
		margin-bottom: 5px;
	
	}


		/*** BLACK BUTTON ****/


		#blackbutton {

		background: #000;
		color: #FFF;
		font-size: 13px;
			padding: 10px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
					border-radius: 15px;
	}



		#blackbutton:hover {

		  transform: scale(1.2);
		z-index:12 !important;
	}
	
	/*** WHITE BUTTON ****/


		#whitebutton {

		background: #FFF;
		color: #000;
		font-size: 13px;
			padding: 10px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
			border-radius: 15px;
	}



		#whitebutton:hover {

		  transform: scale(1.2);
		z-index:12 !important;
	}
	
	
				#outlinebutton {

	
		color: #FFF;
		font-size: 12px;
			padding: 8px;
			display: inline-block;

			transition:  all 0.5s ease;
			cursor: pointer;
			border-radius: 15px;
			border: 2px #FFF solid;
	}



		#outlinebutton:hover {

		  transform: scale(1.1);
		z-index:12 !important;
	}



	
#megaMenu{
	display: none !important;
	}


	/*** SERVICE BAR ***/


/*** SERVICE BAR ***/


	#servicesbarbkg {


		width: 100%;
		background: #efefef;
		padding-top: 35px;
		padding-bottom: 35px;
	}

	#servicesbarcontainer {

		width: 90%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;

	}


	#servicesbaritem {

		width: 48%;
		padding-left: 1%;
		padding-right: 1%;
		float: left;
		font-size: 15px;

		text-align: left;
		padding-top: 40px;
		position: relative;

	}

	#serviceicon {

		width: 30px;
		position: relative;
		top: 0px;
		float: left;
		padding-right: 10px;



	}

		#servicesbarheading{

		width: calc(48% - 50px);
		padding-left: 1%;
		padding-right: 1%;
		float: left;
		font-size: 15px;

		text-align: left;

		position: relative;

	}

	#learnmoregreyarrow {

		font-size: 12px;
		color: #c9c9c9;
		padding-top: 4px;
		cursor: pointer;
		transition: all 0.5s ease;
		position: relative;
		left: 0px;


	}

	#learnmoregreyarrow:hover {

		left:10px;
		position: relative;
	}

		#greyarrowimg {

		width: 15px;
	}

		#servicebarparagraph {

		width: 100%;

		position: relative;
		font-size: 10px;
		line-height: 18px;
		padding-top: 20px;
		float: left;

	}








	#logo {
	  left: 10px;
	  top: 30px;
	  position: absolute;
	  z-index: 10;
	  width: 100px;
      transition: all 0.5s ease;
	  opacity: 1;

}

	#logo:hover {

		opacity: 0.5;
	}

	
		#logogradient {
		
		position: absolute;
		height: 200px;
		width: 100%;
		z-index: 9;

background: rgb(0,0,0);
background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 100%);
	}





	#navagation {

			position: fixed;
		overflow: scroll;
		left: 0;
		top: 0;
		height: 100%;
		width: 100%;
		font-family: CharleFont;
		color: #000000;
		font-size: 20px;
		z-index: 10;
		background: #FFF;
		display: none;


	}



	#navlinks-container {


  position: absolute;
		width: 100%;
	border: 0px solid #000;
		padding-top: 20%;
		height: 80%;
		z-index: 12;

	}





	#navlinks {


		  transition: all 0.5s ease;
		bottom: 0px;
		position: relative;
		padding-top: 30px;
		text-align: center;
		width: 100%;

	}



	#navlinks-container:hover > #navlinks {
  	opacity: 0.5;

	}



	#navlinks-container:hover > #navlinks:hover {
  	opacity: 1.0;
	bottom: 7px;

	}



	#CTA-container {

		position: fixed;
		right:0;
		margin-right: 4%;
		top:30px;
		z-index: 40;

	}





	#navagation-CTA-mobile {

		font-family: CharleFont;
		color: #FFF;
		font-size: 12px;
		padding: 15px;
		background: #000;
		transition: all 0.5s ease;
		cursor: pointer;
		z-index: 40;
		float: left;
		border-radius: 15px;

	}




	#navagation-CTA-mobile:hover {

		  transform: scale(1.2);

	}

			#navagation-CTA {

		display: none;
	}


	#nav-icon {


		font-family: CharleFont;
		font-size: 15px;
		z-index: 3;
		width: 30px;
		float: left;
		margin-right: 20px;
		margin-top: 10px;




	}

	#nav-icon span {

  background: #000;

	}




	#heading {

		font-size: 25px;
		margin-bottom: 10px;
		line-height: 25px;

	}

	#bodytext {

		font-size: 13px;
		line-height: 25px;

	}

			#smallbodytext {

		font-size: 12px;
		line-height: 25px;
	}



	#Button{

		font-size: 13px;
		font-family: CharleFont;
		color: #000;
	margin-top: 15px;
		transition: all 0.5s ease;
		position: relative;
		opacity: 1;
	}

	#Button:hover {

		opacity: 0.1;
	}





/***** SECTION CONTAINER ******/

	#sectioncontainer {


		background: #FFF;
		width: 100%;
		padding-top: 20px;
		padding-bottom: 20px;
		position: relative;
	}


			#sectioncontentcontainer {



		width: 90%;
		margin-left: auto;
		margin-right: auto;
		left: 0;
			right: 0;
		position: relative;
	}








}











/******** TESTIMONIAL SECTION - D&D **************/

/* EXTRA LARGE SCREEN */
@media only screen and (min-width: 1600px) {



		#section5bkg {

		width: 100%;
		background: url('../image/testimonialbkg.jpg') center center no-repeat;
		background-size: 105%;
		padding-top: 248px;
			padding-bottom: 50px;

	}
	
			#section5-2bkg {

		width: 100%;
		background: url('../image/testimonialbkg2.jpg') center center no-repeat;
		background-size: 105%;
		padding-top: 248px;
			padding-bottom: 50px;

	}

	#section5container {

		width: 80%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		color: #FFF;
		position: relative;
	}

	#s5maintext {

		font-size: 50px;
		width: 65%;
		text-align: left;
	}

	#s5subtitle {

		font-size: 20px;
		padding-top: 50px;
		padding-bottom: 150px;
	}

	#s5watch {

		font-size: 25px;
		line-height: 40px;
		position: relative;
		color: #FFFFFF;


	}

	#s5watchicon {

		width: 43px;
		position: relative;
		top: 12px
	}

	#caselink {

		text-align: right;
		position: absolute;
		right: 0px;
		bottom: 10px;
		transition: all 0.5s ease;

	}


	#caselink:hover {

		right: 20px;


	}

	#caselinkheading {

		font-size: 18px;
		color: #FFF;
	}

	#caselinksubheading {

		font-size: 12px;
		color: #FFF;
	}




}


	/* LARGE SCREEN  */
@media only screen and (min-width: 1200px)  and (max-width: 1599px) {



			#section5bkg {

		width: 100%;
		background: url('../image/testimonialbkg.jpg') center center no-repeat;
		background-size: 135%;
		padding-top: 148px;
			padding-bottom: 50px;

	}
	
				#section5-2bkg {

		width: 100%;
		background: url('../image/testimonialbkg2.jpg') center center no-repeat;
		background-size: 105%;
		padding-top: 248px;
			padding-bottom: 50px;

	}

	#section5container {

		width: 80%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		color: #FFF;
		position: relative;
	}

	#s5maintext {

		font-size: 50px;
		width: 65%;
		text-align: left;
	}

	#s5subtitle {

		font-size: 20px;
		padding-top: 50px;
		padding-bottom: 100px;
	}

	#s5watch {

		font-size: 20px;
		line-height: 40px;
		position: relative;
		color: #FFFFFF;


	}

		#s5watchicon {

		width: 43px;
		position: relative;
		top: 12px
	}


	#caselink {

		text-align: right;
		position: absolute;
		right: 0px;
		bottom: 10px;
		transition: all 0.5s ease;

	}


	#caselink:hover {

		right: 20px;


	}

	#caselinkheading {

		font-size: 18px;
		color: #FFF;
	}

	#caselinksubheading {

		font-size: 12px;
		color: #FFF;
	}



	}


/*MEDIUM SCREEN */
@media only screen and (min-width: 992px)  and (max-width: 1199px) {





			#section5bkg {

		width: 100%;
		background: url('../image/testimonialbkg.jpg') center center no-repeat;
		background-size: 155%;
		padding-top: 148px;
			padding-bottom: 50px;

	}
	
				#section5-2bkg {

		width: 100%;
		background: url('../image/testimonialbkg2.jpg') center center no-repeat;
		background-size: 105%;
		padding-top: 248px;
			padding-bottom: 50px;

	}

	#section5container {

		width: 80%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		color: #FFF;
		position: relative;
	}

	#s5maintext {

		font-size: 30px;
		width: 65%;
		text-align: left;
	}

	#s5subtitle {

		font-size: 20px;
		padding-top: 50px;
		padding-bottom: 50px;
	}



	#s5watch {

		font-size: 14px;
		line-height: 40px;
		position: relative;
		color: #FFFFFF;


	}

		#s5watchicon {

		width: 30px;
		position: relative;
		top: 10px
	}

	#caselink {

		text-align: right;
		position: absolute;
		right: 0px;
		bottom: 0px;
		transition: all 0.5s ease;

	}


	#caselink:hover {

		right: 20px;


	}

	#caselinkheading {

		font-size: 18px;
		color: #FFF;
	}

	#caselinksubheading {

		font-size: 12px;
		color: #FFF;
	}




	}




/*SMALL SCREEN */
@media only screen and (min-width: 768px)  and (max-width: 991px) {


	
	#megaMenu{
	display: none !important;
	}

				#section5bkg {

		width: 100%;
		background: url('../image/testimonialbkg.jpg') center center no-repeat;
		background-size: 155%;
		padding-top: 110px;
			padding-bottom: 50px;

	}
	
				#section5-2bkg {

		width: 100%;
		background: url('../image/testimonialbkg2.jpg') center center no-repeat;
		background-size: 105%;
		padding-top: 248px;
			padding-bottom: 50px;

	}

	#section5container {

		width: 80%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		color: #FFF;
		position: relative;
	}

	#s5maintext {

		font-size: 30px;
		width: 65%;
		text-align: left;
	}

	#s5subtitle {

		font-size: 20px;
		padding-top: 50px;
		padding-bottom: 50px;
	}

	#s5watch {

		font-size: 14px;
		line-height: 40px;
		position: relative;
		color: #FFFFFF;


	}

			#s5watchicon {

		width: 25px;
		position: relative;
		top: 6px
	}

	#caselink {

		text-align: right;
		position: absolute;
		right: 0px;
		bottom: 0px;
		transition: all 0.5s ease;

	}


	#caselink:hover {

		right: 20px;


	}

	#caselinkheading {

		font-size: 18px;
		color: #FFF;
	}

	#caselinksubheading {

		font-size: 12px;
		color: #FFF;
	}





	}

/*MOBILE SCREEN */
@media only screen and (max-width: 767px) {




/*** EMAIL POP UP **/


	#emailpopup {

		position: fixed;
		left: 0px;
		bottom: 0px;
		background: #000;
		width: 90%;
		max-width: 620px;
		z-index: 100;
		padding-left: 5%;
		padding-right: 5%;
		padding-top: 15px;
		padding-bottom: 15px;
		color: #FFF;
		box-shadow: 0px 0px 25px 10px rgba(0, 0, 0, 0.3);
		display:none;

	}

	#emailtitle {

		font-size: 15px;
		padding-bottom: 10px;
	}

	#emailsubtitle {
		font-size: 13px;
		padding-bottom: 10px;
	}

	#emailcookie {

		font-size: 9px;
		padding-top: 5px;
		padding-bottom: 5px;
		opacity: 0.5;
	}

		#mce-EMAIL {

		width: 50%;
		background: #FFF;
		border: 0;
		padding-top: 10px;
		padding-bottom: 10px;

		padding-left: 10px;
		padding-right: 10px;

		font-family: CharleFont;
		font-size: 10px;
		color: #c9c9c9;
		outline: none;
		position: relative;
		z-index: 10;
		border: 2px solid #FFF;

		margin-top: 5px;
			float: left;

		    -webkit-appearance: none;
     border-radius: 0;


}

	#mc-embedded-subscribe {
		float: left;
		background: #000;
		border: 2px solid #FFF;
		padding-top: 10px;
		padding-bottom: 10px;
		padding-left: 20px;
		padding-right: 20px;
		font-size: 13px;
		margin-top: 5px;
		margin-left: 20px;
		cursor: pointer;
	}

	#closeicon {

		position: absolute;
		right: 20px;
		top: 20px;
		width: 28px;
		cursor: pointer
	}







				#section5bkg {

		width: 100%;
		background: url('../image/testimonialbkg.jpg') center center no-repeat;
		background-size: 200%;
		padding-top: 70px;
			padding-bottom: 10px;

	}
	
				#section5-2bkg {

		width: 100%;
		background: url('../image/testimonialbkg2.jpg') center center no-repeat;
		background-size: 105%;
		padding-top: 248px;
			padding-bottom: 50px;

	}

	#section5container {

		width: 90%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		color: #FFF;
		position: relative;
	}

	#s5maintext {

		font-size: 23px;
		width: 100%;
		text-align: left;
	}

	#s5subtitle {

		font-size: 13px;
		padding-top: 20px;
		padding-bottom: 30px;
	}

	#s5watch {

		font-size: 11px;
		line-height: 40px;
		position: relative;
		color: #FFFFFF;


	}


			#s5watchicon {

		width: 20px;
		position: relative;
		top: 5px
	}

	#caselink {

		text-align: right;
		position: absolute;
		right: 0px;
		bottom: 0px;
		transition: all 0.5s ease;

	}


	#caselink:hover {

		right: 20px;


	}

	#caselinkheading {

		font-size: 13px;
		color: #FFF;
	}

	#caselinksubheading {

		font-size: 10px;
		color: #FFF;
	}









}











/*** RECENT ARTICLES ***/


/* EXTRA LARGE SCREEN */
@media only screen and (min-width: 1600px) {

	#section6bkg {

		background: #FFF;
		width: 100%;
		padding-top: 130px;
		padding-bottom: 160px;

	}

	#section6container {

		width: 80%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		opacity: 0;

	}

	#article {

		font-family: CharleFont;
		float: left;
		width: 30%;

		padding-right: 3.333%;
		margin-top: 60px;


	}

	#articleheading {

		color: #000;
		font-size: 25px;
		padding-bottom: 10px;
	}

	#articlecontent {

		color: #000;
		font-size: 16px;

	}

	#article-button{
		padding-top: 10px;
		font-size: 16px;
		transition: all 0.5s ease;
		cursor: pointer;
	}

	#article-button:hover {
		padding-top: 10px;
		font-size: 16px;
		opacity: 0.5;
	}


}


	/* LARGE SCREEN  */
@media only screen and (min-width: 1200px)  and (max-width: 1599px) {


		#section6bkg {

		background: #FFF;
		width: 100%;
		padding-top: 130px;
		padding-bottom: 160px;

	}

	#section6container {

		width: 80%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		opacity: 0;

	}

	#article {

		font-family: CharleFont;
		float: left;
		width: 30%;
		padding-left: 1.5%;
		padding-right: 1.5%;
		margin-top: 60px;


	}

	#articleheading {

		color: #000;
		font-size: 25px;
		padding-bottom: 10px;
	}

	#articlecontent {

		color: #000;
		font-size: 16px;

	}

	#article-button{
		padding-top: 10px;
		font-size: 16px;
		transition: all 0.5s ease;
		cursor: pointer;
	}

	#article-button:hover {
		padding-top: 10px;
		font-size: 16px;
		opacity: 0.5;
	}

	}


/*MEDIUM SCREEN */
@media only screen and (min-width: 992px)  and (max-width: 1199px) {

	
	#megaMenu{
	display: none !important;
	}

			#section6bkg {

		background: #FFF;
		width: 100%;
		padding-top: 60px;
		padding-bottom: 60px;

	}

	#section6container {

		width: 80%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		opacity: 0;

	}

	#article {

		font-family: CharleFont;
		float: left;
		width: 30%;
		padding-left: 1.5%;
		padding-right: 1.5%;
		margin-top: 60px;


	}

	#articleheading {

		color: #000;
		font-size: 25px;
		padding-bottom: 10px;
	}

	#articlecontent {

		color: #000;
		font-size: 16px;

	}

	#article-button{
		padding-top: 10px;
		font-size: 16px;
		transition: all 0.5s ease;
		cursor: pointer;
	}

	#article-button:hover {
		padding-top: 10px;
		font-size: 16px;
		opacity: 0.5;
	}

	}




/*SMALL SCREEN */
@media only screen and (min-width: 768px)  and (max-width: 991px) {


			#section6bkg {

		background: #FFF;
		width: 100%;
		padding-top: 130px;
		padding-bottom: 160px;

	}

	#section6container {

		width: 90%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		opacity: 0;

	}

	#article {

		font-family: CharleFont;
		float: left;
		width: 45%;
		padding-left: 2.5%;
		padding-right: 2.5%;
		margin-top: 60px;


	}

	#articleheading {

		color: #000;
		font-size: 25px;
		padding-bottom: 10px;
	}

	#articlecontent {

		color: #000;
		font-size: 16px;

	}

	#article-button{
		padding-top: 10px;
		font-size: 16px;
		transition: all 0.5s ease;
		cursor: pointer;
	}

	#article-button:hover {
		padding-top: 10px;
		font-size: 16px;
		opacity: 0.5;
	}

	.article3 {

		display: none;
	}



}

/*MOBILE SCREEN */
@media only screen and (max-width: 767px) {




			#section6bkg {

		background: #FFF;
		width: 100%;
		padding-top: 60px;
		padding-bottom: 90px;

	}

	#section6container {

		width: 90%;
		max-width: 1470px;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		opacity: 0;

	}

	#article {

		font-family: CharleFont;
		float: left;
		width: 47%;
		padding-left: 1.5%;
		padding-right: 1.5%;
		margin-top: 20px;


	}

	#articleheading {

		color: #000;
		font-size: 16px;
		padding-bottom: 10px;
	}

	#articlecontent {

		color: #000;
		font-size: 13px;

	}

	#article-button{
		padding-top: 10px;
		font-size: 13px;
		transition: all 0.5s ease;
		cursor: pointer;

	}

	#article-button:hover {
		padding-top: 10px;
		font-size: 13px;
		opacity: 0.5;
	}

	.article3 {

		display: none;
	}



}





/********* FOOOOOOOOOTER ********/




#footernavagation a:link {
    color: #000;
	text-decoration: none;
	-o-transition:1s;
    -ms-transition:1s;
    -moz-transition:1s;
    -webkit-transition:1s;
    transition:1s;
}

#footernavagation a:visited {
	color: #000;
	text-decoration: none;
}

#footernavagation a:hover {
    color: #ebebeb;
	text-decoration: none;
}

#footernavagation a:active {
    color: #000;
	text-decoration: none;
	}
















/******** ARTICLES SECTION **************/

/* EXTRA LARGE SCREEN */
@media only screen and (min-width: 1600px) {




	#latestarticlesbackground {

		width: 100%;
		background: #FFF;
		position: relative;
	}


	#latestarticlescontainer {

		width: 95%;
		max-width: 1700px;

		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		position: relative;
		margin-top: 90px;
	}


	#latestarticlesleftside {

		width: calc(50% - 15px);
		float: left;
		margin-right: 15px;
	}

	#latestarticlesrightside {

		width: calc(50% - 15px);
		float: left;
		margin-left: 15px;
		position: relative;
		z-index: 1;
	}



	#latestarticlespost1 {

		background: -moz-linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
        background: -webkit-linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
        background: linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 60px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;
		margin-bottom: 30px;
		position: relative;
		padding-top: 50px;
		padding-bottom: 50px;
	}

	#latestarticlespost2 {

		background: -moz-linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);
        background: -webkit-linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);
        background: linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);

		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 60px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;

		margin-bottom: 30px;
		position: relative;
				padding-top: 50px;
		padding-bottom: 50px;
	}


	#latestarticlespost3 {


		
		
			  background: -moz-linear-gradient(145deg, #1de5e2 0%, #955aec 100%);
        background: -webkit-linear-gradient(145deg, #1de5e2 0%, #955aec 100%);
        background: linear-gradient(145deg, #1de5e2 40%, #6196e8 60%, #955aec 80%);


		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 60px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;

		position: relative;
		
				padding-top: 550px;
		padding-bottom: 50px;
	}
	
	#partnersimagearticles3 {
		
		position: absolute;
		top: -31px;
		left: 0;
		width: 100%;
		z-index: 2;
	}

	#latestarticlecontent {



		width: 94%;
	}

	#latestarticlessubheading {

		font-size: 15px;
	}

	#latestarticlesheading {

		font-size: 35px;
		padding-bottom: 10px;
	}

	#latestarticlesbody {

		font-size: 16px!important;
		line-height: 30px;
		padding-bottom: 40px;
	}





}



/* LARGE SCREEN  */
@media only screen and (min-width: 1200px)  and (max-width: 1599px) {


		#latestarticlesbackground {

		width: 100%;
		background: #FFF;
		position: relative;
	}


	#latestarticlescontainer {

		width: 95%;

		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		position: relative;
		margin-top: 90px;
	}


	#latestarticlesleftside {

		width: calc(50% - 15px);
		float: left;
		margin-right: 15px;
	}

	#latestarticlesrightside {

		width: calc(50% - 15px);
		float: left;
		margin-left: 15px;
		
		position: relative;
		z-index: 1;
	}



	#latestarticlespost1 {

		background: -moz-linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
        background: -webkit-linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
        background: linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 60px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;

		margin-bottom: 30px;
		position: relative;
		
		padding-top: 30px;
		padding-bottom: 30px;
	}

	#latestarticlespost2 {

		background: -moz-linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);
        background: -webkit-linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);
        background: linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);

		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 60px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;

		margin-bottom: 30px;
		position: relative;
		
		padding-top: 30px;
		padding-bottom: 30px;
	}


	#latestarticlespost3 {


		  background: -moz-linear-gradient(145deg, #1de5e2 0%, #955aec 100%);
        background: -webkit-linear-gradient(145deg, #1de5e2 0%, #955aec 100%);
        background: linear-gradient(145deg, #1de5e2 40%, #6196e8 60%, #955aec 80%);



		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 60px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;

		position: relative;
		
		padding-top: 450px;
		padding-bottom: 30px;
	}
	
		#partnersimagearticles3 {
		
		position: absolute;
		top: -31px;
		left: 0;
		width: 100%;
		z-index: 2;
	}
	
	


	#latestarticlecontent {



		width: 94%;
	}

	#latestarticlessubheading {

		font-size: 15px;
	}

	#latestarticlesheading {

		font-size: 35px;
		padding-bottom: 10px;
	}

	#latestarticlesbody {

		font-size: 16px;
		line-height: 30px;
		padding-bottom: 40px;
	}




}



/*MEDIUM SCREEN */
@media only screen and (min-width: 992px)  and (max-width: 1199px) {




			#latestarticlesbackground {

		width: 100%;
		background: #FFF;
		position: relative;
	}


	#latestarticlescontainer {

		width: 95%;

		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		position: relative;
		margin-top: 90px;
	}


	#latestarticlesleftside {

		width: calc(50% - 15px);
		float: left;
		margin-right: 15px;
	}

	#latestarticlesrightside {

		width: calc(50% - 15px);
		float: left;
		margin-left: 15px;
		
		position: relative;
		z-index: 1;
	}



	#latestarticlespost1 {

		background: -moz-linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
        background: -webkit-linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
        background: linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 60px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;
		
		padding-top: 30px;
		padding-bottom: 30px;

		margin-bottom: 30px;
		position: relative;
	}

	#latestarticlespost2 {

		background: -moz-linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);
        background: -webkit-linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);
        background: linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);

		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 60px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;
		padding-top: 30px;
		padding-bottom: 30px;
		margin-bottom: 30px;
		position: relative;
	}


	#latestarticlespost3 {


		  background: -moz-linear-gradient(145deg, #1de5e2 0%, #955aec 100%);
        background: -webkit-linear-gradient(145deg, #1de5e2 0%, #955aec 100%);
        background: linear-gradient(145deg, #1de5e2 40%, #6196e8 60%, #955aec 80%);



		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 60px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;
		padding-top: 350px;
		padding-bottom: 30px;
		position: relative;
	}
	
		#partnersimagearticles3 {
		
		position: absolute;
		top: -31px;
		left: 0;
		width: 100%;
		z-index: 2;
	}


	#latestarticlecontent {

		
		width: 94%;
	}

	#latestarticlessubheading {

		font-size: 15px;
	}

	#latestarticlesheading {

		font-size: 35px;
		padding-bottom: 10px;
	}

	#latestarticlesbody {

		font-size: 14px;
		line-height: 30px;
		padding-bottom: 40px;
	}




}




/*SMALL SCREEN */
@media only screen and (min-width: 768px)  and (max-width: 991px) {




				#latestarticlesbackground {

		width: 100%;
		background: #FFF;
		position: relative;
	}


	#latestarticlescontainer {

		width: 95%;

		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		position: relative;
		margin-top: 30px;
	}


	#latestarticlesleftside {

		width: 100%;
	}

	#latestarticlesrightside {

		width: 100%;
		position: relative;
		z-index: 1;
	}



	#latestarticlespost1 {

		background: -moz-linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
        background: -webkit-linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
        background: linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		
		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 60px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;
		padding-top: 30px;
		padding-bottom: 30px;
		margin-bottom: 30px;
		position: relative;
	}

	#latestarticlespost2 {

		background: -moz-linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);
        background: -webkit-linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);
        background: linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);

		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 60px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;
		padding-top: 30px;
		padding-bottom: 30px;
		margin-bottom: 30px;
		position: relative;
	}


	#latestarticlespost3 {


		  background: -moz-linear-gradient(145deg, #1de5e2 0%, #955aec 100%);
        background: -webkit-linear-gradient(145deg, #1de5e2 0%, #955aec 100%);
        background: linear-gradient(145deg, #1de5e2 40%, #6196e8 60%, #955aec 80%);



		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 60px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;
		
			padding-top: 30px;
		padding-bottom: 30px;
		margin-bottom: 30px;
	
		position: relative;
	}
	
		#partnersimagearticles3 {
		
		display: none;
	}


	#latestarticlecontent {

	
		width: 94%;
	}

	#latestarticlessubheading {

		font-size: 15px;
	}

	#latestarticlesheading {

		font-size: 30px;
		padding-bottom: 10px;
		line-height: 40px;
	}

	#latestarticlesbody {

		font-size: 14px;
		line-height: 25px;
		padding-bottom: 20px;
	}





}



/*MOBILE SCREEN */
@media only screen and (max-width: 767px) {





				#latestarticlesbackground {

		width: 100%;
		background: #FFF;
		position: relative;
	}


	#latestarticlescontainer {

		width: 95%;

		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		position: relative;
		margin-top: 30px;
	}


	#latestarticlesleftside {

		width: 100%;
	}

	#latestarticlesrightside {

		width: 100%
	}



	#latestarticlespost1 {

		background: -moz-linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
        background: -webkit-linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
        background: linear-gradient(50deg, #ed9339 20%, #ad5bf3 50%, #6a30fc 80%);
		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 30px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;
		padding-top: 30px;
		padding-bottom: 30px;
		margin-bottom: 25px;
		position: relative;
	}

	#latestarticlespost2 {

		background: -moz-linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);
        background: -webkit-linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);
        background: linear-gradient(135deg, #c8fa52 0%, #66b636 40%, #66b636 60%, #00e89e 90%);

		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 30px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;
		padding-top: 30px;
		padding-bottom: 30px;
		margin-bottom: 25px;
		position: relative;
	}


	#latestarticlespost3 {


		  background: -moz-linear-gradient(145deg, #1de5e2 0%, #955aec 100%);
        background: -webkit-linear-gradient(145deg, #1de5e2 0%, #955aec 100%);
        background: linear-gradient(145deg, #1de5e2 40%, #6196e8 60%, #955aec 80%);



		box-shadow: 0px 0px 80px 10px rgba(0, 0, 0, 0.2);
		border-radius: 30px;
		padding-left: 3%;
		padding-right: 3%;
		width: 94%;
		margin: 0;
		color: #FFF;
		
		padding-top: 30px;
		padding-bottom: 30px;

		position: relative;
	}
	
		#partnersimagearticles3 {
		
		display: none;
	}


	#latestarticlecontent {

		position: relative;
	
		width: 94%;
	}

	#latestarticlessubheading {

		font-size: 11px;
		line-height: 20px;
	}

	#latestarticlesheading {

		font-size: 20px;
		line-height: 30px;
		padding-bottom: 10px;
	}

	#latestarticlesbody {

		font-size: 11px;
		line-height: 20px;
		padding-bottom: 20px;
	}





}



#why-charle {
	margin-top: 60px;
}
#why-charle .container{
	width: 80%;
	max-width: 1470px;
	margin-left: auto;
	margin-right: auto;
}
#why-charle h3{
	font-size: 32px;
	font-weight: 600;
	margin-bottom: 15px;
}
#why-charle .justify-evenly{
	margin-top: 30px;
	justify-content: space-evenly;
	flex-wrap: wrap;
}
#why-charle .text-col{
	text-align: center;
	color: #989898;
}
#why-charle .content{
	text-align: center;
}

#why-charle .overTitle{
	font-weight: 600;
	font-size: 18px;
}

#why-charle .subtitle{
	color: #d7d7d7;
	font-weight: 600;
}

#megaMenu{
	position: absolute;
	left: 0;
	right: 0;
	width: fit-content;
	margin: auto;
	transform: translate(-40%, 10%);
	background: #fff;
	padding: 15px;
	padding-bottom: 0px;
	display: none;
	opacity: 0;
	transition: all ease 0.3s;
}

#megaMenu:after {
	/* css marker/arrow */
	content: "";
	position: absolute;
	top: -29px;
	
	border-top: 0px solid transparent;
	border-bottom: 0px solid #fff;
	border-right: 0px solid transparent;
	border-left: 0px solid transparent;
	transition: 0.8s 0.2s;
	border-width: 15px;
	background: transparent;
	width: 0px;
	height: 0px;
}
/* Mega Menu Top Half */
#megaMenu h5{
	margin: 5px 0px;
	margin-bottom: 15px;
}
#megaMenu h5.grey{
	padding-left: 5px;
	color: #919eae;
}
#megaMenu .item{
	display: flex;
	margin-bottom: 15px;
}
#megaMenu .item img{
	border-radius: 50%;
	height: 40px;
	width: 40px;
	margin-right: 15px;
}
#megaMenu .col{
	min-width: 300px;
}
#megaMenu .content{
	text-align: left;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
#megaMenu .content h5, #megaMenu .content p{
	margin: 0;
}
/* Mega Menu bottom Half */
#megaMenu .bottom{
	background: #f9f9f9;
	/* Give it's own padding - ignore parents */
	padding: 15px;
	width: 100%;
	position: relative;
	left: -15px;
	display: flex;
}
#megaMenu .bottom p{
	margin: 0px;
	margin-top: 15px;
}
#megaMenu .bottom h4{
	font-size: 18px;
	margin: 0px;
}
#megaMenu .bottom .col.left{
	width: 60%;
	margin: 15px 0px;
}
#megaMenu .bottom .col.right{
	width: 40%;
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
}
#megaMenu .bottom  .col.right img{
	height: 40px;
	opacity: 0.24;
}

.showMenu{
	height: 50px;
}

.showMenu:hover #megaMenu{
	opacity: 1;
	display: block;
}


#megaMenu:hover{
	opacity: 1;
	display: block;
}

.blah{
	/* hi */
}