/* ----------------------------- */
        /* Hero image */
        .heroImage{
		max-height: 700px;
		overflow: hidden;
		}
		.heroImage img{
            min-width: 100%;
        }
		.video-background {
   			position: relative; 
			padding-bottom: 56.25%; 
			height: 0; 
			overflow: hidden; 
			max-width: 100%;
	        max-height:700px
		}
		.video-background iframe {
    		position: absolute; 
			top: 0; 
			left: 0; 
			width: 100%; 
			height: 100%;
			margin:0;
		}
        .hero-overlay {
            background-color: rgba(255,255,255,0.9);
            padding: 1em 1.5em;
            position: absolute;
            top: 35em;
            width: 32%;
            z-index: 2;
        }
        .hero-overlay .button:hover, .hero-overlay .button2:hover{
            background-color: #c70151;
        }
        .hero-overlay h2{
            margin-top: 0.5em;
        }
        .hero-overlay p{
            margin-bottom: 0.5em;
        }
        @media screen and (min-width: 200px) {
            .hero-overlay{
                position: relative;
                top: 0;
                width: 100%;
                padding: 1em 0 0 0;
            }
        }
        @media screen and (min-width: 1024px) {
            .hero-overlay{
                padding: 1em 1.5em;
                position: absolute;
                top: 24em;
                width: 50%;
                z-index: 2;
            }
        }
        @media screen and (min-width: 1200px) {
            .hero-overlay{
                position: absolute;
                top: 28em;
                width: 40%;
            }
        }
        @media screen and (min-width: 1300px) {
            .hero-overlay{
                top: 32em;
                width: 35%;
            }
        }
        @media screen and (min-width: 1500px) {
            .hero-overlay{
                top: 35em;
                width: 32%;
            }
        }

        /* ----------------------------- */
        /* Maps */
        iframe {
            margin-top: 1em;
        }
        .campus-map{
            float: left;
            width: 100%;
        }
        #map {
            height: 500px;
        }
        /* ----------------------------- */
        /* Expanding search */
        .searchbox{
            position: relative;
            min-width: 40px;
            width: 0%;
            height: 40px;
            float: right;
            overflow: hidden;

            -webkit-transition: width 0.5s;
            -moz-transition: width 0.5s;
            -ms-transition: width 0.5s;
            -o-transition: width 0.5s;
            transition: width 0.5s;
        }
        .searchbox-input{
            top: 0;
            right: 0;
            border: 0;
            outline: 0;
            background: #eee;
            width: 100%;
            height: 40px;
            margin: 0;
            padding: 0 55px 0 20px;
        }
        .searchbox-icon, .searchbox-submit{
            width: 40px;
            height: 40px;
            display: block;
            position: absolute;
            top: 0;
            right: 0;
            padding: 0;
            margin: 0;
            border: 0;
            outline: 0;
            line-height: 36px;
            text-align: center;
            cursor: pointer;
            background: #1a428a;
        }
        .searchbox-icon:hover, .searchbox-submit:hover{
            background: #c70151;
        }
        .searchbox-icon img{
            width: 70%;
        }
        #q{
            margin: 0;
            width: auto;
        }
        .searchbox-open{
            width:100%;
        }
/* ----------------------------- */
/* Google maps */
#cd-google-map {
  position: relative;
  margin: 0 auto;
  max-width: 1065px;
  height: 600px;
  overflow: hidden;
}

#google-container {
  position: relative;
  width: 100%;
  height: 300px;
  background-color: #1d4998;
  float: left;
  display: inline-block;
}
#google-container-world {
  background-color: #1d4998;
  width: 100%;
  height: 300px;
  position: relative;
  float: left;
  display: inline-block;
}
#cd-google-map h2 {
  margin-top: 0;
}
@media only screen and (min-width: 768px) {
  #google-container,
  #google-container-world{
    height: 600px;
  }
}
@media only screen and (min-width: 1170px) {
  #google-container,
  #google-container-world{
    height: 600px;
  }
}

#cd-google-map #locations {
  position: absolute;
  width: 300px;
  bottom: 120px;
  padding: 1.5em;
  background-color: #1a428a;
  color: white;
}
#locations h1 {
  margin-bottom: 15px;
}
#locations a {
  color: white;
}
#locations ul.tabNavigation {
    width: 100%;
    overflow: hidden;
}
#locations ul.tabNavigation li {
  width: auto;
  border-right: 0;
  list-style: none;
  font-size: 0.9em;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  border-bottom:0;
}
#locations ul.tabNavigation li .selected {
background-color: #5a77ab;
    border-radius: 5px;
}
#locations ul.tabNavigation li a {
  padding: 3px 8px;
}
#locations .tabs {
  border:0;
  margin: 10px 0;
  padding:0;
}
#locations .marker-list {
    list-style: none;
    margin: 10px 0;
    padding: 0 0 0 8px;
    font-size: 1.5em;
    letter-spacing: 0.03em;
}
#locations .marker-list a:hover {
  color: #c1d3f3;

}
@media only screen and (max-width: 768px) {
#cd-google-map {
	width:100%;
	height:auto;
	overflow:initial;
}
.maps-wrapper {
	height:300px;
	overflow:hidden
}
#cd-google-map #locations {
 width: 80%;
 position: relative;
 top: 0;
 left: 0;
 margin:-80px auto 0;
 height: 300px;
}
}
@media only screen and (min-width: 768px) {
  #cd-google-map #locations {
    font-size: 15px;
    font-size: 0.9375rem;
  }
}

#cd-zoom-in, #cd-zoom-out {
  height: 32px;
  width: 32px;
  cursor: pointer;
  margin-left: 10px;
  background-color: rgba(26, 66, 128, 0.9);
  background-repeat: no-repeat;
  background-size: 32px 64px;
  background-image: url("../img/cd-icon-controller.svg");
}
.no-touch #cd-zoom-in:hover, .no-touch #cd-zoom-out:hover {
  background-color: #d36868;
}
@media only screen and (min-width: 768px) {
  #cd-zoom-in, #cd-zoom-out {
    margin-left: 50px;
  }
}

#cd-zoom-in {
  background-position: 50% 0;
  margin-top: 10px;
  margin-bottom: 1px;
}
@media only screen and (min-width: 768px) {
  #cd-zoom-in {
    margin-top: 50px;
  }
}

#cd-zoom-out {
  background-position: 50% -32px;
}

/* Tabs*/

.tabs{
  position: relative;
  clear: both;
  min-height: 210px;
  margin: 20px 0;
}

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

.tab-content{
  position: absolute;
  background-color: #2157A5;
  width: 100%;
  left: 0px;
  height: 100%;
}
.tab-content a {
   color: #fff;
 text-decoration: none;
}

.tabs .tab:nth-of-type(1) .content{
  z-index: 1;
}

.tab:target a{
 color: #fff;
 text-decoration: none;
}

.tab:target .tab-content{
  z-index: 1;
}
/* ----------------------------- */
/* Course search */
        .highlight{
            background-color: rgba(13,129,117,0.3);
            margin: 0 auto;
        }
        .contentSearch{
            width: 65%;
            padding: 1%;
            border: 0;
        }
        .contentMenu{
            margin-right: 2%;
        }
        .contentSearchSubmit{
            width: 10%;
            margin-left: 2%;
            padding: 1%;
            background-color: #444;
        }
        select {
            -moz-appearance: none;
        	-webkit-appearance: none;
            background: #ffffff url(//www.qmul.ac.uk/media/site-assets/qmul-site/scripts/javascript/arrow-down.png) no-repeat scroll right 15px center;
            border: 0;
			-webkit-border-radius: 0;
			-moz-border-radius:0;
            border-radius: 0;
            color: #333;
            cursor: pointer;
            display: inline-block;
            margin: 0;
            outline: medium none;
            padding: 1%;
            width: 20%;
        }
		.study input {
            -moz-appearance: none;
        	-webkit-appearance: none;
			-webkit-border-radius: 0;
			-moz-border-radius:0;
            border-radius: 0;
		}
		
        @media screen and (min-width: 200px) {
            .contentSearch{
                width: 94%;
                padding: 3%;
                margin-top: 1em;
            }
            .contentMenu{
                margin: 0;
                width: 100%;
                padding: 3%;
                float: left;
            }
            .contentSearchSubmit{
                width: auto;
                padding: 3%;
                margin: 1em 0 0 0;
            }
			#pgr-search select {
				width:100%;
				margin-top:1em;
				padding: 3%;
			}
        }
 		@media screen and (min-width: 600px) {
			.contentSearch{
                width: 100%;
            }
		}
        @media screen and (min-width: 760px) {
            .contentSearch{
                width: 55%;
                padding: 2%;
                margin: 0 1% 0 0;
            }
            .contentMenu{
                margin: 0 2% 0 0;
                width: 28%;
                padding: 2%;
                float: left;
            }
            .contentSearchSubmit{
                width: auto;
                padding: 2%;
                margin: 0 0 0 0;
            }
			#pgr-search select {
				width:65%;
				margin-top:0;
				padding: 2%;
			}
        }
        @media screen and (min-width: 1000px) {
            .contentSearch{
                width: 66%;
                padding: 1%;
                margin-top: 0;
            }
            .contentMenu{
                margin-right: 2%;
                width: 20%;
                padding: 1%;
            }
            .contentSearchSubmit{
                width: 10%;
                padding: 1%;
            }
			#pgr-search select {
				padding: 1%;
			}
        }
        /* ----------------------------- */
        /* Promo blocks */
        .promo-block{
            text-align: center;
        }
        .promo {
            background-color: #444;
            color: #fff;
            font-size: 1.3em;
            margin: 0;
            padding: 1.5em 0;
            text-align: center;
        }
        .subPromo2{
			margin-bottom: 0;
			padding: 3em 0;	
		}
        .subPromo2 h1{
            font-size: 2em;
            text-align: center;
            margin-bottom: 1em;
        }
        .subPromo2 label{
			display: none;
		}
		.subPromo3{
			margin-bottom: 0;
			padding: 3em 0;	
		}
        @media screen and (min-width: 200px) {
            .subPromo2 h1{
                margin-bottom: 0.5em;
            }
            .promo-block h1{
                font-size: 2em;
            }
            .subPromo3 .button2{
                width: 60%;
                margin-bottom: 1em;
            }
            .subPromo3 .button2:last-child{
                margin-bottom: 0;
            }
        }
        @media screen and (min-width: 1000px) {
            .subPromo2 h1{
                margin-bottom: 1em;
            }
            .promo-block h1{
                font-size: 2.4em;
            }
            .subPromo3 .button2{
                width: auto;
                margin-bottom: 0;
            }
        }
		/* ----------------------------- */
        /* News blocks */
        .row {
            float: left;
            position: relative;
            width: 100%;
        }
        .home-promo-image{
            width: 50%;
            float: left;
        }
        .home-promo-text{
            margin-left: 5%;
            position: absolute;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
			-ms-transform: translateY(-50%);
			-webkit-transform: translateY(-50%);
            width: 45%;
        }
        .row:nth-child(2n) .home-promo-image{
            width: 50%;
            float: right;
        }
        .row:nth-child(2n) .home-promo-text{
            margin-right: 5%;
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-50%);
			-ms-transform: translateY(-50%);
			-webkit-transform: translateY(-50%);
            width: 45%;
        }
        @media screen and (min-width: 200px) {
            .home-promo-image{
                width: 100%;
                margin-bottom: 1em;
            }
            .home-promo-text, .row:nth-child(2n) .home-promo-text{
                position: relative;
                width: 100%;
                margin: 0;
                transform: unset;
				-ms-transform: unset;
				-webkit-transform: unset;
            }
            .row:nth-child(2n) .home-promo-image{
                width: 100%;
                float: none;
                margin-bottom: 1em;
            }
            .home-promo-text h1, .row:nth-child(2n) .home-promo-text h1{
                font-size: 1.8em; 
            }
        }
        @media screen and (min-width: 1000px) {
            .home-promo-image{
                width: 50%;
                margin-bottom: 0;
            }
            .home-promo-text{
                margin-left: 5%;
                position: absolute;
                right: 0;
                top: 50%;
                transform: translateY(-50%);
				-ms-transform: translateY(-50%);
				-webkit-transform: translateY(-50%);
                width: 45%;
            }
            .row:nth-child(2n) .home-promo-image{
                width: 50%;
                float: right;
                margin-bottom: 0;
            }
            .row:nth-child(2n) .home-promo-text{
                margin-right: 5%;
                position: absolute;
                left: 0;
                top: 50%;
                transform: translateY(-50%);
				-ms-transform: translateY(-50%);
				-webkit-transform: translateY(-50%);
                width: 45%;
            }
            .home-promo-text h1, .row:nth-child(2n) .home-promo-text h1{
                font-size: 2em; 
            }
        }
		@media screen and (min-width: 1200px) {
			.home-promo-text h1, .row:nth-child(2n) .home-promo-text h1{
                font-size: 2.4em; 
            }
		}
        .date{
            color: #959393;
        }
        .category{
            background: #0d8175;
            color: #fff;
            display: inline-block;
            font-size: 0.9em;
            letter-spacing: 0.08em;
            padding: 2px 10px;
            margin-bottom: 0.5em;
            text-align: left;
            text-transform: uppercase;
        }
        /* ----------------------------- */
        /* 3 columns */
        .three-column {
            overflow: hidden;
            width: 100%;
            margin-bottom: 2em;
			margin-top: 0;
        }
        .three-column .column-item {
            margin: 0 2% -9999px 0;
            padding-bottom: 9999px;
            width: 32%;
            float: left;
            text-align: center;
        }
        .three-column > .column-item:nth-of-type(3) {
            float: right;
            margin-right: 0;
        }
		.three-column img {
			    display: inline;
    			width: auto;
margin-bottom: 1em;
		}
        .column-item h2{
            margin-top: 0;
        }
        @media screen and (min-width: 200px) {
            .three-column .column-item {
                width: 100%;
            }
			.three-column img {
			    display: inline;
    			width: auto;
			}
        }
        @media screen and (min-width: 1000px) {
            .three-column .column-item {
                width: 32%;
            }
        }
        /* ----------------------------- */
        /* Tabs */
        .tabbed-content{
            margin-top: 2em;
        }
        .tabbed-content section {
            display: none;
            padding: 1em 0 0;
            border-top: 1px solid #ddd;
        }
        .tabbed-content input {
            display: none;
        }
        .tabbed-content label {
            display: inline-block;
            margin: 0 0 -1px;
            padding: 1em 2em;
            font-weight: 600;
            text-align: center;
            color: #bbb;
            border: 1px solid transparent;
        }
        .tabbed-content label:hover {
            color: #888;
            cursor: pointer;
        }
        .tabbed-content input:checked + label {
            color: #444;
            border: 1px solid #ddd;
            border-top: 5px solid #FFA969;
            border-bottom: 1px solid #fff;
        }
        #tab1:checked ~ #content1, #tab2:checked ~ #content2, #tab3:checked ~ #content3, #tab4:checked ~ #content4 {
            display: block;
        }