/* Nav bar
===============================================================*/

.navbar-default {
	background-color:white;
	
}
li{
	padding:0px 15px;
	color:black;
}
.h{
	color:black;
	font-size:15.7px;
	font-weight:bold;
}

/*  top_header  
===============================================================*/

.top_icon{
	color:white;
	font-size:20px;
}
.top_content{
	text-decoration:none;
	color:white;
}
.top_content:hover{
	text-decoration:none;
	color:white;
}
.top_social_icon{
	width:40px;
	font-size:20px;
	color:white;
	text-decoration:none;
	padding:10px;
	text-align:center;
}
.top_social_icon:hover{
	background-color:white;
}
  
/* Effect 17: move up fade out, push border
============================================================== */

.cl-effect-17 a {
	color: black;
	text-shadow: none;
	padding: 10px 0;
}

.cl-effect-17 a::before {
	color: #fff;
	text-shadow: 0 0 1px rgba(255,255,255,0.3);
	content: attr(data-hover);
	position: absolute;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	pointer-events: none;
}

.cl-effect-17 a::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 3px;
	background:#47ddee;
	opacity: 0;
	-webkit-transform: translateY(5px);
	-moz-transform: translateY(5px);
	transform: translateY(5px);
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	pointer-events: none;
}

.cl-effect-17 a:hover::before,
.cl-effect-17 a:focus::before {
	opacity: 0;
	-webkit-transform: translateY(-2px);
	-moz-transform: translateY(-2px);
	transform: translateY(-2px);
}

.cl-effect-17 a:hover::after,
.cl-effect-17 a:focus::after {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}

/*flip card in services
===============================================================*/

.flip-card {
  background-color: transparent;
  width:100%;
  height:280px;
  perspective: 1000px;
  padding:15px 0px;
}

.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.6s;
  transform-style: preserve-3d;
  box-shadow: 0px 0px 3px lightgrey;
}

.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}

.flip-card-front {
  border:1px solid white;
  background-color:white;
  color: grey;
  padding:20px;
}

.flip-card-back {
  background-color:#419A9C;
  color:black;
  opacity:0.9;
  padding:75px;
  transform: rotateY(180deg);
  border-radius:6px;
}

/*flip card in characteristics
================================================================*/
.flip-card_1 {
  background-color: transparent;
  width:100%;
  height:280px;
  perspective: 1000px;
  padding:15px 0px;
}

.flip-card-inner_1 {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.6s;
  transform-style: preserve-3d;
  box-shadow: 0px 0px 3px lightgrey;
}

.flip-card_1:hover .flip-card-inner_1 {
  transform: rotateY(180deg);
}

.flip-card-front_1, .flip-card-back_1 {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}

.flip-card-front_1 {
  border:1px solid white;
  background-color:white;
  color:black;
  padding:50px;
}

.flip-card-back_1 {
  background-color: #ffc300;
  color:black;
  padding:50px;
  transform: rotateY(180deg);
}

/* Button Styles
===============================================================*/

/* General button style (reset) */
.btn {
	border: none;
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	background: none;
	cursor: pointer;
	display: inline-block;
	margin: 15px 30px;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
	outline: none;
	position: relative;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.btn:after {
	content: '';
	position: absolute;
	z-index: -1;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
/* Button 1 */
.btn-1 {
	border: 1px solid lightgrey;
	color: white;
}
/* Button 1e */
.btn-1e {
	overflow: hidden;
}

.btn-1e:after {
	width: 100%;
	height: 0;
	top: 50%;
	left: 50%;
	background:#47ddee;
	opacity: 0;
	-webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
	-moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
	-ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
	transform: translateX(-50%) translateY(-50%) rotate(45deg);
}

.btn-1e:hover,
.btn-1e:active {
	color: white;
}

.btn-1e:hover:after {
	height: 260%;
	opacity: 1;
}

.btn-1e:active:after {
	height: 400%;
	opacity: 1;
}


/* mission & vision
================================================================*/
/*
	.t{
	height:580px;
	border:2px solid transparent;
	}
	.abt_icon{
	padding:19% 0 20% 30%;
	}
	
	.fa-rocket{
	font-size:90px;
	color:#47ddee;
	border:2px dashed lightgrey;
	background-color:white;
	padding:18px 21px;
	border-radius:100%;
	}
	.fa-eye{
	font-size:90px;
	color:#47ddee;
	border:2px dashed lightgrey;
	background-color:white;
	padding:18px 21px;
	border-radius:100%;
	}
	.fa-diamond{
	font-size:90px;
	color:#47ddee;
	border:2px dashed lightgrey;
	background-color:white;
	padding:18px 18px;
	border-radius:100%;
	}
*/
/* mission & vision
================================================================*/
	
	.fa-rocket{
	font-size:50px;
	color:#ffc300;
	border:2px solid transparent;
	background-color:white;
	padding:18px 21px;
	border-radius:100%;
	}
	.fa-eye{
	font-size:50px;
	color:#ffc300;
	border:2px solid transparent;
	background-color:white;
	padding:18px 21px;
	border-radius:100%;
	}
	.fa-diamond{
	font-size:50px;
	color:#ffc300;
	border:2px solid transparent;
	background-color:white;
	padding:18px 18px;
	border-radius:100%;
	}
	
.background_image{
	background-image: url('../NDC/images/house.jpeg'); 
	background-attachment:fixed;
	background-size:cover;
}
/* Sroll to top
===============================================================*/

#scroll_top {
	display: none;
	position: fixed;
	font-size:36px;
	bottom: 10px;
	right: 10px;
	z-index: 99;
	color:#47ddee;
	cursor: pointer;
}
#scroll_top:hover {
	color:grey;
}

/*carousel slider*/
.image-content{
	position: relative;
}



/*--Image Carosuel
================================================================*/
@media (min-width: 1200px) {
.im{	
	width:100%;
	height:450px;
}		
}
@media (min-width: 992px) and (max-width: 1199px) {
.im{	
	width:100%;
	height:650px;
}	
}
@media (max-width:767px){
.im{
	width:100%;
	height:250px;
}
}

@media (max-width:767px){
.imc1{
	font-size:20px;
}
}

@media (min-width: 1200px) {
.imc2{	
	font-size:15px;
	line-height:30px;
	margin-left:90px;
}		
}
@media (min-width: 1200px) {
.imc3{	
	font-size:17px;
	line-height:30px;
	margin-left:30px;
}		
}
@media (min-width: 992px) and (max-width: 1199px) {
.imc2{	
	font-size:25px;
	line-height:30px;
}	
}
@media (max-width:767px){
.imc2{
	font-size:15px;
	line-height:0px;
}
}

@media (min-width: 1200px) {
.centered-text1{
	position: absolute;
	top:10%;
	left:63%;
	padding:20px;
}
}

@media (min-width: 1200px) {
.centered-text2{
	position: absolute;
	top:20%;
	left:1%;
	padding:20px;
}
}

@media (min-width: 1200px) {
.centered-text3{
	position: absolute;
	top:60%;
	left:5%;
	padding:20px;
}
}
@media (max-width:767px){
.centered-text1{
	position: absolute;
	top:1%;
	left:55%;
	padding:10px;
}
}
@media (max-width:767px){
.centered-text2{
	position: absolute;
	top:60%;
	left:8%;
	padding:10px;
}
}


/*map
===============================================================*/

@media (min-width: 1200px) {
.map{
	width:100%;
	height:500px;
}
}

@media (max-width:767px){
.map{
	width:100%;
	height:250px;
}
}

/*logo
===============================================================*/
@media (min-width: 1200px) {
.n{
	width:120%;
	margin-top:8px;
	
}
}

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





@media (max-width:767px){
.heading{
	font-size:25px;	
}
}
/* index portfolio*/
.c1 {
  position: relative;
  width: 100%;
}
.image {
  opacity: 1;
  display: block;
  width: 100%;
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;
}

.middle {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.c1:hover .image {
  opacity: 0.3;
}

.c1:hover .middle {
  opacity: 1;
}

.text {
  background-color: #1E0C49;
  color: white;
  font-size: 13px;
  padding: 10px 40px 10px 40px;
}

/*social media icons*/
.s {
  padding: 15px 25px 15px 15px;
  font-size: 18px;
  width:25px;
  text-align: center;
  text-decoration:none;
  margin: 2px 4px;
  border-radius: 50%;
}

.fa:hover {
    opacity: 0.9;
	text-decoration:none;
}

.fa-facebook {
  background: #3B5998;
  color: white;
 
}

.fa-twitter {
  background: #55ACEE;
  color: white;
    
}

.fa-google {
  background: #dd4b39;
  color: white;
}

.fa-linkedin {
  background: #007bb5;
  color: white;
}

.fa-youtube {
  background: #bb0000;
  color: white;
}