/* RESET */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: 100%; font: inherit; vertical-align: baseline; }


/* TEMP DEV STYLES */
#admin { position: fixed; bottom: 0; width: 98%; padding: 1%; background: rgba(0,0,0,0.5); font-size: 13px; color: #FFF; text-align: center; clear: both; }
.typo-heading { font-size: 1.2em; color: #CCC; padding: 0.5em 0; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; margin: 0; }
.typo-description { font-size: 0.8em; color: #757575; padding: 1em 0.5em; background: #FCFCFC; margin: 0; }
.typo-section { padding: 1.5em 0; }
.temp { text-align: center; padding: 0.5em 1em; background: #FAFAFA; }
.temp a { font-size: 0.8em; border: 0; }

/* pallete 
Light blue (163,199,235) #A3C7EB
Dark blue (46,71,106) #2E476A
Orange (235,90,56) #EB5A38

Cream 253,202,106 #FDCA6A
Blue 118,158,209 #769ED1
Terracotta 200,70,27 #C8461B
Maroon 66,67,87 #424357
Brown #663300

DRC BLUE:                    #17345b
DRC CREAM                 #FFE1AD
DRC TERRACOTTA        #C8461C
DRC RED                       #c00d13
DRC GREEN:                 #016241
*/


body { font-family: Montserrat, Raleway, sans-serif; font-size: 15px; font-weight: 400; color: #252525; line-height: 1.5; background-color: #E6DBA3; margin: 0; overflow-x: hidden; }

h1,h2,h3,h4,h5,h6,button { font-family: Montserrat, sans-serif; font-weight: 700; color: #000; margin: 0 0 1rem 0;  }

h1 { font-size: 2.0em; }
h2 { font-size: 1.4em; }
h3 { font-size: 1.2em; }
h4 { font-size: 1.0em; }
h5 { font-size: 1.0em; }
h6 { font-size: 1.0em; }
.tablewrapper { overflow-x: scroll; }
.tablewrapper table { min-width: 640px; } 
table { font-size: 0.9rem; border-collapse: collapse; border-bottom: 1px solid #CCC; margin: 0 0 1rem 0; }
caption { font-style: italic; margin: 0 0 1em 0; }
th { font-weight: bold; text-align: left; padding: 0.5rem 1rem 0.5rem 0; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; }	
td { vertical-align: top; padding: 0.75rem 1rem 0.75rem 0; border-top: 1px solid #CCC; }
p { line-height: 1.5; margin: 0 0 1rem 0; }
ul { list-style: disc; line-height: 1.5; padding: 0; margin: 0 0 1rem 1.5em; }
ol { list-style: decimal; line-height: 1.5; padding: 0; margin: 0 0 1rem 1.5em; }
dl { line-height: 1.5; margin: 0 0 1rem 0; }
dt { font-weight: bold; margin: 0; }
dd { margin-left: 1em; }
blockquote { font-family: Georgia, Serif; font-size: 1.0em; font-style: italic; color: #757575; padding: 0 1em; border-left: 2px solid #CCC; margin: 0 1em 1rem 1em; }
img { max-width: 100%; height: auto;  }
figure { text-align: center; margin: 0 0 1rem 0; }
figcaption { font-size: 0.8em; font-style: italic; color: #666; padding: 0.5em 0; }
.nobullet { list-style: none; margin: 0 0 1.5em 0; }
.inline li { display: inline; }
hr { display: block; width: 100%; background: 0; border: 0; border-bottom: 1px solid #B22222; margin: 1rem 0 2rem; clear: both; }
img { max-width: 100%; height: auto; }
a { color: #424357; transition: 0.25s; } 
a:hover, a:focus { color: #016241; text-decoration: underline;  } 
small { font-size: 0.8em; }
em,i { font-style: italic; }
b,strong { font-weight: bold; }
pre { color: #4c516d; line-height: 1.5; padding: 1em 0; border-top: 1px dotted #CCC; border-bottom: 1px dotted #CCC; }
code { font-family: monospace; font-size: 1.1em; }
.center { text-align: center; }
.clear { clear: both; }
.right { text-align: right; }
.highlight { font-style: italic; color: #000; background: #FFFF00; background: rgba(255, 255, 0, 0.5); padding: 1em; border-radius: 14px 0; }

/* LAYOUT */

.wrapper { max-width: 1280px; background: #FFF; margin: 0 auto; } 

.row { position: relative; clear: both; }

.row-top { width: 100%; height: 130px; background: #FFF url(/templates/didcot/images/bg-header.png) no-repeat; }

.row-hero { background: #C8461B url(bg-hero.jpg) center center; background-size: cover; }
.row-content { background: #FFFFFF; }
.row-content-alt { background: rgba(118,158,209,0.2); 
-webkit-clip-path: polygon(100% 0%, 100% 100%, 50% 95%, 0% 100%, 0% 0%);
clip-path: polygon(100% 0%, 100% 100%, 50% 95%, 0% 100%, 0% 0%);
} 
.row-footer { background: #FFFFFF; }
.row-footer-alt { background: #EEEEEE; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; margin-top: 2em; }

.top { padding: 0 1rem; }
.nav { position: relative; max-width: 1200px; padding: 0 1rem;  margin: 0 auto; clear: both; }
.hero { position: relative; max-width: 1200px; padding: 25% 1rem 1rem 1rem; margin: 0 auto; z-index: 999; }
.header { max-width: 1200px; padding: 3rem 1rem 0 1rem; margin: 0 auto; }
.header-narrow { max-width: 800px; }
.section { max-width: 1200px; padding: 3rem 1rem; margin: 0 auto; clear: both; }
.section-narrow { max-width: 800px; }
.section-thin { max-width: 600px; }
.footer { max-width: 1200px; padding: 1rem 1rem; margin: 0 auto; }


.grid2 { display: grid; grid-column-gap: 2rem; grid-row-gap: 2rem; grid-template-columns: 1fr 1fr; }
.grid3 { display: grid; grid-column-gap: 2rem; grid-row-gap: 2rem; grid-template-columns: 1fr 1fr 1fr; }
.grid4 { display: grid; grid-column-gap: 2rem; grid-row-gap: 2rem; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); }


ul.grid4 { list-style: none; margin: 0; }

.month { border-top: 1px solid #CCC; margin: 0 0 2rem 0; }
.day { display: grid; grid-column-gap: 0; grid-row-gap: 0; grid-template-columns: 240px 1fr 200px; padding: 1rem 0; border-bottom: 1px solid #CCC; }
.day p { line-height: 2; margin: 0; }
.date {}
.title { font-weight: bold; }
.book a { display: inline-block; font-weight: bold; color: #FFF; line-height: 2rem; text-decoration: none; padding: 0 2em; background: green; border-radius: 4px; }


.grid3-item:hover .grid-line { width: 120px; border-bottom: 2px solid #CCC; }
.grid-page { display: grid; grid-column-gap: 3rem; grid-row-gap: 3rem; grid-template-columns: 5fr 2fr; margin: 0 0 2rem 0; }
.grid-item-article { order: 2; }
.grid-item-aside { order: 3; }
.grid-news { display: grid; grid-column-gap: 1rem; grid-row-gap: 2rem; grid-template-columns: 3fr 6fr; }


.top-links { font-size: 0.9em; color: #FFF; list-style: none; line-height: 30px; text-align: right; margin: 0px; z-index: 999; }
.top-links li { display: inline-block; padding: 1rem 0 0 0.5rem; }
.top-links a { color: #FFF; }
.top-links-cart a { display: block; font-weight: bold; color: #FFF; text-decoration: none; padding: 0 1rem; background: #759ED1; }

.faux-logo-link { position: absolute; top: 0; right: 200px; bottom: 0; left: 0; height: 100px; z-index: 1; }
.logo { position: absolute; left: -999em; }

.strapline { display: none; }

.menu-toggle, .menu-checkbox { display: none; }
.menu { font-size: 0.9rem; font-weight: 700; text-align: right; list-style: none; line-height: 40px; padding: 0; margin: 0; }
.menu li { display: inline-block; margin: 0; }
.menu li a { display: block; color: #000000; text-decoration: none; text-transform: uppercase; padding: 0 0.5rem; transition: 0.5s; border-bottom: 3px solid transparent; }
.menu li a:hover { color: #769ED1; text-decoration: none; border-bottom: 3px solid #769ED1; }

.crumbs { display: none; }

.subnav { list-style: none; margin: 0; }
.subnav li { }
.subnav li ul { list-style: none; margin: 0 0 1rem 0;}
.subnav li ul li { border-bottom: 1px solid #7FFFD4;}
.subnav a { display: block; text-decoration: none; }
.subnav li a { font-weight: bold; color: #FFFFCC; padding: 0.5rem 1rem; background: #546922; }
.subnav li ul li a { font-weight: normal; color: inherit; padding: 0.5rem 1rem; background: transparent; }

.subnav-icon { display: inline-block; float: right; padding: 0.25rem 0; transition: 0.5s; }
.subnav-hide { display: none; }
.subnav-label { font-weight: bold; color: #FFFFCC; padding: 0.5rem 1rem; background: #546922; margin: 0 0 2px 0; }
input.subnav-checkbox { position: absolute; left: -999em; }
input.subnav-checkbox:checked + .subnav-label + .subnav-hide { display: block; }
input.subnav-checkbox:checked + .subnav-label .subnav-icon { transform: rotate(270deg); }

.hero-text { max-width: 800px; text-align: center; padding: 1.5rem; background: rgba(66,67,87,0.5); margin: 0 auto; }
.hero-heading { color: #FFF; text-transform: uppercase; line-height: 1.2; margin: 0; }
.hero-summary { color: #EEE; margin: 1rem 0 0 0; }
.hero-cta { font-size: 1rem; font-weight: bold; margin: 1rem 0 0 0; }
.hero-text a { color: #FFFFCC; }

.header-heading { text-transform: uppercase; margin: 0; }
.header-summary { margin: 1em 0 0 0; }
.header-narrow { text-align: center; }
.header-thin { text-align: center; }
.header-cta { margin: 1rem 0 0 0; }

.section-heading { font-size: 1.7em; text-transform: uppercase; text-align: center; }
.section-cta { text-align: center; margin: 1.5em 0 0 0; clear: both; }

.article-links { list-style: none; margin: 0; }


.entries { background: rgba(118,158,209,0.1); border-top: 5px solid #EB5A38; border-bottom: 10px dashed #FFFFFF; }  
.entries-thumb { max-height: 280px; overflow: hidden; }
.entries-thumb img { display: block; width: 100%; }
.entries-description { padding: 1rem 1rem 1rem 1rem; }
.entries-description-alt { padding: 1.5rem 1.5rem 1.5rem 1.5rem; }
.entries-heading { font-size: 1.2rem; line-height: 1.2; margin: 0; }
.entries-heading a { text-decoration: none; }
.entries-summary { margin: 0.5rem 0 0 0; }
.entries-cta { font-weight: bold; margin: 0.5rem 0 0 0; }

.entries.tickets { border: 5px dashed #FFFFFF; }

.entry-intro { font-size: 1.2em; }
.article-parent { font-weight: bold; padding: 1em 0; border-top: 1px solid #000; margin-top: 2rem; }
.article-gallery { width: 100%; list-style: none; margin: 0 0 1.5em 0; overflow: hidden; clear: both; }
.article-gallery li { float: left; width: 23%; padding: 1%; }
.article-gallery img { display: block; }

.tickets-heading { padding: 0.5rem 0; border-top: 1px solid #000; border-bottom: 1px solid #000; margin: 0; }
.tickets-list dt { margin: 1rem 0 0 0; }
.tickets-list dd { display: inline-block; margin: 0.5rem 0.5rem 0 0; }
.tickets-list a  { display: inline-block; font-size: 0.8rem; font-weight: bold; color: #FFF; line-height: 2rem; text-decoration: none; padding: 0 1em; background: #016241; border-radius: 4px; }
.type {}
.price { width: 80px; }
.qty { width: 60px; }

.ticket-table { width: 100%; }
.ticket-table td { vertical-align: middle; }

.rolling-stock-specs { font-size: 0.9rem; padding: 0; }
.rolling-stock-specs dt { display: inline-block; margin-right: 0.25rem; }
.rolling-stock-specs dt::after { content: ":  "; }
.rolling-stock-specs dd { display: inline-block; margin: 0 1rem 0 0; }

/* calendar table*/
.calendar-table { width: 100%; border: 0;}
.calendar-table caption {}
.calendar-table th { text-align: center; padding: 0.5em 0; border: 0; border-bottom: 1px solid #FFF; }
.calendar-table td { text-align: center; padding: 0; border: 1px solid #FFF; }
.calendar-table td.expanded { padding: 0.5em 0; border: 0; }
.calendar-table a { display: block; color: #FFF; padding: 0.5em 0; }
.calendar-table span { display: block; padding: 0.5em 0; }
a.cal-events-link { color: #000; padding: 0; }

/* PAGINATION */
.pagination { font-size: 1em; font-weight: bold;  list-style: none; margin: 0 0 1.5em 0; }
.pagination li { display: inline-block; }
.pagination li.current { font-weight: bold; }
.pagination a { display: block; width: 38px; height: 38px; line-height: 38px; text-align: center; color: #FFF; text-decoration: none; background: #AAA; border: 0; }
.pagination a:hover, .pagination a.current { background: #777; }

.links-list { list-style: none; margin: 0 0 1.5em 0; }
.links-list li { margin-bottom: 1em; }

.newsletter-form { max-width: 640px; text-align: center; margin: 0 auto; }
.nl-fields { display: grid; grid-column-gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); }

.footer-links { list-style: none; text-align: center; margin: 0 0 1rem 0; }
.footer-links li { display: inline-block; margin: 0 0.25rem; }
.footer-links a { position: relative; text-decoration: none; transition: 1s; }
.footer-links a:hover { text-decoration: none; top: 1px; }
.footer-links a.facebook { color: #3B579D; }
.footer-links a.twitter { color: #00ACED; }
.footer-links a.flickr { color: #0062DD; }
.footer-links a.youtube { color: #FE021C; }
.subarticle-links { font-weight: 500; margin: 0; }
.subarticle-links li { margin: 0.25rem; }
.subarticle-links a::before { content: "\2023  "; }
.social-links { font-weight: bold; }

.footer-address { font-size: 0.8em; text-align: center; margin: 0 0 1rem 0; }
.footer-logos { list-style: none; text-align: center; margin: 0 0 1rem 0; }
.footer-logos li { display: inline-block; }
.footer-logos div#CDSWIDEXC, .footer-logos div#TA_certificateOfExcellence694, .footer-logos div#CDSWIDCOE { margin: 0; } /* fix nasty TA */
.legal { font-size: 0.8rem; text-align: center; margin: 0 0 1em 0; clear: both; }


.icon-s { width: 24px; height: 24px; }
.icon-m { width: 36px; height: 36px; }
.icon-left { position: absolute; left: 0; fill: #CCC;  }

/* QUOTES */
.quote { padding: 0; margin: 0 0 1.5em 0; border: 0; }
.quote-text {font-family: Georgia, serif; font-size: 1em; font-style: italic; color: #757575; padding: 1.5em; background: #EEE; border-radius: 10px; margin: 0; }
.quote-text::before { content: '“';} 
.quote-text::after { content: '	”'; }
.quote-author { display: block; font-size: 0.8em; font-style: normal; line-height: 1.5; padding: 0 1em 0 10%; }
.quote-author-name { display: inline-block; }
.quote-author-company { display: inline-block; }
.quote-arrow-down { width: 0; height: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-top: 15px solid #EEE; margin: 0 0 0.5em 10%; }

/* BUTTONS */
.btn { display: inline-block; font-weight: 700; color: #FFF; text-align: center; text-decoration: none; text-transform: none; transition: 0.5s; cursor: pointer; border-radius: 60px; background: transparent; transform: 0.5s; }
.btn:after { content: " \2192"; }
.btn:hover:after { position: relative; content: " \2192"; right: -5px; }
.btn-pri { color: #FFFFFF; background: #EB5A38; background: #663300; color: #FFE1AD; background: #17345b; } 
.btn-pri:hover { color: #FFFFCC; text-decoration: none; background: #EB5A38; background: #c00d13; } 
.btn-sec { color: #136B6C; border: 2px solid #136B6C; }
.btn-sec:hover { color: #4c516d; text-decoration: none; border: 2px solid #4c516d; }
.btn-ghost { color: #FFF; border: 2px solid #FFF;}
.btn-ghost:hover { color: #FFF; text-decoration: none; border: 2px solid #FFF; }
.btn-l { font-size: 1em; padding: 0.75rem 2em; }
.btn-m { font-size: 0.9em; padding: 0.75rem 2rem; }
.btn-s { font-size: 0.8em; padding: 0.5rem 1.5rem; }
.btn-block { display: block; text-align: center;}

/* MISC */
.video { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; margin: 0 0 1.5em 0; }
.video iframe, .video object, .video embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%;  }
.map iframe { width: 100%; margin: 0 0 1.5em 0; }
.offscreen { position: absolute; left: -999em; }

/* MESSAGES ERRORS ETC */
.message { font-size: 0.9em; font-weight: bold; padding: 1em; }
.message-normal { color: inherit; border: 1px solid #CCC; }
.message-warning { color: #FF6600; border: 2px solid #FF9900; }
.message-error { color: #FF0000; background: #FFFF33; border:1px solid #FF0000; }
.error-text { display: block; font-weight: bold; color: red; }

/* FORMS */
form { max-width: 100%; }
form p { margin: 0 0 1rem 0; }
form ul { list-style: none; margin: 0 0 1rem 0; }
form li { margin: 0 0 0.25em 0; }
fieldset { margin: 0 0 2em 0; }
legend { font-size: 1.4em; font-style: normal; font-weight: 700; margin: 0 0 1rem 0;}		
label { display: block; }
input, textarea, select { font-size: 16px; padding: 0; border: 0; box-sizing: border-box; }

input[type='text'],input[type='tel'],input[type='email'],input[type='password'] { width: 100%; height: 42px; text-indent: 9px; border: 1px solid #AAA; }
input[type='number'] { width: 60px; height: 34px; text-align: center; border: 1px solid #AAA; }
input.input-m { width: 140px; }

select { width: 100%; height: 42px; border: 1px solid #AAA; }
textarea { width: 100%; height: 160px; padding: 9px; border: 1px solid #AAA; }
button { width: 100%; height: 42px; font-size: 16px; font-weight: normal; color: #FFFFFF; text-transform: uppercase; padding: 0; background: #663300; border: 0; }
button.button-s { width: 140px; }
.form-checkbox { display: none; }
.btn.form-toggle { margin: 0 0 1.5em 0;  }
input.form-checkbox:checked + .form-toggle + .form-extra { display:block; }
.form-extra { display: none; }


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

.row-top { width: 100%; height: 40px; background: #C9461A; background: #17345B; }
.faux-logo-link { display: none; }
.strapline { display: block; font-family: Helvetica, "Helvetica Neue", Montserrat, Raleway, sans-serif; font-size: 11px; font-weight: bold; color: #FFF; color: #FFE1AD; padding: 0.25rem 1rem; background: #759ED1; background: #C9461A; }

.logo { position: relative; left: 0; float: left; font-family: Helvetica, "Helvetica Neue", Montserrat, Raleway, sans-serif; font-weight: 700; font-size: 16px; line-height: 40px; }
.logo a { color: #E6DBA3; text-transform: uppercase; text-decoration: none; }
.top-links { position: absolute; top: 5px; right: 5px; font-size: 0.8em; color: #FFF; list-style: none; line-height: 30px; text-align: center; margin: 0; clear: both; }
.top-links li { display: block; padding: 0; }
.top-links a { color: #FFF; }
.top-links-cart a { display: block; font-weight: bold; color: #FFF; text-decoration: none; padding: 0 0.5rem; background: #759ED1; }
}

@media screen and (max-width: 768px) {
body { font-size: 13px; }
h1 { font-size: 1.8rem; }
h2 { font-size: 1.4rem; }
h3 { font-size: 1.2rem; }
h4,h5,h6 { font-size: 1.0rem; }


.menu-toggle { display: block; width: 100%; height: 40px; font-size: 1.0rem; font-weight: 700; color: #000; line-height: 40px; text-decoration: none; text-transform: uppercase; text-align: right; cursor: pointer; }
.menu-toggle span::after { content: "[+]"; }
@keyframes m1 { 0% {right: -400px; } 100% {right: 0px; } }
input.menu-checkbox:checked + .menu-toggle + .menu { display:block; animation-name: m1; animation-duration: 0.25s; }
input.menu-checkbox:checked + .menu-toggle span::after { content: "[x]"; ; }

	.menu { display: none; }
	.menu { width: auto; font-size: 0.8rem; line-height: 36px; text-align: left; padding: 1rem 0; clear: both; overflow: hidden; }
	.menu li { display: inline-block; margin: 0 0.25rem 0.5rem 0; }
	.menu li a { color: #FFF; padding: 0 1em; background: #C8461B; border: 0; border-radius: 60px; }
	.menu li a:hover { color: #FFF; background: #C8461B; border: 0; }

.grid2 { grid-template-columns: 1fr; }
.grid3, .newsletter-form { grid-template-columns: 1fr 1fr; }
.grid-page { grid-template-columns: 1fr; }
.grid-item-article { order: 2; }
.grid-item-aside { order: 3; }	
.day { grid-template-columns: 1fr; }	
}

@media screen and (max-width: 480px) {
.grid3, .newsletter-form { grid-template-columns: 1fr; }	
.hero-heading { font-size: 1.4rem; }
.entries-thumb { float: none; width: 100%; text-align: center; margin-right: 0; margin-bottom: 1em;  }	
.btn {display: block;}
}