ul li.purple::before { background-color: #9673ff !important; }
ul li.green::before { background-color: #367321 !important; }
ul li.red::before { background-color: #ec3131 !important; }
ul li.brown::before { background-color: #ba6e30 !important; }
ul li.orange::before { background-color: #ff8638 !important; }
ul li.dark::before { background-color: #545454 !important; }
ul li.yellow::before { background-color: #f2d500 !important; }
ul li.blue::before { background-color: #3f63fa !important; }
ul li.pink::before { background-color: #da3ec2 !important; }
ul li.lightgrey::before { background-color: #c7c7c7 !important; }
ul li.lightblue::before { background-color: #579eed !important; }



.dots36.cat-00, .dots36.grey { background-position: 0px 0px;  height: 34px; width: 36px; }
.dots36.cat-01, .dots36.brown { background-position: -36px 0px;  height: 34px; width: 36px; }
.dots36.cat-02, .dots36.orange { background-position: -72px 0px;  height: 34px; width: 36px; }
.dots36.cat-03, .dots36.red { background-position: -108px 0px;  height: 34px; width: 36px; }
.dots36.cat-04, .dots36.winered { background-position: -144px 0px;  height: 34px; width: 36px; }
.dots36.cat-05, .dots36.pink { background-position: -180px 0px;  height: 34px; width: 36px; }
.dots36.cat-06, .dots36.purple { background-position: -216px 0px;  height: 34px; width: 36px; }
.dots36.cat-07, .dots36.blue { background-position: -252px 0px;  height: 34px; width: 36px; }
.dots36.cat-08, .dots36.lightblue { background-position: -288px 0px;  height: 34px; width: 36px; }
.dots36.cat-09, .dots36.petrol { background-position: -324px 0px;  height: 34px; width: 36px; }
.dots36.cat-10, .dots36.turquoise { background-position: -360px 0px;  height: 34px; width: 36px; }
.dots36.cat-11, .dots36.neongreen { background-position: -396px 0px;  height: 34px; width: 36px; }
.dots36.cat-12, .dots36.lightgreen { background-position: -432px 0px;  height: 34px; width: 36px; }
.dots36.cat-13, .dots36.green { background-position: -468px 0px;  height: 34px; width: 36px; }
.dots36.cat-14, .dots36.lightyellow { background-position: -504px 0px;  height: 34px; width: 36px; }
.dots36.cat-15, .dots36.yellow { background-position: -540px 0px;  height: 34px; width: 36px; }
.dots36.cat-16, .dots36.lightgrey { background-position: -576px 0px;  height: 34px; width: 36px; }
.dots36.cat-17, .dots36.dark { background-position: -612px 0px;  height: 34px; width: 36px; }



.icons16 {
	background: url(../images/sprites/icons16.png) no-repeat transparent;
	display: inline-block;
	height: 16px; 
	width: 16px;
}

.icons16.add { background-position:  -0px -0px; height: 16px; width: 16px; }
.icons16.delete { background-position:  -16px -0px; height: 16px; width: 16px; }
.icons16.edit { background-position:  -32px -0px; height: 16px; width: 16px; }

a .icons16 {
	margin: 6px 0px;
}

a .text {
	margin: 3px 8px;
}

.dots36 {
	background: url(../images/sprites/dots36.png) no-repeat transparent;
	display: inline-block;
	height: 34px; 
	width: 36px;
}

.dots36.cat-00, .dots36.grey { background-position: 0px 0px;  height: 34px; width: 36px; }
.dots36.cat-01, .dots36.brown { background-position: -36px 0px;  height: 34px; width: 36px; }
.dots36.cat-02, .dots36.orange { background-position: -72px 0px;  height: 34px; width: 36px; }
.dots36.cat-03, .dots36.red { background-position: -108px 0px;  height: 34px; width: 36px; }
.dots36.cat-04, .dots36.winered { background-position: -144px 0px;  height: 34px; width: 36px; }
.dots36.cat-05, .dots36.pink { background-position: -180px 0px;  height: 34px; width: 36px; }
.dots36.cat-06, .dots36.purple { background-position: -216px 0px;  height: 34px; width: 36px; }
.dots36.cat-07, .dots36.blue { background-position: -252px 0px;  height: 34px; width: 36px; }
.dots36.cat-08, .dots36.lightblue { background-position: -288px 0px;  height: 34px; width: 36px; }
.dots36.cat-09, .dots36.petrol { background-position: -324px 0px;  height: 34px; width: 36px; }
.dots36.cat-10, .dots36.turquoise { background-position: -360px 0px;  height: 34px; width: 36px; }
.dots36.cat-11, .dots36.neongreen { background-position: -396px 0px;  height: 34px; width: 36px; }
.dots36.cat-12, .dots36.lightgreen { background-position: -432px 0px;  height: 34px; width: 36px; }
.dots36.cat-13, .dots36.green { background-position: -468px 0px;  height: 34px; width: 36px; }
.dots36.cat-14, .dots36.lightyellow { background-position: -504px 0px;  height: 34px; width: 36px; }
.dots36.cat-15, .dots36.yellow { background-position: -540px 0px;  height: 34px; width: 36px; }
.dots36.cat-16, .dots36.lightgrey { background-position: -576px 0px;  height: 34px; width: 36px; }
.dots36.cat-17, .dots36.dark { background-position: -612px 0px;  height: 34px; width: 36px; }


.dots30 {
	background: url(../images/sprites/dots30.png) no-repeat transparent;
	display: inline-block;
	height: 28px; 
	width: 30px;
}

.dots30.cat-00, .dots30.grey { background-position: -0px -0px;  height: 28px; width: 30px; }
.dots30.cat-01, .dots30.brown { background-position: -30px -0px;  height: 28px; width: 30px; }
.dots30.cat-02, .dots30.orange { background-position: -60px -0px;  height: 28px; width: 30px; }
.dots30.cat-03, .dots30.red { background-position: -90px -0px;  height: 28px; width: 30px; }
.dots30.cat-04, .dots30.winered { background-position: -120px -0px;  height: 28px; width: 30px; }
.dots30.cat-05, .dots30.pink { background-position: -150px -0px;  height: 28px; width: 30px; }
.dots30.cat-06, .dots30.purple { background-position: -180px -0px;  height: 28px; width: 30px; }
.dots30.cat-07, .dots30.blue { background-position: -210px -0px;  height: 28px; width: 30px; }
.dots30.cat-08, .dots30.lightblue { background-position: -240px -0px;  height: 28px; width: 30px; }
.dots30.cat-09, .dots30.petrol { background-position: -270px -0px;  height: 28px; width: 30px; }
.dots30.cat-10, .dots30.turquoise { background-position: -300px -0px;  height: 28px; width: 30px; }
.dots30.cat-11, .dots30.neongreen { background-position: -330px -0px;  height: 28px; width: 30px; }
.dots30.cat-12, .dots30.lightgreen { background-position: -360px -0px;  height: 28px; width: 30px; }
.dots30.cat-13, .dots30.green { background-position: -390px -0px;  height: 28px; width: 30px; }
.dots30.cat-14, .dots30.lightyellow { background-position: -420px -0px;  height: 28px; width: 30px; }
.dots30.cat-15, .dots30.yellow { background-position: -450px -0px;  height: 28px; width: 30px; }
.dots30.cat-16, .dots30.lightgrey { background-position: -480px -0px;  height: 28px; width: 30px; }
.dots30.cat-17, .dots30.dark { background-position: -510px -0px;  height: 28px; width: 30px; }


.dots24 {
	background: url(../images/sprites/dots24.png) no-repeat transparent;
	display: inline-block;
	height: 22px; 
	width: 24px;
}

.dots24.cat-00, .dots24.grey { background-position: -0px -0px;  height: 22px; width: 24px; }
.dots24.cat-01, .dots24.brown { background-position: -24px -0px;  height: 22px; width: 24px; }
.dots24.cat-02, .dots24.orange { background-position: -48px -0px;  height: 22px; width: 24px; }
.dots24.cat-03, .dots24.red { background-position: -72px -0px;  height: 22px; width: 24px; }
.dots24.cat-04, .dots24.winered { background-position: -96px -0px;  height: 22px; width: 24px; }
.dots24.cat-05, .dots24.pink { background-position: -120px -0px;  height: 22px; width: 24px; }
.dots24.cat-06, .dots24.purple { background-position: -144px -0px;  height: 22px; width: 24px; }
.dots24.cat-07, .dots24.blue { background-position: -168px -0px;  height: 22px; width: 24px; }
.dots24.cat-08, .dots24.lightblue { background-position: -192px -0px;  height: 22px; width: 24px; }
.dots24.cat-09, .dots24.petrol { background-position: -216px -0px;  height: 22px; width: 24px; }
.dots24.cat-10, .dots24.turquoise { background-position: -240px -0px;  height: 22px; width: 24px; }
.dots24.cat-11, .dots24.neongreen { background-position: -264px -0px;  height: 22px; width: 24px; }
.dots24.cat-12, .dots24.lightgreen { background-position: -288px -0px;  height: 22px; width: 24px; }
.dots24.cat-13, .dots24.green { background-position: -312px -0px;  height: 22px; width: 24px; }
.dots24.cat-14, .dots24.lightyellow { background-position: -336px -0px;  height: 22px; width: 24px; }
.dots24.cat-15, .dots24.yellow { background-position: -360px -0px;  height: 22px; width: 24px; }
.dots24.cat-16, .dots24.lightgrey { background-position: -384px -0px;  height: 22px; width: 24px; }
.dots24.cat-17, .dots24.dark { background-position: -408px -0px;  height: 22px; width: 24px; }


.dots18 {
	background: url(../images/sprites/dots18.png) no-repeat transparent;
	display: inline-block;
	height: 17px; 
	width: 18px;
}

.dots18.cat-00, .dots18.grey { background-position: -0px -0px;  height: 17px; width: 18px; }
.dots18.cat-01, .dots18.brown { background-position: -18px -0px;  height: 17px; width: 18px; }
.dots18.cat-02, .dots18.orange { background-position: -36px -0px;  height: 17px; width: 18px; }
.dots18.cat-03, .dots18.red { background-position: -54px -0px;  height: 17px; width: 18px; }
.dots18.cat-04, .dots18.winered { background-position: -72px -0px;  height: 17px; width: 18px; }
.dots18.cat-05, .dots18.pink { background-position: -90px -0px;  height: 17px; width: 18px; }
.dots18.cat-06, .dots18.purple { background-position: -108px -0px;  height: 17px; width: 18px; }
.dots18.cat-07, .dots18.blue { background-position: -126px -0px;  height: 17px; width: 18px; }
.dots18.cat-08, .dots18.lightblue { background-position: -144px -0px;  height: 17px; width: 18px; }
.dots18.cat-09, .dots18.petrol { background-position: -162px -0px;  height: 17px; width: 18px; }
.dots18.cat-10, .dots18.turquoise { background-position: -180px -0px;  height: 17px; width: 18px; }
.dots18.cat-11, .dots18.neongreen { background-position: -198px -0px;  height: 17px; width: 18px; }
.dots18.cat-12, .dots18.lightgreen { background-position: -216px -0px;  height: 17px; width: 18px; }
.dots18.cat-13, .dots18.green { background-position: -234px -0px;  height: 17px; width: 18px; }
.dots18.cat-14, .dots18.lightyellow { background-position: -252px -0px;  height: 17px; width: 18px; }
.dots18.cat-15, .dots18.yellow { background-position: -270px -0px;  height: 17px; width: 18px; }
.dots18.cat-16, .dots18.lightgrey { background-position: -288px -0px;  height: 17px; width: 18px; }
.dots18.cat-17, .dots18.dark { background-position: -306px -0px;  height: 17px; width: 18px; }


.dots12 {
	background: url(../images/sprites/dots12.png) no-repeat transparent;
	display: inline-block;
	height: 11px; 
	width: 12px;
}

.dots12.cat-00, .dots12.grey { background-position: -0px -0px;  height: 11px; width: 12px; }
.dots12.cat-01, .dots12.brown { background-position: -12px -0px;  height: 11px; width: 12px; }
.dots12.cat-02, .dots12.orange { background-position: -24px -0px;  height: 11px; width: 12px; }
.dots12.cat-03, .dots12.red { background-position: -36px -0px;  height: 11px; width: 12px; }
.dots12.cat-04, .dots12.winered { background-position: -48px -0px;  height: 11px; width: 12px; }
.dots12.cat-05, .dots12.pink { background-position: -60px -0px;  height: 11px; width: 12px; }
.dots12.cat-06, .dots12.purple { background-position: -72px -0px;  height: 11px; width: 12px; }
.dots12.cat-07, .dots12.blue { background-position: -84px -0px;  height: 11px; width: 12px; }
.dots12.cat-08, .dots12.lightblue { background-position: -96px -0px;  height: 11px; width: 12px; }
.dots12.cat-09, .dots12.petrol { background-position: -108px -0px;  height: 11px; width: 12px; }
.dots12.cat-10, .dots12.turquoise { background-position: -120px -0px;  height: 11px; width: 12px; }
.dots12.cat-11, .dots12.neongreen { background-position: -132px -0px;  height: 11px; width: 12px; }
.dots12.cat-12, .dots12.lightgreen { background-position: -144px -0px;  height: 11px; width: 12px; }
.dots12.cat-13, .dots12.green { background-position: -156px -0px;  height: 11px; width: 12px; }
.dots12.cat-14, .dots12.lightyellow { background-position: -168px -0px;  height: 11px; width: 12px; }
.dots12.cat-15, .dots12.yellow { background-position: -180px -0px;  height: 11px; width: 12px; }
.dots12.cat-16, .dots12.lightgrey { background-position: -192px -0px;  height: 11px; width: 12px; }
.dots12.cat-17, .dots12.dark { background-position: -204px -0px;  height: 11px; width: 12px; }


.dots9 {
	background: url(../images/sprites/dots9.png) no-repeat transparent;
	display: inline-block;
	height: 9px; 
	width: 9px;
}

.dots9.cat-00, .dots9.grey { background-position: -0px -0px;  height: 8px; width: 9px; }
.dots9.cat-01, .dots9.brown { background-position: -9px -0px;  height: 8px; width: 9px; }
.dots9.cat-02, .dots9.orange { background-position: -18px -0px;  height: 8px; width: 9px; }
.dots9.cat-03, .dots9.red { background-position: -27px -0px;  height: 8px; width: 9px; }
.dots9.cat-04, .dots9.winered { background-position: -36px -0px;  height: 8px; width: 9px; }
.dots9.cat-05, .dots9.pink { background-position: -45px -0px;  height: 8px; width: 9px; }
.dots9.cat-06, .dots9.purple { background-position: -54px -0px;  height: 8px; width: 9px; }
.dots9.cat-07, .dots9.blue { background-position: -63px -0px;  height: 8px; width: 9px; }
.dots9.cat-08, .dots9.lightblue { background-position: -72px -0px;  height: 8px; width: 9px; }
.dots9.cat-09, .dots9.petrol { background-position: -81px -0px;  height: 8px; width: 9px; }
.dots9.cat-10, .dots9.turquoise { background-position: -90px -0px;  height: 8px; width: 9px; }
.dots9.cat-11, .dots9.neongreen { background-position: -99px -0px;  height: 8px; width: 9px; }
.dots9.cat-12, .dots9.lightgreen { background-position: -108px -0px;  height: 8px; width: 9px; }
.dots9.cat-13, .dots9.green { background-position: -117px -0px;  height: 8px; width: 9px; }
.dots9.cat-14, .dots9.lightyellow { background-position: -126px -0px;  height: 8px; width: 9px; }
.dots9.cat-15, .dots9.yellow { background-position: -135px -0px;  height: 8px; width: 9px; }
.dots9.cat-16, .dots9.lightgrey { background-position: -144px -0px;  height: 8px; width: 9px; }
.dots9.cat-17, .dots9.dark { background-position: -153px -0px;  height: 8px; width: 9px; }


.routes-teaser {
	background: url(../images/sprites/routes-teaser.png) no-repeat transparent;
	display: block;
	height: 106px; 
	width: 282px;
}

.routes-teaser.inactive:hover,
.routes-teaser.active  { 
	background-position:  -0px -0px; height: 106px; width: 282px;
}

.routes-teaser.inactive {
    background-position:  -0px -106px; height: 106px; width: 282px;
}

.socialicons {
	background: url(../images/sprites/socialicons.png) no-repeat transparent;
	display: block;
	height: 45px; 
    margin-right: 0.4em;
	width: 37px;
}

.socialicons.facebook { background-position: 0px 0px; height: 45px; width: 37px}
.socialicons.facebook:hover { background-position: -37px 0px; cursor: pointer; height: 45px; width: 37px}
.socialicons.youtube { background-position: 0px -45px; height: 45px; width: 37px}
.socialicons.youtube:hover { background-position: -37px -45px; cursor: pointer; height: 45px; width: 37px}