/* Content is 800 sidebar is 180 */
body {
    max-width: 1000px;
}

#header img {
    height: 4.5em;
    margin-left: 1em;
    margin-right: 1em;
    display: block;
}

#header p {
	padding-top: 1.2em;
	text-align: center;
	font-weight: bold;
	font-size: 100%;
	margin-left: 1em;
    margin-right: 1em;
}

.footer {
    text-align: center;
}
.footer h1 {
    font-weight: bold;
}

.footer h1 a {
    text-decoration: underline;
}

.footer {
	clear: both;
	text-align: center;
	font-size: smaller;
}

#menu .pure-menu ul {
    border-top: 0px;
    margin-left: 16px;
}

.linkSection {
    margin-left: 10px;
    font-weight: bolder;
    padding: 0em 0em .3em 0.1em;
    margin: 0.5em 0em 0.5em 0em;
}

/* For line breaks in footer info */
.break-sm { display: none; }
.break-md { display: none; }
.break-lg { display: none; }
.break-xl { display: none; }

.pad-main { padding: 0 4em 0 4em; }
.pad-CD-games-list { padding-left: 1em; }


@media screen and (max-width: 35.5em) {

    .break-sm { display: inline }
    .pad-main { padding: 0 .5em 0 .5em; }

    .iTunesAd { float:none; }
}

@media screen and (max-width: 48em) {

    .break-md { display: inline }

    .tel {
        font-weight: 900;
        font-size: 120%;
    }
    .pad-main { padding: 0 .5em 0 .5em; }

     .iTunesAd { float:right; }

}

@media screen and (max-width: 64em) {

    .pad-left-1 {
        padding-left: 0;
    }

    /* Images are often on top of text in phone */
    img {
        padding-bottom: .5em;
    }

    .break-lg { display: inline }

    #header p {
	    padding-top: 0em;
	}

    #header img {
	    margin-left: auto;
	    margin-right: auto;
    }

	#menu {
        margin-top: 8em;
    }

   .iTunesAd { float:right; }

}

@media screen and (max-width: 80em) {

    .break-xl { display: inline }

         .iTunesAd { float:right; }

}

.centered {
	 text-align: center;
}

div.centered, body.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

#layout {
    padding-left: 200px;
}

#menu {
    font-size: 90%;
    margin-top: 26px;

    float: left;
    margin-left: -182px; /* "#menu" width minus border*/
    width: 180px;
    position: relative;
    top: 0;
    left: 0;
    border-right:2px solid #b1bdc9;
    min-height: 100vh;
}

#menu a {
    padding: 0;
    color: #333;
}

#menu a { text-decoration: none;}
#menu .pure-menu li a:link    { color: #555; background: transparent;}
#menu .pure-menu li a:visited { color: #555; background: transparent;}
#menu .pure-menu li a:hover   { color: #900; background: transparent;}
#menu .pure-menu li a:active  { color: #ccf; background: transparent;}

#main {
    font-family: "Times New Roman", serif;
    font-size: 120%;
    line-height: 140%;
}
.pure-g [class *= "pure-u"] {
    font-family: "Times New Roman", serif;
}
.content {
    float: left;
    padding-left:  0em;
    padding-right: 0em;
}

@media (min-width: 48em) {
   .content {
        padding-left: 1em;
    }
}
@media screen and (max-width: 48em) {

     #layout, .content {
        padding-left: 10px;
        padding-right: 10px;
    }
    .content {
        border-left:0px;
    }
    #menu {
        left: -60px;
    }
     #layout.active .menu-link {
        left: 0;
    }
    #layout.active #menu {
        left: 0;
        width: 200px;
    }
    #layout.active {
        position: relative;
        left: 180px;
    }
}

.float-left  { float: left;}
.float-right { float: right;}

p {
	margin: 2px 0px 10px 0px;
	line-height: 130%;
}

.selected {
	font-weight: bold;
	color: #900;
}

.notselected {
	font-weight: bold;
}

.bullet li:before {
    content: "•";
    padding-right: 8px;
}

.no-underline { text-decoration: none;}

/* Support Pages */
.recordButtons {
	float: left;
	width: 220px;
	padding: 0px 10px 0px 10px;
	margin: 0px 4px 2px 4px;
	text-align: center;
	line-height: 95%;
	font-style: italic;
}

.indent {
	margin-left: 30px;
	margin-right: 30px;
}

.list-indent {
	margin-left: 32px;
    list-style-type: disc;
    line-height: 110%;
    padding-bottom: .5em;
}

/* Used on the page displaying word lists */
.wordListColumn {
	float: left;
	width: 280px;
	margin-top: 5px;
	padding-left: 5px;
}

/* Order forms */
div.noBorderTable table,
div.noBorderTable td,
div.noBorderTable th  {
    border-spacing: 2px;
    border: 0px outset #FFF;
    empty-cells: show;
    vertical-align: top;
}

.table_fullWidth {
    width: 98%;
    border-spacing: 2px;
    border: 1px outset #333;
    empty-cells: show;
    border-collapse: separate;
    font-size: 85%;
    line-height: 130%;
}

.table_fullWidth th,
.table_fullWidth td {
    padding-right: 4px;
    padding-left:  4px;
    border: 1px outset #333;
	padding-right: 4px;
}

.muchlarger {font-size: 140%; }
.larger {font-size: 120%; }

.smaller {font-size: 90%; }
.smallest {font-size: 80%; line-height: 120%;}
.verysmall {font-size: .5em; line-height: 1em;}

.part_of_speech {font-size: 90%; font-variant:small-caps;}

.sans_serif {font-family: Helvetica, "Gill Sans", sans-serif; }
/* For iTunes ad */
iframe {
  max-width: 80vw;
  max-height: 80vw;
}

/* For VPA type games */
.inline_list {
padding: 0px;
}

.inline_list li {
display: inline;
list-style-type: none;
padding-right: 20px;
}

.CAstandards {
    width:100%;
    border:1;
    cellpadding:4;
    cellspacing:0;
 }

.CAstandards td {
    border:1;
 }

.break-word {
    word-wrap:break-word;
    overflow-wrap: break-word;
    word-break: break-word;
}

/* Styles for rewrite 2020 */
.overview-content {
	margin: auto;
	max-width: 800px;
}
.menu {
	color: #c6c8ca;
	text-decoration: none;
	font-weight: bold;
	font-size: 100%;
	font-family: "Helvetica Neue", Tahoma, "Lucida Grande", Helvetica, sans-serif;
	padding: 1em 0em 1em 0em;
}

.menu .selected { color: #642033; }

.game-title, .game-subtitle { 
	color: #511A29;
	font-weight: normal; 
	font-size: 110%;
	font-family: "Helvetica Neue", Tahoma, "Lucida Grande", Helvetica, sans-serif;
	margin: 0;
}

.game-subtitle {
	font-size: 90%;
}

.game-display-padding {
	box-sizing: border-box;
	padding-right: 1em;
}

.spacer-padding { padding-top: 4em; }

.rounded-corners {
	border-radius: 25px;
}
