/** v1 -	default layout for site	
*/

/*88888888888888888888888888888888888*/
.body-wrap {/*want 1440 @see media below*/
	position: relative;
	padding: 0;
	margin: 0 auto;
	
	font-family:'SVN-Gilroy Light', 'Montserrat', 'Roboto';
	font-weight: normal;	
	
}
	.topnav-wrap {/*1120px;*/
		position: relative;
		width: 80.77%;
		height: 112px;
		padding: 0;
		margin: 0 auto;
 		background-color: #18232f;

	}
		.topnav {
			position: absolute;
			width: 100%;
			bottom: 20px;
			height: 64px;
			padding: 0;
			margin: 0 auto;
			background-color: #18232f;/*#131b2c;*/
	
		}
		.topnav .container-fluid{
			padding-left: 0;	
		}
		
		.navbar {
			padding-top: 0;
		}
			.navbar-nav {
				padding-left: 0rem;
			}
				.nav-item .nav-link {
					padding-left: 0;
					padding-right: 0;
					padding-top: 0.8rem;
					padding-bottom: 0.2rem;
				}
				.nav-link.active span {
					border-bottom: 1px solid #68aaa5;
				}
		
		a.nav-link {
			font-size: 15px;	
		}
		a.nav-link span{
			padding-bottom: 2px;
		}
		
		a.nav-logo {
			padding-top: 0;
			padding-left: 0;
		}
		
		#navbarMobileContent {
		 	background-color: #18232f;
			z-index: 4;
		}

	.pagebanner-wrap {
		position: relative;
		height: 252px;
		padding: 0;
		margin: 0 auto;
		overflow: hidden;
		background-repeat: no-repeat;
	}
		.pagebanner-wrap img {
			width: 100%;
			height: 100%;
			object-fit: fill;
		}
		
	.page-wrap {/*1120px;*/
		width: 77.8%;
		padding: 0;
		margin: 0 auto;
	}

.footer-wrap {/*1440*/
	position: relative;
	padding: 0;
	margin: 0 auto;

	font-family:'SVN-Gilroy Light', 'Montserrat', 'Roboto';
	font-weight: normal;	

 	border-top: 2px solid #68aaa5; 
/*  	border-bottom: 2px solid #68aaa5; */
 }
	.footer {/*1120*/
		width: 77.8%;
		padding: 0;
		margin: 0 auto;
	}
		.footer .container{
			padding-left: 0;
		}



a#goTop {
	position: fixed;
	bottom:74px;
	right: 108px;
	z-index: 1000;
}
a.contactbtn span{
	padding: 4px 12px 4px 12px; 
	border-radius: 8px; 
	color:#fff;
	background-color:#68AAA5;	
}
a.contactbtn:hover span{
	padding: 4px 12px 4px 12px; 
	border: 1px solid #68AAA5;
	border-radius: 8px; 
	color:#fff;
	background-color: transparent !important;
}

.blog-card {
	position: relative;
	width: 352px;
/* 	height: 384px; */
	padding: 0;
	margin-right: 12px;
	margin-bottom: 12px;
	border: 2px solid #68aaa5;
	border-radius: 10px;
 	overflow: hidden;
}
	.blog-card .card-text {
		margin-top: 4px;
		font-size: 0.8rem;
		color : #aaa;
	}
	.blog-card .card-text span{
		margin-right: 8px;
	}
	.blog-card-thumbnail {
		width: 348px;
		height: 254px;
		margin-bottom: 4px;
	}
		.blog-card-thumbnail img{
			width: 100%;
			height: 100%;
		}

	.blog-card-body {
		position: relative;
		width: 287px;
		margin: 0 auto;
	}
		.blog-card-body .meta{
			font-size: 0.9rem;
			font-weight: 600;
		}
		.blog-card-body .heading {
			margin-bottom: 8px;
		}
		.blog-card-body .heading a {
			color: #fff;
			font-size: 1rem;
			font-weight: 600;
		}

	.blog-card-footer {
		width: 287px;
		height: 30px;
		margin: 0 auto;
	}

.course-card {
	position: relative;
	width: 352px;
	height: 384px;
	padding: 0;
	margin-right: 12px;
	margin-bottom: 20px;
	border: 2px solid #68aaa5;
	border-radius: 10px;
	overflow: hidden;
	cursor: pointer;
}
	.course-card .moreBtn{
		position: absolute;
		right: 8px;
		bottom: 8px;
		background-image: url('/images/Vector.png');
		background-repeat: no-repeat;
		width: 30px;
		height: 30px;
	}
		.course-card .moreBtn img{
			padding: 10px 0 8px 8px;
			transition: all ease 0.3s;
		}
		.course-card .moreBtn:hover img{
			transform: rotate( -45deg );
		}

	.course-card-thumbnail {
		width: 352px;
		height: 254px;
		margin-bottom: 16px;
	}
		.course-card-thumbnail img{
			width: 100%;
			height: 100%;
		}
		
	.course-card-body {
		position: relative;
		width: 287px;
		height: 48px;
		margin: 0 auto;
	}
		.course-heading {
		}
		.course-description {
		}
	
	.course-card-footer {
		width: 287px;
		height: 30px;
		margin: 0 auto;
	}


.bordered {
	border: 1px solid #aaa;
}


/** layout media query
*/
@media(min-width: 1440px){
	.body-wrap {
		width: 1440px;
	}	
	.footer-wrap {
		width: 1440px;
	}	
}
@media(min-width: 1360px) and (max-width: 1439px){
	.body-wrap {
		width: 1360px;
	}	
	.footer-wrap {
		width: 1360px;
	}	
}
@media(min-width: 1280px) and (max-width: 1359px){
	.body-wrap {
		width: 1280px;
	}	
	.topnav-wrap {
		width: 88%;
	}
	.footer-wrap {
		width: 1280px;
	}	
}
@media(min-width: 1152px) and (max-width: 1279px){
	.body-wrap {
		width: 1152px;
	}	
	.topnav-wrap {
		width: 94%;
	}
	.footer-wrap {
		width: 1152px;
	}	
}
@media(min-width: 1024px) and (max-width: 1151px){
	.body-wrap {
		width: 1024px;
	}	
	.topnav-wrap {
		width: 95%;
	}
	.footer-wrap {
		width: 1024px;
	}
	a.nav-link {
		font-size: 12px;
	}
}
/* mobile	*/
@media(min-width: 768px) and (max-width: 1023px){
	.body-wrap {
		width: 768px;
	}
	.navbar-nav {
		padding-left: 2rem;
	}
	.topnav-wrap {
		width: 98%;
	}
	.footer-wrap {
		width: 768px;
	}
	.navbar-nav {
		position: relative;
		z-index: 2;
		background-color: #18232f;
	}
}
@media(min-width: 540px) and (max-width: 767px){
	.body-wrap {
		width: 540px;
	}
	.navbar-nav {
		padding-left: 2rem;
	}
	.footer-wrap {
		width: 540px;
	}	
}
@media(max-width: 539px){
	.body-wrap,
	.page-wrap,
	#menu {
		width: 340px;
	}
	.navbar-nav {
		padding-left: 2rem;
	}
	a.nav-link {
		padding-left: 0;
		padding-right: 0;
	}
	.topnav-wrap,
	.course-card-thumbnail {
		width: 100%;
	}
	#goTop {
		display: none;
	}
	.pagebanner-wrap {
		height: 60px;
	}
	.footer-wrap {
		width: 340px;
	}	
	.footer {
		width: 100%;
	}
}


@media only screen and (min-width: 1024px) {
	#navbarSupported {
		display: block;
	
	}
	#navbarMobile{
		display: none;
	}
}
@media only screen and (max-width: 1023px) {
	#navbarSupported {
		display: none;
	
	}
	#navbarMobile{
		display: block;
	}
}

