/*
Theme Name: The HTML5 Reset Theme
Theme URI: http://html5reset.org
Description: A style-free theme to get you started on an HTML5-based WordPress theme of your own.
Author: Monkey Do! + @ckhicks
Author URI: http://monkeydo.biz
Version: 2.0
License: BSD 2-Clause
License URI: http://opensource.org/licenses/bsd-license.php
*/

/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

/* A Linux- and Windows-friendly sans-serif font stack: http://prospects.mhurrell.co.uk/post/updating-the-helvetica-font-stack */
body {font: 13px Helmet, Freesans, sans-serif;}

/* Using local fonts? Check out Font Squirrel's webfont generator: http://www.fontsquirrel.com/tools/webfont-generator */

/* We like off-black for text. */
body, select, input, textarea {color: #333;}

a {color: #03f;}
a:hover {color: #69f;}

/* Custom text-selection colors (remove any text shadows: http://twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #fcd700; color: #fff; text-shadow: none;}
::selection {background: #fcd700; color: #fff; text-shadow: none;}

/*	j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700;}

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}

/* Mozilla dosen't style place holders by default */
input:-moz-placeholder { color:#a9a9a9; }
textarea:-moz-placeholder { color:#a9a9a9; }


/* And here begins the WordPress fun.
-------------------------------------------------------------------------------*/

#wrapper {width: 960px; margin: 20px auto;}


/* Print styles!
-------------------------------------------------------------------------------*/
@media print {

}


/* Media queries!
-------------------------------------------------------------------------------*/

/* Always do mobile-first, and consider using em units: http://blog.cloudfour.com/the-ems-have-it-proportional-media-queries-ftw

@media screen and (min-width: 480px) {

} */

@font-face {
  font-family: Circular;
  src: url(Circular.otf);
}

@font-face {
  font-family: CircularMed;
  src: url(CircularMedium.otf);
}

a {
    text-decoration: none;
}

* {
    box-sizing: border-box;
}

iframe, img {
    display: block;
}

body {
    font-size: 17px;
    color: #515151;
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
}

section {
    display: flex;
    position: relative;
}

p {
    line-height: 1.6em;
}

.fl1 {
    flex: 1;
}

h1, h2, h3, h4, h5 {
    font-family: 'Circular';
    padding: 0 0 .8em;
    margin: 0;
    line-height: 1em;
    position: relative;
    z-index: 2;
}

h1 {
    font-size: 2.8em;
}

h1 span {
    display: block;
}

h2 {
    font-size: 2.4em;
}

h3 {
    font-size: 2em;
}

.bttnContainer {
    display: flex;
    width: 100%;
    justify-content: center;
}

.bttn {
    background-color: rgba(3,155,222,1);
    background: linear-gradient(209deg, rgba(3,155,222,1) 0%, rgba(28,111,168,1) 100%);
    max-width: 300px;
    width: 100%;
    display: flex;
    height: 50px;
    color: #fff;
    text-decoration: none;
    align-items: center;
    justify-content: center;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 3px;
    transition: all .2s;
    border-radius: 4px;
}

.bttn:hover {
    box-shadow: 1px 1px 8px #4445;
    color: #fff;
}

.bttn.bttnRev {
    background: #fff;
    color: #0795D6;
}

.bttnContainer .bttn {
    margin: 10px;
    z-index: 2;
    position: relative;
}

.flex1 {
    flex: 1;
}

.flex2 {
    flex: 2;
}

#fullLeadin::after, #hero::after, #heroInner::after {
    content: '';
    position: absolute;
    width: 100%;
    top: 0;
    bottom: 0;
    background-color: #1F252E88;
}

header {
    background-color: #1F252E;
    display: flex;
    justify-content: space-between;
    padding: 20px 8vw;
    align-items: center;
}

header nav {

}

header nav li {
    display: inline-block;
    position: relative;
}

header nav li a {
    text-decoration: none;
    color: #fff;
    font-weight: 300;
    padding: 0 5px;
}

header nav li .sub-menu {
    display: none;
    position: absolute;
    background-color: #fff;
    z-index: 3;
    white-space: nowrap;
    padding: 15px;
    left: -15px;
    border-radius: 4px;
    transition:ease-out .3s;
}

header nav li:hover .sub-menu {
    display: block;
    transition:all .6s;
}

header nav li .sub-menu li {
    display: block;
    padding: 5px 0
}

header nav li .sub-menu li a {
    color: #1F252E;
    display: block;
}

header nav li .sub-menu li:hover a {color: #69f !important;}

header .topLogo {
    height: 80px;
    width: auto;
}

.topcontacts {
    text-align: right;
    padding: 0 5px 20px;
    display: flex;
    justify-content: flex-end;
}

.topcontacts a {
    color: #fff;
    display: inline-block;
    font-weight: bold;
}

.topcontacts .telTop {
    margin-left: 30px;
    display: flex;
    align-items: center;
}

.topcontacts i {
    height: 30px;
    width: 30px;
    display: block;
    background-size: cover;
    margin-right: 10px;
}

.topcontacts .telTop i {
    background-image: url(images/icoT_-02.svg);
}

.topcontacts .emailTop {
    display: flex;
    align-items: center;
}

.topcontacts .emailTop i {
    background-image: url(images/icoT_-03.svg);
}

#hero {
    flex-direction: column;
    height: 600px;
    background-color: #ccc;
    align-items: center;
    justify-content: center;
    color: #fff;
    background-image: url(images/hero.jpg)
}


#heroInner {
    flex-direction: column;
    min-height: 300px;
    background-color: #ccc;
    align-items: center;
    justify-content: center;
    color: #fff;
    padding: 40px 4vw;
    background-image: url(images/hero.jpg)
}

#heroInner p {
    color: #fff;
    position: relative;
    z-index: 1;
    text-align: center;
    font-size: 1.2em;
    margin-bottom: 30px;
    padding: 0 8vw;
    max-width: 920px;
}

#heroInner h1 {
    text-align: center;
    font-size: 2.8em;
    text-shadow: 0px 2px 4px #1113;
}

#hero h1 {
    text-align: center;
    font-size: 2.8em;
    text-shadow: 0px 2px 4px #1113;
}

#sectionLeadin {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 60px 8vw;
}

#sectionLeadin p {
    max-width: 900px;
    margin: 0 auto 30px;
    display: block;
    text-align: center;
}

#sectionLeadin i {
    background-color: #0795D6;
    display: block;
    border-radius: 100%;
    max-width: 160px;
    padding: 30px;
    margin: 0 auto 20px;
}

.threeLeadin {
    width: 90%;
    padding-top: 50px;
}

.threeLeadin h3 {
    line-height: 1em;
    font-size: 1.5em;
}

.threeLeadin li {
    display: inline-block;
    padding: 20px;
    width: 33%;
    text-align: center;
}

.threeLeadin li .bttn {
    margin: 0 auto;
}

.threeLeadin li p {
    font-size: 1em;
}

#fullLeadin {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 450px;
    background-color: #494949;
    color: #fff;
    text-align: center;
}

#fullLeadin h3 {
    padding-bottom: 30px;
    position: relative;
    z-index: 2;
}

#fullLeadin p {
    max-width: 900px;
    margin: 0 auto 20px;
    display: block;
    text-align: center;
    position: relative;
    z-index: 2;
}

#fullLeadin .bttn {
    position: relative;
    z-index: 2;
}

#twoLeadin {
    background-color: #F7F7F7;
    justify-content: space-between;
    padding: 60px 8vw;
}

#twoLeadin>div {
    background-color: #fff;
    width: 48%;
    padding: 40px 70px;
    box-shadow: 0 1px 5px 6px #0001;
    position: relative;
}

/*#twoLeadin>div .bttn {
    position: absolute;
    bottom: 70px;
    left: 40px;
    right: 40px;
}*/

#twoLeadin p {
    font-weight: 300;
    font-size: 1em;
    padding-bottom: 30px;
}

#twoLeadin h4 {
    font-family: 'CircularMed';
    padding: 0;
    margin: 0 0 20px;
    font-size: 1.6em;
}

#twoLeadin h4 span {
}

.icoCandidate, .icoClient {
    display: flex;
    align-items: center;
}

.icoCandidate i {
    background-image: url(images/Icons_grey_-02.svg);
    background-size: cover;
    height: 60px;
    width: 60px;
    display: block;
    margin-right: 10px;
}

.icoClient i {
    background-image: url(images/Icons_grey_-01.svg);
    background-size: cover;
    height: 60px;
    width: 60px;
    display: block;
    margin-right: 10px;
}

#contactModule {
    background-color: #1F252E;
    color: #fff;
    padding: 60px 8vw;
}

#contactModule h5 {
    font-size: 1.4em;
}


footer {
    background-color: #333333;
    color: #fff;
    text-align: center;
    display: flex;
    padding: 10px;
    justify-content: center;
}

footer a {
    color: #fff;

}

.lead1 {
    background-image: url(images/hero-2.jpg);
    background-position: top center;
    background-size: cover;
}

.lead2 {
    background-image: url(images/hero-1.jpg);
    background-position: center;
    background-size: cover;
}

#jobFeed {
    flex-direction: column;
    background-color: #1F252E;
    padding: 60px 8vw;
    align-items: center;
}

#jobFeed h2 {
    color: #fff;
    font-size: 2em;
    padding-bottom: 60px;
}

.jobList li {
    background-color: #fff;
    width: 32%;
    padding: 30px 30px 10px;
    box-shadow: 1px 1px 10px 5px #1115;
    margin-bottom: 30px;
}

.jobList h3 {
    padding-bottom: 10px;
}

.jobList {
    justify-content: space-between;
    list-style: none;
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    margin-bottom: 60px;
}

.jobList p {

}

.jlFull li {
    margin-bottom: 30px;
}

.jobList .jobFoot {
    display: flex;
    justify-content: space-between;
    padding-top: 10px;
    border-top: 1px solid #ccc;
    margin-top: 10px;
    align-items: center;
}

.jobList .jobFoot span {
    font-weight: 800;
}

.jobList .jobFoot a {
    background: rgb(3,155,222);
    background: linear-gradient(209deg, rgba(3,155,222,1) 0%, rgba(28,111,168,1) 100%);
    display: flex;
    height: 50px;
    color: #fff;
    text-decoration: none;
    align-items: center;
    justify-content: center;
    font-weight: 300;
    letter-spacing: 3px;
    padding: 0 20px;
    text-transform: uppercase;
    border-radius: 50px;
}

#mainContent {
    display: flex;
    background-color: #F7F7F7;
}

#mainContent article {
    flex: 2;
    padding: 60px 30px 60px 10vw;;
}

#mainContent article.fl1 {
    flex: 1;
}

#mainContent article p {
    padding-bottom: 1.6em;
}

#mainContent article a {
    text-decoration: none;
    color: #0795D6;
}

#mainContent article h2 {
    font-size: 1.8em;
    margin-top: 20px;    
}

#mainContent article p {
    font-size: 1.2em;
}

#mainContent article p:first-of-type {
    
}

#mainContent article {
    
}

#mainSidebar {
    background-color: #1F252E;
    padding: 60px 30px;
    flex: 1;
}

#mainSidebar h4 {
    font-size: 2em;
    color: #fff;
}

#mainSidebar p {
    color: #fff;
    font-weight: bold;
}

#mainSidebar.quotesBar {
    background-color: #F7F7F7;
    padding-right: 4vw;
    padding-top: 120px;
}

.linkedinFooter {
    color: #fff;
    display: flex;
    align-items: center;
    margin-top: 30px;
}

.linkedinFooter i {
    background-image: url(images/LI_Ico.svg);
    background-size: cover;
    height: 40px;
    width: 40px;
    margin-right: 10px;
    display: block;
}

.wpcf7-form .sector, .wpcf7-form .experience, .wpcf7-form .salary {
    background-color: #fff;
    width: 100%;
    height: 40px;
    border-radius: 4px;
    border: none;
    overflow: hidden;
    display: block;
}

.wpcf7-form input {
    width: 100%;
    height: 40px;
    margin-bottom: 20px;
    border-radius: 4px;
    border: none;
    padding: 0 10px;
}

#contactModule form {
    padding-top: 40px;
}

#contactModule .wpcf7-submit {
    background-color: rgba(3,155,222,1);
    background: linear-gradient(209deg, rgba(3,155,222,1) 0%, rgba(28,111,168,1) 100%);
    width: 48%;
    display: flex;
    height: 40px;
    color: #fff;
    text-decoration: none;
    align-items: center;
    justify-content: center;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 3px;
    transition: all .2s;  
}

#contactModule .wpcf7-spinner {
    display: none;
}

.wpcf7-form select {
    -webkit-appearance: none;
    border: none;
    width: 100%;
    background-color: transparent;
    width: 110%;
    height: 40px;
    padding-left: 10px;
}

#mainSidebar .wpcf7-form {
    padding-top: 40px;
}

.wpcf7-submit {
    background-color: rgba(3,155,222,1);
    background: linear-gradient(209deg, rgba(3,155,222,1) 0%, rgba(28,111,168,1) 100%);
    width: 100%;
    display: flex;
    height: 50px;
    color: #fff;
    text-decoration: none;
    align-items: center;
    justify-content: center;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 3px;
    transition: all .2s;    
}

.cvupload {
    opacity: 0;
}

span.CV {
    display: block;
}

span.CV::after {
    content: 'Browse Files';
    position: absolute;
    right: 0;
    height: 40px;
    display: flex;
    top: 0;
    align-items: center;
    width: 50%;
    justify-content: center;
    background-color: #ccc;
    color: #494949;
    font-weight: bold;
    border-radius: 50px;
}

span.CV::before {
    content: 'Upload your CV';
    position: absolute;
    left: 0;
    color: #fff;
    height: 40px;
    display: flex;
    top: 0;
    align-items: center;
    width: 50%;
}

input:is([type="button"], [type="submit"], [type="reset"]):active, input[type="file"]:active::file-selector-button, button:active {
}

.flexwrap {
    display: flex;
    justify-content: space-between;
}

.flexwrap span {
    width: 48%;
}

.wpcf7-textarea {
    width: 100%;
    padding: 10px;
    border-radius: 4px;
    border: none;
    margin-bottom: 10px;
}

#newsfeed {
    display: flex;
    flex-direction: column;
    background-color: #1F252E;
    align-items: center;
    padding: 20px 4vw;
}

#newsfeed article {
    max-width: 1240px;
    width: 100%;
    display: flex;
    background-color: #fff;
    margin: 20px;
}

#newsfeed h3 {
    font-size: 1.6em;
}

#newsfeed h3 a {
    color: #515151;
}

#newsfeed div {
    flex: 1;
}

#newsfeed .nContent {
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#newsfeed .nImage {
    overflow: hidden;
}

#newsfeed img {
    object-fit: cover;
    object-position: center;
}

#newsfeed .readmore {
    background: rgb(3,155,222);
    background: linear-gradient(209deg, rgba(3,155,222,1) 0%, rgba(28,111,168,1) 100%);
    display: flex;
    height: 50px;
    color: #fff;
    text-decoration: none;
    align-items: center;
    justify-content: center;
    font-weight: 300;
    letter-spacing: 3px;
    padding: 0 60px;
    text-transform: uppercase;
    border-radius: 50px;
    width: fit-content;
    margin-top: 20px;
}

#headingBreak {
    background-color: #fff;
    text-align: center;
}

#headingBreak h2 {
    margin: 0;
    padding: 30px;
    display: block;
    text-align: center;
    width: 100%;
}

.quotesBar h5 {
    font-family: 'CircularMed';
    margin-bottom: 30px;
    font-size: 1.4em;
    position: relative;
    padding-left: 60px;
    line-height: 1.3em;
}

.quotesBar h5::before {
    background-image: url(images/quote.svg);
    content: '';
    height: 60px;
    width: 50px;
    background-size: 50px;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
}

#mainSidebar.quotesBar p {
    font-family: 'CircularMed';
    text-align: right;
    color: #515151;
    line-height: 1.2em;
}

#mainContent.newsContent {
    background-color: #1d2327;
}

#mainContent.newsContent article {
    max-width: 1200px;
    background-color: #fff;
    margin: -80px auto 70px;
    padding: 60px 120px;
}

#mainContent.newsContent {
    
}

.jInfo {
    padding-bottom: 60px;
    font-size: 1.2em;
}

.jInfo dl {
    display: flex;
    flex-wrap: wrap;
}

.jInfo dd {
   width: 70%;
}

.jInfo dt {
     width: 30%;
    font-weight: 800;
    padding-bottom: 8px;
}

.single-jobs .entry ul {
    background-color: #F5EFE1;
    margin: 0 0 40px -40px;
    padding: 30px 60px;
    
}

.single-jobs .entry ul li {
    list-style: disc;
    font-weight: bold;
    padding: 10px 0;
}

.single-jobs .entry h3 {
    font-size: 1.6em;
    padding-top: 30px;
}

.single-jobs #mainContent article p:first-of-type {
    border-left: 5px solid #0795D6;
    font-size: 1.6em;
    line-height: 1.3em;
    padding: 5px 5px 5px 20px;
    margin-bottom: 2em;
    
}

.menubtn {
    display: none;
}

.navtopcontacts {
    display: none;
}