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

    .navbar-collapse.pull-right {
        margin: 34px 0 0 0;
    }

}

/*********************/
/* STYLE:	CSS OTYS */
/* NAME: 	NIels H. */
/* DATE: 	29-9-16  */
/*********************/

.O-Outer {
	width: 100%;
	display: inline-block;
	padding: 40px 0;
}
@media screen and (max-width: 720px) {

    .footer_button_mobile {
    	display: none;
    }

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

    .O-Outer {
    	padding: 30px 0;
    }

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

    .O-Outer {
    	padding: 20px 0;
    }

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

    .O-Outer {
    	padding: 20px 0;
    }

}


input[name="MailPassword"], input[name="ApplbSignUp"], input.jbdButApl,
.ts-button, input[type="submit"], .more-link, button, input.aplFileSb,
input.aplSB, input[value=Uploaden], input[value=Verzenden], .buttonContainer a.button,
.button, strike a, a strike, .smallButton {
    height: inherit;
    background: #fd4326;
    border-color: #fd4326;
    border-radius: 3px;
    background: #fd4326;
    line-height: 38px;
    text-transform: uppercase;
    color: #ffffff;
    font-size: 11px;
    letter-spacing: 1px;
    display: inline-block;
    text-decoration: none;
    border: 1px solid #fd4326;
    transition: all 0.3s ease 0s;
    padding: 0px 20px;
    font-weight: 500;
    box-shadow: none;
}

input[name="MailPassword"]:hover, input[name="ApplbSignUp"]:hover, input.jbdButApl:hover, input.aplSB:hover,
input.aplEduSb:hover, input[value=Uploaden]:hover, input[value=Verzenden]:hover, .buttonContainer a.button:hover,
.ts-button:hover, input[type="submit"]:hover, .more-link:hover, button:hover,
.button:hover, strike a:hover, a strike:hover, .smallButton:hover {
    background: #fff;
    color: #fd4326;
}

/* hamburger-menu */
.navbar-toggle button {
    padding: 0 10px;
}

/* END: input buttons */


/* BEGIN: Forms */

.custEnrollOuter form .formInput,
.aplAplSOuter form .formInput,
.aplEnrollOuter form .formInput,.aplCaptchaExplain  {
	width: 50%;
    float: left;
    clear: none;
}
.aplAVGCheck{
    float:right !important;
}

.aplCsc, .aplCic, .aplCaptchaExplain, .aplCaptchaExplain  {
    clear:both !important;
    float: right !important;
}

.outer .explain.aplCaptchaExplain {
    max-width: 50% !important;
    width: 100%;
}

.outer .explain.aplTextAreaExplain {
    max-width: initial !important;
}


.custEnrollOuter .text p {
    margin: 0 0 30px 0;
}
.custEnrollOuter form div#Geslacht,
.aplAplSOuter div.aplGenderInput,
.aplAplSOuter .aplFileInput > label,
.aplAplSOuter .aplCsc > label,
.aplEnrollOuter div.aplGenderInput {
    padding: 10px 0 0 0;
}
.custEnrollOuter form  div#Geslacht > * {
    float: left;
    width: 12%;
    clear: none;
}
.aplAplSOuter form  div.aplGenderInput > label,
/*.aplAplSOuter form  div.aplGenderInput > div,*/
.aplEnrollOuter form  div.aplGenderInput > label {
    float: left;
    width: 14%;
    clear: none;
}
.aplAplSOuter form  div.aplGenderInput > div,
.aplEnrollOuter form  div.aplGenderInput > div {
    width: 36%;
}
.aplAplSOuter form  div.aplGenderInput > div > label,
.aplEnrollOuter form  div.aplGenderInput > div > label {
    float: left;
    width: 32%;
    clear: none;
}
input[name="attachment"], textarea#QEID_100184102,
input#QEID_100219444, input#QEID_100184103, div.aplAplSOuter .aplCic,
div.aplEnrollOuter .aplCic  {
	float: left;
    clear: both;
}
.aplAplSOuter .explain_Q_100184102 {
    max-width: 60%;
}
.aplAplSOuter input[type="text"],
.aplAplSOuter input[type="file"],
.aplAplSOuter .fieldTxtArea,
.custEnrollOuter input[type="text"],
.custEnrollOuter input[type="file"],
.custEnrollOuter .fieldTxtArea,
.aplEnrollOuter input[type="text"],
.aplEnrollOuter input[type="file"],
.aplEnrollOuter .fieldTxtArea {
    max-width: 90%;
}
/* jobdetail */
#upperBc {
	display: none;
}
input.jbdButBack, input.jbdButBack:hover {
    color: #ff4301;
}
body.jobdetail .jbdOuter ul li {
    list-style-type: disc;
}

.jbdOuter .jbdShPubStart,
.jbdOuter .jbdTextPubStart,
.jbdOuter .jbdShPubEnd,
.jbdOuter .jbdTextPubEnd {
	display: none;
}
/* remove security lable */
.custEnrollOuter form .formInput > label {
    display: none;
}
/* set gender lables */
div#Geslacht label {
	display: block !important;
}
/* "u solliciteerd op" */
.aplAplSOuter ul li::before {
    content: "- ";
    color: #fd4326;
    padding: 0 10px 0 0;
    margin: 0 0 0 2px;
}
.aplAplSOuter .aplAplSAr {
	border: none;
	margin: 0 0 80px 0;
}
.aplAplSOuter .aplAplSAr::before {
    display: block;
    content: " ";
    background: #ffffff url("../../_images/werkenbij24people_img/info-icon.png") no-repeat left center;
    width: 60px;
    height: 50px;
    background-size: contain;
    float: left;
    margin: 0 0 0 20%;
}
span.aplLine {
    display: inline-block;
    height: 50px;
    padding: 0 10px 0 10px;
    line-height: 50px;
    font-size: 26px;
    background-color: #fff;
}
span.hori-line {
    display: block;
    border-bottom: 1px solid #d8d8d8;
    margin: -24px 0 10px 0;
}
.aplAplSOuter h2.subHeader {
	display: none;
}

input[type=text], input[type=password], input[type=file], textarea, select, .formInputTaC, .chosen-container {
    color: inherit;
    font-size: 14px;
    background: #fdfdfd;
    border: 1px solid #d8d8d8;
    color: #000;
    font-family: "Open Sans",Arial,sans-serif;
    border-radius: 0px;
    padding: 10px 15px;
}
input[name="captcha"] {
	margin: 15px 0 0 0;
}

/* inloggen klant | Personalia */
.custOuter .formInput select {
    clear: both;
    display: block;
}
.myProfileMenu div.menuLink,
.custOuter div.menuLink,
.mCCustomerLoggedIn div.menuLink {
    display: inline-block;
    margin-right: 5px;
    background-color: #42454a;
    padding: 8px 10px;
    border: none;
}
.myProfileMenu div.menuLink a,
.custOuter div.menuLink a,
.mCCustomerLoggedIn div.menuLink a {
    color: #fff;
    text-transform: uppercase;
}
/* persoonlijke pagina */
.aplCpOuter form .formInput > div, .aplCpOuter form .formInput > span,
.aplCpOuter form .formInput > input {
    display: block;
    clear: both;
}
/* ----------------------------------------------------------- CUSTOM VACANCY */
h2.itemTitle.ojp2It svg {
    width: 25px;
    height: 25px;
    fill: #000;
}
.ojp2Send, .buttonWrapSend {
    display: inline-block;
}
.ojp2Send svg {
    position: relative;
    top: 7px;
    fill: #fff;
    width: 25px;
    height: 25px;
}
.ojp2Accept {
    background: #24c809;
    border: 1px solid #24c809;
}
.ojp2Accept:hover {
    background: #23c208;
    color: #fff;
}
.ojp2Denied:hover, .ojp2Send:hover {
    background: #fd362f;
    color: #fff;
    border: 1px solid #fd362f;
}
h2.itemTitle.ojp2It svg path {
    fill: #000 !important;
}
#ojpbuttons {
    text-align: center;
    position: fixed;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 10000;
    padding: 10px;
    background: #e4eae4;
}
.O-Outer #box select {
    width: 20% !important;
}

/* --------------------------------------------------- ONLINE CV PRESENTATION */
body.job .ocp2Detail .itemContainer:last-child {
    border-bottom: none;
}
body.job .ocp2Detail aside .itemContainer:last-child {
    border-bottom: 1px solid #e8eeef;
}
body.job .ocp2Detail .ocp2Subtitle {
    margin-bottom: 20px;
}
body.job .cvright {
    float: right;
}
body.job .ocp2Exp b {
    padding: 10px 0 10px 0;
    float: left;
    clear: both;
    width: 100%;
}

.O-Outer #box {
    display: none;
}

/*****************/
/* MEDIA QUERIES */
/*****************/

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

	/* Inloggen werknemer */
	form#aplStartLoginF, form#aplStartPasswF, form#aplStartSignTkF, form[name=form2] {
	    max-width: 70%;
	    margin: 20px 0 0 0;
	    display: inline-block;
	}
	form#aplStartLoginF {
	    margin: 0;
	}

}

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

	.custEnrollOuter form div#Geslacht > * {
	    width: 15%;
	}
	.aplAplSOuter .aplAplSAr::before {
	    margin: 0 0 0 25%;
	}
    span.aplLine {
        font-size: 18px;
    }
    .aplEnrollOuter form div.aplGenderInput > label,
    .aplAplSOuter form div.aplGenderInput > label {
        width: 23%;
    }
    .aplEnrollOuter form div.aplGenderInput > div,
    .aplAplSOuter form div.aplGenderInput > div {
        width: 65%;
    }
    .outer .formInput > label, .outer .explain {
        max-width: 100%;
    }
    .myProfileMenu div.menuLink, .custOuter div.menuLink, .mCCustomerLoggedIn div.menuLink {
        margin-right: 5px;
        margin-bottom: 8px;
    }
    #teaser1 img {
        max-width: 100% !important;
        height: auto !important;
    }

}

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

	.custEnrollOuter form div#Geslacht > * {
	    width: 20%;
	}
	.aplAplSOuter .aplAplSAr::before {
	    margin: 0 0 0 13%;
	}

}

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


	.aplAplSOuter .aplAplSAr10612 {
	    margin: 30px 0;
	}
	.custEnrollOuter form .formInput,
	.aplAplSOuter form .formInput,
    .aplEnrollOuter form .formInput {
		width: 100%;
	}
	.custEnrollOuter form div#Geslacht > *,
	.aplAplSOuter form  div.aplGenderInput > label {
	    width: 28%;
	}
	.aplAplSOuter form div.aplGenderInput > div {
	    width: 72%;
	}
	.aplAplSOuter input[type="text"],
	.aplAplSOuter input[type="file"],
	.aplAplSOuter .fieldTxtArea,
	.custEnrollOuter input[type="text"],
	.custEnrollOuter input[type="file"],
	.custEnrollOuter .fieldTxtArea,
    .aplEnrollOuter input[type="text"],
    .aplEnrollOuter input[type="file"],
    .aplEnrollOuter .fieldTxtArea {
	    max-width: 100%;
	}
	.aplAplSOuter .aplAplSAr::before {
        width: 100%;
	    display: block;
        clear: both;
        margin: 0px 0 0 2%;
	}
	span.aplLine {
	    font-size: 16px;
	}
    span.applyFor {
        display: block;
        line-height: 16px;
        font-weight: 700;
    }
	span.hori-line {
	    display: none;
	}
    .myProfileMenu div.menuLink, .custOuter div.menuLink, .mCCustomerLoggedIn div.menuLink {
        display: block;
        margin: 10px 0 0 0;
    }
    /* ------------------------------------------------------- CUTSOM VACANCY */
    .O-Outer #box select {
        width: 100% !important;
        margin: 10px 0 10px 0;
    }

}

/* BEGIN: Forms */

body.job .actSRFacetCont {
    display: block !important;
    position: inherit;
    float: left;
    width: 32%;
    top: 0;
    right: auto;
    left: 0;
    padding: 1% 2%;
}
body.job .actSResultsCont {
    float: right;
    width: 66%;
    padding-left: 3%;
    padding-right: 3%;
}
body.job .facetListCon {
    padding: 8% 5%;
    background-color: #42454a;
}
body.job .actMlJc {
    border: none;
    padding: 0;
    margin: 10px 0 0 0;
    font-weight: 300;
}
body.job .optionListTitle {
    color: #444;
    font-weight: 300;
    font-size: 24px;
}
body.job .optionListTitle a {
    color: #fff;
    font-weight: 500;
}
body.job.itemContainer {
    border-top: 1px solid #e8eeef;
    border-right: 1px solid #e8eeef;
    border-bottom: 0;
    border-left: 1px solid #e8eeef;
    padding: 0 30px 10px 30px;
}
body.job .itemContainer:last-child {
    border-bottom: 1px solid #e8eeef;
}
.site_wrapper .nav li a {
    display: inline-block;
}
/* ---------------------------------------------------- ONLINE CV PRESENTATIE */
#ocpbuttons {
    text-align: center;
    position: fixed;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 10000;
    padding: 10px;
    background: #e4eae4;
}
.buttonWrap.buttonWrapAccept,
.buttonWrap.buttonWrapDenied {
    display: inline-block;
}
.buttonWrap.buttonWrapAccept svg,
.buttonWrap.buttonWrapDenied svg {
    width: 25px;
    height: 25px;
    position: relative;
    top: 7px;
    fill: #fff;
}
.ocp2Button.ocp2Accept {
    background: #24c809;
    color: #fff;
    border: 1px solid #24c809;
}
.ocp2Button.ocp2Accept:hover {
    background: #23c208;
}
.ocp2Button.ocp2Denied {
    background: #fd4326;
}
.ocp2Button.ocp2Denied.button:hover {
    background: #fd362f;
    color: #fff;
    border: 1px solid #fd362f;
}
.ojp2Detail ul li {
    padding-left: 1.5em;
    text-indent: -1em;
}
.ojp2Detail ul li:before {
    content: "\f105";
    font-family: 'FontAwesome';
    color: #fd4326;
    font-size: 15px;
    font-weight: bold;
    margin-right: 10px;
    display: inline-block;
    text-indent: -1em;
}
