/*
TEMPLATE FOR MEDIA QUERIES
	@media screen and (min-width:1180px) {}
	@media screen and (min-width:880px) and (max-width:1179px) {}
    @media screen and (max-width:879px) {}

INDEX
	- CONTENT DETAIL
	- THUMBNAILS
*/

/*-----------------------------------------------------------  CONTENT DETAIL ------------------*/
@media screen and (min-width:830px){
	#this_business {
		position: relative;
		height: 400px;
		margin-bottom: 30px;
	}
	
	.wrap_business {
		position: absolute;
		height: 400px;
		width: 360px;
	}
	
	.business_profile{height: 360px;}
}

@media screen and (min-width:525px) and (max-width:829px) {
	#this_business{
		position: relative;
		width: 475px;
		margin: 0 auto 20px auto;
		height: auto;
	}
	
	.wrap_business { width: 100% ;}
	
	#this_business img { width:100%; }
	
	.business_profile{ height: auto; }

}

@media screen and (max-width:524px) {
	#this_business img{width:100%;}
	
	.wrap_business {	width: 100%;}
	
	#this_business{ margin: 0 auto 30px auto; }
	
	.business_profile{height: auto;}

}

@media screen and (max-width:415px) {
	#ng_alumni a {margin: 0 auto 30px auto !important;}
}

#news_gallery {
	margin-top: 30px;
}

#news_gallery h1 {
	color: var(--gray5);
	font-size: 1.8em;
	margin: 0;
	text-transform: inherit;
	text-align: left;
}

#news_gallery h2 { margin-bottom: 10px; font-size: 18px; }

#news_gallery h3 {
	color: var(--gray4);
	font-weight: normal;
	font-size: 0.9em;
	margin-bottom: 0.3em;
}


#this_business img { z-index: 85; }

.wrap_business {
    overflow: hidden !important;
    background-color: rgb(66 86 154 / 64%);
    top: 0;
    right: 0;
    z-index: 90;
}

#news_gallery .business_profile {
	margin-left: 35px;
	background-color: var(--bg_hd);
}

#news_gallery .business_profile dl {
	color: #ffffff;
	padding: 10px;
	border-bottom: 1px solid #8ebae1;
	height: auto;
	transition: all 0.5s;
}

#news_gallery .business_profile dl:hover{background: var(--color_pl1);}

#news_gallery .business_profile dt { text-align: left; }

#news_gallery .business_profile dd{
    font-style: italic;
    margin-top: 10px;
}

#news_gallery .business_profile dd h1 {
	color: #ffffff;
	font-size: 14px;
	margin: 0;
	line-height: inherit;
	text-transform: none;
}

#ng_alumni dd { float: left; }
	
#news_gallery .business_profile dd h1 span {
	color: #ffffff;
	font-size: 14px;
	display: inline-block;
	margin-left: 6px;
}

#news_gallery .business_profile dd h1 span::before { content: " - "; }

#news_gallery .business_profile dd h2 {
	color: #ffffff;
	font-size: 14px;
	font-style: normal;
	margin: 0;
	line-height: inherit;
}

.social_media {
	margin-left: 35px;
    background-color: var(--bg_hd);
    height: 40px;
}

.social_media a {
	background: url(/ctm/31250/projects/acc/layout01/images/social-netwrk-alumnin.png) no-repeat;
    height: 24px;
    width: 28px;
    display: block;
    margin: 10px 5px;
	vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: transform;
    transition-property: transform;
}

.social_media a:hover {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
}

.social_media a.facebook {background-position: 8px 0px;}

.social_media a.linkedin {background-position: -95px 0px;}

.social_media a.twitter {background-position: -133px 0px;}

.social_media a.instagram {background-position: -41px 0px;}


/*-----------------------------------------------------------  THUMBNAILS ----------------------*/
#news_gallery div.flex a.js-news_gallery dl dt {
	float: left;
    width: 83px;
    overflow: hidden;
	height: 70px;
}

#news_gallery div.flex a.js-news_gallery dl dt img{width: 100%;}

#news_gallery div.flex a.js-news_gallery dl dd { 
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	padding: 0 8px;
}

#news_gallery div.flex a.js-news_gallery dl dd.title { font-size: 16px; }

#news_gallery div.flex a.js-news_gallery dl dd.subtitle {
	color: var(--color3000);
	font-size: 13px;
}

#news_gallery div.flex a.js-news_gallery dl dd.date {
	color: var(--gray4);
	font-size: 13px;
	font-style: italic;
}

#news_gallery div.flex a { 
    border: 1px solid white;
    cursor: pointer;
}

#news_gallery div.flex a.selected,
#news_gallery div.flex a:hover {
    border-color: var(--bg_hd);
    background: var(--gray1);
}