/*
--------------------
WARNING!
Copyright Progress Systems Limited.
Explicit permission is required to copy or use any documents from this website
--------------------
*/


/* 

	LEFT: 3 horizontal News pieces + RIGHT: HTML Announcement 4
	
	IMPORTANT: In Display Settings (Office Area) Homepage Order needs to be: 
	
	+ News Headlines
	+ HTML Announcement 4


*/



/* NEWS HEADLINES ------------------------------------------------------------------------------------- */


#news_content > div {
    display: block;
    float: left;
    margin-bottom: 30px;
    width: 65%;
}

#homePage .newsArticleImageSpan, 
#homePage .newsArticleImageLargeSpan {
	/*display: block;
	margin-bottom:20px;*/
	
	display:inline-block;
	vertical-align:top;
    margin-bottom: 20px;
    margin-right: 30px;
    max-width: 40%;
    width: 100%;
	float:left;
}

#homePage .newsArticleIndividualWrapper {
	display: inline-block;
    float: right;
    position: relative;
    width: 55%;	
}

.newsArticleImageSpan, .newsArticleImageLargeSpan {
    display: block;
    margin-bottom: 20px;
}


/*CHANGE TO WHATEVER ANNOUNCEMENT IS USED AFTER NEWS HEADLINES LAYER*/

#divHTMLAnnouncements2Wrapper #announcements_content_dynamic {
    height: 480px;
    position: absolute;
    right: 0;
    top: -545px;
    width: 30%;
	
}






/* -------------------------------------------------- MEDIA QUERIES ------------------------------------------*/


/* -------------------------------------------------- MEDIA QUERIES ------------------------------------------*/


/* -------------------------------------------------- MEDIA QUERIES ------------------------------------------*/


/* -------------------------------------------------- MEDIA QUERIES ------------------------------------------*/


/* -------------------------------------------------- MEDIA QUERIES ------------------------------------------*/







@media only screen and ( max-width: 75em ) /* 1200 */ {
	
	#divNewsHeadlinesWrapper {padding:0 20px;}
	
	#divHTMLAnnouncements2Wrapper #announcements_content_dynamic {right:20px;}
	
	#divHTMLAnnouncements2Wrapper #announcements_content_dynamic {}
	
}


@media only screen and ( max-width: 64em ) /* 1024 */{
	
	#divHTMLAnnouncements2Wrapper #announcements_content_dynamic {}

}


@media only screen and ( max-width: 61.25em ) /* 980 */ {
	
	#divHTMLAnnouncements2Wrapper #announcements_content_dynamic {width:45%; max-width:500px;}
	
	#homePage #news_content {width:50%;}
	
	#news_content > div {display:inline-block; width:100%;}
	
	#homePage .newsArticleImageSpan, #homePage .newsArticleImageLargeSpan {display:none;}
	
	#news_content > div:nth-child(1), #news_content > div:nth-child(2)  {}
	
	#homePage .newsArticleIndividualWrapper {width:100%;}
	
	#divHTMLAnnouncements2Wrapper #announcements_content_dynamic {}
	
}


@media only screen and ( max-width: 55em ) /* 880 */ {
	
}


@media only screen and ( max-width: 50em ) /* 800 */ {
	
	#divHTMLAnnouncements2Wrapper #announcements_content_dynamic {top:-710px; height:670px;}
}


@media only screen and ( max-width: 48em ) /* 768 */ {
	
	#divHTMLAnnouncements2Wrapper #announcements_content_dynamic {top:-570px;}

}


@media only screen and ( max-width: 45em ) /* 720 */ {	

	#homePage .newsArticleImageSpan, #homePage .newsArticleImageLargeSpan {max-width:100%; display:block;}
	
	#homePage .newsArticleIndividualWrapper {width:100%; float:none;}
	
	#homePage #news_content {width:100%;}
	
	#divHTMLAnnouncements2Wrapper {padding: 25px 20px; background:lightgrey;}
	
	#divHTMLAnnouncements2Wrapper #announcements_content_dynamic {width:100%; max-width:500px; position: relative; top:0; right:0; margin:auto; float:none; left:0; display: block; height:auto;}
	
}


@media only screen and ( max-width: 40em ) /* 640 */ {
	
}


@media only screen and ( max-width: 37.5em ) /* 600 */ {
	

}


@media only screen and ( max-width: 35.5em ) /* 568 */ {

}


@media only screen and ( max-width: 32.5em ) /* 520 */ {

}


@media only screen and ( max-width: 30em ) /* 480 */ {

}


@media only screen and ( max-width: 26.6875em ) /* 427 */ {
	
}


@media only screen and ( max-width: 25em ) /* 400 */ {
	
}


@media only screen and ( max-width: 22.5em ) /* 360 */ {
	
}


@media only screen and ( max-width: 20em ) /* 320 */ {

}