@font-face {
font-family: 'fingerpaint';
src: url('/fonts/Fingerpaint/fingerpaint-regular.eot');
src: url('/fonts/Fingerpaint/fingerpaint-regular.eot?#iefix') format('embedded-opentype'),
url('/fonts/Fingerpaint/fingerpaint-regular.woff') format('woff'),
url('/fonts/Fingerpaint/fingerpaint-regular.ttf') format('truetype'),
url('/fonts/Fingerpaint/fingerpaint-regular.svg#fingerpaint-regular') format('svg');
font-weight: normal;
font-style: normal;
}

@font-face {
    font-family: 'PlaytimeWithHotToddiesRegular';
    src: url('/fonts/Playtime/playtime-webfont.eot');
    src: url('/fonts/Playtime/playtime-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/Playtime/playtime-webfont.woff') format('woff'),
         url('/fonts/Playtime/playtime-webfont.ttf') format('truetype'),
         url('/fonts/Playtime/playtime-webfont.svg#PlaytimeWithHotToddiesRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
		font-family: 'Comic Sans';
		src: url('/themes/fonts/ComicSans/comic.eot');
		src: url('/themes/fonts/ComicSans/comic.eot?#iefix') format('embedded-opentype'),
				 url('/themes/fonts/ComicSans/comic.woff') format('woff'),
				 url('/themes/fonts/ComicSans/comic.ttf') format('truetype'),
				 url('/themes/fonts/ComicSans/comic.svg#comic') format('svg');
		font-weight: normal;
		font-style: normal;
}



html, body {
	height:100%;
	background: url(/img/bespoke/albrighton/bg2.jpg) repeat;
/*	background-position: 223px;
	background-size: 100% 262px;*/
}

#topbar{
        background: url(/img/bespoke/albrighton/topbar.jpg) no-repeat center top;
		height:140px;
		width:100%;
		min-width: 1175px;
		box-shadow:0px 5px 5px gray;
		position:relative;
		z-index:10;
}

#wrapper {
	width:100%;
	margin:0 auto;
	min-height:100%;
	min-width: 1200px;
	background: url(/img/bespoke/albrighton/bgtop.png) no-repeat center top;
	z-index: 1;
}
#wrapperinner{
min-width: 1175px;
margin:0 auto;
}


#wrapper-footer {
        
        background: url(/img/bespoke/albrighton/footer.png) no-repeat center bottom;
}


#header {
	width: 810px;
	padding: 0;
	height: 360px;
	position: relative;
	margin:0 auto;
	background: url(/img/bespoke/albrighton/header.png) no-repeat top center;
	margin-bottom: 65px;
}


.fadein-home { 
	position:relative; 
	margin:0 auto; 
	padding-left: 10px;
} 
.fadein-home img { 
	position:absolute; 
	width: 100%;
} 
                                                        

/*  Nav
    ===  */
#qlinks {
	float: left;
	width: 185px;
	min-height:435px;
	background: none;
	padding: 0px;
	position:relative;
	/*background: url(/img/albrighton/qlinks.png) no-repeat;*/
	padding-top: 20px;
	margin-right: 20px;
}

#qlinks2 {
	float: right;
	width: 200px;
	min-height:435px;
	background: none;
	padding: 0px;
	position:relative;
	/*background: url(/img/albrighton/qlinks.png) no-repeat;*/
	padding-top: 20px;
	margin-left: 20px;
}

#qlinks:before , #qlinks2:before{
	background: url(/img/bespoke/albrighton/menu-before.png) no-repeat;
	content: '';
	height: 56px;
	width:57px;
	display: block;
	position: absolute;
	z-index: -1;
	left: 50%;
	margin-left: -22px;
	top:3px;
}
#qlinks ul:first-child:after , #qlinks2 ul:first-child:after{
	background: url(/img/bespoke/albrighton/menu_after.png) no-repeat;
	content:'';
	height: 236px;
	width: 225px;
	display: block;
	position: absolute;
	margin-top: -25px;
	z-index: -1;
	left: 50%;
	margin-left: -116px;

}
/*#qlinks ul:first-child > li:after, #qlinks2 ul:first-child > li:after{
	background: url(/img/bespoke/albrighton/menu_middle2.png) no-repeat;
	content: '';
	height: 45px;
	width: 62px;
	display: block;
	position: absolute;
	left: 50%;
	z-index: -1;
	margin-left: -15px;
	margin-top: -9px;
}*/
#qlinks ul:first-child > li:after, #qlinks2 ul:first-child > li:after{
	background: url(/img/bespoke/albrighton/menu_middle2.png) no-repeat;
	content: '';
	height: 45px;
	width: 62px;
	display: block;
	position: absolute;
	left: 50%;
	z-index: -1;
	margin-left: -15px;
	margin-top: -9px;
}
#qlinks ul li.last:after, #qlinks2 ul li.last:after{
	background: none !important;
}

#qlinks ul, #qlinks ol,#qlinks2 ul, #qlinks2 ol{
	margin:0 auto;
}

#qlinks ul li, #qlinks2 ul li  {
	list-style: none;
	width:184px;
	min-height:50px;
	z-index: 555;
	text-align: center;
/*	line-height: 53px;
	margin-bottom: 15px;*/
	/*background: url(/img/bespoke/albrighton/menu1.png) no-repeat;*/
	/*background-size: 100% 100% !important;*/
	/*background-repeat: no-repeat !important;*/
	padding-right: 10px;
}

#qlinks ul li ul{
	display: none;
	visibility: hidden;
	position: absolute;
	left: 95%;
	z-index: 555;
	width: 200px;
	height: auto;
	background-image: none;
	background-color: #6a3e24;
	box-shadow:  0px 0px 5px black; 
	margin-top: -30px;
	border-radius:5px;
    padding:0px;
}
#qlinks > ul > li > ul, #qlinks2 > ul > li > ul{
	margin-top: -40px;
}

#qlinks2 ul li.parent ul{
	display: none;
	visibility: hidden;
	position: absolute;
	right: 90%;
	z-index: 555;
	width: 200px;
	height: auto;
	background-image: none;
	background-color: #6a3e24;
	box-shadow:  0px 0px 5px black; 
	margin-top: -30px;
	border-radius:5px;
    padding:0px;
}

#qlinks ul li.parent ul li, #qlinks2 ul li.parent ul li{
	background: none;
	border-bottom: 1px dotted #8a5739;
	margin-bottom: 0px;
	height: auto;
	min-height: 26px;
	line-height: 30px;
}
#qlinks ul li.parent ul li:hover,
#qlinks2 ul li.parent ul li:hover{
	background: #50250C;
	padding-right: 16px;
}

#qlinks ul li.parent ul ul {
	left: 95%;
	/*top: 45px;*/
}
#qlinks2 ul li.parent ul ul{
	right:95%;
}


#qlinks > ul > li > a:first-child,
#qlinks2 > ul > li > a:first-child{
	line-height: 17px;
	padding-top: 17px;
	padding-bottom: 15px;
}
#qlinks ul li a, #qlinks2 ul li a  {
	text-decoration: none;
	color:#fcf759;
	font-size: 16px;
	display: block;
	padding: 0 10px;
	position: relative;
	font-family:'fingerpaint';
	font-weight:normal;   
	/*width: 90%;              */
    text-shadow: 1px 1px 1px #3d3d3d,
                 1px -1px 1px #3d3d3d,
                 -1px 1px 1px #3d3d3d,
                 -1px -1px 1px #3d3d3d;
}
#qlinks ul:first-child > li > a, #qlinks2 ul:first-child > li > a{
	background: url(/img/bespoke/albrighton/menu1.png) no-repeat;
	background-size: 100% 100% !important;
}

#qlinks2 ul:first-child > li.last2:after,
#qlinks ul:first-child > li.last2:after{
	background: none !important;
}

#qlinks ul li a:hover, #qlinks2 ul li a:hover{
	color:#fff;
}

/*In case of use top nav bar*/
#nav {
	display: none;
/*    display: block;*/
    min-height: 116px;

position:relative;
z-index:6;

    width: 759px;
 overflow:hidden;
  padding:0px 10px;
  margin-left:250px;
  	background: url(/img/albrighton/nav.png) no-repeat;
}

	#nav ul {
		height:74px;
                width:750px;
                margin:0 auto 0;
                padding:25px 10px 0px;
       
	}

		#nav ul li {

			position: relative;
			float: left;
			height: 100%;
			line-height: 39px;
			display: block;
			padding-top:15px;
			color: #fff;
			font-size: 14px;
			text-shadow: 1px 1px 0 #eee;
			font-weight: bold;
		}

        #nav > ul > li {
            height: 46px;
        }
		#nav ul li:hover, #nav ul li.current-item{
		  	background: url(/img/albrighton/hover.png) no-repeat;
		  	background-size: 106% 100%;
		}
#nav ul li.extra.more:hover{
		  	background: url(/img/albrighton/hover.png) no-repeat;
		  	background-size:106% 80%;
		}
	

			#nav ul li a {
				text-decoration: none;
				color: inherit;
				*color: #fff;
				display: block;
				padding: 0 22px;
				position: relative;
				font-family:'fingerpaint';
				font-weight:normal;
                                
                                text-shadow: 1px 1px 1px #3d3d3d,
                                             1px -1px 1px #3d3d3d,
                                             -1px 1px 1px #3d3d3d,
                                             -1px -1px 1px #3d3d3d;

                   
                                
			}

				#nav ul.dropdown ul {
					position:absolute;
					width: 160px;
					display: none;
					height: auto;
					margin:0;
					z-index:99;
					background-image: none;
					background-color: #6a3e24;
					box-shadow:  0px 0px 5px black; 
					margin-top: -1px;
					border-radius:5px;
                    padding:0px;
                                     
				}

#nav > ul > li > ul{
				margin-left:-76px !important;
					left:50% !important;
}

					#nav ul.dropdown ul li {
						display: block;
						float: none;
						margin: 0;
						border-bottom: 1px dotted #8a5739;
						background-image: none;

					}
#nav ul ul li:hover {
background:#7e5238;

}

#nav ul ul li.last-item {
		border-radius:0px 0px 10px 10px;
}
#nav ul.dropdown ul ul {
	left: 100%;
	top: 0;
}

#nav ul.dropdown ul ul.left, #nav ul.dropdown ul ul.left ul {
	left: -100%;
}

#nav ul.dropdown li {
	display: inline-block;
	line-height:35px;
	position: relative;
    padding: 15px 15px 0;
}


#nav ul.dropdown li li {
	clear: both;
	display: block;
	line-height: 40px;
padding-top:0px;
	padding:0px !important;
}

#nav ul.dropdown li a {
	display:block;
	padding: 0 4px;

}

#nav ul.dropdown li li a {
font-size:13px;

	text-shadow:none;
	text-align:center;
	line-height:25px;

}

#nav ul.dropdown li a:hover {
        text-decoration:underline;
		color:#ffd800;
}

                                                                                                  
						
/*  Nav-mobile
    ===  */
#nav-mobile {
	position: relative;
	width: 100%;
	margin: 0 auto;
	height: 69px;
	z-index: 3;
	display:none;
	background: #23a7e2;
	border: solid 0px #fff;
}

#nav-mobile #nav-more{
        font-size: 18px;
        color: #fff;
        width:auto;
        height:50px;
        padding:0 20px;
        line-height:50px;
        text-align:left;
        font-family: 'fingerpaint',sans-serif;
        cursor:pointer;
        border-bottom: 0px solid;
        background: url(/img/bespoke/ssosmund/dropdown-white.png) no-repeat top right;
}

	#nav-mobile ul {
		margin: 0;
		list-style: none;
		height: auto;
		position: relative;
		z-index: 4;
                padding: 0px;
	}
        

		#nav-mobile ul li {
			position: relative;
			float: left;
			height: 100%;
			line-height: 58px;
			display: block;
			color: #fff;
			font-size: 15px;
			text-shadow: 1px 1px 0 #222;
			font-weight: bold;
			background: url(/img/bespoke/ssosmund/seperator.png) right top no-repeat;
			z-index: 4;
                        font-family: Georgia;
                        font-style: italic;
                        
		}

		#nav-mobile ul li:last-child {
			background: none;
		}

			#nav-mobile ul li a {
				text-decoration: none;
				color: inherit;
				*color: #0b1f41;
				display: block;
				padding: 0 22px;
				z-index: 4;
				position: relative;
				font-family: 'fingerpaint',sans-serif;
				font-style: normal;
			}
                        
                        #nav-mobile > ul > li.current-item > a {
                                background: url(/img/bespoke/ssosmund/menu-hover3.png) no-repeat center center;
                        }
                        
                        #nav-mobile > ul > li > a {
                                height: 60px;
                        }

				#nav-mobile ul.dropdown ul {
					position:absolute;
					width: 175px;
					display: none;
					height: auto;
					margin:0;
					background-image: none;
					background-color: #533EA6;
					border: 1px solid #B28939;
					margin-top: -1px;
                                        padding:0;
				}

                                #nav-mobile ul.dropdown li.extra.more ul {
                                        margin-left:-90px;
                                }
                                
					#nav-mobile ul.dropdown ul li {
						display: block;
						float: none;
						margin: 0;
						border: none;
						background-image: none;

					}


#nav-mobile ul.dropdown ul ul {
	left: 100%;
	top: 0;
}

#nav-mobile ul.dropdown ul ul.left, #nav-mobile ul.dropdown ul ul.left ul {
	left: -100%;
}

#nav-mobile ul.dropdown li {
	display: inline-block;
	line-height:56px;
	position: relative;
}

#nav-mobile ul.dropdown li.more {
	padding-right: 36px;
}

#nav-mobile ul.dropdown li.more span {
	display: block;
	padding-top: 46px;
	height: 0;
	width: 56px;
	position: absolute;
	right: 0;
	top: 0;
	overflow: hidden;
	cursor: pointer;
	background: url(/img/bespoke/ssosmund/dropdown-white.png) no-repeat 15px 0;
}

#nav-mobile ul.dropdown li li.more span {
	background-position: 15px -66px;
}

#nav-mobile ul.dropdown li li {
	clear: both;
	display: block;
	line-height: 40px;
}

#nav-mobile ul.dropdown li a {
	display:block;
	padding: 0 10px;

}

#nav-mobile ul.dropdown li li a {
	font-weight: normal;

}


/*  Content
    =======  */                                                                                        
#content-wrapper {
        margin:0 auto;
        min-height:300px;
		height:auto !important;
		padding: 0;
        /*width:1120px;*/
        width: 1185px;
        position:relative;
        z-index:5;

}


#content {
	color:#000;
	/* float: left; */
	max-width: 900px;
	background: none;
	padding: 10px;
	min-height:460px;
	background:#fff;
	position:relative;
	border:10px solid #bcdfff;
	width: 100%;
	margin: 0 auto;
}

#content h1, #content h2, #content h3, #content h4{
color:#0057B4;
font-family: 'fingerpaint',sans-serif;
font-weight: normal;
}

.element-map{
/*border:3px solid #0364cc;*/
}

.element-news a{
color:#0364cc;
font-weight:bold;
}

.element-news h3{
/*display:none;*/
}


#footer {
	margin: 0 auto;
	color: #ffffff;
	padding:21px 0px 21px 0;
	font-size: 13px;
	margin-top:-80px;
	font-weight:400;
	text-align: center;
    height:auto;
    min-width: 1200px;
	width:auto;
	background: url(/img/albrighton/footer.png) center repeat-x;
	/*bottom: 80px;*/
	position: relative;
	min-height: 416px;
}

#footer small {
        font-size: 13px;
}

#footer a {
	color: inherit;
}
#footer_content{
	bottom: 0px;
	position: absolute;
	left: 50%;
	margin-left: -400px;
	max-width: 780px;
	width: 100%;
	min-height: 110px;
	padding-bottom: 35px;
}
#footer_address{
	float: left;
	max-width: 330px;
	height: 100%;
	text-align: left;
	width: 40%;
}
#footer_address span:first-child {
font-weight: 600;
}
#footer_bottom{
	position: absolute;
	bottom: 10px;
	width: 100%;
}
#awards{
	max-width: 440px;
	max-height: 80px;
	float: right;
	width: 60%;
}
#awards img{
	width: 100%;
	height: auto;
}
@media (max-width:1220px) {

	#content .element-text td{
		display: inline-block;
	}
	#content .element-text tr{
		text-align: center;
	}

	#filling {
		display: none;
	}

	#wrapper, #header, #content, #nav, #footer {
		width: auto;
	}

	body{
	background:none;
	}
	#wrapper {
		margin: 0px;
		background-size:100%;
		min-height:0;
		overflow:hidden;
                min-width:0;
	}
	
	#topbar {
  	background-size:160%;
		height:0px;
		padding-top:12%;
    width: 100%;
    min-width: 0px;
 
	}
	
	
	
	#wrapperinner{
	min-width:0px;
	width:100%;
	}

	#header {
		width: 100%;
		padding: 0;
		height:100px;
          	background-size:100%;
	}

        #header-inner {
                width:auto;
                min-height:130px;
                height:auto;
					
						background-position:bottom center;
        }
        
	#header h1 {
		top: 70px;
		/*line-height:1.2em;
		font-size: 2.7em;*/
	}

	#header p {
                top:50px;
	}

        #header #search {
        }
        
        #header-logo {
                top:-250px !important;
        }
        #qlinks, #qlinks2 {
        	display: none;
		/*width: 100%;
padding: 0px;
margin: 0px;*/
		}
	
	 #content {
width: 100%;
padding: 0px;
margin: 0px;
min-height: 200px;
border: none;
}
.element{
padding:10px;
margin:10px;
}

#content .column {
width: 100%;
}
.sj_element_slideshow ul.roundabout, .sj_element_slideshow ul.roundabout2 {
width:100% !important;
}

.sj_element_slideshow ul.roundabout li.roundabout-in-focus {
left:0% !important;
width:100% !important;
height:auto;
}

#content .sj_element_slideshow , #content .sj_element_slideshow img {
width:auto !important;
height:auto !important;
}
#content .sj_element_slideshow div.cycle div {
width: 100% !important;
text-align: center;

}

#content .element-slideshow .slideshow img {
width:100% !important;
height:auto !important;
}
#content .element-slideshow {
width:90% !important;
padding:10px;
}
#content .element-slideshow .slideshow {
width:90% !important;
}

#content .element-image img{
max-width:90% !important;
height:auto;
}

#content .element object {
width: auto !important;
}

#content .element object embed {
width: 320px !important;
}
#content .element .form {
width: 100% !important;
}

#content .media-grid li.small {
width: auto;
}

#content .media-grid img {
width: auto;
}

#content .media-grid li.small div {
width:auto;
}

#content .element-media {
width:auto;
}
#content .media {
width:auto !important;
}


	#kid{
	display:none;
	}
	 #bottom{
	 width:auto;
	 background:none;
	 text-align:center;
	 }

   
        #content-wrapper {
              
                width:auto;
        }
        #content-footer{
               display:none;
        } 
	#footer {
		width: auto;
	height:auto;
	/*background-size:130%;*/
	background-position:top center;
	padding-top:10px;
	font-weight:bold;
	min-width:0px;
	bottom: 200px;
	}
	#footer_content{
		float:none;
		left:0;
		margin-left: 0;
		padding-bottom: 50px;
	}
	#footer_bottom{
		/*width: auto;*/
	}
	#footer_address{
		width: 45%;
		/* margin-top: 10%; */
		padding-left: 10px;
	}
	#awards{
		width:45%;
		margin-top: 15%;
		padding-right: 10px;
	}
	#address{
	position:absolute;
	left:0px;
	right:0px;
	top:0px;
	width:auto;
	text-align:center;
	}
	#bottom{
	margin:0px;
	height:100px;
	}

        #sidenav {
                display:none;
        }
        
        #nav {
                display:none;
        }
        
       #nav, #nav-side {
                display:none !important;
        }
        
        #nav-mobile {
                display:block;
        }
        
	#nav-mobile {
		height: auto;
    
	}

	#nav-mobile > ul {
		display:none;
		width: auto;
		float: none;
		height: auto;
		position: relative;
                padding:0;
                
	}

	#nav-mobile ul ul {
		position: relative;
		width: auto;
		margin: 0 !important;
		border-top:0;
	}

	#nav-mobile ul ul ul {
		border: none;
                
	}

	#nav-mobile ul li {
		display:block;
		width: auto;
		float: none;
		height: auto;
		margin:0;
                background:none;
	}

	#nav-mobile > ul > li {
                border-bottom: solid 1px #fff
	}
        
        #nav-mobile ul ul li {
                text-indent:20px;
                color:#FEDD7A;
        }
        
        #nav-mobile ul ul ul li {
                text-indent:40px;
        }
        
        #nav-mobile ul ul ul ul li {
                text-indent:60px;
        }
}

@media (max-width: 450px) {
	#footer_address{
		font-size: 10px;
	}
	#footer_content{
		line-height: 12px;
	}
	#footer_bottom{
		line-height: 12px;
		font-size: 10px;
	}
}

.sj_element_events dl.sj_events dt small .month{
	background: #004890;
	-webkit-border-radius: 3px 3px 0 0;
	border-radius: 3px 3px 0 0;
}
.sj_element_events, .sj_element_newsletters, .element-events small .day{
	color:#000 !important;
}

.sj_element_newsletters h1, .sj_element_newsletters h2, .sj_element_newsletters h3, .sj_element_newsletters h4, 
.sj_element_events h1, .sj_element_events h5, .sj_element_events h2, .sj_element_events h3, .sj_element_events h4, .element-news h3{
	background: #e4bef5 !important;
	margin-bottom: 10px;
	text-align: center;
}
.sj_element_events .events-time small, .sj_element_news ul li, .sj_element_newsletters ul *, .element-rss li *,
.element-text ul li, .element-text ol li{
	color: #000 !important;
}
#content .element-text h1, #content .element-text  h2, #content .element-text  h3, #content .element-text  h4{
	background: #bdeaba !important;
	margin-bottom: 10px;
	padding: 2px 10px;
}







/* COLUMNS */

.has-side-menu .column-1col,
.column-1col {
    width: 100%;
}

.has-side-menu .column-2col-1,
.column-2col-1 {
    width: 50%;
}

.has-side-menu .column-2col-2,
.column-2col-2 {
    width: 50%;
}

.has-side-menu .column-left2col-1,
.column-left2col-1 {
    width: 66.6%;
}

.has-side-menu .column-left2col-2,
.column-left2col-2 {
    width: 33.4%;
}

.has-side-menu .column-right2col-1,
.column-right2col-1 {
    width: 33.4%;
}

.has-side-menu .column-right2col-2,
.column-right2col-2 {
    width: 66.6%;
}

.has-side-menu .column-3col-1,
.column-3col-1 {
    width: 33.4%;
}

.has-side-menu .column-3col-2,
.column-3col-2 {
    width: 33.3%;
}

.has-side-menu .column-3col-3,
.column-3col-3 {
    width: 33.3%;
}

.has-side-menu .column,
.column {
    float: left;
    margin: 0;
    padding: 15px;
}
/* END OF COLUMNS */

html,
body {
    height: 100%;
    margin: 0;
}

body {
    background: none;
    background-size: auto;
    position: static !important;
    line-height: 1.4;
    -ms-overflow-style: scrollbar;
}

div {
    box-sizing: border-box;
}

.wrapper {
    width: 100%;
    position: relative;
}

.inner {
    margin: 0 auto;
    position: relative;
    max-width: 960px;
}

.ie8 .inner {
    max-width: none;
    width: 960px;
}

.cleaner {
    clear: both;
    float: none !important;
}

.page {
    max-width: none;
    min-width: 0;
}

.school-details {
    padding: 15px;
}

.bar-wrapper {
    clear: both;
}

.page .bar {
    padding: 5px 15px;
    position: relative;
}

.page .bar:after {
    content: "";
    display: table;
    clear: both;
}

.page .bar > div {
    float: left;
}

.page .bar .school-address {
    width: 100%;
}

.page .bar.address-social-bar .school-address {
    width: 65%;
}

.page .bar.address-social-bar .theme-social {
    width: 35%;
    text-align: right;
}

.box-container > div {
    display: block;
}

.full-width {
    width: 100% !important;
    max-width: none !important;
}

.has-side-menu .content {
    width: 70%;
    float: left;
}

/* COLUMNS */

.has-side-menu .column-1col,
.column-1col {
    width: 100%;
}

.has-side-menu .column-2col-1,
.column-2col-1 {
    width: 50%;
}

.has-side-menu .column-2col-2,
.column-2col-2 {
    width: 50%;
}

.has-side-menu .column-left2col-1,
.column-left2col-1 {
    width: 66.6%;
}

.has-side-menu .column-left2col-2,
.column-left2col-2 {
    width: 33.4%;
}

.has-side-menu .column-right2col-1,
.column-right2col-1 {
    width: 33.4%;
}

.has-side-menu .column-right2col-2,
.column-right2col-2 {
    width: 66.6%;
}

.has-side-menu .column-3col-1,
.column-3col-1 {
    width: 33.4%;
}

.has-side-menu .column-3col-2,
.column-3col-2 {
    width: 33.3%;
}

.has-side-menu .column-3col-3,
.column-3col-3 {
    width: 33.3%;
}

.has-side-menu .column,
.column {
    float: left;
    margin: 0;
    padding: 15px;
}
/* END OF COLUMNS */

.page img {
    max-width: 100%;
    height: auto;
}

.nav_hidden,
.nav_mobile,
.copyright br {
    display: none;
}

.school-address {
    padding: 15px 0;
}

.school-address.with-dividers p {
    position: relative;
    padding: 0 5px;
}

.school-address.with-dividers p:after {
    content: "|";
    position: absolute;
    left: -5px;
}

.school-address.with-dividers p.theme-address {
    padding-left: 0;
}

.school-address.with-dividers p.theme-address:after {
    display: none;
}

.school-address.with-prefixes p.theme-telephone:before {
    content: "Tel: ";
}

.school-address.with-prefixes p.theme-fax:before {
    content: "Fax: ";
}

.school-address.with-prefixes p.theme-email:before {
    content: "Email: ";
}

.school-address.with-prefixes p.theme-headteacher:before {
    content: "Headteacher: ";
}

.school-address p {
    display: inline-block;
    vertical-align: top;
    margin: 0 5px 0 0;
}

.school-address p a {
    color: inherit;
}

.school-address.listed p {
    display: block;
}

.theme-site-name,
.theme-strap-line {
    margin: 0;
    padding: 0;
}

.theme-school-logo,
.school-name {
    display: inline-block;
    vertical-align: middle;
}
/* SLIDESHOW */

#theme-slideshow {
    clear: both;
    position: relative;
    overflow: hidden;
    width: 100%;
}

#theme-slideshow img {
    width: 100%;
    height: auto;
    position: absolute;
    top: 0;
    left: 0;
}

#theme-slideshow-captions {
    position: absolute;
    bottom: 1%;
    left: 1%;
    padding: 10px;
    font-size: 50px;
    color: #ffffff;
    font-weight: bold;
    width: 98%;
    line-height: normal;
    text-align: left;
    text-shadow: 1px 1px 8px rgba(0, 0, 0, 0.58);
}

.theme-slideshow-caption {
    position: absolute;
    bottom: 0;
}
/* END OF SLIDESHOW */

.boxes {
    margin: 10px;
}

.boxes .theme-google-translate {
    float: left;
}

.boxes .search {
    float: right;
}

select.goog-te-combo::-ms-expand {
    display: none;
}

.goog-te-gadget .goog-te-combo {
    margin: 4px 0;
    padding: 5px 5px;
    width: 185px;
    border: 1px solid #d6d6d6;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -moz-appearance: none;
    -webkit-appearance: none;
    background: #ffffff url(/img/bespoke/chattenden_2019/arrow_img.png) 160px center no-repeat;
}

.search .site-search,
.page-Generated-search input {
    background: white;
    border: 1px solid #cccccc;
    outline: none;
    border-right: none;
    padding: 4px;
    box-shadow: none;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    -webkit-appearance: none;
    -webkit-border-top-left-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-topleft: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    height: 32px !important;
    line-height: normal;
}

.search .btn,
.page-Generated-search .content .btn {
    background: white;
    padding: 4px;
    border: 1px solid #cccccc;
    border-left: none;
    outline: none;
    box-shadow: none;
    -webkit-border-radius: 0px;
    /*ipad border 0 fix*/
    
    -moz-border-radius: 0px;
    border-radius: 0px;
    -webkit-border-top-right-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
    -moz-border-radius-topright: 3px;
    -moz-border-radius-bottomright: 3px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    height: 32px !important;
    line-height: normal;
    margin-left:-1px;
}

div.slicknav_menu {
    background: #c9261d;
}

a.slicknav_btn {
    background: #a10d0d;
}

.text-center {
    text-align: center;
}

.school-details .school-name,
.school-details .theme-school-logo {
    display: inline-block;
    vertical-align: middle;
}
/* NAVIGATION */
/*MENU*/

.nav {
    position: relative;
    z-index: 601;
    opacity: 1;
    margin: 0 auto;
    padding: 0;
    width: 100%;
    text-align: center;
}

.nav.fixed {
    position: fixed;
    top: 0;
    z-index: 555;
}

.sj_admin .nav.fixed {
    top: 60px;
}

.nav > ul {
    font-size: 0;
    padding: 0;
    margin: 0;
    color: black;
}

.nav li {
    display: inline-block;
    vertical-align: top;
    font-size: 14px;
    margin: 0 3px;
    position: relative;
    vertical-align: middle;
}

.nav a {
    padding: 8px 10px;
    text-decoration: none;
    display: inline-block;
    color: black;
}

.nav ul ul {
    display: none;
    position: absolute;
    width: 250px;
    top: 100%;
    padding: 0;
    left: 0;
    background-color: #afafaf;
    z-index: 1;
}

.nav ul ul li {
    background: inherit;
}

.nav ul ul li a {
    display: block;
    width: 100%;
}

.nav > ul > li.last-item > ul,
.nav > ul > li.extra.more > ul {
    right: 0;
    left: auto;
}

.nav ul ul li {
    display: block;
    margin: 0;
}

.nav ul ul ul {
    top: 0;
    left: 100%;
}

.nav ul ul ul.left, .nav .left ul {
   left: -100%;
}
/* END OF NAVIGATION */
/* SIDE NAVIGATION */

.has-side-menu .content {
    float: left;
    width: 70%;
    padding-top: 0;
}

.sidenav {
    float: left;
    width: 30%;
    position: relative;
    z-index: 555;
    background: #a3a3a3;
}

.sidenav ul {
    padding: 0;
    margin: 0;
    width: 100%;
}

.sidenav ul ul {
    position: absolute;
    top: 0;
    left: 100%;
    display: none;
    width: 100%;
}

.sidenav ul li:hover > ul {
    display: block;
}

.sidenav.verticalClick ul li:hover > ul {
    display: none;
}
.sidenav.verticalClick li.current > ul {
    display: block !important;
}

.sidenav.verticalClick ul ul {
    position: relative;
    left: 0;
}

.sidenav ul ul.left,
.sidenav ul ul.left ul {
    left: -100%;
}

.sidenav.verticalClick ul ul li {
    padding-left: 5px;
}

.sidenav.verticalClick li.current > ul {
    display: block;
}

.sidenav li {
    list-style-type: none;
    width: 100%;
    position: relative;
    background: #a3a3a3;
}

.sidenav a {
    display: block;
    height: 100%;
    width: 100%;
    padding: 8px 15px;
    color: white;
    text-decoration: none;
}
/* END OF SIDE NAVIGATION */
/* CONTENT */

.content-wrapper {
    min-height: 100%;
}

.content-inner {
    padding: 15px;
    min-height: 400px;
}

.sj_element_news ul {
    padding-left: 0;
}

.element {
    margin-bottom: 20px;
}


.cms_edit .sj_element_embed {
    padding:10px;
}


/* NEWS */

.sj_element_newsletters ul {
    padding-left: 0;
}

.sj_element_newsletters ul li {
    list-style-type: none;
}

.sj_element_news ul li a,
.sj_element_events dl.sj_events dt,
.sj_element_newsletters strong {
    color: inherit;
    font-weight: bold;
    font-size: 16px;
}

.sj_element_newsletters strong a {
    color: inherit;
}

.sj_element_news ul li,
.sj_element_events dl.sj_events dd,
.sj_element_newsletters p {
    font-weight: normal;
    font-size: 14px;
}
/* END OF NEWS */

.page-Generated-search .content,
.page-Generated-news .sj_element_news,
.page-Generated-calendar #calendar {
    padding: 15px;
}
/* END OF CONTENT */
/* FOOTER */

.awards {
    padding: 20px;
    text-align: center;
}

.awards img {
    height: 80px;
    width: auto;
    display: inline-block;
    margin: 0 10px;
}

.copyright {
    background: #261b04;
    color: white;
    text-align: center;
    padding: 15px;
    display: block;
    position: absolute;
    bottom: -30px;
    left: 0;
    right: 0;
    width: 100%;
}

.copyright a {
    color: inherit;
}
/* END OF FOOTER */
/* FIXES */
/* SEARCH FIX */

.page-Generated-search .content h2,
.page-Generated-search .content p {
    padding: 0px 15px;
}

.page-Generated-search .content > form {
    padding: 15px;
}
/* END OF SEARCH FIX */
/* FIX FOR NEWS PAGE */

.page-Generated-news .content td {
    vertical-align: top !important;
    padding-right: 10px;
}

.page-Generated-news .content .search td {
    padding-right: 0;
}
/* END OF FIX FOR NEWS PAGE */
/* FIX FOR SLIDESHOW Z-INDEX */

.ie8 .sj_element_slideshow div.cycle > div {
   height: 100% !important;
   min-height: 100px;
}

.sj_element_slideshow div.cycle > div {
    z-index: 0 !important;
    filter: none!important;
    background: transparent !important;
}
/* END OF FIX FOR SLIDESHOW Z-INDEX */
/* MAP FIX */

.page .element-map img {
    width: auto;
    max-width: inherit;
}
/* END OF MAP FIX */
/* IE8 FIXES */

.ie8 .fc-header,
.ie8 .fc-header tbody,
.ie8 .fc-header tr {
    display: block;
}

.ie8 .fc-header td {
    display: inline-block !important;
    width: 33%;
}

.ie8 .sj_element_slideshow div.cycle div {
    width: 100% !important;
}

.ie8 .goog-te-gadget img {
    width: 38px;
    height: 12px;
}

.ie8 .wrapper img {
    width: auto;
}

.ie8 .goog-te-banner-frame {
    width: 100%;
    height: 38px;
}

.ie8 #goog-gt-tt {
    display: none;
}

.ie8 body {
    top: 0 !important;
}

.ie8 body.sj_preview > .skiptranslate {
    height: 38px;
}

.ie8 .search .site-search {
    line-height: 18px;
}

.ie8 .page-Generated-search .content.inner input {
    float: left;
}

.ie8 .page-Generated-search .content.inner form {
    overflow: auto;
    padding-left: 5px;
}

.ie8 .search .site-search,
.ie8 .btn,
.ie8 .page-Generated-search .content.inner input {
    height: 27px;
}

.ie8 .btn {
    line-height: 20px;
}

.ie8 .frame img {
    width: auto
}
/* END OF IE8 FIXES */

.element-text table {
    width: 100%;
    table-layout: fixed;
}

.sj_element_events dl.sj_events dt small {
    border: 0;
}

.page-Generated-search .content input {
    margin-left: -4px;
    float: left;
}

.page-Generated-search .content form {
    margin-bottom: 20px;
}

.page-Generated-news .sj_element_news,
.page-Generated-calendar #calendar {
    padding: 15px;
}
/* END OF FIXES */

.fc-event-container > * { 
    z-index: 0; 
}

.ie8 .sj_element_slideshow div.cycle * {
    width: auto !important;
    height: 100% !important;
}

.ie8 .sj_element_slideshow div.cycle > div {
    right: 0;
}

.ie8 .nav > ul li.extra.more ul li ul,
.ie8 .nav > ul li.last-item ul li ul{
    left:-100%;
}
 
.sj_element_news ul.pagination li,
.sj_element_news ul.pagination li a {
    font-size: 12px;
}

.has-side-menu .sj_element_news .pagination-showing {
    font-size: 0.8em;
}

.sj_element_news .bs3-text-right.pagination-showing  {
    text-align: left;
}

.sj_element_slideshow {
   max-width: 930px;
   margin: 0 auto;
}

/* Date counter widget */
.date-box{
    display: none;
    min-width: 100px;
    min-height: 40px;
    background: #000;
    background: rgba(0,0,0,0.8);
    color: #fff;
    font-weight: bold;
    font-size: 28px;
    border-radius: 10px;
    padding: 20px 35px;
    position: fixed;
    top:80px;
    right: 60px;
    z-index: 999;
    text-align: center;
}

.ie8 .date-box{
    background: #000;
}

.date-box #counter{
    font-size: 38px;
    line-height: 38px;
    display: block;
    padding: 15px 0;
       color: #BBFF3C;
}

.date-box .close{
    position: absolute;
    right:0;
    top:0;
    cursor: pointer;
    font-size: 14px;
    padding: 7px;
    color: #fff;
    opacity: 0.7;
}

.date-box .close:hover{
    opacity: 1;
}

.date-box .contact_text{
    font-size: 13px;
    max-width: 250px;
    margin: 0 auto;
}

.leaflet-bottom, .leaflet-top {
   z-index: 400;
}

.ie8 .nav ul.offset-right > li> ul{
   left: -100%;
}

.column .cms-element-handle{
    z-index:602;
}


@media(max-width: 960px) {
    .date-box {
        display: none !important;
    }

    .column .fc-header td {
        display: table-cell !important;
        width: auto;
        text-align: center;
    }
    .column .fc-header td,  .column .fc-header tr,  .column .fc-header th {
        display: inline-block !important;
        width: 100%;
        text-align: center;
    }
    
    .element-text table,
    .element-text tbody,
    .element-text th,
    .element-text tr,
    .element-text td{
        height: auto !important;
    }
/*    .element-text table,
    .element-text tr,
    .element-text td,*/
    .nav_mobile,
    .page {
        display: block;
    }
    .sj_element_news .bs3-col-lg-3 {
        width: 100%;
    }
    .school-address.with-dividers p:after {
        display: none;
    }
    .column {
        width: 100% !important;
    }
    .content {
        width: 100% !important;
    }
    .nav,
    .sidenav {
        display: none !important;
        min-height: 0 !important;
    }
    .nav_mobile {
        margin: 10px 0;
        display: block;
    }
    .inner,
    .wrapper {
        width: 100% !important;
        min-width: 0;
    }
    .school-name {
        position: relative;
        display: block;
        left: 0;
        top: 0;
        width: 100%;
        text-align: center;
    }
    .school-address {
        text-align: center;
    }
    .school-address p {
        display: block;
    }
    .school-address.with-diviers p:after {
        display: none;
    }
    .theme-social {
        text-align: center;
    }
    .school-details .theme-school-logo,
    .school-details .school-name {
        display: block;
        width: 100%;
        text-align: center;
    }
    .sj_element_slideshow div {
        width: 100% !important;
        background: none !important;
    }
    .sj_element_slideshow div.cycle div img {
        width: auto !important;
        height: auto !important;
    }
    .page .bar .theme-social,
    .page .bar .school-address {
        line-height: normal !important;
        text-align: center;
        float: none;
        max-width: none;
    }
    .school-name,
    .theme-school-logo {
        display: block;
        max-width: 100%;
        width: 100%;
        text-align: center;
        margin: 0;
        padding: 10px;
    }
    .boxes > div {
        float: none !important;
        text-align: center;
    }
    .search form {
        display: inline-block;
    }
}

@media (max-width: 630px) {
    .column .fc-header td {
        display: block !important;
        width: 100%;
    }
     .page-Generated-news .content td {
        display: block;
    }
}

@media (max-width: 450px){
    td.fc-header-left{
        display: none;
    }
    td.fc-header-center,
    td.fc-header-right{
        width:50%;   
    }
}




/*nav*/


.nav {
    background: #23a7e2;
    font-family: 'Comic Sans', sans-serif;
}

.nav {}


.nav a {
    color: #fff;
    font-size: 17px;
    text-align: left;
    padding-left: 20px;
}

.nav > ul > li > a {
    font-weight: 400;
    font-size: 18px;
    text-align: center;
    padding: 10px 21px;
}

.nav > ul > li:hover > a {
    background: #1f88b7;
}

.nav ul ul {
    background: #87d9f8;
}

.nav ul ul li:hover > a {
    background: #23a7e2;
}

.cms_edit .nav.fixed,
.logged-in .nav.fixed {
    position: relative;
}

.sj_admin .nav.fixed {
    top: 0;
}


/*end of nav*/


											@media (max-width: 1220px) {
												#nav-mobile ul.dropdown, #nav-mobile ul.dropdown ul {
													width:100%;
													position: relative;
												}

												#nav-mobile ul.dropdown li {
													width: 100%;
													padding-right: 0 !important;
													position: relative;

												}

												#nav-mobile ul.dropdown ul {
													left: 0 !important;
													text-indent: 14px;
												}

												#nav-mobile ul.dropdown ul { text-indent:20px; }
												#nav-mobile ul.dropdown ul ul { text-indent:40px; }
												#nav-mobile ul.dropdown ul ul ul { text-indent:60px; }
												#nav-mobile ul.dropdown ul ul ul ul { text-indent:80px; }

												#nav-mobile ul.dropdown ul li.more span {
													background-position: 4px -64px !important;
													width:45px;
													padding-top: 40px;
													z-index: 5;
													border-left: 1px solid #B28939;
												}

												#nav-mobile ul.dropdown ul li.down > span {
													background-position: 4px -8px !important;
												}

												#nav-mobile .extra {
													cursor: pointer;
												}

												#nav-mobile .extra > a {
													display:none !important;
												}

												#nav-mobile .extra:before {
													content: 'Menu';
													padding-left:10px;
												}

												#header {
												    margin-bottom: 180px;
												}

												.nav {
													display: none;
												}

												#content {
													max-width: 100%;
												}

												#footer_address {
													display: none;
												}

												#awards {
													margin-top: 0;
													float: none;
													margin: 0 auto;
													padding-right: 0;
													padding-top: 15px;

												}

												#footer_content {
													max-width: 100%;
												}

												.copyright {
													bottom: -50px;
												}

												#footer {
													bottom: 210px;
												}
											}

@media (max-width: 960px) {

	#header {
    	margin-bottom: 159px;
	}

}

@media (max-width: 760px) {

	#header {
    	margin-bottom: 103px;
	}

}

@media (max-width: 560px) {

#header {
    margin-bottom: 50px;
}

}


@media (max-width: 420px) {

#header {
    margin-bottom: 0;
}

}