@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,700;0,800;1,300;1,700;1,800&display=swap');

#breadCrumb
{
	display:none !important;
}
div#hero
{
	background:url("/cofac/qc/museumstudies/images/2024/header1.jpg");
	height:407px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	position:relative;
	 /*border:1px solid #ff99bb !important; */ 
}
 

p#bannertag
{
	 
	font-size:1.3em; color:#000000;
	font-weight: 500;
	 width:98%;
	 /*border:1px solid #ff99bb !important; */ 
	/*text-shadow: 2px 2px 2px black;font-size: clamp(1.2rem,2.5vw,2.5rem);padding: 10px;
	position: absolute;
	bottom: 0;*/
	margin-bottom:10px;
	background: #FC0;
	display: flex;
	gap:2rem;
	padding: 1rem;
}
 
#content h3
{
	text-transform:uppercase;
	font-style:italic;
	color:#552989;
	font-weight: 700;
	font-size: clamp(1.5rem, 2.5vw, 3rem);
	 
}

#content h5
{
	text-transform:uppercase;
	font-size: 1.5rem;
	color:#552989; 

}

div#infoBar
{
	background: #FC0;
	display: flex;
	gap:2rem;
	padding: 1rem; 
	 
	font-size:1.5em; color:#000000;
	font-weight: 500;
	 width:100%;
	 margin-bottom:10px;
	 /*border:1px solid #ff99bb !important; */ 
	
}
div#infoBar h4
{
	font-size: clamp(2.5rem,4vw,5rem);
	text-transform: uppercase;
	padding:.2rem !important;
	font-weight:700;
	color:#552989 !important;
	 /*border:1px solid #ff99bb !important; */ 
}

div#infoBar p
{
	font-size:1.2rem;
}

div#container1
{
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	margin: 1rem 0;
	justify-content:space-between;
	 /*border:1px solid #ff99bb !important; */ 
}

div.feature, div.purple_feature, div.map_feature
{
	flex:30%;
	min-width: 350px;
}

div.feature
{
	display:flex;
	flex-direction:column;
	border: 1px solid #ccc;
	box-shadow: 5px 5px 5px #ccc;
	 /*border:1px solid #ff99bb !important; */ 
}

div.purple_feature
{
	background:#639;
	color:white;
	align-self:flex-start;
}

div.map_feature
{
	background:#eee;
	align-self:flex-start;
}

div.gold_feature
{
	background: #FC0;
}

div.purple_feature h5
{
	color:white !important;
}

div.gold_feature ul
{
	font-size:1.3rem;
}

div#links_container1
{
	display:flex;
	margin: 1rem 0;
	justify-content: space-around;
	gap:1rem;
}

div.half_feature
{
	flex: 50%;
	background: #eee;
	 /*border:1px solid #ff99bb !important; */ 
}

div.half_feature h4
{
	text-align: center;
	text-transform: uppercase;
	font-size: clamp(1.5rem, 2vw, 2rem) !important;
}

div.half_feature div.links
{
	display: flex;
	flex-direction: column;
}

.half_feature .links a
{
	font-size: 1.3rem;
	padding: .5rem 1rem;
	background: #639;
	color: white !important;
	text-align: center;
	font-size: clamp(1.3rem, 1.5vw, 1.5rem) !important;
}

.half_feature .links a:hover
{
	background: #FC0;
	color: #639 !important;
}

div.text
{
	padding:1rem;
}

#logos
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .5rem;
	justify-content: center;
	margin-top:2rem;
}
#logos img
{
	max-width: 250px;
	max-height:200px;
}


@media only screen and (max-width: 1024px)
{
	div#infoBar, div#links_container1 { flex-direction:column; }
}

 


#container2 {
	width: 100%;	
	clear:both;
	padding: 1em 0%;
	overflow: hidden;
	margin-bottom: 1em; 
	border:1px solid #D8D9DA  !important; 	
	/*border:1px solid #D8D9DA  !important; */
	 
}
#container2 div.feature {

	max-width: 1680px;
	clear: both;
	padding: 2em 2.25%;
	overflow: hidden;
	margin-bottom: 1em;
	margin-right: auto;
	margin-left: auto;	
	/*border-bottom: 1px solid #ccc;
	border:1px solid #D8D9DA !important; 
	box-shadow: 5px 5px 5px #ccc;
	 */
	border:1px solid #D8D9DA !important; 
}
 

#container2 div.feature h3
{
	  
	padding: 10px;
	font-size:  1.5rem;
	font-weight: 700;
	color:#663399;
	font-weight:bold;
}
 
#container2 div.feature h4{
 
	padding: 10px;
	font-size: 1.3em;
	font-weight:bold;
	color:#000000;
	font-weight:bold;
}

#container2 div.feature h5{
 
	padding: 10px;
	font-size: 1.5rem;
	font-weight:bold;
	color:#552989;
} 

#container2  div.feature p{
	/*padding:16px10px;*/
	padding: 10px;
font-size:1.1em; color:#000000;
	
}

#container2 div.feature img {
	float:left;
	/*margin-right: 5%;*/
	padding: 5px;
	margin-left:20px;
}

  

 
#container2  div.feature ul{
	font-size:1.2em;
	line-height:1.5em;	
	margin-top: 0.5em;
	list-style:disc;
	margin-left:1.5em;
}

 
#container2 div.feature a {
	color: #639;	
}
#container2 div.feature a:hover {
	color: #639;
}

 

@media only screen and (max-width:950px){
	#container2 div.feature {
		margin-left: 2.25%;
		margin-right: 2.25%;
		width: 94.5%;
		clear:both;	
		margin-bottom: 2em;
		padding:0 0 2.5em 0;
	}
	 
  
	#container2 div.feature img {
		width: 100%;
		height:100%;
		object-fit:unset;
		float:none !important;
		margin: 0 !important;
	}
	
	#container2 div.feature p.title {
		margin-top:1em;	
	} 
	#container2 div.feature h3 {
		font-size: 1.3em;
		
	} 
}
 



					@media only screen and (max-width:1340px){
					#container2 div.feature {
							font-size: 1.3em;
						}
						
						#container2 div.feature h3{
							font-size:85%;
						}
					}
					@media only screen and (max-width:1024px){
						#container2 div.feature {
							font-size: 1.0em;
						}
					}
					 
					@media only screen and (max-width:700px){
						#container2 div.feature {
							font-size:1.1em;
							height: 8em;
						}
					}
					@media only screen and (max-width:360px){
						#container2 div.feature {
							font-size:0.8em;
							height: 8em;
						}
					}