/*TOP LEVEL STYLES ========================================================== */
/*the "html *" below is appied to all of the CSS code*/
/*the !important code overrides all other CSS code*/ 
html 
{
	font-family: 'Radio Canada ', serif; /*google font*/
	scroll-behavior: smooth; /*for jump to top: scroll vs snap*/
}
body 
{ 
	margin:0; /*removes white border around the whole website*/
	padding:0; /*removes white border around the whole website*/	
	min-width: 300px; /*restricts webpage from getting any smaller than defined amount*/
}  
a[href^=tel]  
{
   /*text-decoration: inherit; /* this will prevent phone numbers from being underlined on safari*/
   color: inherit; /* this will prevent phone numbers from looking blue on safari */
}
b { font-weight: bold; }
button { cursor: pointer; }

/*layout framework styles ====================================================*/
.pgHeader {}
.pgMain {}
.pgSection {} 
.pgFooter 
{
	background-color: #1394c2; /**/
	padding: 15px;	
}

/*multi-purpose classes ====================================================== */
.bold { font-weight: bold; }
.italic { font-style: italic; } 
.underline { text-decoration: underline; }
.noUnderline { text-decoration: none; }
.align_right { text-align: right; }
.center { text-align: center; }
.center_flex
{
	display:flex; /**/
	justify-content:center; /**/
	align-items:center; /**/
}
.center_div
{
	display: block; 
	margin-left: auto; 
	margin-right: auto;
}
.font-10 { font-size: 10px; }
.font-12 { font-size: 12px; }
.font-14 { font-size: 14px; }
.font-15 { font-size: 15px; }
.font-16 { font-size: 16px; }
.font-18 { font-size: 18px; }
.font-20 { font-size: 20px; }
.font-21 { font-size: 21px; }
.font-22 { font-size: 22px; }  
.font-23 { font-size: 23px; }
.font-24 { font-size: 24px; } 
.font-25 { font-size: 25px; }
.font-26 { font-size: 26px; }
.font-28 { font-size: 28px; }
.font-30 { font-size: 30px; }
.font-31 { font-size: 31px; }
.lh-6 { line-height: 1.6; } 
.hr_gray_75 { border-top: 2px solid #e8e8e8; border-bottom: 2px solid #f8f8f8; width:75%; }
.hr_gray_80 { border-top: 2px solid #e8e8e8; border-bottom: 2px solid #f8f8f8; width:80%; }
.hr_gray_95 { border-top: 2px solid #e8e8e8; border-bottom: 2px solid #f8f8f8; width:95%; }
.hr_gray_100 { border-top: 2px solid #e8e8e8; border-bottom: 2px solid #f8f8f8; width:100%; }
.black { color:#000000; }
.white { color:#ffffff; }
.theme_blue { color: #1394c2; }  /**/ 
.theme_red { color: #d53935; }  /**/
.hide { display: none; }
.flex_break { flex-basis: 100%; }

/*header + navbar styles ==================================================== */
.nav_flexbox 
{
	display: flex; /*flexbox for navigation bar*/
	flex-wrap: wrap; /*flex - wrap or nowrap*/ 
	justify-content: center; /*flex - how items are positions in flexbox*/
	
	margin: auto; /*centers the nav container*/ 
	list-style: none; /*remove bullet points*/
	align-items: center; /*centers each individual box vertically*/
	background-color: #1394c2;
	/*border:1px solid red; /*hide - for layout only*/	
}
.nav_flexbox > a 
{
	padding: 15px 30px; /**/
	margin: 0px 0px; 
	text-align: center; /*center text horizontally*/ 
	font-size: 20px; 
	/*font-weight: bold; /**/ 
	text-decoration: none; /*remove underline*/ 
	color: white; /**/	
	background-color: #1394c2; /**/
	/*border:1px solid white; /*hide - for layout only*/	
}
.nav_flexbox > a:hover  
{	
	background-color: #2eb8ea; /**/
}
.flag_box
{
	display: flex; /*flexbox for navigation bar*/
	flex-wrap: wrap; /*flex - wrap or nowrap*/ 
	justify-content: center; /*flex - how items are positions in flexbox*/
	margin: auto; /*centers the nav container*/ 
	align-items: center; /*centers each individual box vertically*/
	margin: 15px 0px 7px 0px;
	/*border:1px solid red; /*hide - for layout only*/
}
.flags  
{
	height: 100px; /**/
	width: auto; 
	padding: 0px 0px; /**/
	margin: 0px 7px; 
}
.flag_text
{
	color: black;
	font-size: 13px;	
	font-weight: bold; 
	display:flex; /**/
	justify-content:center; /**/
	text-align: center;
	flex-basis: 100%; /* forces text to next line */ 
	margin: 7px 0px;
}
.logo_box
{
	display: flex; /*flexbox*/
	flex-wrap: wrap; /*flex - wrap or nowrap*/ 
	justify-content: center; /*flex - how items are positions in flexbox*/
	margin: auto; /*centers the nav container*/ 
	align-items: center; /*centers each individual box vertically*/
	margin: 0px 0px 10px 0px;
	/*border:1px solid red; /*hide - for layout only*/
}
.logo
{
	height: 50px;  
	width: auto;
}


/*footer styles ============================================================= */
.copyright
{
	font-size: 10px; 
	color: white; 
	line-height: 20px;
	text-align: center;
}
.disclaimer 
{
	font-size: 12px; 
	color: white; 
	line-height: 20px;
	text-align: center;
}
.footer_contact
{
	color:white; 
	line-height:1.6;
}
/*social media links*/
.social_media
{
	text-align: center;	
	margin: 15px 10px; 
}
.social_media > a 
{
	text-decoration: none;
}
.social_media > a > img 
{
	width: 45px; 
	height: auto;
	padding: 0px 10px; 
}
.jmpTopBut 
{
  font-size: 33px;
  background-color: #1394c2; 
  color: #07384a; /* #454545; */ 
  cursor: pointer;
  padding: 3px 15px; /*t,r,b,l*/
  border-radius: 5px;
  margin: 0px; 
}
@media all and (max-width: 615px)
{
	.mHide { display: none; }
} 


/*homepage styles ==================================================== */
.home_image
{
	width: 75%;
	margin: auto; 
	display: block; 
}
.home_flexbox 
{
	display: flex; /*flexbox*/
	flex-wrap: wrap; /*flex - wrap or nowrap*/ 
	justify-content: center; /*flex - how items are positions in flexbox*/
	margin: auto; /*centers the container*/ 
	padding: 25px 15px;
	/*border:1px solid red; /*hide - for layout only*/	
}
.home_intro 
{
	width: 1240px; 	
	padding: 35px 35px;  /**/
	margin: 0px 15px 7px 15px;	
	color: #186399; 
	line-height: 1.4; 	
	box-sizing: border-box;	
	background: rgb(19,148,194);
	background: linear-gradient(0deg, rgba(19,148,194,0.267927239255077) 0%, rgba(255,255,255,1) 100%);
	/*border:1px solid green; /*hide - for layout only*/
}
.home_intro2
{
	width: 1240px; 	
	padding: 35px 35px;  /**/
	margin: 0px 15px 7px 15px;	
	color: #186399; 
	line-height: 1.4; 	
	box-sizing: border-box;	
	background: rgb(19,148,194);
	background: linear-gradient(0deg, rgba(19,148,194,0.267927239255077) 0%, rgba(255,255,255,1) 100%);
	/*border:1px solid green; /*hide - for layout only*/
}
.home_intro2b
{
	max-width: 600px; 
	/*border:1px solid green; /*hide - for layout only*/
}
.home_item_color
{
	width: 550px; 	
	padding: 20px;  /**/
	margin: 15px;	
	color: white; 
	background-color: #1394c2;
	/*border:1px solid green; /*hide - for layout only*/
}
.home_item_white
{
	width: 550px; 	
	padding: 20px;  /*t,r,b,l*/
	margin: 15px;	
	color: #186399; 
	border:3px solid #1394c2;; /*hide - for layout only*/
}
.home_item_text
{
	font-size: 17.5px; 
}
.scrollBox 
{
  background-color: white;
  max-width: 600px;
  height: 100px;
  overflow: scroll;
  padding: 15px 25px; 
  border:2px solid #1394c2; /**/
}

.home_image2
{
	width:1225px; /**/
	height:472px; /**/
	margin: auto; 
	display: block;
	/*border:1px solid red; /*hide - for layout only*/		
}
.carousel_outter /*Carousel - slider styles*/ 
{
	position:relative; 
	/*you have to also change the width in the code to resize the images*/ 
}
.carousel_inner 
{
	width:1225px; /**/
	height:472px; /**/
}
.carousel_image 
{
	width:1225px; /**/
	height:472px; /**/
}


.home_but_flexbox 
{
	display: flex; /*flexbox*/
	flex-wrap: wrap; /*flex - wrap or nowrap*/ 
	justify-content: center; /*flex - how items are positions in flexbox*/
	margin: auto; /*centers the container*/ 
	padding: 15px 15px 45px 15px;/**/
	/*border:1px solid red; /*hide - for layout only*/	
}
.home_but_item
{
	margin: 20px 35px; /**/
	color: #2774ae; 
	/*border:1px solid red; /*hide - for layout only*/	
}
.home_but_title
{
	font-size:25px;
	display: flex; /*flexbox*/
	flex-wrap: wrap; /*flex - wrap or nowrap*/ 
	justify-content: center; /*flex - how items are positions in flexbox*/	
}
.home_button
{
	font-size: 16px; 
	color: #2774ae; 
	background-color: white; /**/
	font-weight: bold;	
	padding: 0px 10px; 
	line-height: 2.4;
	border-radius: 12px; /**/
	border: 2px solid #2774ae; /**/ 
	/*border-style: none; /*outset*/
	width: 282px; 
	height: 55px; 
}


.home_logo_flexbox 
{
	display: flex; /*flexbox*/
	flex-wrap: wrap; /*flex - wrap or nowrap*/ 
	justify-content: center; /*flex - how items are positions in flexbox*/
	margin: 10px auto; /*centers the container*/  
	/*border:1px solid red; /*hide - for layout only*/	
}
.home_logo
{
	
	height: 50px; /**/
	width: auto; /**/
	margin: 15px 35px;
}

.hide 
{
  display: none;
}    
.show:hover + .hide 
{
  display: block;
  color: red;
}


/*about project styles ==================================================== */
.about_box 
{
	margin: 0px auto; /*centers the container*/ 
	padding: 25px;/**/	
	width: 50%;
	/*border:1px solid red; /*hide - for layout only*/	
	line-height: 1.6; 
	background-color: #f5f5f5; /**/
}


/*education styles ==================================================== */
.education_box 
{
	margin: 0px auto; /*centers the container*/ 
	padding: 15px 15px;/**/	
	max-width: 1100px;
	background-color: #f5f5f5; /**/
	/*border:1px solid red; /*hide - for layout only*/
	
	line-height: 1.6; 
}
.edu_par
{
	text-align: center; 
	font-size: 20px; 
	max-width: 600px; 
	margin: 25px auto;
}
.edu_stk
{
	font-size: 18px; 
	max-width: 580px; 
	margin: 15px auto 0px auto;
}
.edu_btn1
{
	font-size: 16px; 
	color: white; 
	background-color: #4f4f4f; /**/
	font-weight: bold;	
	padding: 0px 10px; 
	line-height: 2.4;
	border-radius: 12px; /**/
	border: 2px solid #4f4f4f; /**/ 
	/*border-style: none; /*outset*/
	width: 282px; 
	height: 55px; 
	margin: 0px 15px;
}
.edu_btn2
{
	font-size: 16px; 
	color: #4f4f4f; 
	background-color: white; /**/
	font-weight: bold;	
	padding: 0px 10px; 
	line-height: 2.4;
	border-radius: 12px; /**/
	border: 2px solid #4f4f4f; /**/ 
	/*border-style: none; /*outset*/
	width: 282px; 
	height: 55px; 
}
.edu_flexbox 
{
	display: flex; /*flexbox*/
	flex-wrap: wrap; /*flex - wrap or nowrap*/ 
	justify-content: center; /*flex - how items are positions in flexbox*/
	margin: auto; /*centers the container*/ 
	padding: 15px;
	/*border:1px solid red; /*hide - for layout only*/	
}
.edu_module
{
	border: 2px solid gray;
	padding: 7px 15px; 
	background-color: white; /**/
	width: 150px; /**/
	margin: 7px; 
}
.edu_mod_btn
{
	font-size: 16px; 
	color: #4f4f4f; 
	background-color: #f5f5f5; /**/
	font-weight: bold;	
	padding: 0px 35px; /**/
	line-height: 2.4;
	border-radius: 12px; /**/
	border: 2px solid #4f4f4f; /**/ 
	/*border-style: none; /*outset*/
	/*width: 282px; /**/
	/*height: 55px; /**/
	
	display: block; /*center*/
	margin: 15px auto 7px auto; /*center*/	
}

/*stk register styles ==================================================== */
.stk_box 
{
	margin: 0px auto; /*centers the container*/ 
	max-width: 850px; /**/
	padding: 25px;/**/	
	background-color: #f5f5f5; /**/
	/*border:1px solid red; /*hide - for layout only*/
}
.stk_par
{
	text-align: center; 
	font-size: 20px; 
	max-width: 450px; 
	margin: 25px auto;
}
.stk_btn1
{
	font-size: 16px; 
	color: white; 
	background-color: #4f4f4f; /**/
	font-weight: bold; /**/	
	padding: 0px 10px; 
	line-height: 2.4;
	border-radius: 12px; /**/
	border: 2px solid #4f4f4f; /**/ 
	/*border-style: none; /*outset*/
	width: 160px; 
	height: 55px; 
	margin: 0px 15px;
}
.stk_flexbox 
{
	display: flex; /*flexbox*/
	flex-wrap: wrap; /*flex - wrap or nowrap*/ 
	justify-content: center; /*flex - how items are positions in flexbox*/
	margin: auto; /*centers the container*/ 
	padding: 15px;
	/*border:1px solid red; /*hide - for layout only*/	
}
.stk_module
{
	border: 2px solid gray;
	padding: 25px; 
	background-color: white; /**/
	/*width: 285px; /**/
	margin: 7px; 
	
	display: flex; /*flexbox*/
	flex-wrap: wrap; /*flex - wrap or nowrap*/ 
	justify-content: center; /*flex - how items are positions in flexbox*/
}
.stk_logo
{	
	height: 100px; 
	width: auto; 
	border: 2px solid gray;
}
.stk_inner_box
{
	width: 173px; 
	padding: 0px 0px 0px 15px; 
	/*border: 1px solid red; /*hide - for layout only*/	
}
.stk_mod_btn
{
	font-size: 16px; 
	color: #4f4f4f; 
	background-color: white; /**/
	font-weight: bold;	/**/
	padding: 0px 15px; /**/
	line-height: 2.4;
	border-radius: 12px; /**/
	border: 2px solid #4f4f4f; /**/ 
	/*border-style: none; /*outset*/
	/*width: 282px; /**/
	/*height: 55px; /**/
	
	display: block; /*center*/
	margin: 15px auto 7px auto; /*center*/	
}

/*news styles ==================================================== */
.news_box 
{
	margin: 0px auto; /*centers the container*/ 
	padding: 25px;/**/	
	width: 70%;	
	position: relative; /* for positioning event box */
	background-color: #ebebeb; 
	/*border: 1px solid red; /*hide - for layout only*/
}
.news_article
{
	display: flex; /*flexbox*/
	flex-wrap: wrap; /*flex - wrap or nowrap*/ 
	justify-content: flex-start; /*flex - how items are positions in flexbox*/
	margin: 20px 0px; /*centers the container*/ 
	/*padding: 15px 15px;/**/	
	width: 65%;/**/	
	/*border: 5px solid blue; /*hide - for layout only*/
}
.news_img
{
	width: 150px;
	height: auto; 
	align-self: flex-start; /* to avoid image being stretched */
	border: 2px solid gray;	
	margin-bottom: 15px; 
}
.news_summary
{
	/*margin: 0px auto; /*centers the container*/ 
	padding: 0px 15px;/**/	
	max-width: 60%; /**/	
	/*border:5px solid green; /*hide - for layout only*/
}
.news_events
{
	position: absolute;
	right: 25px;
	width: 25%;
	border: 2px solid gray;
	padding: 15px; 
	line-height: 1.6; 
	background-color: white; 
}
.news_hr
{
	margin: 15px -15px;
}
.news_no_style
{
	text-decoration: none;
	color: black; 
}
.news_btn
{
	font-size: 15px; 
	color: #4f4f4f; 
	background-color: white; /**/
	/*font-weight: bold;	/**/
	padding: 3px 7px; /**/
	border-radius: 6px; /**/
	border: 2px solid #4f4f4f; /**/ 
	/*border-style: none; /*outset*/
	margin: 5px 0px; 
}
.news_img_bg
{
	display: block; 
	margin: auto; 
	max-width: 50%;
	height: auto; 
	box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.4); /*x,y,blur,spread,color*/
}


.news_images1
{
	width:450px; 
	height:auto; 
	margin: 0px 15px; 
	box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.4); /*x,y,blur,spread,color*/
}
.news_images2
{
	width:350px; 
	height:auto;
	margin: 0px 0px; 
	box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.4); /*x,y,blur,spread,color*/
}


/*contact styles ==================================================== */
.contact_box 
{
	margin: 0px auto; /*centers the container*/ 
	padding: 25px;/**/	
	width: 50%;
	/*border:1px solid red; /*hide - for layout only*/	
	line-height: 1.6; 
	background-color: #f5f5f5; /**/
}
form
{	 
	width:780px;
	/*border:1px solid red; /**/ 
}
input[type=text], select, textarea 
{
  width: 100%;
  padding: 12px 12px 12px 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  resize: vertical;
  box-shadow: 5px 5px 5px #bfbfbf inset;
  box-sizing: border-box; 
}
input[type=submit], [type=reset] 
{
  background-color: #1394c2;
  color: white;
  padding: 8px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  float: right;
  margin: 0px 5px; 
  font-size: 15px;  
  font-weight: bold; 
}
#required
{
	float: right; 
	font-size:14px;
}
#notice
{
	font-size:13px;
}



/* media queries - to change layout on small devices/viewports ============== */
/* put media queries at the end of your "cascading" stylesheet ============== */

/*header
@media all and (max-width: 1230px) 
{
	
}
*/