
/*--- WRITE YOUR CSS HERE ---*/

/* Temporary fix to work around issues with top nav */
/*.bb-nav-root h1 { 
	font-size: 30px; 
	line-height: 30px;
}

#main h1 {
	width: 100%;
	margin-bottom: 0;
}*/

:global(.dvz-v0-ad-top){
   @media only screen and (max-width: 760px){
   display: block !important;
 }
}

.dvz-content h1 {
	width: 60%;
	margin-bottom: 10px;
}

.dvz-content ul {
	margin: 0 3rem;
}

.dvz-content ul li {
	margin-bottom: 1rem;
}

.dvz-content .lede-img, .dvz-content .photo-info {
	width: 970px;
	margin: 5px auto;
	display: block;
	font-size: 13px;
	color: #888;
}

.dvz-content .dek {
	font-family: 'BWHaasHead', Helvetica, Arial, sans-serif;
	font-weight: 500;
	font-size: 1.5rem;
	color: #888;
	width: 60%;
}

.dvz-content .bydek {
	text-align: left;
}

.dvz-content p.name {
	font-family: 'BWHaasHead', Helvetica, Arial, sans-serif;
	font-size: 28px;
	font-weight: 700;
	margin-top: 70px;
	margin-bottom: 0;
	padding-top: 10px;
	border-top: 8px solid #000;
}

.dvz-content .tab-content h3 {
	margin: 20px auto;
	font-family: 'BWHaasHead', Helvetica, Arial, sans-serif;
	font-size: 22px;
	font-weight: 700;
}

.dvz-content p.title, .dvz-content p.etf {
	font-family: 'HaasText', Helvetica, Arial, sans-serif;
	color: #888;
	margin-top: 0;
}

.dvz-content p.title a{
	color: #888;
}

.dvz-content .etf strong {
	font-family: 'BWHaasHead', Helvetica, Arial, sans-serif;
	font-weight: 700;
}

.dvz-content .mouse-over-img > span {
    position: relative;
    background: #eee;
}

.dvz-content .mouse-over-img img {
    position: absolute;
    z-index: 1; /* so other .mouse-over-img which are above this don't trigger */
    transform: scale(0, 0);
}

.dvz-content .mouse-over-img:hover img {
    transform: scale(1, 1)
}

.dvz-content .mouse-over-img {
    padding-right: .25em;
}
.dvz-content .mouse-over-img:hover{
    text-decoration: underline;
    cursor: pointer;
}
.dvz-content .mouse-over-img > span {
    display: inline-block;
    vertical-align: text-bottom;
    height: 1.2em;
    background-size: cover;
}
.dvz-content .mouse-over-img.popchart > span {
    background-image: url('../../img/chart-icon.png');
    width: 1.2em;
}
.dvz-content .mouse-over-img img {
    transition: all 500ms ease-in-out;
    transition: all 500ms cubic-bezier(0.68, -0.55, 0.27, 1.55);
    border: 1px solid black;
    opacity: 0;
    max-width: inherit;
}
.dvz-content .mouse-over-img.popchart img {
    top: -180px;
    left: -112px;
}
.dvz-content .mouse-over-img.mouse-over-img-left img {
    left: 0px;
}
.dvz-content .mouse-over-img.mouse-over-img-right img {
    left: auto;
    right: 0px;
}
.dvz-content .mouse-over-img:hover img {
    opacity: 1;
}

.dvz-content .tout {
	width: 100%
}

.dvz-content .img-link {
	text-decoration: none;
	border-bottom: none;
}

.dvz-content .img-tout {
	margin-left: auto;
	margin-right: auto;
}

.dvz-content ul.tabs{
	margin: 0 auto;
	padding: 0px;
	list-style: none;
}

.dvz-content ul.tabs a {
	color: #000;
	border-bottom: none;
}

.dvz-content ul.tabs li{
	background: none;
	color: #222;
	display: inline-block;
	padding: 5px 10px;
	cursor: pointer;
	font-family: 'BWHaasHead';
	font-weight: 700;
}

.dvz-content ul.tabs li.ui-tabs-active{
	background: #9f9f9f;
}

.dvz-content .tab-content{
	display: none;
}

.dvz-content .tab-content.current{
	display: inherit;
}

.dvz-content .tab-content p:first-of-type {
	margin-top: 20px;
}

@media only screen and (max-width: 1020px) {
	.dvz-content .lede-img, .dvz-content .photo-info {
		width: 760px;
	}
}

@media only screen and (max-width: 760px) {
	.dvz-content .lede-img, .dvz-content .photo-info {
		width: 100%;
	}

	.dvz-content h1 {
		width: 100%;
	}

	.dvz-content .dek {
		width: 100%;
		font-size: 1.2rem;
	}
}

