﻿/* -------- Top Level --------- */
.cms-sitemap { clear: both; width: 100%; margin: 3em auto; padding: 0px 10px; }
.cms-sitemap ul { display: flex; flex-wrap: wrap; list-style: none; position: relative;margin-top:10px;  }
.cms-sitemap li { flex: 0; flex-basis: 15em; padding-right: 1.25em; position: relative; }
.cms-sitemap > ul > li { margin: 3rem 0 ; display: flex;}
.cms-sitemap ul li{margin-bottom:10px; ; }
.cms-sitemap li a { min-height:60px; max-height: 60px;  margin: 0; padding: .875em; font-size: 1rem; font-weight: 700; color: #000000;   border-bottom:2px solid #ae905d;  text-decoration: none;  overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 3;  -webkit-box-orient: vertical;  }
.cms-sitemap li a:hover { color: #ac0b0b;}
.cms-sitemap a:link:after,.cms-sitemap a:visited:after { /*content: " "attr(href)" "; */display: block; margin-top: .25em; font-weight: 600; font-size: .75em; word-wrap: break-word; color: rgba(255,255,255,.75);}

.cms-sitemap ul li a { background-color:#ebe4d8;border:solid 1px #ac8f5c;font-size: .9375em; font-weight: 400;}


/* -------- Second Level --------- */
.cms-sitemap ul ul { display: flex;   margin-top:0px;}
.cms-sitemap ul ul li { padding-top: .6875em; padding-right: 0; margin-bottom:0px; }
.cms-sitemap ul ul li a { background-color:#fdf9f2;border:solid 1px #ebe4d8; font-weight: 400; }
.cms-sitemap ul ul li a:hover { background-color: #ebe4d8;}
.cms-sitemap ul ul li:first-child {padding-top: 2em;}
/* -------- Third Level --------- */
.cms-sitemap ul ul ul { margin-top: .6em; padding-top: .6em; padding-bottom: .625em;}
.cms-sitemap ul ul ul li { padding-top: .3125em; padding-bottom: .3125em;}
.cms-sitemap ul ul ul li a { padding: .75em; width: 90%; margin-right: 0; margin-left: auto;background-color: #ff9d00;font-size: .75em; }
.cms-sitemap ul ul ul li a:hover { background-color: #ebe4d8;}
.cms-sitemap ul ul ul li:first-child { padding-top: 1em;}
.cms-sitemap ul ul ul li a:link:after,.cms-sitemap ul ul ul li a:visited:after { font-size: .75em;}
/* --------	Fourth Level --------- */
.cms-sitemap ul ul ul ul { margin-top: 0; padding-top: .3125em; padding-bottom: .3125em;}
.cms-sitemap ul ul ul ul li a {padding: .75em ;width: 80%;background-color: #de003a;}
.cms-sitemap ul ul ul ul li a:hover { background-color: #c20035;}
.cms-sitemap ul ul ul ul li a:link:after,.cms-sitemap ul ul ul ul li a:visited:after { display: none;}
/* ------------------------------------------------------------
	Connecting Lines:
	Uncomment 'border-color: red' for debugging
------------------------------------------------------------ */
.cms-sitemap ul:before,.cms-sitemap ul:after,.cms-sitemap ul li:before,.cms-sitemap ul li:after { display: block; content: ''; position: absolute; border-width: 0; border-color: #e3e3e3; border-style: solid; z-index: -1; /* border-color: red; */}
.cms-sitemap > ul > li:before { height: 1.375em; top: -1.375em;; right: calc(50% + .625em); width: calc(100% - 2px); border-top-width: 2px; border-right-width: 2px; /* border-color: red; */}
.cms-sitemap > ul > li:first-child + li:before { border-top-width: 0; height: 5em; top: -5em;}
.cms-sitemap ul ul li:after { width: 50%; height: .6875em; top: 0; right: 1px; border-left-width: 2px;}
.cms-sitemap ul ul li:first-child:before { width: 50%; height: 1.3125em; top: .6875em; right: 1px; border-left-width: 2px;}
.cms-sitemap > ul > li:last-child:after { border-bottom-width: 0;}
.cms-sitemap ul ul ul li:before { width: calc(50% - 5px) !important; height: calc(100% - 2px); top: -50%; left: 0; border-left-width: 2px; border-bottom-width: 2px;}
.cms-sitemap ul ul ul li:first-child:before { height: 2.125em; top: -1px; border-top-width: 2px;}
.cms-sitemap ul ul ul:before { width: 50%; height: 1.25em; top: -10px; right: 1px; border-left-width: 2px;}
.cms-sitemap ul ul ul li:after { border-width: 0;}
.cms-sitemap ul ul ul ul li:before,.cms-sitemap ul ul ul ul li:first-child:before { display: none;}
.cms-sitemap ul ul ul ul:before { width: 1px; height: calc(100% + 2.5em); top: -2.5em; left: 0; border-left-width: 2px;}
/* ------------------------------------------------------------
	Responsive Styles
------------------------------------------------------------ */
@media screen and (max-width: 767px) {
.cms-sitemap li	{ padding-right:8px; }
.cms-sitemap ul li  {flex:1; flex-basis: 47%; }
.cms-sitemap ul li ul li {flex:1; flex-basis: 100%; }
}
/* The media queries below keep the grid column widths intact when
a column wraps. This prevents the wrapped column from displaying at
100% width. These queries also make the homepage line item flex
appropriately. When your cms-sitemap is complete, remove the queries
that you don't need, and your cms-sitemap layout will work perfectly. */

/* two column */
@media screen and (min-width: 30em) {
.cms-sitemap > ul > li {	max-width: 50%;	}
}
/* three column */
@media screen and (min-width: 38.5em) {
	.cms-sitemap > ul > li {	max-width: 33%;	}
}
/* four column */
@media screen and (min-width: 50em) {
	.cms-sitemap > ul > li {	max-width: 25%;	}
}
/* five column */
@media screen and (min-width: 61em) {
	.cms-sitemap > ul > li {	max-width: 20%;	}
}
/* six column */
@media screen and (min-width: 73em) {
	.cms-sitemap > ul > li {	max-width: 16.66%;	}
}
/* seven column */
@media screen and (min-width: 84.5em) {
	.cms-sitemap > ul > li {	max-width: 14.285%;	}
}
/* eight column */
@media screen and (min-width: 96em) {
	.cms-sitemap > ul > li {	max-width: 12.5%; }
}
/* nine column */
@media screen and (min-width: 107.5em) {
	.cms-sitemap > ul > li {	max-width: 11.11%; }
}
/* ten column */
@media screen and (min-width: 119em) {
	.cms-sitemap > ul > li {	max-width: 10%; }
}