/** Workflow nav - work "in stages" */
ul.stages {
	margin: 0;
	padding: 0 20px 5px 22px; /* 0, x, 5, x + 2 */
	background: white;
}

ul.stages li {
	display: inline-block;
	height: 40px; /* 2x */
	line-height: 40px; /* 2x */
	margin: 5px 1px 0 0;
	text-indent: 35px;
	position: relative;
}

/* IE7 hack */
ul.stages li {
	*display: inline;
	*zoom: 1;
}

ul.stages li:before {
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	left: 0;
	top: 0;
	border-style: solid;
	border-width: 20px 0 20px 20px; /* x */
	border-color: transparent transparent transparent #fff;
	z-index: 0;
}

ul.stages li:first-child:before {
	border-color: transparent;
}

ul.stages li a:after {
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	right: -20px; /* x */
	top: 0;
	border-style: solid;
	border-width: 20px 0 20px 20px; /* x */
	z-index: 10;
}

ul.stages a {
	padding: 0;
}

ul.stages li a {
	display: block;
	padding-right: 10px; /* x/2 */
}

ul.stages li.selected a {
	z-index: 100;
}

ul.stages li.heading {
	position: relative;
	left: -20px; /* x */
	margin-right: -15px;
	font-weight: bold;
	font-size: 110%;
}

@media only screen and (max-width: 767px) {
	ul.stages a {
		padding: 0 10px 0 0 !important;
	}
}

/* colours - background hover selected

theme 1: #004e8f #005dab #0072cf
theme 2: #0c5963 #1e7680 #28828a
theme 3: #612d70 #782c7e #8f2b8c
theme 4: #355918 #4b701c #57831a
theme 5: #ab3901 #d45812 #df671d
theme 6: #a51137 #be1741 #d61746

*/

.campl-theme-1 ul.stages li.heading {
	color: #004E8F;
}

.campl-theme-1 ul.stages li a {
	background: #004E8F;
}

ul.stages {
	border-bottom: 1px solid #e4e4e4;
}

.campl-theme-1 ul.stages li a:after {
	border-color: transparent transparent transparent #004E8F;
}

.campl-theme-1 ul.stages li a:hover:after {
	border-color: transparent transparent transparent #005dab;
}

.campl-theme-1 ul.stages li a:hover {
	background: #005dab;
}

.campl-theme-1 ul.stages li.selected a {
	background: #0072cf;
}

.campl-theme-1 ul.stages li.selected a:after {
	border-left-color: #0072cf;
}

.campl-theme-2 ul.stages li.heading {
	color: #0c5963;
}

.campl-theme-2 ul.stages li a {
	background: #0c5963;
}

.campl-theme-2 ul.stages li a:after {
	border-color: transparent transparent transparent #0c5963;
}

.campl-theme-2 ul.stages li a:hover:after {
	border-color: transparent transparent transparent #1e7680;
}

.campl-theme-2 ul.stages li a:hover {
	background: #1e7680;
}

.campl-theme-2 ul.stages li.selected a {
	background: #28828a;
}

.campl-theme-2 ul.stages li.selected a:after {
	border-left-color: #28828a;
}

.campl-theme-3 ul.stages li.heading {
	color: #612d70;
}

.campl-theme-3 ul.stages li a {
	background: #612d70;
}

.campl-theme-3 ul.stages li a:after {
	border-color: transparent transparent transparent #612d70;
}

.campl-theme-3 ul.stages li a:hover:after {
	border-color: transparent transparent transparent #782c7e;
}

.campl-theme-3 ul.stages li a:hover {
	background: #782c7e;
}

.campl-theme-3 ul.stages li.selected a {
	background: #8f2b8c;
}

.campl-theme-3 ul.stages li.selected a:after {
	border-left-color: #8f2b8c;
}

.campl-theme-4 ul.stages li.heading {
	color: #355918;
}

.campl-theme-4 ul.stages li a {
	background: #355918;
}

.campl-theme-4 ul.stages li a:after {
	border-color: transparent transparent transparent #355918;
}

.campl-theme-4 ul.stages li a:hover:after {
	border-color: transparent transparent transparent #4b701c;
}

.campl-theme-4 ul.stages li a:hover {
	background: #4b701c;
}

.campl-theme-4 ul.stages li.selected a {
	background: #57831a;
}

.campl-theme-4 ul.stages li.selected a:after {
	border-left-color: #57831a;
}

.campl-theme-5 ul.stages li.heading {
	color: #ab3901;
}

.campl-theme-5 ul.stages li a {
	background: #ab3901;
}

.campl-theme-5 ul.stages li a:after {
	border-color: transparent transparent transparent #ab3901;
}

.campl-theme-5 ul.stages li a:hover:after {
	border-color: transparent transparent transparent #d45812;
}

.campl-theme-5 ul.stages li a:hover {
	background: #d45812;
}

.campl-theme-5 ul.stages li.selected a {
	background: #df671d;
}

.campl-theme-5 ul.stages li.selected a:after {
	border-left-color: #df671d;
}

.campl-theme-6 ul.stages li.heading {
	color: #a51137;
}

.campl-theme-6 ul.stages li a {
	background: #a51137;
}

.campl-theme-6 ul.stages li a:after {
	border-color: transparent transparent transparent #a51137;
}

.campl-theme-6 ul.stages li a:hover:after {
	border-color: transparent transparent transparent #be1741;
}

.campl-theme-6 ul.stages li a:hover {
	background: #be1741;
}

.campl-theme-6 ul.stages li.selected a {
	background: #d61746;
}

.campl-theme-6 ul.stages li.selected a:after {
	border-left-color: #d61746;
}
