@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,300italic,600,600italic,700,700italic);
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Oswald:200,300,400,500,600,700');

Body{
	color: #19315b;
	font-size: clamp(14px, 2vw, 18px);  
	font-family: 'Roboto', sans-serif;
	margin:0;
	padding:0;
	line-height: 1.5
}

::selection {color:#FFF;background:#1c3869;}
::-moz-selection {color:#FFF;background:#1c3869;}
::-o-selection {color:#FFF;background:#1c3869;}
::-ms-selection {color:#FFF;background:#1c3869;}
::-webkit-selection {color:#FFF;background:#1c3869;}
 
.Shadow{
 -moz-box-shadow: 0px 5px 15px 0px #ccc;
 -webkit-box-shadow: 0px 5px 15px 0px #ccc;
 box-shadow: 0px 5px 15px 0px #ccc;}	
	
 
.FontColor1 {color:#1c3869;}
.FontColor2 {color:#f37a21;}
.FontColor3 {color:#FFFFFF;}
.FontColor4 {color:#000;}

.FontStyle1{font-family: 'Oswald', sans-serif;}
.fontweight200{font-weight: 200;}
.fontweight300{font-weight: 300;}

.BgColor1{background-color:#fff;}
.BgColor2{background-color:#122d5c; color: #fff;}

.TableAltHeader1 {background-color:#1c3869; color:#fff;}
.AltColor11 {background-color:#e1e5eb;}
.AltColor12 {background-color:#f3f6fb;}

.TableAltHeader2 {background-color:#f37a21; color:#fff;}
.AltColor21 {background-color:#fee8dc;}
.AltColor22 {background-color:#fef6f2;}

/* Font Sizes */
.SmallerText {font-size: clamp(11px, 1vw, 12px);}
.MediumText {font-size: clamp(12px, 1vw, 15px);}
.NormalText {font-size: clamp(15px, 2vw, 20px);}
.NormalTextBig {font-size: clamp(16px, 3vw, 24px); line-height: 1.4}
.Heading {font-size: clamp(20px, 4vw, 32px); line-height: 1.1}
.BiggerText {font-size: clamp(20px, 3vw, 42px); line-height: 1.1}
.LargeText {font-size: clamp(26px, 6vw, 48px); line-height: 1.1}
.SmallerLink{font-size: clamp(11px, 1vw, 12px); text-decoration: none}
a.SmallerLink:hover {text-decoration:none;}

h4 {font-weight: normal; margin: 0; display: inline;}
h3 {font-weight: normal; margin: 0; display: inline;}
h2 {font-weight: normal; margin: 0; display: inline;}
h1 {font-weight: normal; margin: 0; display: inline;}
	
.JustLinks {TEXT-DECORATION: none;}
a.JustLinks:hover{TEXT-DECORATION: underline;}

.AllCaps{text-transform:uppercase;}

.PositionABT{position: absolute}

.PositionREL{position: relative}

.PositionFIX{position: fixed}

/* Button Styles */
.Button{
	font-family: 'Roboto', sans-serif;
	font-size:16px;		
	padding:7px 20px;
	cursor:pointer;
	text-decoration:none;
	outline:none;
	display:inline-block;
	margin:2px;
}
.ButtonSmall{
	font-family: 'Roboto', sans-serif;
	font-size:12px;		
	padding:2px 8px;
	cursor:pointer;
	text-decoration:none;
	outline:none;
	display:inline-block;
	margin:2px;
}
.ButtonMedium{
	font-family: 'Roboto', sans-serif;
	font-size:14px;	
	padding:4px 15px;
	cursor:pointer;
	text-decoration:none;
	outline:none;
	display:inline-block;
	margin:2px;
}
.ButtonBig{
	font-family: 'Roboto', sans-serif;
	font-size:20px;	
	padding:9px 20px;
	cursor:pointer;	
	text-decoration:none;	
	outline:none;	
	text-align: center;
}
.ButtonColor1{
	color:#fff;	
	background-color: #f55906;			
	border:1px solid #f55906;	
}
.ButtonColor1:hover{
	color:#fff;	
	background-color: #1c3869;		
	border:1px solid #1c3869;
	transition:0.3s ease;	
}
.ButtonColor2{
	color:#fff;	
	background-color: #1c3869;		
	border:1px solid #1c3869;	
}
.ButtonColor2:hover{
	color:#fff;	
	background-color: #f55906;			
	border:1px solid #f55906;
	transition:0.3s ease;	
}
.ButtonColor3{
	color:#000;	
background-color: #f5f5f5;
	background-image: -webkit-linear-gradient(top, #fff, #ddd);
	background-image: -moz-linear-gradient(top, #fff, #ddd);
	background-image: -ms-linear-gradient(top, #fff, #ddd);
	background-image: linear-gradient(top, #fff, #ddd);
	box-shadow: 0px 3px 0px 0px #000;
}
.ButtonColor3:hover{
background-color: #f5f5f5;
	background-image: -webkit-linear-gradient(bottom, #fff, #e1e5eb);
	background-image: -moz-linear-gradient(bottom, #fff, #e1e5eb);
	background-image: -ms-linear-gradient(bottom, #fff, #e1e5eb);
	background-image: linear-gradient(bottom, #fff, #e1e5eb);
}
.Button:active, ButtonMedium:active, ButtonSmall:active, ButtonBig:active{
	top:1px;
	position:relative;
}

/* All Border Styles */
.Border1 {border-width:1px; border-style:solid}
.Border2 {border-width: 2px;  border-style:solid}
.Border5 {border-width: 5px;  border-style:solid}

.DottedBorder {border-width:1px; border-style:dotted}

.BorderBottom1{border-bottom: 1px solid;}
.BorderBottom3{border-bottom: 3px solid;}
.BorderBottom5{border-bottom: 5px solid;}
.BorderBottomDashed{border-bottom: dashed 1px;}
.BorderBottomDotted{border-bottom: dotted 1px;}

.BorderTop1{border-top: 1px solid;}
.BorderTop2{border-top: 2px solid;}
.BorderTop5{border-top: 5px solid;}
.BorderTop7{border-top: 7px solid;}
.BorderTopDashed{border-top: dashed 1px;}
.BorderTopDotted{border-top: dotted 1px;}

.BorderLeft1{border-left:1px solid;}
.BorderLeft8{border-left:8px solid;}
.BorderRight1{border-right:1px solid;}
.BorderRight2{border-right:2px solid;}
.BorderRight3{border-right:3px solid;}

.BorderColor1{border-color: #f37a21}
.BorderColor2{border-color: #ccc}
.BorderColor3{border-color: #1c3869}

/* Border Rounded Corners */
.BorderRounded15{border-radius:15px;}
.BorderRounded10{border-radius:10px;}
.BorderRounded8{border-radius:8px;}
.BorderRounded5{border-radius:5px;}
.BorderRounded20{border-radius:20px;}

/* Table Style */		
.TableStyle {
    border-collapse: collapse;
    border-spacing: 0;	     
	background-color: #fff;
}
.TableStyle th {    
    padding:7px;
	color:#000;
	background-color: #f0f5f6;
	background-image: -webkit-linear-gradient(top, #effaff, #c8edff);
	background-image: -moz-linear-gradient(top, #effaff, #c8edff);
	background-image: -ms-linear-gradient(top, #effaff, #c8edff);
	background-image: -o-linear-gradient(top, #effaff, #c8edff);
}
.TableStyle td {      
    padding:3px 7px;
	border: 1px solid #dbe2e2;	
}
.TableStyle tr:nth-child(even){background-color: #f0f5f8; }

/* TextBox Style*/	

.TextBox{	
	color:#000;
	padding:10px 7px;
	border:1px solid #d0d0d0;	
	background-color: #fff;	
	box-sizing: border-box;
	outline: none;
}
.TextBox:focus{	
	border:1px solid #19315b;
	background-color: #ffffff;	
	box-sizing: border-box;
	outline: none;
}
input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
input:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
input:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */
::placeholder{
	font-size:13px;
	font-style:italic;
	font-family: 'Open Sans', sans-serif;
	opacity:0.4;
	color:#fff;	
	}
:-ms-input-placeholder{
	font-size:13px;
	font-style:italic;
	font-family: 'Open Sans', sans-serif;
	opacity:0.4;
	color:#fff;
}

.TextBoxBig::placeholder,
.TextBoxBig::-webkit-input-placeholder{
  color: #000;
  opacity:0.5;
  font-style:normal;
  font-family: 'Open Sans', sans-serif;
  font-size:16px;
}
.TextBoxBig::-moz-placeholder{
  color: #000;
  opacity:0.5;
  font-style:normal;
  font-family: 'Open Sans', sans-serif;
  font-size:16px;
}

.imgzoom{
	 overflow: hidden; 
            margin: 0 auto; 
}
      
 .imgzoom img { 
            width: 100%; 
            transition: 0.5s all ease-in-out; 
        } 
      
.imgzoom:hover img {             
	-ms-transform: scale(1.15);	
	-webkit-transform: scale(1.15);	
	-moz-transform: scale(1.15); 
	transform: scale(1.15);
        }
.paddingtop{padding-top: 70px;}
.margintop{margin-top: -340px;}
.height{height: 350px;}
.bannercaption{background: url(../images/captionbg.png) no-repeat center right -350px; background-size: cover; z-index: 11; height: 100vh; right: 0;}
.banner{height: 93vh; overflow: hidden;}
.bannertext{bottom: 12%; right: 5%; position: absolute;}
.recruitmentbg{
	width: 100%;  
  background: url( "../images/multicolor-bg.jpg") no-repeat top center;    
  background-size: 100%;
	min-height: 200px;
}
.recruitment_img{
	position: absolute;
	bottom: 0; right: 0;
	z-index: 11;
	object-fit: contain;
}
.whatidodiv{
	color: #19315b;
	text-decoration: none;
	width: 100%;
	float:left;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	box-shadow: 0px 6px 15px 0px #ddd;
	transition: 0.5s all ease-in-out;
}
.whatidodiv:hover{	
	border: 1px solid #ddd;
	background-color: #fff;
	box-shadow: 0px 6px 15px 0px #999;
	transition: 0.5s all ease-in-out;
}
.whatidodiv img {             
	-ms-transform: scale(1);	
	-webkit-transform: scale(1);		
	transform: scale(1);
	transition: 0.5s all ease-in-out;
        }
.whatidodiv:hover img {             
	-ms-transform: scale(1.2);	
	-webkit-transform: scale(1.2);		
	transform: scale(1.2);
	transition: 0.5s all ease-in-out;	
        }

.iworkwithbg{
	width: 100%;  
  background: url( "../images/who-work-with-bg.jpg") no-repeat bottom  center;    
  background-size:cover;     
	min-height: 200px;
}
.workwithmebg{
	width: 100%;  
  background: url( "../images/why-work-with-me-img.jpg") no-repeat center center;    
  background-size: cover;     
	min-height: 200px;
}
.employerbg{
	width: 100%;  
  background: url( "../images/for-employers.jpg") no-repeat center center;    
  background-size: cover;     
	min-height: 200px;
}
.candidatesbg{
	width: 100%;  
  background: url( "../images/for-candidates.jpg") no-repeat center center;    
  background-size: cover;     
	min-height: 200px;
}
.footer{background: #010b1d;}
.getintouchbg{
background: url(../images/getintouch-img.jpg) no-repeat center center / cover;
	min-height: 350px;
}
.innerbanner{
min-height: 450px;
	overflow: hidden;
	
}
.headingbg{
	background: url("../images/innerbanner_headingbg.png") no-repeat right center;
	background-size: cover;
	min-height: 450px;
	position: relative;
	top: 0;
	left: 0;
	z-index: 11
}
.headingcenter{
	position: absolute;
	z-index: 12;
	top: 50%;
	left: 40%;
	transform: translate(-50%, -50%);
	width: 95%;
}
.innerbannerimg{
	min-height: 450px;
	position: absolute;	
	right: 0;
	top: 0;
	z-index: 10
}
.philosophyimg{
	background: url("../images/operatingphilosophy.jpg") no-repeat center center;
	background-size: cover;
	min-height: 420px;
}
.canadabg{
	background: url("../images/alberta-canada.jpg") no-repeat right top;
	background-size: cover;
	min-height: 250px;
	padding-top: 100px
}
.industry_icon{
	width: 80px;
	height: 80px;
	border-radius: 50%;
	padding:6px;
	box-sizing: border-box;
	text-align: center;
	margin: -45px auto auto;
}
.flex1 {
  display: flex;
  justify-content: center;
  align-content: space-between;
	gap:10%;
  box-sizing: border-box;
  flex-wrap: wrap;
  margin-top: 15px;
}
.valuesdiv{	
	text-decoration: none;
	width: 100%;
	float:left;
	background-color: #fff;
	border-bottom: 7px solid #1c3869;
	border-radius: 15px;	
	box-shadow: 0px -5px 20px 0px #ddd;
	transition: 0.5s all ease-in-out;
}
/*accordion*/
.accordion {
	
	width: 100%;
	display: inline-block;
	position: relative;
	
}
a.accordion-header {
	display: block;
	background-color: #eee;	
	color: #1c3869;
	padding:15px 30px 15px 20px;	
	cursor: pointer;
	margin-bottom: 20px;
	text-decoration: none;
	text-align: left;
	border-radius: 15px;
}
a.accordion-header.active-accordion {
	border-radius: 15px 15px 0 0;
	background-color: #1c3869;
	color: #fff;
	margin-bottom: 0px;
}

.accordion-content {
	height: auto;	
	display: none;
	position: relative;	
	margin-top: -2px;
	border-top: none;
	margin-bottom: 20px;
	text-align: left;
	background-color: #fff;
	padding: 15px;
	box-sizing: border-box;
	box-shadow: 0px 3px 12px 0px #ddd;
	border-radius: 0 0 15px 15px;
}
.accordion-content-flex {
	height: 100%;
	padding: 15px;
	box-sizing: border-box;
}
a.accordion-header:after {
	content: '\002b';
	color: #1c3869;
	font-weight: 500;
	float: right;
	margin-left: 2px;
	font-size: 28px;
	line-height: 0.9;
	position: absolute;
	right: 15px;
}
a.accordion-header.active-accordion:after {
	content: '\2212';
	color: #fff;
}
.conversationbg{
	width: 100%;  
  background-image: url( "../images/conversation-img.png"); 
	background-repeat: no-repeat;
	background-position: bottom right;
  background-size: 400px;
	min-height: 200px;
}
.teamimg{margin-top: -80px;}
@media screen and (max-width:1399px) {
	.banner{height: 90vh; overflow: hidden;}
	.bannertext{bottom: 17%; right: 5%; position: absolute;}
.innerbanner{
min-height: 390px;		
}
.headingbg{	
	min-height: 390px;	
}

.innerbannerimg{
	min-height: 390px;	
}
.canadabg{
	background: url("../images/alberta-canada.jpg") no-repeat right -150px top;
	background-size: cover;
	
}	
}
@media screen and (max-width:1279px) {
	.banner{height: 400px; overflow: hidden;}
	.bannertext{bottom: 15%; right: 5%; position: absolute;}
	.bannercaption{background: url(../images/captionbg.png) no-repeat center right -150px; background-size: cover; z-index: 11; height: 400px; right: 0;}
.iworkwithbg{
	width: 100%;  
  background: url( "../images/who-work-with-bg.jpg") no-repeat bottom  center;    
  background-size: cover;     
	min-height: 200px;
}
.innerbanner{
min-height: 350px;		
}
.headingbg{	
	min-height: 350px;	
}

.innerbannerimg{
	min-height: 350px;	
}
.headingcenter{	
	left: 40%;	
}
.canadabg{
	background: url("../images/alberta-canada.jpg") no-repeat right -120px top;	
	padding-top: 80px
}
.margintop{margin-top: -280px;}
.height{height: 300px;}
	
}
@media screen and (max-width:1023px) {
.banner{height: 350px; overflow: hidden;}
	.bannertext{bottom: 5%; right: 5%; position: absolute;}
	.bannercaption{background: url(../images/captionbg.png) no-repeat center right -150px; background-size: cover; z-index: 11; height: 350px; right: 0;}
	
.paddingtop{padding-top: 50px;}
.headingcenter{	
	left: 25%;
	transform: translate(-40%, -50%);
}
.philosophyimg{
	background: url("../images/operatingphilosophy.jpg") no-repeat center center;
	background-size: 100%;
	min-height: 400px;
}
.canadabg{
	background: url("../images/alberta-canada.jpg") no-repeat right -120px top;	
	padding-top: 50px
}
	.margintop{margin-top: -230px;}
.height{height: 230px;}
	.conversationbg{	
	background-position: bottom right;
  background-size: 300px;
	min-height: 200px;
}
}
@media screen and (max-width:767px) {
	.BiggerText {font-size: clamp(20px, 5vw, 42px); line-height: 1.1}
.banner{height: 320px; overflow: hidden;}
	.bannertext{bottom: 0%; right: 0%; position: absolute; text-shadow: 2px 2px 2px #000;  padding: 10px 20px; box-sizing: border-box;}
	.bannercaption{background: none; background-size: cover; z-index: 11; bottom: 0; height: auto;}
.workwithmebg{
	width: 100%;  
  background: url( "../images/why-work-with-me-img.jpg") no-repeat center left;    
  background-size: cover;     
	min-height: 200px;
}
	.iworkwithbg{
	width: 100%;  
  background:url( "../images/who-work-with-bg.jpg") no-repeat bottom  center;    
  background-size: cover; 		
	min-height: 200px;
}
.Button{	
	font-size:14px;	
	padding:5px 15px;	
}
.ButtonSmall{	
	font-size:11px;		
	padding:2px 8px;	
}
.ButtonMedium{	
	font-size:12px;	
	padding:3px 8px;	
}
.ButtonBig{	
	font-size:16px;	
	padding:7px 15px;	
}
.recruitment_img{
	position: relative;
	bottom: 0; right:auto;
	z-index: 11;
}
.innerbanner{
min-height: 300px;		
}
.headingbg{	
	min-height: 120px;	
	background: url("../images/innerbanner_headingbg.png") no-repeat left center;
	position: relative
}

.innerbannerimg{
	min-height: 250px;
	position: relative
}
.headingcenter{	
	left: 50%;
	transform: translate(-50%, -50%);
}
	.paddingtop{padding-top: 60px;}
.philosophyimg{
	background: url("../images/operatingphilosophy.jpg") no-repeat center center;
	background-size: 100%;
	min-height: 380px;
}
.industry_icon{
	width: 70px;
	height: 70px;	
	margin: -40px auto auto;
}
	.margintop{margin-top: -330px;}
.height{height: 350px;}
	.conversationicon{
		transform: translateX(-50%);
		left: 50%;
		top: 10px;
		
	}
	.teamimg{margin-top: -60px;}
}

@media screen and (max-width:639px) {
.innerbanner{
min-height: 200px;		
}
.headingbg{	
	min-height: 100px;	
	background: url("../images/innerbanner_headingbg.png") no-repeat left center;
	position: relative
}

.innerbannerimg{
	min-height: 220px;
	position: relative
}
	.philosophyimg{
	background: url("../images/operatingphilosophy.jpg") no-repeat center center;
	background-size: 100%;
	min-height: 340px;
}
.canadabg{
	background: url("../images/alberta-canada.jpg") no-repeat right -50px top;	
	padding-top: 30px
}
	.margintop{margin-top: -250px;}
.height{height: 250px;}
.banner{height: 270px; overflow: hidden;}
	.bannertext{padding: 7px 15px;}	
	.conversationbg{	
	background-position: bottom right;
  background-size: 250px;
	min-height: 200px;
}
	.teamimg{margin-top: -40px;}
}

@media screen and (max-width:479px) {
	.banner{height: 240px; overflow: hidden;}
	.bannertext{padding: 5px 12px;}	
.iworkwithbg{
	width: 100%;  
  background: url( "../images/who-work-with-bg.jpg") no-repeat bottom  center;    
  background-size: cover; 		
	min-height: 200px;
}
.canadabg{
	background: url("../images/alberta-canada.jpg") no-repeat right -150px top;	
	padding-top: 30px
}
.Button{	
	font-size:13px;	
	padding:5px 12px;	
}
.ButtonSmall{	
	font-size:10px;		
	padding:2px 8px;	
}
.ButtonMedium{	
	font-size:10px;	
	padding:2px 8px;	
}
.ButtonBig{	
	font-size:14px;	
	padding:7px 15px;	
}
	.headingbg{	
	min-height: 90px;	
	background: url("../images/innerbanner_headingbg.png") no-repeat left center;
	position: relative
}	
.innerbannerimg{
	min-height: 190px;
	position: relative
}
	.philosophyimg{
	background: url("../images/operatingphilosophy.jpg") no-repeat center center;
	background-size: 100%;
	min-height: 270px;
}
.industry_icon{
	width: 60px;
	height: 60px;	
	margin: -35px auto auto;
}
	.margintop{margin-top: -200px;}
.height{height: 200px;}
	.teamimg{margin-top: -50px;}
}


/* PRELOADER FULL SCREEN */
#preloader-active {
    position: fixed;
    inset: 0; /* top:0 right:0 bottom:0 left:0 */
    width: 100%;
    height: 100%;
    background: #ffffff;
    z-index: 999999;

    /* PERFECT CENTER */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* INNER WRAP */
.preloader-inner {
    position: relative;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ROTATING CIRCLE */
.preloader-circle {
    position: absolute;
    width: 120px;
    height: 120px;
    border: 3px solid #ddd;
    border-top: 3px solid #f36f29;
    border-radius: 50%;
    animation: spin 1.5s linear infinite;
    box-sizing: border-box;
}

/* LOGO CENTER */
.preloader-img {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

.preloader-img img {
    max-width: 50px;
    display: block;
}

/* SPIN */
@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* HIDE */
#preloader-active.hide-preloader {
    opacity: 0;
    visibility: hidden;
    transition: all 0.6s ease;
}