/* Default Link Styles */
/*a {color: #008CBA;}*/
/* #0078a0 active menu button hover - dark blue/green*/
/*border: thin solid aqua; drab #8B856D*/

body {background-color: #345A81; font-size: 1em;}

a:hover, a:focus {color: #3ea22e; }
  
[data-magellan-expedition], [data-magellan-expedition-clone] {background: transparent; padding: 0;}/*removes padding off top bar and colour either side*/
.top-bar-section li.active:not(.has-form) a:not(.button) {background: #c85a3c;  }/*down state*/
.top-bar a:hover {background: #c85a3c !important;} /*hover bg of menu buttons and dropdown*/

#menu li a:hover {color: white; background-color: #c85a3c;}

.panel h3 {color: #A22E3E; }
.panel h4 {color: #B46437; }
.panel .heading { margin-top: 10px; clear:both;}

.colour {background-color: #FFD47F;}/*FFCC66*/
.callin {float: left; width: auto; margin: 0px 10px 0px 0px;}
.callout {float: right; width: auto; margin: 0px 10px 20px 10px; max-width: 99%;}
/*.callout img {float: right; }*/
.callout .rightcaption {float: right; margin: 5px 0px 10px 0px; color: #403520; font-size: 90%; }
.columns .columns {margin: 0px -1em 0px -1em;}/*removes extra padding if col within col*/

p.warn {color: #f04124;  font-weight: bold;  }
.warn {color: #f04124;  font-weight: bold;  }

/*---------- light box -----------*/
.clearing-caption {font-size: 1em;  color: white!important; }
#sidepic li { max-width: 100%;}
.clearing-feature li.clearing-featured-img {max-width: 100%!important; }
.clearing-main-prev > span {border-right-color: white; }/*left-right arrows*/
.clearing-main-next > span {border-left-color: white; }

/* ------ calendar styles ------- */
#calendar { padding: 0px 0px 10px 0px; overflow: auto;  margin-bottom: 10px; }
#key { /margin-top: 90px; font-weight: bold; border: thin solid #f2f2f2;}
#key td { padding: 0px 15px 0px 5px;  margin: 10px 0 10 0; }
#key table { background-color: #f2f2f2; border-color: #f2f2f2;  padding-top: 10px; }
.rates { margin-left: 1em; }
.rates th { background: #345A81; color : white; font-weight: bold; padding: 10px 25px 10px 25px; }
.table1 { /*border: medium solid aqua;*/ padding-left: 30px; }
.table2 { /*border: medium solid fuchsia;*/ padding: 0px; margin-left: -10px;}

#calendar th {color : white; font-weight: bold; background: #345A81; text-align: center; 
}
.montable { margin: 4px 1px 1px 1px; font-size:80%; background-color: #d3dfeb;
 }
#cal { margin: 0px 10px 0px 10px; width: 610px; height: 240px; overflow: auto;}
.day {/*colour of day names*/ padding: 4px 4px 5px 3px; background: #d3dfeb; font-weight: bold; text-align: center;}
.booked {background-color: white; border: 1px solid #cccccc; padding: 2px 8px 2px 8px; text-align: center; }
.free { background-color: #d3dfeb; padding: 3px 9px 3px 9px; }
.band_a {background-color: #efd918; padding: 3px 9px 3px 9px; color : #444444; font-weight: normal;  text-align: center;}
.band_b {background-color: #3ea22e; padding: 3px 9px 3px 9px; color : white; font-weight: normal;  text-align: center;}
.band_c {background-color: #c85a3c;/*fd7e0b*/ padding: 3px 9px 3px 9px; color : white; font-weight: normal;  text-align: center;}
.band_d {background-color: #0a79ae; color: white; padding: 3px 9px 3px 9px; font-weight: normal;  text-align: center;}
.band_e {background-color: #A22E3E; color: white; padding: 3px 9px 3px 9px; font-weight: normal;  text-align: center;}

/*-------------------- booking--------------*/
#leftgroup {padding: 1px 0px 1px 1em;}
#rightgroup {float: left; }
#rightgroup select {margin-left: 0em;}
#year {float: left; padding-left: 1px;}
#weekbox {float: left;}
#bookbut, #bookbut a {float: right;}
#booktable3 {width: 90%; clear:both; display: block; }
label {color: #345A81; font-size: 1rem; }
#booklinks {margin-bottom: 15px;  }
/* #booklinks .downlink {color : #0a79ae;   }*/
.wrong {padding:1em; background-color: #a22e3e; color: white; margin: 10px; font-weight: bold;}
.wrong a {color: white; text-decoration: underline;}
.wrong p {color: white;}
ul.cancel li { margin-bottom: 1em;  list-style: none; }

/*-------------------- maps ----------------*/
#mainmap{ width: 100%;}
#tinymap{ width: 50%;}
.map p {font-size: 90%; /*color: #0a79ae;*/}

/*-------------------- activities ----------*/
ul.links li { margin-bottom: 1em;
}

/*-------------------- tables ----------*/
td.one { width: 15%; }
th.one { width: 15%; }
td.two { width: 20%; }
th.two { width: 20%; }
td.three { width: 25%; }
th.three { width: 25%; }


/* Footer */

footer {padding: 50px 10px 50px 10px;background: #8B856D url(../img/stone.jpg) no-repeat 0% 0%;color: white;}
footer a:link {color:#F0F15D; background-color: #aeaca2;padding: 0px 5px 0px 5px; }/* ocre FFD06B, pale ocre FFE865, AAA89C */
footer a:visited {color: #F0F15D;}
footer a:hover {color: #c85a3c; background-color: #F0F15D;padding: 0px 5px 0px 5px;}
#brownbull {font-size: 85%; clear: right; display: block; padding-top: 13px;}
#brownbull a:link { color: #0a79ae; }
#brownbull a:hover {color: #c85a3c; background-color: #aeaca2;}

/* ------ admin area ------- */
#admin .columns .columns {margin: 0px -1em 0px 0em;}/*removes extra padding if col within col*/
#admin table td {font-size: 110%; }
#admin .topbar {margin-top:-2em 
}
#admin h5 {color : #A22E3E; margin-top:2em;
}
#admin table {margin-bottom: 2.25rem; }
#admin table td {margin-right:5px }

#admin .light {color: #c85a3c;}
#admin .warn {font-weight: bold;color: red;}
#admin .smallwarn {font-weight: bold;color: red; font-size: 85%;}

#datedrop {width: 99%;}
#datedrop table {width: 100%;}


/* --------------------------  media queries  --------------------------- */
/*breakpoints
Small screens 
max-width: 40em max-width 640px, mobile-only styles, use when QAing mobile issues - mobile menu
Medium screens
min-width: 40.063em min-width 641px
min-width: 40.063em and max-width: 64em - min-width 641px and max-width 1024px, use when QAing tablet-only issues
Large screens
min-width: 64.063em - min-width 1025px
min-width: 64.063em and max-width: 90em - min-width 1025px and max-width 1440px
XLarge screens
min-width: 90.063em - min-width 1441px
min-width: 90.063em and max-width: 120em - min-width 1441px and max-width 1920px
XXLarge screens
min-width: 120.063em - min-width 1921px
*/

@media only screen and (min-width: 641px) {
/*.clearing-featured-img { max-width: 95%; }*/
.panel.radius {border-radius: 10px; }
.panel.radius2 {border-radius: 0 0 10px 10px; }
img.callin {max-width: 50%;}
.callout {float: right; max-width: 50%; margin: 10px 10px 10px 20px;}
.panel .heading { margin-top: 40px;}
#rightgroup {float: right;}
#booktable3 {width: 45%;}
.wrong {border-radius: 5px;}
#key { margin-top: 0px;}
#brownbull {padding-top: 7px;}
}
@media only screen and (min-width: 1024px) {
#key { margin-left: 2em;}
.rates { margin-left: 2em; }
#brownbull {padding-top: 25px;}
}