html, body { height: 100%;}
/* END MEYER RESET */
/* ============================== */
/* ! TYPOGRAPHY */
/*=============================== */
html { font-family: Arial, Helvetica, sans-serif; font-size: 87.5%; line-height: 1.429; color: #494e54; }
h1, h2, h3, h4, h5, h6, #signup p strong, .jqueryslidemenu, legend { font-weight: 400; }
/* Headings */
h1 {color:#0F8562; margin-top:.25em; margin-bottom: .25em; clear:left; font-size: 2.429em;line-height: 1em;}
h2 {font-size: 130%; font-weight: 600; color: #222; text-decoration: none;}
h3, .h3 {font-size: 1.1em; font-weight: 400; color:#0F8562;}
h4 {font-size: 80%; color:#0F8562; border-bottom:1px solid #ccc; padding:1em; padding-top:4em; margin:-4em 0em 1em 0em; text-align: right; background: transparent url('../images/blockquote2.gif') no-repeat right top; }
h5 {font-size: 1.143em}
h6 {font-size: 1em}
#coursedetails h2 {line-height:2;}
#firstaidkits .kit > div > div, #firstaidkits .kit > div > div h2, #firstaidkits .kit > div > div a {color:white;}
#total div.last p span {color:#0F8562; font-weight: 600;}
/* Anchors */
a {outline: 0; color:#0F8562; text-decoration: none;}
a img {border: 0px; text-decoration: none;}
a:hover, a:active{text-decoration: underline;}
a.cboxElement:hover, a.cboxElement:active, a.no-effect:hover, a.no-effect:active{ background-color: transparent; }
/* Paragraphs */
p {margin-bottom: 1em;}
* p:last-child {margin-bottom: 0;}
strong, b {font-weight: bold;}
em, i {font-style: italic;}
::-moz-selection {background: #1D1D1D; color: #fff;}
::selection {background: #1D1D1D; color: #fff;}
/* Lists */
ul { list-style: outside disc; margin: 1em 0 1.5em 1.5em;}
ol { list-style: outside decimal;}
dl {margin: 0 0 1.5em 0;}
dt {font-weight: bold;}
dd {margin-left: 1.5em;}
/* Quotes */
blockquote {margin-top: 1em; padding: 1em 3em 1em 3em; background: transparent url('../images/blockquote.gif') no-repeat left top; }
cite {}
q {}
/* Tables */
table {margin: .5em auto 1.5em auto; width: 98%;}
/* Thead */
thead th, tbody th {padding: 0; text-align: left; color: #53c403; font-weight:normal;}
thead td {}
/* Tbody */
tbody td {padding: .2em 0em;}
.grid_12 tbody td {padding: 1em .2em;}
tbody th {}
tbody .alt td { background-color:#f1e9f1;}
tbody .alt th {}
/* Tfoot */
tfoot th {}
tfoot td {}
/* ============================== */
/* ! Layout for desktop version */
/* ============================== */
body { background: #fff;}
/***** Declare sprite image ****/
.sprite{ background: url('../images/sprite-master.png') no-repeat top left; display:block;}
/****** Z-index positioning **********/
header { z-index:80; }
nav { z-index:90; }
#slidemenu { z-index:100; }
#slidemenu ul { z-index:999; }
/****** spacing top & bottom & sides **********/
body.home #content { padding: 1em 0 1em 0; }
#content { padding: 0em 0 2em 0; }
body.inner div#content #listing div {margin-left: 0px; margin-right: 10px;margin-top:10px; margin-bottom:10px;}
body.inner div#content #newsDetail div {margin-left: 0px; margin-right: 10px;margin-top:10px; margin-bottom:10px;}
body.inner div#content div div{margin-left: 10px; margin-right: 10px;}
/****** HEADER **********/
.gradient {background: url('../images/gradient.jpg') repeat-x top center; height:6px;}
header { position: relative;}
header .row{overflow:visible;}
#logo, #slogan { text-align: center; background-color:fff; }
#social{text-align: center; background: #0F8562; -moz-border-radius: 0 0 10px 10px; border-radius: 0 0 10px 10px;}
#social p {color: #FFFFFF; font-size: 2.2em; display: block; float: left; margin: 2% 5%; width: 50%; text-align: left;}
#social p span {clear:left; display:block; font-size: 1.8em; margin-top:0px; line-height: 1em; font-size: 0.5em!important;}
#social ul{width:30%; margin:4% 8% 0 0; text-align:center; float:right;}
#social li{float:left; list-style:none; display:inline; margin-right:10%;}
#social li a{width: 42px; height: 42px; text-indent: -78977em; }
#social li a.spritefb{ background-position: -40px -450px;}
#social li a.spritemail{ background-position: -90px -450px;}
#social li a.spritefb:hover{ background-position: -40px -500px;}
#social li a.spritemail:hover{ background-position: -90px -500px;}
/**** HOME SLIDESHOW ****/
/*! http://responsiveslides.com v1.32 by @viljamis */
#slider3 {margin-bottom:.5em;padding-bottom:1em;}
.rslides { position: relative; list-style: none; overflow: hidden; width: 100%; padding: 0; margin: 0; }
.rslides li { position: absolute; display: none; width: 100%; left: 0; top: 0; }
.rslides li:first-child { position: relative; display: block; }
.rslides img { display: block; height: auto; width: 100%; border: 0; }
/*callbacks custom css for responsive slider*/
.callbacks_container {position: relative; width: 100%; }
.callbacks { position: relative; list-style: none; overflow: hidden; width: 100%; padding: 0; margin: 0; }
.callbacks li { position: absolute; width: 100%; left: 0; top: 0; }
.callbacks img {border: 1px solid #EEE; margin: 0px auto; display: block; position: relative; z-index: 1; height: auto; width: 980px; }
.callbacks .caption { display: block; position: absolute; z-index: 2; font-size: 200%; line-height: 200%;text-shadow: none; color: #fff; background: #000; background: rgba(0,0,0, .6); left: 0; right: 0; bottom: 0; padding-left:2em; margin: 0; max-width: none; }
.callbacks_nav { position: absolute; -webkit-tap-highlight-color: rgba(0,0,0,0); top: 50%; left: 0; opacity: 0.6; z-index: 3; text-indent: -9999px; overflow: hidden; text-decoration: none;
height: 51px; width: 38px; background: transparent url("../images/themes/themes.gif") no-repeat left top; margin-top: -45px; }
.callbacks_nav:active { opacity: 1.0; }
.callbacks_nav.next { left: auto; background-position: right top; right: 0; }
/* image shadow */
.callbacks img {-moz-border-radius: 10px;border-radius: 10px;-moz-box-shadow: 3px 3px 4px #c8c8c8;-webkit-box-shadow: 3px 3px 4px #C8C8C8;box-shadow: 3px 3px 4px #C8C8C8;
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#c8c8c8')";filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#c8c8c8');}
/****** MAIN NAV + DROP-DOWNS **********/
/* required for sticky nav**/
.sticky #mainMenu { position:fixed; top:0; left:0; width:100%;margin-left:0px!important;padding-left:0px!important; }
.sticky #mainMenu ul { margin:0px!important;}
/*end sticky nav*/
nav { overflow: visible!important; }
#slidemenu { background-color: #fff; list-style:none; border: 1px solid #ccc; border-right:none; border-left: none; background-color:#fff;}
#slidemenu ul li{ width:12.2%; float: left;}
#slidemenu ul li:first-child{ width: 8%;}
#slidemenu ul li:nth-child(2){ width: 17%;}
#slidemenu ul li:nth-child(6){ width: 22.5%;}
#slidemenu ul li:nth-child(7){ width: 15%;}
#slidemenu ul li ul li{ width: auto;}
#slidemenu ul li a{ color:#222; font-size:110%; line-height: 2em; text-align:center; padding: 0 0 0.25em 0em; margin-top:0.5em; margin-bottom:0.25em; text-transform: uppercase; }
/* Rounded corners on hover & active states */
#slidemenu ul li a:hover, #slidemenu ul li a.active, #slidemenu li:hover > a{ color: #0F8562;}
#slidemenu ul li a.activerootmenulink { color: #0F8562; }
/* Second level styles */
#slidemenu ul li ul{width: auto!important; margin-top: 0em;}
#slidemenu ul li ul li a{text-align:left; color: #222222; background-color: #FFFFFF; padding: 0px; margin: 0px; text-transform: none!important;}
#slidemenu li ul li a {font-size: 100%; line-height: 1.8em;}
#slidemenu ul li ul li a:hover, #slidemenu ul li ul li:hover > a { background: #0F8562 none; color: #fff; padding: 0px; margin: 0px; }
#slidemenu ul li ul li ul {left:170px; top:-1px;}
#slidemenu ul li ul li a img{display:none;}
#slidemenu ul li ul li {width: 100%!important;}
#slidemenu ul li ul li ul li a { line-height: 1.2em;}
#slidemenu > ul li:first-child ul {border: 1px solid #CCC;}
.jqueryslidemenu ul li:first-child ul li a {padding: 0 0 0 0.75em!important;}
/** CUSTOM MENU FOR COURSES **/
#slidemenu {padding-bottom:45px; position:relative;left: 0px;top: 0px;}
#slidemenu > ul {position:absolute; width:100%; height:100%;}
.jqueryslidemenu ul li:nth-child(2) ul{position:static!important;}
#slidemenu ul li:nth-child(2) ul {width: 160px!important;}
#slidemenu ul li:nth-child(2) ul li a {background: #0F8562; color: #FFFFFF;}
#slidemenu ul li:nth-child(2) ul li ul {display: block !important; overflow: visible!important;}
#slidemenu ul li:nth-child(2) ul li > a {border-left: 1px solid #CCC; border-right: 1px solid #CCC; line-height:1.3; width:175px!important; padding:4px 16px!important;}
#slidemenu ul li:nth-child(2) ul li ul li a {line-height: 1.3em;}
#slidemenu ul li:nth-child(2) ul li ul li a:hover {background: #E3F3EF;}
#slidemenu ul li:nth-child(2) ul li ul li a {border-left: 1px solid #CCC; border-right: 1px solid #CCC; background: #FFFFFF; color: #222222; line-height:1.3; width:177px!important; padding:4px 5px 4px 25px!important;}
/****** BREADCRUMBS **********/
#breadcrumbs { margin-top:0em; }
#breadcrumbs div { background-color:#e3f3ef; line-height: 3em; border-bottom: 1px solid #ccc;}
#breadcrumbs div div{ padding-left: 20px; padding-right: 20px; border-bottom: none;}
/****** HERO **********/
#hero {text-align: center; margin-top:1em;}
/****** MAIN CONTENT AREA **********/
#content{ background-color:#fff; }
body.home section#leftcol div {
list-style:none; /*display:inline;*/
width: 32.2%;
margin-right: 1.5%;
margin-bottom: 1em;
display:-moz-inline-stack;
display:inline-block;
zoom:1;
*display:inline;
vertical-align:top;
/* ------- gradient background ----- */
background: #d5ede7/* Old browsers */ url('../images/home-blocks-off.png') no-repeat center center; /* Old browsers */
/* ------- rounded corners ----- */
-moz-border-radius: 10px; /* Firefox */
border-radius: 10px;
/* ------- drop shadow ----- */
-moz-box-shadow: 3px 3px 4px #c8c8c8;
-webkit-box-shadow: 3px 3px 4px #c8c8c8;
box-shadow: 3px 3px 4px #c8c8c8;
/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#c8c8c8')";
/* For IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#c8c8c8');
}
body.home section#leftcol div:hover{
background: #eef4f3/* Old browsers */ url('../images/home-blocks-on.png') no-repeat center center;
/* ------- drop shadow ----- */
-moz-box-shadow: 3px 3px 4px #afaeae;
-webkit-box-shadow: 3px 3px 4px #afaeae;
box-shadow: 3px 3px 4px #afaeae;
/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#afaeae')";
/* For IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#afaeae');
/* ------- gradient background ----- */
}
body.home section#leftcol div div, body.home section#leftcol div div:hover {
background: transparent;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
/* For IE 8 */
-ms-filter: none;
/* For IE 5.5 - 7 */
filter: none;
}
body.home section#leftcol div:nth-child(3n) { margin-right: 0%;}
body.home section#leftcol div div{ width: auto; padding-bottom: 0em; float: none;}
body.home section#leftcol div p{}
body.home section#leftcol div h2, body.home section#leftcol div h2 a, h2.coursetitle a{ line-height: 3em; color: #494e54; text-decoration: none;}
body.home section#leftcol div h2 a:hover, h2.coursetitle a:hover{ color:#0F8562; }
div.admin_content_block {width: 100%!important;}
div.homeblock {height: 175px; width: 86%; margin: 7%; }
div.homeblock p a { padding-left: 0.5em; padding-right:0.5em }
div.homeblock p a:first-child { padding-left: 0em;}
/* Column Blocks Layout */
.columnlayout > div, #firstaidkits .kit { list-style:none; /*display:inline;*/ display:-moz-inline-stack; display:inline-block; zoom:1; *display:inline; vertical-align:top;} /* ------- gradient background ----- */
.columnlayout > div {width: 32.2%; margin-right: 1.5%; margin-bottom: 1em; background: #d5ede7/* Old browsers */ url('../images/home-blocks-off.png') no-repeat center center; /* Old browsers *//* ------- rounded corners ----- */ -moz-border-radius: 10px; /* Firefox */border-radius: 10px; /* ------- drop shadow ----- */-moz-box-shadow: 3px 3px 4px #c8c8c8;-webkit-box-shadow: 3px 3px 4px #c8c8c8;box-shadow: 3px 3px 4px #c8c8c8;/* For IE 8 */-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#c8c8c8')";/* For IE 5.5 - 7 */filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#c8c8c8');}
.columnlayout div:hover{background: #eef4f3/* Old browsers */ url('../images/home-blocks-on.png') no-repeat center center;/* ------- drop shadow ----- */ -moz-box-shadow: 3px 3px 4px #afaeae;-webkit-box-shadow: 3px 3px 4px #afaeae;box-shadow: 3px 3px 4px #afaeae;/* For IE 8 */-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#afaeae')";/* For IE 5.5 - 7 */filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#afaeae');/* ------- gradient background ----- */}
.columnlayout div div, .columnlayout div div:hover {background: transparent;-moz-box-shadow: none;-webkit-box-shadow: none;box-shadow: none;/* For IE 8 */-ms-filter: none;/* For IE 5.5 - 7 */filter: none;}
.columnlayout div:nth-child(3n) { margin-right: 0%;}
.columnlayout div div{ width: auto; padding-bottom: 0em; float: none;}
.columnlayout div h2, .columnlayout div h2 a { line-height: 3em; color: #494e54; text-decoration: none;}
.columnlayout > div > div {height: 270px; width: 86%; margin: 7%; }
.columnlayout > div > div p a { padding-left: 0.5em; padding-right:0.5em }
.columnlayout > div > div p a:first-child { padding-left: 0em;}
.columnlayout .admin_content_block > div {height: auto; width: auto; margin: 0;}
img.scba {float:right; width: 30%; max-width: 300px;}
/****** COURSE DETAILS *******/
h1.coursetitle { width: 70%;margin-right: 1%;display: block;float: left;}
h2.coursetitle {width: 70%;margin-right: 1%;display: block;float: left; line-height: 1.4em;}
h2.coursetitle a {line-height: 1.4em;}
h2.courseprice {width: 28%;display: block;float: left;clear: none; font-weight: 600; font-size: 175%; line-height: 2.5em; color:#0F8562;}
h2.courseprice span {font-size: 62%; font-weight: 400; color:#494e54; }
#coursedetails {border: 1px solid #CCC; margin:1em; margin-right: 0em; padding:1em;}
#coursedetails p {width: 100%;clear: left;}
#coursedetails ul {padding-top: 1em; margin-left: 1em; clear: both;}
#coursedetails li {float: left;width: 43%; margin-right:2%; margin-bottom: 0.5em;}
#coursedetails p a {padding-right: 1em; margin-left: 1.5em;}
#coursedetails p a:first-child {margin-left: 0px;}
#coursedetails h2.coursedates {margin-top: 30px;margin-bottom: 0px;font-size: 165%;width: 75%;margin-right: 5%;display: block;float: left;font-weight: 400;}
.even {background-color: #E3F3EF;}
/****** FIRST AID KITS *******/
#firstaidkits .kit {width: 23.5%; margin: 0.5%; border: 1px solid #CCC;}
#firstaidkits .kit:nth-child(2n) { }
#firstaidkits .kit > div { position: relative; overflow: hidden; cursor: pointer; height: 200px; }
#firstaidkits .kit > div > img { display:block; }
#firstaidkits .kit > div > div { position: absolute; top:82%; background:#0F8562; opacity:0.9; transition: transform .2s ease-in-out; padding: 1em; height:100%;}
#firstaidkits .kit > div > div p {margin-bottom: 0.5em; font-size: 90%;}
#firstaidkits .kit > div:hover > div { transform: translate3d(0px,-100px,0px);}
#firstaidkits .kit > p { background: #E3F3EF; text-align: center; margin-bottom: 1em; padding: 0 0.25em; width: auto; }
#firstaidkits .kit > p strong { padding-right: 0.2em; }
#firstaidkits .kit input { padding: 0.75em 0.25em; }
#firstaidkits .kit input.kitqty { width: 30px; }
#kitcontent {padding:2em;}
#kitcontent img#kitimage {float: right; max-width: 48%; padding: 0 0 1em 1em;}
#cboxClose, #cboxPrevious, #cboxNext {top:0; bottom: initial }
/****** TOTALS *******/
#total { background: #e3f3ef; padding: 1em; border: 1px solid #CCC; margin: 1em 0em }
#total div.first { }
#total div.last p {line-height:2em;}
#total div.last p span {float:right;}
/******** COURSE SCHEDULE *******/
table.courseschedule {width: 100%;}
/********* ABOUT GALLERY *********/
#gallery { display:table; margin:0em auto; border: 1px solid #CCC;}
#gallery li{/*float:left;*/ list-style:none; /*display:inline;*/ width: 31%; margin-right: 1em; padding-bottom: 1em; display:-moz-inline-stack; display:inline-block; zoom:1; /*float: left*/; *display:inline; vertical-align:top; border-bottom: 1px solid #CCC;}
#gallery p{ }
#table {display: table; border-collapse:collapse; border: 1px solid #CCC; margin-bottom:1em;}
.tablerow {display: table-row; border-bottom: 1px solid #CCC; }
.tablecell {display: table-cell; border-right: 1px solid #CCC; width:30.3%; padding:1.5%}
/******** BOOK COURSES *******/
.course {padding: 1em;}
.coursecontainer {border-bottom: 1px dotted #CCCCCC;}
.courseBook {margin-bottom: 1em; text-align: right;}
#register div, #payment div {padding:0;}
#register, #payment, #firstaidkits {border-top: 1px dotted #cccccc; margin-top: 2em; padding-top:1em;}
#payment img {float:right; height:35px; margin-right: 50px;}
#courseblock {float:right;}
/******** WHITE LABEL STYLING *******/
/*Primary Colour Elements*/
body.whiteLabel #social,
body.whiteLabel .gradient,
body.whiteLabel .courseBookbtn
{
background: #d33328;
}
body.whiteLabel h1,
body.whiteLabel h3,
body.whiteLabel .h3,
body.whiteLabel a,
body.whiteLabel #breadcrumbs a
{
color: #d33328;
}
/*Secondary Colour Elements*/
body.whiteLabel #firstFooter
{
background: #2d2d32;
}
/* Standard styling for all Trainers */
body.whiteLabel header .nfti-logo {
filter: gray; /* IE6-9 */
-webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
max-width: 300px;
float: right;
margin-top: 1.5em;
margin-right: 1em;
opacity: 0.9;
}
body.whiteLabel #logo { text-align: left; }
body.whiteLabel #leftcol { width: 100%; }
body.whiteLabel #breadcrumbs div, body.whiteLabel #coursedetails input.formfield, select { background: #f2f2f2; }
body.whiteLabel .courseBookbtn { color: #ffffff; margin-right: 0.5em; }
body.whiteLabel #firstFooter {
border-radius: 8px;
height: 235px;
}
body.whiteLabel .nfti-footer-logo {
max-width: 180px;
}
/****** RIGHTBLOCK **********/
.rightBlock { margin-bottom: 1em; }
.rightBlock ul { list-style:none; border-top: 5px solid #0F8562; margin:0 0 0 0; padding:0;}
.rightBlock ul li{ border-bottom: 1px solid #ccc;}
.rightBlock ul li a{ display: block; padding-top: 0.5em; padding-bottom: 0.5em;}
.rightBlock ul li a:hover{ background-color:#E3F3EF;}
.rightBlock ul.tips li{ display:block; width: 48%; margin-right: 1%; display:-moz-inline-stack; display:inline-block; zoom:1; /*float: left;*/ *display:inline; }
.social div.fb-like, .social a.twitter-share-button, .social div.g-plusone{ display:block; float:left;}
.fb-like{ margin-right: 10px; height: 20px; padding-top: 1px;}
.twitter-share-button{ width: 90px!important;}
.twitter-share-button, .g-plusone{ padding-top: 0px;}
/*iframe.fb_ltr div._5v4 { width: 300px!important;}
iframe.fb_ltr { width:300px !important; overflow:visible!important; display:inline-block!important;}*/
/****** FOOTER **********/
#firstFooter {background-position: 0px -570px; padding:0em 0 1em 0; margin: 0em auto; width: 980px; height: 305px;}
#firstFooter ul{list-style:none; display: block; float: left; color: #FFFFFF;}
#firstFooter ul li {margin-bottom: 5px;}
#firstFooter h2, #firstFooter a, #firstFooter p {color: #FFFFFF;}
#firstFooter h2 {margin: 20px 0;}
#firstFooter p {margin: 35px auto; width: 90%; float: center;}
.home address .fivecol p {font-size: 90%; clear:left; color:#AAAAAA;}
address ul {float: left; display: block; margin-left: 0px;}
address ul.eightcol li {float: left; list-style-type: none; text-align: center; padding-right:1em; padding-left:1em; border-right: 1px solid #ccc;}
address ul.footerlinks li {float: left; list-style-type: none; text-align: center; padding-right:0.65em; margin-right:0.65em; border-right: 1px solid #ccc;}
address .fourcol img {width: 70%;margin: 0 auto;display: block;}
address ul.threecol li {float: left; list-style-type: none; text-align: right; width: 100%;}
address ul li a {color: #0F8562; font-style: normal; width: 100%; float: left;}
address ul li:last-child {border: 0px}
address ul li:first-child {padding-left:0em;}
address ul.last {float:right;}
/********* FORMS *****************/
/*Contact Forms at bottom of page */
hr.contactdivider{ border: 2px solid #0F8562;}
div#contactbottom td input, div#contactbottom td textarea{display: block; margin-bottom: 1em; line-height: 2; padding-left: 0.5em; clear:left;-moz-border-bottom-colors: none;-moz-border-image: none;-moz-border-left-colors: none; -moz-border-right-colors: none;-moz-border-top-colors: none; background: url("../images/contact-corner.png") no-repeat scroll right top #E3F3EF;
border-color: -moz-use-text-color -moz-use-text-color #EEF1F8;border-radius: 3px 3px 3px 3px; border-style: none none solid;border-width: 0 0 1px;
font: inherit; margin-top: 0px;outline: 0 none; padding: 10px 15px 11px 10px;width: 90%; border-bottom: 1px solid #EFFCEF; }
#contactbottom input[type=checkbox] { display: inline-block; width: 10%;}
#contactbottom img{display:block; margin: 5px 0;}
#contactbottom table { width: 100%; float:left; }
#contactbottom td { width: 100%; float:left; }
#leftcol #contact table { width: 46%; float:left; }
#leftcol #contact div { width: 48.9%; float:left;margin-right:1%; }
#leftcol #contact table{ margin-right: 2%; border-right: 1px dotted #4c5357; }
.half {border-right: 1px dotted #4C5357;}
table.coursebooking td textarea, table.coursebooking td input, #contact input, #contact textarea, #corporatecontact input, #corporatecontact textarea, #contact select
{display: block; clear:left;-moz-border-bottom-colors: none;-moz-border-image: none;-moz-border-left-colors: none;
-moz-border-right-colors: none;-moz-border-top-colors: none; background: url("../images/contact-corner.png") no-repeat scroll right top #E3F3EF;
border-color: -moz-use-text-color -moz-use-text-color #EEF1F8;border-radius: 3px 3px 3px 3px; border-style: none none solid;border-width: 0 0 1px;
font: inherit; margin-top: 0px;outline: 0 none; padding: 10px 15px 11px 10px;width: 90%; border-bottom: 1px solid #EFFCEF;}
#contact select {width:100%;}
table.coursebooking td textarea:focus, table.coursebooking td input:focus, #contact input:focus, #contact textarea:focus, #contact select:focus, #corporatecontact input:focus, #corporatecontact textarea:focus {
background-color: #FFFFFF;
border-bottom-color: #EEEEEE;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset;
}
#contact textarea, #corporatecontact textarea {
height: 100px;
}
#contact input[type="checkbox"], #corporatecontact input[type="checkbox"] { margin: 3px 3px 3px 4px; width:auto; display:inline;}
table.coursebooking td input.formbutton, #contact input.formbutton, #corporatecontact input.formbutton, #contact select.formbutton, #contactbottom input.formbutton {
background-color: #0F8562;
background-image: none;
border: 1px solid #0D7052;
box-shadow: 0 1px 3px #69728A, 0 1px rgba(255, 255, 255, 0.15) inset, 0 -2px rgba(0, 0, 0, 0.1) inset;
color: #FFFFFF;
cursor: pointer;
display: inline;
font-weight: bold;
padding: 15px 0;
text-shadow: 0 -1px 1px #0D7052;
text-transform: uppercase;
width: 50%!important;
margin-right: 0 auto;
}
table.coursebooking td input.formbutton, #contact input.formbutton:hover, #corporatecontact input.formbutton:hover, #contact select.formbutton {
background-color: #0D7052;
width: 50%;
text-align: center;
}
iframe { width:100%;}
#contact div.righthalf {width: 50%; display: block; float: left;}
#contact div.righthalf p {margin: 0px;}
#corporatecontact {width:100%;}
#rightcol .captcha, #rightcol .captcha img {margin-left:0px!important;}
#rightcol #contact table, #rightcol #contact div{ width: 100%; float:left; }
#rightcol #contact input, #rightcol #contact textarea {padding: 5px 15px 6px 10px;}
#rightcol #contact input.formbutton {width:75%!important;}
#rightcol #contact textarea {height: 65px;}
#rightcol #contact .formcheckbox {font-size: 85%; float:left;}
#rightcol #contact .formcheckbox a img {padding-left:1em;}
#rightcol #contact .formcheckbox a:hover {opacity:0.8;}
#coursedetails input.formfield, select {padding: 8px; width: 90%; border:1px solid #cccccc; display: block; border-radius: 3px; background: #E3F3EF; color:#4d4d4d; font-size:1.1em; margin: 0 0 0.2em 0; }
#coursedetails label{line-height: 2; font-weight: 600;}
#coursedetails #register input#Title, #coursedetails #register input#DOB, #coursedetails #register input#Postcode, #coursedetails #payment input#CVV, #coursedetails #register select {width: 150px;}
#coursedetails #payment select {width:60px; display:inline; padding: 5px;}
.formfieldSelect { width:95% !important; }
.formfieldSelect option {
color:black;
}
/* TINYNAV DROP DOWN MWNU */
.tinynav {display: none;}
/***** BOOKING FORMS *****/
p.learnmorebooknow {text-align: right;}
table.coursebooking td {width: 100%;}
table.coursebooking td label {width: 100%; text-align: left; float:left;}
table.coursebooking td input {text-align: left;}
table.coursebooking td table {width: 100%; margin:0; float:left;}
table.coursebooking td select {width: 95%; text-align: left; float:left; height:30px;}
table.coursebooking td textarea { text-align: left;}
table.coursebooking td div.cbWrapper {text-align: left;line-height: 1.5em;background: #E3F3EF;height: 1.5em;padding: 0.3em 0;margin: 0.3em 0;width: 95%;}
table.coursebooking td input[type=checkbox]{float: left; width:10%; background: none; display:inline;height: 1em;margin: 0.25em 0;}
table.coursebooking td label span {width: 100%; float: left;}
table.coursebooking td label span label {width: 50%; float: left; display:inline;}
table.coursebooking td div.captchaWrapper {text-align: center;line-height: 5.5em;height: 5.5em;padding: 0.3em 0;margin: 0 auto;width: 51%;}
/*******************************
BUTTONS:
*******************************/
a.button, input.button{
background-color: transparent;
background-image: url('../images/sprite-master.png');
background-repeat:no-repeat;
display: block;
padding:0px;
line-height: 40px;
color:#fff;
font-weight: 600;
text-decoration:none;
text-shadow: 1px 1px 0px #a01317;
}
a#contact {
background-position: -550px -90px;
width: 110px;
height: 45px;
text-align:center;
}
a#booknow {
background-position: -550px -90px;
width: 110px;
height: 45px;
text-align:center;
display:inline-block;
}
a#booknow:hover{
outline: none; /* hide dotted outline in Firefox */
opacity: 0.8;
}
a#contact:hover{
outline: none; /* hide dotted outline in Firefox */
opacity: 0.8;
}
.courseBookbtn {
color: #ffffff;
background: #0F8562;
padding: 1em 2.4em;
border-radius: 5px;
cursor: pointer;
border: none;
margin: 1em 0;
font-size: 1em;
font-weight: 600;
text-transform: uppercase;
}
.courseBookbtn:hover {
text-decoration: none;
opacity: 0.8;
}
.btnSecondary {
color: #0F8562;
background: #E3F3EF;
padding: 0.75em 0.25em;
border-radius: 2px;
cursor: pointer;
border: 1px solid #0F8562;
margin: 1em 0;
font-size: 1em;
font-weight: 600;
text-transform: uppercase;
}
.btnSecondary:hover {
text-decoration: none;
background: #add5cb;
}
/*********************************************************/
/** EMAIL TEMPLATE STYLES **/
td.email-content {font-family: Arial, Helvetica, sans-serif; font-size: 87.5%; line-height: 1.429; color: #494e54;}
td.email-content h1 {color:#0f8561; margin-top:.25em; margin-bottom: .25em; clear:left; font-size: 2.429em;line-height: 1em;}
td.email-content h2 {font-size: 130%; font-weight: 600; color: #222; text-decoration: none;}
td.email-content h3 {font-size: 1.2em; font-weight: 400; color:#0F8562;}
td.email-content a {outline: 0; color:#0f8561; text-decoration: none;}
td.email-content a:hover {outline: 0; color:#0f8561; text-decoration: none;}
table#email {margin: 0em auto 0em auto; width:auto;}
/* Thead */
table#email thead th, table#email tbody th {padding: 0;}
table#email thead td {}
/* Tbody */
table#email tbody td {padding: 0em 0em;}
/**********************--------------------------clearfix*/
.clearfix:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
.clearfix {
display:inline-block;
}
.clearfix {
display:block; padding-bottom: 0px;
}
* html .clearfix {
height:1px;
}
/**********************--------------------------END clearfix*/
/******************************/
/*OLD WMS STUFF */
/******************************/
/* Admin Menu Begin */
.adminmenucontainer{width: 100%; background-color: #eeeeee;}
.adminmenu{width: 770px;}
.adminmenurow{text-align: center; height: 24px;}
.adminrootheading{line-height: 14px; display: block; color: #000000; padding: 6px; font-weight: bold; font-size: 13px;}
.adminrootitem{ text-align: center; background-color: #eeeeee; color: #000000; text-decoration: none; width: 20%; text-indent: 30px;}
a.adminrootmenulink{line-height: 14px; display: block; color: #000000; padding: 6px; text-decoration: none; font-weight: bold; font-size: 13px;}
.adminsubmenu{line-height: 14px; width: 180px; display: none; position: absolute; background-color: #eeeeee; margin: 0px; padding: 0px; text-decoration: none; list-style-type: none; z-index: 1000;}
.adminmenuitem{height: 24px; padding: 3px;}
a.adminmenulink{line-height: 14px; display: block; color: #000000; padding: 6px; text-align:left; text-decoration: none; font-size: 12px; text-indent: 10px;}
/* Admin Menu End */
/* Enabling Admin Menu Begin*/
/* .submenu{line-height: 14px; width: 152px; border: solid 1px #ffffff; display: none; position: absolute; background-color: #cccccc; margin: 0px; padding: 0px; text-decoration: none; list-style-type: none;}
.menuitem{line-height: 14px; display: block; text-align: left; font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; color: #ffffff; margin: 0px; padding: 0px; background-color: #cccccc; text-decoration: none; border-top: solid 1px #ffffff; border-bottom: solid 0px #3e2769; text-transform: uppercase;}
a.rootmenulink, a.rootmenulink:link, a.rootmenulink:visited, a.rootmenulink:active{line-height: 19px; display: block; color: #000000; padding-top: 0px; padding-bottom: 4px; padding-left:17px; padding-right:17px; text-align:left; border-top: 1px solid #ffffff; border-bottom: 1px solid #ffffff; text-decoration: none; font-size: 13px;}
a.rootmenulink:hover{}
a.activerootmenulink, a.activerootmenulink:link, a.activerootmenulink:visited, a.activerootmenulink:active{line-height: 19px; display: block; color: #000000; padding-top: 0px; padding-bottom: 4px; padding-left:17px; padding-right:17px; text-align:left; border-top: 1px solid #ffffff; border-bottom: 1px solid #ffffff; text-decoration: none; font-size: 13px;}
a.activerootmenulink:hover{}
a.menulink, a.menulink:link, a.menulink:visited, a.menulink:active{line-height: 14px; display: block; height: 100%; font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; background-color: #cccccc; color: #000000; padding-left: 8px; padding-right: 4px; padding-top: 4px; padding-bottom: 4px; font-weight: normal; font-size:11px; text-decoration: none;}
a.menulink:hover{text-decoration: underline; background-color: #cccccc;}*/
/* Enable Admin Menu End */
div.admin_content_block
{
/*border: 1px solid pink; */
width: 100%!important;
}
.cke_button_Kook_Gallery .cke_icon,.cke_button_Kook_Templates .cke_icon,.cke_button_Kook_Forms .cke_icon,.cke_button_Kook_Slideshows .cke_icon,.cke_button_Kook_Embed .cke_icon{ display: none !important;}
.cke_button_Kook_Gallery .cke_label,.cke_button_Kook_Templates .cke_label,.cke_button_Kook_Forms .cke_label,.cke_button_Kook_Slideshows .cke_label,.cke_button_Kook_Embed .cke_label{display: inline !important;}
/***** ABOUT US NON-MOBILE VIEW *****/
.colStaffDetails
{
margin:15px;
float:left;
width:46%;
min-height:160px;
}
.colStaffImage
{
margin:15px;
float:left;
width:46%;
text-align:center !important;
min-height:200px;
background-color: #E3F3EF;
}
.colStaffImage img
{
margin:15px;
float:none;
border: 1px solid #999999;
}
/* ============================= */
/* ! Layout for tablet portrait version */
/* ============================= */
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: portrait) {
}
/* ============================= */
/* ! Layout for mobile version */
/* ============================= */
@media handheld, only screen and (max-width: 767px) {
body {
}
/** TYPOGRAPHY CHANGES **/
h1 { font-size:180%;}
* p:last-child {margin-bottom: 1em;}
blockquote {padding: 1em 1em 1em 2em; }
/*re-arrange header elements */
header {margin-bottom: 1em;}
#logo { width: 60%; float:left; padding-right: 0px; padding-left: 10px;}
#social{ width: 25%; float:right; -moz-border-radius: 0 0 5px 5px!important; border-radius: 0 0 5px 5px!important; padding: 0 0.5em 0.5em 0.5em; margin-right:5px;}
#social p, #social p a { font-size: 90%; display: block; float: none; margin: 0; width: auto; color:#fff!important;}
#social p span {display: none; }
#social ul{ clear: left; width:auto; margin:0; float:none;}
#social li{float:left; list-style:none; display:inline; margin-right:10px!important;}
#social li:last-child{margin-right:0;}
#social li a{width: 30px; height: 32px; text-indent: -78977em; }
#social li a.spritefb{ background-position: -200px -450px;}
#social li a.spritemail{ background-position: -240px -450px;}
#social li a.spritefb:hover{ background-position: -200px -500px;}
#social li a.spritemail:hover{ background-position: -240px -500px;}
.onecol{ display: none; }
/* HOME PAGE SLIDESHOW */
.callbacks {width: 95%!important; margin: 0 auto;}
.callbacks img {width: 98%!important;}
/* FOR TINYNAV DROP DOWN MENU */
#mainMenu { padding-bottom: 0.5em; border-bottom: 1px solid #CCC;}
.tinynav {display: block; width: 95%; margin: 0 auto; height: 40px; font-size: 1em; margin-bottom:1em}
.tinynav .selected {background: #000000;}
.tinynav .selected {}
#nav { display: none }
#slidemenu ul { display: none }
#slidemenu {border: 0px; margin: 1em auto 0 auto; padding: 0;}
/****** BREADCRUMBS **********/
#breadcrumbs { display: none; }
/*hero */
#hero div{ width:95%; margin-left: auto; margin-right: auto;}
/*home blocks*/
body.home section#leftcol div, .columnlayout > div { list-style:none; width: 95%; margin-right: 0%; }
div.homeblock, .columnlayout > div > div {height: auto; padding-right: 10px; }
/** COURSE DETAILS SECTIONS **/
#coursedetails {margin:0em; border-top:none; border-right:none; border-left: none; margin-bottom:1em; padding:0; padding-bottom: 0em;}
#coursedetails li {width: 100%; margin-right:0;}
#coursedetails p{}
h2.coursetitle {width: 100%; margin-right: 0;}
h2.courseprice {width: 100%;}
/****** FIRST AID KITS *******/
#firstaidkits .kit {width: 98%; margin: 1%; border: 1px solid #CCC;}
#firstaidkits .kit > div { height: auto; }
#firstaidkits .kit > div > img { display:block; }
#firstaidkits .kit > div > div { position: relative; font-size: 80%; }
#firstaidkits .kit > div:hover > div { transition: none; transform:none}
* #firstaidkits .kit > p:last-child { margin-bottom: 0em;}
#kitcontent { padding: 1em;}
#kitcontent img#kitimage {float: none; max-width: 100%; padding: 1 0 1em 0em;}
/** ABOUT US **/
#table {display: block; border-collapse:collapse; border: none; margin-bottom:0em;}
.tablerow {display: block; border-bottom: none; }
.tablecell { display: block; width:98%; border: 1px solid #CCC; margin-bottom:1em;}
img.scba {width: 70%;float: none;display: block;margin: 0 auto;}
/** CONTACT US **/
#leftcol #contact table, #leftcol #contact div {width: 98%; float: left; border:0px;}
#contact table { margin-right: 0%; border-right: none;}
.half {border-right: none;}
/***Course Details & Booking ***/
td.courseschedulebook p a {color: #DC2529;}
table.coursebooking td input[type=checkbox]{margin-left: 20%!important; }
table.coursebooking td label span label {width: 70%;}
/***Book Course ***/
#payment img {float:none;margin-right: 0;}
#courseblock {float:none;}
/*first footer elements*/
/****** FOOTER **********/
#firstFooter {background: transparent url("../images/bg-mobile.jpg") repeat left top; padding:0em 0 1em 0; margin: 0em auto; width: 100%; height: auto;}
#firstFooter div{ width:100%}
#firstFooter h2, #firstFooter a, #firstFooter p {color: #FFFFFF;}
#firstFooter h2 {margin: 20px 0;}
#firstFooter p { clear: left; padding-right:20px;}
address ul li {width: 100%!important; border-right:none!important; padding-left:0em!important; text-align: center;}
address ul.threecol li a {text-align:center;}
}
/* ============================= */
/* ! Layout for mobile portrait version */
/* ============================= */
@media handheld, only screen and (max-width: 767px) and (orientation: landscape) {
/****** FIRST AID KITS *******/
#firstaidkits .kit {width: 47%; margin: 1%; border: 1px solid #CCC;}
}
/* ========================================== */
/* ! Provide higher res assets for iPhone 4 */
/* ========================================== */
@media only screen and (-webkit-min-device-pixel-ratio: 2) {
/* .logo {
background: url(logo2x.jpg) no-repeat;
background-size: 212px 303px;
}*/
}
/* scroller */
.blink_me {
-webkit-animation-name: blinker;
-webkit-animation-duration: 1s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
-moz-animation-name: blinker;
-moz-animation-duration: 1s;
-moz-animation-timing-function: linear;
-moz-animation-iteration-count: infinite;
animation-name: blinker;
animation-duration: 1s;
animation-timing-function: linear;
animation-iteration-count: infinite; }
.scrollerImage1
{
height:80px;
/*max-height:90px;*/
padding-left:50px !important;
padding-right:50px !important;
max-width:300px;
margin-top:5px !important;
}
.scrollerImage2
{
height:60px;
/*max-height:90px;*/
padding-left:50px !important;
padding-right:50px !important;
max-width:300px;
margin-top:15px !important;
}
#makeMeScrollable1
{
margin-left:auto;
margin-right:auto;
width:100%;
max-width:940px;
height: 90px;
position: relative;
margin-bottom:10px;
}
#makeMeScrollable2
{
margin-left:2%;
margin-right:2%;
width:56%;
height: 90px;
position: relative;
margin-bottom:10px;
max-width:1100px;
float:left;
border:2px solid #999999;
}
/* Replace the last selector for the type of element you have in
your scroller. If you have div's use #makeMeScrollable div.scrollableArea div,
if you have links use #makeMeScrollable div.scrollableArea a and so on. */
#makeMeScrollable1 div.scrollableArea img, #makeMeScrollable1 div.scrollableArea a, #makeMeScrollable2 div.scrollableArea img, #makeMeScrollable2 div.scrollableArea a
{
position: relative;
float: left;
margin: 0;
padding: 0;
/* If you don't want the images in the scroller to be selectable, try the following
block of code. It's just a nice feature that prevent the images from
accidentally becoming selected/inverted when the user interacts with the scroller. */
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
vertical-align:middle !important;
}
@-moz-keyframes blinker {
0% {
opacity: 1.0; }
50% {
opacity: 0.0; }
100% {
opacity: 1.0; } }
@-webkit-keyframes blinker {
0% {
opacity: 1.0; }
50% {
opacity: 0.0; }
100% {
opacity: 1.0; } }
@keyframes blinker {
0% {
opacity: 1.0; }
50% {
opacity: 0.0; }
100% {
opacity: 1.0; } }
/* smoothdivscroller */