#primary {
padding-right: 12px !important;
margin-top: 6px !important;
margin-bottom: 6px !important;
}
#secondary {
margin-top: 6px !important;
padding-left: 24px !important;
}
#secondary li {
margin-bottom:0;
} article {
font-size: 16px;
text-align: justify;
max-width: 1202px;
}
.intro {
font-size: 110%;
font-weight: bold;
text-align: justify;
padding: 2px 0 15px 0;
color: #111;
}
header.entry-header:not(.related-entry-header) .entry-title {
text-transform: none;
}
.noborder{
border:0 !important;
}
table, td {
border:0 !important;
} ul.index {
display: flex; 
list-style: none;
justify-content: center;
margin-left: 0;
}
ul.index li:before {
content: '\00a0\2013\00a0';
}
ul.index > li:first-of-type:before {
content: '';
}
ul.index li a {
color: grey;
} h3, h4 {
clear:initial !important;
}
h3 {
font-size: 24px !important;
padding: 4px 0 0 0;
border-bottom: 1px dotted #666;
margin-top: 36px;
overflow-x: hidden;
}
h4, h5, .sidebar-main h4 {
font-weight: bold !important;
padding-top: 3px;
margin-top: 16px;
}
h4 {
font-size: 18px !important;
}
h5 {
clear: none;
font-size: 14px !important;
padding-bottom: 4px;
}
h6 {
clear: none;
font-size: 12px !important;
padding-bottom: 4px;
}
.map {
margin-bottom: 16px;
} .article-title-header {
display: flex;
flex-direction: column;
}
.article-title-header  .columns {
display: flex;
flex:1;
margin-bottom:12px;
padding: 6px;
align-items: center;
}
.article-title-header  .main {
flex: 1;
order: 2;
}
.article-title-header  .right-arrow {
width: 20px;
order: 3;
margin: 0;
text-align: right;
}
.article-title-header  .left-arrow {
width: 20px;
margin: 0;
order: 1;
display: flex;
} .attraction-links, .bottom-links {
font-size: 100%;
border-top: 1px dotted black;
padding-top: 24px;
clear:both;
}
.bottom-links {
padding-bottom: 20px;
}
ul.attraction-links, ul.list-links, ul.bottom-links {
list-style-image: url(//aviewoncities.com/img/arrow.png);
background-position:1px -8px;
padding-left:20px;
margin-left:0;
overflow:hidden;
}
ul.none {
list-style: none;
} .side-article h4 {
border-bottom: 1px dotted #666;
margin-bottom: 6px;
}
.side-article .sb-txt {
line-height: 26px;
margin-bottom: 12px;
margin-left: 12px;
}
.side-article .map-links {
list-style-image: url(//aviewoncities.com/img/arrow.png);
background-position:1px -8px;
margin-left: 36px;
}
.side-article  .map-links li {
line-height: 20px !important;
}
.side-article .sb-txt a {
color: inherit;
}
.side-article .sb-txt a:hover {
text-decoration: underline;
} .red {
color: red;
margin: 12px 0;
} 
article.category-attraction {
font-size: 19px;
text-align: justify;
max-width: 1202px;
}
ul.table {
display: table;
}
li {
padding-bottom: 8px;
}
em {
color: #444;
font-weight: bold;
}
.small {
font-size:10px;
}
a.external{
background: url(//aviewoncities.com/img/ext.png) right top no-repeat;
padding-right: 12px;
} figure > div {
margin-bottom: 0;
border: 1px solid #666;
border-radius: 3px;
}
.pic {
margin: 3px;
display: inline-block;
}
.pic div, figcaption {
background-color: #fff;
text-align: center; 
font-style: italic; 
font-size: 12px;
font-weight: 100;
line-height: 18px;
margin-bottom: 2px;
}
.pic-align-h3 {
position: relative;
top: 8px;
padding-bottom: 8px;
}
.pic a {
color: #111;
}
.pic img {
border-right-color: #444;
border-bottom-color: #444;
border-radius: 3px;
background-color: #444;
}
.pic figcaption img {
background-color: white;
}
.pic.wide img {
max-width: 100%;
height: auto;
margin: 0;
}
figure {
display: table;
margin-bottom: 2px;
}
figcaption {
display: table-caption;
caption-side: bottom;
font-size: 14px;
}
figcaption a:hover {
text-decoration: underline;
}
.pic.wide.center-510 {
display: block;
margin-left: auto;
margin-right: auto;
max-width: 512px;
}
.wide
{
margin: 0;
margin-bottom: 12px;
text-align: center;
}
.right {
float:right;
margin-right: 0px !important;
margin-left: 6px !important;
}
.left {
float:left;
margin-left: 0px !important;
margin-right: 12px !important;
} img[data-lnk] {
cursor: pointer;
}
img[data-lnk]:hover{
border-color: var(--ast-global-color-1);
} figure > div[data-img]:hover {
cursor: pointer;
}
figure > div[data-img]:hover  .material-icons {
opacity: 1;
}
figure > div[data-img] { position: relative; }
figure > div[data-img] img { display: block; }
figure > div .material-icons {
opacity: 0;
position: absolute;
bottom: 0px;
left: 2px;
color: white;
} .close {
color: white;
position: absolute;
top: 0;
right: 6px;
font-size: 60px;
font-weight: bold;
cursor: pointer;
z-index: 101;
text-shadow: 0 0 1px black, 0 0 1px black, 0 0 1px black, 0 0 1px black;
}
.close:hover,
.close:focus {
color: #999;
text-decoration: none;
cursor: pointer;
} #lightbox {
position: relative;
margin: auto;
padding: 0;
width: fit-content;
max-width: 1202px;
display: flex;
flex-direction: column;
}
#lightbox-wrapper {
display: none;
position: fixed;
top: 0;
z-index: 100;
padding-top: 20px;
left: 0;
width: 100%;
height: 100%;
overflow: auto;
background: rgba(20, 20, 20, .8);
}
#lightbox-content {
margin: auto;
}
#lightbox img {
margin-left: auto;
margin-right: auto;
border: 3px solid black;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
#lightbox-caption {
color: white;
background-color: black;
text-align: center;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
} bot
#lightbox-background {
display: none;
z-index: 1;
position: fixed;
background-color: black;
opacity: 75%;
top: 0;
left: 0;
width: 100%;
height: 100%;
} .share {
border-top: 1px dotted black;
padding-top: 24px;
} @media (max-width:921px) {
.pic {
margin-left:0;
}
#secondary {
border: solid 1px var(--ast-global-color-0);
border-radius: 12px;
padding: 12px;
background-color: var(--ast-global-color-0);
color: white;
}
.side-article h4 {
color: white;
border-bottom: 1px dotted #eee;
margin-bottom: 6px;
}
.side-article a {
color: white;
}
.side-article a:hover {
color: var(--ast-global-color-1);
}
.side-article .map-links {
list-style-image: url(//aviewoncities.com/img/arrow-white.png);
}
}
@media (max-width: 640px) {
.right, .left {
float: unset;
margin-left: auto !important;
margin-right: auto !important;
}
.pic {
width: fit-content;
display: block;
}
.pic-hor img {
width: 306px;
}
.pic-ver img {
width: 204px;
}
}