/*Felbridge Bowling Club*/
body{position:relative;width:100%;margin:0;padding:0;color:#333;background:#fff fixed;text-decoration:none;padding:0;font:normal normal normal 100% "Muli",Arial,sans-serif}
#banner {background-size:cover; height:350px;width:100%;opacity:0.7;}
#canvas{height:auto;margin:0 auto;background-position:top center;overflow-x:visible;  }
#header{color:#766A62;margin:0 auto;padding:0;width:100%;max-width:1100px;height:auto;min-height:297px}
#header img{position:static;float:left;margin:2% 2% 0;height:auto;}
#header img.logo {width:auto;max-height:250px;min-height:150px;z-index:100;padding:1% 0 0 0}
#header>img,#header>a>img{height:auto!important;max-width:100%;}
/*#header>img.logor{position:relative;right:0;height:200px!important;width:auto!important;margin:0}*/
#header img.logor {
    width: auto;
    max-height: 250px;
    float: right;
    margin: 3% 0 0 0 ;
    z-index: 10;
}
#header p{font-family:serif;font-style: italic;font-weight:normal;position:relative;left:0;color:#fff;font-size:2.5em;text-align:left;padding:1% 0% 0 20px;text-shadow:0 0 3px #000, 0 0 3px #000}
#header p img{float:none}
#header p.title{font-style:normal;font-family:sans-serif;color:#fff;text-shadow:0 0 3px #000, 0 0 3px #000;font-weight:bold;margin:0;font-size:4vw;text-align:left;padding:4% 0% 0 20px;line-height:70px}
#header p.title a{text-decoration:none;color:#fff;background:transparent}
#header p.title a:hover{color:#fff;background:transparent}
#header p.title img{float:none;margin:0}

p.privacy {
   float: right;
   margin:0 20px;
}
#header p img {
	float: none;
}
#search{top:52px;right:20px}
#socialmedia{position:absolute;top:0;right:0;float:right;}
#socialmedia img{max-height:32px}
#menubar{position:relative;top:0;width:100%;padding:0;margin:0 ;color:#fff;background:#009645;font-size:14px;text-transform:none;clear:both}
#contel{position:absolute;top:-45px;right:20px}
a.contel,a.conmail{margin:2px;padding:2px;font-size:small;}
#contel img{position:relative;top:-2px;left:0;height:12px;width:12px}
#crumbs{position:relative;top:22px;left:0px;height:auto;font-weight:bold;font-size:.85em;margin-bottom:20px;padding:0px 0px 0px 2%}
#crumbs img{position:relative;float:right;margin:0;top:-5px}
#content{background:#fff;top:0px;max-width:1100px;min-width:120px;margin:0px auto;padding:0;clear:both;z-index:1;min-height:300px;}
#content p{line-height:145%}
table.rota {
  border: 1px solid #009645;
}
tr.rotao {
  color: #009645;
  background-color: #fff;
}
tr.rotae {
  color: #009645;
  background-color: #00964515;
}
tr.rotatoday {
  color: #009645;
  background-color: #00964540;
}
table.rota th {
  color: #fff;
  background-color: #009645;
}
#canvasf {
   background:linear-gradient(#797979,#585858);
}
.footer-flex-container{
   background-color:transparent;
}
#footer{background:linear-gradient(#797979,#585858);position:relative;bottom:0;height:auto;margin:0 auto;width:100%;padding:0;text-align:center;}
#footer p{color:#fff;font-size:.9em;text-align:center;padding:10px;}
#footer a{color:#fff;background:transparent}

.fl, div.caption.left, figure.left, img.left {
    float: left;
    margin: 0 10px 0 0;
    padding: 0;

}
.fr, div.caption.right, figure.right, img.right {
    float: right;
    margin: 0 0 0 10px;
    padding: 0;

}

#leftb{position:static !important; margin: 10px}
#leftb h4,#leftb p{width:220px;margin-left:auto;margin-right:auto;text-align:center;z-index:1}
#fright{float:right;width:auto;max-width:22%;margin:30px 0 30px 10px;z-index:1;padding:5px;color:inherit;background:#fff;border:1px solid #7a6492;border-radius:8px;box-shadow:2px 2px 2px #BAAEC8}
#fright p{line-height:normal}
#fright h2{padding:5px 0 3px 0px;font-family:sans-serif;font-weight:bold;font-size:2em;font-weight:bold;color:#7A6492;background:#fff;border-radius:5px}

#mainpic{top:20px;border: 1px solid #A3B4C8;border-radius:4px;margin-left:20px}

p{margin:0;padding:0 0 8px 0;font-size:97%;letter-spacing:0;text-align:left;}
.colour{color:#00338D;background:transparent}
.small{font-size:.85em}
.large{font-size:1.3em}
.warning{color:#900;background:transparent;font-size:0.85em;padding:3px 0;text-align:center}
blockquote{font-style:italic;font-size:.9em;margin:0 5%;padding:0 0 8px 0;text-align:center}
h1,h2,h3{text-align:left}
h4,h5,h6{text-align:center}
kbd{font:normal normal 100% verdana,arial,geneva,helvetica,sans-serif}

marquee{width:50%}
#marquee {
   position: relative;
   width: 100%;
   height: 1.4em
   overflow:hidden;
   font-size:130%;
   padding-bottom:5px;
   color:#000;
}

h1,h2,h3,h4,h5,h6{padding:0;font-style:normal;font-weight:normal;margin:0;text-decoration:none;vertical-align:middle}
h1{font-size:2.1em;padding:0;margin:30px 0 12px 0;color:#019342;background:transparent}
h2{color:#019342;font-size:1.5em;padding:10px 0 3px 0;background:transparent}
h3{color:#434545;font-size:1.5em;padding:5px 0 3px 0;background:transparent}
h4{color:#434545;font-size:1.5em;padding:5px 0 3px 0;background:transparent}
h5{font-size:1.2em;color:#900;background:transparent}
h6{font-size:0.95em;font-weight:normal;color:#434545;background:transparent;padding:5px 0 0 0}

a.button, input.button{
    background: #009645!important;
    border-width: 1px;
    border-color:#009645;
    border-style:groove;
    border-radius: 5px;
    display: inline-block;
    padding: 20px 40px;
    text-align: center;
    width: 200px;
    color:#fff!important;
}

a.button:hover:not([disabled]), input.button:hover:not([disabled]) {
  background: #FFE700!important;
    border-width: 1px;
    border-color:#FFE700;
    border-style:groove;
    border-radius: 5px;
  color: #333!important;
  text-decoration: none;
  cursor: pointer;
}

input.form,textarea.form,select.form{border:1px solid #096;color:#00338D;background:transparent}
div.form{position:relative;left:0;color:#434545;background:#FFF;font-weight:normal;text-align:left;border:1px solid #096;margin:10px auto 0 auto;max-width:500px;padding:10px;width:70%}
a{text-decoration:none}
a:link{color: #019342;  background:transparent;}
a:visited{color:#019342;background:transparent;}
a:hover{color: #019342;background:transparent;text-decoration:underline;}
a:active{color: #019342;background:transparent;}
hr{color:#A3B4C8;height:1px;margin:0;padding:0;width:100%;background:transparent;border-radius:5px}
ul{list-style:none;line-height:130%}
ol,ul{letter-spacing:0;text-align:left;margin:0 10px 5px 30px;padding:0}
ol>li{font-size:1.1em;margin:0;padding:2px;line-height:130%}
ul>li{font-size:1.1em;background:url(/images/bullet.gif) no-repeat top 3px left;margin:0;padding:2px 0 20px 20px;line-height:130%}
ul>li a{padding-left:12px}
dl,dt,dd{color:#669;background:transparent;font-weight:normal;letter-spacing:0;margin:0;padding:5px 10px 0 10px;text-decoration:none}
dt{list-style:url(/images/bullet.gif)}
dd{padding:5px 20px 0 20px}
strong,b{font-weight:bold}
.centre{text-align:center}

/*NAVIGATION - HORIZONTAL*/
#menu{width:100%;max-width:1100px;margin:0 ;padding:10px 0 10px 10px;overflow:auto;text-align:left;}
#nav li{display:inline-block;max-width:200px;background:none;font-size:17px;padding-right:2px;text-align:left}
#nav, #nav ul{max-width:1100px;list-style:none;margin:0 0 0 0px;text-align:left;padding:0;line-height:130%;background-color:transparent}
#nav a{display:block;width:auto;color:#F7B512;background:transparent;text-decoration:none}
#nav li a{color:#fff;background:transparent;text-decoration:none;padding:5px 2px;white-space:normal;}
#nav li a:hover{color:white;background:#transparent;text-decoration:underline;}
#nav li a span{position:absolute;margin:0 ;visibility:hidden;text-align:left;font-weight:normal;text-transform:none;font-size:12px;line-height:110%;padding:0;color:#333;background:transparent;}
#nav li a:hover span{visibility:visible;display:block;height:auto;z-index:120;font-weight:normal;top:-20px;width:100%;margin:0 auto;float:none;}

#menu{width:100%;max-width:1100px;margin:0 auto;padding:10px 0 10px 10px;overflow:auto;}
#nav li{display:inline-block;max-width:200px;background:none;font-size:16px;padding-right:10px;text-align:center}
#nav, #nav ul{max-width:1100px;list-style:none;margin:0 0 0 58px;text-align:center;padding:0;line-height:130%;background-color:transparent}
#nav a{display:block;width:auto;color:#fff;background:transparent;text-decoration:none}
#nav li a{color:#fff;background:transparent;text-decoration:none;padding:7px 1em;white-space:normal;text-align:left}
#nav li a:hover{color:#fff;}
#nav li a span{position:absolute;top:-20px;margin:0 ;visibility:hidden;text-align:left;font-weight:normal;text-transform:none;font-size:12px;line-height:110%;padding:0;color:#fff;background:transparent;}
#nav li a:hover span{visibility:visible;display:block;height:auto;z-index:120;font-weight:normal}

/*NAVIGATION - DROPDOWN (JavaScript required dropdown.js)*/
#menu ul li ul {
	position:absolute;
	left:-999em;
	height:auto;
	width:14em;
	font-weight:normal;
	margin:0;
	padding:0;
	background-color:transparent;
	font-size:100%;
	z-index:220;
}
#nav li{float:left;padding:0;line-height:110%}
#nav li li a{color:#fff;}
#nav li li{min-width:14em!important;line-height:110%;background:#009645;}
#nav ul li a span{position:absolute;top:0px;left:0;text-align:left;text-transform:none;font-size:12px;line-height:110%;color:#fff;background:transparent;}
#nav ul li a:hover span{height:auto;font-weight:normal;z-index:20;white-space:nowrap;text-decoration:none;top:-63px;}
#nav li ul ul { /* third-and-above-level lists */	width:15em;margin:-2em 0 0 15em}
#nav li:hover ul ul{left: -999em}
#nav li:hover ul, #nav li li:hover ul{left: auto}
#nav li li{font-size:16px}
#nav li li li{width:15em}
#nav ul ul li a:hover span{display:block;position:relative;top:0;left:10px;height:auto;width:auto;text-align:left;color:#766A62;background:transparent;font-size:smaller;font-weight:normal;white-space:normal;text-decoration:none;z-index:20}




/*07-10-2015*/
#nav li.hassub>a::after{content:' + '}

#nav #li-logoff{float:right}
#nav #li-logoff a:hover{background:transparent}
#nav #li-logoff a:visited{background:transparent}
#nav #li-members{float:right}
#nav #li-members li{float:none}
#nav #li-members a span{right:100px}
#nav #li-members a:hover span{text-align:right}
/*#nav #li-members:hover ul, #nav #li-members li:hover ul{right:0px}*/
#nav #li-tutorial1{float:right}
#nav #li-tutorial1 li{float:none}
#nav #li-tutorial1 a span{right:100px;top:-20px}
#nav #li-tutorial1 a:hover span{text-align:right}
#nav #li-tutorial1 li a span{top:-90px;right:0}

p.event,p.eventl{text-align:left;padding:2px 0 2px 5px}
p.eventr{text-align:right;padding:2px 5px 2px 0}
table.events{width:100%;font-size:1em;border-left:1px solid #9782AE;border-right:1px solid #9782AE;border-top:none;border-bottom:none}
.event1,.event2,.event3,.event4,.eventfoot{color:#777;background:#e7e2ed;border-top:1px solid;border-bottom:1px solid;border-color:#9782AE;padding:0 0 0 5px}
.event1 h3,.event2 h3,.event3 h3,.event4 h3,.eventfoot h3{font-size:1.1em}
.event1{width:15%}
.event2{width:35%}
.event3{width:25%}
.event4{width:25%}
.eventfoot{border-top:1px solid;border-bottom:1px solid}
#fright #events{height:250px;background:#FFF;border:1px solid #AAA;border-radius:8px}
#fright td.ev1 p{color: #00338D;background:transparent}
#fright td.ev2 p{color:#00338D;background:transparent;padding-bottom:4px}
#fright tr.comc td.ev1 p{color:#858585;font-style:italic;font-size:1em;background-color:transparent}
#fright tr.comc td.ev2 p{color:#858585;font-style:italic;font-size:1em;background-color:transparent}

table.ticklist th{
   color:#009645;
   text-align:center;
}

.spelling{border:1px solid #F00}
/*Slide Show*/
#mainpicouter{max-width:888px;height:auto !important;padding-bottom:20px}
#mainpic{position:relative;top:20px;left:0;overflow:hidden;clear:both;}
#mainpicinner{height:100%;width:100%;min-width:120px;overflow:hidden;visibility:hidden;}
#mainpicinner img{position:absolute;top:0}
#slidecaption{position:absolute;bottom:0;left:0;height:auto;width:100%;max-width:100%;color:#000;background-color:#CCC;opacity:.6;margin:0;padding:0;z-index:200}
#slidecaption h2{color:#000;background:#CCC;opacity:.6;padding:0 5px 5px}

@media only screen and (max-width:768px) and (max-aspect-ratio: 13/9){
 #header p{height:auto;max-width:86%;padding:1% 1% 0 12.5% !important}
 #header p.title{height:auto;max-width:86%;padding:1% 1% 0 1% !important}
 #header p.title a {
  text-decoration: none;
  color: #7a6492;
  background: transparent;
 } 
 #menumob img{
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(82deg) brightness(101%) contrast(102%);
 }
 #header p.title img{position:absolute;top:1%;right:1%}
 #header img.logo {width:auto;max-height:250px;min-height:80px;z-index:100;padding:1% 0 0 0}
 #header img.logor{max-height:72px !important}
 #header>img,#header>a>img{max-height:72px!important;max-width:100%;margin-left:0;}
 #header p{font-family:serif;font-style: italic;font-weight:normal;position:relative;left:0!important;color:#797979;text-shadow:none!important;font-size:4vw!important;text-align:center;padding:1.5% 0% 0 0%!important;}
 #header p.title{letter-spacing:0.5vw;font-style:normal;font-family:sans-serif;color:#585858;text-shadow:none!important;font-weight:bold;margin:0;font-size:5.55vw!important;text-align:center;padding:10% 0% 0 0;line-height:110%}
 p{color:#5A5A5A;margin:0;padding:0 0 8px 0;font-size:95%;letter-spacing:0;text-align:left;}
 #banner {
  display: block !important;
  visibility: visible !important;
  opacity: 0.2;
 }
 xh1{font-size:6vw !important;margin:0;padding:30px 0 0px 0;color:#434545;background:transparent}
 xh2{color:#434545;font-size:5vw !important;padding:10px 0 3px 0;background:transparent} 
 
}

@media print{
 table.vth{border-collapse:collapse !important}
 table.vth{position:relative;right:0 !important;width:100% !important}
 #header{top:0;height:15mm;background:none}
 #header>img,#header>a>img{width:auto}
 #header p{top:13mm;left:18.5mm;font-size:12pt;padding:0}
 #header p.title{top:7.5mm;left:18.5mm;font-size:12pt;padding:0}

 #content{top:0;width:100%;margin-left:0 !important;margin-right:0 !important;padding:0}
}
