/******************************************************************************

  Script    :   std_style.css
  Author    :   C.E. Berry
  Version   :   5.00.013
  Notes     :   CSS Stylesheet for the MRJ Recruitment website

                All material contained within is the intellectual property of
                SysExcel Ltd and as such may not be reproduced in any way
                shape or form without the prior consent of SysExcel Ltd.

********************************************************************************

    STYLES FOR STANDARD/DEFAULT VERSION OF SITE

********************************************************************************/

/*---  Default elements ---*/

@font-face {
    font-family: 'nowayregular';
    src: url('/fonts/noway-regular-webfont.eot');
    src: url('/fonts/noway-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/noway-regular-webfont.woff2') format('woff2'),
         url('/fonts/noway-regular-webfont.woff') format('woff'),
         url('/fonts/noway-regular-webfont.ttf') format('truetype'),
         url('/fonts/noway-regular-webfont.svg#nowayregular') format('svg');
    font-weight: normal;
    font-style: normal;

    font-family: 'kollektif';
    src: url('/fonts/kollektif.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

:root
{
	--engineering-cyan:  #22CFE0; /* 2018-09-17 */
	--digital-fuchsia:   #FF607B; /* 2018-09-17 */
	--product-gold:      #FFD966; /* 2018-11-26 */
	--product-gold:      #FFFC02; /* 2019-11-21 */
	--mrj-blue:          #001443; /* 2018-09-17 */
	--test-grey:         #E8ECEF; /* 2018-09-17 */
}

body
{
                                font-family: 'Libre Franklin', sans-serif;
                                font-family: nowayregular, Helvetica, Sans-Serif; /* 2019-11-21 */
                                font-family: kollektif, Helvetica, Sans-Serif; /* 2019-11-21 */
                                font-weight: normal;
                                font-size: 14px;
                                color: #646464;
                                overflow-x: hidden;
}

em
{
                                font-style: italic;
}

a
{
                                color: #00AFEF;
                                font-weight: normal;
                                text-decoration: none;
}

p.hide-empty:empty
{
                                display: none;
}

#footer a span.fa-twitter
{
                                color: #1DA1F2;
}

#footer a span.fa-linkedin
{
                                color: #0077B5;
}

a:hover
{
                                color: #00AFEF;
                                font-weight: normal;
                                text-decoration: underline;
}

input
{
                                font-family: nowayregular, Helvetica, Sans-Serif; /* 2019-11-21 */
                                font-family: kollektif, Helvetica, Sans-Serif; /* 2019-11-21 */
                                color: #404040;
                                background: #E8E8E8;
                                border-width: 1px;
                                border-style: solid;
                                border-color: #878787;
                                height: 28px;
                                -moz-border-radius: 0;
                                -webkit-border-radius: 0;
                                border-radius: 0;
                                padding: 5px 0 5px 10px;
                                font-size: 16px;
                                margin: 10px 0 10px 0;
                                border-radius: 10px; /* 2019-11-21 */
}

textarea
{
                                font-family: nowayregular, Helvetica, Sans-Serif; /* 2019-11-21 */
                                font-family: kollektif, Helvetica, Sans-Serif; /* 2019-11-21 */
                                color: #404040;
                                background: #E8E8E8;
                                border-width: 1px;
                                border-style: solid;
                                border-color: #878787;
                                height: 28px;
                                -moz-border-radius: 0;
                                -webkit-border-radius: 0;
                                border-radius: 0;
                                padding: 10px 0 5px 10px;
                                font-size: 16px;
                                margin: 10px 0 10px 0;
                                border-radius: 10px; /* 2019-11-21 */
}

strong
{
                                font-weight: bold;
}

body#timymce h1,
body#timymce h2,
body#timymce h3,
body#timymce h4,
body#timymce h5,
body#timymce h6
{
                                font-size: 100px;
}

div.summary h1,
body#timymce h2,
body#timymce h3,
body#timymce h4,
body#timymce h5,
body#timymce h6
{
                                font-size: 100px;
}

/*--- General styles  ---*/

button::-moz-focus-inner,
input::-moz-focus-inner
{
                                border: 0;
                                padding: 0;
}

.tabletandmobileonly,
.mobileonly
{
                                display: none !important;
}

span.desktoponly,
span.desktopandtabletonly
{
                                display: inline;
}

a.button
{
                                color: #FFFFFF;
                                display: inline-block;
                                text-transform: uppercase;
                                text-align: center;
                                text-decoration: none;
                                cursor: pointer;
                                font-size: 20px;
                                font-size: 16px; /* 2019-11-21 */
                                padding: 14px 30px 14px 30px;
                                padding: 10px 30px 10px 30px; /* 2019-11-21 */
                                margin: 0 0 0 0;
                                line-height: normal;
                                background-color: #FC642C;
                                background-color: #22CFE0; /* 2018-09-17 */
                                background-color: var(--mrj-blue); /* 2019-11-21 */
                                margin: 10px 0; /* 2019-11-21 */
                                border-radius: 10px; /* 2019-11-21 */
}

a.button:hover
{
                                background-color: #313131;
}

a.button2
{
                                color: #FFFFFF;
                                display: inline-block;
                                font-weight: 400;
                                text-align: center;
                                text-decoration: none;
                                cursor: pointer;
                                font-size: 14px;
                                padding: 15px;
                                margin: 10px 0 40px 0;
                                line-height: normal;
                                background-color: #FC642C;
                                text-transform: uppercase;
}

a.button3
{
                                color: #FFFFFF;
                                display: inline-block;
                                text-transform: uppercase;
                                font-weight: 500;
                                text-decoration: none;
                                cursor: pointer;
                                font-size: 20px;
                                padding: 16px 50px 16px 50px;
                                margin: 19px 0 0 0;
                                line-height: normal;
                                background: none;
                                border: 1px solid #FFFFFF;
                                border-radius: 10px;
                                moz-border-radius: 10px;
                                -webkit-border-radius: 10px;
}

a.button3:hover
{
                                background: rgba(0, 0, 0, 0.2);
}

a.button4
{
                                color: #FFFFFF;
                                display: inline-block;
                                text-transform: uppercase;
                                font-weight: 500;
                                text-decoration: none;
                                cursor: pointer;
                                font-size: 16px;
                                padding: 16px 15px 16px 15px;
                                margin: 160px 0 0 40px;
                                line-height: normal;
                                background: none;
                                border: 3px solid #FFFFFF;
                                border-radius: 5px;
                                moz-border-radius: 5px;
                                -webkit-border-radius: 5px;
}

a.buttonright
{
                                float: right;
}

a.buttonnopointer
{
                                cursor: default;
}

a.buttonpaddedleft
{
                                margin-left: 10px;
}

a.buttonpaddedleftmore
{
                                margin-left: 20px;
}

a.buttonpaddedright
{
                                margin-right: 10px;
}

a.buttonpaddedrightmore
{
                                margin-right: 20px;
}

a.buttonpaddedtop
{
                                margin-top: 10px;
}

a.buttonpaddedbottom
{
                                margin-bottom: 10px;
}

a.buttonpaddedbottommore
{
                                margin-bottom: 30px;
}

p.buttoncentred,
a.buttoncentred /* 2018-11-13 */
{
                                text-align: center !important;
}

.inputerror
{
                                background-color: #FFD162;
}

div.error
{
                                background: #FFA902;
                                -moz-border-radius: 0;
                                -webkit-border-radius: 0;
                                border-radius: 0;
}

div.error p
{
                                padding: 20px;
                                line-height: 130%;
                                font-size: 16px;
                                color: #000000;
}

div.error p b
{
                                font-weight: bold;
}


/*--- Navigation ---*/

div#navigation
{
                                margin-top: 0;
		                        z-index: 6;
		                        z-index: 5; /* 2021-06-02 was covering up new in page navigation links
		                        text-align: center;
		                        position: relative;
/* 2019-11-21 new layout
		                        min-height: 120px; /* 2018-05-14 for info pages * /

                                background-color: var(--mrj-blue); /* 2019-08-08 * /
*/
                                height: 25vh; /* 2019-11-28 */
                                height: 30vh; /* 2022-03-08 2021-04-08 */
}

/* 2019-11-21 sidelined new layout
body#home-body div#navigation
{
                                background-color: #fff; /* 2019-08-08 * /
}
*/

div#navigation h1
{
	                            color: #FFFFFF;
	                            color: var(--digital-fuchsia); /* 2018-09-17 */
	                            font-size: 22px;
	                            font-weight: 300;
	                            float: right;
	                            margin: 30px 20px 0 0;
}

div#navigation a.button /* 2018-11-26 */
{
	                            float: right;
                                font-size: 16px;;
                                background-color: var(--digital-fuchsia);
                                color: #ffffff;
                                padding: 9px 10px 9px 10px;
                                margin: 20px 40px 0 0;
                                font-weight: 100;
                                border-style: solid;
                                border-width: 1px;
                                border-color: #878787;
                                border-radius: 5px;
}

div#navigation img.menu
{
	                            float: left;
	                            margin: 30px 0 0 20px;
}

div#navigation img.logo
{
	                            float: left;
	                            margin: 20px 0 0 20px;
	                            margin: 0 0 0 20px; /* 2019-07-31 */
	                            height: 25vh; /* 2019-11-26 */
	                            height: 30vh; /* 2021-04-08 */
}

div#mobilesitemenu
{
                                display: none;
}

div#mobilesitemenuoptions
{
    	                        display: none;
}

div#sitemenuoptions
{
    	                        display: block;
}

div.sidenavigation
{
                                height: 100%;
                                width: 0;
                                position: fixed;
                                z-index: 99;
                                top: 0;
                                left: 0;
                                background: rgba(92,92,92,0.9);
                                overflow-x: hidden;
                                padding-top: 50px;
                                transition: 0.5s;
}

div.sidenavigation ul
{
                                padding-top: 30px;
}

div.sidenavigation ul li
{
                                padding: 20px 0 20px 10px;
                                font-size: 18px;
                                text-transform: uppercase;
                                color: #FFFFFF;
}

div.sidenavigation ul li a
{
                                color: #FFFFFF;
			                    -moz-transition: background-color .2s ease-in-out;
			                    -webkit-transition: background-color .2s ease-in-out;
			                    -o-transition: background-color .2s ease-in-out;
			                    -ms-transition: background-color .2s ease-in-out;
			                    transition: background-color .2s ease-in-out;
                                padding: 10px 10px;
}

div.sidenavigation ul li a:hover
{
                                color: #FFFFF;
                                cursor: pointer;
                                text-decoration: none;
                                background-color: #CBCBCB;
}

div.sidenavigation img.menu
{
                                position: absolute;
                                top: 30px;
                                left: 20px;
}


div.sidenavigation p.menu
{
                                position: absolute;
                                left: 65px;
                                top: 36px;
                                color: #FFFFFF;
                                font-size: 20px;
	                            font-weight: 300;
}

/*---  Background video  ---*/

div#backgroundvideo
{
                                position: absolute;
                                left: 0;
                                top: 0;
		                        z-index: 1;
		                        z-index: -1; /* 2019-11-24 */
		                        overflow: hidden;
		                        width: 100%;
}

div#backgroundvideo div.overlay
{
                                background: rgba(30, 30, 30, 0.75);
                                background: rgba(30, 30, 50, 0.82); /* 2018-10-25 experiment */
                                background: rgba(5,  5,  50, 0.82); /* 2019-11-25 experiment */
                                background: rgba(5,  5,  50, 0.30); /* 2021-04-08 now an image rather than video */
                                position: absolute;
                                z-index: 2;
                                width: 100%;
                                height: 100%;
                                top: 0;
                                left: 0;
}

div#backgroundvideocontainer
{
                                margin-top: 0;
}

/*--- Homepage ---*/

#homepage
{
                                margin-top: 0;
		                        z-index: 5;
		                        position: relative;
                                height: 510px; /* 2018-10-25 */
                                height: 310px; /* 2019-07-29 */
                                height: 80vh; /* 2019-11-21 */
}

#homepage h1,
#homepage h2.h1butforseo
{
                                font-size: 54px;
                                font-size: 60px; /* 2018-10-25 */
                                font-size: 65px; /* 2019-07-31 */
                                font-size: 55px; /* 2019-11-21 */
                                font-size: 70px; /* 2021-04-08 */
                                font-weight: 500;
                                font-weight: 700;
                                color: #FFFFFF;
                                color: #000000; /* 2019-07-25 */
                                color: #FFFFFF; /* 2019-11-21 */
                                text-align: center;
                                margin: 110px 0 0 0;
                                margin: 70px 0 70px 0; /* 2018-09-17 */
                                margin: 135px 0 70px 0; /* 2018-10-25 */
                                margin: 135px 0 10px 0; /* 2018-22-26 */
                                margin: 40px 0 0 0; /* 2019-07-30 */
                                margin: 0 0 0 0; /* 2019-11-26 */
                                padding-top: 15vh;
                                padding-top: 10vh; /* 2021-04-08 */
                                letter-spacing: -3px;
                                letter-spacing: 0; /* 2019-11-21 */
                                height: 20vh; /* 2019-11-21 */
}

#homepage h1 span.highlight1
{
	                            color: #FC642C;
	                            color: #EEEEEE; /* 2018-09-17 */
}

#homepage h1 span.highlight2
{
	                            color: #4BFCF6;
	                            color: var(--engineering-cyan); /* 2018-09-17 */
}

#homepage h1 span.highlight3
{
	                            color: #9747A0;
	                            color: #FF60FF; /* re-used 2018-06-04 for eCOMMERCE tagline */
	                            color: var(--digital-fuchsia); /* 2018-09-17 */
}

#homepage h2
{
                                font-size: 34px;
                                color: #FFFFFF;
                                text-align: center;
                                margin: 15px 0 105px 0;
                                font-weight: 400;
}

#homepage h3, /* pressed into use for the coloured divisions under the unearthing banner */
#search-body h3
{
                                font-size: 28px;
                                color: #FFFFFF;
                                text-align: center;
                                margin: 15px 0 85px 0;
                                margin: 25px 0 0 0; /* 2019-07-31 */
                                margin-top: 8vh; /* 2019-11-26 */
                                margin-top: 3vh; /* 2021-08-04 */
                                font-weight: 500;
}

#search-body h3
{
                                margin: 0; /* 2019-07-31 */
}

#homepage div.search-container
{
                                padding-top: 70px;
                                padding-bottom: 150px;
}

#jobssearch div.search-container /* 2019-11-21 */
{
                                min-height: 40vh;
                                text-align: center;
}

@media only screen and
(max-width: 800px)
{
    #jobssearch div.search-container /* 2019-11-21 */
    {
                                 min-height: 55vh;
    }
}

#jobssearch div.search-container p:first-child /* 2019-11-21 */
{
                                font-size: 30px;
                                font-weight: bold;
                                color: black;
}

#jobssearch div.search-container p:last-child /* 2019-11-21 */
{
                                margin: 20px;
                                font-size: 20px;
                                color: black;
}

#jobssearch a.button /* 2019-11-21 */
{
                                width: 140px;
                                height: 20px;
}

#homepage div.spacer
{
                                height: 140px;
                                height: 240px; /* 2018-10-10 */
                                height: 190px; /* 2018-10-25 */
                                height: 0px; /* is this needed now? */
}

#homepage input /* 2018-09-17 */
{
                                background: transparent;
                                color: #DDDDDD;
                                border-radius: 5px;
                                width: 100%;
}

#homepage a.button /* 2018-09-17 */
{
                                font-size: 16px;;
                                background-color: var(--engineering-cyan);
                                background-color: var(--digital-fuchsia); /* 2018-10-25 */
                                color: #878787;
                                color: #ffffff;
                                padding: 9px 10px 9px 10px;
                                margin: 10px 0 0 0;
                                font-weight: 100;
                                border-style: solid;
                                border-width: 1px;
                                border-color: #878787;
                                border-radius: 5px;
}

#search-body span.engineering,
#homepage span.engineering
{
                                color: var(--engineering-cyan);
                                color: var(--engineering-cyan);
}

#search-body span.digital,
#homepage span.digital
{
                                color: #FF607B;
                                color: var(--digital-fuchsia);
}

#search-body span.product,
#homepage span.product
{
                                color: #FFD966;
                                color: var(--product-gold);
}


/*--- Hot jobs section ---*/

#hotjobs
{
                                background: #FFFFFF;
		                        z-index: 5;
		                        position: relative;
}

#hotjobs div.slideshowcontainer
{
                                position: relative;
                                margin-left: auto;
                                margin-right: auto;
                                margin-top: 40px;
                                margin-top: 20px; /* 2018-10-25 */
}

#hotjobs div.slideshowcontainer div.vseparatorhider
{
                                position: absolute;
                                background-color: #FFFFFF;
                                width: 1px;
                                height: 232px;
                                top: 0;
                                left: 0;
                                z-index: 15;
}

#hotjobs div.jobsummary
{
                                width: 470px;
                                width: 400px; /* 2018-05-02 for new layout */
                                width: 380px; /* 2018-05-08 for new layout */
                                height: 192px;
                                position: relative;
}

#hotjobs div.jobsummary:hover
{
                                /* retired grey background in favour of orange background then overlay
                                background: #F2F2F2;
                                background: rgba(252, 100, 44, 0.8);
                                */
}

#hotjobs div.jobsummary a:hover
{
                                text-decoration: none;
}

#hotjobs div.jobsummary h2
{
                                color: #02225E;
                                padding: 10px 20px;
                                font-size: 20px;

}

#hotjobs div.jobsummary h3
{
                                color: #000000;
                                padding: 10px 20px;
                                font-size: 17px;
}

#hotjobs div.jobsummary p
{
                                font-size: 15px;
                                line-height: 130%;
                                color: #8F9598;
                                padding: 10px 20px;
}

#hotjobs div.jobsummary div.vseparator
{
                                background-color: #E0E0E0;
                                position: absolute;
                                top: 10px;
                                left: 0;
                                width: 1px;
                                height: 177px;
}

#hotjobs div.spacer
{
                                height: 20px;
}

#hotjobs span#bxsliderjobs-prev,
#jobssummaries span#bxsliderjobs-prev
{
                                position: absolute;
                                top: 110px;
                                left: 20px;
}

#hotjobs span#bxsliderjobs-next,
#jobssummaries span#bxsliderjobs-next
{
                                position: absolute;
                                top: 110px;
                                right: 20px;
}

#jobssummaries span#bxsliderjobs-next,
#jobssummaries span#bxsliderjobs-prev
{
                                top: 380px;
                                top: 500px; /* 2019-08-09 */
                                top: 250px; /* 2019-11-21 */
}

#hotjobs span#bxsliderjobs-prev img,
#hotjobs span#bxsliderjobs-next img,
#jobssummaries span#bxsliderjobs-prev img,
#jobssummaries span#bxsliderjobs-next img
{
                                opacity: 0.2;
}

/*++ 2018-05-04 to implement orange hover overlay */

#hotjobs div.jobsummary div.overlay
{
                                height: 100%;
                                width: 100%;
                                position: absolute;
                                top: 0;
                                left: 0;
                                background: rgba(252, 100, 44, 0.8);
                                background: rgba(34, 207, 224, 0.8); /* 2018-09-17 */
                                display: none;
}

#hotjobs div.jobsummary:hover div.overlay
{
                                display: inline;
}

#hotjobs div.jobsummary div.overlay a.button4
{
                                margin: 70px 0 0 125px;
}

/*-- 2018-05-04 */


/*--- About section ---*/

#about
{
                                background: #FFFFFF;
                                background: #FF607B; /* 2018-09-17 */
                                background: #FFFFFF; /* 2019-07-25 */
		                        z-index: 5;
		                        position: relative;
                                height: 510px; /* 2018-10-25 */
                                height: 610px; /* 2019-07-29 */
}

#about div.hseparator
{
                                background-image: url("../site_graphics/grey_pixel.gif");
                                background-position: 50% 50%;
                                background-repeat: repeat-x;
                                height: 30px;
                                display: none; /* 2018-09-17 suppressed */
}

#about h1,
#about h2.h1butforseo
{
                                font-size: 50px;
                                font-size: 40px; /* 2018-09-17 more verbage wraps at >40px */
                                font-size: 50px; /* 2019-07-29 */
                                font-size: 30px; /* 2019-11-21 */
                                color: #02225E;
                                color: #FFFFFF; /* 2018-09-17 */
/* retired 2019-11-21
                                padding: 25px 0 20px 0;
                                padding: 75px 0 20px 0; /* 2018-09-17 * /
                                padding: 135px 0 20px 0; /* 2018-10-25 * /
                                line-height: 120%;
                                font-weight: 500;
                                letter-spacing: -2px;
                                line-height: 140%;
*/
}

#about p
{
                                font-size: 14px;
                                font-size: 16px; /* 2019-07-29 */
                                font-size: 20px; /* 2019-07-31 */
                                color: #646464;
                                color: #E8ECEF; /* 2018-09-17 */
                                margin: 10px 20px 20px 0;
                                text-align: justify;
                                line-height: 140%;
                                line-height: 1.2em; /* 2019-07-31 */
}

#about p
{
                                font-size: 14px;
                                font-size: 16px; /* 2019-07-29 */
                                font-size: 20px; /* 2019-07-31 */
                                color: #646464;
                                color: #E8ECEF; /* 2018-09-17 */
                                color: #000000; /* 2019-11-21 */
                                margin: 10px 20px 20px 0;
                                text-align: justify;
                                text-align: center; /* 2019-11-21 */
                                line-height: 140%;
                                line-height: 1.2em; /* 2019-07-31 */
                                line-height: 1.6em; /* 2019-11-21 */
}

@media only screen and
(max-width: 568px)
{
    #about p
    {

                                font-size: 16px; /* 2019-08-09 */
    }
}

#about p b
{
                                color: #000000;
                                font-weight: 600;
}

#about div.spacer
{
                                height: 75px;
}

/*--- Clients page ---*/

#clients
{
                                background: #FFFFFF;
		                        z-index: 5;
		                        position: relative;
}

#clients div.hseparator
{
                                background-image: url("../site_graphics/grey_pixel.gif");
                                background-position: 50% 50%;
                                background-repeat: repeat-x;
                                height: 30px;
                                display: none; /* 2018-09-17 suppressed */
}

#clients img
{
                                float: left;
                                margin: 40px 20px 40px 20px;
                                margin: 5px 20px 5px 20px; /* 2019-07-29 */
                                max-height: 60px; /* 2019-07-29 for smaller grid layout*/
}

/*--- Testimonials section ---*/ /* 2018-09-17  new panel */

#testimonials
{
                                background: #E8ECEF; /* 2018-09-17 */
                                background: #001443; /* 2018-10-25 */
                                background: #FFFFFF; /* 2019-07-29 */
		                        z-index: 5;
		                        position: relative;
                                height: 510px; /* 2018-10-25 */
                                height: 610px; /* 2019-07-29 */

}

#testimonials div.hseparator
{
                                background-image: url("../site_graphics/grey_pixel.gif");
                                background-position: 50% 50%;
                                background-repeat: repeat-x;
                                height: 30px;
                                display: none; /* 2018-09-17 suppressed */
}

#testimonials h1
{
                                font-size: 40px;
                                color: #000000;
                                color: #ffffff;
                                color: var(--product-gold); /* 2019-07-29 */
                                padding: 75px 0 75px 0;
                                padding: 100px 0 20px 0; /* 2018-10-25 */
                                padding: 0; /* 2019-07-29 */
                                line-height: 120%;
                                font-weight: 500;
                                letter-spacing: -2px;
                                line-height: 140%;
}

#testimonials hr
{
                                background-color: #ffffff;
                                border-style: solid;
                                border-width: 1px;
                                margin-bottom: 20px;
}

#testimonials div.eight.gridcolumns
{
                                min-height: 300px;
}

#testimonials div.panel
{
                                background-color: white;
                                vertical-align: middle;
                                margin-top: 70px;
                                padding-top: 20px;
                                padding-bottom: 20px;
}

#testimonials p b
{
                                color: #000000;
                                font-weight: 600;
}

#testimonials div.spacer
{
                                height: 75px;
}

/*
#testimonials div.panel p::first-child::first-letter
*/
#clients span.coloured-quote,
#testimonials span.coloured-quote,
#testimonials p.largequote::before
{
                                content: "\201C";
                                font-size: 150%;
                                color:     var(--engineering-cyan);
                                color:     var(--digital-fuchsia);
}

/*--- People page ---*/

#people
{
                                background: #FFFFFF;
		                        z-index: 5;
		                        position: relative;
		                        min-height: 100vh;
}

#people div.gridcolumns /* 2018-09-17 to centre hx tags*/
{
                                text-align: center;
}

#people p
{
                                font-size: 15px;
                                color: #000000;
/* removed 2019-11-26
                                margin: 10px 20px 20px 0;
                                margin: 0px 20px 0px 0; /* 2018-09-17 * /
*/
                                text-align: center;
                                line-height: 140%;
}

#people div.hseparator
{
                                background-image: url("../site_graphics/grey_pixel.gif");
                                background-position: 50% 50%;
                                background-repeat: repeat-x;
                                height: 30px;
                                display: none; /* 2018-09-17 suppressed */
}
#people h1,
#people h2.h1butforseo
{
                                font-size: 42px;
                                color: #000000;
                                color: #FFFFFF; /* 2018-09-17 */
                                color: #001443; /* 2018-11-13 */
                                background-color: #001443; /* 2018-09-17 */
                                background-color: #ffffff; /* 2018-11-13 */
                                background-color: transparent; /* 2019-11-21 */
                                text-align: center;
                                margin: 36px 0 43px 0;
                                margin: 20px 0 0px 0; /* 2018-11-13 */
                                margin-left: auto; /* 2018-09-17 */
                                margin-right: auto; /* 2018-09-17 */
                                margin: 20px 0 0 10px; /* 2019-11-21 */
                                margin: 0; /* 2019-11-26 */
                                display: inline-block; /* 2018-09-17 */
                                padding: 20px; /* 2018-09-17 */
                                padding: 0px; /* 2018-11-13 */
                                text-transform: uppercase;
                                text-transform: capitalize; /* 2018-09-17 */
                                font-weight: 500;
                                letter-spacing: -2px;
                                letter-spacing: 0;/* 2019-11-21 */
                                font-weight: 700; /* 2019-11-21 */
                                line-height: 120%; /* 2019-11-21 */
                                width: 100%;/* 2019-11-21 */
                                text-align: center; /* 2019-11-21 */
}

#people div.slideshowcontainer
{
                                position: relative;
                                margin-left: auto;
                                margin-right: auto;
                                margin-top: 50px;
                                margin-top: 0; /* 2019-11-26 */
}

#people div.peoplesummary
{
                                width: 313px;
                                width: 235px; /* 2019-22-21 */
                                height: 490px;
                                height: 390px; /* 2018-09-17 */
                                height: 500px; /* 2019-07-29 */
                                height: 650px; /* 2019-08-07 */
                                height: 380px; /* 2019-11-21 */
                                position: relative;
}

#people div.peoplesummary img.headshot0_1,
#people div.peoplesummary img.headshot0_2,
#people div.peoplesummary img.headshot0_3,
#people div.peoplesummary img.headshot0_4,
#people div.peoplesummary img.headshot0_5,
#people div.peoplesummary img.headshot0_6,
#people div.peoplesummary img.headshot0_7,
#people div.peoplesummary img.headshot0_8,
#people div.peoplesummary img.headshot0_9,
#people div.peoplesummary img.headshot0_10,
#people div.peoplesummary img.headshot0_11,
#people div.peoplesummary img.headshot0_12,
#people div.peoplesummary img.headshot0_13,
#people div.peoplesummary img.headshot0_14,
#people div.peoplesummary img.headshot0_15,
#people div.peoplesummary img.headshot0_16,
#people div.peoplesummary img.headshot0_17,
#people div.peoplesummary img.headshot0_18,
#people div.peoplesummary img.headshot0_19,
#people div.peoplesummary img.headshot0_20
{
                                width: 220px;
                                height: 220px;
                                width: 250px; /* 2019-07-29 */
                                height: 250px; /* 2019-07-29 */
                                height: auto; /* 2019-07-31 */
                                width: 180px; /* 2019-11-21 */
                                background-size: cover;
                                display: block;
                                border-radius: 110px;
                                -webkit-border-radius: 110px;
                                -moz-border-radius: 110px;
                                margin: 15px auto 10px auto;
                                cursor: pointer;
                                -webkit-border-radius: 0px; /* 2019-07-29 */
                                -moz-border-radius: 0px; /* 2019-07-29 */
                                border-radius: 50%; /* 2019-11-21 */
                                -webkit-border-radius: 50%; /* 2019-11-21 */
                                -moz-border-radius: 50%; /* 2019-11-21 */
}

#people div.peoplesummary img.headshot1_1,
#people div.peoplesummary img.headshot1_2,
#people div.peoplesummary img.headshot1_3,
#people div.peoplesummary img.headshot1_4,
#people div.peoplesummary img.headshot1_5,
#people div.peoplesummary img.headshot1_6,
#people div.peoplesummary img.headshot1_7,
#people div.peoplesummary img.headshot1_8,
#people div.peoplesummary img.headshot1_9,
#people div.peoplesummary img.headshot1_10,
#people div.peoplesummary img.headshot1_11,
#people div.peoplesummary img.headshot1_12,
#people div.peoplesummary img.headshot1_13,
#people div.peoplesummary img.headshot1_14,
#people div.peoplesummary img.headshot1_15,
#people div.peoplesummary img.headshot1_16,
#people div.peoplesummary img.headshot1_17,
#people div.peoplesummary img.headshot1_18,
#people div.peoplesummary img.headshot1_19,
#people div.peoplesummary img.headshot1_20
{
                                width: 220px;
                                height: 220px;
                                background-size: cover;
                                display: block;
                                border-radius: 110px;
                                -webkit-border-radius: 110px;
                                -moz-border-radius: 110px;
                                margin: 15px auto 10px auto;
                                display: none;
                                cursor: pointer;
}

#people div.peoplesummary img.indicator
{
                                position: absolute;
                                bottom: 0px;
                                left: 132px;
}

#people div.peoplesummary h2
{
                                color: #FC642C;
                                color: #FF607B; /* 2018-09-17 */
                                color: #000000; /* 2019-07-29 */
                                padding: 46px 20px 10px 20px;
                                padding: 26px 20px 10px 20px; /* 2018-09-17 */
                                font-size: 24px;
                                text-align: center;
                                text-align: left; /* 2019-07-29 */
                                cursor: pointer;
                                font-weight: 400;
}

#people div.peoplesummary  h2:hover
{
                                color: #000000;
}

#people div.peoplesummary p
{
                                font-size: 20px;
                                line-height: 130%;
                                color: #646464;
                                color: #000000; /* 2019-07-29 */
                                padding: 20px 20px;
                                padding: 0px 0px; /* 2018-09-17 */
                                padding: 0px 20px; /* 2019-07-29 */
                                text-align: center;
                                text-align: left; /* 2019-07-29 */
                                font-weight: 200;
                                font-size: 16px; /* 2019-11-26  */
                                text-align: center; /* 2019-11-26  */
}

#people div.peoplesummary p.socialmedia
{
                                margin-right: 80px;
                                color: #646464;
                                margin-top: 30px;
                                margin-right: auto;
                                margin-left: auto;
                                font-size: 20px; /* 2019-11-26  */
}

#people div.peoplesummary p.socialmedia a
{
                                color: #646464;
                                color: #ffffff; /* 2019-07-31 */
                                background-color: #000000; /* 2019-07-31 */
                                padding: 5px;
}

#people span#bxsliderpeople-prev
{
                                position: absolute;
                             /* top: 180px; */
                                bottom: 200px; /* 2018-09-17 */
                                left: 20px;
}

#people span#bxsliderpeople-next
{
                                position: absolute;
                             /* top: 180px; */
                                bottom: 200px; /* 2018-09-17 */
                                right: 20px;
}

#people span#bxsliderpeople-prev img,
#people span#bxsliderpeople-next img
{
                                opacity: 0.4;
}

#people span.coloured-quote
{
                                font-size: 400%;
                                color:     var(--digital-fuchsia);
}

div.people2
{
                                width: 100%;
                                height: 380px;
                                background-color: #000000;
		                        position: relative;
		                        z-index: 5;
}

div.people2 div.peopledetails h2
{
                                font-family: xFranklinGothicLTBookCp, sans-serif;
                                font-size: 22px;
                                color: #FFFFFF;
                                padding: 15px 0 5px 0;
                                line-height: 130%;
}

div.people2 div.peopledetails p
{
                                color: #8F9598;
                                padding: 10px 0 10px 0;
                                line-height: 130%;
}

div.people2 div.peopledetails p.quote
{
                                font-style: italic;
                                font-size: 22px;
}

div.people2 div.peopledetails p.about
{
                                padding: 5px 0 5px 0;
                                line-height: 130%;
}

div.people2 div.peopledetails p b
{
                                font-weight: bold;
                                color: #FFFFFF;
}

div.people2 div.peopledetails p a
{
                                text-decoration: none;
}

/*--- Footer/Contact section ---*/

/*-- New - 03/05/18 - start --*/

#footer
{
                                background: #000000;
                                background: #001443; /* 2018-10-25 */
                                background-color: var(--mrj-blue); /* 2019-11-26 */
		                        z-index: 5;
		                        position: relative;
                                background-image: url('/site_graphics/mrj_background.png'); /* 2021-04-10 */
                                background-size: 100%
}

#footer h1,
#footer h2.h1butforseo
{
                                font-size: 50px;
                                font-size: 24px; /* 2018-09-17 */
                                color: #FFFFFF;
                                color: var(--digital-fuchsia); /* 2018-09-17 */
                                color: #FFFFFF;  /* 2021-04-10 */
                                margin: 50px 0 40px 0;
                                margin: 20px 0 20px 0; /* 2018-09-17 */
                                font-weight: 500;
}

#footer h2
{
                                font-size: 28px;
                                color: #FFFFFF;
                                margin: 55px 0 10px 0;
}

#footer p
{
                                font-size: 24px;
                                font-size: 18px; /* 2018-09-17 */
                                color: #FFFFFF;
                                margin: 20px 0 0 0;
                                margin: 0px 0 0 0;  /* 2018-09-17 */
                                font-weight: 300;
                                line-height: 160%;

}

#footer p span.link
{
                                text-decoration: underline;
                                text-decoration: none; /* 2018-09-17 */
                                color: #4EF0DD;
                                color: #FFFFFF; /* 2018-09-17 */
}

#footer p span.link a
{
                                text-decoration: underline;
                                text-decoration: none; /* 2018-09-17 */
                                color: #4EF0DD;
                                color: #FFFFFF; /* 2018-09-17 */
}

#footer br.socmedia
{
                                display: none;
}

#footer p span.link a:hover /* 2018-09-17 */
{
                                text-decoration: underline;
}

#footer p.largequote
{
                                font-size: 40px;
                                color: #FC642C;
                                margin: 20px 0 0 0;
                                font-weight: 500;
                                line-height: 140%;
                                text-align: right;

}

#footer p.quote
{
                                font-size: 20px;
                                color: #FFFFFF;
                                margin: 40px 0 0 0;
                                line-height: 140%;
                                text-align: right;

}

#footer p.quotename
{
                                font-size: 24px;
                                color: #FFFFFF;
                                margin: 40px 0 0 0;
                                line-height: 140%;
                                text-align: right;
                                font-style: italic;

}

#footer p.address
{
                                font-size: 20px;
                                font-size: 18px; /* 2018-09-17 */
                                color: #FFFFFF;
                                margin: 0 0 30px 0;
                                line-height: 160%;

}

#footer p.socmedia
{
                                font-size: 20px;
                                color: #FFFFFF;
                                margin: 37px 0 30px 0;
                                line-height: 165%;

}

#footer p.socmedia a
{
                                text-decoration: underline;
                                color: #4EF0DD;
}

/*
div#footer:after / * 2018-09-17 creates diagonal flash overlay to the right of footer * /
{
                                content: '';
                                position: absolute;
                                top: 0;
                                left: 65%;
                                border-bottom: 200px solid #22CFE0;
                                border-left: 200px solid transparent;
                                width: 1000px;
}
*/


/*-- New - 03/05/18 - end --*/

div#backgroundfooterimage
{
                            background-color: #001443; /* 2018-10-25 */
	                        z-index: -1;
	                        overflow: hidden;
	                        width: 100%;
	                        position: absolute;
}

div#backgroundfooterimagecontainer
{
                            margin-top: 0;
                            overflow: hidden;
                            max-height: 720px;
}

div#backgroundfooterimagecontainer img
{
                            width: 100%;
                            height: 100%;
                            max-width: 100%;
                            max-height: 720px;
}

/*--- Subfooter ---*/

#subfooter
{
                                background: #FFFFFF;
		                        z-index: 5;
		                        position: relative;
		                        text-align: center;
}

#subfooter ul
{
                                margin: 20px auto 0 auto;
                                margin: 10px auto 0 auto; /* 2018-09-17 */
                                padding: 0 0 20px 0;
                                padding: 0 0 10px 0; /* 2018-09-17 */
}

#subfooter ul li
{
                                display: inline;
                                font-family: Verdana, sans-serif;
                                font-size: 11px;
                                font-size: 10px; /* 2018-10-25 */
                                font-weight: normal;
}

#subfooter ul li.separator
{
                                color: #000000;
                                padding: 0 3px 0 3px;
}

#subfooter ul li a
{
                                font-weight: normal;
                                color: #000000;
}

#subfooter ul li a:hover
{
                                text-decoration: underline;
                                color: #000000;
}

#subfooter p
{
                                color: #000000;
                                padding: 0;
                                padding: 0 0 15px 0;
                                font-size: 11px;
                                font-weight: normal;
}

/*--- Jobs page ---*/

#jobspage
{
                                margin-top: 0;
		                        z-index: 5;
		                        position: relative;
/* 2019-11-21
                                background-color: var(--engineering-cyan); /* 2018-09-24 * /
                                background-color: var(--mrj-blue); /* 2019-07-30 * /
*/
                                height: 510px; /* 2018-11-13 */
                                height: 410px; /* 2019-07-30 */
}

@media only screen and
(max-width: 568px)
{
    #jobspage
    {
                                height: 210px; /* 2019-07-31 */
    }
}


#jobspage h1
{
                                font-size: 54px;
                                font-weight: 500;
                                color: #FFFFFF;
	                            color: #FF607B; /* 2018-09-17 */
	                            color: #001443; /* 2018-09-24 */
                                text-align: center;
                                margin: 40px 0 0 0;
                                letter-spacing: 0;
                                font-size: 65px; /* 2019-07-31 */
                                font-weight: 700; /* 2019-07-31 */
                                color: var(--product-gold); /* 2019-07-31 */
}

#jobspage h2
{
                                font-size: 34px;
                                color: #FFFFFF;
                                text-align: center;
                                margin: 15px 0 10px 0;
                                font-weight: 400;
}

#jobspage p.pcentred
{
                                font-size: 16px;
                                color: #FFFFFF;
                                text-align: center;
                                margin: 15px 0 10px 0;
                                font-weight: 400;
}

#jobspage div.spacer
{
                                height: 20px;
}

a#moresearchlink /* 2018-09-17 */
{
                                background-color: #FF607B;
                                background-color: transparent; /* 2019-07-30 */
                                font-size: 32px; /* 2019-07-30 */
                                color: black; /* 2019-07-30 */
}

#jobssearch,
#jobssummaries
{
/* 2019-07-29
                                background: #F2F2F2;
*/
		                        z-index: 5;
		                        position: relative;
                                background-color: #ffffff; /* 2019-11-21 */
}

#jobssummaries div.searchall,
#jobssummaries-moved div.searchall
{
                                margin: 30px 0 30px 15px;
                                border-width: 0 0 1px 0;
                                border-style: solid;
                                border-color: #FFFFFF #FFFFFF #000000 #FFFFFF;
                                font-size: 18px;
}

#jobssummaries input.searchall,
#jobssummaries-moved input.searchall
{
                                border-width: 0;
                                background: transparent;
                                margin: 20px 0 0 5px;
                                font-size: 18px;
                                width: 250px;
}

#jobssummaries a.button,
#jobssummaries-moved a.button
{
                                margin: 30px 15px 40px 0;
                                margin: 5px 10px 20px 0; /* 2019-07-30 */
                                padding: 6px 5px; /* 2019-07-30 */
                                width: 220px;
                                width: 200px; /* 2019-07-30 */
                                height: 28px; /* 2019-07-30 */
                                border-radius: 10px; /* 2019-07-30 */
}

#jobssummaries-moved a.button
{
                                background-color: var(--digital-fuchsia);
}

#jobssummaries p,
#jobssummaries-moved p
{
                                margin: 0 0 0 15px;
}

#jobssummaries input.what,
#jobssummaries-moved input.what
{
                                width: 433px;
                                margin: 5px 0 0 0;
}

#jobssummaries input.where,
#jobssummaries-moved input.where
{
                                width: 292px;
                                margin: 5px 0 0 0;
}

body#home-body #jobssummaries input.what,
body#home-body #jobssummaries-moved input.what,
body#home-body #jobssummaries input.where,
body#home-body #jobssummaries-moved input.where
{
                                width: 200px; /* 2019-07-30 */
                                border-radius: 10px; /* 2019-07-30 */
}

#jobssummaries select.where,
#jobssummaries-moved select.where
{
                                width: 130px;
}

#jobssummaries select.salary,
#jobssummaries-moved select.salary
{
                                width: 213px;
}

#jobssummaries select.job,
#jobssummaries-moved select.job
{
                                width: 268px;
}

#jobssummaries select.added,
#jobssummaries-moved select.added
{
                                width: 218px;
}

#jobssummaries div#moresearch div.leftcolumn,
#jobssummaries-moved div#moresearch div.leftcolumn
{
                                padding-left: 20px;
}

#jobssummaries div#moresearch a.button,
#jobssummaries-moved div#moresearch a.button
{
                                margin: 22px 20px 20px 0;
                                margin: 30px 15px 40px 0; /* 2019-08-09 */
                                width: 80px;
}

#jobssummaries p.label,
#jobssummaries-moved p.label
{
                                margin-top: 20px;
}

#jobssummaries p.label2,
#jobssummaries-moved p.label2
{
                                margin-top: 10px;
}

#jobssummaries a#stdsearchlink,
#jobssummaries-moved a#stdsearchlink
{
                                color: #757575;
                                text-decoration: underline;
}

#jobssummaries a#stdsearchlink:hover,
#jobssummaries-moved a#stdsearchlink:hover
{
                                cursor: pointer;
}

#jobssummaries a#stdsearchlink p,
#jobssummaries-moved a#stdsearchlink p
{
                                margin: 0 0 20px 20px;
}

#jobssummaries div.summary
{
                                width: 180px;
                                float: left;
                                background: #FFFFFF;
                                background: #eeeeee; /* 2019-07-31 */
                                margin: 0 12px 24px 12px;
                                margin: 0 12px 100px 12px; /* 2019-07-31 */
                                margin: 0 12px 50px 12px; /* 2019-11-21 */
                                padding: 15px;
                                height: 380px;
		                        position: relative;
}

#jobssummaries div.summary h2
{
                                font-size: 14px;
                                color: #000000;
                                margin: 0 0 10px 0;
                                font-weight: 600;
                                line-height: 160%;
}

#jobssummaries div.summary h3
{
                                font-size: 14px;
                                color: #000000;
                                margin: 15px 0 5px 0;
                                line-height: 160%;
                                font-weight: 600;
}

#jobssummaries div.summary h4
{
                                font-size: 14px;
                                color: #000000;
                                margin: 5px 0 10px 0;
                                line-height: 160%;
}

#jobssummaries div.summary p
{
                                font-size: 12px;
                                color: #000000;
                                margin: 15px 0 10px 0;
                                line-height: 160%;
}

/*-- New - 03/05/18 - start --*/

#jobssummaries div.summary img
{
                                width: 70px;
                                height: 70px;
                                position: absolute;
                                bottom: 10px;
                                left: 10px;
                                background-size: cover;
                                display: block;
                                border-radius: 35px;
                                -webkit-border-radius: 35px;
                                -moz-border-radius: 35pxx;
}

/*-- New - 03/05/18 - end --*/

#jobssummaries div.summary p.consultantname
{
                                font-size: 14px;
                                position: absolute;
                                bottom: 40px;
                                left: 90px;
                                font-weight:600;
}

#jobssummaries div.summary p.consultanttitle
{
                                font-size: 14px;
                                font-size: 10px; /* 2018-05-02 PIG for new layout */
                                position: absolute;
                                bottom: 10px;
                                left: 90px;
}

#jobssummaries div.summary div.overlay
{
                                height: 100%;
                                width: 100%;
                                position: absolute;
                                top: 0;
                                left: 0;
                                background: rgba(252, 100, 44, 0.8);
                                background: rgba(34, 207, 224, 0.8); /* 2018-09-17 */
                                display: none;
}

#jobssummaries div.summary:hover div.overlay
{
                                display: inline;
}

#jobssummaries div.summary div.overlay a.button4
{
                                margin: 170px 0 0 40px;
}

/*--- Job page ---*/

#jobpage
{
                                margin-top: 0;
		                        z-index: 5;
		                        position: relative;
                                height: 510px; /* 2018-11-13 */
                                height: 250px; /* 2018-11-28 */
/* 2019-11-21
                                background-color: var(--mrj-blue); /* 2019-08-08
*/

}

#jobpage h1
{
                                font-size: 42px;
                                font-weight: 500;
                                color: #FFFFFF;
                                margin: 20px 0 0 0;
                                letter-spacing: 0;
                                line-height: 120%;
}

#jobpage h2
{
                                font-size: 30px;
                                color: #FFFFFF;
                                margin: 25px 0 10px 0;
                                font-weight: 400;
}

#jobpage h3
{
                                font-size: 20px;
                                color: #FFFFFF;
                                margin: 15px 0 10px 0;
                                font-weight: 400;
                                text-align: left; /* 2019-09-05 */
}

#jobpage p
{
                                color: #FFFFFF;
                                margin: 20px 0 0 0;
}

#jobpage p a
{
                                color: #FFFFFF;
                                text-decoration: underline;
}

#jobpage div.spacer
{
                                height: 30px;
}

#jobdetails
{
                                background: #FFFFFF;
		                        z-index: 5;
		                        position: relative;
}

#jobdetails p
{
                                font-size: 16px;
                                line-height: 140%;
                                padding: 15px 0 15px 20px;
}

#jobdetails ul
{
                                margin: 15px 0 15px 40px;
}

#jobdetails ul li
{
                                padding: 5px 0 5px 5px;
                                list-style: disc;
                                font-size: 16px;
                                line-height: 140%;
}

#jobdetails div.details
{
                                padding-top: 40px;
                                padding-bottom: 40px;
}

/*-- New - 03/05/18 - start --*/

#jobdetails div.consultant img
{
                                width: 200px;
                                height: 200px;
                                margin: 40px auto 10px auto;
                                display: block;
                                background-size: cover;
                                display: block;
                                border-radius: 100px;
                                -webkit-border-radius: 100px;
                                -moz-border-radius: 100pxx;
}

/*-- New - 03/05/18 - end --*/

#jobdetails div.consultant p.name
{
                                font-size: 20px;
                                font-weight: 500;
                                margin: 20px auto 10px auto;
                                text-align: center;
                                padding: 0;
}

#jobdetails div.consultant p.title
{
                                font-size: 16px;
                                font-weight: 500;
                                margin: 10px auto 10px auto;
                                text-align: center;
                                padding: 0;
}

#jobdetails div.consultant p.socialmedia
{
                                font-size: 20px;
                                font-weight: 500;
                                margin: 10px auto 20px auto;
                                text-align: center;
                                padding: 0;
}

#jobdetails div.consultant p.phone
{
                                font-size: 16px;
                                font-weight: 500;
                                margin: 10px auto 20px auto;
                                text-align: center;
                                padding: 0;
}

#contactform
{
                                background: #FFFFFF;
		                        z-index: 5;
		                        position: relative;
}

#contactform div.hseparator
{
                                background-image: url("../site_graphics/grey_pixel.gif");
                                background-position: 50% 50%;
                                background-repeat: repeat-x;
                                height: 30px;
}

#contactform h1,
#contactform h2.h1butforseo
{
                                font-size: 42px;
                                font-size: 36px; /* 2019-11-21 */
                                font-weight: 700;
                                color: #000000;
/* removed 2019-11-21
                                margin: 20px 0 0 10px;
*/
                                letter-spacing: -1px;
                                letter-spacing: 0;
                                line-height: 120%;
                                text-align: center;
}

#contactform h2
{
                                font-size: 30px;
                                color: #000000;
/* removed 2021-03-12 to convert h1's to h2 on request of SEO optimiser
                                margin: 25px 0 25px 10px;
*/
                                font-weight: 400;
                                text-align: center;
}

#contactform input
{
                                width: 500px;
                                margin: 10px auto 10px auto;
                                display: block;
}

#contactform textarea
{
                                width: 500px;
                                height: 120px;
                                margin: 10px auto 10px auto;
                                display: block;
}

#contactform a.button3
{
                                text-align: center;
                                margin: 10px;
}

#contactform p /* 2019-11-27 */
{
                                font-size: 30px;
                                text-align: center;
                                width: 100%;
                                margin-bottom: 20px;
}

body#home-body div#contactform
{
                                min-height: 100vh;
                                position: relative;
                                background-color: var(--engineering-cyan); /* 2019-08-08 */
}

body#home-body div#contactform input,
body#home-body div#contactform textarea,
body#home-body div#contactform div.jfilestyle
{
                                width: 350px;
}


/*--- Information pages ---*/

#informationheader
{
                                margin-top: 0;
		                        z-index: 5;
		                        position: relative;
}

#informationheader h1
{
                                font-size: 42px;
                                font-weight: 500;
                                color: #FFFFFF;
                                margin: 20px 0 0 0;
                                letter-spacing: 0;
                                line-height: 120%;
}

#informationheader h2
{
                                font-size: 30px;
                                color: #FFFFFF;
                                margin: 25px 0 10px 0;
                                font-weight: 400;
}

#informationheader div.spacer
{
                                height: 30px;
}

div.information
{
                                background: #FFFFFF;
		                        z-index: 5;
		                        position: relative;
}

div.information i
{
                                font-style: italic;  /* 2019-10-22 for IR35 page (not sure why this is reset to inactive at all) */
}

div.information h1
{
                                font-size: 36px;
                                color: #000000;
                                text-align: left;
                                margin: 20px 0 10px 0;
                                text-transform: uppercase;
                                font-weight: 500;
                                letter-spacing: -2px;
}

div.information div.informationheader
{
                                background-color: var(--digital-fuchsia); /* 2018-09-24 */
}

div.information div.informationcontent h2
{
                                color: #000000;
                                padding: 10px 0;
                                font-size: 30px;

}

div.information div.informationcontent h2.h2-pink  /* 2019-10-22 for IR35 page */
{
                                text-align: center;
                                color: var(--digital-fuchsia);
}

div.information div.informationcontent h3
{
                                color: #00AFEF;
                                padding: 10px 0;
                                font-size: 20px;
}

div.information div.informationcontent h4
{
                                padding: 10px 0;
                                font-size: 16px;
                                font-weight: bold;
}

div.information div.informationcontent p
{
                                font-size: 16px;
                                color: #8F9598;
                                margin: 10px 0 20px 0;
                                text-align: justify;
                                line-height: 140%;
}

div.information div.informationcontent p b,
div.information div.informationcontent p strong
{
                                font-weight: bold;
                                color: #000000;
}

div.information div.informationcontent ol,
div.information div.informationcontent ul
{
                                margin: 10px 0 20px 20px;
                                margin-left: 30px;
}

div.information div.informationcontent ul.ul-pink li b /* 2019-10-22 for IR35 page */
{
                                color: var(--digital-fuchsia);
}


div.information div.informationcontent ol li, /* 2018-05-14 for lettered bullets in T&Cs */
div.information div.informationcontent ul li
{
                                padding: 5px 0 5px 0;
                                list-style: disc;
                                font-size: 16px;
                                color: #8F9598;
                                text-align: justify;
                                line-height: 140%;
}

div.information div.informationcontent ol
{
                                counter-reset: list-index;
}

div.information div.informationcontent ol li
{
                                list-style: none; /* as lower-alpha; doean't have brackets */
}

div.information div.informationcontent ol li:before
{
                                counter-increment: list-index;
                                content: counter(list-index, decimal) ") ";
                                position: absolute;
                                margin-left: -20px;
}

div.information div.informationcontent table
{
                                border-spacing: 2px;
                                border-collapse: separate;
}

div.information div.informationcontent td
{
                                font-size: 16px;
                                color: #8F9598;
                                padding-left: 10px;
}


/*-- New 04/05/2018 - start

/*--- About page ---*/

#aboutheader
{
                                margin-top: 0;
		                        z-index: 5;
		                        position: relative;
}

#aboutheader h1
{
                                font-size: 42px;
                                font-weight: 500;
                                color: #FFFFFF;
                                margin: 20px 0 0 0;
                                letter-spacing: 0;
                                line-height: 120%;
                                text-align: center;
}

#aboutheader div.spacer
{
                                height: 80px;
}

#aboutdetail
{
		                        z-index: 5;
		                        position: relative;
		                        background: #FFFFFF;
}

#aboutdetail h1
{
                                font-size: 50px;
                                color: #02225E;
                                padding: 25px 0 20px 0;
                                line-height: 120%;
                                font-weight: 500;
                                letter-spacing: -2px;
                                line-height: 140%;
}

#aboutdetail p
{
                                font-size: 14px;
                                color: #646464;
                                margin: 10px 20px 20px 0;
                                text-align: justify;
                                line-height: 140%;
}

#aboutdetail h2
{
                                text-align: center;
                                padding: 100px 0 100px 0;
                                color: #FFFFFF;
                                font-size: 20px;
}

#aboutdetail h3
{
                                padding: 10px 0 0 0;
                                font-size: 20px;
                                color: #000000;
}

#aboutdetail div.panel
{
                                margin: 10px 10px 20px 0;
}

#aboutdetail div.techdig
{
                                background: #FC642C;
}


#aboutdetail div.execsearch
{
                                background: #02225E;
}

#aboutdetail div.startups
{
                                background: #4BFCF6;
}

/*-- New 04/05/2018 - end

/********************************************************************************

    SPECIAL STYLES FOR NARROW DESKTOPS

********************************************************************************/

@media only screen and
(min-width: 1025px) and
(max-width: 1114px)
{

}

/********************************************************************************

    SPECIFIC STYLES FOR ALL TABLETS

********************************************************************************/

@media only screen and
(min-width: 569px) and
(max-width: 1024px)
{

/*--- General styles  ---*/

    .desktoponly
    {
                                display: none !important;
    }

    span.desktopandtabletonly
    {
                                display: inline !important;
    }

/*--- Home page ---*/

    #homepage h1
    {
                                font-size: 46px;
                                letter-spacing: -3px;
    }

    #homepage h2
    {
                                font-size: 32px;
                                letter-spacing: -1px;
    }

/*--- Hot jobs section ---*/

    #hotjobs div#hotjobsslider
    {
                                width: 780px;
    }

    #hotjobs div.jobsummary
    {
                                width: 390px;
                                _width: 260px; /* 2018-05-02 for new layout */
                                height: 200px;
    }

    #hotjobs div.jobsummary h2
    {
                                font-size: 18px;

    }

    #hotjobs div.jobsummary h3
    {
                                color: #000000;
    }

    #hotjobs div.jobsummary p
    {
                                font-size: 14px;
    }

    #hotjobs span#bxsliderjobs-prev
    {
                                top: 120px;
    }

    #hotjobs span#bxsliderjobs-next
    {
                                top: 120px;
    }

/*--- About section ---*/

    #about h1,
    #about h2.h1butforseo
    {
                                font-size: 40px;
    }

/*--- Clients section ---*/

    #clients img
    {
                                float: left;
                                margin: 40px 49px 40px 49px;
                                margin: 5px 20px 5px 20px; /* 2019-07-29 */
    }

/*--- People section ---*/

    #people div.peoplesummary img.indicator
    {
                                position: absolute;
                                bottom: 0px;
                                left: 140px;
    }

/*--- Footer/Contact section ---*/

/*-- New - 03/05/18 - start --*/

    #footer h1,
    #footer h2.h1butforseo
    {
                                font-size: 44px;
                                font-size: 24px; /* 2018-09-17 */
                                margin: 40px 0 30px 0;
                                margin: 15px 0 15px 0; /* 2018-09-17 */
    }

    #footer p
    {
                                font-size: 21px;
                                font-size: 16px; /* 2018-09-17 */
                                margin: 30px 0 0 0;
                                margin: 0px 0 0 0;  /* 2018-09-17 */
    }

    #footer p.largequote
    {
                                font-size: 34px;
    }

    #footer p.quote
    {
                                font-size: 18px;
                                margin-top: 60px;
    }

    #footer p.quotename
    {
                                font-size: 21px;
                                font-size: 16px; /* 2018-09-17 */
                                margin-top: 65px;
    }


    #footer p.address /* 2018-09-17 */
    {
                                font-size: 16px; /* 2018-09-17 */
    }

/*-- New - 03/05/18 - end --*/

}

/********************************************************************************

    SPECIFIC STYLES FOR TABLETS (LANDSCAPE)

********************************************************************************/

@media only screen and
(min-width: 569px) and
(max-width: 1024px) and
(orientation: landscape)
{

}

/********************************************************************************

    SPECIFIC STYLES FOR TABLETS (PORTRAIT)

********************************************************************************/

@media only screen and
(min-width: 569px) and
(max-width: 1024px) and
(orientation: portrait)
{

}

/********************************************************************************

    SPECIFIC STYLES FOR ALL MOBILES

********************************************************************************/

@media only screen and
(max-width: 568px)
{

/*---  Default elements ---*/

    input,
    select,
    textarea
    {
                                margin: 5px 0 5px 10px;
    }

/*--- General styles  ---*/

    .desktoponly,
    .desktopandtabletonly
    {
                                display: none !important;
    }

    div.mobileonly,
    h3.mobileonly,
    img.mobileonly
    {
                                display: block !important;
    }

    a.mobileonly,
    br.mobileonly
    {
                                display: inline !important;
    }

    a.button
    {
                                margin: 0 0 20px 0;
    }

    a.button2
    {
                                margin: 0 0 20px 0;
    }

    a.buttonpaddedrightmore
    {
                                margin-right: 10px;
    }

/*---  Navigation  ---*/

    div#sitemenuoptions
    {
                                display: none;
    }

    div#mobilesitemenu
    {
                                display: inline-block;
                                padding: 14px 0 10px 0 !important;
                                width: 100%;
                                text-decoration: none;
                                text-transform: uppercase;
    }

    div#mobilesitemenu h1,
    div#mobilesitemenu h2.h1butforseo
    {
	                            color: #FFFFFF;
	                            color: #000000; /* 2019-07-31 */
	                            color: var(--digital-fuchsia); /* 2019-11-21 */
	                            color: #FFFFFF; /* 2021-04-10 */
	                            font-size: 14px !important;
	                            margin: 0;
	                            padding: 8px 0 0 0;
	                            text-align: center;
	                            position: static;
	                            font-weight: 400;
    }

    div#mobilesitemenu img#mobilesitemenulogo
    {
                                float: right;
                                margin: 0 0 0 0;
    }

    div#mobilesitemenu img#mobilesitemenunavarrow,
    div#mobilesitemenu img#mobilesitemenunavarrowblack
    {
                                float: left;
                                margin: 2px 0 0 0;
    }

    div#mobilesitemenuoptions
    {
                                display: none;
    }

    div#mobilesitemenuoptions ul
    {
                                margin: 0 0 0 0;
                                padding: 0 0 0 0;
                                float: left;
                                width: 100%;
    }

    div#mobilesitemenuoptions ul li
    {
	                            display: inline-block;
                                width: 100%;
                                margin: 0 0 0 0;
                                padding: 0 0 0 0;
    }

    div#mobilesitemenuoptions ul li  a
    {
	                            position: relative;
                                display: inline-block !important;
	                            color: #FFFFFF;
	                            color: #000000; /* 2019-07-31 */
	                            color: #FFFFFF; /* 2019-08-12 */
	                            text-decoration: none;
	                            outline: 0;
	                            font-size: 16px !important;
			                    text-transform: uppercase;
                                width: 100%;
                                margin: 0 0 0 0;
                                padding: 14px 0 10px 0 !important;
                                text-align: left;
                                text-decoration: none;
                                text-transform: uppercase;
                                border-width: 1px 0 0 0;
                                border-style: solid;
                                border-color: #FFFFFF #FFFFFF #FFFFFF #FFFFFF;
                                border-color: #000000 #000000 #000000 #000000; /* 2019-07-31 */
                                border-color: #FFFFFF #FFFFFF #FFFFFF #FFFFFF; /* 2019-11-26 */
                                background-image: url(../site_graphics/icon_menu_arrow2.png);
                                background-repeat: no-repeat;
                                background-position: 99% 50%;
			                    border-radius: 0;
                                cursor: pointer;
    }

    body#blog2-body div#mobilesitemenuoptions ul li  a
    {
	                            color: #000000; /* 2019-11-26 */
    }

    body#home-body div#mobilesitemenuoptions ul li  a
    {
/* removed 2019-11-26
	                            color: #000000; /* 2019-08-12 * /
*/
    }

    div#mobilesitemenuoptions ul li:last-child a
    {
                                padding: 14px 0 14px 0 !important;
                                background-position: 99% 40%;
    }

    div#mobilesitemenuoptions ul li a:hover
    {
                                background: transparent;
                                background-image: url(../site_graphics/icon_menu_arrow2.png);
                                background-repeat: no-repeat;
                                background-position: 99% 50%;
    }

    div#mobilesitemenuoptions ul li a.active:before
    {
	                            display: none;
    }

/*---  Background image  ---*/

    div#backgroundimage
    {
                                position: absolute;
                                left: 0;
                                top: 0;
		                        z-index: 1;
		                        overflow: hidden;
		                        width: 100%;
    }

    div#backgroundimage div.overlay
    {
                                background: rgba(30, 30, 30, 0.2);
                                background: rgba(0,  22, 132, 0.2); /* 2019-22-28 */
                                position: absolute;
                                z-index: 2;
                                width: 100%;
                                height: 100%;
                                top: 0;
                                left: 0;
    }

    div#backgroundimagecontainer
    {
                                margin-top: 0;
    }

/*--- Homepage ---*/

    div#navigation
    {
		                        min-height: 0px;
                                height: inherit; /* 2022-03-17 reinstated the nav bar for 'join us/careers'*/
    }

    #homepage h1
    {
                                font-size: 38px;
                                margin: 60px 0 10px 0;
                                letter-spacing: -1px;
                                float: none;

    }

    #homepage h2
    {
                                font-size: 22px;
                                margin: 5px 0 50px 0;
                                letter-spacing: -1px;
    }

    #homepage h3
    {
                                font-size: 22px;
                                margin: 5px 0 35px 0;
                                letter-spacing: -1px;
    }

    #homepage img
    {
                                margin: 15px auto 15px auto;
    }

    #homepage input /* 2018-09-17 */
    {
                                margin: 5px 0;
                                height: 40px;
                                box-sizing: border-box;
    }

    #homepage a.button /* 2018-09-17 */
    {
                                width: 100%;
                                box-sizing: border-box;
    }

    #homepage div.spacer
    {
                                height: 70px;
    }

/*--- Hot jobs section ---*/


    #hotjobs ul.bxsliderjobs
    {
                                margin-left: 0;
                                margin-right: 0;
    }

    #hotjobs div.jobsummary h2
    {
                                font-size: 18px;
                                padding-left: 5px;
                                padding-right: 5px;
    }

    #hotjobs div.jobsummary h3
    {
                                font-size: 14px;
                                padding-left: 5px;
                                padding-right: 5px;
    }

    #hotjobs div.jobsummary p
    {
                                font-size: 15px;
                                padding-left: 5px;
                                padding-right: 5px;
    }

    #hotjobs div.spacer
    {
                                height: 0;
                                height: 5px; /* 2018-10-25 */
    }

    #hotjobs div.slideshowcontainer
    {
                                margin-bottom: 16px; /* 2018-10-25 */
    }

/*--- About section ---*/

    #about h1,
    #about h2.h1butforseo
    {
                                padding: 15px 5px 20px 5px;
                                padding: 65px 5px 20px 5px; /* 2018-10-25 */
    }

    #about p
    {
                                margin: 10px 5px 20px 5px;
    }

    #about div.spacer
    {
                                height: 0;
    }

/*--- Clients page ---*/

    #clients img
    {
                                float: none;
                                margin: 20px auto;
    }

    #clients h1
    {
                                padding: 10px 0 0 0;
    }

/*--- Footer/Contact section ---*/

/*-- New 03/05/18 - start --*/

    #footer h1,
    #footer h2.h1butforseo
    {
                                font-size: 40px;
                                font-size: 24px; /* 2018-09-17 */
                                margin: 50px 0 0 0;
                                margin: 20px 0 0 0; /* 2018-09-17 */
                                margin: 0; /* 2019-11-26 */
                                text-align: center;
    }

    #footer h2
    {
                                margin: 60px 0 10px 0;
    }

    #footer p
    {
                                font-size: 20px;
                                text-align: center;
    }

    #footer p.largequote
    {
                                font-size: 30px;
                                text-align: center;

    }

    #footer p.quote
    {
                                font-size: 18px;
                                text-align: center;

    }

    #footer p.quotename
    {
                                font-size: 20px;
                                text-align: center;
                                margin-bottom: 30px;
    }

    #footer p.socmedia
    {
                                margin: 20px 0 30px 0;
    }

    #footer br.socmedia
    {
                                display: block;
    }

/*-- New 03/05/18 - end --*/

    div#backgroundfooterimagecontainer
    {
                            max-height: 1144px;
    }

    div#backgroundfooterimagecontainer img
    {
                            max-height: 1144px;
    }

/*--- Subfooter ---*/

    #subfooter ul
    {
                                margin: 0 0 0 0;
                                padding: 0 0 0 0;
    }

    #subfooter ul li
    {
                                float: left;
                                width: 100%;
    }

    #subfooter ul li p
    {
                                display: inline-block !important;
                                font-size: 14px !important;
                                font-weight: normal !important;
                                padding: 15px 0 13px 0 !important;
                                width: 100%;
                                text-align: left;
                                text-decoration: none;
                                text-transform: uppercase;
                                border-width: 0 0 1px 0;
                                border-style: solid;
                                border-color:#FFFFFF #FFFFFF #606060 #FFFFFF;
    }

    #subfooter ul li a
    {
                                display: inline-block !important;
                                font-size: 14px !important;
                                font-weight: normal !important;
                                padding: 15px 0 13px 0 !important;
                                width: 100%;
                                text-align: left;
                                text-decoration: none;
                                text-transform: uppercase;
                                border-width: 0 0 1px 0;
                                border-style: solid;
                                border-color: #FFFFFF #FFFFFF #606060 #FFFFFF;
                                background-image: url(../site_graphics/icon_menu_arrow.png);
                                background-repeat: no-repeat;
                                background-position: 100% 50%;
    }

    #subfooter ul li a:hover
    {
                                text-decoration: none;
    }

    #subfooter p
    {
                                padding: 15px 0 15px 0;
                                font-size: 12px;
                                line-height: 130%;
    }

/*--- Jobs page ---*/

    #jobspage h1
    {
                                font-size: 32px;
    }

    #jobspage h2
    {
                                font-size: 24px;
    }

    #jobssummaries div.searchall
    {
                                margin: 30px 0 30px 0;
    }

    #jobssummaries a.button
    {
                                margin: 10px 0 20px 0;
    }

    #jobssummaries p
    {
                                margin: 0 0 0 0;
    }

    #jobssummaries div#moresearch div.leftcolumn
    {
                                padding-left: 0;
    }

    #jobssummaries div#moresearch a.button
    {
                                margin: 22px 0 20px 0;
    }

    #jobssummaries a#stdsearchlink p
    {
                                margin: 0 0 20px 0;
                                text-align: center;
    }

    #jobssummaries div.summary
    {
                                margin: 0 0 24px 0;
                                margin: 0 0 100px 0; /* 2019-07-31 */
    }

/*--- Job page ---*/

    #jobpage h1
    {
                                font-size: 32px;
    }

    #jobpage h2
    {
                                font-size: 24px;
    }

    #jobpage h3
    {
                                font-size: 24px;
    }

    #jobdetails p
    {
                                padding: 15px 0 15px 0;
    }

    #jobdetails ul
    {
                                margin: 15px 0 15px 20px;
    }

    #jobdetails div.consultant img
    {
                                margin: 10px auto 10px auto;
    }

    #contactform h1,
    #contactform h2.h1butforseo
    {
                                font-size: 36px;
    }

    #contactform h2
    {
                                font-size: 24px;
    }

    #contactform a.button
    {
                                margin: 10px 0 30px 0;
    }

/*--- Information section ---*/

    #informationheader h1
    {
                                font-size: 32px;
    }

    #informationheader h2
    {
                                font-size: 24px;
    }

    div.information h1
    {
                                font-size: 24px;
                                letter-spacing: 0;
    }

}

/********************************************************************************

    SPECIFIC STYLES FOR MOBILES (LANDSCAPE)

********************************************************************************/

@media only screen and
(max-width: 568px) and
(orientation: landscape)
{

/*--- General styles ---*/

    a.button
    {
                                width: 400px;
    }

    a.button2
    {
                                width: 400px;
    }

/*--- Navigation ---*/

    div#mobilesitemenu h1
    div#mobilesitemenu h2.h1butforseo
    {
	                            margin: 0;
	                            padding: 8px 90px 0 0;
    }

/*--- Hot jobs section ---*/

    #hotjobs div#hotjobsslider
    {
                                width: 420px;
    }

    #hotjobs div.slideshowcontainer
    {
                                width: 420px;
    }

    #hotjobs div.jobsummary
    {
                                width: 420px;
                                height: 180px;
    }

/*--- About section ---*/

    #about h1,
    #about h2.h1butforseo
    {
                                font-size: 40px;;
    }

/*--- People section ---*/

    #people div.slideshowcontainer
    {
                                width: 420px;
    }

    #people div.peoplesummary
    {
                                width: 420px;
                                height: 450px;
    }

    #people div.peoplesummary img.indicator
    {
                                position: absolute;
                                bottom: 0px;
                                left: 195px;
    }

    div.people2
    {
                                height: auto;
    }

    div.people2 div.peopledetails p.aboutlast
    {
                                padding: 5px 0 20px 0;
    }

/*--- Jobs page ---*/

    #jobssummaries a.button
    {
                                width: 360px;
    }

    #jobssummaries input.what
    {
                                width: 408px;
    }

    #jobssummaries input.where
    {
                                width: 408px;
    }

    #jobssummaries select.where
    {
                                width: 418px;
    }

    #jobssummaries select.salary
    {
                                width: 418px;
    }

    #jobssummaries select.job
    {
                                width: 418px;
    }

    #jobssummaries select.added
    {
                                width: 418px;
    }

    #jobssummaries div#moresearch a.button
    {
                                width: 360px;
    }

    #jobssummaries div.summary
    {
                                width: 390px;
                                height: 280px;
    }

    #jobssummaries div.summary div.overlay a.button4
    {
                                margin: 130px 0 0 145px;
    }

/*--- Job page ---*/


    #contactform input,
    #contactform textarea
    {
                                width: 420px;
    }

    #contactform a.button
    {
                                margin: 10px 0 30px 0;
                                width: 370px;
    }

    div#footer:after /* 2018-09-17 */
    {
                                content: none; /* disable cyan flash in mobile */
    }

}

/********************************************************************************

    SPECIFIC STYLES FOR MOBILES (PORTRAIT)

********************************************************************************/

@media only screen and
(max-width: 568px) and
(orientation: portrait)
{

/*--- General styles ---*/

    a.button
    {
                                width: 280px;
    }

    a.button2
    {
                                width: 280px;
    }

/*--- Navigation ---*/

    div#mobilesitemenu h1
    {
	                            margin: 0;
	                            padding: 8px 30px 0 0;
    }

/*--- Hot jobs section ---*/

    #hotjobs div#hotjobsslider
    {
                                width: 300px;
    }

    #hotjobs div.slideshowcontainer
    {
                                width: 300px;
    }

    #hotjobs div.jobsummary
    {
                                width: 300px;
                                height: 250px;
    }

/*++ 2018-05-04 to implement orange hover overlay */

    #hotjobs div.jobsummary div.overlay a.button4
    {
                                margin: 90px 0 0 90px;
    }

/*-- 2018-05-04

/*--- About section ---*/

    #about h1,
    #about h2.h1butforseo
    {
                                font-size: 24px;;
    }

    #testimonials h1
    {
                                font-size: 28px;;
    }

/*--- People section ---*/

    #people div.slideshowcontainer
    {
                                width: 300px;
    }

    #people div.peoplesummary
    {
                                width: 300px;
                                height: 450px;
                                height: 600px; /* 2019-08-07 */
    }

    #people div.peoplesummary img.indicator
    {
                                position: absolute;
                                bottom: 0px;
                                left: 137px;
    }

    div.people2
    {
                                height: auto;
    }

    div.people2 div.peopledetails p.aboutlast
    {
                                padding: 5px 0 20px 0;
    }

/*--- Jobs page ---*/

    #jobssummaries a.button
    {
                                width: 240px;
                                width: 288px; /* 2019-08-09 */
    }


    body#home-body #jobssummaries input.what,
    #jobssummaries input.what
    {
                                width: 288px;
    }

    body#home-body #jobssummaries input.where,
    #jobssummaries input.where
    {
                                width: 288px;
    }

    #jobssummaries select.where
    {
                                width: 298px;
    }

    #jobssummaries select.salary
    {
                                width: 298px;
    }

    #jobssummaries select.job
    {
                                width: 298px;
    }

    #jobssummaries select.added
    {
                                width: 298px;
    }

    #jobssummaries div#moresearch a.button
    {
                                width: 240px;
    }

    #jobssummaries div.summary
    {
                                width: 270px;
                                height: 320px;
                                height: 380px; /* 2019-07-31 */
    }

    #jobssummaries div.summary div.overlay a.button4
    {
                                margin: 140px 0 0 85px;
    }

/*--- Job page ---*/


    body#home-body div#contactform input,
    body#home-body div#contactform textarea,
    #contactform input,
    #contactform textarea
    {
                                width: 300px;
    }

    #contactform a.button
    {
                                margin: 10px 0 30px 0;
                                width: 250px;
    }

    div#footer:after /* 2018-09-17 */
    {
                                content: none; /* disable cyan flash in mobile */
    }

}

@media only screen and
(min-width: 1200px) and /* width should match the limits used to resize bxslider */
(orientation: landscape)
{
    div#hotjobs > div.responsivegrid > div /* 2018-05-02 kludge to allow slider to be wider than responsive grid */
    {
        width: 1140px;
        margin-left: -95px;
    }

}


@media only screen and
(min-width: 1024px) and /* width should match the limits used to resize bxslider */
(orientation: landscape)
{
    div#placeholdertiles /* TODO remove this temporary kludge when text is re-instated */
    {
        margin-left: 20px;
    }
}

#aboutdetail div.techdig, /* TODO remove this temporary kludge when text is re-instated */
#aboutdetail div.execsearch,
#aboutdetail div.startups
{
    margin-top: 80px;
    margin-bottom: 80px;
}

#about p.largequote /* testimonial quotes added to about page 2018-05-06 */
{
                                font-size: 40px;
                                color: #FC642C;
                                margin: 20px 0 0 0;
                                font-weight: 500;
                                line-height: 140%;
                                text-align: left;

}

#about p.quote
{
                                font-size: 20px;
                                _color: #FFFFFF;
                                margin: 40px 0 0 0;
                                line-height: 140%;
                                text-align: left;

}

#about p.quotename
{
                                font-size: 24px;
                                _color: #FFFFFF;
                                margin: 40px 0 0 0;
                                line-height: 140%;
                                text-align: left;
                                font-style: italic;

}

#testimonials p.largequote, /* testimonial quotes added to new index panel 2018-09-17 */
#testimonials p.quote
{
                                font-size: 14px;
                                font-style: italic;
                                color: #000000;
                                margin: 0px 20px;
                                text-align: justify;
}

#testimonials p.quotename
{
                                font-size: 18px;
                                font-style: italic;
                                color: #000000;
                                padding: 20px 0px;
                                font-weight: 500;
                                letter-spacing: 0px;
                                text-align: right;
                                margin-right: 20px;
}

/* 2019-07-25 */

ul.horizontal-menu li
{
    float: right;
    margin-top: 60px;
    margin-right: 70px;
    margin-top: 11vh; /* 2019-11-26 */
    margin-right: 40px; /* 2019-11-26 */
    color: #000000;
    color: #FFFFFF; /* 2019-11-21 */
    font-size: 16px; /* 2019-11-26 */
}

@media only screen and
(max-width: 800px)
{
    ul.horizontal-menu li
    {
        margin-right: 10px;
    }
}



ul.horizontal-menu li a
{
    padding-bottom: 10px;
    color: #000000;
    color: #FFFFFF; /* 2019-11-21 */
}

ul.horizontal-menu li a:hover
{
    text-decoration: none;
    border-bottom: 3px solid var(--digital-fuchsia);
}

div#about
{
    _background-color: #FFff77;
/*
    background-image: linear-gradient(left, #FF607B, #FF607B 80%, transparent 80%, transparent 100%);
    background-image: -webkit-linear-gradient(left, #FF607B, #FF607B 80%, transparent 80%, transparent 100%);
*/
    min-height: 100vh; /* 2019-11-21 */
}

div#about-quote
{
    width: 90%;
    width: 100%; /* 2019-11-21 */
    height: 100%;
    background-color: #FF607B;
    background-color: #ffffff; /* 2019-11-21 */
/*
    background-image: linear-gradient(left, #FF607B, #FF607B 80%, transparent 80%, transparent 100%);
    background-image: -webkit-linear-gradient(left, #FF607B, #FF607B 80%, transparent 80%, transparent 100%);
*/
}

div#about-quote /* 2019-11-21 */
{
    height: 60vh;
    position: relative;
    text-align: center;
}

div#about-quote2 /* 2019-11-21 */
{
    height: 40vh;
    min-height: 250px;
    background-color: var(--digital-fuchsia);
    position: relative;
    text-align: center;
    text-transform: uppercase;
    font-size: 14px;
}

div#about-quote2 p /* 2019-11-21 */
{
    text-transform: uppercase;
    font-size: 16px;
}

/* retired 2019-11-21
div#about-quote div
{
    width: 50%;
    padding-left: 5%;
}
*/

div#about-quote2 h1,
div#about-quote2 h2.h1butforseo
{
    padding: 0px;
    margin-bottom: 5vh;
    white-space: nowrap;
}

@media only screen and /* 2019-11-21 */
(max-width: 568px)
{
    div#about-quote2 p
    {
        font-size: 14px;
    }

    div#about-quote2 h1,
    div#about-quote2 h2.h1butforseo
    {
        padding: 0px;
        margin-bottom: 2vh;
        white-space: nowrap;
}

}

div#about-quote p:first-child /* 2019-11-21 */
{
    font-size: 28px;
    font-weight: bold;
}

div#about-quote2 div p:last-child, /* 2019-11-21 */
div#about-quote2 div p:last-child a /* 2019-11-21 */
{
    color: #CCCCCC;
}

div#about div.search-form a,
div#about div.search-form input,
div#about div.search-form div.new-career
{
    border-radius: 10px;
    border-style: solid;
    border-width: 2px;
    border-color: black;
}


div#about div.search-form div.new-career
{
    background-color: var(--mrj-blue);
    height: 50px;
    width: 85%;
    position: relative;
    padding: 5px 0 5px 10px;
    margin-bottom: 10px;
}

div#about div.search-form a.button
{
    margin-top: 10px;
    width: 35%;
    margin-left: 50%;
    color: black;
}

@media only screen and
(max-width: 568px)
{
    div#about div.search-form a.button
    {
        _margin: 10px 0 5px 0;
        margin-left: 35%;
        width: 50%;
    }

    div#about div.search-form input
    {
        margin-left: 0;
    }
}

div#about div.search-form div
{
    border-radius: 10px;
}


div#about div.search-form a
{
    padding: 4px 8px 4px 8px;
    padding: 6px;
}

form#frmFesUsrSitAdvancedSearch div
{
    float: left;
    display: inline;
    margin-left: 10px;
    margin-right: 10px;
}

@media only screen and
(max-width: 568px)
{
    form#frmFesUsrSitAdvancedSearch div
    {
        float: none;
        display: block;
    }
}

div#testimonials-quote
{
    width: 90%;
    margin-left: 10%;
    height: 100%;
    background-color: var(--mrj-blue);
}

div#testimonials-quote h1
{
    float: right;
    color: white;
    font-size: 50px;
    font-weight bold;
    margin-right: 15%;
}

div#testimonials-quote
{
    text-align: right;
}

div#clients div.slideshowcontainer
{
                                position: relative;
                                margin-left: auto;
                                margin-right: auto;
                                margin-top: 50px;
                                margin-top: 0; /* 2019-11-21 */
                                width: 55%; /* 2019-08-09 */
                                width: 100%; /* 2019-11-21 */
                                padding-bottom: 40px; /* 2019-08-09 */
}

@media only screen and
(min-width: 568px)
{
    div#clients div.slideshowcontainer
    {
        margin-left: 0px;
/* 2019-11-21
        margin-right: 55vh;
*/
    }
}

body#search-body div#navigation
{
/* 2019-11-21
    background-color: var(--mrj-blue);
*/
}

/* retired 2019-11-21
div#people > div.responsivegrid
{
    margin-top: 200px;
}
*/

@media only screen and
(max-width: 568px)
{
    div#people > div.responsivegrid
    {
        margin-top: 80px;
    }
}



div#people li
{
/* retired 2019-11-21
    background: -webkit-linear-gradient(left, #FF607B, #FF607B 70%, transparent 70%, transparent 100%);
    background: linear-gradient(to right, #FF607B, #FF607B 70%, transparent 70%, transparent 100%);
*/
}

#search-body h3 span
{
    margin-right: 30px;
}

#search-body h3 form
{
    display: inline-block;
    margin-top: 30px;
}

.center-both
{
  display: block;
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%)
}

.center-vertical
{
  display: block;
  margin: 0;
  position: absolute;
  top: 50%;
  transform: translate(0,-50%)
}

/*--- Blogs section ---*/ /* 2019-07-30  new index panel and new page*/

#blogspage
{
                                margin-top: 0;
		                        z-index: 5;
		                        position: relative;
                                height: 80vh;
}

#blogspage h1
{
                                font-size: 54px;
                                font-weight: 500;
                                text-align: center;
                                margin: 40px 0 0 0;
                                letter-spacing: 0;
                                font-size: 65px; /* 2019-07-31 */
                                font-weight: 700; /* 2019-07-31 */
                                color: var(--product-gold); /* 2019-07-31 */
                                color: white; /* 2021-04-11 */
                                margin: 50vh 0 0 0; /* 2019-11-26 */
}

#blogs
{
/* 2019-11-24
    height: 510px;
    height: 300px; /* 2019-08-09 whilst hidden * /
*/
    min-height: 100vh; /* 2019-11-21 */
    position: relative;
    text-align: center;
    background-color: white;
    background-color: #f8f8f8; /* 2021-04-27 */
    z-index: 2;
}

/* removed 2019-11-26
@media only screen and
(max-width: 568px)
{
    #blogs
    {
        height: 150px; /* 2019-08-09 whilst hidden * /
    }
}
*/

#blogs h1,
#blogs h2.h1butforseo
{
                                font-size: 42px;
                                font-weight: 700;
                                color: #000000;
                                margin: 20px 0 0 10px;
                                margin: 0;
                                line-height: 120%;
                                text-align: center;
}


#blogs h2
{
                                color: #000000;
                                font-size: 24px;
                                font-weight: 600;
                                _min-height: 10vh;
                                height: 50px;
                                margin: 10px;
                                overflow: hidden;
}

#blogs h2.revamp2021
{
                                font-size: 20px; /* 2021-04-27 */
                                margin: 13px; /* 2021-04-27 */
                                text-align: left; /* 2021-04-27 */
                                height: inherit; /* 2021-04-27 */
}

#blogs h2.bloglink /* 2021-04-27 */
{
                                margin-top: 0;
                                font-size: 18px;
                                height: 24px;
}

#blogs h2.bloglink a /* 2021-04-27 */
{
                                text-decoration: underline;
	                            color: var(--digital-fuchsia);
}

#blogs h2.articlelink a /* 2021-04-27 */
{
                                text-decoration: none;
                                font-weight: inherit;
	                            color: black;
}

#blogs p
{
                                color: #000000;
                                font-size: 16px;
                                height: 16px;
                                color: #808080; /* 2021-04-27 */
                                height: inherit; /* 2021-04-27 */
}

#blogs p.revamp2021
{
                                color: #808080; /* 2021-04-27 */
                                margin: 13px; /* 2021-04-27 */
                                margin-bottom: 0; /* 2021-04-27 */
                                text-align: left; /* 2021-04-27 */
                                height: inherit; /* 2021-04-27 */
}

#blogs p.byline
{
                                padding-bottom: 13px; /* 2021-04-27 */
                                font-size: 14px;
}

#blogs hr /* 2021-04-27 */
{
                                border: 1px solid #eeeeee;
                                width: 90%;
                                margin: auto;
}

img.blog /* 2019-11-24 */
{
/*
    max-width: 350px;
    max-height: 200px;
*/
    width: 95%;
    height: 200px;
    margin-top: 3vh;
    margin-bottom: 3vh;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0; /* 2021-04-27 */
    margin-bottom: 2vh; /* 2021-04-27 */
    width: 100%; /* 2021-04-27 */
}

img.blog2 /* 2019-11-24 */
{
    height: 250px;
    max-height: 25vh; /* shrink on mobile devices */
    margin-bottom: 30px;
    margin-left: auto;
    margin-right: auto;
}

#blogs li div.summary /* 2019-11-24 */
{
    border-style: solid;
    border-width: 4px;
    border-color: black;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px; /* 2021-04-27 */
    border-width: 0; /* 2021-04-27 */
    background-color: white; /* 2021-04-27 */
    box-shadow: 3px 5px 5px 0px #dddddd; /* 2021-04-27 */
}

body#blogs-body #blogs div.summary
{
    border-style: solid;
    border-width: 4px;
    border-color: black;
    width: 290px;
    float: left;
    background: #FFFFFF;
    margin: 50px 10px 0 10px;
    margin: 50px 10px 5px 10px; /* 2021-04-27 */
    border-width: 0; /* 2021-04-27 */
    background-color: white; /* 2021-04-27 */
    box-shadow: 3px 5px 5px 0px #dddddd; /* 2021-04-27 */
}

#blogs a.button /* 2019-11-24 */
{
    border-style: solid;
    border-width: 2px;
    border-color: black;
    color: black;
    background-color: white;
    width: initial;
}


#blogs span#bxsliderblog-prev,
#blogs span#bxsliderblog-next
{
                                position: absolute;
                             /* top: 180px; */
                                bottom: 180px; /* 2018-09-17 */
                                bottom: 300px; /* 2019-11-21 still WIP */
                                left: 20px;
}

#blogs span#bxsliderblog-next
{
                                left: inherit;
                                right: 20px;
}

#blogs span#bxsliderblog-prev img,
#blogs span#bxsliderblog-next img
{
                                opacity: 0.4;
}



/* New animation for revamp 2019-11-21 */

@keyframes fade-text {
    from { opacity: 0; }
    to { opacity: 1; }
}

.full-width {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  width: 100vw;
}

.delay1,
.delay2,
.delay3,
.delay4,
.delay5,
.delay6,
.delay7,
.delay8
{
    opacity: 0;
    animation: fade-text 1s;
    animation-delay: 1s;
    animation-fill-mode: forwards;
}

.delay1 {
    animation-delay: 1s;
}

.delay2 {
    animation-delay: 1.75s;
}

.delay3 {
    animation-delay: 2.25s;
    animation-delay: 2.5s;
}

.delay4 {
    animation-delay: 3.5s;
    animation-delay: 3.25s;
}

.delay5 {
    animation-delay: 4.5s;
}

.delay6 {
    animation-delay: 6s;
}

.delay7 {
    animation-delay: 6.25s;
}

.delay8 {
    animation-delay: 6.5s;
}