@font-face {
	font-family: "bahn";
	src: url("../font/bahnschrift.ttf");
}

body ,html { 
	height:100%;
	margin:0;
	background:#fff;
	font-family: "Varela Round", sans-serif, "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif !important;
	color:#585a5c;
}

a {
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.flex-box {
	width:100%;
	padding:0px 10px;
	display:flex;
	flex-flow: row wrap;
}


.anchor {
	top:-57px;
	display:block; 
	position:relative;  
	visibility: hidden;
}

.delight-olen {
	color:#dc4e4e;
}

.delight-blue {
	color:#3b83a4;
}

.delight-grey{
	color:#585a5c;
}

/*navbar height control*/
@media only screen and (max-width: 992px) {
	.navbar-collapse.collapse.show {
		min-height: 100vh !important;
		
	}
	
	.navbar-nav {
		min-height: 100vh !important;
	}
	
	/*div height 100vh inner scrolling when content over 100vh*/
	.mycollapse {
		padding: 1rem 0px;
		/*height 100vh minus 50px*/
		height: calc(100vh - 80px) !important;
	}
	
	.mycollapse-overflow {
		overflow-y: scroll !important;
	}
}

/*mobile navbar color*/
@media only screen and (max-width: 992px) {
	.navbar{
		background:rgba(255,255,255,1) !important;
	}
	
	.navbar-white {
		background:rgba(255,255,255,1) !important;
	}
	
	.navbar .nav-item {
		font-size: 1.1rem;
	}
}

.navbar{
	-webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}


/* adds some margin below the link sets  */
.navbar .dropdown-menu div[class*="col"] {
   margin-bottom:1rem;
}

/* breakpoint and up - mega dropdown styles */
@media screen and (min-width: 992px) {
	
	 /* remove the padding from the navbar so the dropdown hover state is not broken */
	.navbar {
		padding-top:0px;
		padding-bottom:0px;
	}

	/* remove the padding from the nav-item and add some margin to give some breathing room on click */
	.navbar .nav-item {
		padding:0.5rem 0.1rem;
		margin:0 0.1rem;
	}
	
	  /* shows the dropdown menu on click */
	.navbar .dropdown:active .dropdown-menu, .navbar .dropdown .dropdown-menu:active {
		display:block!important;
	}
	
	.dropdown-content .nav-item {
		font-size: 80% !important;
	}
}

.navbar .dropdown-menu {
	border: 1px solid #ccc;
	margin: auto;
	background:rgba(255,255,255,1) !important;
	font-size: 100% !important;
}

.navbar .nav-item a{
	color: rgba(102, 102, 102, 0.8) !important;
}
	
.navbar .nav-item a:hover{
	color: rgba(220, 78, 78,0.9) !important; 
}

.dropdown-item:hover {
	background:#f5f5f5 ;
}

/*section*/
.delight-section {
	position: relative;
	height:100%;
	padding-top: 6.125rem;
	padding-bottom: 4.125rem;
	background:url("../images/bg.jpg") no-repeat #fff;
    background-position: bottom bottom;
	background-size:cover;
}

.about-section {
	height:auto;
	padding-top: 4.125rem;
	padding-bottom: 4.125rem;
	background:url("../images/bg_about.jpg") no-repeat #fff;
    background-position: center center;
	background-size:cover;
}

.why-section {
	height:auto;
	padding: 0px;
	background:url("../images/bg_why.jpg") no-repeat #1a1a1a;
    background-position: left center;
	background-size:cover;
}

.team-section {
	height:auto;
	padding-top: 4.125rem;
	padding-bottom: 4.125rem;
	background:url("../images/bg_team.jpg") no-repeat #fff;
    background-position: center center;
	background-size:cover;
}

.service-section {
	height:auto;
	padding-top: 4.125rem;
	padding-bottom: 4.125rem;
	background:#090e22;
}

.service2-section {
	height:auto;
	padding: 0px;
	background:url("../images/bg_service.jpg") no-repeat #fff;
    background-position: left top;
	background-size:cover;
}

.join-section {
	height:auto;
	padding: 0px;
	background:url("../images/bg_join.jpg") no-repeat #000;
    background-position: center center;
	background-size:cover;
}

.contact-section {
	height:auto;
	padding-top: 4.125rem;
	padding-bottom: 4.125rem;
	background:#fff;
}

.footer-section {
	height:auto;
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
	background:#090e22;
	color:#bbbdbf;
}

@media only screen and (max-width: 768px) {
	.delight-section {
		background:url("../images/bg_t.jpg") no-repeat #fff;
		background-position: left center;
		background-size:cover;
	}
	
	.about-section {
		background-position: top left;
	}
	
	.join-section {
		background-position: top center;
	}
}

@media only screen and (max-width: 576px) {
	.delight-section {
		background:url("../images/bg_m.jpg") no-repeat #fff;
		background-position: center bottom;
		background-size:cover;
	}
}

/*content*/
.delight-wrap {
	font-family: "bahn";
}
.delight-wrap h1{
	font-size: 4rem;
	color:#fff;
	margin:0;
}

.delight-wrap h2{
	font-size: 3rem !important;
	color:#dc4e4e;
	text-transform: capitalize;
}

.delight-wrap h3{
	font-size: 2rem;
	color:#fff;
	margin:0;
}

.delight-wrap h6{
	color:#585a5c;
	font-size: 1.3rem;
	margin-bottom:20px;
}

.delight-wrap p{
	font-size: 1.1rem;
	color:#585a5c;
	text-align: left;
}
.delight-wrap ul li{
	font-size: 1.1rem;
}

.white-wrap {
	background:url("../images/bg_wrap.jpg") no-repeat #fff;
    background-position: 0px 0px;
	background-size:cover;
	box-shadow:5px 5px 10px rgba(0,0,0,0.5);
	border-radius: 12px;
	padding: 40px 30px;
}

.white-wrap h6{
	color:#585a5c;
	font-weight:bold;
	font-size: 1.8rem;
	margin-bottom:20px;
}

.white-wrap ul{
	padding-left:15px;
}

.white-wrap ul li{
	font-size: 0.9rem;
	color:#929497;
	margin-bottom:20px;
}

.black-wrap {
	height: 100%;
	background:url("../images/bg_bwrap.jpg") no-repeat #090e22;
    background-position: 0px 0px;
	background-size:cover;
	box-shadow:5px 5px 10px rgba(0,0,0,1);
	border-radius: 12px;
	padding: 40px 30px;
	text-align:left;
}

.black-wrap h6{
	color:#e6e7e8;
	font-weight:bold;
	font-size: 1.8rem;
	margin-bottom:20px;
}

.black-wrap ul{
	padding-left:15px;
}

.black-wrap ul li{
	font-size: 0.9rem;
	color:#bbbdbf;
	margin-bottom:20px;
}

.gray-wrap {
	color:#e6e7e8;
	background: #090e22;
	padding: 50px 90px;
}

.lightgray-wrap {
	color:#808184;
	background: #f9fafb;
	padding: 50px 90px;
}

.lightgray-wrap h6{
	color:#585a5c !important;
	font-weight:bold;
	font-size: 1.8rem;
}

.black-wrap2 {
	padding: 4.125rem ;
	background: #090e22;
}

.black-wrap2 h6{
	color:#e6e7e8;
	font-weight:bold;
	font-size: 1.8rem;
	margin-bottom:20px;
}

.black-wrap2 ul{
	padding-left:15px;
}

.black-wrap2 ul li{
	font-size: 0.9rem;
	color:#bbbdbf;
	margin-bottom:20px;
}

.welcome{
	padding: 4.125rem 4rem;
}

.welcome h6 {
	color:#e6e7e8;
	font-weight:bold;
	font-size: 1.8rem;
}

.welcome p {
	color:#bbbdbf;
	margin-bottom: 0.25rem;
}

.description {
	border: 0px solid #999;
	border-radius: 5px;
	margin: 25px 0;
	display: table;
}

.description .dss-number {
	width:110px;
	display: table-cell;
	vertical-align: top;
	font-size: 5rem !important;
	color:#dc4e4e;
	font-family: "bahn";
	line-height: 70px;
}

.description .info {
	display: table-cell;
	vertical-align: top;
}

.info {
	display: inline-block;
}

.info h6 {
	color:#e6e7e8;
	font-weight:bold;
	font-size: 1.8rem;
	margin-bottom:0.3rem;
}

.info p {
	color:#929497;
}

@media (max-width: 768px) {
	.delight-wrap h1{
		font-size: 2.5rem;
		color:#fff;
		margin:0;
		font-weight: bold;
	}

	.delight-wrap h2{
		font-size: 2.2rem !important;
		color:#fff;
		text-transform: capitalize;
	}

	.delight-wrap h3{
		font-size: 1.5rem;
		color:#fff;
		margin:0;
	}
	
	.delight-wrap p, .delight-wrap ul li{
		font-size: 0.9rem !important;
	}
	
	.white-wrap h6, .info h6, .delight-wrap h6, .black-wrap h6, .gray-wrap h6{
		font-size: 1.5rem;
	}
	
	.description {
		border: 0px solid #999;
		border-radius: 5px;
		margin: 25px 0;
		display: table;
	}
	
	.description .dss-number {
		width:90px;
		font-size: 4rem !important;
		line-height: 60px;
	}
	
	.white-wrap {
		padding: 30px 20px;
	}
	
	.white-wrap div[class*="col"] {
		border:none !important;
		border-bottom: 1px solid #dee2e6 !important;
	}
	
	.white-wrap div[class*="col"]:last-child {
		border:none !important;
	}
	
	.black-wrap2 {
		padding: 50px 20px;
		background: #000;
	}
	
	.black-wrap2 div[class*="col"] {
		border:none !important;
		border-bottom: 1px solid #dee2e6 !important;
	}
	
	.black-wrap2 div[class*="col"]:last-child {
		border:none !important;
	}

	.gray-wrap {
		padding: 50px 20px;
	}
	
	.lightgray-wrap {
		padding: 50px 20px;
	}
	
	.welcome {
		padding: 50px 20px;
	}
}



/*button*/
.form-btn {
	width:320px;
	color: rgba(255, 255, 255,1) !important; 
	padding:12px 30px;
	border:1px solid rgba(255, 255, 255,1);
	border-radius: 5px;
	background: rgba(0, 0, 0, 0.2) !important; 
	font-size: 1.2rem !important;
}

.form-btn:hover {
	color:#fff !important; 
	border:1px solid #fff !important;
	background: rgba(220, 78, 78,0.9) !important; 
}

.form-btn:focus {
	background: transparent;
	outline: 0!important;
	box-shadow: 0 0 0 0.2rem rgba(102, 102, 102,0.2) !important;
}

@media (max-width: 768px) {
	.contact-section .form-btn{
		width: 100%;
	}
}