body {width: 80%; font-size: 10px; background-color: #FFFFFF;}
/* --body {background-image: url(../graphics/logo_1.png); background-position: 6em; background-size: 4em 10em; background-repeat: no-repeat; background-attachment: scroll;}-- */

/* --------------------links-------------------- */

a:link {color: #9900CC;}
a:visited {color: #663399;}
a:active {color: #BD0043;}

/* --------------------image sizes--------------- */

/* Note that the aspect ratios given here differ from those on our other Websites. */
/* These ones accord with photos taken by most digital cameras, but I don't think they are as pleasing to the eye. */
/* Aspect ratio = 3:4 for portrait */
/* Aspect ratio = 4:3 for landscape */1.4em;}

img.teensylandscape {width: 1.4em; height: 1em;}

img.titchyquare {width: 3.6em; height: 3.6em;}
img.titchyportrait {width: 2.7em; height: 3.6em;}
img.titchylandscape {width: 3.6em; height: 2.7em;}

img.dinkysquare {width: 4em; height: 4em;}
img.dinkyportrait {width: 3em; height: 4em;}
img.dinkylandscape {width: 4em; height: 3em;}

img.tinysquare {width: 5em; height: 5em;}

img.smallsquare {width: 8em; height: 8em;}
img.smallportrait {width: 6em; height: 8em;}
img.smalllandscape {width: 8em; height: 6em;}

img.mediumsquare {width: 16em; height: 16em;}
img.mediumportrait {width: 12em; height: 16em;}
img.mediumlandscape {width: 16em; height: 12em;}

img.largequare {width: 24em; height: 24em;}
img.largeportrait {width: 18em; height: 24em;}
img.largelandscape {width: 24em; height: 18em;}

img.giantsquare {width: 32em; height: 32em;}
img.giantportrait {width: 24em; height: 32em;}
img.giantlandscape {width: 32em; height: 24em;}

/* --------------------image surrounds--------------- */

img {border: none;}

/* --{margin: top, right, bottom, left}-- */
img {margin: 0em 0em 1em 0em; padding: 0em 2em 0em 0em;}
img.left {padding: 0em 1em 0em 0em;}
img.right {padding: 0em 0em 0em 1em;}
img.pad_top {padding-top: 0.5em;}

/* --------------------images on special pages--------------- */

img.margin_logo {margin-left: -3em; padding: 0em 0em 0em 0em; width: 2em; height: 5em; border: 1px solid #CFB4FF;}

/* --------------------navigation-------------------- */

/* #navtop {width: 60%;} */

/* --------------------identity-------------------- */

#identity {position: absolute; padding-left: 3.3em;}

/* ------------------upper top navigation line-------- */

#navtop1 {margin-left: 6em; height: 1em; padding-top:0.5em; padding-bottom: 1em; padding-left: 1em; padding-right: 1em; text-align: justify; font-family: "Arial Black", "Helvetica", sans-serif; font-size: 1.5em; background-color: #826BA9;}
#navtop1 span.contacts {margin-left: 0.7em; margin-right: 0.5em; padding-left: 0.5em;}
/* #navtop1 span.new {padding-right: 0.5em;} */
#navtop1 span {padding-left: 0.5em;}
#navtop1 .rightarrow {font-size: 1em; color: #00FF00;}
#navtop1 .downarrow {font-size: 1em; color: #00FF00;}
#navtop1 .current {padding-left: 0.5em; padding-right: 0.5em; font-size: 1em; color: #663399; background-color: #D1C9DF;}
#navtop1 span.spacer {padding-left: 0.5em; color: #FFFFFF; visibility: hidden;}
#navtop1 a:link {color: #66FFFF;}
#navtop1 a:visited {color: #D1C9DF;}
#navtop1 a:active {color: #FFFF33;}
#navtop1 span.ancillary {float: right; padding-right: 0.5em;}

/* ------------------lower top navigation line-------- */

#navtop2 {margin-left: 6em; padding-top: 0.2em; padding-bottom: 0.3em; padding-left: 2em; padding-right: 3em; font-family: "Arial Black", "Helvetica", sans-serif; font-size: 1.5em; background-color: #9781B7;}
#navtop2 span {padding-left: 1em;}
#navtop2 .current {padding-left: 0.5em; padding-right: 0.5em; font-size: 1em; color: #663399; background-color: #D1C9DF;}
#navtop2 a:link {color: #66FFFF;}
#navtop2 a:visited {color: #D1C9DF;}
#navtop2 a:active {color: #FFFF33;}

#navtop1b {position: relative; top: -3em; margin-left: 6em; padding-top: 0.5em; padding-bottom: 0.5em; padding-left: 0em; padding-right: 2em; text-align: right; font-family: "Arial Black", "Helvetica", sans-serif; font-size: 1.5em;}
#navtop1b span.linkless {color: #66FFFF;}
#navtop1b span.topic {padding-left: 1em;}
#navtop1b span.current {padding-left: 0.5em; padding-right: 0.5em; font-size: 1em; color: #663399; background-color: #D1C9DF;}
/* 
#navtop2 .stuffonleft {text-align: left;}
#navtop2 .stuffonright {text-align: right;}
 */

#navtop1b a:link {color: #66FFFF;}
#navtop1b a:visited {color: #D1C9DF;}
#navtop1b a:active {color: #FFFF33;}

#navtop3 {margin-left: 9em; height: 0.6em; background-color: #9781B7;}

/* ------------------bottom navigation lines-------- */

#navbottom1 {padding-left: 4em; text-align: left; font-size: 1.5em; font-weight: bold; color: #663399;}
#navbottom2 {padding-top: 0.5em; padding-right: 4em; text-align: right; font-size: 1.5em; font-weight: bold;}
.decamp {padding-top: 0.5em; padding-right: 1em; text-align: right; font-size: 1em; font-weight: normal;}
.decamp a {font-weight: bold;}

/* --------------------pages and headings-------------------- */

/* --body {background-color: white; background-image: url(../coupleworks/graphics/coupleworks_logo3.png); background-position: 2em 22em; background-size: auto; background-repeat: no-repeat;}-- */

#pageheading {margin-top: 0.5em; margin-left: 3.5em; text-align: left; font-family: "Arial", sans-serif; font-size: 2.5em; color: #6F559D;}
#pageheading .heading1 {font-family: "Arial", sans-serif; font-size: 2em; color: #6F559D;}
#pageheading .heading1 span.couple {font-weight: bold; font-style: normal;}
#pageheading .heading1 span.works {font-weight: normal; font-style: italic;}
#pageheading .heading2 {margin-top: 0.3em; text-align: left; font-family: "Palatino", "Times", "Times New Roman", serif; font-size: 1em; font-weight: bold; color: #A74992; word-spacing: 0.04em;}
#pageheading .heading3 {margin-top: 0.3em; padding-left: 1em; text-align: left; font-family: "Palatino", "Times", "Times New Roman", serif; font-size: 1em; font-weight: normal; font-style: italic; color: #A74992; word-spacing: 0.04em;}

#privacy #pageheading {font-family: "Palatino", "Times", "Times New Roman", serif;}
#privacy #pageheading .heading1 {font-family: "Palatino", "Times", "Times New Roman", serif; font-size: 1.5em; font-weight: bold; font-style: normal;}
#privacy #pageheading .heading2 {line-height: 1.5em; font-weight: normal;}
#privacy #pageheading .url {font-family: "Arial", sans-serif;}

/* -------------------------background image-------------------------- */

/* --#content {background-image: url("../graphics/dance11.png"); background-repeat: no-repeat;}--- */

/* ----------------------------content-------------------------------- */

#content {margin-top: 1.5em; margin-left: 5em; text-align: left; font-family: "Arial", sans-serif; font-size: 1.8em; color: #663399;}
#content .heading1 {text-align: left; font-family: "Palatino", "Times", "Times New Roman", serif; font-size: 2em; font-weight: bold; color: #FF00FF;}
#content .heading2 {text-align: left; font-family: "Palatino", "Times", "Times New Roman", serif; font-size: 1.2em; font-weight: bold; color: #A74992;}
#content .heading3 {margin-bottom: 1em; text-align: left; font-family: "Palatino", "Times", "Times New Roman", serif; font-size: 1em; font-weight: bold; color: #A74992;}

#content p {margin-bottom: 1em; text-align: justify;}

#content ul.plain {padding-left: 2em;}
#content ul li {padding-bottom: 1em;}
#content ul.compact li {padding-bottom: 0.2em;}
#content ul.features li {padding-bottom: 0.2em;}

#content span.field {font-weight: bold;}

#content span.title {font-weight: bold; font-style: italic;}
#content span.author {font-size: 0.9em;}
#content span.language {font-size: 0.9em; font-style: italic;}

/* sup {line-height: 0;} */
sup {vertical-align: baseline; position: relative; top: -0.5em; }
/* sub {vertical-align: baseline; position: relative; bottom: -0.5em;} */
/* Use the following instead of sub if you wish to show a subscript directly beneath a superscript, as with some chemical element properties. You may need to adjust the left and font-size values. A monospaced font might help. */
#content p span.subbeneathsup {vertical-align: baseline; position: relative; bottom: -0.5em; left: -2em; font-size: 0.8em;}

/* --------------------------slide show-------------------------- */

/* * {box-sizing: border-box} */

/* Slide show container */
.slideshow-container {position: relative; margin: auto; width: 30em;}

.slideshow-container img {width: 30em;}

/* Hide all the images to begin with. */
.mySlides {display: none;}

.zoom {transition: transform 2s;}
.zoom:hover {transform: scale(2);}

/* Now show the default image. */
.default {display: block;}

/* Next and previous buttons */
.prev, .next {position: absolute; top: 45%; width: auto; padding: 0em 0.2em 0em 0.2em; cursor: pointer; user-select: none; font-weight: bold; font-size: 2em; color: aquamarine;}

/* Position the "previous button" to the right. */
.prev {left: 0;}

/* Position the "next button" to the right. */
.next {right: 0;}

/* On click, change the color of the "previous button" or the "next button". */
#replace a:active {color: turquoise;}

/* Instruction to enlarge */
div.instruction {position: relative; width: 100%; text-align: center; top: -1.3em; bottom: 0em; padding-bottom: 0em;}
div.instruction span.instructiontext {padding: 0.1em; font-size: 0.9em; font-style: italic; color: #66FFFF; background-color: #826BA9;}

/* Number text (1/3 etc) */
.numbertext {position: absolute; right: 0; top: 0; padding: 0em 1em 0em 1em; font-size: 0.8em; color: yellow; background-color: rgba(0,0,0,0.3);}

/* Dots/bullets/indicators */
div.dots {margin-top: -2em; margin-bottom: -1em; text-align: center;}
.dot {display: inline-block; height: 1em; width: 1em; margin: 0 0.5em; background-color: #A74992; border-radius: 50%; cursor: pointer;}
.active, .dot:hover {background-color: turquoise;}

div.comment {margin-top: 1em; border: 0.2em solid orange; padding: 1em 1em 0em 1em; font-size: 1em; color: black;}
div.comment span {font-size: 1em; font-style: italic; color: black;}

/* --------------------------page provenance-------------------------- */

#page_provenance {margin-left: 9em;}
#url {padding-top: 0.2em; padding-bottom: 0.2em; padding-left: 2em; font-family: "Arial", "Helvetica", sans-serif; font-size: 1em; background-color: #9781B7;}
#dates {padding-top: 0.2em; padding-bottom: 0.2em; padding-left: 2em; font-family: "Arial", "Helvetica", sans-serif; font-size: 1em; background-color: #826BA9;}
#dates span.copyright {padding-left: 2em;}
#dates a:link {color: #66FFFF;}
#dates a:visited {color: #D1C9DF;}
#dates a:active {color: #FFFF33;}
