/*
Theme Name: Vibe Teaching
Version: 1.1
Description: Custom Theme for vibeteaching.co.uk, contains fun pastel colors. 
Author: DukeMedia, Anthony Cole, Sean Sean Tan
Author URI: http://www.dukemedia.com
*/

/*=== 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, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
}
:focus { outline: 0; }
ol, ul { list-style: none; }
table { border-collapse: separate; border-spacing: 0; }
blockquote:before, blockquote:after,
q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

/*=== main elements ==*/
a { color: #0099cc; text-decoration: none; }
a:hover { text-decoration: underline; }
h1 { text-indent: -9999px; font-size: .1em; line-height: normal; }

/*=== block styles ==*/
body { font: 62.5% arial, helvetica, sans-serif; color: #444; background: #fff url(images/bg.png) 2px 0 repeat; }
#wrapper { width: 1000px; background: #fff url(images/wrapperbg.png) top left repeat-y; font-size: 13px; margin: 0; }
#wrapper.smooth { background: #fff url(images/wrapperbg-smooth.png) top left repeat-y; }
#wrapper.rightcol { background: #fff url(images/wrapperbg-rightcol.png) top left repeat-y; }
#header { width: 1000px; height: 133px; background: #008ad3 url(images/headerbg.png) top left no-repeat; padding: 0; }
#content { width: 1000px; margin: 0; padding: 0; }
#footer { width: 1000px; height: 145px; background: #fff url(images/footerbg.png) top left no-repeat; margin: 0; padding: 0; }
#footer.smooth { background: #fff url(images/footerbg-smooth.png) top left repeat-y; margin: 50px 0 0 0; }

/*== logo ==*/
#logo { float: left; display: block; width: 180px; height: 80px; padding: 25px 0 0 0; }
#logo p.home-nav { postion: absolute; top: 0; left: 0; padding: 0; margin: -15px 0 0 -50px; text-align: left; width: 170px; }
#logo p.home-nav a { color: #033163; font-size: 10px; font-weight: bold; }
#logo h1 a { display: block; width: 180px; height: 80px; }
#logo h1 a:hover { text-decoration: none; }

/*== aux navigation ==*/
#aux { float: right; width: 165px; padding: 10px 0 0 0; margin: 0; }
#aux ul { border-left: 1px solid #fff; padding: 0 0 12px 0; }
#aux li a { color: #fff; display: block; margin: 0 0 0 10px; padding: 0; text-transform: lowercase; font-size: 11px; line-height: 14px; }

/*== main navigation ==*/
#main-nav { width: auto; font-size: 15px; top: 0; left: 0; padding: 76px 0 0 185px; z-index: 100; }
#main-nav ul { /*padding:0; margin:0; list-style-type:none;*/ }
#main-nav ul ul { width: 150px; background: url(images/menubg.png) top left repeat-y; }
#main-nav ul li { float: left; display: block; /*width:150px;*/ position:relative; background: url(images/right-off.png) no-repeat top right; padding: 4px 15px 9px 0; margin: 0 1px 0 0; }
#main-nav ul li a { font-weight: bold; background: url(images/left-off.png) no-repeat top left; padding: 4px 1px 0 21px; border: none; color: #fff; margin: 0 0 0 -1px; }
#main-nav ul ul { visibility: hidden; position: absolute; height: auto; top: 29px; left: 0; width: 150px; background: url(images/menubg.png) top left repeat-y; text-transform: lowercase; border-top: 2px solid #a9afad; border-bottom: 4px solid #a9afad; }
* html #main-nav ul ul { top:28px; t\op:29px; }
#main-nav table {position:absolute; top:0; left:0;}
#main-nav ul ul a, #main-nav ul ul a:visited { color:#0099cc; height:auto; line-height:1em; padding:5px 10px; width:129px }
* html #main-nav ul ul a { width:150px; w\idth:129px; }
#main-nav ul li:hover { background: url(images/right-on.png) no-repeat top right; }
#main-nav ul li a:hover { background: url(images/left-on.png) no-repeat top left; text-decoration: none; cursor: default; }
#main-nav :hover > a, #main-nav ul ul :hover > a { background: url(images/left-on.png) no-repeat top left; cursor: default; }

#main-nav ul li.contact a:hover { cursor: pointer; }
#main-nav ul ul li, #main-nav ul ul li a, #main-nav ul ul li:hover, #main-nav ul ul li a:hover { background: none; }
#main-nav ul ul li { margin: 0; padding: 0; }
#main-nav ul ul li a { font-weight: bold; display: block; margin: 0; font-size: 12px; line-height: 16px; }
#main-nav ul ul a:hover { text-decoration: underline; cursor: pointer; }
#main-nav ul li:hover ul, #main-nav ul a:hover ul { visibility: visible; background: url(images/menubg.png) top left repeat-y; }

#header p { float: right; width: 125px; height: 10px; margin: 5px 40px 0 0; }
#header p span { display: block; text-indent: -9999px; }
#header p a { display: block; width: 125px; height: 10px; }

/*=== content FRONT ===*/

h2 { margin: 0; padding: 0; display: block; width: 1000px; }
h2.front-banner { width: 1000px; height: 250px; background: url(images/header-img/image.php) top left no-repeat; }
h2.inside-banner { width: 1000px; height: 105px; background: url(images/header-img/h2/image.php) top left no-repeat; }
h2 span { display: block; text-indent: -9999px; }
h2.front-banner a { display: block; width: 127px; height: 30px; float: right; text-indent: -9999px; background: url(images/startbutton.png) top left no-repeat; margin: 135px 140px 0 0;  }
h2.inside-banner a { display: block; width: 110px; height: 30px; float: right; text-indent: -9999px; background: none; margin: 34px 195px 0 0; }
h2 a:hover { border: none; text-decoration: none; }
h2.widgettitle { color: #000; margin: 10px 0 0 0; font-size: 22px; font-weight: lighter; letter-spacing: -1px; text-transform: lowercase; }
li.widget { margin: 5px; 0; }
h3 { color: #95bb42; font-size: 20px; font-weight: normal; text-transform: lowercase; }
h5 { font-size: 20px; font-weight: normal; color: #000; text-transform: lowercase; }
#content #sidebar { float: left; width: 210px; margin: 20px 0 0 20px; }
#content #main { float: right; width: 700px; margin: 20px 30px 0 0; } 
#content p { margin: 10px 0; line-height: 20px; }
#content a.a-block { display: block; min-width: 82px; width: auto !important; width: 82px; height: 40px; padding: 0 0 0 15px; color: #0099cc; font-weight: bold; font-size: 12px; background: url(images/a-block.png) top left no-repeat; }

/*=== content WIDE ===*/

#content #inside-main { margin: 10px 10px 0 30px; }
#inside-main #headpiece { width: 100%; }
#inside-main #headpiece ul { float: left; width: 300px; margin: 0; margin-top: 6px; padding: 0; position: absolute; }
#inside-main #headpiece li { float: left; padding: 0; margin: 0; }
#inside-main #headpiece li a span { padding: 0 2px; text-indent: -9999px; cursor: pointer; }
#inside-main #headpiece h4 { margin: 0; padding: 0; text-align: right; width: 100%; font-weight: lighter; font-size: 22px; text-transform: lowercase; }
#inside-main h4.red { border-bottom: 1px solid #c00; color: #c00; background: url(images/red-arrow.png) bottom left no-repeat; }
#inside-main h4.black { border-bottom: 1px solid #000; color: #000; background: url(images/black-arrow.png) bottom left no-repeat; }
#inside-main h4.blue { border-bottom: 1px solid #2babd8; color: #2babd8; background: url(images/blue-arrow.png) bottom left no-repeat;}
#inside-main h4.orange { border-bottom: 1px solid #ff8a34; color: #ff8a34; background: url(images/orange-arrow.png) bottom left no-repeat;}
#inside-main h4.yellow { border-bottom: 1px solid #fed82f; color: #fed82f; background: url(images/yellow-arrow.png) bottom left no-repeat;}
#inside-main h4.purple { border-bottom: 1px solid #5f5390; color: #5f5390; background: url(images/purple-arrow.png) bottom left no-repeat;}

#inside-main p { margin: 10px 0 0 10px; }
#inside-main h5 { margin: 10px 0 0 10px; }
div.divider { border-bottom: 1px solid #95d028; padding: 0 0 20px 0; }
div.slight { margin: 0 15px 0 0; }
div.faq, div.faq-2 { margin: 25px 15px 0 0; cursor: pointer; padding: 0 0 20px 0; }
#inside-main ul.imagelist { width: 90%; margin: 10px 0 0 10px; }

#flickr-bar, #profile-bar { width: 235px; float: left; margin: 10px 0 0 10px; }
#profile-bar { width: 193px; }
#media-content { width: 540px; float: left; margin: 10px 0 0 30px; }
#media-content.profile-right { width: 485px; float: left; margin: 10px 0 0 16px; }
#flickr-bar ul li, #profile-bar ul li { width: 235px; height: 28px; margin: 3px 0; font-size: 21px; font-weight: lighter; text-transform: lowercase; padding: 3px 0 0 5px; }
#profile-bar ul li { width: 193px; margin: 0; }
#flickr-bar ul li.on, #profile-bar ul li.on { color: #fff; background: #95d028 url(images/dance-icon.gif) top right no-repeat; }
#flickr-bar ul li a, #profile-bar ul li a { color: #oo97cd; }

#media-content ul { width: 520px; }

#media-content.profile-right ul { width: 485px; }
#inside-main ul.imagelist li, #media-content ul li { float: left; width: 151px !important; width: 146px; height: 151px; margin: 0 10px 10px 0; background: #95d028; color: #fff; font-size: 12px; font-weight: bold; }
#media-content ul.flickerset li { height: 171px; }
#media-content ul li div.img-contain { width: 151px !important; width: 146px; height: 151px; overflow: hidden; margin: 0 0 2px 0; }
#media-content.profile-right ul li { margin: 0 0 10px 10px; }
#inside-main ul.imagelist li img, #media-content ul li img { margin: 0 0 2px 0; }
#inside-main ul.imagelist li a, #media-content ul li a { display: block; color: #fff; text-decoration: none; }
#inside-main ul.imagelist li div, #media-content ul li div { display: block; margin: 0 0 0 5px; }
#inside-main ul.imagelist li a:hover div, #media-content ul li a:hover div { text-decoration: underline; }
#inside-main ul.imagelist li a img, #media-content ul li a img { border: none; }

#inside-main #photosets { width: 678px; margin: 10px 0 0 150px; }
#inside-main #photosets h5 { margin: 0; }
#inside-main #photosets a { font-size: 11px; font-family: trebuchet ms, trebuchet, arial, helvetica; color: #999; }

#inside-main #photosets ul { margin: 10px 0 0 0; }
#inside-main #photosets ul li { float: left; margin: 0 18px 18px 0; }
#inside-main #photosets ul li a img { border: 1px solid #999; }
#inside-main #photosets ul li a:hover img { border: 1px solid #09c; }

#inside-main form { display: block; margin: 5px 10px; }
#inside-main form fieldset { border: none; padding: 0; margin: 0; }
#inside-main form fieldset legend { display: block; text-indent: -9999px; }
#inside-main form fieldset label { display: block; margin: 3px 0; color: #000; font-size: 18px; letter-spacing: -1px; font-weight: lighter; text-transform: lowercase; }
#inside-main form fieldset input.data { border: 1px solid #bbe55f; width: 250px; font-size: 15px; }
#inside-main form fieldset input.submit { display: block; margin: 20px 0 5px 0; color: #09c; border: 1px solid #09c; font: 18px arial, helvetica, sans-serif; }
#inside-main form fieldset p { margin: 0; padding: 0; font-size: 11px; text-transform: lowercase; }

#video-player{	margin-left: 106px;	margin-top: 20px;} 

/*=== content RIGHT COLUMN ===*/

#main-left { margin: 23px 0 0 20px; width: 710px; float: left; }
#rightcol { float: left; width: 235px; margin: 20px 0 0 23px; }

#main-left #subnav { width: auto; }
#subnav ul li { float: left; display: block; position:relative; background: url(images/submenu-right-off.png) no-repeat top right; padding: 4px 15px 4px 0; margin: 0 8px 0 1px; font-size: 11.5px; font-weight: bold; text-transform: lowercase; }
#subnav ul li a { font-weight: bold; background: url(images/submenu-left-off.png) no-repeat top left; padding: 4px 1px 4px 17px; border: none; color: #09c; margin: 0; }
#subnav ul li.current_page_item  { background: url(images/submenu-right-on.png) no-repeat top right; border-bottom: 1px solid #fff; margin: 0 8px -2px 1px;  }
#subnav ul li.current_page_item  a { background: url(images/submenu-left-on.png) no-repeat top left; color: #95bb42; border-bottom: 1px solid #fff; margin: 0 0 -2px 0; }

#main-left #subcontent { border-top: 1px solid #95bb42; margin: 0 0 0 1px; padding: 15px 0 0 0; }
#main-left #subcontent.no-menu { margin: 23px 0 0 1px; }
#main-left h3 { display: block; float: right; margin: -23px 0 0 0; }
#main-left h3.clean { margin: -2px 0 0 0; }

#subcontent h5 { margin: 10px 0 10px 15px;  }
#subcontent h5.special { color: #09c; background: url(images/toggle-button.png) bottom left no-repeat; padding: 0 0 0 25px; line-height: 14px; }
#subcontent h5.faq { color: #09c; background: url(images/toggle-button.png) bottom left no-repeat; padding: 0 0 0 25px; line-height: 14px; display: block; margin: 10px 0 15px 15px; text-transform: none; }

#subcontent p, #subcontent table { margin: 10px 0 0 15px; }
#subcontent .pseudo { padding: 0 0 20px 0; }

#subcontent ul.gen-list { margin: 0 0 0 10px; }
#subcontent ul.gen-list li { padding: 0 0 0 10px; }
#subcontent ul.sitemap { margin: 15px 0 0 10px; }
#subcontent ul.sitemap li { padding: 5px 0 5px 10px; }
#subcontent ul.sitemap li li { margin: 1px; }

#subcontent table, .pseudo table { border-collapse: collapse; }
.pseudo table { width: 665px; margin: 0 0 0 15px; }
#subcontent table th { text-indent: -9999px; line-height: .1em; }
#subcontent table td { font-size: 12.5px; padding: 10px 0; vertical-align: top; }
.pseudo table td { font-size: 12.5px; padding: 10px 0; vertical-align: top; }
#subcontent table td.client { width: 20%; border-top: 1px solid #bbe55f; }
.pseudo table td.services { width: 25%; border-bottom: 1px solid #bbe55f; }
.pseudo table td.description { border-bottom: 1px solid #bbe55f; }
.pseudo table td.clear-border { border-bottom: 1px solid #fff; }
#subcontent table td.testimonial { font-weight: bold; font-style: italic; padding: 10px 20px 10px 0; border-top: 1px solid #bbe55f; }
#subcontent table td.testimonial img { float: right; border: 1px solid #999; margin: 0 0 0 10px; }

#subcontent #profile-data { width: 475px; float: left; margin: 10px 0 0 0; }
#subcontent #profile-data h5 { text-transform: none; float: left; padding: 0; }
#subcontent #profile-data ul { margin: 0 0 0 7px; padding: 17px 0 0 0; }
#subcontent #profile-data ul li { float: left; background: url(images/profile-list-link.png) 0 2px no-repeat; margin: 0 7px; padding: 0 0 0 17px; color: #83bd13; font-weight: bold; font-size: 12px; }
#subcontent #profile-data ul li.on { background: url(images/profile-list-on.png) 0 2px no-repeat; color: #83bd13; }
#subcontent #profile-data ul li a { color: #009bcf; }
#subcontent #profile-data table { width: 465px; border-spacing: none; border-collapse: collapse; margin: 0 0 0 15px; }
#subcontent #profile-data table td { padding: 7px 0; vertical-align: top; font-size: 12px; margin: 0; }
#subcontent #profile-data table td.question { width: 180px; }
#subcontent #profile-data table td.answer { width: 290px; }
#subcontent img.profile-img { float: right; padding: 5px; border: 1px solid #bbe55f; margin: 20px 0 0 0; }

#comments ol.commentlist li { border-bottom: 1px dotted #bbe55f; padding: 5px 0; margin: 0 0 5px 0; }

.wpcf7 form { display: block; margin: 5px 10px; }
.wpcf7 form fieldset { border: none; padding: 0; margin: 0; }
.wpcf7 form fieldset legend { display: block; text-indent: -9999px; }
.wpcf7 form label { display: block; margin: 5px 0; color: #000; font-size: 18px; letter-spacing: -1px; font-weight: lighter; text-transform: lowercase; }
.wpcf7 form input, .wpcf7 form textarea { border: 1px solid #bbe55f; width: 250px; font-size: 15px; }
.wpcf7 form .input-submit { display: block; margin: 20px 0 5px 0; color: #09c; border: 1px solid #09c; font: 18px arial, helvetica, sans-serif; }
.wpcf7 form p { margin: 0; padding: 0; font-size: 11px; text-transform: lowercase; }

fieldset.cf_hidden {display: none;}
#cformsform {display: block; margin: 5px 10px;}
.cf-ol {margin: 0; padding: 0;}
.cf-ol li {margin: 0; width: 100%;}
.cf-ol label {display: block; margin: 5px 0; color: #000; font-size: 18px; letter-spacing: -1px; font-weight: lighter; text-transform: lowercase;}
.cf-ol input, .cf-ol textarea {width: 250px; border: 1px solid #bbe55f; width: 250px; font-size: 15px; font-size: 15px;}
#cformsform #sendbutton { display: block; margin: 20px 0 5px 0; color: #09c; border: 1px solid #09c; font: 18px arial, helvetica, sans-serif; }
.cf_hidden, .reqtxt, .emailreqtxt, .linklove {display: none;}
#cf_uploadfile-5 {border: none;}

/*=== bullseye sliders; now portable! ===*/

#slider { width: 100%; }
#slider-box { border-top: 1px solid red; cursor: pointer; }
#slider ul { float: left; width: 150px; margin: 0; margin-top: 6px; padding: 0; position: absolute; }
#slider li { float: left; padding: 0; margin: 0; }
#slider li a span { padding: 0 2px; text-indent: -9999px; cursor: pointer; }
.ui-tabs-hide { display: none; }
h4 {margin: 0; padding: 0; text-align: right; width: 100%; font-weight: lighter; font-size: 22px; text-transform: lowercase;}

#slider img { float: left; border: 1px solid #ff8a34; padding: 2px; margin: 25px 10px 15px 0; }
#slider .entry p img { border: none; margin: 0 10px 0 0; padding: 0; }
#slider p { padding: 20px 0 0 0; margin: 0; }
#slider p.extra a { float: right; margin: 0; }
#rightcol #slider p.extra a { float: right; margin: -15px 0 0 0; }
#rightcol #slider p.extra .a-block { font-size: 12px; font-weight: bold; color: #0099cc; }
#slider p.seeall { margin: 150px 0 0 0; }
#slider p strong { font-size: 20px; font-weight: normal; color: #000; text-transform: lowercase; }
#slider h5 { padding: 20px 0 0 0; margin: 0; }

#slider #gear ul {width: 700px;}
#slider #gear.rightcol ul { float: none; display: block; margin: 10px 0 0 70px; width: 150px; padding: 0; position: relative; }
#slider #gear ul li { float: left; width: 77px; text-align: center; margin: 0 10px; }
#slider #gear.rightcol ul li { display: block; float: none; margin: 0; }
#slider #gear ul li a { color: #000; font-size: 22px; }
#slider #gear ul li a img { display: block; border: none; padding: 0; float: none; }
#slider #gear.rightcol ul li a img { display: block; border: none; padding: 0; float: none; margin: 5px 0;  }
#slider #gear ul li a:hover img { border: none; }

h4.blog { border-bottom: 1px solid #c00; color: #c00; background: url(images/red-arrow.png) bottom left no-repeat; }
h4.events { border-bottom: 1px solid #000; color: #000; background: url(images/black-arrow.png) bottom left no-repeat; }
h4.gear { border-bottom: 1px solid #2babd8; color: #2babd8; background: url(images/blue-arrow.png) bottom left no-repeat;}
h4.competitions { border-bottom: 1px solid #ff8a34; color: #ff8a34; background: url(images/orange-arrow.png) bottom left no-repeat;}
h4.parties { border-bottom: 1px solid #fed82f; color: #fed82f; background: url(images/yellow-arrow.png) bottom left no-repeat;}
h4.newsletter { border-bottom: 1px solid #a35b83; color: #5f5390; background: url(images/purple-arrow.png) bottom left no-repeat; }

.red-tab {background: url(images/red.png) top no-repeat; width: 12px; height: 20px; display: block;}
.black-tab {background: url(images/black.png) top no-repeat; width: 12px; height: 20px; display: block;}
.teal-tab {background: url(images/teal.png) top no-repeat; width: 12px; height: 20px; display: block;}
.orange-tab {background: url(images/orange.png) top no-repeat; width: 12px; height: 20px; display: block;}
.yellow-tab {background: url(images/yellow.png) top no-repeat; width: 12px; height: 20px; display: block;}
.purple-tab {background: url(images/purple.png) top no-repeat; width: 12px; height: 20px; display: block;}

#miniblog p strong { font-size: 20px; font-weight: normal; color: #000; text-transform: lowercase; }

#gear.flicker-stuff { margin: 15px 0; }
#gear.flicker-stuff a { float: left; display: block; margin: 0 10px 10px 0; width: 151px; height: 151px; overflow: hidden; border: none; }
#gear.flicker-stuff a img, #gear.flicker-stuff a:hover img { border: none; }


/*=== the form ===*/
.wpcf7-response-output, .wpcf7-mail-sent-ok { color: #95bb42; font-size: 20px; font-weight: normal; text-transform: lowercase; }

/*=== footer ===*/

#footer ul { padding: 95px 0 0 20px; }
#footer li { display: inline; color: #fff; }
#footer li a { padding: 0 3px 0 0; color: #fff; font-size: 11px; }
#footer li a:hover { text-decoration: underline; }

/*=== clearfix ===*/
.clearfix:after {  
	content: ".";  
	display: block;  
	clear: both;  
	visibility: hidden;  
	line-height: 0;  
	height: 0;  
	}  

.clearfix { display: inline-block; }  
html[xmlns] .clearfix { display: block; }  
* html .clearfix { height: 1%; }

.single-blogs img {padding-right: 10px;}