html,body
{
    	width: 100%;
    	margin: 0;
    	padding: 0;
	overflow-x: hidden; 
	font-family: 'Arial'; 
	color: #000;

	scroll-behavior: smooth;
	
}


@font-face {
	font-family: MeeraInimai;
	src: url('MeeraInimai-Regular.ttf'); 
}

@font-face {
	font-family: QuaverSans;
	src: url('QuaverSans.otf') format("opentype");
}



a {

	text-decoration: none;
		color: white;

}

a.mail {

	text-decoration: none;
	color: #fff;

}


a[href^=tel] {

	color: inherit;
	text-decoration: none;

}


h2 {

	font-family: 'Bebas Neue', sans-serif;
	color: #000;
    	font-size: 7vw;
	font-weight: 300;
	margin-top: 0;
	margin-bottom: 0;
	
}


h3 {

	font-family: 'Bebas Neue', sans-serif;
	color: #000;
	font-size: 4vw;
	letter-spacing: 1px;
	font-weight: 100;
	margin-top: 0;
	margin-bottom: 0;
	
}




#header {

display: block;
position: relative;

	
}



.navwrapper {
 
	width: 100%;
	margin: 35px 35px 35px 0;
	position: absolute;
	top: 0;
	right: 0;

	text-align:right;
 	
}

@media screen and (max-width: 600px) {
  .navwrapper {
	margin: 5px 0 5px 0;   


  }
}


.nav {
    	width: 100%;
	text-align: right;

}


.nav-item {
    
	font-family: 'MeeraInimai', Arial, sans-serif;
	margin: 0 20px 0 20px;
	display: inline-block;
    	color: white;
    	font-weight: bold;
    	font-size: 1.4em;
    	text-align: center;
	letter-spacing: 4px;

}

@media screen and (max-width: 600px) {
  .nav-item {
    font-size: 3vw;
	margin: 0 8px 0 8px;
  }
}

.nav-item:hover {
    
	font-family: 'MeeraInimai', Arial, sans-serif;
	margin: 0 20px 0 20px;
	display: inline-block;
    	color: white;
    	font-weight: bold;
    	font-size: 1.4em;
    	text-align: center;
	letter-spacing: 4px;
	border-bottom: 4px solid #e0cf0a;
	line-height: 2;


}

@media screen and (max-width: 600px) {
  .nav-item:hover {
    font-size: 3vw;
	margin: 0 8px 0 8px;
	border-bottom: 1px solid #e0cf0a;
  }
}


.nav-item-active {
    
	font-family: 'MeeraInimai', Arial, sans-serif;
	margin: 0 20px 0 20px;
	display: inline-block;
    	color: white;
    	font-weight: bold;
    	font-size: 1.4em;
    	text-align: center;
	letter-spacing: 4px;
	border-bottom: 4px solid #e0cf0a;
	line-height: 2;
}

@media screen and (max-width: 600px) {
  .nav-item-active {
    font-size: 3vw;
	margin: 0 8px 0 8px;
	border-bottom: 1px solid #e0cf0a;
  }
}


#individual {

	width: 20%;
	height: 280px;
	display: inline-block;
	background-color: white;
	position: absolute;
	bottom: 50;
	left: 18%;
	font-family: 'Bebas Neue', Arial, sans-serif;
	font-size: 1.4vw;
	color: #000;
    	text-align: center;
	transform: translate(-50%, -50%);
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 20px;
	border: 3px solid #f9f122;
	border-radius: 5px;
	padding: 20px;


}



@media screen and (max-width: 600px) {
  #individual {
	font-size: 3vw;
	height: 130px;
	width: 19%;
	margin-top: 20px;

	
  }
}

@media screen and (min-width: 1500px) {
  #individual {
	
		height: 380px;
		margin-bottom: 40px;
  }
}

#couples {

	width: 20%;
	height: 280px;
	background-color: white;
	position: absolute;
	bottom: 50;
	left: 50%;
	font-family: 'Bebas Neue', Arial, sans-serif;
	color: #000;
    	font-size: 1.4vw;
    	text-align: center;
	transform: translate(-50%, -50%);
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 20px;
	border: 3px solid #f9f122;
	border-radius: 5px;
	padding: 20px;

}

@media screen and (max-width: 600px) {
  #couples {
	font-size: 3vw;
	height: 130px;
	width: 19%;
	margin-top: 20px;
  }
}

@media screen and (min-width: 1500px) {
  #couples {
	
		height: 380px;
		margin-bottom: 40px;
  }
}

#family {

	width: 20%;
	height: 280px;
	background-color: white;
	position: absolute;
	bottom: 50;
	left: 82%;
	font-family: 'Bebas Neue', Arial, sans-serif;
	color: #000;
    	font-size: 1.4vw;
    	text-align: center;
	transform: translate(-50%, -50%);
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 20px;
	border: 3px solid #f9f122;
	border-radius: 5px;
	padding: 20px;

}

@media screen and (max-width: 600px) {
  #family {
	font-size: 3vw;
	height: 130px;
	width: 19%;
	margin-top: 20px;
  }
}

@media screen and (min-width: 1500px) {
  #family {
	
		height: 380px;
	margin-bottom: 40px;
	
  }
}

#joiniframe {
	

	margin: auto;
    	width: 100%;
	font-family: 'Helvetica', Arial, sans-serif;
	font-size: 2.1em;
	height: 100%;
	padding: 30px 0 30px 0;
	text-align: justify;
	text-justify: inter-word;

	
}

@media screen and (max-width: 600px) {
  #joiniframe {
	
		display: none !important;
	
  }
}

#joiniframesmall {
	

	margin: auto;
    	width: 100%;
	font-family: 'Helvetica', Arial, sans-serif;
	font-size: 2.1em;
	height: 100%;
	padding: 30px 0 30px 0;
	text-align: justify;
	text-justify: inter-word;

	
}

@media screen and (min-width: 601px) {
  #joiniframesmall {
	
		display: none !important;
	
  }
}





#abouttext {
	

	margin: auto;
	margin-top: 200px;
    	width: 80%;

	font-size: 2.5vw;
	height: 100%;
	padding: 30px 0 30px 0;
	text-align: justify;
	text-justify: inter-word;

	
}

@media screen and (max-width: 600px) {
  #abouttext {
    font-size: 4vw;
	margin-top: 100px;
	
  }
}


#jointext {
	

	margin: auto;
	margin-top: 20px;
    	width: 100%;
	font-family: 'Bebas Neue', Arial, sans-serif;
	font-size: 2.1em;
	height: 100%;
	padding: 30px 0 30px 0;
	text-align: center;

	
}

.responsive {
  width: 100%;
  height: auto;
	max-width: 183px;
}

.responsivetraining {
	 width: 100%;
  height: auto;


}


#trainers  {

	background-image: url("");

	-webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    background-size: 100% 100%;
    background-repeat: no-repeat;

	margin-top: 20px;
	display: inline-block;
	background-size: cover;
	

}

#mapcontainer {

	display: flex;
	width: 100%;


}

#map {
	

	margin-left: 90px;
	margin-top: 30px;
	width: 40%;
	font-family: 'Helvetica', Arial, sans-serif;
	font-size: 2.1em;
	height: 100%;
	padding: 30px 30px 30px 30px;
	text-align: center;
	text-justify: inter-word;

	
}


@media screen and (max-width: 600px) {
  #map {
  		margin-left: 0;
		margin-top: 30px;
		width: 100%;
		padding: 5px;
	
  }
}




#maptext {


	flex-grow: 1;
	width: 60%;
	padding-top: 50px;

}

@media screen and (max-width: 600px) {
  #maptext {

		visibility: hidden;
   
  }
}

.ourdomain

	{

		font-size: 2vw;
		font-family: 'Bebas Neue';
		letter-spacing: 1px;
		color: #626262;

}

.join

	{

		width: 90%;
		margin-left:auto; 
		margin-right:auto;
	
	

}

.join td {

		padding: 10px;

}

.joinhead {

		font-size: 4vw;
		letter-spacing: 2px;
		margin-top: 0px;
}

@media screen and (max-width: 600px) {
  .joinhead {

		font-size: 5vw;
   
  }
}

.joinsub {

		font-size: 2vw;
		font-family: 'Arial';
		text-align: center;
		letter-spacing: 1.5px;

}

@media screen and (max-width: 600px) {
  .joinsub {

		font-size: 3vw;
   
  }
}

#joinalt {

		width: 100%;
		background-color: #16153f;
		height: auto;
		padding-top: 25px;
		padding-bottom: 25px;
}

#joinaltbox {

		width: 70%;
		background-color: #16153f;
		height: auto;
		border: 3px solid #e0cf0a;
		border-radius: 5px;
		text-align: center;
		color: white;
		margin: auto;
		position: relative;
		top: 25%;
		padding: 25px;
		font-family: 'Arial';
		letter-spacing: 2px;
		line-height: 1.6;
		
}

#joinquestion {

		width: 70%;
		
		text-align: center;
		margin: auto;
		margin-top: 40px;
		font-family: 'Arial';
		letter-spacing: 2px;
		line-height: 1.6;

		
}

#footer  {

	background-image: url("http://www.kingdomfitness417.com/images/footerwithoutlogo.jpg");

	-webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    background-size: 100% 100%;
    background-repeat: no-repeat;

	display: inline-block;
	background-size: cover;
	font-family: 'Helvetica', Arial, sans-serif;
	color: white;
	font-size: 1.8vw;
	line-height: 1.6;
	margin-top: 50px;
	text-align: center;
	width: 100%;
	padding-top: 30px;

}


@media screen and (max-width: 600px) {
  #footer {

	font-size: 3.5vw;
   
  }
}


#trainingbody {
	

	margin: auto;
	margin-top: 20px;
    	width: 90%;
	font-family: 'Arial', sans-serif;
	font-size: 1.5em;
	height: 100%;
	padding: 30px 0 30px 0;
	

	
}






input[type=text], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
}

input[type=submit] {
  background-color: #4CAF50;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color: #45a049;
}



#contactcontainer {

	
	display: flex;
	margin-top: 30px;

}

#contactleft {

	width: 40%;
	margin-left: 50px;
	padding: 0 10px 0 50px;
	flex: 1
	font-size: 2vw;

}

.contactform {

  padding: 10px;
	width: 50%;
	margin: auto;	


}



@media screen and (max-width: 600px) {
  #contactcontainer {

	display: block;
  
  }
}

@media screen and (max-width: 600px) {
  #contactleft {

	width: 90%;
	flex: 0;
  	font-size: 5vw;
	margin-left: 5px;
	padding: 15px;
  }
}



@media screen and (max-width: 600px) {
  .contactform {
	
		display: none !important;
	
  }
}

#contactformsmall {
	

	margin: auto;
    	width: 90%;
	font-family: 'Helvetica', Arial, sans-serif;
	font-size: 2.1em;
	height: 100%;
	padding: 30px 0 30px 0;
	text-align: justify;
	text-justify: inter-word;

	
}

@media screen and (min-width: 601px) {
  #contactformsmall {
	
		display: none !important;
	
  }
}


.contactlabels {

	font-family: 'Roboto', sans-serif;
	font-size: 1.2vw;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: #3f3f3f;


}

@media screen and (max-width: 600px) {
  .contactlabels {

	font-size: 4vw;
  
  }
}


.trainingcontainer {

	
	display: flex;
	margin-top: 30px;
}

.trainingleft {

	width: 40%;
	padding: 20px;
	flex: 1
	font-size: 2vw;
}


.trainingright {

	width: 60%;	
	padding: 20px;
	font-size: 2vw;

}

.trainingheads {

	font-family: 'Bebas Neue';
	font-size: 6vw;
	color: #262161;
	letter-spacing: 4px;

}

@media screen and (max-width: 600px) {
  .trainingheads {

	font-size: 10vw;
  
  }
}

@media screen and (max-width: 600px) {
  .trainingcontainer {

	display: block;
  
  }
}

@media screen and (max-width: 600px) {
  .trainingleft {

	width: 90%;
	flex: 0;
  	font-size: 5vw;
  }
}

@media screen and (max-width: 600px) {
  .trainingright {

	width: 90%;
	font-size: 4.5vw;
  
  }
}


.center {
  display: table;
  width: 50%;
	margin: auto;
	margin-bottom: 30px;
	margin-top: 20px;


}

#social {
  display: table-cell;

}

#social ul {
  text-align: center;
  padding-left: 0px;
  margin: 0 auto;
}

#social li {
  display: inline-block;
  list-style-type: none;
  margin-left: 10px;
	margin-right: 10px;
}

/** Facebook **/

.facebook {
  width: 50px;
  height: 50px;
}

.facebook .border {
  background: transparent;
  outline: none;
  color:rgba(255,255,255, 0.3);
  width: 50px;
  height: 50px;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  border: 2px solid rgba(255,255,255, 0.3);
  transition: all .2s ease-in-out;
}

.facebook .border:hover {
  background: #3b5998;
  border-color: #436aaf;
  color: rgba(255,255,255, 0.9);
  transform: scale(1.2);
}

.fa.fa-facebook {
  font-size: 25px;
}

/** Twitter **/

.twitter {
  width: 50px;
  height: 50px;
}

.twitter .border {
  background: transparent;
  outline: none;
  color:rgba(255,255,255, 0.3);
  width: 50px;
  height: 50px;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  border: 2px solid rgba(255,255,255, 0.3);
  transition: all .2s ease-in-out;
}

.twitter .border:hover {
  background: #00aced;
  border-color: #72c6e6;
  color: rgba(255,255,255, 0.9);
  transform: scale(1.2);
}

.fa.fa-twitter {
  font-size: 25px;
}

/** Instagram **/

.instagram {
  width: 50px;
  height: 50px;
}

.instagram .border {
  background: transparent;
  outline: none;
  color:rgba(255,255,255, 0.3);
  width: 50px;
  height: 50px;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  border: 2px solid rgba(255,255,255, 0.3);
  transition: all .2s ease-in-out;
}

.instagram .border:hover {
  background: #517fa4;
  border-color: #7495af;
  color: rgba(255,255,255, 0.9);
  transform: scale(1.2);
}

.fa.fa-instagram {
  font-size: 25px;
}

/** dribbble **/

.dribbble {
  width: 50px;
  height: 50px;
}

.dribbble .border {
  background: transparent;
  outline: none;
  color:rgba(255,255,255, 0.3);
  width: 50px;
  height: 50px;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  border: 2px solid rgba(255,255,255, 0.3);
  transition: all .2s ease-in-out;
}

.dribbble .border:hover {
  background: #ea4c89;
  border-color: #ff78ac;
  color: rgba(255,255,255, 0.9);
  transform: scale(1.2);
}

.fa.fa-dribbble {
  font-size: 25px;
}

#social ul li {
  transition: ease .3s;
}

#social ul:hover > li {
  opacity: 0.5;
}

#social ul:hover > li:hover {
  opacity: 1;
}