/* --------------------------------------------- */
/*NDM SITE REDEV SEPT 22 STYLES */
/* --------------------------------------------- */

/* NOTE media commented tiles and columns won't be visible to edit in the compose screen unless you make the browser window narrow enough. */ 
/* eg there are 4 tiles on the study page which you can't edit if the browser window is over 767px width */
/* Apologies for any nightmares caused by all of the '!important' declarations. Haiku is a pig to restyle. Matt October'22 */

/* --------------------------------------------- */
/* images */
/* --------------------------------------------- */

html.main_ndm span.figure.image-inline {
    /* clip-path: polygon(100% 0, 100% 90%, 50% 100%, 0 100%, 0 0); */
}

/* --------------------------------------------- */
/* Fonts */
/* --------------------------------------------- */


html.main_ndm body {
    font-family: "azo-sans-web", arial, sans-serif!important;
    }

  
/* 
html.main_ndm a {
    font-weight: 700!important;
    }
	*/
     
html.main_ndm p {
	font-size: 16px;
	line-height: 24px;
}

html.main_ndm li {
    font-size: 16px;
	line-height: 20px;
}

a.link-mailto {
    font-size: 16px;
}

html.main_ndm h1, html.main_ndm h2, html.main_ndm h3, html.main_ndm h4, html.main_ndm h5, html.main_ndm h6, html.main_ndm #sub-head1, html.main_ndm #sub-head2 {
	font-family: "azo-sans-web", arial, sans-serif!important;
	text-transform: none!important;
	font-weight: 100;
}

html.main_ndm h2, html.main_ndm h3, html.main_ndm h4, html.main_ndm h5, html.main_ndm h6 {
    border-bottom: none!important;
	font-weight: 700;
}

html.main_ndm h1 {
	font-size: 50px;
}

html.main_ndm h2 {
	font-size: 30px;
	line-height: 32px;
}

html.main_ndm h3 {
	font-size: 24px;
	line-height: 26px;
}

html.main_ndm h4 {
	font-size: 20px;
	line-height: 22px;
}

html.main_ndm h5 {
	font-size: 16px;
	line-height: 18px;
}

/*sub-head styles used to style links and headlines in embed tiles sub head 1 is identical to h2 above. sub-head2 is h3 above*/
html.main_ndm #sub-head1{
	font-size: 30px;
	line-height: 32px;
}

html.main_ndm #sub-head2 {
	font-size: 24px;
	line-height: 26px;
}

html.main_ndm #sub-head2 a {
	transition: 0.5s;
	color: #002147;
}

html.main_ndm #sub-head2 a:hover {
  	transform: scale(1.5);
	font-size: 22px;
	text-decoration: none;
	color: #002147;
}

/* Tile title "News" and "Quicklinks" on internal and homepage */
html.main_ndm #b969519c-b5a1-4b35-b71a-ad052cc83afd h3, html.main_ndm fd795a2c-d74b-4c41-b6b2-df1ffae1946d h3 {
	font-size: 30px;
}

/* News story individual titles on internal and homepage */
html.main_ndm #b969519c-b5a1-4b35-b71a-ad052cc83afd h2 a, html.main_ndm #d158a650-8cfb-40fd-a992-ea4840de9ffb h2 a {
	font-size: 18px;
	line-height: 15px;
}




/* --------------------------------------------- */
/* Navigation and header restructure */
/* --------------------------------------------- */


html.main_ndm #site-header nav {
/*    border-bottom: 5px solid #ffffff;
    /* position: fixed;
    margin-top: -157px;
    background-color: #ffffff; */
    margin: 0 auto -1px auto;
    z-index: 1000;
    width: 100%;
	height: 50px;
	padding: 5px 0px 5px 0px;
	/* color: #ffffff!important; */
	background-color: #fff;
	/* border-top: 1px solid #fff; */
}


html.main_ndm #site-header #site-breadcrumbs {
    /* display: none!important; */
	color:	#fff;
    /* height: 0px; */
	overflow: hidden;
	margin-top: -500px;
}

html.main_ndm #d9692ddf-fddf-4e84-b67b-0fffffb99985 #site-breadcrumbs {
	visibility: hidden;
}


/* pull header in to the same width and margins as page content */
html.main_ndm #site-header header {
    /* margin-bottom: 16px; */
    background-position: initial;
    /* margin-top: 0px!important; */
    max-width: 1170px;
    margin: 0px auto 10px auto;
    background-repeat: initial;
    background-size: auto;
}

/* pull navbar to same width as page content */
html.main_ndm #site-header nav .row {
    max-width: 1196px;
    margin: 7px auto;
}

/* align navbar with left of logo */

.col-sm-10 {
    margin-left: 0;
}

/* push down new menu when editor menu splits onto 2 lines on narrower screens */
@media (max-width: 1261px) {
body.userrole-authenticated #site-header {
    margin-top: 110px;
}
} 

/* push site nav mobile hamburger menu down on narrower screens */
@media (max-width: 767px) {
.col-xs-2.visible-xs {
    margin-top: 18px;
}
}



/* --------------------------------------------- */
/* Nav colours and spacing (desktop) */
/* --------------------------------------------- */


/* Change menu font and size 
Delete
html.main_ndm #site-header .nav li a, html.main_ndm #site-parent__header .nav li a {
    font-family: "azo-sans-web", arial, sans-serif;
    font-size: 18px!important;
    text-transform: capitalize;
}*/

/* nav bar top padding */
#site-header nav, #site-parent__header nav {
    margin-top: 2rem;
	margin-bottom: -1px;
}

/* pull image up to navbar bottom border */
#site-header {
    padding-bottom: 0px;
	margin-bottom: -1px;
}


html.main_ndm #site-header .nav li a, html.main_ndm #site-parent__header .nav li a {
    font-family: "azo-sans-web", arial, sans-serif;
	color: #444;
    font-size: 16px!important;
    text-transform: capitalize;
	padding: 9px 15px 9px 15px;
	margin-top: -5px;
}

/* make nav items white 
html.main_ndm ul.nav.navbar-nav a {
	color: #fff!important;
} */


html.main_ndm #site-header .nav li.active a, html.main_ndm #site-parent__header .nav li.active a {
	border-bottom: 4px solid #eb5f17;
	color: #222147;
	/* height:	37px; */
}

html.main_ndm #site-header .nav li.active a:hover, html.main_ndm #site-parent__header .nav li.active a:hover {
	color: #222147;
}

html.main_ndm #site-header .nav li.active ul li a
/*, html.main_ndm #site-parent__header .nav li.active a */ {
	background-color: #fff;
	height:	37px;
}

html.main_ndm #site-header .nav li.active ul li a:hover
/*, html.main_ndm #site-parent__header .nav li.active a */ {
	color: #eb5f17;
}

/* colors for dropdown on main menu */
html.main_ndm .dropdown#portaltab-about ul li a {
	padding: 9px 15px 9px 0px;
	color: #002147;
}

/* colors for dropdown on main menu Do I need this???>? */ 
html.main_ndm div#site-bar ul.nav.navbar-nav ul li a {
    color: #002147!important;
}


html.main_ndm ul.nav.navbar-nav a:hover, html.main_ndm div#site-bar ul.nav.navbar-nav ul li a:hover {
    color: #eb5f17!important;
}

/* colour of current hover
html.main_ndm ul.nav.navbar-nav li.active a:hover, html.main_ndm div#site-bar ul.nav.navbar-nav ul li.active a:hover {
    color: #002147!important;
} */

/* slightly reduce menu font size on screens between desktop and mobile standard sizes, just to cover bases */
@media (max-width: 939px) {
html.main_ndm #site-header .nav li a, html.main_ndm #site-parent__header .nav li a {
    font-size: 15px!important;
    padding: 9px 5px 9px 15px;
}
}

/* --------------------------------------------- */
/* search box and icon*/
/* --------------------------------------------- */


/* icon */



/* --------------------------------------------- */
/* Accordion */
/* --------------------------------------------- */


html.main_ndm div#f4de1482-a90b-4618-b2f0-21657bf110e9 .accordion {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  border-bottom: 2px solid #fff;
  text-align: left;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
}

html.main_ndm div#f4de1482-a90b-4618-b2f0-21657bf110e9 .accordion:hover {
  background-color: #c6c6c6;
}
 

html.main_ndm div#f4de1482-a90b-4618-b2f0-21657bf110e9 .active, .accordion:hover {
  background-color: #ccc; 
}

 

html.main_ndm div#f4de1482-a90b-4618-b2f0-21657bf110e9 .panel {
  padding: 0 18px;
  display: none;
  background-color: white;
  overflow: hidden;
}


/* --------------------------------------------- */
/* Accordion End */
/* --------------------------------------------- */


/* --------------------------------------------- */
/* Internal Page Styling */
/* --------------------------------------------- */

/* delete
html.main_ndm .internal-p {
	font-size: 18px!important;
}
*/

html.main_ndm .quicklinks {
	padding: 10px;
	background-color: #002147;
	font-size: 18px;
	color: #ffffff;
  	transition: 0.5s;
}


html.main_ndm .quicklinks:hover {
  	transform: scale(1.04);
	font-size: 19px;
	padding-left: 20px;
}

/* --------------------------------------------- */
/* EMBED TILES */
/* --------------------------------------------- */



/* caption for embed tiles with pictures */
html.main_ndm .tile-caption {
	background-color: #be0f34;
	/* background-color: #002147; */
    	height: 80px;
    	color: #ffffff;
    	padding: 10px;
    	position: relative;
    	bottom: 80px;
    	width: 100%;
	margin-bottom: -80px;
}

/* hide overflow on all embed tiles */
html.main_ndm .cover-embed-tile.tile-content.clearfix.box-border-none.box-plain {
    	overflow: hidden;
}

/* font styling for colourboxes */
html.main_ndm #colourbox-head {
    	color: #ffffff;
    	font-family: "azo-sans-web", arial, sans-serif;
    	font-weight: 500;
    	font-size: 65px;
    	line-height: 50px;
    	margin: 0;
}

html.main_ndm #colourbox-sub{
    	color: #ffffff;
    	font-family: "azo-sans-web", arial, sans-serif;
    	font-weight: 500;
    	font-size: 33px;
    	line-height: 39px;

}


/* font styling for internal page colourboxes */
html.main_ndm .wrapper h6, html.main_ndm .wrapper-clip h6 {
    	color: #ffffff;
    	font-family: "azo-sans-web ", arial, sans-serif;
    	font-weight: 100;
    	font-size: 30px;
    	line-height: 36px;
	margin-top: 180px;
}

html.main_ndm .wrapper h6:hover {
	text-decoration:none;
}


/* colourbox wrapper and clipped corner wrapper */
html.main_ndm .wrapper {
	height: 320px; 
	width: 100%; 
  	transition: 0.5s;
}

/* colourbox wrapper clip off corner */
html.main_ndm .wrapper-clip{
    height: 320px;
    width: 100%;
		/* clip-path: polygon(100% 0, 100% 100%, 0 100%, 0px 73px, 90px 0); */
    transition: 0.5s;
}

/* wrapper hover animation effect */
html.main_ndm .wrapper-clip:hover, html.main_ndm .wrapper-unit-clip:hover {
  	transform: scale(1.04);
	font-size: 30px!important;
}

html.main_ndm .wrapper:hover, html.main_ndm .wrapper-unit:hover, html.main_ndm .wrapper-unit-clip:hover {
  	transform: scale(1.04);
	font-size: 30px!important;
}


/* ------------------------- */
/* UNIT PAGE                 */
/* ------------------------- */

/* font styling for units page colourboxes */
html.main_ndm .wrapper-unit h6, html.main_ndm .wrapper-unit-clip h6 {
    color: #ffffff;
    font-family: "azo-sans-web", arial, sans-serif;
    font-weight: 100;
    font-size: 24px;
    line-height: 28px;
	margin-top: -10px;
}


/* image styling for unit page */
html.main_ndm .unit-image {
	margin-bottom: -20px;
}


html.main_ndm .unit-image .image-inline {
	margin: 0;
}


/* shorter than wrapper-unit to allow the clip (the clip path adds to the height) */
html.main_ndm .wrapper-unit-clip {
    height: 130px;
    margin-top: 0px;
    width: 100%;
    	/* clip-path: polygon(100% 0, 100% 100%, 0 100%, 0px 73px, 90px 0); */
    transition: 0.5s;
}


/* content styling */
html.main_ndm .wrapper a div, html.main_ndm .wrapper-clip a div, html.main_ndm .wrapper-unit a div, html.main_ndm .wrapper-unit-clip a div {
	padding: 40px 20px; 
	height: 400px; 
	background-repeat: no-repeat;
	/* background-size: 80%; */
	background-position: top-left;
}


/* wrapper for unit page nb clip-path added to equalise heights */
html.main_ndm .wrapper-unit {
	height: 130px; 
    width: 101%;
    	/* clip-path: polygon(100% 0, 100% 100%, 0 100%, 0px 73px, 90px 0); */ */
    transition: 0.5s;
}

@media (max-width: 763px) {
html.main_ndm .wrapper a div, html.main_ndm .wrapper-clip a div, html.main_ndm .wrapper-unit a div, html.main_ndm .wrapper-unit-clip a div {
    background-size: contain;
}

html.main_ndm .wrapper-unit h6, html.main_ndm .wrapper-unit-clip h6 {
    font-size: 26px;
    line-height: 30px;
    margin-top: -8px;
}
}

/* --------------------------------------------- */
/* EMBED TILES END */
/* --------------------------------------------- */


/* --------------------------------------------- */
/* HOMEPAGE */
/* --------------------------------------------- */


html.main_ndm #homepage-study-tile {
    background-color: #9eceeb;
    background-size: cover;
    padding: 30px;
    height: 350px;
    border-bottom: 40px solid #002147;
    border-left: 20px solid #002147;
    border-top: 20px solid #002147;
}

html.main_ndm .home-study-pic-tile {
	background-image: url(https://www.ndm.ox.ac.uk/images/homepage/study-at-nuffield-department-of-medicine); background-size: cover;
	padding: 30px;
	height: 350px;
}	
	

/* 'NEWS' - tile title */
div#ec57b1a9-436a-40e6-af50-29982ebfe1bd h3 .external-link {
    line-height: 38px;
}
/* tighten up line height of news story titles on news tile */
#d158a650-8cfb-40fd-a992-ea4840de9ffb h2.media-heading {
    line-height: 26px;
}

/* news items margins */
div#d158a650-8cfb-40fd-a992-ea4840de9ffb {
    margin: -20px 0 -10px 0;
}


/* --------------------------------------------- */
/* HOMEPAGE END */
/* --------------------------------------------- */


/* --------------------------------------------- */
/* TEAM PAGE */
/* --------------------------------------------- */

html.main_ndm div.profiles-listing h2 {
    font-size: 18px;
	line-height: 20px;
}

/*html.main_ndm a[itemprop="name"] {
    font-size: 18px;
	line-height: 20px;
}
*/
html.main_ndm div#profiles-listing-tabbed p {
    font-size: 14px;
    line-height: 18px;
}

html.main_ndm div.cover-publications-tile p {
    font-size: 14px;
	line-height: 22px;
}

/* --------------------------------------------- */
/* TEAM PAGE END */
/* --------------------------------------------- */

/* --------------------------------------------- */
/* STUDY PAGE */
/* --------------------------------------------- */

/* pull images to left to align with course text */
.column.col-md-6.cs-8d840d33-b901-47e4-a631-2c91290f6bbc .tile-content .image-inline, .column.col-md-6.cs-105c2d99-8a0f-476b-9b6e-cfcab835ede7 .tile-content .image-inline, .column.col-md-6.cs-6c249df6-31c5-49ee-8920-08ef36392c39  .tile-content .image-inline, .column.col-md-6.cs-9689fa6b-1819-4f7d-a85c-d546cb23eb0a  .tile-content .image-inline {
    margin: 0;
}



@media (max-width: 763px) {
html.main_ndm .cs-9260e48d-3202-4252-9a62-a8699619d9dc {
	background-position: -498px!important;
}
}


/* --------------------------------------------- */
/* STUDY END */
/* --------------------------------------------- */
	
/* --------------------------------------------- */
/* ABOUT PAGE */
/* --------------------------------------------- */
/* delete don't know what this is/was
html.main_ndm  div#e8ae771b-bac9-40b6-86c4-ff181913baa5 {
	height: initial!important;
	border:10px solid red;
}
*/


/* --------------------------------------------- */
/* ABOUT END */
/* --------------------------------------------- */


/* --------------------------------------------- */
/* PUBLICATIONS PAGE */
/* --------------------------------------------- */

#publications-listing .listing-item .media-heading [itemprop="name"] {
    font-size: 18px;
}
/* --------------------------------------------- */
/* PUBLICATIONS END */
/* --------------------------------------------- */

/* --------------------------------------------- */
/* JOBS */
/* --------------------------------------------- */


html.main_ndm .tile-content .job-accordion .panel-default .panel-heading {
	text-transform: none;
}

html.main_ndm .tile-content .job-accordion .panel-default .panel-heading a.panel-title {
	text-transform: uppercase;
	font-weight: bold !important;
}

/* --------------------------------------------- */
/* JOBS END */
/* --------------------------------------------- */

/* --------------------------------------------- */
/* NEWS */
/* --------------------------------------------- */

/* news item main title */
.listing-item-news .media-heading [itemprop="name"] {
    font-size: 24px;
	line-height: 26px;
}

/* news item article intro text */
html.main_ndm .listing-item-news p[itemprop="description"] {
	font-size: 14px;
	line-height: 24px;
}

html.main_ndm .portlet-similaritems h3 {
    font-size: 24px;
    line-height: 26px;
}

/* --------------------------------------------- */
/* NEWS END */
/* --------------------------------------------- */


/* --------------------------------------------- */
/* CONTACT PAGE */
/* --------------------------------------------- */


div#contact_map {
	height: 343px;
}
div#contact_map div.overseas_unit h2 {
	font-size: 12px;
}
div#contact_map div.overseas_unit p {
	font-size: 10px;
}
div#contact_map div.overseas_unit img {
	width: 50%;
}

/* --------------------------------------------- */
/* CONTACT PAGE END */
/* --------------------------------------------- */

/* --------------------------------------------- */
/* FOOTER */
/* --------------------------------------------- */

html.main_ndm #site-footer .col-md-8 {
	width: 102%;
	background-color: #002147;
	padding: 50px;
	text-align: center;
	color: #fff;
	margin: -20px 0 0 -16px;
}

html.main_ndm #site-footer .col-md-4 {
	display: none!important;
	height: 0px;
}

html.main_ndm ul#footer-nav li a {
	font-size: 15px;
	color: #fff;
	line-height: 40px;
}

html.main_ndm div#site-copyright {
	font-size: 15px;
	margin-bottom: 22px;
}


/* --------------------------------------------- */
/* FOOTER END */
/* --------------------------------------------- */



/* --------------------------------------------- */
/* MEDIA QUERIES NEWS */
/* --------------------------------------------- */

@media (max-width: 763px) {
html.main_ndm .column.col-md-12.cs-49e6a411-888d-44d3-8c1f-1a129026f270 ul.list-horizontal {
    display: block!important;
   
}

html.main_ndm .column.col-md-12.cs-49e6a411-888d-44d3-8c1f-1a129026f270 .list-scroll__control.list-scroll__control--right {
    display: none;
}

html.main_ndm .state-published {
    font-size: 24px!important;
}
}

/* --------------------------------------------- */
/* MEDIA QUERIES jobs*/
/* --------------------------------------------- */

/* reposition header image for small screens */
@media (max-width: 763px) {
html.main_ndm .cs-bd31b06f-77d0-443f-9b4d-87f87dd1684b {
    background-position: -810px!important;}
}


/* --------------------------------------------- */
/* MEDIA QUERIES STUDY */
/* --------------------------------------------- */

/* hide wider screen courses on small screens */
@media (max-width: 991px) {
html.main_ndm .row.row8.cs-814aabda-2bbe-4037-b29f-9cadc7b2cb8d, 
html.main_ndm .row.row7.cs-2f659ca1-d5c2-4ea5-9907-05a8f23caca3, 
html.main_ndm .row.row6.cs-b1304d02-8551-4aab-8f5a-a13dcd900327,
html.main_ndm .row.row5.cs-f69cc913-be98-47b7-bf14-0098f42dfa5d, 
html.main_ndm .row.row9.cs-a18484d9-2514-45c5-85f6-5aca638ab5e0 {
    display: none;
}
}

/* hide narrow screen courses on wider screens */
@media (min-width: 992px) {
html.main_ndm .row.row11.cs-b27d33f6-b168-48c3-8bd7-1438ed75c375 {
    display: none;
}
}

/* --------------------------------------------- */
/* MEDIA QUERIES HOME */
/* --------------------------------------------- */

@media (max-width: 992px) {

/* hide movie on mobiles */
html.main_ndm .cs-4ddf2d88-6f0f-4730-9edc-f2635f9c4e78 {
    display: none;
}

/* hide title on mobiles */
html.main_ndm .row.row2.cs-ac465207-a34a-4ad9-b0a0-3b225ce2ac5e {
    display: none;
}
}

@media (max-width: 763px) {
html.main_ndm #homepage-study-tile {
	background-color: #c7d9f6;
	background-size: cover;
	padding: 20px 30px 20px 15px;
	height: 350px;
	border: 0px;
}

html.main_ndm .home-study-pic-tile {
    margin-left: 110px;
}	


html.main_ndm .column.col-md-6.cs-858157e9-d262-4d44-bb47-44d35cd58582 {
    margin-bottom: -20px;
    margin-left: 0px!important;
}
}

@media (min-width: 993px) {


/* show adjusted title on mobiles */
html.main_ndm .row.row3.cs-408bd46e-59c5-452c-93f0-2be3bc91fc8c {
    display: none;
}
}


/* 
html.main_ndm #site-search .input-group .input-group-btn .btn {
    color: #fff;
}
*/

/* --------------------------------------------- */
/* MEDIA QUERIES INTERNAL PAGE  */
/* --------------------------------------------- */

@media (max-width: 763px) {
/* font styling for internal page colourboxes */
html.main_ndm .wrapper h6, html.main_ndm .wrapper-clip h6 {
    color: #ffffff;
    font-family:  "azo-sans-web", arial, sans-serif;
    font-weight: 100;
    font-size: 30px;
    line-height: 32px;
	margin: 232px 0 0 -10px;
}
}