/*
********************
COMMON
*********************
*/
@font-face {
font-family: "Panton";
src: url("fonts/Panton-Regular.otf") format("opentype");
/*src: 
url("css/fonts/Harabara.woff") format("woff"),
url("css/fonts/Harabara.otf") format("opentype"),
url("css/fonts/Harabara.svg#filename") format("svg");*/
}

html{
	font-family: Panton;
	scroll-behavior:  smooth ;
}

a {
	color: #31708f;
}

.red-link {
	color: #fa1b1b;
	font-weight: bold;
	font-style: italic;
}

.err{
	border:solid 1px #ffaa00;
}

.container-fluid{
	font-family: Panton;
	background-color: white;
	padding: 0 10%;
}

.button{
	background-color: black;
    font-size: 10pt;
    padding: 2% 8%;
    margin: 1%;
    border-radius: 5px;
    color: white;
    letter-spacing: 2px;
    /* font-weight: bold;*/
}

.heading{
	color: black;
	font-size: 28px;
	font-weight: bold;
	letter-spacing: 1.5px;
}


.paragraph{
	font-size: 11pt;
    font-weight: lighter;
    color: #666;
    letter-spacing: 0px;
    word-spacing: 5px;
    line-height: 20px;
    text-align: justify;
}

.myimg{
	 border-radius: 3px;
	 box-shadow:0px 0px 5px 0px #d3d3d3e0;
	 padding: 1%;
}

.card{
	width: auto;
	height: auto;
	background-color: white;
	border-radius: 5px;
	box-shadow: 0 3px 35px #999;
	padding: 20px;
}

.link{
	color: #00b200;
	text-decoration: underline;
	font-weight: bold;
	letter-spacing: 1px;
}

.download-icon{
	max-width: 10px;
	display: inline;
	margin-left: 2%;
}

.social{
	width: 30px;
}


#footer{
	background-color: white;
	padding: 70px 70px 35px;

}


#footer img,a{
	display: inline
}

#footer a{
	color: #333;	
	font-size: 35pt;
	letter-spacing: 1px;
	min-width: 50px;
	text-overflow: ellipsis;

}


@media (max-width: 767px) {
	#footer #social{
		margin-left: 20%
	}
	#footerlogo{margin-left: 40%}

	#footer-2 .col-sm-12{
		text-align: center;
	}

}

#footer{
	padding: 5%;
}
 #foooter #klos{
	padding: 3% 6%;
}
#footer h2{
	color: black;
	font-size: 28px;
	letter-spacing: 2.5px;
	text-align: left;
}
#footer h3{
	color: gray;
    font-size: 12px;
    letter-spacing: 0.5px;
    margin-top: 9%;
    text-align: left;
}

#footer .col-sm-12{
	margin-top: 50px;
	text-align: center;
}

#footer span{
	font-size: 9px;
	font-weight: bold;
	letter-spacing: 1.5px;
	color: #999
}

#footer-2{
	background-color: #f1f1f1;
	padding: 1% 0;
	border-radius: 5px 5px 0 0;
}
#footer-2 h5{
	color: #9a9898;
    font-size: 11px;
    letter-spacing: 1.5px;
    text-align: center;
}

#footer-2 img{
	max-width: 25px;
}
#tac{
	max-width: 25px;
}

#footer-2 i{
	font-size: 25px;
}

#mail{
	font-size: 50%;
	color: black;
	text-align: center;
}

/*navbar*/

.navbar-inverse .navbar-brand:focus, .navbar-inverse .navbar-brand:hover {
    color: #333;
}

.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:hover{
	color: #25de25;
}

.navbar-inverse .navbar-toggle {
    background-color: #333;
    margin: 7% 0 0 0;
}

.navbar-header {
    padding: 0 2%;
    border: none;
    height: 70px;
}


#nav{
	border: none;
	background-color: white;
	padding: 1% 0;
}

#nav a{
	margin-right: 20px;
	font-weight: bold;
	font-size: 10pt;
	letter-spacing: 0.5px;
	font-style: normal;
	
}


.menu-options{
	margin-top: 3%;
}

.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:hover, .navbar-inverse .navbar-nav>.active>a:focus {
    color: #fff;
    background-color: #33c533;
    border-radius: 4px;
}



/* Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 767px) { 
	#menu a{
		padding-left: 8%
	}

	div#myNavbar {
		margin-top: 5%;
	}
}

/* Small devices (landscape phones, less than 768px)*/
@media (min-width: 768px) { 
	#menu{
		float: right;
		margin-top: 1.2%;
		margin-right: 10%
	}
	
	.navbar-nav>li>a {
	    padding-top: 5%;
	    padding-bottom: 5%;
	}


}

/* Medium devices (tablets, less than 992px)*/
@media (min-width: 991px) {  
}

/* Large devices (desktops, less than 1200px)*/
@media (min-width: 1199px) { 
	
}




/*
********************
HOME
*********************
*/
#jumbotron{
	margin: 2%; 
	margin-top: 15%
}

#jumbotron h1{
	margin-top: 0%;
}

#jumbotron img{
	margin-top: 0%;
}

@media (max-width: 1370px) and (min-width: 768px) { 
	#jumbotron{
		margin-top: 22%;
	}
}

@media (max-width: 767px) { 
	#jumbotron{
		margin-top: 30%;
	}

	#jumbotron img{
		margin-top: 10%;
	}

	#jumbotron h1{
		margin-top: 10%;
	}

}



#arrow1{
	margin-top: 84px;
    width: 40px;
}


#arrow2{
	margin-left: 43%;
    margin-top: 200%;
    opacity: .5;
}


#latest{
	margin-top: 5%;
}

#latest h2{
	text-align: center;
}

#view-all{
	text-align: center;
}

#subscribe *{
	margin: 10px 0;
}

#publications{
	padding:5% 10% 0;
}

#publications h4{
	color: #999;
	font-size: 10px;
	font-weight: bold;
	letter-spacing: 1.5px;
}

#publications p{
	font-size: 11pt;
	/*font-weight: lighter;*/
	color: #999;
	letter-spacing: 0px;
	word-spacing: 3px;
	line-height: 22px;
	text-align: left;
}

#publicaions h6{
	font-size: 9px;
	font-weight: bold;
	letter-spacing: 1.5px;
}

#publicaions .img-responsive{
	padding: 5px;
	width: 100px;
}

#publications .link{
	margin-top: 5px;
}

#location{
	/*background-color: black;*/
	text-align: center;
	padding: 2%;
}
#location{
	margin-top: 5%
}
#location p{
	text-align: center;
	margin: 5%;
	font-size: 95%;
}

#location img{
	margin-top: 15px;
}

#about-brief{
	text-align: center;
	padding: 75px;
}

#about-brief p{
	font-size: 12pt;
   /* font-weight: lighter;*/
    color: #999;
    line-height: 30px;
    text-align: left;

}

/* Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575px) { 
	#jumbotron .col-sm-5{
		padding: 30px;
    	text-align: center;
	}

	#publications img.img-responsive{
		max-width: 150px;
	} 

	#location .paragraph{
		margin: 0 10%;
	}

}

/* Small devices (landscape phones, less than 768px)*/
@media (max-width: 767px) { 	
	#publications img.img-responsive{
		max-width: 150px;
	} 
 }

/* Medium devices (tablets, less than 992px)*/
@media (max-width: 991px) {  }

/* Large devices (desktops, less than 1200px)*/
@media (max-width: 1199px) {  }





/*
********************
ABOUT US
*********************
*/

.row#about{
	margin: 5%; 
	margin-top: 10%
}

#who{
	text-align: center;
	margin: 50px 0;
}

#who h1{
	font-size: 3em;
	color: #333;
}
#who hr{
	width: 150px;
}

#who div#bg{
	padding: 5%;
}


#who p{
	color: white;
	padding: 0 10%;
}

#who b{
	font-size: 1.2em;
}

#team{
	text-align: center;
	margin: 50px 0;
}

#team h2{
	font-size: 3em;
	color: #333;
}

#team hr{
	width: 150px;
}

.avatar{
	border-radius: 8px;
    box-shadow: 0px 5px 23px 0px #d3d3d3ad;
    padding: 2px;
    text-align: center;
}

#team .avatar{
	max-height: 300px;
}
#team .name{
	font-size: 1.5em;
	font-weight: bold;
	letter-spacing: 1.5px;
	color: black;
}

#team .position {
	font-size: 90%;
	font-weight: bold;
	letter-spacing: 1.5px;
}

#team .bio{
	margin-top: 5%;
}
#team .row{
	padding: 5%;
}


#vision{
	text-align: center;
	margin: 50px 0;
	padding: 40px 0;
	background-color: black;
}

#vision h2{
	font-size: 3em;
	color: white;
}

#vision hr{
	width: 150px;
}

#vision p{
	color: white;
	text-align: center;
}

#mission{
	text-align: center;
	margin: 50px 0;
	padding: 40px 0;
}

#mission h2{
	font-size: 3em;
}

#mission hr{
	width: 150px;
}

#mission p{
	text-align: center;
	color: #333;
}

/* Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575px) { 
	#team img{
		max-width: 200px;
		margin-left: 20%;
	}

}

/* Small devices (landscape phones, less than 768px)*/
@media (max-width: 767px) { 	
	.row#about{
		margin-top: 25%
	}
 }



/*
********************
OUR SOLUTIONS
*********************
*/

#remote{
	text-align: center;
	margin: 50px 0;
}

#remote h1{
	font-size: 2em;
	color: #333;
}
#remote hr{
	width: 150px;
}


#kadmap{
	text-align: center;
	margin: 50px 0;
	
}

#kadmap h1{
	color: white
}

#kadmap p{
	color: #f2f2f2;
	text-align: center;
}



.features-section{
  color:black; 
  text-align: center;
  padding: 45px;
  background-color: white;
  overflow: hidden;
  font-weight: bolder;
}

.page-section{   
  color: #505050; 
  letter-spacing: 1px;  
  background-color: white;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  /*extras*/
  padding:5% 10%;
  font-size: 1.2em;
  line-height: 30px;
  margin: 0 1%;
  border-radius: 5px;
  border: 1px darkgray solid;
  border-top: none;
  border-bottom: none;
  /*flex*/
  display: flex;
  justify-content: center; 
  flex-direction: column; 
  flex-wrap: wrap;
}

.colored{
  background-color: #f7fbfd;
  color: #333;
}


.black-background{
	background-color: black;
}

.preview{
	border-radius: 10px;
	box-shadow: 0px 0px 30px 5px rgba(0, 0, 0, 0.05);
}

.features{
	text-align: left; 
	line-height: 30px;
	/*padding-left: 10%;*/
}

.features-left{
  text-align: left; 
  line-height: 30px;
  padding-left: 10%;
}

.features-section h2{
	font-weight: 600;
  letter-spacing: 3px;
  color: #505050;
}

.features .desc{
	color: #333;
	font-size: 1.025em;

}


.features-section h4{
	font-weight: bold;
}

.features-section p{
	color: #707070;
}


.preview-container ul.features-list-left{
	list-style: none;	
	color: #505050;
  text-align: left;
  padding-left: 0;
}

.preview-container ul.features-list-right{
  list-style: none; 
  color: #505050;
  text-align: right;
}


ul.features-list ul{
	list-style: square;
}

.caret-dropdown {
    max-width: 30px;
}


.headline.small{
  font-size: bold;
}

.menu {
  position: inherit;
  top:0;
  cursor: pointer;
  background-color: white;
  padding-bottom: 1%;
  z-index: 60;
  border-right: none;
  border-radius: 5px;
  box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.08);
  color: darkgray;
}

.menu-active{
  color: #1a73e8;
  font-weight: bolder;
  border-left: 3px #1a73e8 solid;
  padding-left: 5%;
}

.menu h3{
  font-size: 1.2em;
}

.menu h4{
  font-size: 0.9em;
  opacity: 0.7;
}

.menu h6{
  cursor: default;
  opacity: 0.5;
  font-weight: bolder;
  letter-spacing: 1px;
  margin-bottom: 5%;
}

.menu hr{
  margin: 10% 15%;
}

.menu-content{
  padding: 5px;
  background-color: white;
  /*border: 1px #c1c1c1 solid;
  border-bottom: none;
  border-top: none;
  border-radius: 5px;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.08);*/
  /*overflow: hidden;*/
}

.menu-content .title{
    color: black;
    font-size: 1.3em;
    letter-spacing: 2px;
    margin-top: 0;
    padding-top: 2%;
    font-weight: bold;
    text-align: center;
}

.collapse hr{
  margin: 2% 5%;
}

.fixed{
  position: fixed;
  top: 200px;
}

 .push-left{
    margin-left: 26%;
  }

.fixed-navbar{
  position: fixed;
  top: 0;
  background-color: #000000e8;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0);
  z-index: 50;
}

/* Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575px) { 
	#features h3{
		font-size: 1.3em;
	}

}

/* Small devices (landscape phones, less than 768px)*/
@media (max-width: 767px) { 	
	#remote{
		margin-top: 25%;
	}
 }




/*
********************
NEWSLETTER
*********************
*/
#newsmenu{
	margin-top: 5%;
	color: gray
}

#newsmenu a{
	font-size: 1.1em;
	color: #999;
	letter-spacing: 1px;
	margin:0;
	margin-top: 2%
}

#newsmenu a.active{
	color: black;
}

#highlights{
	margin-bottom: 10%;
}

#highlights h3{
	font-size: 1.5em;
	/*font-weight: lighter;*/
	margin: 0;
}

#highlights img{
	max-width: 250px;	
	border-radius: 5px;
}

.input-group-btn img{
	width: 25px;
	margin: 0 25%;
}

.input-group-btn{
    background-color: #ffffff;
    width: 50px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border: #bbbbbbd1 solid 1px;
}

#latest h2{
	font-size: 3em;
	 margin: 25px 0;
}


#latest .input-group{
	margin-top: 15px;
}

#latest hr{
	margin: 2% 14% 5% 2%;
}

#latest .link{
	color: #333;
	size: 2em;

}

#blog-item{
	margin-left: 10%;	
}

#blog-item b{
	color: #00b200
}

#news-sub{
	text-align: center; 
	padding: 2% 0;
}

@media (max-width: 767px){
	#highlights{
		margin-top: 10%;
	}
}




/*
********************
		BLOG
*********************
*/
#blog-top{
	padding: 5% 7%
}

#blog-head {
	margin: 5% 5%;

}

#blog-head h1{
	font-size: 4em;
	letter-spacing: 5px;
	color: #333;

}


#blog-head img{
	border-radius: 2px;
}

#blog-head span{
	font-size: 8pt;
	color: grey;
}

#blog-head h2{
	margin-top: 10px;
	font-size: 1.5em;
}

#blog-head h5{
	font-weight: bold;
	color: #707070;
	margin: 3% 0 ;
	font-size: 0.9em;
}

#blog-content{
	margin: 0 5% 5%
}

#blog-content div#share{
	padding: 5%;
}

#share img{
	width: 50px;
	padding: 20% 0;
}

#blog-content .paragraph{
	color: #707070;
    letter-spacing: 1.2px;
    font-weight: 600;
    text-align: justify;
    line-height: 45px;
    word-spacing: 3px;
}

#blog-content img{
	margin: 10% 20% ;
}

#blog-content h1,h2,h3,h4{
	color: black;
}


#blog-comment{
	margin: 5% 25%;
	margin-bottom: 20%;
}

#blog-comment button{
	letter-spacing: 5px;
	width: 200px;
}

/* Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575px) { 
	#blog-head{
		text-align: center;
	}
	#blog-head h1{
		font-size: 3em;
	}
	#blog-head img#author{
		width: 150px;
	}

	#blog-content .paragraph{
		line-height: 25px;
	    word-spacing: 2px;
	    letter-spacing: 1px;
	}

	#blog-comment{
		margin: 15% 5%;
	}

}

/* Small devices (landscape phones, less than 768px)*/
@media (max-width: 767px) { 	
	#blog-top{
		padding-top: 20%
	}
 }


/*
********************
PUBLICATIONS
*********************
*/
#pubtab{
	text-align:center; 
	margin-top: 2%
}

.nav-tabs{
	width: 210px;
    text-align: center;
    margin-top: 10%;
    margin-left: 11%;
}
.nav-tabs .nav-link{
	min-width: 100px;
}
.nav-tabs .active{
	background-color: #333;
	color: white;
}

#pubmenu a{
	font-size: 1.1em;
	color: #999;
	letter-spacing: 1px;
	margin:0;
	margin-bottom: 10%;
}


#pubmenu a.active{
	color: black;
}

#archive {
	/*padding: 0 10%;*/
	margin-bottom: 10%;
}

#archive img{
	max-width: 100px
}

#archive tr{
	padding: 50px 1%;
}

div.pub-item #line{
	height: 100px;
    width: 85px;
    border-right: 2px solid grey;
    margin-top: 10px;
}

#pubmenu .link{
	color: #333;
	size: 2em;
}

@media (max-width: 767px) { 	
	.nav-tabs{
	margin-top: 15%;
	margin-left: 20%;
	}

	#pubtab{
		 margin-top: 20%
	}
}

/*
********************
ABOUT PUBLICATION
*********************
*/

.whitepaper-icons{
	text-align: center;
}

.whitepaper-icons .icon{
	padding: 2%;
}

.whitepaper-icons img{
	max-height: 100px;
}


/*
********************
PUB
*********************
*/

#pubtop{
	margin-top: 10%
}

#reviewers{
	margin: 5% 0 15%;
}

#reviewers h3{
	font-size: 1.5em;
	color: #333
}

#reviewers .padd{
	padding: 2% 5%;
}

#reviewer{
	box-shadow:0px 0px 5px 0px #d3d3d3e0;
	padding: 3%;
}

#reviewer img{
	display: inline;
	
}

#reviewer h4{
	margin-top: 18% !important;
	font-size: 1.2em !important;
}

#reviewer a{
	font-size: 12pt;
}


@media (max-width: 747px){
	#pubtop{
		margin-top: 25%
	}
}



/*
********************
	CONTACT US
*********************
*/


#contact-heading{
	margin: 10%;
	margin-bottom: 0;
	text-align: center;
}
#contact-form{
	margin: 10%;
	margin-top: 0;
}


/*
********************
	CAREERS
*********************
*/

#career-jumbotron{
	margin-top: 10%;
	padding: 5%;
	background-color: #99999915;
	border-radius: 5px;
}

@media (max-width: 768px){
	#career-jumbotron{
		margin-top: 30%;
	}

}

#career-benefits {
	margin: 5% 0;
}

#career-benefits h2{
	text-align: center;
}

#open-positions{
	margin: 5% 15%;
	text-align: center;
}

#open-positions h2{
	margin-bottom:5%;
}

@media (max-width: 768px){
	#open-positions h2{
		margin-bottom:10%;
	}
	#career-jumbotron img{
		margin-top: 5%;
	}
}


.open-position .category {
    text-align: right;
    color: #555;
}

@media (max-width: 768px){
	.open-position .category {
    	text-align: left;
	}
}

.open-position .role {
    text-align: left;
    color: #555;
}

#career-waver{
	margin: 5% ;
}

/*
********************
	JOBS
*********************
*/

#job-header{
	margin-top: 15%;
}

@media (max-width: 768px){
	#job-header{
		margin-top: 30%;
	}

}

#job-description{
	margin: 5% 0;
}

#job-form{
	margin: 5% 25%;
	margin-left: 0;
	padding:2%;
	border: 1px solid #99999950;
	border-radius: 5px;
	min-height: 200px
}
@media (max-width: 768px){
	#job-form{
		margin: 5% 0;
	}
}

#job-form .heading{
	font-size: 1.5em
}



/*
********************
	TERMS AN PRIVACY
*********************
*/

.terms-tab{
	min-width: 300px;
	margin-top: 15%;
}


/*
********************
	EVENTS
*********************
*/
#events-jumbotron{
	margin-top: 10%;
	padding: 5%;
	padding-bottom: 0;
	border-radius: 5px;
	text-align: center
}

@media (max-width: 768px){
	#events-jumbotron{
		margin-top: 30%;
	}

}


/*
********************
	EVENT
*********************
*/

#event-header{
	margin-top: 15%;
}

@media (max-width: 768px){
	#event-header{
		margin-top: 30%;
	}

}

#event-description{
	margin: 2% 0;
}

#event-form{
	margin: 5% 25%;
	margin-left: 0;
	padding:2%;
	border: 1px solid #99999950;
	border-radius: 5px;
	min-height: 200px
}
@media (max-width: 768px){
	#event-form{
		margin: 5% 0;
	}
}

#event-form .heading{
	font-size: 1.5em
}


/*my styles*/
/***quick report****/
.Green{background-color: #99cc33;}
.Blue{background-color: #3533cc;}
.Purple{background-color: #9133cc;}
.Cyan{background-color: #33c5cc;}
.Yellow{background-color: #ccb233;}
.Red{background-color: #cc335d;}
.MutedGreen{background-color: #33cc8c;}
.KESGreen{background-color: #33c533;}
.LightGray{background-color: lightgray;}
.DarkGray{background-color: #47474c;}
.Black{background-color: #222225;}
.KadmapBlue{background-color: #318df8;}

.GreenText{color: #99cc33;}
.BlueText{color: #3533cc;}
.PurpleText{color: #9133cc;}
.CyanText{color: #33c5cc;}
.YellowText{color: #ccb233;}
.RedText{color: #cc335d;}
.MutedGreenText{color: #249c6a;}
.LightGrayText{color: lightgray;}
.GrayText{color: #47474c;}
.BlackText{color: #222225;}
.WhiteText{color: #ffffff;}
.KadmapBlueText{color: #318df8;}

.mypanel{
  min-height: 100px;
  margin: 0 10% 3%;
  padding: 2% 5%;
}

.mypanel h5{
  text-align: center;
}

.mypanel-data{
  background-color: #f2f2f280;
  border-radius: 3px;
  padding: 3%;
  margin: 2%;  
  width: auto;
}

.mypanel-data .sub-data{
  border:1px solid #f2f2f2;
  border-radius: 3px;
  padding: 2%;
  margin: 2% 4%;
  width: auto;
  background-color: #ffffff60;
}

.mypanel-data .data{
  border:1px solid #f2f2f2;
  border-radius: 3px;
  padding: 2%;
  width: auto;
  background-color: #ffffff60;
}

.mypanel-data i{
  margin-left:   1%;
}

.mypanel-data b{
  margin-right:   10%;
}

.mypanel-data .bigger-text{
  font-size:   110%;
}

.LetterSpaced{ letter-spacing: 1px; }
.highlighted {
  box-shadow: 0px 0px 2px -1px #233445;
  border: 1px solid gray;
}

.highlighted-danger {
  box-shadow: 0px 0px 2px -1px #233445;
  border: 1px solid #cc335d;
}

.highlighted-success {
  box-shadow: 0px 0px 2px -1px #233445;
  border: 1px solid #249c6a;
}


.MyPill {
    width: auto;
    padding: 1.5%;
    border-radius: 5px;
    font-weight: bold;
    border: 1px solid #808080c9;
}

.small-button{
  padding: 2% 5%;
  font-size: 90%;
  border-radius: 2px;
}

.smaller-text{
  font-size: 90%;
}

.small-bold{
  margin-top: 0.5%;
  font-weight:bold;
  font-size: 8.5pt;
  color: #929292;
}

.italic{
 font-style: italic;
}

.bold{
 font-weight: bold;
}

.center{
	text-align: center;
	vertical-align: center;
}