/*

 * Compressor:

 https://cssminifier.com/



 */



/* content box */

html {height:100%;}

body {

	height:100%;width:100%;padding:0;margin:0;

	/* Reuben, 27-03-2023 removed overflow x as believe no longer required */

	/*AJ Reinstated 19-04-23 - As it resolves horizontal scrollbar issue caused by -1rem .row margin CSS*/

	overflow-x:hidden;

}



/* original */

body { margin: 0px; padding: 0px; }



/*

    Colorbox Core Style:

    The following CSS is consistent between example themes and should not be altered.

*/

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:999999; overflow:hidden;}

#cboxWrapper {max-width:none;   }

#cboxOverlay{position:fixed; width:100%; height:100%; }

#cboxMiddleLeft, #cboxBottomLeft{clear:left;}

#cboxContent{position:relative;}

#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;  }

#cboxTitle{margin:0;}

#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}

#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}

.cboxIframe{width:100%; height:100%; display:block; border:0;}

#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}



/*

    User Style:

    Change the following styles to modify the appearance of Colorbox.  They are

    ordered & tabbed in a way that represents the nesting of the generated HTML.

*/



#cboxOverlay{ background: #222; opacity: 0.9; filter: alpha(opacity = 90);}

#cboxOverlay.hideOverlay{display:none!important}/*AJ customisaion option in style modal popup*/

#cboxOverlay.hideOverlayandClose{display:none!important}/*AJ customisaion option in style modal popup*/

#colorbox.hideOverlayandClose #cboxLoadedContent {margin-bottom: 0;}

#colorbox.hideCloseButton #cboxLoadedContent {margin-bottom: 0;}

#colorbox{outline:0;}



#cboxContent{background:#fff; overflow:hidden; border: 6px solid white;  }

.cboxIframe{background:#fff;}

#cboxError{padding:50px; border:1px solid #ccc;}

#cboxLoadedContent{margin-bottom:30px;  color: #222;  }

#cboxTitle{position:absolute; bottom:4px; top: auto; left:0; text-align:center; width:100%; color:#949494;}

#cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}

#cboxLoadingOverlay{background:url(/uploads/js/colorbox_1_4_33/example1/images/loading_background.png) no-repeat center center;}

#cboxLoadingGraphic{background:url(/uploads/js/colorbox_1_4_33/example1/images/loading.gif) no-repeat center center;}



/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */

#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }



/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */

#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}



#cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}

#cboxPrevious{position:absolute; bottom:0; left:0; background:url(/uploads/js/colorbox_1_4_33/example1/images/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}

#cboxPrevious:hover{background-position:-75px -25px;}

#cboxNext{position:absolute; bottom:0; left:27px; background:url(/uploads/js/colorbox_1_4_33/example1/images/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}

#cboxNext:hover{background-position:-50px -25px;}

#cboxClose{position:absolute; bottom:0; right:0; background:url(/uploads/js/colorbox_1_4_33/example1/images/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}

#cboxClose:hover{background-position:-25px -25px;}

.cmsPopupModal #cboxClose { bottom: auto; top: 0; }





.colorboxError, .colorboxMessage { min-width: 200px; min-height: 40px; }

.colorboxError { color: red; }

.colorbox

#cboxLoadedContent { padding: 2px; }

#cboxLoadedContent .is-section { height: 100%;}



@media (max-width: 480px) {

	/* hide the image number counter on small windows... */

 	#cboxCurrent { display: none !important; }

}





/*make colourbox a decent size minimum  doesn't work well in latest colourbox*/

img.cboxPhoto { min-height: 160px; min-width: 160px;}





#homePageWidget { margin-left: 10px; margin-bottom: 10px; text-align: left;}

#homePageWidget h3 { margin: 0px; padding: 3px 0px 3px 6px; border-bottom: dashed 1px #999999; background-color: #CCCCCC; color: #333333; font-size: 12px; font-weight: bold;}



.red { color: red; }

.blue { color: blue; }

.green { color: green; }



.noDecoration { text-decoration: none; border: none; background: none; color: inherit; }
.stretchElement{position:initial;}
.stretchElement:after {position: absolute;top: 0;right: 0;bottom: 0;left: 0;z-index: 45;content: "";} /*allow element boundaries to scale outside element e.g buttons*/


/* required minimum for banner area */

#cmsBannerSlideDiv img { width: 100%; }

.animatedSlideWrapInner li:gt(0) { display: none; }

#cmsBannerContainer {  position:relative; overflow:hidden; margin:0; padding:0; }

#cmsBannerOverlay {bottom:0;z-index: 100; position:absolute; top:0; height: 100%; width: 100%; margin:0; padding:0;}



/*

img 100% causing many issues, but it's important it remains

it is not good to prefix the img with #content, as it needs to be replciated in every img reference...

*/



img {

	max-width: 100%;

	/*image-orientation: none; ignore EXIF*/

}

p>img[align="right"],p>img[align="left"] { max-width: 40%; }



/* fix a general template issue with a 1px td cell */

#container table td .banner img { max-width: none; }



/*allow customer nav buttons to auto expand to their full pixel width, in a horizontal menu , but not going crazy in a vertical menu*/

#nav img, #catnav img {   max-width:250px; }



/*to ensure it pops up over others, needs be position relative or absolute */

#menu ul ul, #nav ul , #catnav ul {   z-index: 9998;}



img.pagebanner{width:100%;max-width:none;}



body .hide,body .hidden,body .cmsHidden,.cmsHomePage .hideForHome,.ProductList .hideForProductList,

body .row.hide,body .row.hidden,body .row.cmsHidden{

	display:none!important;

}





@media (min-width: 560px)  {

	.hideForDesktop, .mobile,.cmsHomePage.hideForHome {

		display:none;

	}

  body .is-wrapper > div.is-sticky,

  body .is-sticky{

    position:sticky;

    top:0;

  }

  body .is-wrapper > div.is-sticky, .is-sticky{

    /*z-index:50;might need adjusting per site based of  template css, is-wraooer rule applied to overrise z-index:auto on body .is-wrapper > div*/

		z-index:101; /*Updated as product zoom js z-index:99, Banner Cycle2 Images = z-index:100 */

  }



}





@media print {

	.noPrint {

	    display:none;

	}

	/* default layout for product tabs printing to show all information */

 	#productTabUL { display: none; }

	#product-moreinfo .productTabContent { display: block !important; }

	#product-moreinfo .productTabContent h3.printTabHeading { display: block !important; }

}



@media (min-width: 560px) {



	.floatRight50PC {

		float:right;

		width: 49%;

		margin-left: 1%;

		display:block;

	}

	.floatLeft50PC {

		float:left;

		width: 49%;

		margin-right: 1%;

		display:block;

	}



	.floatRight25PC {

		margin: 0%;

		float:right;

		width: 24%;

		display:block;

	}

	.floatLeft75PC {

		margin: 0%;

		float:left;

		width: 74%;

		display:block;

	}



	.floatRight33PC {

		margin: 0%;

		float:right;

		width: 33%;

		display:block;

	}

	.floatLeft66PC {

		margin: 0%;

		float:left;

		width: 66%;

		display:block;

	}

	.floatLeft40PC {

		margin: 0%;

		float:left;

		width: 39%;

		display:block;

	}

	.floatRight60PC {

		margin: 0%;

		float:right;

		width: 60%;

		display:block;

	}

	.floatLeft20PC {

		margin: 0%;

		float:left;

		width: 20%;

		display:block;

	}

	.floatRight80PC {

		margin: 0%;

		float:right;

		width: 79%;

		display:block;

	}



}





.cmsFloatContainer {

	clear: both;

	overflow: hidden;

}



.clearfloat {

	float: none;

	clear: both;

	margin: 0;

	padding: 0;

	border: none;

	font-size:1px;

}





.ajaxErrorMessage {

	display:block; position:absolute; background-color:#600; color:white; padding: 4px; font-size: 11pt; border: 1px solid #933; text-align: left;

}

.validateHasErrors {

	border: 1px solid #933; background-color: #fee;

}





 	table.cmsFormTable {  border-spacing: 2px; width:100%; margin:0; }

	.cmsFormTable td {     vertical-align: top;  box-sizing: border-box;}



/*.row table td{padding:12px;} default snippet table padding matches editor*/



/*default snippet table padding matches editor -

  exclude template .row as tinymce is affected when looking at live site*/

#cmsPageContainer	.row table td{padding:12px;}

#cmsPageContainer	.row.lastSavedWithTinyMCE table td{padding:0;} /*replicate tinymce when contains .row element but tinymce*/



	tr.topprompts td, .topprompts { font-size: 90%;  padding: 2px; vertical-align: bottom; }



	.cmsFormTable>tr>td:first-of-type,

	.cmsFormTable>tbody>tr>td:first-of-type { min-width: 100px; max-width: 200px; width: 25%; font-size: 80%;  }

	.cmsFormTable>tbody>tr>td:first-of-type sup { font-size: 100%;}



	.cmsFormTable tr>td input:not([type]),

	.cmsFormTable tr>td input[type="text"],

	.cmsFormTable tr>td input[type="file"],

	.cmsFormTable tr>td input[type="email"],

	.cmsFormTable tr>td input[type="password"],

	.cmsFormTable tr>td textarea ,

	.cmsFormTable tr>td select,

	.cmsFormTable tr>td .dynaCombo

	{

		width: 100%;

		min-width: 80px;

		box-sizing: border-box;

		padding: 4px;

	}



	.cmsFormTable tr>td input[type="number"],

	.cmsFormTable tr>td input[type="decimal"],

	.cmsFormTable tr>td input.validateNumber,

	.cmsFormTable tr>td input.validateColour,

	.cmsFormTable tr>td input.validateTime,

	.cmsFormTable tr>td input.validateDateTime,

	.cmsFormTable tr>td input.validateDate

	{width: 60%; min-width: 40px; }



	.cmsFormTable tr>td .dynaCombo input[type="text"] { width: 83%;}

	.cmsFormTable tr>td .dynaCombo input[type="button"] { width: 15%;}



	.cmsFormTable tr>td input.widthauto,

	.cmsFormTable tr>td select.widthauto { width: auto; min-width: 10px;}



@media only screen and (min-width: 1200px) {

	table.cmsFormTable { width:100%; border-spacing: 8px; }

}





.cmsFormTable tr>td .dynaCombo { padding: 0px;	}

.dynaCombo { display: inline-flex; }





.pageVerySocialShare {margin: 7px 0;}





.input300w { max-width: 300px; }



.input200w { max-width: 200px; }



.input100w { width: 50%; max-width:100px;}



.textarea400w { max-width: 400px; }





#securePage { max-width: 600px; margin: auto;}



.warning, .error { border: 1px solid red; padding: 1%; margin: 2% 1%; }

.actionFeedback { border: 1px solid green; padding: 1%; margin: 2% 1%; }



.formDIV { margin-top:5px; margin-bottom:7px;}



.cmsFormElements {

	max-width: 960px;

	overflow: auto;

	box-sizing: border-box;

}

.cmsFormElements {

	box-sizing: border-box;

	padding: 0;

	margin: 1%;

}

.cmsFormElement {

	box-sizing: border-box;

	overflow: hidden;

	margin: 1%;

}



.cmsFormPrompt {

	font-size: 75%;

	display: inline-block;

	float: left;

	width:25%;

	margin: 0;

	box-sizing: border-box;

}





.cmsFormData {

	display: inline-block;

	float: left;

	width:75%;

	margin: 0;

	box-sizing: border-box;

}







.cmsFormDataNoPrompt {

	clear: both;

	display:block;

}



.cmsFormData input,

.cmsFormData textarea,

.cmsFormDataNoPrompt textarea,

.cmsFormData select

{

	vertical-align: middle;

	width: 100%;

	box-sizing: border-box;

	padding: 4px;

}



.cmsFormData button

{

	vertical-align: middle;

	box-sizing: border-box;

	padding: 4px;

}



.cmsFormData input[type="image"],

.cmsFormData input[type="reset"],

.cmsFormData input[type="submit"],

.cmsFormData input[type="button"] ,

.cmsFormData input[type="radio"],

.cmsFormData input[type="checkbox"],

.cmsFormData input.widthauto, input.widthauto,

.cmsFormData select.widthauto, select.widthauto,


select.qtyTextField,
input.qtyTextField,
.autowidth input,
.autowidth select
{

	box-sizing: border-box;

	width: auto;

	max-width: 100%;

}



.cmsFormElement .cmsFormDataWithLookup input

{

	width: 75%;

}



/* then fix these back to standard width*/



.cmsFormElement input.input100w, .cmsFormElement select.input100w  { width: 80%; min-width:100px; max-width: 200px; }



.cmsFormElement input[type="button"] ,

.cmsFormElement input[type="image"] ,

.cmsFormElement input[type="submit"] ,

.cmsFormElement input[type="file"] ,

.cmsFormElement input[type="reset"] ,

.cmsFormElement input[type="checkbox"] ,

.cmsFormElement input[type="radio"],

.cmsFormData input.widthauto,

.cmsFormData select.widthauto

 {

 	width: auto;

 	height: auto;

 	max-width: 98%;

 }



.cmsFormOptions { width: 68%; float: left; }

.cmsFormActions { float: right; text-align: right;  }

.cmsFormActions input[type="submit"] { font-size: 130%;}



.cmsCheckBox { text-align: center; }



body .cmsFormElementsStacked .cmsFormElement,

body .cmsFormElementsStacked .cmsFormPrompt,

body .cmsFormElementsStacked .cmsFormData

{

	display: block; width: 100%; float: none; margin: 0;

}



body .cmsFormElementsCompressed .cmsFormElement,

body .cmsFormElementsCompressed .cmsFormPrompt,

body .cmsFormElementsCompressed .cmsFormData,

body .cmsFormElementsCompressed .cmsFormElement div {

	display: inline-block; width: auto; float: none;

}

body .cmsFormElementsCompressed .cmsFormData input {

	max-width: 150px;

}

body .cmsFormElementsCompressed .cmsFormActions {

	display: inline-block; width: auto; float: none;

}

body .cmsFormElementsCompressed .cmsFormElements {

	max-width: 100%;

}




/*

	accordians used faq, product tabs, and search filters.

*/

		.accordianItem { position:relative; border-bottom: 1px solid #999; }
		.revealable {display: none !important; }
		.clickToReveal { cursor: pointer; }
		h3.clickToReveal { margin: 0; padding: 10px 0; }
		.cmsRevealIcon { position:absolute; right:0; top:0; cursor: pointer; }
		.accordianItem.revealTheRevealable .revealable {display: block !important; }
		.cmsRevealIcon::before { content: 'arrow_drop_down'; }
		.revealTheRevealable .cmsRevealIcon::before { content: 'arrow_drop_up'; }


/*
	accordianSection used for input field relevant sections,
	and accordian outer wrapper (Simple filter button)
*/

.accordianSection { position:relative;}
.clickToRevealSection { margin: 0; padding: 0; cursor: pointer;}

.sectionAutoReveal,
body .is-section.sectionAutoReveal { display:none; } /*strengthen rule to override display:table; but do not use important*/


.accordianSection.revealTheRevealable>.sectionAutoReveal {display: block !important; }


.cmsPageList, .CategoryList, .ProductList {
	clear: none;
}



/*Widget Styling - have icon+text wrap tidily*/



.toyTablePhone a{

    display: inline-flex;

    align-items: center;

    gap: 6px;

		margin-left: 6px;

}

.toyTablePhone a:first-child{

	margin-left: 0;

}







/* sliders should have no slides displayed by default... earliest load */



#cmsCycle2 > img:nth-child(n+2) { display:none; }

.cmsDivSlider > li:nth-of-type(n+2) {display:none;}

.slick-slide{display:none;}





.cmsTree ul {

	list-style: none;

	margin-left: 0;

	padding-left: 0;

	margin-bottom: 10px;

}

.cmsTree ul ul {

	margin-left: 5%;

}



.cmsTree LI {

	margin: 1%;

}





.list-style-none, .list-style-default, .list-style-slide , .ajax-stream-images, .list-style-content-menu,

.list-style-none li, .list-style-slide li, .ajax-stream-images li , .list-style-content-menu li {

	list-style: none;

	margin: 0;

	padding: 0;

}



.list-style-3col, .list-style-4col, .list-style-bizcard, .list-style-inline, .list-style-5col, .list-style-6col, .list-style-2col, .list-style-table,.list-style-grid {

	overflow: hidden;

	list-style: none;

	margin: 0;

	padding: 0;

	clear: both;

	box-sizing: border-box;

}



.list-style-2col{

    grid-gap: max(1rem , 4vw);

    grid-template-columns: 1fr 1fr;

    display: grid;

}



.list-style-grid {

  display: grid;

  grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));

  grid-gap: 2rem;

}





.cmsItemListStockCount { font-size: 70% ; }





 .cmsPageList, .CategoryList,.ProductList { clear: both; }



	.list-style-default, .list-style-fullimage li {

		margin-bottom: 8px;

	}



	.list-style-inline li {

		display: inline-block;

	}



@media (min-width: 640px) {



	.list-style-bizcard li {

		display: inline-block;

		float: left;

		width: 48%;

	}



	.list-style-bizcard li:nth-child(2n+1) { margin-right: 1%;  clear: both; }

	.list-style-bizcard li:nth-child(2n+2) { margin-left: 1%; }



	.list-style-2col li {

		width:100%; /*using css grid*/

	}



	.list-style-3col li {

		width: 33.3%;

		display: inline-block;

		float: left;

	}

	.list-style-4col li {

		width: 25%;

		display: inline-block;

		float: left;

	}

	.list-style-5col li {

		width: 20%;

		display: inline-block;

		float: left;

	}

	.list-style-6col li {

		width: 16%;

		display: inline-block;

		float: left;

	}



	.list-style-3col li:nth-child(3n+4),

	.list-style-4col li:nth-child(4n+5),

	.list-style-5col li:nth-child(5n+6),

	.list-style-6col li:nth-child(6n+7){

	clear:both;

	}







	.list-style-table .cmsItem > div {width: 20%; float:left; }

	.list-style-table .cmsItem div.cmsTitleAndText {width: 39%; margin-left: 1%;  }

	.list-style-table .cmsItem div.cmsImage {width: 15%; }

	.list-style-table .cmsItem div.cmsPrice {width: 15%; }

	.list-style-table .cmsItem div.cmsQuantity {width: 10%; }

	.list-style-table .cmsItem div.cmsEnquiry {width: 20%; }

	.list-style-table .cmsItem div.cmsImage {width: 15%; }

	.list-style-table .qtyCombo { width: 100%; display:block; }

}









/*overflow hidden allows for increased height to accept right aligned images, with no scroll bar... */

.cmsItem {overflow: hidden; margin: 2px; max-width: 2000px; box-sizing: border-box; position: relative; }

.cmsItem>div { margin: 0; }

.cmsSmallPrint { font-size: 80% }

.cmsItem .cmsEnquiry { margin: 0; text-align: right; }

.cmsItem .cmsImage { margin:0; margin-bottom: 5px; }  /* just disabled position relative on this one */

.cmsItem .cmsTitle { margin-bottom: 5px; /* font-weight: bold; */ }   /* TODO: Reuben thinks this should be bold by default... */

.cmsItem .cmsText { font-size: 80%; margin-bottom: 5px; }

.cmsItem .cmsItemAdditional { font-size: 80%; margin-bottom: 5px; }


/* margin 0 because it creates scroll bars in the cmsItem...*/

.cmsImage a { max-width: 320px; margin:auto; }

.cmsImage img { max-width: 100%; height:auto; max-height:320px ;  margin: 0;  }



.cmsImage.backgroundImage a{

  max-width:none;

  width:100%;

  margin:0;

}





.cmsItem .floatRight {

	float: right;

	margin-left: 5px;

	margin-bottom: 5px;

	max-width: 33%;

}

.cmsItem .floatRight img { max-width:160px; max-height:160px ;  width: 100%; }



.list-style-content-menu .cmsItem { border: 1px solid #999; padding: 6px; }



.list-style-content-menu a { margin: 1%;  text-decoration: none; }



.list-style-slide .imgSlide img, .list-style-slide .imgSlide a img { width: 100%; margin: 0; border: 0; }

.list-style-slide .cmsItem { width:100%; background: #eee; max-height: 350px; overflow: hidden; }

.list-style-slide .cmsItem .cmsImage {float:left; width: 60%; margin: 0; max-height: 348px; overflow: hidden; }

.list-style-slide .cmsItem .cmsImage img {width: 100%; margin: 0; border: 0;}

.list-style-slide .cmsItem .cmsTitleAndText {float:right; width: 37%; margin: 1%; }



.list-style-default .cmsItem { margin: 2% 0; }

.list-style-default .cmsItem .cmsImage {float:left; width: 22%; margin: 0; margin-right: 2%; text-align: center; }

.list-style-default .cmsItem .cmsTitleAndTextNoPrice {float:right; width: 75%; margin-left: 1%; margin-right: 0%; }

.list-style-default .cmsItem .cmsTitleAndText {float:left; width: 55%; margin: 0; }

.list-style-default .cmsItem .cmsPriceAndEnquiry {float:right; width: 19%; margin: 0%; text-align: right; }

.list-style-default .cmsItem .cmsImage img { max-width: 100%; max-height:240px ;  margin: auto;  }



.list-style-default .cmsItem .cmsSuburb { margin: 0; margin-bottom: 10px; font-weight: bolder; }

.list-style-default .cmsItem .cmsPrice { margin: 0; text-align: right; }

.list-style-default .cmsItem .cmsEnquiry { margin-top: 10px; text-align: right; }

.list-style-default .cmsItem .cmsText { font-size: 90%; }

.list-style-right-image .cmsImage img { max-width:160px; max-height:160px ;  width: 100%; }


.list-style-2col .cmsItem {	margin:0; }

.list-style-2col .cmsPriceAndEnquiry{	display:flex;	justify-content:space-between;}

.list-style-2col .cmsItem .cmsImage {text-align: center; }

.list-style-2col .cmsItem .cmsTitle { text-align: center; }

.list-style-2col .cmsImage img {max-height:none;} /*override max 320*/





.list-style-3col .cmsItem { margin: 10%; }

.list-style-3col .cmsItem .cmsImage {margin-bottom: 5px; text-align: center; }

.list-style-3col .cmsItem .cmsPrice { float: left; width: 55%; margin: 0; text-align: left;  }

.list-style-3col .cmsItem .cmsEnquiry { float: right; width: 40%;  margin: 0; }

.list-style-3col .cmsItem .cmsPriceAndEnquiry {  overflow: hidden;  font-size: 90%;  text-align: center;}

.list-style-3col .cmsItem .cmsTitle { text-align: center; }





.list-style-4col .cmsItem { margin: 10%; }

.list-style-4col .cmsItem .cmsImage {margin-bottom: 5px; text-align: center; }

.list-style-4col .cmsItem .cmsPrice { float: left; width: 55%; margin: 0;  text-align: left; }

.list-style-4col .cmsItem .cmsEnquiry { float: right; width: 40%; margin: 0; }

.list-style-4col .cmsItem .cmsPriceAndEnquiry { overflow: hidden;  text-align: center;  font-size: 80%; }

.list-style-4col .cmsItem .cmsTitle { text-align: center; }



.list-style-5col .cmsItem { margin: 10%; }

.list-style-5col .cmsItem div { text-align: center; }

.list-style-5col .cmsItem .cmsPriceAndEnquiry  { font-size: 80%; }



.list-style-6col .cmsItem { margin: 10%; }

.list-style-6col .cmsItem div { text-align: center; }

.list-style-6col .cmsItem .cmsPriceAndEnquiry  { font-size: 80%; }



.list-style-bizcard .cmsItem { margin-bottom: 10px; }

.list-style-bizcard .cmsItem .cmsImage {float:left; width: 33%; margin: 0; text-align: center; }

.list-style-bizcard .cmsItem .cmsTitleAndText {float:right; width: 65%; margin: 0; }

.list-style-bizcard .cmsItem .cmsPriceAndEnquiry {float:right; width: 65%; margin: 0; font-size: 80%; overflow: hidden;}

.list-style-bizcard .cmsItem .cmsPrice {float: left; width: 55%;  margin: 0; }

.list-style-bizcard .cmsItem .cmsEnquiry {float:right; width: 40%; margin: 0; }



.list-style-grid .cmsItem {	margin:0; }

.list-style-grid .cmsImage{text-align: center;}

.list-style-grid .cmsImage img {max-height:none;} /*override max 320*/

.list-style-grid .cmsItem .cmsTitle { text-align: center; }



/*Centering Positioning CSS for Flexible Gallery Page Only - No JS*/

.cmsGallery .list-style-grid .cmsItem{height: 100%;display: flex;flex-direction: column;}

.cmsGallery .list-style-grid .cmsImage {flex: 1;display: flex;}

.cmsGallery .list-style-grid .cmsImage a{max-width:none;}/*override max 320*/



/*Image Aspect Classes*/

[class*="cmsImageAspect"] img{height: 100%;width: 100%; object-fit: contain;}

/*.cmsImageAspect1 img{aspect-ratio:1;} not currently used*/

.cmsImageAspect6x4 img{aspect-ratio:6/4;}

/*.cmsImageAspect4x6 img{aspect-ratio:4/6;} not currently used*/

.cmsImageMaxWidth img {width: 100%; }



.cmsBackgroundImg{

    padding-top:100%;

    background-size:cover;

    background-repeat: no-repeat;

    background-position: center;

}



.cmsItemHoverReveal {

  display: none;

  background-color: rgba(250,250,250,0.8);

  position: absolute;

  pointer-events: none;

  top: 0; width: 100%;

  height: 100%;

}



.cmsItemHoverReveal.flex {

  display: flex;

  background-color: rgba(250,250,250,0.8);

  position: absolute;

  pointer-events: none;

  top: 0; width: 100%;

  height: 100%;

  opacity:0;

  -webkit-transition: opacity 0.3s ease;

  transition: opacity 0.3s ease;

}



.cmsItemHoverReveal a, .cmsItemHoverReveal input, .cmsItemHoverReveal .cmsPriceAndEnquiry {

  pointer-events: auto;

}



li.sfhover .cmsItemHoverReveal,

li:hover .cmsItemHoverReveal,

li .cmsHasNoImage .cmsItemHoverReveal {

  display: block;

  height: 100%;

  top: 0;

}



li.sfhover .cmsItemHoverReveal.flex,

li:hover .cmsItemHoverReveal.flex,

li .cmsHasNoImage .cmsItemHoverReveal.flex{

  display:flex;

  opacity:1;

}



.cmsItemHoverReveal>div { margin: 5% ; }

.cmsItemHoverReveal .cmsTitleAndText { margin-top: 30% ;  margin: 5% ; }

.cmsItemHoverReveal>div.cmsPriceAndEnquiry { position: absolute; bottom: 5% ; width:90%; margin: 5%;left:0;}

.cmsItemHoverReveal , .cmsItemHoverReveal A  { color: black; }



/*intial hidden hover state*/

.txtOnHover figure figcaption,

.txtOnHoverZoom figure figcaption,

.txtOnUpHover figure figcaption,

.txtOnHover figure .cbimageoverlay,

.txtOnHoverZoom figure .cbimageoverlay,

.txtOnUpHover figure .cbimageoverlay{

	opacity:0;

	transition:all 0.5s ease;

}



.jumpOnHover .column,.row .jumpOnHover{

	position:relative;

	transition:top 0.2s ease;

	top:0;

}

.jumpOnHover .column:hover,

.jumpOnHover:not(.row):not(a):hover{top:-0.75rem;}

a.jumpOnHover:hover{top:-0.4rem;}



.list-style-hover .cmsItem {

    margin: 1%;

    position: relative;

    min-height: 100px;

    border: 1px solid #AAA;

}

.list-style-hover .cmsItem .cmsImage { margin: 0;  }







.cmsItemGrid

{

 list-style-type: none; margin: 0; padding: 0;    position: relative;

}



.cmsItemGrid {

	position: relative;

	overflow: hidden;

}



.cmsItemGrid>li {

	margin: 0; padding: 0;

	float: left;

	position: relative;

	overflow: hidden;

 }



.cmsItemGrid>li div.cmsItem

	{

		margin: 5px;

		position: relative;

		overflow: hidden;

		height: inherit;

	}





/*

a inline button that does not play with line-height

*/

.cmsMoreInfo,

.cmsItem a.moreInfo,

.cmsNavButtons a {

	text-decoration: none !important;

	border: 1px solid #CACACA;

	display: inline-block;

    padding: 1px 5px;

    margin-left: 5px;

	cursor: pointer;

}



/*

	Making nav buttons a bit bigger by default - Reuben April 2023

*/

.cmsNavButtons a {

    margin: 5px;

	padding: 5px 10px;

}



/*

	Default styling for active and hover nav buttons...  Reuben April 2023

*/

.cmsNavButtons a:hover,

.cmsNavActivePage,

.pagenav-active

{

	background: #EEE;

	color: black;

	border: 1px solid #AAA;

	font-weight: 600;

}







ul.list-style-default .eventsListIndent { margin-left: 30px; }



.cmsListOfLinks a {
	display:block;
	text-decoration: none;
	cursor: pointer;
}


/* right aligned images on blogs and galleries and real estate */





@media (min-width: 640px) {



	div.leftAlignedImageBlock {

		float:left;

		max-width: 48%;

		margin-right: 2%;

		margin-bottom: 10px;

		display:block;

	}



	div.rightAlignedImageBlock {

		float:right;

		max-width: 48%;

		margin-left: 2%;

		margin-bottom: 10px;

		display:block;

	}

}







/*max size the containers for images*/



.galleryView320 {

	max-width: 320px;

}



/*underlying image is 320px max, so need to match thumbnails to this size*/

.imageAlignmentBlock .imageBlockThumbs { max-width: 320px; clear: both;}

.imageBlockThumbs { margin-top: 5px; }



/* support mobile view still smaller */

@media (max-width: 600px) {

.imageBlockThumbs	li {

		width: 33.3%;

		display: inline-block;

		float: left;

}

}





/* beware ie must specify 100% relative to the div specified... */

.cmsThumb { margin: 2px; max-height: 100px; max-width: 100px; }

.cmsLargeThumb { margin: 2%;}



/*

just a simple rule to keep these images a little smaller... */

.alsoConsider .cmsImage img { max-height: 100px;  }







/*but max width the images to 100% within their container, so not upscalled */



.zoomedphoto img ,
.cmsThumb img ,
.cmsLargeThumb img { height:auto; max-height: 100%; max-width: 100%; }







.nounderline { text-decoration: none; }





.showMobileSite {

  display:block;

  background-color: #333;

  margin: 0; padding: 0;

  height: 100px;

}



.showMobileSite A:link, .showMobileSite A:visited {

  display:block;

  line-height: 100px;

  font-size: 40px;

  background-color: #333;

  color: white;

  text-align:center!important;

  text-decoration: none;

}







.autoAddressTitle {

	display:block;

	font-size:9px;

	line-height:12px;

	color: #666;

	background-color: rgba(255,255,255, 0.8);

}







#cmsBrowserBottomFixed { display:block; width:100%; background: rgba(255, 255, 255, 0.5);z-index: 5000;} /*5000 suitably high enough to sit on top of all elements*/

#cmsBrowserTopFixed { display:block; width:100%; background: rgba(255, 255, 255, 0.5); z-index: 5000;}

#cmsBrowserTopFixed table, #cmsBrowserBottomFixed table {  margin: 3px; width: 100%;}



@media (min-width: 640px) {



	#cmsBrowserBottomFixed { position:fixed; bottom: 0;  }

	#cmsBrowserTopFixed { position:fixed; top: 0; }

	#cmsBrowserBottomFixedSpacer { height:20px; }

	#cmsBrowserTopFixedSpacer { height:30px; }



}











 /*

 ###########################################################################################



 END  OF CMS COMMON CSS



###########################################################################################

 */





.cmsDefaultTextLogo A {

	text-decoration: none;

}

.cmsDefaultTextLogo {

	line-height: normal;

	width: 90%;

	margin:5%;

	font-weight: bolder;

}

/* default settings, so that we can add width/height later */

.cmsLogoImg {

	max-width: 100%;

	height: auto;

}







.zoomedphoto .zoomPup img {max-width:none; max-height: none;}

.zoomedphoto .zoomWindow img {max-width:none; max-height: none;}



A.cmsToyToTop { z-index:9999; display:block;  text-decoration:none; overflow:hidden; width:35px; height:35px; border:none;

	text-indent:100%; background:url(/uploads/shared/images/art/Arrows/ui.totop.png) no-repeat left top;

}

A.cmsToyToTop:hover { background:url(/uploads/shared/images/art/Arrows/ui.totop.png) no-repeat left -35px; }









.preDiscount { font-size: 80%; text-decoration: line-through; color:red }

.productRrp .productRrpPrice { text-decoration: line-through; color:red }

.productPriceSavingsPrice {color:red  }

.mainPrice .value { font-weight: bolder;}

.productPrice .value { font-weight: bolder;}

.otherTaxPrice { font-size: 80%; }

.ccySymbol { margin-right: 3px; }

.cmsFormData .GSTwording { margin-left: 6px; }





/*Andrew - Slide Widget v3 hide by default*/

.inpagelazygallery{display:none;}

.inpagelazypopup,.inpagelazypopup.flex, .is-wrapper>div.inpagelazypopup {display:none;}

.inpagelazyaccordian .accordianContent{display:none;}





/* Drag/Drop Content */



/* reuben hacks */



img.halfwidth { width: 50%; }

img.fullwidth { width: 100%; }

img.fullheight{

margin-left: auto;

margin-right: auto;

    display: block;

}



img.greyscale {

	-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */

    filter: grayscale(100%);

 }





/* RSJ HACK - note media dependent */

.column {

        -moz-box-sizing: border-box;

        -webkit-box-sizing: border-box;

        box-sizing: border-box;

         overflow: hidden;

}



.wsb-template .column {

		overflow: visible; /* Reuben fix for template menu snippets */

}









/* ------------------------------ CONTENT BOX ---------------------  */







/* Container for All Sections */

.is-wrapper {

	width:100%;height:100%;box-sizing:border-box;margin:0 auto;max-width:100%;

}



/* Sections */

.is-section,

.is-wrapper > div {

    display:table;

    width:100%;

    height: auto; /* default */

    /* float:left;  */  /* i see no reason for this... */

    box-sizing:border-box;

    margin:0;

    padding:0;

    position:relative;

	z-index: auto;

}

div.cmsUsualWidth.is-section,

.is-wrapper > div.cmsUsualWidth {

	margin-left:auto;

	margin-right:auto;

}

/* Boxes */

.is-boxes {display:table;table-layout:fixed;width:100%;height:100%;position:relative;min-height:200px;} /* reuben 2021-08-30 removed float:left; */

.is-boxes {height:100%;}

.is-box-0 { display:table-cell;width: 0%;height:100%;position:relative; }

.is-box-1 { display:table-cell;width: 8.333333%;height:100%;position:relative; }

.is-box-2 { display:table-cell;width: 16.666667%;height:100%;position:relative; }

.is-box-3 { display:table-cell;width: 25%;height:100%;position:relative; }

.is-box-4 { display:table-cell;width: 33.333333%;height:100%;position:relative; }

.is-box-5 { display:table-cell;width: 41.666667%;height:100%;position:relative; }

.is-box-6 { display:table-cell;width: 50%;height:100%;position:relative; }

.is-box-7 { display:table-cell;width: 58.333333%;height:100%;position:relative; }

.is-box-8 { display:table-cell;width: 66.666667%;height:100%;position:relative; }

.is-box-9 { display:table-cell;width: 75%;height:100%;position:relative; }

.is-box-10 { display:table-cell;width: 83.333333%;height:100%;position:relative; }

.is-box-11 { display:table-cell;width: 91.666667%;height:100%;position:relative; }

.is-box-12 { display:table-cell;width: 100%;height:100%;position:relative; }



.is-box-centered {display:table-cell;width: 100%;position:relative;vertical-align:middle;}

.is-boxes.cmsUsualWidth,.is-boxes.is-inline-maxwidth{margin-inline:auto;} /*AJ auto-center custom contentbox widths*/



#cmsPageContainer .is-box .is-container:not(.is=content-maxwidth) {

    padding-inline: clamp(1rem, 2vw, 4rem); /*Add default padding to multi-col .is-box sections if not set*/

}



/*Preload caption slider css to prevent jumping on load before slideshow files loaded*/

.is-caption-slider .is-box {

    display:none;

    height: inherit;

}

.is-caption-slider .is-box:first-child {

    display: block;

}

.cb-slider .animated{

	visibility: hidden;

}

.cb-slider .slick-slide .animated{

	visibility:visible;

}





.is-stretch > div:not(.is-arrow-down) {  /* Unlike .is-overlay (absolute positioned), this section is relative positioned. With this, flowing content is safe, and stretched content can be made absolute with class .flexi-position */

    position:relative;left:0px;top:0px;width:100%;height:100%;display:table;

}

/*

.flexi-position is set relative by default, but will set absolute (stretched) if placed within section .is-stretch

*/

.flexi-position { position: relative; }

.is-stretch .flexi-position { position: absolute; }



.is-section.is-stretch {min-height:300px;} /* New */



@media all and (max-width: 960px) {



  /*   .is-section:not(.is-stretch), .is-section-100:not(.is-stretch) { height: auto !important; } is-stretch is an exception */

    .is-section:not(.is-box) { height: auto !important; }



    /* .is-boxes { height: auto !important; } */

    .is-boxes { height: 100% !important; } /* new */



    .is-box-img {height:300px !important;}

    .is-box-img .is-boxes {height:100% !important;}



		/*AJ add important to override inline % added by new cbox col-drag func 05/23*/

    .is-box-1 { display:table;width: 100%!important;height:auto; }

    .is-box-2 { display:table;width: 100%!important;height:auto; }

    .is-box-3 { display:table;width: 100%!important;height:auto; }

    .is-box-4 { display:table;width: 100%!important;height:auto; }

    .is-box-5 { display:table;width: 100%!important;height:auto; }

    .is-box-6 { display:table;width: 100%!important;height:auto; }

    .is-box-7 { display:table;width: 100%!important;height:auto; }

    .is-box-8 { display:table;width: 100%!important;height:auto; }

    .is-box-9 { display:table;width: 100%!important;height:auto; }

    .is-box-10 { display:table;width: 100%!important;height:auto; }

    .is-box-11 { display:table;width: 100%!important;height:auto; }

    .is-box-12 { display:table;width: 100%!important;height:auto; }



    /* Give contentbox banner boxes a height*/

	.is-box-6.banner-box{height:100vW;}



    /* .is-box-centered {display:block;} */

    .is-box-centered {display:table-cell;} /* new */

}





.is-container {

    max-width:1200px;margin:0 auto;padding:0 30px; /* padding left/right only */

    position:relative;margin-left:auto;margin-right:auto;box-sizing:border-box;

/*	-webkit-transition: all ease 0.3s;

	-moz-transition: all ease 0.3s;

	-ms-transition: all ease 0.3s;

	-o-transition: all ease 0.3s;

	transition: all ease 0.3s; AJ REMOVED OCT2020 AS IT IS CAUSING CONTENT TO JUMP/SHIFT/CHANGE COLOUR ON LOAD WITH DEFER*/

}



.is-wrapper:after {

  content: "";

  display: table;

  clear: both;

}



/* Turn off parallax scrolling for all tablets and phones. Increase/decrease the pixels if needed */



@media only screen and (max-device-width: 1366px) {

body .is-section.parallax .is-overlay-bg{

    background-attachment: scroll;

    background-position:center!important;

  }

}



@media all and (max-width: 900px) {

	/* default padding left right only*/

    .is-container { padding:0 2%;  }

}



/* Boxed Layout */

.is-wrapper  .is-boxed-layout .is-container { padding:30px; background:#fff;} /* 80px , now 30px all around, up and down too */





/* Scroll Down Icon */

.is-arrow-down { display: table; position:absolute;bottom:65px;width:50px;height:50px;left:50%;margin-left:-25px;cursor:pointer;z-index:1 }

@media all and (max-width: 1025px) {

	.is-arrow-down { display:none !important; }

}

.is-arrow-down > a {

	background: rgba(0, 0, 0, 0.18); border-radius: 500px;

	color: rgba(255, 255, 255, 0.75);font-size: 22px; text-decoration:none;

	text-align: center;

    display: table-cell;

    vertical-align: middle;}

.bounce {

	animation: bounce 5s forwards;

}



.is-arrow-down.light a {

    background: rgba(255, 255, 255, 0.18);color: #111;

}



/* Animated */

.is-animated{opacity:0;} /*default hide on load in case visible - prevent flickering*/

.is-animated.animated,

.ineditor .is-animated{opacity:1;}



/* Overlay */

.is-overlay,
.section-overlay /*constrained section option*/ {
    position:absolute;left:0px;top:0px;width:100%;height:100%;
    overflow:hidden;
    /*z-index:1;*/
}

/*.is-boxes, .is-box-centered {z-index:1}*/

.is-overlay .is-overlay-bg {

    position:absolute;left:0px;top:0px;width:100%;height:100%;

    background-size:cover;

    background-repeat:no-repeat;

    background-position:50% 60%;

}

.is-section.fixed .is-overlay-bg,

.is-section.parallax .is-overlay-bg{

	background-attachment:fixed;

}



/*AJ Alt ken-burns is-scale-animation*/

.is-section.is-scale-animation .is-overlay .is-overlay-bg,

.is-overlay .is-overlay-bg.is-scale-animated.is-appeared {

    animation:is-scale 10s ease forwards;

    -ms-animation:is-scale 10s ease forwards;

    -webkit-animation:is-scale 10s ease forwards;

    -o-animation:is-scale 10s ease forwards;

    -moz-animation:is-scale 10s ease forwards;

}

@keyframes is-scale {

    from {

  	    transform: scale(1);

        -ms-transform: scale(1);

        -webkit-transform: scale(1);

        -o-transform: scale(1);

        -moz-transform: scale(1);

    }

    to {

  	    transform: scale(1.2);

        -ms-transform: scale(1.2);

        -webkit-transform: scale(1.2);

        -o-transform: scale(1.2);

        -moz-transform: scale(1.2);

    }

}





.is-overlay .is-overlay-color {

    position:absolute;left:0px;top:0px;width:100%;height:100%;

    background-color: rgb(0, 0, 0);opacity: 0.15;

}

.is-overlay .is-overlay-content {

    position:absolute;left:0px;top:0px;width:100%;height:100%;

    overflow:hidden;

    z-index: inherit; /* dec 2017 */

}

.is-overlay .is-overlay-content.content-selectable { z-index: 1 } /* dec 2017 */

/* .is-container { z-index: 1 }  */ /* dec 2017 */









/* Section & Content Styles */



/* Background Color */

.is-bg-grey {background-color:#eeeff0 !important}

.is-bg-dark {background-color:#111 !important}

.is-bg-light {background-color:#fff !important}



/* Text Color - alreday defined*/

/*

.is-light-text * {color: #fff;}

.is-dark-text * {color: #000;}

*/



/* Vertical Alignment */

.is-content-top {

    vertical-align:top;

}

.is-content-bottom {

    vertical-align:bottom

}



/* Horizontal Alignment */

/* Reuben adjusted to use 10% instead of 100px */



@media ( min-width: 600px) {

.is-container.is-content-left {

    margin-left:10%;

}

.is-container.is-content-right {

    margin-right:10%;

}

}





/* all content edge adjustments  removed */





/* Text Alignment */

.is-align-right {

    text-align:right;

}

.is-align-center {

    text-align:center;

}

.is-align-left {

    text-align:left;

}



/* Text Opacity */

.is-opacity-20, .is-opacity-20 .is-container {     opacity: 0.2; }

.is-opacity-25, .is-opacity-25 .is-container {     opacity: 0.25; }

.is-opacity-30, .is-opacity-30 .is-container {     opacity: 0.3; }

.is-opacity-35, .is-opacity-35 .is-container {     opacity: 0.35; }

.is-opacity-40, .is-opacity-40 .is-container {     opacity: 0.4; }

.is-opacity-45, .is-opacity-45 .is-container {     opacity: 0.45; }

.is-opacity-50, .is-opacity-50 .is-container {     opacity: 0.5; }

.is-opacity-55 .is-container {     opacity: 0.55; }

.is-opacity-60, .is-opacity-60 .is-container {     opacity: 0.6; }

.is-opacity-65, .is-opacity-65 .is-container {     opacity: 0.65; }

.is-opacity-70, .is-opacity-70 .is-container {     opacity: 0.7; }

.is-opacity-75, .is-opacity-75 .is-container {     opacity: 0.75; }

.is-opacity-80, .is-opacity-80 .is-container {     opacity: 0.8; }

.is-opacity-85, .is-opacity-85 .is-container {     opacity: 0.85; }

.is-opacity-90, .is-opacity-90 .is-container {     opacity: 0.9; }

.is-opacity-95, .is-opacity-95 .is-container  {     opacity: 0.95; }

.is-opacity-1 {    opacity:1; }



/* Content Size */

/* reuben removed important so can be overridden */

.is-content-380 {     max-width: 380px ; }

.is-content-500 {     max-width: 500px ; }

.is-content-640 {     max-width: 640px ; }

.is-content-800 {     max-width: 800px ; }

.is-content-970 {     max-width: 970px ; }

.is-content-980 {     max-width: 980px ; }

.is-content-1050 {     max-width: 1050px ; }

.is-content-1100 {     max-width: 1100px ; }

.is-content-1200 {     max-width: 1200px ; }

.is-content-1400 {     max-width: 1400px ; }

.is-content-1600 {     max-width: 1600px ; }

div.is-content-fullwidth{ max-width:100%; } /*allows for outer spacing*/

div.is-content-maxwidth  { max-width: none; width: 100%; margin: 0;} /*no outer spacing*/



/*

Andrew hacks for contentbox, was percent height before.

*/



.is-wrapper > div.is-section-20 {height:20vH;}

.is-wrapper > div.is-section-30 {height:30vH;}

.is-wrapper > div.is-section-40 {height:40vH;}

.is-wrapper > div.is-section-50 {height:50vH;}

.is-wrapper > div.is-section-60 {height:60vH;}

.is-wrapper > div.is-section-75 {height:75vH;}

.is-wrapper > div.is-section-100 {height:100vH;}

.is-wrapper > div.is-section-auto {height:auto;}



.is-section-auto .is-boxes{position:initial;}

.is-box, .is-boxes{min-height:inherit;}



/*

Andrew specific rule 09/19 to fix two-col sections box positioning - remove if causes unexpected issue!

*/



.is-wrapper > .is-section > .is-boxes > .is-box{

	vertical-align:top;

}

/*

Back to standard content box

*/



.is-shadow-1 { /* for section */

    -webkit-box-shadow: 0 0 9px rgba(0, 0, 0, 0.07);

    -moz-box-shadow: 0 0 9px rgba(0, 0, 0, 0.07);

    box-shadow: 0 0 9px rgba(0, 0, 0, 0.07);

}



.is-lightbox img {cursor:pointer;

	-webkit-transition: all ease 0.5s;

	-moz-transition: all ease 0.5s;

	-ms-transition: all ease 0.5s;

	-o-transition: all ease 0.5s;

	transition: all ease 0.5s;

	}

.is-lightbox img:hover {opacity:0.8}



.is-hidden {display:none !important;}









/* video */

.is_video_bg {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  overflow: hidden;

  background: #000;

}

.is_video_bg .screen {

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  margin: auto;

  opacity: 0;

  transition: opacity 1s;

}

.is_video_bg .screen.active {

  opacity: 0.7;

}



.eventsDisabled{pointer-events: none;} /*Disable overlay text to allow video stop / play (optional)*/

.ineditor .eventsDisabled{pointer-events: all;}  /*Allow overlay editing*/





/* --------------------------- CONTENT STUDIO -------------------- */

/*  contentstudio minimalistbasic.css */





@media (min-width: 500px)  {



	/* RSJ hack  -  rows need negative margin to compensate for equal padding on columns */

	.row {

        margin-left: -1rem;

        margin-right: -1rem;

	}

    .column {

        float: left;

        padding-left: 1rem; /* beta3 */

        padding-right: 1rem; /* beta3 */

    }



    .column.full { width: 100%; }

    .column.two-third { width: 66.7%; }

    .column.three-fourth, .column.three-quarter { width: 75%; }

    .column.two-fifth  { width: 40%!important; }

    .column.half { width: 50%; }

    .column.third { width: 33.3%; }

    .column.fourth, .column.quarter { width: 25%; }

    .column.fifth { width: 20%; }

    .column.three-fifth { width: 60%; }

    .column.four-fifth { width: 80%; }

    .column.sixth { width: 16.6%; }

    .column.seventh { width: 14.28%; }

    .column.eighth { width: 12.5%; }

    .column.two-sixth  { width: 33.3%; }/* fixed innova bug */

    .column.five-sixth { width: 83.4%; }

    .column.flow-opposite { float: right; order:99;} /*order allows this to work when a flex box*/



	.row.inline-halves .column{	width:49%!important;}

  .row.inline-thirds .column{	width:33%!important;}

	.row.inline-fourths .column{	width:24%!important;}

  .row.inline-fifths .column{	width:19%!important;}

  .row.inline-sixths .column{	width:16%!important;}

  .row.inline-sevenths .column{	width:14%!important;}

  .row.inline-eighths .column{	width:12%!important;}



	/* RSJ media column dependent */

	.right {text-align:right}

	.left {text-align:left}

	.padding-20 {padding:20px}

	.padding-25 {padding:25px}

	.padding-30 {padding:30px}

	.padding-35 {padding:35px}

	.padding-40 {padding:40px}



    .col-12, .col-md-12, .col-lg-12, .col-sm-12 { width: 100%; }

    .col-11, .col-md-11, .col-lg-11, .col-sm-11 { width: 91.6%; }

    .col-10, .col-md-10, .col-lg-10, .col-sm-10 { width: 83.3%; }

    .col-9, .col-md-9, .col-lg-9, .col-sm-9 { width: 75%; }

    .col-8, .col-md-8, .col-lg-8, .col-sm-8 { width: 66.7%; }

    .col-7, .col-md-7, .col-lg-7, .col-sm-7 { width: 58.3%; }

    .col-6, .col-md-6, .col-lg-6, .col-sm-6 { width: 50%; }

    .col-5, .col-md-5, .col-lg-5, .col-sm-5 { width: 41.6%; }

    .col-4, .col-md-4, .col-lg-4, .col-sm-4 { width: 33.3%; }

    .col-3, .col-md-3, .col-lg-3, .col-sm-3 { width: 25%; }

    .col-2, .col-md-2, .col-lg-2, .col-sm-2 { width: 16.6%; }

    .col-1, .col-md-1, .col-lg-1, .col-sm-1 { width: 8%; }



}


/*Break for tablet format at 800px AJ 05/25
	Only if identical column classes, not custom layouts
	Wrap flex elements if set for vert/horz alignment
*/
@media (max-width:800px) and (min-width: 500px) {
	.row:has( .column.fifth ),
	.row:has( .column.sixth ),
	.row:has( .column.seventh ),
	.row:has( .column.eighth ){flex-wrap:wrap;}
	.row:has(.column.fifth:nth-child(5)) > .column.fifth{ width: 33% !important; }
	.row:has(.column.sixth:nth-child(6)) > .column.sixth{ width: 33% !important; }
	.row:has(.column.seventh:nth-child(7)) > .column.seventh{ width: 25% !important; }
	.row:has(.column.eighth:nth-child(8)) > .column.eighth{ width: 25% !important; }
}




	.center {text-align:center}





.clearfix:before, .clearfix:after {content: " ";display: table;  }

.clearfix:before, .clearfix:after {clear: both;}





/**********************************

    Elements

***********************************/





.margin-0 {margin:0 !important}

.margin-20 {margin:20px !important}

.margin-25 {margin:25px !important}

.margin-30 {margin:30px !important}

.margin-35 {margin:35px !important}

.margin-40 {margin:40px !important}

.is-card { display:table; background-color:#fff;  }

.is-card > * { display:table; }

.is-card-circle { width:280px; height: 280px; border-radius:500px; padding:70px; margin:0 auto; }





.is-card-content-centered { display:table-cell;vertical-align:middle;text-align:center; }

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

.shadow-1 { /* card */

    -webkit-box-shadow: 0 1px 3px rgba(0,0,0, 0.12), 0 1px 2px rgba(0,0,0, 0.24);

    -moz-box-shadow: 0 1px 3px rgba(0,0,0, 0.12), 0 1px 2px rgba(0,0,0, 0.24);

    box-shadow: 0 1px 3px rgba(0,0,0, 0.12), 0 1px 2px rgba(0,0,0, 0.24);

}

.shadow-2 { /* screenshot */

    -webkit-box-shadow: 0 30px 50px rgba(0, 0, 0, 0.15);

    -moz-box-shadow: 0 30px 50px rgba(0, 0, 0, 0.15);

    box-shadow: 0 30px 50px rgba(0, 0, 0, 0.15);

}

.shadow-3 { /* highlight */

    -webkit-box-shadow: 0 0px 100px rgba(0, 0, 0, 0.2);

    -moz-box-shadow: 0 0px 100px rgba(0, 0, 0, 0.2);

    box-shadow: 0 0px 100px rgba(0, 0, 0, 0.2);

}



figure.hdr img.noeffects, figure.hdr:hover img.noeffects, img.noeffects:hover {

	-webkit-transition: unset;

	transition: unset;

	-webkit-transform: unset;

	transform: unset;

	opacity: unset;

}





img.circle {border-radius:500px;margin-top:0;}

img.rounded{border-radius:5px;}

img.bordered {border: #ccc 1px solid;}



img.boxshadow {

    -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.4);

    -moz-box-shadow:  2px 2px 5px rgba(0,0,0,0.4);

    box-shadow:  2px 2px 5px rgba(0,0,0,0.4) ;

}

img.marginbump{

	transition: 0.1s margin ease-in-out;

}



img.marginbump:hover {margin-top:-5px;margin-bottom:5px;}





.embed-responsive {position: relative;display:block;height:0;padding:0;overflow:hidden;margin-top: 1.4em;margin-bottom: 1rem;}
.embed-responsive.embed-responsive-16by9 {padding-bottom: 56.25%;}
.embed-responsive.embed-responsive-4by3 {padding-bottom: 75%;}
.embed-responsive.embed-responsive-9by16 {padding-bottom: 177.77%;}
.embed-responsive iframe {position: absolute;top:0;bottom:0;left:0;width:100%;height:100%;border:0;}



/*RSJ legacy hack */

.column figure {margin: 0 }



.column > a > img,

.column > img,

.column > figure,

.column > .embed-responsive {

    margin-top: 1rem;margin-bottom: 1rem;

}



.list {position:relative;margin:1.5em 0;}

.list > ion-icon,

.list > i {position:absolute;left:-3px;top:7px;font-size:1.7em;line-height:1;}

.list > h2, .list > h3 {margin: 0 0 0 50px;}

.list > p {margin: 5px 0 0 50px}



.quote {position:relative;margin:1.5em;}

.quote > ion-icon,

.quote > i {position: absolute; left: -7px; font-size: 2em;}

.quote > i.material-icons {transform: scaleX(-1);}

.quote > small {margin-left:50px; opacity: 0.7; font-size: 1em;}

.quote > p {margin-left:50px; font-size: 1.5em;}





.is-social {line-height:1;margin-bottom:1.5em}

.is-social a > i {text-decoration:none;color:#333;font-size:1.2em;margin:0 15px 0 0;-webkit-transition: all 0.1s ease-in-out;transition: all 0.1s ease-in-out;}

.is-social a:hover > ion-icon,

.is-social a:hover > i {color:#08c9b9;}

.is-light-text .is-social a > i {color:#fff}

.is-light-text .is-social a:hover > i {color:#fff}

.is-dark-text .is-social a > i {color:#000}

.is-dark-text .is-social a:hover > i {color:#000}



/* backward compatible */

.social {line-height:1;margin-bottom:1.5em}

.social a > i {text-decoration:none;color:#333;font-size:1.2em;margin:0 15px 0 0;-webkit-transition: all 0.1s ease-in-out;transition: all 0.1s ease-in-out;}

.social a:hover > i {color:#08c9b9;}

.is-light-text .social a > i {color:#fff}

.is-light-text .social a:hover > i {color:#fff}



.is-rounded-button-big {display:inline-block;}

.is-rounded-button-big a {display:table;float:left;text-align:center;margin:0 20px;border-radius: 500px; width: 110px; height: 110px;background-color: #aaa;}

.is-rounded-button-big a ion-icon,

.is-rounded-button-big a i {display:table-cell;width:100%;height:100%;vertical-align:middle;color:#ffffff;font-size:40px}

.is-rounded-button-big a ion-icon{ transform: scale(0.6);  }

.is-rounded-button-big a:first-child {margin:0 20px 0 0;}

.is-rounded-button-big a:last-child {margin:0 0 0 20px;}



.is-rounded-button-medium {display:inline-block;}

.is-rounded-button-medium a {display:table;float:left;text-align:center;margin:0 20px;border-radius: 500px; width: 70px; height: 70px;background-color: #aaa;}

.is-rounded-button-medium a ion-icon,

.is-rounded-button-medium a i {display:table-cell;width:100%;height:100%;vertical-align:middle;color:#ffffff;font-size:30px}

.is-rounded-button-medium a ion-icon{transform: scale(0.6); }



.is-boxed-button-big {display:inline-block;}

.is-boxed-button-big a {display:table;float:left;text-align:center;margin:0 30px 0 0;width: 110px; height: 110px;background-color: #aaa;}

.is-boxed-button-big a ion-icon,

.is-boxed-button-big a i {margin: 30%; display:inline-block;width:1em;height:1em;vertical-align:middle;color:#ffffff;font-size:40px; }



.is-boxed-button-big2 {display:inline-block;}

.is-boxed-button-big2 a {display:table;float:left;text-align:center;margin:0 30px 0 0;width: 150px; height: 70px;background-color: #aaa;}

.is-boxed-button-big2 a ion-icon,

.is-boxed-button-big2 a i {margin: 30%; display:inline-block;width:1em;height:1em;vertical-align:middle;color:#ffffff;font-size:35px}



.is-boxed-button-medium {display:inline-block;}

.is-boxed-button-medium a {display:table;float:left;text-align:center;margin:0 30px 0 0;width: 70px; height: 70px;background-color: #aaa;}

.is-boxed-button-medium a ion-icon,

.is-boxed-button-medium a i {margin: 30%; display:inline-block;width:1em;height:1em;vertical-align:middle;color:#ffffff;font-size:30px}



.is-boxed-button-medium2 {display:inline-block;}

.is-boxed-button-medium2 a {display:table;float:left;text-align:center;margin:0 30px 0 0;width: 100px; height: 50px;background-color: #aaa;}

.is-boxed-button-medium2 a ion-icon,

.is-boxed-button-medium2 a i {margin: 30%; display:inline-block;width:1em;height:1em;vertical-align:middle;color:#ffffff;font-size:25px}



.is-boxed-button-small {display:inline-block;}

.is-boxed-button-small a {display:table;float:left;text-align:center;margin:0 20px 0 0;width: 50px; height: 50px;background-color: #aaa;}

.is-boxed-button-small a ion-icon,

.is-boxed-button-small a i {margin: 30%; display:inline-block;width:1em;height:1em;vertical-align:middle;color:#ffffff;font-size:20px}





/*prepend with body to override .material-icons css rule*/

body .size-default {font-size:inherit;}

body .size-12 {font-size:12px}

body .size-14 {font-size:14px}

body .size-16 {font-size:16px}

body .size-18 {font-size:18px}

body .size-21 {font-size:21px}

body .size-24 {font-size:24px}

body .size-32 {font-size:32px}

body .size-48 {font-size:48px}

body .size-64 {font-size:64px}

body .size-80 {font-size:80px}

body .size-96 {font-size:96px}

@media all and (max-width: 1024px) {

    body .size-32 {font-size:28px}

    body .size-48 {font-size:32px}

    body .size-64 {font-size:36px}

    body .size-80 {font-size:40px}

    body .size-96 {font-size:44px}

}





/**********************************

    Title Styles

***********************************/



.is-light-text *:not(input):not(textarea) {color: #fff;} /*prevent text from being white on white*/

.is-dark-text *:not(input):not(textarea) {color: #000;}









/**********************************

    Buttons Styles

***********************************/



.is-btn {

    padding: 10px 50px;

    font-size: 1em;

    line-height: 2em;

    border-radius: 0;

    letter-spacing: 3px;



    display: inline-block;

    margin-bottom: 0;

    font-weight: normal;

    text-align: center;

    text-decoration: none;

    vertical-align: middle;

    cursor: pointer;

    background-image: none;

    border: 1px solid transparent;

    white-space: nowrap;

    -webkit-transition: all 0.16s ease;

    transition: all 0.16s ease;

}





.is-btn-small { padding: 5px 25px; font-size: 0.85em; }

.is-upper { text-transform:uppercase; }

.is-rounded-30 { border-radius: 30px; }







/* Old Buttons */



.btn, .btn-primary, .btn-default, .btn-small {

	padding: 3px;

    border-radius: 3px;

    display: inline-block;

    margin-bottom: 0;

    font-weight: normal;

    text-align: center;

    text-decoration: none;

    vertical-align: middle;

    cursor: pointer;

    background-image: none;

    border: 1px solid transparent;

    white-space: nowrap;

    -webkit-transition: all 0.16s ease;

    transition: all 0.16s ease;

}



.btn, .btn-primary, .btn-default {
    padding: 5px 20px;
    font-size: 1.2em;
		line-height: 2em;
    border-radius: 6px;
    white-space: normal; /*Added by default to allow long button text to wrap as screen size reduces*/
}



.btn-small {

	padding: 3px;

    font-size: inherit;

	line-height: inherit;

	border-radius: 3px;

}



.btn-small,

.btn-default {color: #333333;background-color: #d3d3d3;}

.btn-small,

.btn-default:hover {color: #111;background-color: #ccc;border-color: #ccc;}



.btn-primary {color: #ffffff;background-color: #08c9b9 ; border-color: black; }

.btn-primary:hover {color: #ffffff;background-color:#07b0a2; }



.btn-primary-outline,.btn.btn-primary-outline{color: #08c9b9;background: none ; border:2px solid #08c9b9; }/*default blue - overridden by primary colour in template - always primary*/

.btn-primary-outline:hover {color: #ffffff;background-color: #08c9b9; }



.btn-outline,.btn.btn-outline{color: #282828;background: none ; border:2px solid #282828; }/*plain dark colour overriden to white by is-light-text*/

.btn-outline:hover {color: #ffffff;background-color: #282828; }

.is-light-text .btn-outline,.is-light-text .btn.btn-outline{color: white;background: none ; border:2px solid white; }

.is-light-text .btn-outline:hover {color: #ffffff;background-color: #282828; border:2px solid white; }



/*  */

.cb-btn, input[type=button].cb-btn , input[type=submit].cb-btn , a.button.cb-btn , a.smallbutton.cb-btn {font-size:13px;color:white!important;font-weight:400;font-style:normal;line-height:43px;min-height:43px;}



.btn-apply, input[type=button].btn-apply , input[type=submit].btn-apply , a.button.btn-apply , a.smallbutton.btn-apply {background:#00bf00!important;}

.btn-cancel, input[type=button].btn-cancel , input[type=submit].btn-cancel , a.button.cancel , a.smallbutton.cancel {background:#9dd3d2!important;} /*washed out blue*/

.btn-savedata{background:orange;}

.btn-inpage{background: #c2d3eb!important;}



button .material-icons { font-size: inherit; }





/**********************************

    Custom Snippet coding

***********************************/

ul.listUL {

    list-style: none;

    padding: 0;

}

ul.listUL li:first-child {

    border-top: 1px solid #ccc;

}

ul.listUL li {

    border-bottom: 1px solid #ccc;

    padding: 0.5rem 0;

}

.is-dark-text ul.listUL li:first-child {border-top: 1px solid #000;}

.is-dark-text ul.listUL li {  border-bottom: 1px solid #000;}

.is-light-text ul.listUL li:first-child {border-top: 1px solid #fff;}

.is-light-text ul.listUL li {border-bottom: 1px solid #fff;}





.row.inline,

.row.inline-thirds{text-align:center;}

.row.inline .column,

.row.inline-thirds .column{

	display:inline-block;

	float:none;

	vertical-align:top;

}



.column.circbox {

    position: relative;

    padding: 1rem;

}



.column.circbox .circ {

    width: 100%;

    padding-top: 100%;

    border-radius: 500px;

    background: #efefef;

    position: relative;

}



.column.circbox .circ.circpad {

    width: 72%;

    padding-top: 72%;

    margin:14%;

}



.column.circbox .circtext {

    position: absolute;

    display: flex;

    top: 0;

    bottom: 0;

    left: 2rem;

    right: 2rem;

    flex-direction: column;

    justify-content: center;

}



pre.codeSample {

  padding: 10px;

  border: 1px solid silver;

  color: green;

}



/**********************************

    Andrew Flex Banner Snippet Css

    Legacy use - where possible use inline style

***********************************/



.flex{display:flex;}

.flexcenter{justify-content:center;align-items:center;}

.row.flex{height: 100%;}

.row.flex .column{display:flex;flex-direction:column;}

.row.flex .column.full{width:100%;}

.row.flex.flexrow .column,.flexrow{flex-direction:row;}

.row.flex .column.vcenter{justify-content:center;} /*vert center direction col*/

.row.flex .column.textblock{padding:2% 5%;}

.row.flex .column.imgblock{padding:0;justify-content: center;}

.row.flex .column.imgblock img{ align-self: center;} /*center non 100% width img*/

.row.flex.vcenter{align-items:center;} /*non-figcaption snippets*/

.row.flexblock{margin-left:0;margin-right:0;}

#cmsAltBanner .row.flexblock{margin-left:-1rem;margin-right:-1rem;} /*normal*/



#cmsAltBanner .row.flex .column{padding-left:0;padding-right:0;}

#cmsAltBanner li{height:100%;}



.row.flex figure.hdr figcaption {

    height: 100%;

    display: flex;

    flex-direction: column;

    padding: 1.3em 3em;

    margin:0;

	pointer-events: none;

}

.ineditor .row.flex figure.hdr figcaption {

	pointer-events: all; /*allow text to be edited*/

}

.row.flex.flexblock img{margin-top:0;margin-bottom:0;}

.row.flex figure.hdr figcaption a{pointer-events:all;}

.row.flex figcaption.vcenter{justify-content:center;} /* justify due to flex-dir column */

.row.flex figcaption.end{justify-content:flex-end;}



.row.flex figcaption > div{flex:0;} /*fix for insert div on text align*/



.row.fleximages{display:flex;}

.row.fleximages .column{width:auto;}



.grid{display:grid;}

.grid .column:not(.cloned-handler){width:100%!important;}/*override default, let grid set width excl col drag-reorder (cloned-handler)*/

.grid.clearfix:before, .grid.clearfix:after {content:none;}



.no-img-margin img,

.no-inner-margin figure{margin: 0!important;}



.cbcaptioncontainer{pointer-events: none;}

.cbcaptioncontainer figcaption{pointer-events: all;}

.disableClick figcaption,

.disableClick figure.one > div{pointer-events:none!important;}





.hunder h1,.hunder h2,.hunder h3,.hunder h4,h1.hunder,h2.hunder,h3.hunder,h4.hunder {

	padding-bottom:2rem;position: relative;

}

.hunder h1:before,.hunder h2:before,.hunder h3:before,.hunder h4:before,

h1.hunder:before,h2.hunder:before,h3.hunder:before,h4.hunder:before{

    content: "";position: absolute;width: 80px;height: 2px;bottom: 0;left: 50%;margin-left:-40px;border-bottom-width: 2px;border-bottom-style:solid;

}

.hoverBorderReveal:not(:hover){border-color:transparent!important;}



/*Force last item e.g. buttons to bottom of snippet  - works with plain columns and inner elements*/

.lastElBaseAlign{display:flex;}

.lastElBaseAlign figure,
.lastElBaseAlign .column,
.lastElBaseAlign .object,
.lastElBaseAlign .is-card,
.lastElBaseAlign figcaption{
	display:flex;
	flex-direction:column;
	flex:1;
}

.lastElBaseAlign .column > *:not(.object):not(.is-card):not(figure):last-child,
.lastElBaseAlign .object > *:last-child,
.lastElBaseAlign figure > *:last-child,
.lastElBaseAlign .is-card > *:last-child,
.lastElBaseAlign figcaption > *:last-child{
	margin-top:auto;
}


/* our social media icons */



.socialmediaicons img , .dirlistingsocialmediaicons img { max-width: 32px; max-height: 32px;}



.socialmediaicons ion-icon ,

.dirlistingsocialmediaicons ion-icon ,

.socialmediaicons i.icon ,

.dirlistingsocialmediaicons i.icon {

    display: inline-block;

	width: 32px;

	font-size: 22px;

	padding: 5px;

    background: #999;

    color: white;

    box-sizing: border-box;

    height: 32px;

    vertical-align: bottom;

}



a.socialmediaicon {

    line-height: 32px;

    text-align: center;

}

a.socialmediaicon:hover ion-icon,

a.socialmediaicon:hover i.icon {

	background: black;

	color: white;

}



/* add this icons */

.at-style-responsive .at-share-btn {

    padding: 0px 3px !important;

    height: 32px !important;

    line-height: 32px !important;

}







/* default menu layouts start */



.cmsDefaultMenu #menu,

.cmsDefaultMenu {

        position:relative;

		height: auto; /* fix common styling mistake */

}



.cmsDefaultMenu ul {

	list-style: none;

	margin: 0;

	padding: 0;

}



.cmsDefaultMenu ul>li {

	display: block;

	float: none !important;

	position: relative;

	margin: 0;

}



.cmsHorizontalMenu ul {

	text-align: center;

}



.cmsHorizontalMenu ul>li {

	margin: 0px 15px;

	display: inline-block;

	float: none; /*fix some common issues */

}



.cmsDefaultMenu.cmsVerticalMenu  {

	max-width: 300px;

}



.cmsDefaultMenu.cmsVerticalMenu ul>li {

	display: block !important;

}







.cmsDefaultMenu ul>li li {

	display: block !important;

	margin: 0  !important;

	box-sizing: border-box;

}





.cmsHorizontalMenu  ul>li>ul,

.cmsVerticalMenu  ul>li>ul {

	position: absolute;

	display:none;

	margin: 0;

	min-width: 240px;

	max-width: 320px;

	background-color: rgba(255,255,255,0.7);

	text-align: left;

}



.cmsDefaultMenu ul>li:hover>ul {

	display:block !important;

}





.cmsHorizontalMenu ul ul>li:hover>ul,

.cmsVerticalMenu ul>li:hover>ul {

	display:block !important;

	left: 100% !important;

	top: 0 !important;

	margin:0 !important;

}

.cmsHorizontalMenu ul>li:hover>ul {

	display:block !important;

	left: 0 !important;

	top:auto !important;

	margin: 0 !important;

}



.cmsDefaultMenu li a {

	line-height: 200%;

	margin: 1px;

	text-decoration: none;

	display: block;

	padding: 5px;

	width: 100% !important;

	box-sizing: border-box;

}







 .cmsSiteMapMenu #menu ul {

	display:flex;

	margin:0;

	padding: 0;

	float: none;

}

 .cmsSiteMapMenu #menu ul ul {

	display:block !important;

	position: relative !important;

	left: auto  !important;

	font-size: 80%;

}

.cmsSiteMapMenu #menu ul ul ul {

	margin-left: 5%;

}

 .cmsSiteMapMenu #menu ul>li {

	text-align: left;

	padding: 1px 5px;

	display:block;

	float: none;

	border: none !important;

	background: none !important;

}

 .cmsSiteMapMenu #menu ul>li li {

	float: none;

	display:block;

	width: auto;

}

 .cmsSiteMapMenu #menu ul>li a {

	line-height: inherit;

	padding: 0;

	background: none !important;

	border: none !important;

	width: 100% !important;

}



/* fix some common issues, when overridding */



.cmsVerticalMenu #menu { height: auto; }

.cmsHorizontalMenu #menu ,

.cmsHorizontalMenu #menu ul { width: 100%; float: none; max-width: none; }





/* default menu layouts end */









.hide, .hidden {

	display:none;

}









.cmsTable, .mytable

{

	background: #eee;

	border-spacing: 1px;

	padding: 1px;

	display: table !important; /* was not sticking when sorting variants  */

	width: 100%;

}



.tr

{

    display:table-row;

}

.td, .th

{

    display:table-cell;

}



.mytable>tr>td, .mytable>tbody>tr>td,

.cmsTable>tr>td, .cmsTable>tbody>tr>td,

.mytable>.tr>.td

{

	background: white;

	margin: 0;

	border: 0;

	color: #333;

	vertical-align: top;

	padding: 3px;

	font-weight: normal;

	font-size: 90%;

	word-wrap: break-word;

	word-break: break-word;

}



.mytable tr th ,

.mytable thead td ,

.cmsTable tr th,

.cmsTable thead td {

	padding: 4px;

	background-color: #666666;

	color:white;

	vertical-align: middle;

	text-align:left;

	font-size: 90%;

}



.cmsTable tr th[align=right] {

	text-align:right;

}





.mytable tr:hover td

 {

	background-color: #ddd;

	background-image: none;

}



.mytable .tr>.td>input:not([type]),

.mytable .tr>.td>input[type="text"],

.mytable .tr>.td>input[type="number"],

.mytable .tr>.td>input[type="decimal"],

.mytable .tr>.td>select ,

.mytable .tr>.td>textarea ,

.mytable tr>td>input:not([type]),

.mytable tr>td>form>input:not([type]),

.mytable tr>td>form>input[type="text"],

.mytable tr>td>input[type="text"],

.mytable tr>td>input[type="number"],

.mytable tr>td>input[type="decimal"],

.mytable tr>td>textarea,

.mytable tr>td>select

				{ box-sizing: border-box; width: 100%; min-width: 60px; }



.mytable tr>td>form { width: 100%;  }



.mytable input[type="checkbox"] { width:20px; height: 20px;  }

.toprightcheckbox input[type="checkbox"] { width:20px; height: 20px; margin:0; }









.sessionLoggedIn {padding: 2rem; border: 1px solid #222222;}

.sessionLoggedIn .sessionLoginButtons { display: block; margin-top: 20px;}

.sessionLoggedIn a{border-radius:0;text-transform:uppercase; border: 1px solid #222;font-size: 1.0em!important; letter-spacing: 0.5px;}

.sessionLoggedIn a.btn-retrieve-session { background: #f1df0d; color: black; }

.sessionLoggedIn a.btn-retrieve-session:hover { background:#ffea00;}

.sessionLoggedIn a.btn-logout { background: #393c47; color: white; }

.sessionLoggedIn a.btn-logout:hover { background: #222; text-decoration:none; }





/* New form editor, enables radio items on one line... but spaced... */

.inputOptionSingleLine div { display: inline-block; margin-right: 10px; }



/*

multi column alignment

*/

@media all and (min-width: 560px) {



.row.vAlignMiddle { display: flex !important; }

.row.vAlignMiddle .column { display: flex !important; flex-direction: column!important; justify-content: center !important;}

.row.vAlignBottom { display: flex !important; }

.row.vAlignBottom .column { display: flex !important; flex-direction: column!important; justify-content: flex-end !important;}

.row.vAlignTop { display: flex !important; }

.row.vAlignTop .column { display: flex !important; flex-direction: column!important; justify-content: start !important;}



}





/* BETA STYLES FOR CAPTION OVERLAY NEW ELEMENTS

.cbcaptioncontainer - wrapper for FIGCAPTION

.cbimagecontainer - wrapper for IMG

.cboverlay - append to .cbimagecontainer

*/



.cbcaptioncontainer{display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; position: absolute;z-index:9;top:0;bottom:0;left:0;right:0;}

.cbimagecontainer{position: relative;overflow:hidden;}

.cbimagecontainer:hover img{-webkit-user-select: none;user-select: none;}

.cbimageoverlay{position: absolute;z-index: 8;top:0;bottom:0;left:0;right:0;pointer-events:none;}





/* new auto complete action for search box */



.autoCompleteWrapper { position: relative;}

.autoCompleteResults {

	position:absolute; width: 100%; max-width:800px; max-height: 500px; overflow:auto;

	background: white; border: inset; z-index: 100000; display: none;

}

.autoCompleteResults div { display:block; text-align: left; }

.autoCompleteResults a { color: black;  }

.searchAlignRight .autoCompleteResults { right: 0;}

/* important to override jQuery animations while hovered... */
.autoCompleteWrapper:hover .autoCompleteHasResults,
.autoCompleteHasResults.autoCompleteCurrent,
.autoCompleteHasResults:hover {
	display: block;
}




#ContentCMS.containsContentBox #cmsPageContent.cmsUsualWidth,

.cmsUsualWidth.containsContentBox {

    max-width: none!important;

    width: 100%!important;

    padding-left: 0!important;

    padding-right: 0!important;

}





.searchResults . cmsSearchResultPageName   { font-style: italic; font-size: 85%;}





.verticalAlignMiddle {

vertical-align: middle;

}



/*=================================



HEADER FLEX DESKTOP - MASTHEAD STYLING



=================================*/



header {

   display: flex;

   position: relative;

   column-gap: 0.5rem;

   gap:0.5rem;

   margin-top:0.5rem;

}



.column.header-flex-center {

    justify-content: center;

    align-items: center;

    width: auto;

    margin: 0;

}

header.row,

header .row {

    margin-left: auto;

    margin-right: auto;

}

header .column {

    overflow: visible;

}

header.clearfix:before,

header.clearfix:after {

    display: none;

}

header #mobbtn {

    padding: 0;

    position: relative;

}

.column.flex-col {

    flex-direction: column;

    column-gap:  0.5rem;

    gap: 0.5rem;

}

.column.header-flex-fill {

    flex: 1 0 0;

    align-items: center;

}

.column.header-flex-item {

    display: flex;

    padding-inline: 0;

    width: auto;

}

.header-flex-item.flex-col {

    padding-top:0.5rem;

}



@media(min-width:561px){



.column.header-flex-fill:last-of-type {

    justify-content: flex-end;

}

.column.header-flex-fill.flex-col:last-of-type {

    justify-content: center;

    align-items: flex-end;

}



}











.cmsPopupStackable {

	font-family: arial;

	z-index: 10003; /*more than colorbox */

	background:rgba(0,0,0,0.3);

	position:fixed;

	height:100%;

	width:100%;

	top:0;

	left:0;

}

.cmsPopupCloseOverlay {

	position:absolute;

	top:0; left: 0;

	height:100%;

	width:100%;

}



.cmsModal {

	position:relative;

  background: white;

  box-shadow: rgba(0,0,0,0.3) 5px 5px 9px!important;

  border-radius: 4px;

  display: block;

  border-width: 25px 4px 4px;

  border-style: solid;

  border-color: white;

  border-image: initial;

  box-sizing: border-box;

  padding: 0;

  bottom: auto;

  max-height: 90%;

  max-width: 90%;

  margin: 0 auto;

  top: 5%;

}







.cmsDraggablePopupTitle {

  cursor: move;

	position: absolute;

    top: -24px; width: 96%;

	padding: 6px 0;

    font-weight: 200;

	font-size: 12px;

	min-height:12px;

    left: 10px;

    color: #999;

	overflow: hidden;

    height: 20px;

}



.cmsModal iframe { margin:0; padding: 0; width: 100%; height: 100%; }





.cmsModal .cmsPopupCloseButton {

	position:absolute; right:-2px; top:-25px; margin: 0; display:block; padding: 6px; color:silver; text-decoration:none; cursor: pointer; font-size: 15px; background: white;

}



@media (max-width: 600px) {

  .cmsModal .cmsPopupCloseButton {

		font-size: 20px;

	}

}