/* cw.css
 *
 * Styles will be placed here if:
 * 	- The style exclusively defines page structure framework
 * 	- Base component styling not vital to component functioning see components.css
 *
 * NOTE: Styles defined here will be used by both products and themes
 **/

/** Column Framework ***********************************************************/
.clearfix:after, .col-1:after, .col-2:after, .col-3:after, .col-4:after, .col-5:after, .col-6:after, .col-12:after {content: ' ';display: block;clear: both;}
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-12 { clear:both; padding: 0; list-style: none; margin: 0 -15px; }
.col, .col-right { float: left; word-wrap:break-word; padding: 0 15px; box-sizing: border-box; -webkit-box-sizing: border-box; }
.col-right { float: right; }
.col-1 > .col, .col-1 > .col-right    { width: 100%; }
.col-2 > .col, .col-2 > .col-right    { width: 50%; }
.col-3 > .col, .col-3 > .col-right    { width: 33.333333%; }
.col-4 > .col, .col-4 > .col-right    { width: 25%; }
.col-5 > .col, .col-5 > .col-right    { width: 20%; }
.col-6 > .col, .col-6 > .col-right    { width: 16.666666%; }
.col-12 > .col, .col-12 > .col-right  { width: 8.333333%; }
/* COLUMN SPANNING */
/* multiples of previous columns */
.col-2 > .span-2,
	.col-3  > .span-3,
	.col-4  > .span-4,
	.col-5  > .span-5,
	.col-6  > .span-6,
	.col-12 > .span-12  { width: 100%; }       /* 1col */
.col-4 > .span-2,
	.col-6  > .span-3,
	.col-12 > .span-6   { width: 50% }         /* 2col */
.col-6 > .span-2,
	.col-12 > .span-4   { width: 33.333333%; } /* 3col */
.col-12 > .span-3       { width: 25%; }        /* 4col */
.col-12 > .span-2       { width: 16.666666%; } /* 6col */
/* span2 (at lowest fraction reduction) */
.col-3 > .span-2,
	.col-6  > .span-4,
	.col-12 > .span-8   { width: 66.666666%; }
.col-5 > .span-2        { width: 40%; }
/* span3 (at lowest fraction reduction) */
.col-4 > .span-3,
	.col-12 > .span-9   { width: 75%; }
.col-5 > .span-3        { width: 60%; }
/* span4 (at lowest fraction reduction) */
.col-5 > .span-4        { width: 80%; }
/* span5 (at lowest fraction reduction) */
.col-6 > .span-5,
	.col-12 > .span-10  { width: 83.333333%; }
.col-12 > .span-5       { width: 41.666666%; }
/* span7 (at lowest fraction reduction) */
.col-12 > .span-7       { width: 58.333333%; }
/* span11 (at lowest fraction reduction) */
.col-12 > .span-11      { width: 91.666666%; }
/* offset */
.col-1  > .offset-0,
	.col-2  > .offset-0,
	.col-3  > .offset-0,
	.col-4  > .offset-0,
	.col-5  > .offset-0,
	.col-6  > .offset-0,
	.col-12  > .offset-0 { margin-left: 0; }
.col-2  > .offset-1  { margin-left: 50%; }
.col-3  > .offset-1  { margin-left: 33.333333%; }
.col-4  > .offset-1  { margin-left: 25%; }
.col-5  > .offset-1  { margin-left: 20%; }
.col-6  > .offset-1  { margin-left: 16.666666%; }
.col-12 > .offset-1  { margin-left: 8.333333%; }
.col-3  > .offset-2  { margin-left: 66.666666%; }
.col-4  > .offset-2  { margin-left: 50%; }
.col-5  > .offset-2  { margin-left: 40%; }
.col-6  > .offset-2  { margin-left: 33.333333%; }
.col-12 > .offset-2  { margin-left: 16.666666%; }
.col-4  > .offset-3  { margin-left: 75%; }
.col-5  > .offset-3  { margin-left: 60%; }
.col-6  > .offset-3  { margin-left: 50%; }
.col-12 > .offset-3  { margin-left: 24.999999%; }
.col-5  > .offset-4  { margin-left: 80%; }
.col-6  > .offset-4  { margin-left: 66.666666%; }
.col-12 > .offset-4  { margin-left: 33.333333%; }
.col-6  > .offset-5  { margin-left: 83.333333%; }
.col-12 > .offset-5  { margin-left: 41.666666%; }
.col-12 > .offset-6  { margin-left: 49.999999%; }
.col-12 > .offset-7  { margin-left: 58.333333%; }
.col-12 > .offset-8  { margin-left: 66.666666%; }
.col-12 > .offset-9  { margin-left: 74.999999%; }
.col-12 > .offset-10 { margin-left: 83.333333%; }
.col-12 > .offset-11 { margin-left: 91.666666%; }
.clear { clear: both; }

@media only screen and (max-width:1023px) { /* Large */
	.md-col-right { float: right; }
	/* multiples of previous columns */
	.col-2 > .md-span-2,
		.col-3  > .md-span-3,
		.col-4  > .md-span-4,
		.col-5  > .md-span-5,
		.col-6  > .md-span-6,
		.col-12 > .md-span-12  { width: 100%; }       /* 1col */
	.col-4 > .span-2,
		.col-6  > .md-span-3,
		.col-12 > .md-span-6   { width: 50% }         /* 2col */
	.col-6 > .md-span-2,
		.col-12 > .md-span-4   { width: 33.333333%; } /* 3col */
	.col-12 > .md-span-3       { width: 25%; }        /* 4col */
	.col-12 > .md-span-2       { width: 16.666666%; } /* 6col */
	/* span2 (at lowest fraction reduction) */
	.col-3 > .span-2,
		.col-6  > .md-span-4,
		.col-12 > .md-span-8   { width: 66.666666%; }
	.col-5 > .md-span-2        { width: 40%; }
	/* span3 (at lowest fraction reduction) */
	.col-4 > .md-span-3,
		.col-12 > .md-span-9   { width: 75%; }
	.col-5 > .md-span-3        { width: 60%; }
	/* span4 (at lowest fraction reduction) */
	.col-5 > .md-span-4        { width: 80%; }
	/* span5 (at lowest fraction reduction) */
	.col-6 > .md-span-5,
		.col-12 > .md-span-10  { width: 83.333333%; }
	.col-12 > .md-span-5       { width: 41.666666%; }
	/* span7 (at lowest fraction reduction) */
	.col-12 > .md-span-7       { width: 58.333333%; }
	/* span11 (at lowest fraction reduction) */
	.col-12 > .md-span-11      { width: 91.666666%; }
	/* offset */
	.col-1  > .md-offset-0,
		.col-2  > .md-offset-0,
		.col-3  > .md-offset-0,
		.col-4  > .md-offset-0,
		.col-5  > .md-offset-0,
		.col-6  > .md-offset-0,
		.col-12  > .md-offset-0 { margin-left: 0; }
	.col-2  > .md-offset-1  { margin-left: 50%; }
	.col-3  > .md-offset-1  { margin-left: 33.333333%; }
	.col-4  > .md-offset-1  { margin-left: 25%; }
	.col-5  > .md-offset-1  { margin-left: 20%; }
	.col-6  > .md-offset-1  { margin-left: 16.666666%; }
	.col-12 > .md-offset-1  { margin-left: 8.333333%; }
	.col-3  > .md-offset-2  { margin-left: 66.666666%; }
	.col-4  > .md-offset-2  { margin-left: 50%; }
	.col-5  > .md-offset-2  { margin-left: 40%; }
	.col-6  > .md-offset-2  { margin-left: 33.333333%; }
	.col-12 > .md-offset-2  { margin-left: 16.666666%; }
	.col-4  > .md-offset-3  { margin-left: 75%; }
	.col-5  > .md-offset-3  { margin-left: 60%; }
	.col-6  > .md-offset-3  { margin-left: 50%; }
	.col-12 > .md-offset-3  { margin-left: 24.999999%; }
	.col-5  > .md-offset-4  { margin-left: 80%; }
	.col-6  > .md-offset-4  { margin-left: 66.666666%; }
	.col-12 > .md-offset-4  { margin-left: 33.333333%; }
	.col-6  > .md-offset-5  { margin-left: 83.333333%; }
	.col-12 > .md-offset-5  { margin-left: 41.666666%; }
	.col-12 > .md-offset-6  { margin-left: 49.999999%; }
	.col-12 > .md-offset-7  { margin-left: 58.333333%; }
	.col-12 > .md-offset-8  { margin-left: 66.666666%; }
	.col-12 > .md-offset-9  { margin-left: 74.999999%; }
	.col-12 > .md-offset-10 { margin-left: 83.333333%; }
	.col-12 > .md-offset-11 { margin-left: 91.666666%; }
}

@media only screen and (max-width:767px) { /* Large */
	.sm-col-right { float: right; }
	/* multiples of previous columns */
	.col-2 > .sm-span-2,
		.col-3  > .sm-span-3,
		.col-4  > .sm-span-4,
		.col-5  > .sm-span-5,
		.col-6  > .sm-span-6,
		.col-12 > .sm-span-12  { width: 100%; }       /* 1col */
	.col-4 > .span-2,
		.col-6  > .sm-span-3,
		.col-12 > .sm-span-6   { width: 50% }         /* 2col */
	.col-6 > .sm-span-2,
		.col-12 > .sm-span-4   { width: 33.333333%; } /* 3col */
	.col-12 > .sm-span-3       { width: 25%; }        /* 4col */
	.col-12 > .sm-span-2       { width: 16.666666%; } /* 6col */
	/* span2 (at lowest fraction reduction) */
	.col-3 > .span-2,
		.col-6  > .sm-span-4,
		.col-12 > .sm-span-8   { width: 66.666666%; }
	.col-5 > .sm-span-2        { width: 40%; }
	/* span3 (at lowest fraction reduction) */
	.col-4 > .sm-span-3,
		.col-12 > .sm-span-9   { width: 75%; }
	.col-5 > .sm-span-3        { width: 60%; }
	/* span4 (at lowest fraction reduction) */
	.col-5 > .sm-span-4        { width: 80%; }
	/* span5 (at lowest fraction reduction) */
	.col-6 > .sm-span-5,
		.col-12 > .sm-span-10  { width: 83.333333%; }
	.col-12 > .sm-span-5       { width: 41.666666%; }
	/* span7 (at lowest fraction reduction) */
	.col-12 > .sm-span-7       { width: 58.333333%; }
	/* span11 (at lowest fraction reduction) */
	.col-12 > .sm-span-11      { width: 91.666666%; }
	/* offset */
	.col-1  > .sm-offset-0,
		.col-2  > .sm-offset-0,
		.col-3  > .sm-offset-0,
		.col-4  > .sm-offset-0,
		.col-5  > .sm-offset-0,
		.col-6  > .sm-offset-0,
		.col-12  > .sm-offset-0 { margin-left: 0; }
	.col-2  > .sm-offset-1  { margin-left: 50%; }
	.col-3  > .sm-offset-1  { margin-left: 33.333333%; }
	.col-4  > .sm-offset-1  { margin-left: 25%; }
	.col-5  > .sm-offset-1  { margin-left: 20%; }
	.col-6  > .sm-offset-1  { margin-left: 16.666666%; }
	.col-12 > .sm-offset-1  { margin-left: 8.333333%; }
	.col-3  > .sm-offset-2  { margin-left: 66.666666%; }
	.col-4  > .sm-offset-2  { margin-left: 50%; }
	.col-5  > .sm-offset-2  { margin-left: 40%; }
	.col-6  > .sm-offset-2  { margin-left: 33.333333%; }
	.col-12 > .sm-offset-2  { margin-left: 16.666666%; }
	.col-4  > .sm-offset-3  { margin-left: 75%; }
	.col-5  > .sm-offset-3  { margin-left: 60%; }
	.col-6  > .sm-offset-3  { margin-left: 50%; }
	.col-12 > .sm-offset-3  { margin-left: 24.999999%; }
	.col-5  > .sm-offset-4  { margin-left: 80%; }
	.col-6  > .sm-offset-4  { margin-left: 66.666666%; }
	.col-12 > .sm-offset-4  { margin-left: 33.333333%; }
	.col-6  > .sm-offset-5  { margin-left: 83.333333%; }
	.col-12 > .sm-offset-5  { margin-left: 41.666666%; }
	.col-12 > .sm-offset-6  { margin-left: 49.999999%; }
	.col-12 > .sm-offset-7  { margin-left: 58.333333%; }
	.col-12 > .sm-offset-8  { margin-left: 66.666666%; }
	.col-12 > .sm-offset-9  { margin-left: 74.999999%; }
	.col-12 > .sm-offset-10 { margin-left: 83.333333%; }
	.col-12 > .sm-offset-11 { margin-left: 91.666666%; }
}

@media only screen and (max-width:767px) {
	.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-12,
	.col-1 > .col, .col-2 > .col, .col-3 > .col, .col-4 > .col, .col-5 > .col, .col-6 > .col, .col-12 > .col,
	.col-1 > .col-right, .col-2 > .col-right, .col-3 > .col-right, .col-4 > .col-right, .col-5 > .col-right, .col-6 > .col-right, .col-12 > .col-right,
	.sm-col-right, .lg-col-right { display: block; float: none; width: auto !important; }
}

/** Images *********************************************************************/
img, textarea, video, iframe, select, input, table, fieldset { max-width: 100%; }

/** Disable Wrapping Around Floats *********************************************/
/* Stopes an element from wrapping around another floated element */
.disable-floatwrap { display: table; }

/** Lists **********************************************************************/
.list-reset, .list-inline { list-style: none; margin: 0; padding: 0; }
.list-inline, .list-inline li { display: inline-block; *display: inline; }

/** Media Queries / Screen Sizes ***********************************************/
.sr-only { position:absolute; left:-1px; top:0; width:1px; height:1px; overflow:hidden; padding: 0; margin: -1px; clip: rect(0,0,0,0); border: none; }
.sr-only-focusable:active, .sr-only-focusable:focus { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; }

/* Print not supported in IE8, needs a seperate stylesheet */
.lteie8 .xs-only, .lteie8 .sm-only, .lteie8 .md-only, .lteie8 .lg-hide, .lteie8 .md-gte-hide, .lteie8 .sm-gte-hide, .lteie8 .xs-gte-hide, .lteie8 .lg-gte-hide, .lteie8 .lg-lte-hide { display: none !important; }

@media print {
	.pr-hide { display: none !important; }
}
@media only screen and (min-width:1024px) { /* Large */
	.pr-only, .xs-only, .sm-only, .md-only, .lg-hide, .md-gte-hide, .sm-gte-hide, .xs-gte-hide, .lg-gte-hide, .lg-lte-hide { display: none !important; }
}
@media only screen and (min-width:768px) and (max-width:1023px) { /* Med */
	.pr-only, .xs-only, .sm-only, .lg-only, .md-hide, .md-gte-hide, .md-lte-hide, .sm-gte-hide, .xs-gte-hide, .lg-lte-hide { display: none !important; }
}
@media only screen and (max-width:767px) and (min-width:480px) { /* Small */
 	.pr-only, .xs-only, .md-only, .lg-only, .sm-hide, .md-lte-hide, .sm-gte-hide, .sm-lte-hide, .xs-gte-hide, .lg-lte-hide { display: none !important; }
}
@media only screen and (max-width:479px) { /* XSmall */
 	.pr-only, .sm-only, .md-only, .lg-only, .xs-hide, .md-lte-hide, .sm-lte-hide, .xs-gte-hide, .xs-lte-hide, .lg-lte-hide { display: none !important; }
}

/** Depricated *****************************************************************/
@media only screen and (min-width:479px) {
	.screen-small { display: none !important; }
}
@media print {
	.screen-small { display: none !important; }
}