@charset "UTF-8";

/*@import url("../webfonts/Lato_Light/stylesheet.css");*/

@import url("../webfonts/Lato-font/stylesheet.css");

/* CSS document updated 13 October 2017 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	/*	font: inherit;  */
	vertical-align: baseline;
	}


/* contains entire site except head */
#contain {
	margin: auto;
}	



/* NEW POLY HEADER DESIGN */

/* first strip with JG logo poly orange */
#jg-newheader-strip {
	position: relative;
	width: 100%;
	min-width: 1024px;
	height: 255px;
	border-bottom: #ffffff 1px solid;
	background-position: center;
	/* background-color: #212327; */
	/* background-image: url(../assets-newhead/poly-orange-255.jpg); */
	}
.jg-newheader-image-home {
	background-color: #000000; 
	background-image: url(../assets-newhead/poly-orange-255.jpg);
	}
.jg-newheader-image-roles {
	background-color: #000000; 
	background-image: url(../assets-newhead/roles-255.jpg);
	}
.jg-newheader-image-endorse {
	background-color: #000000; 
	background-image: url(../assets-newhead/endorse-255.jpg);
	}
.jg-newheader-image-contact {
	background-color: #000000; 
	background-image: url(../assets-newhead/contact-255.jpg);
	}


/* second menu strip poly orange */
#top-menu-strip-poly {
	position: relative;
	width: 100%;
	min-width: 1024px;
	height: 45px;
	background-position: center;
	z-index: 1;
	/* background-color: #000000; */
	background-image: url(../assets-newhead/poly-orange-45-75opaque.jpg);
	}

	#top-menu-strip-poly a:link {color: #ffffff; text-decoration: none;}    	/* unvisited link */
	#top-menu-strip-poly a:visited {color: #ffffff;} 							/* visited link */
	#top-menu-strip-poly a:hover {color: #33ccff; text-decoration: none;}   	/* mouse over link */
	#top-menu-strip-poly a:active {color: #33ccff;}  							/* selected link */

/* list format for inline menu list */
#top-menu-strip-poly ul li { 
	display: inline; 
	padding-right: 25px;
	padding-left: 25px;
	}

/* END NEW POLY HEADER DESIGN */






/* square indicator under menu list items */
.indicator {
	position: absolute;
	width: 7px; 
	height: 7px; 
	background-color: #FF6600;
}







/* first strip with JG logo and phones charcoal */
#jg-header-strip {
	position: relative;
	width: 100%;
	min-width: 1024px;
	height: 75px;
	background-position: center;
	/* background-color: #212327; */
	background-image: url(../assets-new/menu/grad-dkblu-75.jpg);
	}




.jg-logo-top {
	position: relative;
	width: auto; 
	height: auto;
	padding-top: 18px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	/* background-image: url(../jg-logo-1100-220.png); */
}


/* sticky scroll strip */
#scroll-bar {
	position: relative; 
	width: 100%; 
	min-width: 1024px; 
	height: 45px; 
	/* background-color: #707070; */
	}








/* second menu strip black */
#top-menu-strip {
	position: relative;
	width: 100%;
	min-width: 1024px;
	height: 45px;
	z-index: 1;
	background-color: #000000;
	/* background-image: url(../assets-new/grad45-85.png); */
	}


	#top-menu-strip a:link {color: #cccccc; text-decoration: none;}    	/* unvisited link */
	#top-menu-strip a:visited {color: #cccccc;} 						/* visited link */
	#top-menu-strip a:hover {color: #33ccff; text-decoration: none;}   	/* mouse over link */
	#top-menu-strip a:active {color: #33ccff;}  						/* selected link */	

/* not utilised */
#top-menu-strip ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}

/* format for inline menu list */
#top-menu-strip ul li { 
	display: inline; 
	padding-right: 25px;
	padding-left: 25px;
	}


/* menu links (colour here not used) */
.topmenu-links {
	font-family: "Lato Light",Helvetica Neue,Arial,Verdana,Geneva,Helvetica,sans-serif;
	font-size: 15px;
	font-weight: normal;
	/* color: #cccccc; */
	line-height: 20px;
	letter-spacing: .0em;
	text-align: center;
	}
	
/* end top-menu-strip */









#image-strip-coloured {
	position: relative; 
	width: 100%; 
	min-width: 1024px;
	height: 300px;
	background-position: center;
	}

.image-strip-home-trial {
	background-color: #000000; 
	background-image: url(../assets-new/vector-300pxl.jpg);
}

.image-strip-home {
	background-color: #000000; 
	background-image: url(../assets-new/search-300pxl.jpg);
	}

.image-strip-roles {
	background-color: #000000; 
	background-image: url(../assets-new/tree-300pxl.jpg);
	}

.image-strip-endorse {
	background-color: #000000; 
	background-image: url(../assets-new/night-300pxl.jpg);
	}

.image-strip-contact {
	background-color: #000000; 
	background-image: url(../assets-new/night-300pxl.jpg);
	}

.image-strip-search {
	background-color: #000000; 
	background-image: url(../assets-new/earth-curve-300pxl.jpg);
}

.image-strip-stair {
	background-color: #000000; 
	background-image: url(../assets-new/stair-300pxl.jpg);
}

.image-strip-abs {
	background-color: #000000; 
	background-image: url(../assets-new/abs-300pxl.jpg);
}


#image-strip-multicol {
	height: 5px; 
	width: 100%; 
	min-width: 1024px;
	margin-left: auto; 
	margin-right: auto; 
	background-color: #A26600; 
	background-position: center;
    background-image: url(../assets-new/colour-line-25.jpg);
	}



/* start middle-content */ /* unique to desktop site - not on mobile site */

#middle-content {
	position: relative;
	width: 100%;
	height: auto;
	}
	
	#middle-content a:link {color: #0099FF;text-decoration: none;}  	/* unvisited link */
	#middle-content a:visited {color: #0099FF;} 						/* visited link */
	#middle-content a:hover {color: #666666;text-decoration: none;}   	/* mouse over link */
	#middle-content a:active {color: #666666;}  						/* selected link */

	


ul.a {
    list-style-type: circle;
}

ul.b {
    list-style-type: square;
}


/*#middle-content ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}*/

#middle-content ul li { 
	display: list-item; 
	padding-right: 25px;
	padding-left: 5px;
	}

#middle-content ol li { 
	display: inline; 
	padding-right: 5px;
	padding-left: 5px;
	}



/* not used in site (ordered list css) */

/*ol.c {
    list-style-type: upper-roman;
}

ol.d {
    list-style-type: lower-alpha;
}

#middle-content ol {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}

#middle-content ol li {
	display: list-item;
	padding-right: 25px;
	padding-left: 5px;
	list-style: square;
	}
*/





/* end middle-content */ /* unique to desktop site - not on mobile site */

#middle-content-search {
	position: relative;
	width: 100%;
	height: auto;
	}
	
	#middle-content-search a:link {color: #0099FF;text-decoration: none;}  	/* unvisited link */
	#middle-content-search a:visited {color: #0099FF;} 						/* visited link */
	#middle-content-search a:hover {color: #666666;text-decoration: none;}   	/* mouse over link */
	#middle-content-search a:active {color: #666666;}  						/* selected link */

	
#middle-content-search ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}

#middle-content-search ul li { 
	display: inline; 
	padding-right: 7px;
	padding-left: 7px;
	}
	
#middle-content-search ol {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}

#middle-content-search ol li {
	display: list-item;
	padding-right: 25px;
	padding-left: 5px;
	list-style: square;
	}


/* linen container */
#linen-strip {
	position: relative;
	width: 100%;
	min-width: 1024px;
	height: auto;
	/*background-color: #cccccc;*/
	background-image: url(../assets/bg-linen-180.jpg);
	}



/* concrete container */
#concrete-strip {
	position: relative; 
	width: 100%; 
	min-width: 1024px;
	height: 400px;
	background-color: #999999; 
	background-image: url(../assets-new/strip-clear.jpg);
	}



/* footer container */
#footer {
	position: relative;
	width: 100%;
	min-width: 1024px;
	height: auto;
	background-color: #212327;
	}
	
	#footer a:link {color: #cccccc;text-decoration: none;}   	/* unvisited link */
	#footer a:visited {color: #cccccc;} 						/* visited link */
	#footer a:hover {color: #0099FF;text-decoration: none;}  	/* mouse over link */
	#footer a:active {color: #666666;}  						/* selected link */

#footer ol li {
	display: list-item;
	padding-right: 25px;
	padding-left: 4px;
	list-style: circle;
	color: #0099FF;
	}
	
/* end footer */



/* roles choice strip */
#roles {
	position: relative;
	width: 100%;
	min-width: 1024px;
	height: auto;
	background-image: url(../assets-new/strip-brown-2560.jpg);
	}
	
	/* #roles a:link {color: #0099ff;text-decoration: none;}	/* unvisited link */
	/* #roles a:visited {color: #999999;} 						/* visited link */
	/* #roles a:hover {color: #999999;text-decoration: none;}	/* mouse over link */
	/* #roles a:active {color: #999999;}  						/* selected link */

	#roles a:link {color: #fff;text-decoration: none;}	/* unvisited link */
	#roles a:visited {color: #fff;} 						/* visited link */
	#roles a:hover {color: #33ccff;text-decoration: none;}	/* mouse over link */
	#roles a:active {color: #fff;}  						/* selected link */
	

#roles-box-left {
	position: relative; 
	width: 480px; 
	height: auto; 
	margin-left: 5px;
	padding-top: 50px;
	padding-bottom: 50px;
	text-align: center;
	}	

#roles-box-right {
	position: absolute; 
	top: 0px; 
	left: 510px; 
	width: 480px; 
	height: auto; 
	text-align: center; 
	padding-top: 0px;
	margin-top: 50px;
	border-left-color: #999999; 
	border-left-width: 1px; 
	border-left-style: solid;
	}



#roles-box-left-card {
	position: relative; 
	top: 0px; 
	left: 20px;
	width: 480px; 
	height: auto; 
	margin-left: 5px;
	padding-top: 50px;
	padding-bottom: 50px;
	text-align: center;
	}

#roles-box-right-card {
	position: absolute;
	top: 0px;
	left: 511px;
	width: 480px;
	height: auto;
	text-align: center;
	padding-top: 0px;
	margin-top: 50px;	/* border-left-color: #999999; 
	border-left-width: 1px; 
	border-left-style: solid; */
	}


#roles-inline {
	position: relative;
	width: 100%;
	min-width: 1024px;
	height: auto;
	background-image: url(../assets-new/strip-brown-2560.jpg);
	}
	
	/* #roles-inline a:link {color: #0099ff;text-decoration: none;}	/* unvisited link */
	/* #roles-inline a:visited {color: #999999;} 						/* visited link */
	/* #roles-inline a:hover {color: #999999;text-decoration: none;}	/* mouse over link */
	/* #roles-inline a:active {color: #999999;}  						/* selected link */

	#roles-inline a:link {color: #fff;text-decoration: none;}	/* unvisited link */
	#roles-inline a:visited {color: #fff;} 						/* visited link */
	#roles-inline a:hover {color: #33ccff;text-decoration: none;}	/* mouse over link */
	#roles-inline a:active {color: #fff;}  						/* selected link */


#roles-box-inline-card {
	position: relative; 
	top: 0px; 
	left: 0px;
	width: 1024px; 
	height: auto; 
	margin-left: 0px;
	padding-top: 40px;
	padding-bottom: 0px;
	text-align: center;
	}



/* end roles */
	




/* below this line are classes only - below this line are classes only */





/* clear container with lower grey border */
/* same as clear container on mob site */
.clear-container {
	position: relative;
	width: 100%; 
	min-width: 1024px;
	height: auto;
	border-bottom-color: #cccccc; 
	border-bottom-width: 1px; 
	border-bottom-style: solid;
	}

/* do not alter - used throughout site */
.middle-container {
	position: relative; 
    width: 1024px; 
    height: auto;
    margin-left: auto; 
    margin-right: auto;
	}

/* white */
.middle-container-white {
	position: relative; 
    width: 1024px; 
    height: auto;
    margin-left: auto; 
    margin-right: auto;
    background-color: #fff;
	}

.middle-container-inline {
	position: relative; 
    width: 1024px; 
    height: auto;
    margin-left: auto; 
    margin-right: auto;
	}



.align-center {
	position: relative;
	width: auto; 
	height: auto; 
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}





/* smooth scroll to top of page (blue arrow) */
.back-to-top {
    position: fixed;
    bottom: 5%;
    right: 5%;
    display: none;
	}




/* classes for role description detail containers*/

.role-anchor-number {
	position: absolute; 
	top: -45px; 
	left: 0px; 
	width: 40px; 
	height: auto;
	}

.com-anchor-number {
	position: absolute; 
	top: -45px; 
	left: 0px; 
	width: 40px; 
	height: auto;
	}

.role-cyan-box {
    position: absolute;
    top: 0px;
    left: 35px;
	width: 120px;
    height: 120px;
    background-image: url(../assets-new/role-box.png);
	background-repeat: no-repeat;
	}

.role-cyan-box-sm {
	position: absolute;
	top: 0px; 
	left: 0px; 
	width: 50px; 
	height: 49px;
	background-image: url(../assets-new/role-box-25.jpg);
	}

.role-floating-text {
	position: absolute; 
	top: 30px; 
	left: -50%; 
	width: 164px; 
	height: 356px;
	background-image: url(../assets-new/roles-din.png);
	}


.role-location-title {
	position: relative;
	width: 400px; 
	height: auto;
	padding-top: 40px;
	margin-left: 170px; 
	margin-right: auto; 
	text-align: left;
	}

.role-title {
	position: relative;
	width: 660px;
	height: auto;
	padding-left: 25px;
	margin-top: 14px;
	margin-left: 195px;
	margin-right: auto;
	text-align: left;
	}

.role-description {
	position: relative;
    width: 640px; 
    height: auto; 
    text-align: left; 
    padding-left: 25px;
    padding-bottom: 0px;
    margin-top: 10px;
    margin-bottom: 0px;
    margin-left: 195px; 
	margin-right: auto;
   	border-left-color: #cccccc; 
    border-left-width: 1px; 
    border-left-style: solid;
	}

.role-description-bullets {
	position: relative;
	left: 30px;
	width: 610px;
	height: auto;
	text-align: left;
	}

.comment-bullets {
	position: relative;
	left: 30px;
	width: 610px;
	height: auto;
	text-align: left;
	}

.role-description-bullets-2 {
	position: relative;
	left: 30px;
	width: 580px;
	height: auto;
	text-align: left;
	}

.role-contact {
	position: relative;
	width: 665px; 
	height: auto; 
	padding-top: 20px;
    padding-bottom: 20px;
    margin-left: 195px; 
	margin-right: auto;
	margin-bottom: 50px;
	text-align: center;
	border-left-color: #cccccc; 
    border-left-width: 1px; 
    border-left-style: solid;
	}






/* main fonts used */ /* main fonts used */ /* main fonts used */ /* main fonts used */






/* body text standard size */	/* font used for body */
.bodytext-standard {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 16px;
	font-weight: normal;
	color: #7d7d7d;
	line-height: 28px;
	letter-spacing: 0px;
	}

/* roles contact signature smaller font and darker grey*/
.contact-signature {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 15px;
	font-weight: normal;
	color: #666666;
	line-height: 26px;
	letter-spacing: 0px;
	}

/* home page ... our business is ... body text mid grey */ /* font used for body */
.bodytext-hnsm-grey {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 18px;
	font-weight: normal;
	color: #666666;
	line-height: 28px;
	text-align: left;
	letter-spacing: 0px;
	}

/* home page ... it's about you ... body text on grey background dark grey */ /* font used for body */
.bodytext-hnsm-dark {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 16px;
	font-weight: normal;
	color: #333333;
	line-height: 30px;
	letter-spacing: 0px;
	}



	



/* 1st heading top coloured strip in white DNT part of JG corporate identity */
.header-title-one {
	font-family: "Lato Thin","Lato Light",Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 44px;
	font-weight: normal;
	color: #FFFFFF;
	line-height: 60px;
	text-align: center;
	letter-spacing: -1px;
	}

/* 2nd heading top coloured strip in white DNT part of JG corporate identity */
.header-title-two {
	font-family: 'Lato Thin','Lato Light',Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 28px;
	font-weight: normal;
	color: #FFFFFF;
	line-height: 40px;
	text-align: center;
	letter-spacing: 0px;
	}




/* current roles listing 1st heading off white in dark strip */
.title-role {
	font-family: 'Lato Light',"HelveticaNeue-Light", "Helvetica Neue Light",Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 22px;
	font-weight: normal;
	color: #e4e4e4;
	line-height: 36px;
	letter-spacing: 0.02em;
	}

.title-role-w {
	font-family: 'Lato Light',"HelveticaNeue-Light", "Helvetica Neue Light",Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 24px;
	font-weight: normal;
	color: #fff;
	line-height: 36px;
	letter-spacing: 0.02em;
	padding: 65px 0px 10px 0px; /* top right bottom left */
	margin-bottom: 0px;
	}
	
/* current roles listing 2nd heading off white in dark strip */
.title-role-sm {
	font-family: 'Lato Light',"HelveticaNeue-Light", "Helvetica Neue Light",Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 15px;
	font-weight: normal;
	/*color: #fff; */
	line-height: 20px;
	letter-spacing: 0.04em;
	padding: 10px 0px 10px 0px; /* top right bottom left */
	margin-bottom: 0px;
	}

/* current roles Location off white in dark strip */
.title-role-loc {
	position: absolute;
	top: 16px; 
	left: 70px;
	width: 250px; 
	height: auto;
	font-family: 'Lato Light',"HelveticaNeue-Light", "Helvetica Neue Light",Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 15px;
	font-weight: normal;
	color: #e4e4e4;
	line-height: 20px;
	letter-spacing: 0.04em;
	text-align: left;
	}

/* current roles main title mid grey */
.midtitle-role {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 28px;
	font-weight: 300;
	color: #666666;
	line-height: 40px;
	text-align: left;
	letter-spacing: 0.02em;
	}



/* used for peoples names mid grey */
.midtitle-name {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 25px;
	font-weight: 300;
	color: #666666;
	line-height: 40px;
	text-align: left;
	letter-spacing: 0.02em;
	}
	



















/* index top title dark grey */
.title-hn-dark-xl {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 48px;
	font-weight: normal;
	color: #333333;
	line-height: 74px;
	letter-spacing: -2px;
	}

/* common title dark grey */
.title-hn-dark-m {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 36px;
	font-weight: normal;
	color: #333333;
	line-height: 42px;
	letter-spacing: -1px;
	}
		
/* index title medium dark grey */
.title-hn-dark {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 30px;
	font-weight: normal;
	color: #333333;
	line-height: 42px;
	letter-spacing: -1px;
	}

/* index top title dark grey */
.title-blue-xl {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 42px;
	font-weight: normal;
	color: #444444;
	line-height: 74px;
	letter-spacing: -2px;
	}
	


/* endorsement client candidate title mid grey */
.title-hn-lg {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 24px;
	font-weight: normal;
	color: #666666;
	line-height: 40px;
	text-align: left;
	letter-spacing: 0px;
	}

/* index horizontal list mid grey */
.title-hn-m {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 18px;
	font-weight: normal;
	color: #666666;
	line-height: 44px;
	letter-spacing: 0px;
	}

/* endorsement clients title mid grey */
.title-hn-sm {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 18px;
	font-weight: normal;
	color: #666666;
	line-height: 24px;
	text-align: left;
	letter-spacing: 0px;
	}







/* top strip phone numbers light-grey */
.phone-top {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #cccccc;
	line-height: 20px;
	letter-spacing: 0px;
	}

/* footer JG logo*/	
.jg-logo-footer {
	position: relative;
	width: 400px; 
	height: auto; 
	padding-top: 40px;
	margin-left: 30px; 
	margin-right: auto;
	text-align: center;
	}


/* footer phone numbers light-grey*/	
.phone-footer {
	font-family: "Lato Light",Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 13px;
	font-weight: normal;
	color: #cccccc;
	line-height: 20px;
	letter-spacing: 0em;
	text-align: center;
	position: relative;
	width: 400px; 
   	height: auto; 
	margin-left: 30px; 
	margin-right: auto;
	}



/* footer links*/
.links-footer {
	font-family: "Lato Light",Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 13px;
	font-weight: normal;
	text-align: left;
	line-height: 26px;
	letter-spacing: 0em;
	position: absolute; 
	top: 26px; 
	right: 10px; 
	width: 280px; 
	height: auto;
	}

/* footer copyright light grey*/
.copyright {
	font-family: "Lato Light",Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 13px;
	font-weight: normal;
	color: #cccccc;
	text-align: center;
	padding-top: 0px;
	padding-left: 0px;
	padding-bottom: 30px;
	line-height: 20px;
	letter-spacing: 1px;
	}




/* roles blue */
.blue-lg {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 18px;
	font-weight: normal;
	color: #0099ff;
	line-height: 24px;
	letter-spacing: 0px;
	}

/* bright blue */
.blue-sm {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 15px;
	font-weight: normal;
	color: #0099FF;
	line-height: 22px;
	letter-spacing: 0px;
	}




/*  roles 3 dots mid grey */
.three-dots {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 46px;
	font-weight: normal;
	color: #666666;
	line-height: 50px;
	text-align: center;
	margin-bottom: 50px;
	}

#image-strip-coloured-right {
	position: relative; 
	width: 100%; 
	min-width: 1024px;
	height: 300px;
	background-position: right;
}
	

.search-bullets {
	position: relative;
	left: 30px;
	width: 500px;
	height: auto;
	text-align: left;
	}


.search-text-box {
	position: relative;
	width: 540px;
	height: auto;
	text-align: left;
	padding-top: 0px;
	padding-left: 0px;
	padding-bottom: 0px;
	margin-top: 74px;
	margin-bottom: 0px;
	margin-left: 300px;
	margin-right: auto;
	/*border-left-color: #cccccc;
	border-left-width: 1px;
	border-left-style: solid;*/
	}


.search-title {
	position: relative;
	width: 600px;
	height: auto;
	padding-left: 0px;
	padding-top: 60px;
	margin-top: 0px;
	margin-left: 300px;
	margin-right: auto;
	text-align: left;
	}




.search-roles-title {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 20px;
	font-weight: normal;
	color: #7d7d7d;
	/*line-height: 36px;*/
	letter-spacing: 0px;
}

.search-roles-client {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #7d7d7d;
	line-height: 18px;
	padding-left: 15px;
	letter-spacing: 0px;
}

.search-midtitle {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 28px;
	font-weight: 300;
	color: #666666;
	line-height: 40px;
	text-align: left;
	letter-spacing: 0.02em;
}

.search-bullet-title {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 20px;
	font-weight: normal;
	color: #7d7d7d;
	line-height: 40px;
	letter-spacing: 0px;
}

.title-bold {
	font-family: Helvetica Neue,Helvetica,Arial,Verdana,Geneva,sans-serif;
	font-size: 36px;
	font-weight: bold;
	color: #333333;
	line-height: 74px;
	letter-spacing: -2px;
}

/* shadowed card design */
.roles-card-inline {
	float: left;
	position: relative;
	height: auto;
	min-height: 250px;
	width: 100%;
	max-width: 460px;
	margin-top: 15px;
	margin-bottom: 15px;
	margin-left: 35px;
	margin-right: 0px;
	background-color: rgba(0, 0, 0, 0.1);
	border-radius: 2px;
	box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.4); /* h-offset v-offeset blur-radius spread-radius colour */
	}

/* shadowed card design */
.roles-card {
	position: relative;
	height: auto;
	min-height: 320px;
	width: 95%;
	max-width: 456px;
	margin-left: auto;
	margin-right: auto;
	background-color: rgba(0, 0, 0, 0.1);
	border-radius: 2px;
	box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.4); /* h-offset v-offeset blur-radius spread-radius colour */
	}

.roles-list {
	-webkit-text-size-adjust: 100%;
	font-family: 'Lato Light',"HelveticaNeue-Light", "Helvetica Neue Light",Helvetica Neue,Helvetica,sans-serif;
	font-size: 15px;
	font-weight: normal;
	text-align: left;
	color: #e4e4e4;
	line-height: 22px;
	letter-spacing: 0px;
	padding: 10px 10px 10px 45px; /* top right bottom left */
	}