@media screen, projection, print {

	#content {
		background: #F8F8F8;
	}

	#content .center .center {
		max-width: 1180px;
    	background: none;
    	font-family: 'Open Sans', sans-serif;
    	font-weight: 300;
    	font-size: 16px;
    	line-height: 24px;
	}

	.tall {
		font-size: 19px;
    	line-height: 30px;
	}

	.middle {
		font-size: 16px;
    	line-height: 28px;
	}

	p.middle + ul.tall {	
		margin-top: 25px;
	}

	#content > .center {
    	max-width: 100%;
    	padding-top: 70px;
	}

	.media-header {
    	background: #1f1e22;
	}

	.media-header.employer {
		background: #c8dae4; 
	}

    .media-header.employereng {
		background: #94a5b6; 
	}

    
	.media-header > img {
    	height: 438px;
	}

	.media-header h1 {
		position: absolute;
		z-index: 2;
		left: 35.25%;
		top: 9%;
		width: auto;
		padding-left: 10px;
		padding-right: 10px;		 
		background: #7CC013;
		font-size: 36px;
		line-height: 57px;
		text-align: left;
		color: #ffffff;
	}

	.media-header.employer h1 {
		background: #134380;
	}

	.media-header h1.min {
		font-size: 18px;
		line-height: 28.5px;
	}

	.media-header + .content .center {
		padding-top: 65px;
		overflow: hidden;
	}

	.media-header + .content {
		background: #fff;
		padding-bottom: 65px;
	}

	.media-header + .content + .content {
		background: none;
		padding-bottom: 0px;
	}

	#content .center .center h2 {
		margin-bottom: 35px;
		font-size: 36px;
		color: #134380;
	}

	#content .center .center h3 {
		margin-top: 50px;
		margin-bottom: 20px;
		font-size: 24px;
		color: #134380;
	}

	#content .center .center p + h3 {
		margin-top: 45px;
	}

	#content h3.green {
		margin-top: 10px;
		color: #7dc014;
	}

	#content h4.green {
		margin-bottom: 25px;
		font-size: 19px;
		color: #7dc014;
	}

	#content p.middle + h4.green {
		margin-top: 35px;
	}

	#content p.info {
		font-size: 13px;
    	line-height: 22px;
    	font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
    	color: #999999;
	}

	#content label {
		font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
		font-weight: bold;
		font-size: 14px;
		color: #000000;
	}


	#content ul.checkmark {
		margin-bottom: 25px;
	}

	#content ul.checkmark li {
		padding-left: 45px;
		background: url(../../../images/check_small.png) no-repeat 0px 6px;
	}

	#content ul.checkmark li + li {
		margin-top: 7px;
	}

	#content .contain.image img {
		position: absolute;
		width: 100%;
	}

	#content .contain.image.text  {
		text-align: center;
	}

	#content .contain.image.text img {
		position: relative;
		margin-bottom: 5px;		
	}

	#content .action {
		margin-top: 60px;
	}

	#content .action + p {
		margin-top: 50px;
	}

	#content .action + p.info {
		margin-top: 30px;
	}

	#content .action.info .col1 {
		width: 235px;
		text-align: center;
		border-right: 1px solid #C4C4C4;
	}

	#content .action.info .col2 {
		padding-left: 45px;
		padding-right: 15px;
	}

	#content .action.mail {
		margin-left: 30px;
		margin-right: 30px;
		margin-top: 10px;
	}

	#content .action.mail p.info {
		margin-top: 25px;
		color: #999999;
	}

	#content .btn.big {
		position: relative;
		width: 100%;
		max-width: 420px;
		padding: 0px;
		white-space: inherit;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
	}

	#content .btn.big > span {
		display: table;
		width: 100%;
		height: 100%;
	}

	#content .btn.big > span > span {
		display: table-cell;
		height: 80px;
		padding-left: 20px;
		vertical-align: middle;
		text-align: center;
		font-family: 'Open Sans', sans-serif;
		font-weight: 600;
		font-size: 20px;
		color: #ffffff;
	}

	#content .btn.big > span > span > span {
		display: inline-block;
		padding: 0px 30px;
		background: url(../../../images/btn.big_arrow.png) 0px 4px no-repeat;
		text-align: left;
	}

	#content .btn-top {
		float: right;
	}

	#content .button {
		margin-top: 70px;
		font-size: 20px;
		line-height: 27px;
	}

	#content .button a:hover {
		text-decoration: none;
	}

	#content .button .previous .text {
		padding-left: 30px;
		background: url(../../../images/coop/button.png) no-repeat 0px 1px;
	}

	#content .button .next {
		float: right;
	}

	#content .button .next .text {
		padding-right: 30px;
		background: url(../../../images/coop/button.png) no-repeat right -26px;
	}

	#content .option div {
		display: inline-block;
		margin-right: 50px;
		font-size: 19px;
	}

	#content .option div + div {
		margin-right: 0px;
	}

	#content .option div a {
		display: inline-block;
		width: 35px;
		height: 35px;
		margin-left: 10px;
		background: #A5AEB4;
		line-height: 35px;
		text-align: center;
		font-family: 'Open Sans', sans-serif;
		font-weight: 600;
		font-size: 18px;
		color: #ffffff;
		-webkit-border-radius: 17.5px;
		-moz-border-radius: 17.5px;
		border-radius: 17.5px;
	}

	#content .option div a.selected {
		background: #000000;
	}

	#content .option div a + a {
		margin-left: 1px;
	}

	#content .background {
		padding: 20px 15px 20px 15px;
		margin-top: 38px;
		margin-bottom: 40px;
		margin-right: 0px;
    	margin-left: 0px;
		background: #F0F0F0;
	}

	#content .flyer {
		margin-top: 40px;
	}

	#content .flyer .col.image {
		width: 33%;
	}

	#content .flyer .col.image img {
		float: left;
		width: 100%;
	}

	#content .flyer .col {
		vertical-align: middle;
	}

	#content .flyer .col.text {
		padding-left: 30px;
	}

	#content .flyer p {
		display: block;
		padding-left: 47px;
		font-size: 19px;
		line-height: 30px;
		background: url(../../../images/download.png) no-repeat;
	}

	#content .flyer p {
		margin: 0px;
	}

	#content .flyer p + p {
		margin-top: 30px;
	}

	#content .alert-success {
		margin-top: 30px;
		background: #FFFCD7;
		border:  none;
		-webkit-border-radius: none;
        -moz-border-radius: none;
        border-radius: none;
        color: #134380;
	}

	#content .row.form {
		background: #ECF6DC;
    	padding-bottom: 40px;
    	padding-top: 15px;
    	margin-bottom: 30px;
    	margin-top: 30px;
	}

	#content .row.form h4 {
		margin-top: 10px;
		margin-bottom: 10px;
	}

	#content .row.form button[type="submit"] {
		margin-top: 15px;
		width: 150px;
	    background: #82C31A;
	    background: -webkit-linear-gradient(-90deg, rgba(154,222,47,1) 0%, rgba(128,193,24,1) 100%);
	    background: -moz-linear-gradient(180deg, rgba(154,222,47,1) 0%, rgba(128,193,24,1) 100%);
	    background: linear-gradient(180deg, rgba(154,222,47,1) 0%, rgba(128,193,24,1) 100%);
	    border-top-color: #9ADE2F;
	    border-left-color: #9ADE2F;
	    border-bottom-color: #50790E;
	    border-right-color: #50790E;
	}

	#content .action.mail {
		margin-left: 15px;
		margin-right: 15px;
	}

	#content .separator {
		display: block;
		margin-top: 60px;
		margin-bottom: 35px;
		width: 100%;
		height: 1px;
		background: #D1D6DA;
	}

	.site-about,
	.site-imprint {
	    padding-top: 50px;
	}

	#content noscript .alert.alert-warning {
		position: absolute;
		z-index: 9;
	}

	/* Schools edit form */

	.school-edit .form {
		margin-top: 40px;
		padding-left: 15px;
		padding-right: 15px;
		padding-bottom: 15px;
		background: #F0F0F0;
	}

	#content .school-edit .form h3 {
		font-size: 20px;
		margin-bottom: 0px;
	}

	.school-edit p {
		font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
		font-weight: normal;
		font-size: 14px;
		line-height: 20px;
	}

	#content .school-edit p.info {
		position: absolute;
		left: 0px;
		top: 100%;
		max-width: 340px;
		margin-left: 15px;
		margin-right: 15px;
		padding-left: 36px;
		background: url(../../../images/coop/info.png) no-repeat 0px 5px;
		line-height: 17px;
		color: #000000;
	}

	.school-edit input[type="file"],
	.school-edit .delete {
		font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
		font-weight: normal;
		font-size: 14px;
	}

	.school-edit .delete {
		margin-bottom: 20px;
	}

	.school-edit .field-editlanguageschool-logo {
		position: relative;
	}

	.school-edit .field-editlanguageschool-logo label {
		margin-bottom: 38px;
	}

	.school-edit .field-editlanguageschool-logo input[type="file"] {
		position: absolute;
		z-index: 2;
		left: 0px;
		top: 36px;
		margin-top: 0px;
		font-size: 30px;
		filter:alpha(opacity: 0);
		-moz-opacity:0;
		opacity: 0;
		cursor: pointer;
	}

	.school-edit .field-editlanguageschool-logo button {
		position: absolute;
		z-index: 1;
		left: 0px;
		top: 36px;
		cursor:pointer;
	}

	.school-edit .field-editlanguageschool-logo.has-error .help-block {
		margin-top: 5px;
	}

	.school-edit .form .school-teaser {
		margin-top: 20px;
		max-width: 340px;
	}

	/* Schools list */

	.schools-list {
		margin-bottom: 50px;
	}

	.schools-list h4 {
		margin-top: 20px;
		margin-bottom: 20px;
	}

	.school-teaser {
		position: relative;
		background: #ffffff;
		margin-bottom: 20px;
		border: 1px solid #D1D6DA;
		-webkit-box-shadow: 6px 6px 0px 0px rgba(209,214,218,1);
        -moz-box-shadow: 6px 6px 0px 0px rgba(209,214,218,1);
		box-shadow: 6px 6px 0px 0px rgba(209,214,218,1);
	}

	.school-teaser > div {
		margin-left: 20px;
		margin-right: 20px;
		text-align: center;
	}

	.school-teaser > .image {
		margin-top: 30px;
		height: 80px;
		background-image: url(../../../images/coop/schools/default.png);
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center center;
	}

	.school-teaser > .text {
		margin-top: 20px;
		margin-bottom: 20px;
	}

	.school-teaser > .text h5 {
		font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
		font-size: 14px;
		line-height: 18px;
		font-weight: bold;
		color: #134380;
	}

	.school-teaser > .text a {
		position: relative;
		z-index: 2;
		font-size: 13px;
		line-height: 18px;
		color: #747f86;
	}

	.school-teaser > a {
		position: absolute;
		left: 0px;
		top: 0px;
		display: block;
		z-index: 1;
		width: 100%;
		height: 100%;
	}

	.school-teaser.size2 > .image {
		margin-top: 22px;
	} 

	.school-teaser.size2 > .text {
		margin-top: 15px;
		margin-bottom: 15px;
	}

	/* Landing page */

	.school-edit-link {
		margin-top: 20px;
		padding: 28px 28px 28px 57px;
		background: url(../../../images/coop/school-edit-link.png) no-repeat 17px 27px #7CC013;
		-webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
	}

	.school-edit-link h6 {
		margin-top: -5px;
		margin-bottom: 7px;
		font-weight: 400;
		font-size: 19px;
		line-height: 24px;
		color: #ffffff;
	}

	.school-edit-link a {
		display: block;
		font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
		font-weight: normal;
		font-size: 14px;
		line-height: 18px;
		color: #ffffff;
	}

	/* Intro page */

	#intropage-country {
		margin-top: 5px;
	}
}

@media (max-width: 1199px) {

	.media-header {
		width: 120%;
		margin-left: -10%;
		height: auto;
	}

	.media-header > img {
		width: 100%;
		height: auto;
	}

	.media-header h1 {
		left: 9.1%;
	}

}

@media (max-width: 768px) {

	#content .contain.image {
		text-align: center
	}

	#content .contain.image img {
		position: relative;
		margin-top: 20px;
		display: inline-block;
		max-width: 270px;
	}

	#content .flyer .col.image,
	#content .flyer .col.text {
		float: left;
		width: 100%;
		padding-left: 0px;
	}

	#content .flyer .col.image img {
		max-width: 321px;
		margin-bottom: 30px;
	}

	#content .btn-top {
		float: left;
		margin-bottom: 25px;
	}

	#content .option div {
		margin-right: 25px;
		font-size: 15px;
	}

	#content .option div a {
		margin-left: 5px;
		font-size: 15px;
		width: 30px;
   	 	height: 30px;
   	 	line-height: 30px;
	}

	#content .school-edit p.info {
		position: relative;
		bottom: inherit;
		left: 0px;
		margin: 0px 0px 15px 0px;
	}

}


@media (max-width: 580px) {

	#content .button img,
	#content .button .icon {
		display: none;
	}

	#content .button .next.banner {
		padding-top: 0px;
		padding-right: 0px;
	}

	#content .button a {
		max-width: 100%;
	}

	#content .button div + div a {
		margin-top: 15px;
	}

}

@media (max-width: 480px) {

	.media-header h1 {
		position: relative;
		left: 0%;
		margin: 0px;
		width: 100%;
		padding-left: 18%;
		padding-right: 18%;
	}

	#content .center .center h2 {
		font-size: 30px;
		line-height: 32px;
	}

	#content .btn.big {
		padding-left: 15px;
		padding-right: 15px;
	}

	#content .btn.big > span {
		font-size: 15px;
		height: 66px;
	}

	#content .option div {
		display: block;
	}

	#content .option div + div {
		margin-top: 10px;
	}

	#content .background {
		padding-left: 0px;
		padding-right: 0px;
	}

	#content .row.action.info .col {
		display: block;
		border-right: none;
	}

	#content .row.action.info .col2 {
		padding-left: 15px;
	}

	#content .row.action.info p.info {
		margin-top: 20px;
	}

	#content .btn.big > span > span {
		padding-left: 0px;
	}

	#content .btn.big > span > span > span {
		padding-right: 0px;
	}
}