/* CSS Document */
@media screen and (max-width: 650px) {
	#op-vacancies-tags > a {
		margin-right: 5px;
	}
}

.op-vacancies-card > div{
	background: #000;
	padding-bottom: 0px;
	position: relative;
}
	.op-vacancies-card > div > a > img{
		display: block;
		opacity: 0.5;
		-moz-transition: all .3s ease-in;
		-o-transition: all .3s ease-in;
		-webkit-transition: all .3s ease-in;
		transition: all .3s ease-in;
		width: 100%;
		height: auto;
	}
		.op-vacancies-card > div > a > img:hover{
			opacity: 0.8;
		}
	.op-vacancies-card > div > h2 > a,
	.op-vacancies-card > div > span,
	.op-vacancies-card > div > p,
	.op-vacancies-card > div > a.op-cta-button
	{
		margin-left: 10px;
		margin-right: 10px;
	}
	.op-vacancies-card h2 {
		position: absolute;
		display: block;
		left: 4%;
		top: 50px;
		text-align: center;
		width: 92%;
	}
		.op-vacancies-card h2 a, .op-vacancies-card h2 a:hover{
			font-weight: bold !important;
			display: block;
			color: #fff;
			text-align: center;
		}
	.op-vacancies-card h3 {
		position: absolute;
		display: block;
		left: 4%;
		top: 20px;
		text-align: left;
		width: 92%;
		font-size: 18px !important;
		color: #6a6f2d !important;
		padding-left: 10px !important;
	}
	.op-vacancies-card span {
		left: 20px;
		top: 60px;
		position: absolute;
		color: #fff;
		text-align: center;
	}
	.op-vacancies-card p{
		position: absolute;
		display: block;
		width: 85%;
		left: 8%;
		top: 60px;
		margin: 0px 0px 10px 0px !important;
		padding: 0;
		text-align: center;
		color: #fff;
	}
	.op-vacancies-card > div > a.op-cta-button{
		position: absolute;
		left: 28%;
		width: 40%;
		bottom: 20px;
		margin-bottom: 10px;
		text-align: center;
	}
		@media screen and (max-width: 1170px) {
			.op-vacancies-card > div > a.op-cta-button{
				position: absolute;
				left: 22%;
				width: 50%;
				bottom: 20px;
				margin-bottom: 10px;
				text-align: center;
			}
		}
		@media screen and (max-width: 1120px) {
			.op-vacancies-card > div > a.op-cta-button{
				display: none;
			}
		}
		@media screen and (max-width: 850px) {
			.op-vacancies-card > div > a.op-cta-button{
				display: block;
			}
		}
.op-cta-button{
    padding: 5px 20px 5px 20px;
    background: #000000;
    color: #FFFFFF !important;
    overflow: hidden;
    -moz-transition: all .3s ease-in;
    -o-transition: all .3s ease-in;
    -webkit-transition: all .3s ease-in;
    transition: all .3s ease-in;
	text-transform: uppercase;
}
	.op-cta-button:hover{
		background: #656565;
	}
@media screen and (max-width: 850px) {
	.op-vacancies-prev-next .op-cta-button{
		padding: 5px 10px 5px 10px;
		font-size: 12px;
		font-weight: normal;
	}
}
.op-vacancies-tag, .op-vacancies-show-all{
    padding: 5px 20px 5px 20px;
	margin-right: 10px;
    background: #395173;
    color: #FFFFFF !important;
    border-radius: 20px;
    overflow: hidden;
    -moz-transition: all .3s ease-in;
    -o-transition: all .3s ease-in;
    -webkit-transition: all .3s ease-in;
    transition: all .3s ease-in;
}
	@media screen and (max-width: 850px) {
		.op-vacancies-tag, 
		.op-vacancies-show-all,
		.op-vacancies-tag.active,
		.op-vacancies-tag.active,
		.op-vacancies-tag:hover, 
		.op-vacancies-show-all:hover{
			padding: 5px 10px 5px 10px;
			font-size: 11px;
			font-weight: normal;
		}
	}
	.op-vacancies-tag.active,
	.op-vacancies-tag.active,
	.op-vacancies-tag:hover, 
	.op-vacancies-show-all:hover{
		background: #395173;
		opacity:0.8;
	}