@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,200i,300,300i,400,400i,600,600i,700,700i,900,900i');

/* CSS Document */

html, body { height: 100%; }
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}
	
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
	

body { background:#fff; margin:0; }
	
a:link, a:visited, a:active { text-decoration: none; outline:none; }
a:hover { text-decoration: none;  }



.clr {clear:both; font-size:1px; height:1px; }

/* float clearing for IE6 */
* html .clearfix{ height: 1%; overflow: visible;}
/* float clearing for IE7 */
*+html .clearfix{ min-height: 1%;}
/* float clearing for everyone else */
.clearfix:after{ clear: both; content: "."; display: block; height: 0; visibility: hidden; font-size: 0;}

/*-------END ZERO----------------------------------------------*/

@media (max-width: 768px) {
/*-----------------START TOP NAVIGATION-------------------------------------------*/	
	html{
		background-color:#0b2f5f;
	}
	
	body{
		width:100%;
		margin:0 auto;
		background-color:#0b2f5f;
		font-family:'source sans pro', sans serif;
		color:#fff;
	}
	
	#navTop{
		position:relative;
	}
	
	#logo{
		height:32px;
		width:100%;
		background-color:#0b2f5f;
		padding-top:10px;
		background-image:url(../images/keltech-logo-white.svg);
		background-repeat: no-repeat;
		background-size:120px;
		background-position:left;
			
	}
	/*#logo{
		height:52px;
		width:100%;
		background-color:#0b2f5f;
		padding-top:10px;
		background-image:url(../images/keltech-logo.svg);
		background-repeat: no-repeat;
		background-size:200px;
		background-position:left;
			
	}*/
	#tabs{
		height:62px;
		background-color:#fff;
		width:100%;
	}
	
	#tabs ul{
		margin-left:0;

	}
	
	/*The following fix white space between li inline block. class attached to UL*/
	.inline-block-list{
		font-size: 0;
		}
	
	.inline-block-list li{
		font-size: 14px;/*This has to be in px*/
		}
	
	/*----------------------------------------------------*/
	
	#tabs li{
		display:inline-block;
		font-family:'source sans pro', sans serif;
		color:#fff;
		line-height: 60px;/*This has to be in px*/
		font-weight:600;
		width:20%;
		height:62px;
		list-style: none;
		text-align: center;
	}
	
	/*-----LINKS----------------------------------------------------------------------------*/
	
	#tabs li a{
		color:#fff;
		text-decoration:none;
		display:block;
	}
	
	#tabs li a:hover{
	
		
	}
	
	
	/*-----LINKS----------------------------------------------------------------------------*/

	.home{
		background-color: #0054a6;
	}
	.service{
		background-color: #0a85cc;
	}
	.client{
		background-color: #3a796f;
	}
	.about{
		background-color: #29534c;
	}
	.contact{
		background-color: #bd6d25;

	}
/*-----------------END TOP NAVIGATION-------------------------------------------*/	
	
/*-----------------START HOME CONTENT -------------------------------------------*/
	#placeholder{
		width:100%;
		
		
	}
	
/*-----------------END HOME CONTENT-------------------------------------------*/		

	
	
	
/*-----------New Footer--------------------------------------------------------------------*/

	#bottomNav{
		position:relative;
		clear:left;
		padding-bottom:2em;
		
	}



	.homef{
		background-color: #0054a6;
		width:20%;
		float:left;
		text-align:center;
		padding:8px 0;
	}
	.servicef{
		background-color: #0a85cc;
		width:20%;
		float:left;
		text-align:center;
		padding:8px 0;
	}
	.clientf{
		background-color: #3a796f;
		width:20%;
		float:left;
		text-align:center;
		padding:8px 0;
	}
	.aboutf{
		background-color: #29534c;
		width:20%;
		float:left;
		text-align:center;
		padding:8px 0;
	}
	.contactf{
		background-color: #bd6d25;
		width:20%;
		float:left;
		text-align:center;
		padding:8px 0;

	}

	.homef, .servicef, .clientf, .aboutf, .contactf{
		color:#fff;
		font-size: 14px;
	}
	
	.homef a, .servicef a, .clientf a, .aboutf a, .contactf a{
		
		color:#fff;
		text-decoration:none;
	}
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	.bottomNavText{
		text-align:center;
		padding-top:1em;
		font-size:0.9em;
	}
	
	.bottomNavText h1{
		font-size:1.5em;
		font-weight:300;
	}
	
	

}

/*--------------END 769---------------------------------------------------------------------*/




@media (min-width: 769px) {

	
/*-----------------START TOP NAVIGATION-------------------------------------------*/	
	html{
		background-color:#0b2f5f;
	}
	
	body{
		width:1020px;
		margin:0 auto;
		background-color:#0b2f5f;
		font-family:'source sans pro', sans serif;
		color:#fff;
	}
	
	#navTop{
		position:relative;
		width:100%;
	}
	
	#logo{
		float:left;
		height:32px;
		width:100%;
		background-color:#0b2f5f;
		padding-top:10px;
		background-image:url(../images/keltech-logo-white.svg);
		background-repeat: no-repeat;
		background-size:120px;
		background-position:left;
	}
	#tabs{
		position:absolute;
		right:0;
		top:0;
		height:42px;
		width:70%;
	}
	
	#tabs ul{
	

	}
	
	/*The following fix white space between li inline block. class attached to UL*/
	.inline-block-list{
		font-size: 0;
		}
	
	.inline-block-list li{
		font-size: 14px;/*This has to be in px*/
		}
	
	/*----------------------------------------------------*/
	
	#tabs li{
		display:inline-block;
		font-family:'source sans pro', sans serif;
		color:#fff;
		line-height: 40px;/*This has to be in px*/
		font-weight:600;
		width:20%;
		height:42px;
		list-style: none;
		text-align: center;
	}
	/*-----LINKS----------------------------------------------------------------------------*/
	
	#tabs li a{
		color:#fff;
		text-decoration:none;
		display:block;
	}
	
	#tabs li a:hover{
		
		
	}
	
	
	/*-----LINKS----------------------------------------------------------------------------*/
	.home{
		background-color: #0054a6;
	}
	.service{
		background-color: #0a85cc;
	}
	.client{
		background-color: #3a796f;
	}
	.about{
		background-color: #29534c;
	}
	.contact{
		background-color: #bd6d25;

	}

/*-----------------END TOP NAVIGATION-------------------------------------------*/	
	
		
	#placeholder{
		width:100%;
		height:40em;
		background-color:#728FA4;
		
	}
	
	
	
	
/*-----------New Footer--------------------------------------------------------------------*/
#bottomNav{
		position:relative;
		clear:left;
		padding-bottom:2em;
		
	}

.bottomNavButtons{
	position:relative;
}

	.homef{
		background-color: #0054a6;
		width:20%;
		float:left;
		text-align:center;
		padding:8px 0;
	}
	.servicef{
		background-color: #0a85cc;
		width:20%;
		float:left;
		text-align:center;
		padding:8px 0;
	}
	.clientf{
		background-color: #3a796f;
		width:20%;
		float:left;
		text-align:center;
		padding:8px 0;
	}
	.aboutf{
		background-color: #29534c;
		width:20%;
		float:left;
		text-align:center;
		padding:8px 0;
	}
	.contactf{
		background-color: #bd6d25;
		width:20%;
		float:left;
		text-align:center;
		padding:8px 0;

	}

	.homef, .servicef, .clientf, .aboutf, .contactf{
		color:#fff;
		font-size: 14px;
	}
	
	.homef a, .servicef a, .clientf a, .aboutf a, .contactf a{
		
		color:#fff;
		text-decoration:none;
	}
	
	
	
	
	
	
	
	.bottomNavText{
		text-align:center;
		padding-top:1em;
		font-size:0.9em;
	}
	
	.bottomNavText h1{
		font-size:1.5em;
		font-weight:300;
	}
	
	

}

.bottomNavIcons {
	display: inline-flex;
	width: 100%;
	justify-content: center;
}

.iconcontainer {
	display: inline-block;
	padding: 0 10px;
	margin-top: 2em	;
}
.socialicon i {
		color: darkgrey;
	font-size: 1.8em;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease ;
	-ms-transition: all .3s ease ;
	-o-transition: all .3s ease ;
	transition: all .3s ease ;

	}
.socialicon i:hover {
	color: ghostwhite ;
	font-size: 1.8em;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease ;
	-ms-transition: all .3s ease ;
	-o-transition: all .3s ease ;
	transition: all .3s ease ;

}






@media (max-width: 400px){
	
	
	body{
		width:100%;
		margin:0 auto;
		background-color:#0b2f5f;
		font-family:'source sans pro', sans serif;
		color:#fff;
	}
	
#bottomNav{
		position:relative;
		clear:left;
		padding-bottom:2em;
		
	}
	
}

/*----END 400-----------------------------------------------------------------------------------------*/