/**
 * html5doctor.com Reset Stylesheet (Eric Meyer's Reset Reloaded + HTML5 baseline)
 * v1.6.1 2010-09-17 | Authors: Eric Meyer & Richard Clark
 * html5doctor.com/html-5-reset-stylesheet/
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, section {
    display: block;
}

/* spinbox */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

/* 1. hides the dotted lines around an element when it receives focus */
/* 2. makes buttons en anchors with the same class the same size in Firefox */
* { _noFocusLine: expression(this.hideFocus=true); } /* ie7 */
::-moz-focus-inner {border:0;}                       /* firefox */
:focus {outline:none;}                               /* ie8, chrome, etc */

.display-none {
    display:none;
}

.display-block {
    display:block !important;
}

.width-auto {
    width: auto !important;
}

/* @GROUP Bootstrap extra styles 
 * Defined first to be able to override Bootstrap defaults -- BK 14-4-2020
*/

.bootstrapArea a {
    color: #290064 !important;
}

.bootstrapArea .badge-orange a {
    color: #f9a31a !important;
}

.bootstrapArea a.btn-primary,
.bootstrapArea a.btn-secondary {
    color: #fff !important;
}

.modalLoginLink {
    margin-left: 4px;
}

.bootstrapArea .btn,
.btn {
    border-radius: 27.5px;
    -webkit-border-radius: 27.5px;
    -moz-border-radius: 27.5px;
    -o-border-radius: 27.5px;
    /*font-size: 18px;*/
    line-height: 1;
    max-width: 320px;
    padding: 11px;
    text-decoration: none;
}

.bootstrapArea .btn-primary,
.btn-primary {
    color: #fff !important;
    background-color: #290064 !important;
    border-color: #290064 !important;
    /*max-width: 256px;*/
    padding: 11px 44px;
    font-weight: bold;
    font-family: 'AvertaBold';
}

.bootstrapArea .btn-primary:hover,
.btn-primary:hover,
.btn-primary.active {
    border-color: #ffd946 !important;
    background-color: #ffd946 !important;
    color: #290064 !important;
}

.bootstrapArea .btn-cta-button-blue,
.btn-cta-button-blue {
    border-color: #4965FF !important;
    background-color: #4965FF !important;
    color: #fff !important;
    font-family: 'AvertaBold';
    font-weight: bold;
    padding: 11px 44px;
    max-width: 320px;
}

.btn-cta-button-blue:hover {
    background-color: #bac4ff !important;
    color: #290064 !important;
    border-color: #bac4ff !important;
}

.bootstrapArea .btn-cta-button-orange,
.btn-cta-button-orange {
    border-color: #F9A31A !important;
    background-color: #F9A31A !important;
    color: #290064 !important;
    font-family: 'AvertaBold';
    font-weight: bold;
    padding: 11px 44px;
    max-width: 320px;
}

.btn-cta-button-orange:hover {
    background-color: rgba(249, 163, 26, .25) !important;
    color: #290064 !important;
    border-color: rgba(249, 163, 26, .25) !important;
}

.bootstrapArea .btn-cta-button-green,
.btn-cta-button-green {
    border-color: #82db27 !important;
    background-color: #82db27 !important;
    color: #fff !important;
    font-family: 'AvertaBold';
    font-weight: bold;
    padding: 11px 44px;
    max-width: 320px;
}

.bootstrapArea .btn-cta-button-red,
.btn-cta-button-red {
    border-color: #ff4a33 !important;
    background-color: #ff4a33 !important;
    color: #fff !important;
    font-family: 'AvertaBold';
    font-weight: bold;
    padding: 11px 44px;
    max-width: 320px;
}

.bootstrapArea .btn-narrow {
    padding: 11px 22px;
}

.bootstrapArea .btn-thin {
    padding: 7px 44px;
}

.bootstrapArea .btn-small {
    padding: 7px 22px;
}

.bootstrapArea .btn-color-mint-green {
    border-color: #d3fddc !important;
    background-color: #d3fddc !important;
    color: #290064 !important;
}

.bootstrapArea .headerMenuItem {
    color: #fff !important;
}

.bootstrapArea .ctaButton:hover, .bootstrapArea .greyButton:hover, .bootstrapArea .transparent-on-hover:hover {
    color: #ffffff !important; /* correct bootstrap */
    text-decoration: none !important;
}

.bootstrapArea a:hover {
    text-decoration: none !important;
}

.modal-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  background-color: #000;
}
.modal-backdrop.fade {
  opacity: 0;
}
.modal-backdrop.show {
  opacity: 0.5;
}

.text-small {

}

/**
 *
 *  HOOFDKRAAN.NL
 *
*/

@import url("https://fast.fonts.net/lt/1.css?apiType=css&c=53e99593-9b7d-478d-97c3-dc2cbde6969b&fontids=1581731,1583189,1586764,1587114,1587810");

@font-face{
    font-family:"AvertaExtraBold";
    src:url("fonts/1581731/f409cb4c-a797-4b0b-9dc3-76a17288d995.woff2") format("woff2"),url("Fonts/1581731/2ded309e-64e7-4bc7-b90e-af145940e5a5.woff") format("woff");
}

@font-face{
    font-family:"AvertaItalic";
    src:url("fonts/1583189/a5a6b226-c201-4c7e-aa75-6d01874f1a83.woff2") format("woff2"),url("Fonts/1583189/09560f34-5e51-44e7-962d-dbb751f7dee4.woff") format("woff");
}

@font-face{
    font-family:"Averta";
    src:url("fonts/1586764/166ce875-a649-4826-a5a0-a24f2dd89cd5.woff2") format("woff2"),url("Fonts/1586764/fc417db9-6d91-4c85-81b1-2ff3d583d149.woff") format("woff");
}

@font-face{
    font-family:"AvertaBoldItalic";
    src:url("fonts/1587114/b7fbd7d4-32a7-453d-84d3-1345247e48bb.woff2") format("woff2"),url("Fonts/1587114/934be726-c31d-448f-9d56-76f74f872f91.woff") format("woff");
}

@font-face{
    font-family:"AvertaBold";
    src:url("fonts/1587810/91271893-3829-4dc9-a79b-a47b7146022c.woff2") format("woff2"),url("Fonts/1587810/17dd7da6-7e09-45f6-bae4-9a944baed5a6.woff") format("woff");
}


body {
    background-color: #fff; /* #9cd1d8 #b8dee3 */
    color: #290064;
    font: 16px 'Averta', sans-serif;
}

body.shortHeader {
    background-position: 0 80px;
}

body.noHeader {
    margin: 10px;
}

.noClickHeader{
    margin-bottom: 30px;
}

body.admin {
    background-color: rgb(232,223,206);
}

#page {
    /*background-image: url("../img/page-bg-shade.png");
    background-repeat: repeat-x;
    background-position: 0 -84px;*/
    min-height: 450px;
    padding-top: 2px;
    width: 100%;
    z-index: 1;
    background-color: #fff;
}

#page.home {
    background-color: #fff;
    padding-top: 0px;
}

#page.landing-page {
    background-color: #fff;
}

body.noClick #page {
    /*background-image: url("../img/page-bg-shade.png");*/
    background-position: initial;
    padding-top: 0;
}

.pageCenteredSection {
    margin: 0 auto;
    width: 1120px;
    /* temporary */
    /*margin-top: 147px;*/
}

.pageCenteredSection:before, .pageCenteredSection:after {
    content: " ";
    clear: both;
    display: table;
}

#page .pageCenteredSection {
    padding: 0 40px;
}

#page .coloredPageCenteredSection {
    padding: 0 !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}

#page.home .pageCenteredSection {
    margin: 0 auto;
    position: relative;
    width: 940px;
}

.pageTopContent {
    display: inline-block;
    /*min-height: 375px;*/
    width: 100%;
}

p {
    line-height: 22px;
}

h1, .bootstrapArea h1 {
    font-family: 'AvertaExtraBold';
    color: #290064;
    font-size: 28px;
    margin-bottom: 10px;
    font-weight: bolder;
}

.hLink, .hLink:visited {
    color: inherit;
    text-decoration: underline;
}

.hLink:hover {
    color: inherit;
    text-decoration: none;
}

h2, .bootstrapArea h2 {
    font-family: 'AvertaBold' !important;
    font-weight: bold !important;
    color: #290064;
    font-size: 16px;
    margin-bottom: 8px !important;
}

h3, h4, h5 {
    font-size: 19px !important;
    font-family: 'AvertaBold' !important;
    font-weight: bold !important;
    margin-bottom: 5px;
    margin-block-end: 0px;
}



.h1Like {
    /* from main.css h1 */
    color: #290064;
    font-size: 28px !important;
    margin-bottom: 10px;
    font-weight: extrabold;
    font-family: 'AvertaExtraBold' !important;
}

.h2Like {
    /* from main.css h2 */
    font-weight: bold !important;
    font-family: 'AvertaBold' !important;
    color: #290064;
    font-size: 16px !important;
    margin-bottom: 8px !important;
}

.h3Like {
    font-size: 19px !important;
    font-family: 'AvertaBold' !important;
    font-weight: bold !important;
    margin-bottom: 5px;
}

ul, ol {
    margin-left: 20px;
}

a {
    color: #290064;
}

a:hover, a:focus, a:visited {
    color: #290064;
}

strong {
    font-weight: bold;
}

input[type=text], input[type=tel], textarea {
    /*color: #474747;
    font: 13px Tahoma, sans-serif;*/
}

input, button, a {
    /*outline: none;*/
}

.primaryColumn {
    width: auto;
    overflow: hidden;
}

.sideColumnLeft, .sideColumnRight {
    width: 300px;
}

.sideColumnLeft {
    float: left;
    margin-right: 25px;
}

.sideColumnRight {
    float: right;
    margin-left: 25px;
}

.pageElement, .sideBarElement {
    margin-bottom: 35px;
}

.pageElementHeader {
    padding-bottom: 10px;
}

.pageElementHeader, .pageElementHeader a {
    /*color: #f9a31a;*/
}

.h1HomepageTopBanner {
    font-size: 45px !important;
}

.h2HomepageTopBanner {
    font-size: 25px !important;
}

.hpHeaderBlock {
    background-color: #fff;
    padding: 40px 0 22px 0;
    margin: 30px 0 0 0;
    text-align: center;
}

.hpHeaderBlock h2 {
    background-repeat: no-repeat;
    background-position: left center;
    color: #290064;
    display: inline-block;
    font-family: 'AvertaExtraBold';
    font-weight: bold;
    font-size: 52px;
    margin: -15px auto 0 auto;
}

.hpWidgetContainer {
    margin-bottom: 55px;
    padding: 1px;
}

.hpWidget {
    background-color: #fff;
    margin: 30px auto -30px auto;
}

/* @group header */

header {
    padding: 20px 30px;
    background-color: #fff;
    /*box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3);*/
    position: relative;
}

header .pageCenteredSection {
    max-width: 1400px;
    padding: 0 20px;
    width: auto;
}

.headerLogo {
    float: left;
    /*margin: 0 0 0 15px;*/
    margin-top: -4px;
    position: relative;
    width: 250px;
    margin-right: 11px;
}

.headerLogoAndMenu {
    z-index: 10;
}

.headerLogo a {
    position: relative;
    z-index: 1;
}

.headerLogo img {
    /*max-width: 80% !important;*/
}

/*
.logoPayOff {
    bottom: 1%;
    color: #3c99ac;
    font-size: 13px;
    font-style: italic;
    left: 14%;
    position: absolute;
    white-space: nowrap;
}
*/

.stickyHeader {
    background-color: #fff;
    border-bottom: 1px solid #e0e0e0;
    left: 0;
    position: fixed;
    text-align: center;
    top: -250px;
    transform: translateZ(0);
    transition: top .35s ease .1s;
    width: 100%;
    z-index: 100;
    padding: 5px;
}

.stickyHeader.active {
    top: 0;
}

.stickyHeader .headerLogo {
    margin: 4px 0 0 0;
    width: 250px;
}

.stickyHeader .logoPayOff {
    font-size: 10px;
    left: 25%;
}

.stickyHeader #headerMenu {
    margin-top: 18px;
}

.stickyHeader .headerMenuItem {
    font-size: 14px;
}

.stickyHeader .loginIndicator  {
    display: inline-block;
    float: right;
    margin: 27px 30px 0 0;
}

.stickyHeader .btn-cta-button-orange {
    float: right;
    margin-top: 23px;
    margin-right: 20px;
}

.adminPage {
    background: none !important;
}

.adminPage .pageCenteredSection {
    padding: 0 !important;
    width: 95% !important;
}

.hideTopMenu .headerLogo {
   margin: -48px 0 12px 15px;
}

.hideTopMenu #globalNav {
    top: 10px;
    position: relative;
}

#login-service-modal {
    display:  none;
}

/* @group mobileHeader */

.mobileHeader {
    padding: 10px 0;
}

.mobileHeader .hamburgerMenuIcon,
.mobileHeader .mobileLogo {
    z-index: 1;
}

.mobileHeader .hamburgerMenuIcon img {
    padding: 10px 0;
    min-width: 35px;
    height: 45px;
}

.mobileHeader .mobileLogo img, .mobileHeader .mobileLogo {
    max-height: 45px;
    min-height: 40px;
}

.mobileHeader .mijnHoofdkraanIcon img {
    height:45px;
    min-width: 35px;
    padding: 2px 0;
}

.mijnHoofdkraanIcon {
    z-index: 10;
}

.mobileHeader .hamburgerMenuIcon img {
}

/*   @GROUP hamburgerMenu */

html {
    overflow-y: scroll;
}

/*
Header is relative so z-index: 1 guarantees always displayed on top
*/
/*
header {
    background-color: #3b5998;
    padding: 10px;
    text-decoration: none;
    position: fixed;
    width: 100%;
    z-index: 1;
    -webkit-box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.4);
    box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.4);
}
*/

/*
using background color is important to cover the menu
position absolute isset to cover the whole viewport
*/
#content {
    background-color: #FFFFFF;
    padding: 52px 10px 10px 10px;
    position: relative;
    width: auto;
    height: 100%;
    -webkit-box-shadow: -10px 0px 9px 0px rgba(0, 0, 0, 0.4);
    box-shadow: -10px 0px 9px 0px rgba(0, 0, 0, 0.4);
}

/*
the hamburger button with a little gradient effekt
*/
#hamburger {
    cursor: pointer;
    /*
    border: 1px solid #374C77;
    border-radius: 3px 3px 3px 3px;
    display: block;
    height: 24px;
    padding: 3px 4px 3px;
    position: relative;
    width: 25px;
    background: #4569b2;
    background: -moz-linear-gradient(top, #4569b2 0%, #4062a5 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #4569b2), color-stop(100%, #4062a5));
    background: -webkit-linear-gradient(top, #4569b2 0%, #4062a5 100%);
    background: -o-linear-gradient(top, #4569b2 0%, #4062a5 100%);
    background: -ms-linear-gradient(top, #4569b2 0%, #4062a5 100%);
    background: linear-gradient(to bottom, #4569b2 0%, #4062a5 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4569b2', endColorstr='#4062a5', GradientType=0);
    */
}

/*
The white stripes in the hamburger button
*/
#hamburger div {
    background-color: #fff;
    border: 1px solid #eee;
    border-radius: 2px 2px 2px 2px;
    height: 2px;
    margin-top: 3px;
    width: 90%;
}

/*
The navigation container in the background
*/
#hamburgerMenu {
    opacity: 1;
    display: block;
    left: 0px;
    top: 0px;
    position: fixed;
    width: 275px;
    height: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: auto;
    background: #ffffff;
    margin-left: -320px;
    z-index: 10;
}

#hamburgerMenu .topBannerButtons {
    margin-left: -12px;
}

#hamburgerMenu .btn-cta-button-blue,
#hamburgerMenu .btn-cta-button-orange {
    width: 227px;
    padding: 11px 0px;
}

#hamburgerMenu .visitorActionButtons {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/*
Style the navigation menu
*/
#hamburgerMenu ul {
    list-style: none;
    margin: 0;
    width: 100%;
    padding: 0;
}

#hamburgerMenu li {
    position: relative;
    font-size: 1em;
    font-weight: bold;
    border-bottom: 1px solid #222222;
    border-top: 1px solid #444444;
    padding: 15px;
}

#hamburgerMenu li a {
    color: #fff;
    text-decoration: none;
}

.mijnHoofdkraanIcon .close {
    font-size: 50px;
    color: #290064;
    opacity: 1;
    display: none;
    line-height: 0.75;
    width: 29px;
    padding-left: 20px !important;
    padding-right: 31px !important;
    outline: none !important;
}

/*
The Layer that will be layed over the content
so that the content is unclickable while menu is shown
*/
#contentLayer {
    display: none;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 5;
    cursor: pointer;
}

.hamburgerMenuDescription,
.hamburgerMenuHelpText {
    font-size: 18px;
    font-weight: bold;
    font-family: 'AvertaBold';
    padding: 15px 0;
}

.hamburgerMenuHelpText {
    font-size: 16px;
}

.hamburgerMenuDivider {
    height: 10px;
    border-top: 2px solid #290064;
    color: #474747;
    margin: 15px 0;
}

.hamburgerMenuHelpText i {
    font-size: 25px;
}

/* @group NAV */

#globalNav {
    text-align: right;
    padding: 20px 0px 10px 0;
    margin-right: 25px;
}

.needHelp {
    margin-left: 50px;
}

.helpPhoneNumber {
    color: #3c99ac;
    display: inline-block;
    font-size: 15px;
    font-weight: bold;
    margin-left: 3px;
}

.telephoneTimes {
    font-style: italic;
}

#headerMenu {
    float: right;
    margin-top: 3px;
    text-align: right;
    font-size: 12px;
}

a.headerMenuItem {
    background-color: rgb(0,155,175); /* #f2f8f8 #EDF7F8 #EAF5F7 #F1F8F9 #F2F8F8 #E7F3F5 #F1F7F9 #ECF5F7*/
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -o-border-radius: 2px;
    /*border-color: #bed7d9;
    border-style: solid;
    border-width: 1px 2px 3px 1px;*/
    color: #fff;
    display: inline-block;
    font-size: 15px;
    margin: 0 0 5px 10px;
    padding: 9px 20px;
    text-decoration: none;
}

#headerSubMenu {
    padding-top: 12px; 
}

.headerSubMenuItem {
    display: inline-block;
    padding:0 16px;
}

.headerSubMenuItem a {
    display: inline-block;
}

.topMenuCTAButton {
    background-color: #f9a31a;
}

/* @end */


/* @group FOOTER */

footer {
    padding-top: 40px;
    padding-bottom: 40px;
    background-color: #290064;
}

footer ul{
    float: left;
    list-style: none;
}

footer ul li{
    line-height: 20px;
}

footer h4 {
    font-weight: bold;
    margin-bottom: 10px;
}

footer section h3{
    font-weight: bold;
    margin-bottom: 10px;
}

.footerMenuColumn {
    box-sizing: border-box;
    float: left;
    line-height: 20px;
    width: 25%;
    line-height: 1.4;
}

.footerCategoryColumn {
    float: left;
    line-height: 20px;
    width: 50%;
    line-height: 1.4;
}

#footerCategoryLinks, #footerMenu, #footerPopularLinks {
    padding: 20px 0;
}

#footerMenu {
    overflow: hidden;
}

#footerCategoryLinks {
    /*background-color: #fff; */
}

#footerCategoryLinks, #footerCategoryLinks a {
    color: #fff !important;
}

#footerCategoryLinks h4 {
    color: #f9a31a;
}

.categoryLinks {
}

.categoryLinksColumn {
    box-sizing: border-box;
    float: left;
    padding-right: 4%;
    width: 50%;
}

.categoryLinksColumn a {
    display: block;
}

.footerCategoryColumn.companyLogos {
    background: url(../img/icon-thumbsup.png) no-repeat;
    padding-left: 55px;
    margin-left: -55px;
}

.footerCategoryColumn.companyLogos img {
    max-width: 100%;
}

#footerBottomMenu {
    font-size: 11px;
    padding: 15px 0;
    text-align: center;
}

.footerBottomMenuLeft, .footerBottomMenuCenter, footerBottomMenuRight {
    display: table-cell;
}

.footerBottomMenuRight {
    text-align: right;
}

.footerBottomMenuItem {
    display: inline-block;
    text-align: center;
    padding: 8px 2%;
}

#footerMenu, #footerBottomMenu, #footerMenu a, #footerBottomMenu a, #footerPopularLinks, #footerPopularLinks a, #footerExtraContent {
    color: #fff !important;
}

.socialMediaLink {
    display: inline-block;
    height: 30px;
    margin: 0 1px;
    vertical-align: middle;
    width: 30px;
}

footer .headerLogo img {
    max-width: 243px;
}

footer .headerLogo {
    margin: 0 -20px;
}

footer .subMenuTitle {
    font-family: 'AvertaBold';
    font-weight: bold;
    margin-bottom: 7px;
}

footer .pageCenteredSection {
    padding: 0 40px;
    width: 1080px;
}

footer hr {
    width: 1080px;
}

/* visitorProspectsPopup */

/*
.temp-overlay {
    background-image: url('../img/background_temp.png');
    position: absolute;
    z-index: 2000;
    width: 100%;
    height: 100%;
    background-size: cover;
    opacity: .5;
}
*/

#visitorProspectsPopup .textHighlight {
    color:#f9a31a;
    font-weight: bold;
}

#visitorProspectsPopup .titleHighlight {
    color:#4965ff;
}

#visitorProspectsPopup .modal-content {
    border-radius: 0.8rem;
}

#visitorProspectsPopup .modal-body {
    /*border: 13px #93c7ce5c solid;*/
}

#visitorProspectsPopup .modal-body .close {
    left: 10px;
    position: relative;
    top: -15px;
}


#visitorProspectsPopup ul .fa-check {
    color: #82db27;
}

#visitorProspectsPopup ul {
    font-size:15px;
    margin-right: -15px;
}

#visitorProspectsPopup li i {
    margin-left: -20px;
}

#visitorProspectsPopup li {
    margin-left: 20px;
}

#visitorProspectsPopup .exploreLink {
    font-size:16px;
    text-decoration: underline;
}

#visitorProspectsPopup .placeProjectButton {
    font-size:18px;
    padding: 0.6rem 1rem;
}

#visitorProspectsPopup .placeProjectButton .fa {
    margin-right: 0.25rem;
}

@media screen and (max-width: 768px) {
    #visitorProspectsPopup h3 {
        font-size: 1.25rem;
    }
    #visitorProspectsPopup .buttons {
        text-align: center !important;
    }
    #visitorProspectsPopup .exploreLink {
        margin-bottom: 15px !important;
    }
}

/* Icon in Rectangular Shape */
.socialMediaLink.facebook {
    background: url("../img/new/social-media-logos/facebook.svg") no-repeat;
    background-size: 30px 30px;
}
.socialMediaLink.twitter {
    background: url("../img/new/social-media-logos/twitter.svg") no-repeat;
    background-size: 30px 30px;
}
.socialMediaLink.googleplus {
    background: url("../img/new/social-media-logos/googleplus.svg") no-repeat;
    background-size: 30px 30px;
}
.socialMediaLink.linkedin {
    background: url("../img/new/social-media-logos/linkedin.svg") no-repeat;
    background-size: 30px 30px;
}
.socialMediaLink.youtube {
    background: url("../img/new/social-media-logos/youtube.svg") no-repeat;
    background-size: 30px 30px;
    border-radius:1px;
}
.socialMediaLink.flickr {
    background: url("../img/icons/flickr.svg") no-repeat;
    background-size: 30px 30px;
    border-radius:1px;
}
.socialMediaLink.pinterest {
    background: url("../img/icons/pinterest.svg") no-repeat;
    background-size: 30px 30px;
}
.socialMediaLink.instagram {
    background: url("../img/new/social-media-logos/instagram.svg") no-repeat;
    background-size: 30px 30px;
    border-radius:1px;
}

#footerExtraContent a {
    text-decoration: underline;
    color: #9A9A9A;
}

#footerExtraContent a:hover {
    text-decoration: none;
}

#footerPopularLinks {
    margin-top: 20px;
}

.popularKeyword {
    box-sizing: border-box;
    float: left;
    font-size: 12px;
    margin: 5px 0;
    width: 25%;
}

.popularKeyword a {
    color: #bbb !important;
}

/* @end */

/* @group content box */

.contentBox {
    /*background-color: #fff;*/
    border-radius: 7px;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    -o-border-radius: 7px;
    padding: 18px 18px 18px 18px;
    position: relative;
    /*-moz-box-shadow:    0 0 4px rgba(0,0,0,0.4);
    -webkit-box-shadow: 0 0 4px rgba(0,0,0,0.4);
    box-shadow:         0 0 4px rgba(0,0,0,0.4);
    border: 1px solid #D5D5D5;*/
}

.tabPanel .contentBox {
    padding: 0;
}

.contentBoxTop, .contentBoxBottom  {
    /* background-color: #F2F8F8; */
    /*color: #979797;*/ /*#888*/
    /*padding: 25px;*/
}

.contentBoxTop {
    display: table;
    /*margin: -25px -25px 25px -25px;*/
    border-radius: 7px 7px 0px 0px;
    -webkit-border-radius: 7px 7px 0px 0px;
    -moz-border-radius: 7px 7px 0px 0px;
    -o-border-radius: 7px 7px 0px 0px;
    /*border-bottom: 0.5px solid #dbe7ea;*/
    width: 100%;
}

.contentBoxBottom {
    border-radius: 0px 0px 7px 7px;
    -webkit-border-radius: 0px 0px 7px 7px;
    -moz-border-radius: 0px 0px 7px 7px;
    -o-border-radius: 0px 0px 7px 7px;
    /*border-top: 0.5px solid #dbe7ea;*/
    margin: 25px -25px -25px;
    width: 100%;
}

.contentBoxTop a, .contentBoxBottom a  {
    color: #f9a31a;
}

.contentBoxTop a:hover, .contentBoxBottom a:hover  {
    color: #290064;
}

.contentBoxTop h1, .contentBoxTop h2 {
    margin-bottom: 0;
    word-wrap: break-word;
}

.contentBoxTitle {
    display: table-cell;
}

.contentBoxTopActions {
    display: table-cell;
    text-align: right;
}

.contentBoxTopActions > * {
    margin-left: 8px !important;
}

.contentBoxTopActions.accordion > *, .contentBoxBottomActionsLeft.accordion > *, .contentBoxBottomActionsRight.accordion > * {
    margin-bottom: 8px !important;
}

.contentBoxTopActions.accordion > *:last-child, .contentBoxBottomActionsLeft.accordion > *:last-child, .contentBoxBottomActionsRight.accordion > *:last-child  {
    margin-bottom: 0 !important;
}

.contentBoxBottomActionsLeft {
    float: left;
}

.contentBoxBottomActionsLeft > * {
    margin-right: 10px !important;
}

.contentBoxBottomActionsRight {
    float: right;
}

.contentBoxBottomActionsRight  > * {
    margin-left: 10px !important;
}

.leftAction {
    float: left;
    margin-right: 10px;
}

.rightAction {
    float: right;
    margin-left: 10px;
}

.rightActionsContainer {
    text-align: right;
}

.rightActionsContainer > * {
    margin-left: 8px !important;
}

/* @end */

/* @group New Content Box */

.newContentBox {
    padding-left: 23px;
    padding-right: 23px;
    box-shadow: #ddd 0px 0px 6px 0px;
    padding-top: 15px;
    border-radius: 16px;
    padding-bottom: 15px;
    position: relative;
}

.topNewContentBox {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 0;
}

.topNewContentBox {
    text-align: center;
}

.topNewContentBox .contentBoxTop {
    padding-bottom: 15px;
}

.loginBox {
    padding-top: 50px;
    padding-bottom: 85px;
}


/* @end */


/* @group CTA Button */

.ctaButton, .ctaButton:visited, .greyButton, .greyButton:visited {
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -o-border-radius: 2px;
    /*-moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);*/
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
    line-height: 24px;
    margin: 0em; /*  maakt a.ctaButton en button.ctaButton even groot in Chrome en Safari*/
    outline: none;
    padding: 5px 16px;
    text-decoration: none;
    transition: opacity .25s ease-in;
    white-space: nowrap;

}

.ctaButton, .ctaButton:visited {
    background-color: #f9a31a;/*#FF6600;*/
    border: none;/* solid 1px #FF6600; #FF812D;*/
    /*background-image: linear-gradient(bottom, #FF6600 26%, #FFAA00  63%);
    background-image: -o-linear-gradient(bottom, #FF6600  26%, #FFAA00 63%);
    background-image: -moz-linear-gradient(bottom, #FF6600 26%, #FFAA00 63%);
    background-image: -webkit-linear-gradient(bottom, #FF6600 26%, #FFAA00 63%);
    background-image: -ms-linear-gradient(bottom, #FF6600 26%, #FFAA00 63%);
    filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#FFAA00', EndColorStr='#FF6600'),
        progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=120, Color='#333333');
    -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#FFAA00', EndColorStr='#FF6600')";*/
}

.greyButton, .greyButton:visited {
    background-color: #EBEBEB;
    /*background-image: linear-gradient(bottom, #EBEBEB 26%, #FAFAFA 63%);
    background-image: -o-linear-gradient(bottom, #EBEBEB 26%, #FAFAFA 63%);
    background-image: -moz-linear-gradient(bottom, #EBEBEB 26%, #FAFAFA 63%);
    background-image: -webkit-linear-gradient(bottom, #EBEBEB 26%, #FAFAFA 63%);
    background-image: -ms-linear-gradient(bottom, #EBEBEB 26%, #FAFAFA 63%);*/
    border: none;/*solid 1px #ADADAD;
    /*filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#FAFAFA', EndColorStr='#EBEBEB'),
        progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=120, Color='#333333');
    -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#FAFAFA', EndColorStr='#EBEBEB')";*/
}

.transparent-on-hover {
    -webkit-transition: opacity .25s ease-in;
    -moz-transition: opacity .25s ease-in;
    -ms-transition: opacity .25s ease-in;
    -o-transition: opacity .25s ease-in;
    transition: opacity .25s ease-in;
}

.ctaButton:hover, .greyButton:hover, .transparent-on-hover:hover {
    -moz-opacity: 0.8;
    opacity:.80;
    filter: alpha(opacity=80);
}

/*
.greyButton:hover {
    background-image: linear-gradient(bottom, #FAFAFA 19%,#EBEBEB 100%);
    background-image: -o-linear-gradient(bottom, #FAFAFA 19%, #EBEBEB 100%);
    background-image: -moz-linear-gradient(bottom, #FAFAFA 19%, #EBEBEB 100%);
    background-image: -webkit-linear-gradient(bottom, #FAFAFA 19%, #EBEBEB 100%);
    background-image: -ms-linear-gradient(bottom, rgb #FAFAFA 19%, #EBEBEB 100%);
    filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#EBEBEB', EndColorStr='#FAFAFA');
    -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='0EBEBEB', EndColorStr='#FAFAFA')";
}
*/

.ctaButton div, .greyButton div {
    display: inline-block;
    vertical-align: middle;
    font-size: 15px;
    font-family: Helvetica,Arial,sans-serif;
    /*font-weight: bold;*/
    text-align: left;
}

.ctaButton div {
    /*text-shadow: 1px 1px 0 #707070;*/
    color: #FFF;
}

.greyButton div {
    color: #929292;
}

.ctaButton .headText {
    font-size: 20px;
    display: block;
    line-height: 37px;
    /*padding: 10px 0 0 3px;*/
}

.ctaButton .subText {
    color: rgba(0, 0, 0, 0.6);
    display: block;
    /*padding: 5px 0 10px 3px;*/
    font-size: 14px;
    text-shadow: none;
    margin: -5px 0 5px 0;
}

.ctaButtonArrow {
    vertical-align: middle;
    margin: 0 -9px 0 5px;
}

.ctaButtonLeadIn, .ctaButtonLeadOut {
    color: #9A9A9A;
    padding-left: 2px;
}

.ctaButtonLeadIn {
    padding-bottom: 3px;
}

.ctaButtonLeadOut {
    padding-top: 2px;
}

.smalltextButton div {
    font-size: 14px;
}

/* @end */

/* @group homepage topBanner */

#topBanner {
    margin-bottom: 25px;
    overflow: hidden;
}

.topBannerTop {
}

.topBannerTitles {
    margin: 0 auto;
    text-align: center;
}

.topBannerTitles h1 {
    font-weight: bold;
    margin-bottom: 20px;
}

.topBannerTitles h2 {
    margin-bottom: 50px;
}

.connectionShape {
    width: 300px;
    transform: rotate(-17deg);
}

.topBannerAboutUsText {
    padding-left: 133px !important;
    text-align: left;
}

.topBannerAboutUsText p {
    line-height: 26px;
}

.topBannerAboutUs {
    /*display: flex; */
    margin-left: auto;
    margin-right: auto;
    /*max-width: 900px;*/
}

.topBannerAboutUsImage {
    margin-top: -15px;
}

.hero-buttons a {
    border-radius: 2px;
    -moz-box-shadow:    1px 1px 3px rgba(0,0,0,0.4);
    -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.4);
    box-shadow:         1px 1px 3px rgba(0,0,0,0.4);
    color: #fff;
    display: inline-block;
    font-size: 19px;
    margin-top: 20px;
    padding: 12px 21px;
    text-decoration: none;
    /*text-shadow: 1px 1px 0 #666;*/
}

a.hero-project-button {
    background-color: #f9a31a;
    margin-right: 3%;
    transition: background-color .25s ease-in;
}

a.hero-project-button:hover {
    background-color: #ff7e33;
}

a.hero-expert-button {
    background-color: rgb(0,155,175);
    transition: background-color .25s ease-in;
}

a.hero-expert-button:hover {
    background-color: #33afbf;
}

.hero-how-it-works {
    background-color: #f1f8f8;
}

.hero-how-it-works-top {
    background-color: #fff;
    height: 30px;
}

.hero-how-it-works ul {
    display: table;
    margin: 0 auto;
    list-style-type: none;
    min-width: 600px;
    padding: 0;
    text-align: center;
    width: 50%;
}

.hero-how-it-works li {
    box-sizing: border-box;
    display: table-cell;
}

.hero-how-it-works li .step {
    background-color: #ff7400;
    border: 2px solid #fff;
    border-radius: 20px;
    color: #fff;
    font-weight: bold;
    height: 25px;
    line-height: 25px;
    margin: -15px auto 10px;
    width: 25px;
}

.hero-how-it-works li .title {
    color: #005582;
    font-size: 15px;
    font-weight: bold;
    padding-top: 7px;
}

.hero-how-it-works li .subtitle {
    color: #8a8a8a;
    font-size: 14px;
    padding: 6px 0 22px 0;
}

.hero-how-it-works li .divider {
    height: 50px;
    position: absolute;
    right: 0;
    top: 10px;
    width: 10px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

@media screen and (max-width: 992px) { /* 992 = bootstrap md */

    h1, h1Like {
        font-size: 58px !important;
    }

}

@media screen and (max-width: 768px) { /* 768 = bootstrap sm */

    h1, .h1Like {
        font-size: 56px !important;
    }

    .topBannerAboutUsText {
        padding-left: 15px !important;
    }

}

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

    h1, .h1Like {
        font-size: 30px !important;
    }

    h2, .h2Like {
        font-size: 25px !important;
    }

    .connectionShape {
        width: 197px;
    }

    p {
        line-height: 26px;
    }

}


@media screen and (max-width: 992px) { /* 992 = boostrap md */

    .hero-how-it-works ul {
        min-width: auto;
        width: 100%;
    }

    .hero-top {
        height: auto;
    }

    .hero-top-content {
        min-width: auto;
        max-width: auto;
        padding: 12vh 40px;
        width: auto;
    }

    .hero-top-content h1 {
        font-size: 5.7vw;
    }

    .hero-top-content h2 {
        font-size: 2.7vw;
    }

    .hero-buttons a {
        font-size: 2.2vw;
    }

}

@media screen and (max-width: 768px) { /* 768 = bootstrap sm */

    .hero-top-content h1 {
        font-size: 42px;
    }

    .hero-top-content h2 {
        font-size: 22px;
    }

    .hero-buttons a {
        font-size: 18px;
    }

}

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

    .hero-top-content {
        padding: 8vh 40px;
    }

    .hero-top-content h1 {
        font-size: 35px;
    }

    .hero-top-content h2 {
        font-size: 19px;
    }

    .hero-buttons a {
        font-size: 17px;
    }

}

/* @end */

/* @group register images */

.registerAs {
    padding-bottom: 15px;
}

.registerAs > img {
    float: left;
    max-width: 35%;
}

.registerAsText {
    float: right;
    line-height: 20px;
    padding: 20px 0;
    width: 60%;
}

.registerAs .buttons {
    margin-right: 15px;
    text-align: right;
}

.requireLoginPage .pageCenteredSection {
    max-width: 400px;
}

.requireLoginPage .sideColumnRight {
    display: none;
}


.requireLoginImage {
    width: 49%;
}

.requireLoginImage img {
    max-width: 100%;
}

.visitorCTAbutton.expert .ctaButton {
   background-color: #4965FF; 
}

/* @end */

/* @group TESTIMONIALS */

.testimonial {
    margin-bottom: 20px;
}

.testimonial img {
    height: 90px;
    width: 90px;
    float: left;
    border: 2px solid #3C99AC;
    margin-right: 10px;
}

.testimonialBody {
    min-height: 95px;
    width: 100%;
    line-height: 20px;
}

.testimonialSignature {
    font-weight: bold;
    margin-top: 3px;
}

.sideBarTestimonialHeader{
    color: #3C99AC !important;
    margin-bottom: 10px;
}

/* @end */

/* @group TERMS AND CONDITIONS */

.firstLevelHeader {
    margin-bottom: 12px;
    font-size: 18px;
}

.secondLevelHeader {
    /*float: left;*/
    margin-top: 15px;
}

.secondLevelParagraph {
    line-height: 1.5;
    /*margin-left: 45px;*/
}

.termsAndConditionsDownloadLinks {
    line-height: 1.8;
}

.termsAndConditionsDownloadLinks a {
    font-family: 'AvertaBold';
    font-weight: bold;
    text-decoration: none;
    vertical-align: middle;
}

.termsAndConditionsDownloadLinks i {
    font-size: 26px;
    margin-right: 6px;
    vertical-align: middle;
}

.termsIntroText {
    font-family: 'AvertaBold';
    font-weight: bold;
}

.visitorActionButtons {
    text-align: center;
}

.visitorActionButtons .btn-cta-button-orange {
    width:277px;
}

.termsAndConditionsPage .sideColumnRight {
    margin-top: 40px;
}


/* @end */

/* @group FAQ */

.faqList {
    list-style: none;
    margin: 0 0 20px 0;
    line-height: 20px;
}

.faqList li:before {
    content: '•';
    font-size: 24px;
    padding-right: 7px;
    color: #f9a31a;
    vertical-align: middle;
}

.faqListHeader {
    font-weight: bold;
}

.faqQuestionHeader {
    color: #f9a31a;
    display: block;
    font-size: 18px;
    margin-bottom: 12px;
}

.moveToTop {
    margin: 10px 0 30px 0;
    text-align: right;
}

.moveToTop a {
}

/* @end */

/* @group NEWS */

.onlineNewsArticleWrapper {
    margin-bottom: 20px;
}

.onlineNewsArticleLogo {
    border: 1px solid grey;
    float: left;
    padding: 20px 10px;
}

.onlineNewsArticle {
    margin-left: 205px;
}

.onlineNewsArticleTitle  {
    color: #f9a31a;
    font-weight: bold;
    font-size: 16px;
    padding-top: 4px;
}

/* @end */

/* @group FREELANCE JOBS */

.freelanceJobsCategoryRow {
    float: left;
    width: 100%;
    margin-bottom: 15px;
}

.freelanceJobsCategoryBlock {
    float: left;
    line-height: 18px;
    width: 50%;
}

.freelanceJobsHeader {
    font-weight: bold;
}

.freelanceJobsItem:before {
    content: counter(items, decimal) ": ";
    counter-increment: items;
}

/* @end */

/* @group TOP USERS */

.topUsersColumn {
    float: left;
    width: 50%;
    margin-bottom: 30px;
}

.topUsersColumn h2 {
    margin-bottom: 20px;
}

.topUsersColumn h2 span {
    color: #474747;
    font-size: 13px;
    vertical-align: middle;
}

.topUserRow {
    height: 60px;
    width: 90%;
    border-bottom: 1px solid #F2F8F8;
    padding-top: 10px;
}

.topUserName {
    float: left;
}

.topUserName span {
    color: #A1A1A1;
}

.topUserAvatarBox {
    float: right;
}

.topUserName a{
    color: #474747;
}

.topUserName:before {
    content: counter(items, decimal) ". ";
    counter-increment: items;
}

.relatedProjectLink {
    cursor: pointer;
    color: #005582;
    text-decoration: underline;
}

.debug {
    border: 1px solid #fa0;
}
/* @end */

/* @group MISCELLANEOUS */

.left {
    float: left;
}

.right {
    float: right;
}

.hidden {
    display: none;
}

.text {
    line-height: 27px;
    font-weight: bold;
}

.javascriptWarning{
    background-color: red;
    border: 1px solid #cd0a0a;
    color: #fff;
    font-family: Verdana,Arial,sans-serif;
    font-size: 14px;
    font-weight: bold;
    padding: 6px 0;
    position: absolute;
    text-align: center;
    width: 100%;
}

.javascriptWarning a:visited, .javascriptWarning a {
    color: #fff;
}

.floatClearer{
    clear: both;
}

.infoLink {
    vertical-align: middle;
    margin-left: 2px;
}
.red {
    color: red;
}

label.error, .customError {
    font-size: 12px;
    color: #FF4A33 !important;
}

.loginDeveloper {
    top: 2px;
    left: 2px;
    position: absolute;
    z-index: 100;
}

.loginDeveloper form, .loginDeveloper span {
    float: left;
    margin-right: 2px;
}

.img-home {
    margin: 12px 0 10px 0;
}

body.noClick .img-home {
    margin: 0 0 5px 0;
}

.photo-home {
    margin: -23px 0 0 -33px;
}

.photo-home1 {
    margin: -8px 0 0 -15px;
}

.photo-home2 {
    margin: -18px 0 0 -15px;
}

.uspList {
    margin: 0;
}

.uspList li {
    list-style: none;
    padding-top: 2px;
    min-height: 20px;
    margin-bottom: 10px;
}

.registerExpertForm .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.inlineExpertSellingPoints {
    display: table;
    width: 100%;
}

.inlineExpertSellingPoints ul li {
    box-sizing: border-box;
    float: left;
    height: 33px;
    margin-right: 3%;
    width: 47%;
}

.newsLogos {
    padding: 15px 25px;
    text-align: center;
}

.newsLogos span {
    padding-right: 20px;
    font-weight: bold;
}

.newsLogos img {
    filter: invert(1);
    margin-bottom: -4px;
    max-width: 100%;
    -moz-opacity: 0.9;
    opacity:.90;
    filter: alpha(opacity=70);
}

.newsLogos a, .newsLogos a:hover, .newsLogos a:hover {
    color: #979797;
    text-decoration: none;
}

.forwardGreyArrowDecorator {
    background: url(/img/forward-grey-arrow.png) no-repeat right;
    padding: 2px 23px 2px 0;
}

.backwardGreyArrowDecorator {
    background: url(/img/back-grey-arrow.png) no-repeat left;
    padding: 2px 0 2px 23px;
}

.forwardOrangeArrowDecorator {
    padding: 2px 0;
}

/* done this way because of the use of a sprite*/
.forwardOrangeArrowDecorator:after {
    display: inline-block;
    content: "";
    width: 20px;
    height: 20px;
    background: url(/img/sprite1.png) no-repeat -10px -214px;
    margin: 0 0 -5px 3px;
}

.backwardOrangeArrowDecorator {
    background: url(/img/back-orange-arrow.png) no-repeat left;
    padding: 2px 0 2px 23px;
}

.greyLink {
    color: #474747 !important;
}

.lightGreyLink {
    color: #a1a1a1 !important;
}

.sideBarAvatar {
    height: 90px;
    width: 90px;
    margin-right: 10px;
    text-align: center;
    float: left;
}

.sideBarAvatar img {
    max-width: 100%;
    max-height: 100%;
}

.sideBarMissingAvatar {
    border: 1px solid #C3C3C3;
    height: 70px;
    width: 60px;
    padding: 10px;
}

.userWelcome {
    border-bottom: 1px solid #DBE7EA;
    padding-bottom: 17px;
    margin-bottom: 12px;
}

.avatarWelcomeText {
    margin-left: 100px;
}

.loggedInTopNavigation {
    display: none;
    margin: 0 0 20px 0;
}

.loggedInTopNavigation .welcome {
    display: inline-block;
    margin-right: 5%;
    max-width: 100%;
}

.loggedInTopNavigation .welcome h2 {
    display: inline-block;
    margin-bottom: 0px;
    margin-right: 5px;
}

.loggedInTopNavigation .menu  {
    display: inline-block;
}

.loggedInTopNavigation .menu select  {
    font-size: 15px;
    width: 100%;
}

.sidebarImage {
    margin-top: 20px;
    max-width: 255px;
}

.sideBarNewsLinks {
    border-bottom: 1px solid #DBE7EA;
    margin-bottom: 20px;
    padding-bottom: 8px;
}

.message {
    min-height: 290px;
}

.underlineOnHover {
    text-decoration: none;
}

.underlineOnHover:hover {
    text-decoration: underline;
}

.chooseActionLabel {
    padding-right: 8px;
}

.basicLabel {
    color: #f9a31a;
    font-size: 18px;
    font-weight: bold;
}

.proLabel {
    color: #3C99AC;
    font-size: 18px;
    font-weight: bold;
}

.proPlusLabel {
    color: #f9a31a;
    font-size: 15px;
    margin-left: 1px;
    position: relative;
    top: -1px;
    font-weight: bold;
}

.proWebsiteLabel {
    color: #f9a31a;
    font-size: 15px;
    margin-left: 1px;
    font-weight: bold;
}

.executeActionLink img {
    margin-bottom: -5px;
}

.smallUserAvatar{
    width:50px;
    height:50px;
}

.turquoiseButton {
    background: #290064;
    display: inline-block;
    padding: 6px 7px;
    margin-bottom: 3px;
    text-align: center;
    color: #FFF !important;
    font-weight: bold;
    text-decoration: none;
    cursor: pointer;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -o-border-radius: 2px;
    border: none;
}

.turquoiseButton:hover {
    color: #FFF !important;
    background: #290064;
    border: none;
}

.turquoiseButton:visited {
    color: #FFF !important;
}

.lightBox {
    box-sizing: border-box;
    display: none;
    position: absolute;
    z-index: 10002;
    left: 30%;
    top: 15%;
    width: 40%;
}

.lightBoxContent {
    background-color: #FFF;
    border: 5px solid #CCC;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    font-size: 14px;
    padding: 20px;
}

.lightBoxHeader  {
    border-bottom: 1px solid;
    margin-bottom: 22px;
    padding-bottom: 5px;
    position: relative;
}

.lightBoxHeader h2 {
    display: inline-block;
}

.lightBoxHeader a {
    position: absolute;
    right: 0;
    top: 1px;
}

.closelightBox {
    position: absolute;
    top: -8px;
    right: -8px;
    font-size: 14px;
}

.lightBoxOK {
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    background-color: #CCC;
    color: #FFF;
    font-size: 14px;
    padding: 3px 7px;
    text-decoration: none;
}

.lightBoxOK:hover {
    border: 1px solid #9a9a9a;
    color: #474747;
}

.lightBoxOKWrapper {
    margin: 15px -12px -10px 0;
    text-align: center;
}

.lightBoxBottom {
    margin-bottom: 14px;
}

.lightBoxBottom input[type=submit] {
    font-size: 17px;
    z-index:1000;
}

#lightBoxOverlay {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #000;
    z-index: 10001;
    -moz-opacity: 0.5;
    opacity:.50;
    filter: alpha(opacity=50);
}

.twitterTable {
    line-height: 24px;
    word-wrap: break-word;
}

.twitterTable .columnHeaderLeft, .twitterTable .columnLeft {
    float: left;
    width: 40%;
}

.twitterTable .columnHeaderRight, .twitterTable .columnRight {
    float: right;
    width: 60%;
}

.twitterTable .columnHeaderLeft, .twitterTable .columnHeaderRight {
    font-weight: bold;
}

.registerSideBar {
    background: url(../img/registerFreelancer.png) no-repeat;
    margin: -70px 0 0 0;
    padding: 340px 0 0 0;
}

.registerSideBar h2 {
    color: #f9a31a;
}

.trustSymbolImage {
    margin-left: 10px;
    margin-top: 5px;
    max-width: 258px;
    vertical-align: middle;
}

.contactFormRemarks textarea {
    height: 120px;
}

.orangeArrowsList {
    margin: 0 0 0 5px;
    list-style: none;
}

.orangeArrowsList li {
    margin-bottom: 10px;
}

.orangeArrowsList li:before {
    color: #f9a31a;
    content: url(../img/navigation-arrow-orange.png);
    padding-right: 7px;
    vertical-align: top;
}

.orangeArrowsList a {
    vertical-align: top;
}

.selectedExperts table {
    width: 310px
}

.userWarning {
    background-color: #f2f8f8;
    border: 3px solid #f9a31a;
    color: #f9a31a;
    font-size: 16px;
    font-weight: bold;
    line-height: 25px;
    margin-bottom: 20px;
    padding: 10px;
    text-align: center;
}

.userWarning a {
    color: #f9a31a;
}

.userWarning a:hover {
    text-decoration: none;
}

.kiyohWidget {
    font-size: 12px;
    color: #A1A1A1;
    padding-top: 8px;
}

.kiyohWidget a {
    color: #A1A1A1 !important;
}

.sideBarMenu {
    margin: 0 0 0 5px;
    list-style: none;
}

h2.sideBarMenuTitle {
    margin-bottom: 12px;
}

.sideBarMenu li {
    margin-bottom: 10px;
}

a.sideBarMenuItem {
    padding: 1px 0 3px 23px;
    background: url("../img/sprite1.png") no-repeat -10px -214px;
    color: #474747;
}

a.sideBarMenuItem:hover, a.sideBarMenuItem.active  {
    text-decoration: none;
    font-weight: bold;
}

a.sideBarMenuItem.active {
    margin-left: 20px;
}

.orangeText {
    color:#f9a31a;
}

a.ratingsLink {
    color: #474747;
}

a.ratingsLink:hover {
    text-decoration: none;
}

a.thumbnail:hover img {
    transform: scale(1.1) translate(0px,2px);
    -ms-transform: scale(1.1) translate(0px,2px);
    -webkit-transform: scale(1.1) translate(0px,2px);
}

ol.valentine {
    line-height: 20px;
}

ol.valentine li {
    margin-bottom: 10px;
}

.tarievenOnderzoekArchive {
    text-align:right;
}

.tarievenOnderzoekArchive a {
    margin-left: 3px;
}

.tarievenOnderzoekArchive a.active {
    text-decoration: none;
    color: #474747;
    cursor: default;
}

.tarievenOnderzoekTable {
    border-collapse: collapse;
    line-height: 20px;
    margin-bottom: 20px;
    text-align: left;
    width:100%;
}

.tarievenOnderzoekTable td {
    border-top: 1px solid #474747;
}

.tarievenOnderzoekTable td, .tarievenOnderzoekTable th {
    border-right: 1px solid #474747;
    padding: 1px 0;
    text-align: center;
}

.tarievenOnderzoekTable td:last-child, .tarievenOnderzoekTable th:last-child  {
    border-right: none;
}

.tarievenOnderzoekTable td:first-child, .tarievenOnderzoekTable th:first-child  {
    text-align: left;
    width: 68%;
}

.startHere {
    margin-top: 10px;
}

.startHereImg {
    float: left;
    margin-bottom: 20px;
    max-width: 100%;
    text-align: center;
}

.startHereImg img {
    max-width: 100%;
}

.clearFix:before, .clearFix:after {
    clear: both;
    content: " ";
    display: table;
}

.hpProjectsList {
    cursor: pointer;
    max-width: 900px;
    padding: 25px;
    position: relative;
}

.hpProjectsList .moreProjectsLink {
    display: block;
    margin-top: 20px;
}

.hpProjectsListInner {
    height: 390px;
    overflow: hidden;
}

.hpProjectsList ul {
    list-style: none;
    margin: 0;
}

.hpProjectsList li {
    margin: 0;
    padding: 10px 0;
    text-align: left;
    vertical-align: middle;
}

.hpProjectsList li div {
    float: left;
}

.hpProjectsList li div span {
    white-space: normal !important;
}

.hpProjectsList li div:first-child {
    color: #A1A1A1;
    padding-right: 2%;
    width: 17%;
}

.hpProjectsList li div:nth-child(2) {
    padding-right: 3%;
    width: 48%;
}

.hpProjectsList li div:nth-child(3) {
    width: 15%;
}

.hpProjectsList li div:last-child {
    color: #A1A1A1;
    text-align: right;
    width: 15%;
}

.hpProjectsList:hover li {
    -moz-opacity: 0.3;
    opacity:.30;
    filter: alpha(opacity=30);
}

.hpProjectsList li {
    -webkit-transition: opacity .15s ease-in;
    -moz-transition: opacity .15s ease-in;
    -ms-transition: opacity .15s ease-in;
    -o-transition: opacity .15s ease-in;
    transition: opacity .15s ease-in;
}

.hpProjectsListHeaders li div {
    font-weight: bold;
    font-family: 'AvertaBold';
}

.hpProjectListButton {
    display: none;
    font-size: 20px;
    margin-left: -180px;
    padding: 15px 20px;
    position: absolute;
    left: 50%;
    top: 37.5%;
    text-align: center;
    width: 340px;
    font-family: 'AvertaBold';
}

.projectListTitle {
}

#popupMessage {
    line-height: 25px;
    position: fixed;
}

.homePopularProjectTypes {
    max-width: 800px;
    padding: 10px 25px;
}

.homePopularProjectTypes > div {
    box-sizing: border-box;
    float: left;
    padding: 1%;
    width: 33%;
}

.homePopularProjectTypes figure {
    background-color: #777;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    overflow: hidden;
}

.homePopularProjectTypes figure > a {
    background: #eff8f8 no-repeat center/cover;
    cursor: pointer;
    display: block;
    height: 160px;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.homePopularProjectTypes figure > a:hover {
    filter: Alpha(opacity=50);
    opacity: 0.5;
    -webkit-transition: all 0.3s ease-out; /* Safari and Chrome */
    -moz-transition: all 0.3s ease-out; /* Firefox */
    -ms-transition: all 0.3s ease-out; /* IE 9 */
    -o-transition: all 0.3s ease-out; /* Opera */
    transition: all 0.3s ease-out;
    -webkit-transform:scale(1.2); /* Safari and Chrome */
    -moz-transform:scale(1.2); /* Firefox */
    -ms-transform:scale(1.2); /* IE 9 */
    -o-transform:scale(1.2); /* Opera */
    transform:scale(1.2);
}

.homePopularProjectTypeTitle {
    padding: 10px 0;
    text-align: center;
}

.homePopularProjectTypeTitle a {
    color: #1591A1 !important;
    font-size: 114%;
    text-decoration: none;
}

.homePopularProjectTypeTitle a:hover {
    text-decoration: underline;
}

.stButton {
    margin-right: 2px !important;
}

.hpKeywordLandingPages {
    margin-left: 30px;
}

.hpKeywordLandingPages hgroup {
    margin-bottom: 12px;
}

ul.hpKeywordLandingPagesList li{
    line-height: 22px;
    margin: 0;
}

ul.hpKeywordLandingPagesList li a {
    color: #777 !important;
}

.countDownClock {
    border: 2px solid #f9a31a;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    color: #f9a31a;
    display: table;
    padding: 5px;
}

.countDownClockElement {
    display: table-cell;
    padding: 0px 5px;
    text-align: center;
    width: 50px;
}

.countDownClockElement span {
    font-size: 22px;
}

.countDownClockDescription {
    font-size: 12px;
}

.newInvoiceIntro {
    font-size: 105%;
    line-height: 25px;
}

/* @end Miscellaneous*/

/* @group visitor CTA buttons */

.visitorCTAbutton {
    background-position: bottom right;
    background-repeat: no-repeat;
    box-sizing: border-box;
    /*border-radius: 7px;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px ;
    -o-border-radius: 7px;*/
    cursor: pointer;
    /*height: 165px;*/
    padding-top: 20px;
    padding-bottom: 20px;
    /*overflow: hidden;*/
    /*padding: 10px 20px 20px;*/
    position: relative;
    text-align: left;
}

.visitorCTAbuttonTitle {
    font-size: 20px;
    /*text-shadow: 1px 1px 1px #000*/
    max-width: 270px;
    display: inline-block;
    margin-bottom: 11px;
}

.visitorCTAbutton a {
    /*bottom: 15px;
    left: 20px;
    position: absolute;*/
}

.visitorCTAbutton.expert {
    /*background-image: url("../img/freelancer-illustratie.png");*/
}

.visitorCTAbutton.client {
    /*background-image: url("../img/opdrachtgevers-illustratie.png");*/
}

/* @end */

/* @group Recent Ratings + Activity */

.recentRatingsContainer {
    margin-bottom: 25px;
}

.recentRatings {
    margin: 0 auto;
    max-width: 1100px;
    padding: 25px 15px;
}

.recentRating {
    box-sizing: border-box;
    cursor: pointer;
    float: left;
    min-height: 155px;
    margin: 1%;
    overflow: hidden;
    padding: 2%;
    width: 31%;
}

.recentRatingPhoto {
    box-sizing: border-box;
    float: left;
    margin-right: 4%;
    width: 33%;
}

.recentRatingPhoto img {
    cursor: pointer;
    max-width: 100px;
    max-height: 100px;
    border-radius: 50% 50% 0 50%;
}

.recentRatingContent, .recentRatingComment {
    box-sizing: border-box;
    float: right;
}

.recentRatingContent {
    text-align: center; 
}

.recentRating .ratingStars {
    line-height: 18px;
    margin-bottom: 4px;
}

.recentRatingDate {
    color: #A1A1A1;
    font-size: 95%;
    margin-bottom: 4px;
    white-space: nowrap;
}

.recentRatingComment {
    font-style: italic;
    font-size: 95%;
    width: 63%;
}

.recentActivities {
    max-width: 680px;
    padding: 30px;
}

.recentActivitiesInner {
    height: 390px;
    overflow: hidden;
}

.gradientBottom {
    position: relative;
}

.gradientBottom div {
    height: 50px;
    left: 0;
    position: absolute;
    width: 100%;
    top: -50px;
    z-index: 1;
}

.gradientBottom div {
    bottom: 0;
    background: -moz-linear-gradient(top, rgba(255,255,255, 0) 0%, rgb(255,255,255) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255, 0)), color-stop(100%,rgb(255,255,255))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(255,255,255, 0) 0%,rgb(255,255,255) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(255,255,255, 0) 0%,rgb(255,255,255) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(255,255,255, 0) 0%,rgb(255,255,255) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(255,255,255, 0) 0%,rgb(255,255,255) 100%); /* W3C */
    xfilter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0089fff1', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
}

.recentActivities ul {
    margin: 0;
}

.recentActivities ul li {
    display: inline-block;
    width: 100%;
}

.recentActivities ul a, .recentActivities ul span {
    font-family: 'AvertaBold';
    font-weight: bold;
    color: #290064 !important;
    text-decoration: underline;
}

.recentActivities ul a:hover {
    text-decoration: underline;
}

.recentActivities ul table {
    border-spacing: 0;
    width: 100%;
}

.recentActivities ul td {
    padding: 0 20px 10px 0;
}

.recentActivities ul td:last-child {
    padding: 0 0px 10px 0;
}

td.recentActivityTime {
    width: 21%;
}

.recentActivityImage {
    background: url("../img/sprite1.png") no-repeat -10px -113px;
    height: 44px;
    width: 44px;
    border-radius: 50% 50% 0 50%;
}

.recentActivityText {
    padding: 16px;
    position: relative;
}

.recentActivityText.even, .recentActivityText.even:before {
}

.recentActivityText.odd {
}

.recentActivityText.odd:before {
    background-color: #fff;
    border-bottom: 1px solid #edeeed;
    border-left: 1px solid #edeeed;
}

/* @end */

/* @group HTML Sitemap */

.htmlSitemapColumn.left {
    padding-right: 3%;
    width: 26%;
}

.htmlSitemapColumn.right {
    width: 71%;
}

.htmlSitemapColumnBlock {
    margin-bottom: 23px;
}

.htmlSitemapColumn.right .htmlSitemapColumnBlock {
    width: 48%;
}

.htmlSitemapColumn h2 {
    border-bottom: 1px solid #999;
    margin-bottom: 10px;
    padding-bottom: 5px;
}

.htmlSitemapColumnBlock ul {
    margin: 0;
}

.htmlSitemapColumnBlock li {
    margin-bottom: 6px;
    position: relative;
}

.htmlSitemapDate {
    color:#bbb;
    position: absolute;
    right: 0;
    vertical-align: top;
}

/* @end */

/* @group Media queries */

@media screen and (max-width: 1120px) {
    #page .pageCenteredSection, .adminPage .pageCenteredSection {
        width: auto !important;
    }

    footer .pageCenteredSection {
        padding: 0 20px;
        width: auto !important;
    }

    footer hr {
        margin: 0 40px;
        width: 90% !important;
    }

    .footerCategoryColumn {
        background: none !important;
        margin-left: 0;
        padding-left: 0;
    }

    .recentRatingComment {
        display: inline-block;
        float: none;
        margin-top: 5px;
        width: 100%;
    }

    .bootstrapArea .container {
        max-width:100% !important;
    }

}

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

    #page.home .pageCenteredSection {
        width: auto !important;
    }

    .htmlSitemapColumn {
        margin: 0 !important;
        padding: 0 !important;
        width: 48% !important;
    }

    .htmlSitemapColumn.right .htmlSitemapColumnBlock {
        width: 100%;
    }

}

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

    .footerBottomMenuLeft, .footerBottomMenuCenter, .footerBottomMenuRight {
        display: block;
        float: none;
        margin-bottom: 10px;
        text-align: center;
        width: 100%;
    }

    .footerBottomMenuRight {
        margin-top: 20px;
    }

    .stickyHeader .loginIndicator,
    .stickyHeader .btn-cta-button-orange {
        display: none;
    }

    .popularKeyword {
        text-align: center;
        width: 33%;
    }

    .lightBox {
        left: 10%;
        width: 80%;
    }

    .recentRatingPhoto {
        width: 100%;
        text-align: center;
    }

    .recentRatingContent {
        width: 100%;
    }


}

@media screen and (min-width: 850px) and (max-width: 950px),  screen and (max-width: 600px) {

    .inlineExpertSellingPoints ul li {
        float: none;
        width: auto;
    }

}

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

    .sideColumnLeft, .sideColumnRight {
        display: none;
    }

    .loggedInTopNavigation {
        display: block;
    }

    #page .pageCenteredSection, .adminPage .pageCenteredSection {
        /*padding: 0 20px !important;*/
    }

    .stickyHeader {
        display: none;
    }
}

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

    .telephoneTimes {
        display: inline-block;
        margin-left: 5px;
        position: relative;
        top: -1px;
    }

    .headerLogo {
        margin: -7px 0 0;
    }

    a.headerMenuItem {
        display: block !important;
        text-align: center;
    }

}

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

    .footerCategoryColumn {
        display: block !important;
        text-align: center;
        width: 100% !important;
    }

    .footerCategoryColumn.categoryLinks {
        margin-bottom: 20px;
    }

    .categoryLinksColumn {
        padding: 0;
        line-height: 2;
    }

    .footerMenuColumn {
        width: 50%;
        margin-top: 15px;
    }

    .popularKeyword {
        width: 50%;
    }

    .categoryLinksColumn a, .footerMenuColumnContent, .popularKeyword a {
        display: block;
        margin: 0 auto;
        text-align: left;
        width: 190px;
    }

    .lightBox {
        left: 5%;
        width: 90%;
    }

}

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

    #headerMenu {
        float: none;
        margin: 12px 0 0 0;
        text-align: center;
    }

    .telephoneTimes {
        display: block;
        margin-left: 0;
        position: static;
        top: 0;
    }

    a.headerMenuItem {
        display: inline-block !important;
        margin: 0 10px 10px 0;
    }

    a.headerMenuItem:last-child-child {
        margin-right: 0;
    }

    .hpHeaderBlock {
        margin-top: 25px;
        padding: 0 25px;
    }

    .recentRatings {
        background-color: #fff;
    }

    .recentRating {
    }

    .hpWidgetContainer {
        margin-bottom: 25px;
        padding: 0;
    }

    .hpWidget {
        margin: 0;
    }

    .recentRating {
        height: 180px;
        width: 48%;
    }

    .recentActivities {
        padding: 30px 20px;
    }

    .htmlSitemapColumn {
        width: 100% !important;
    }

    footer hr {
        margin: 0 auto;
        width: 90% !important;
    }

    .homePopularProjectTypes {
        padding: 10px 20px;
    }

    .homePopularProjectTypes > div {
        width: 50%;
    }

    #page .pageCenteredSection, .adminPage .pageCenteredSection {
        padding: 18px 18px;
    }

}

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

    .hpProjectsList li div:nth-child(3) {
        display: none;
    }

    .hpProjectsList li div:nth-child(3) {
        display: none;
    }

    .hpProjectsList li div:nth-child(2) {
        width: 57%;
    }

    .startHere {
        display: none;
    }
}

@media screen and (max-width: 600px), screen and (min-width: 850px) and (max-width: 1000px) {

    .pagingOverview {
        float: none;
    }

    #firstPageLink, #lastPageLink {
        display: none;
    }

    .pageNumber a {
        padding: 3px 0;
        min-width: 25px;
    }

    .twitterTable .columnHeaderLeft, .twitterTable .columnHeaderRight {
        display: none;
    }

    .twitterTable .columnLeft, .twitterTable .columnRight {
        display: block;
        width: 100%;
    }

    .twitterTable .columnLeft {
        font-weight: bold;
    }
}

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

    a.headerMenuItem {
        font-size: 3.4vw !important;
        margin-right: 1.4vw;
        padding: 9px 4vw;
    }

    a.headerMenuItem:last-child {
        margin-right: 0;
    }

    .loginIndicator {
        box-sizing: border-box;
        float: left;
        margin: 0 0 10px 0;
        max-width: 63%;
    }

    .logOutLink {
        display: block;
        margin-top: 10px;
    }

    .loginSeparator {
        display: none;
    }

    .needHelp {
        box-sizing: border-box;
        float: right;
        margin: 0;
        max-width: 37%;
    }

    .helpPhoneNumber {
        margin-left: 0;
    }

    .telephoneTimes {
        display: none;
    }

    .headerLogo {
        margin: 0;
    }

    .onlineNewsArticle {
        float: left;
        margin: 10px 0 0 0;
    }

    .onlineNewsArticleLogo {
        background-color: #fff;
        border: 1px solid #dbe7ea;
    }

    .onlineNewsArticleWrapper {
        background-color: #f2f8f8;
        border: 1px solid #dbe7ea;
        padding: 10px;
    }

    .freelanceJobsCategoryRow {
        float: none;
        margin-bottom: 0;
    }

    .freelanceJobsCategoryBlock {
        float: none;
        margin-bottom: 15px;
        width: 100%;
    }

    #page .contentBox:first-of-type {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    #page {
        padding-top: 0 !important;
    }

    .pageCenteredSection .contentBox {
        padding: 0;
    }

    .contentBox .tabPanel, 
    .pageCenteredSection .tabPanel {
        padding: 10px 10px !important;
    }

}

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

    .headerSubMenuItem a {
        font-size: 3.7vw !important;
        margin: -11px -1px;
        padding: 11px 3.1vw;
    }

    .headerSubMenuItem.active a {
        font-size: 3.7vw !important;
        margin: -15px -1px;
        letter-spacing: 0;
        padding: 15px 3.1vw;
    }

    .recentRating {
        height: auto;
        width: 100%;
    }

    .recentRatingComment {
        margin-top: 0;
        padding-right: 2%;
        width: 63%;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .hpProjectListButton {
        margin-left: -140px;
        width: 240px;
    }

}

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

    #page {
        padding-top: 20px;
    }

    .primaryColumn {
        overflow: visible;
    }

    .pageTopContent {
        min-height: 390px;
    }

    .contentBox {
        /*margin-left: -20px;
        margin-right: -20px;*/
        margin-top: 0;
    }

    .inbox {
        margin: 0 -20px 35px -20px;
    }

    .inbox td:last-child{
        display: none;
    }

    .contentBox, .contentBoxTop, .contentBoxBottom, .inboxBody, .inboxBodyContent {
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -o-border-radius: 0;
    }

    .footerCategoryColumn.companyLogos h4, .footerCategoryColumn.companyLogos img {
        display: none;
    }

    .footerMenuColumnContent {
        width: auto;
    }

    .categoryLinksColumn a, .footerMenuColumnContent, .popularKeyword a {
        width: auto;
    }

    .categoryLinksColumn:first-of-type {
        width: 60%;
    }

    .categoryLinksColumn:last-of-type {
        width: 40%;
    }

    .footerMenuColumn:nth-child(odd) {
        width: 55%;
    }

    .footerMenuColumn:nth-child(even) {
        width: 45%;
    }

    .popularKeyword:nth-child(odd) {
        width: 52%;
    }

    .popularKeyword:nth-child(even) {
        width: 48%;
    }

}

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

    .logoPayOff {
        font-size: 16px;
    }


}

/* @end */


/* New common styles */

.text-color-white {
    color: #ffffff;
}

.text-color-gray {
    color: #999999;
}

.text-color-orange {
   color: #f9a31a !important; 
}

.text-color-attention-green {
    color: #22cd22 !important;
}

.text-color-mint-green {
    color: #d3fddc !important;
}

.text-decoration-underline {
    text-decoration: underline !important;
}

.text-decoration-none {
    text-decoration: none !important;
}

.display-flex {
    display: flex;
}

.background-color-Freelancer.be-green {
   background-color: #4965FF; 
}

.background-color-mint-green {
   background-color: #d3fddc; 
}

.font-size-fa {
    font-size: 23px; 
}

.font-size-smaller {
    font-size: 14px;
}

/* Temporary */

.bootstrapArea .font-weight-bold {
    font-family: 'AvertaBold';
}


.line-height-increased {
    line-height: 1.8;
}


/* / ###Ahmed Edit
 */
/* --- Logo sizing & alignment (normal header) --- */
.headerLogo {
  margin-top: 0;               /* remove the -4px nudge */
  width: 250px;                /* keep your current box width */
}
.headerLogo img {
  height: 56px;                /* ↑ make the picture taller (try 56–64px) */
  width: auto !important;      /* keep aspect ratio */
  display: block;              /* removes baseline gap so it sits centered */
}

/* --- When the sticky header turns on, use a slightly smaller logo --- */
.stickyHeader .headerLogo {
  width: 250px;                /* you already had this */
  margin-top: 0;
}
.stickyHeader .headerLogo img {
  height: 40px;                /* smaller height for compact sticky bar */
  width: auto !important;
  display: block;
}

/* Optional: a bit of breathing room in the header */
header {
  padding-top: 16px;           /* adjust if it feels cramped */
  padding-bottom: 16px;
}