.big-cite {
	overflow: hidden;
	height: (315 / 975) * 100vw;
	width: 100%;

	@media screen and (min-width: 62.5em) {
		height: 315px;
		width: 975px;
	}

	.cite-box,.cite-box-text,.cite-text {
		display: block;
		height: 100%;
		position: relative;
	}
}

.box-c {
	position: absolute;
	text-align: center;
	img.picture {
		max-height: 100%;
		max-width: 100%;
	}
}
.cite-box {
	.box-c {
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
	}
}

.cite-box-text {
	padding: 30/975*100vw 20/975*100vw 1/975*100vw (975 / 2 + 45)/975*100vw;
	@media screen and (min-width: 62.5em) {
		@include size(padding, 30px 20px 1px 975px / 2 + 45px);
	}
	.box-c {
		/*top: 45/975*100vw;
		left: 45/975*100vw;
		bottom: 45/975*100vw;
		width: (975 / 2 - 90)/975 * 100vw;
		@media screen and (min-width: 62.5em) {
		top: 45px;
		left: 45px;
		bottom: 45px;
		width: 975px / 2 - 90px;
		}*/
	top:0;
	left:0;
	bottom:0;
	width:50%;
	}
}

.cite-text {
	@include size(padding, 30px 20px 1px 80px);
}

.cite-box-text, .cite-text {
    display: block;
    color: black;
    background: white;

    .vip {
        margin: 0;
        color: #575C63;
        @include size(font-size, 11px);
    }

    .cite-body {
        @include size(font-size, 18px);
        line-height: 1.3em;

        h4 {
            margin: 0;
        }
        .didaskalia {
            font-style: italic;
        }
        .verse {
            // Cancel any indentation.
            padding-left: 0 !important;
        }
        .person {
            font-style: inherit;
        }
    }

    blockquote {
        padding: 0;
        margin: 0;

        p {
            margin: 0;
        }
    }

    .source
    {
        color: #444;
        @include mono;
        @include size(font-size, 11px);
        @include size(margin-top, 16px);
    }
}




.book-wide-box .cite {
    display: block;
    color: black;
    background-color: #f7f7f7;
    vertical-align: middle;
    @include min-screen(1000px) {
        @include size(width, 395px);
    }
    margin: 0;
    @include size(padding, 10px);
}