/* NO fonts, ONLY layout! */


body
{
	margin: 10px 10px 10px 10px;
	/*
	NEED
	a
	left
	padding (
	last
	val),
	to
	look
	good: )
	*/
	padding: 2px 0px 2px 12px;
	line-height: normal;
	margin: 5px; /* good for mobile devices.. */
}
/* body */


body
{
	/*background: #1E1E33;*/
	color: #F0F0FF;
	color: #222233;
}

/* order: link, visited, hover, active */
a:link, a:visited
{
	color: #012F83;
	background: transparent;
	text-decoration: none;
}

a:hover
{
	color: #FFFF99;
	color: #012F83;
	background: transparent;
	text-decoration: underline;
}

a:active
{
	color: #012F83;
	text-decoration: underline;
}

h1, h2, h3, h4, h5, h6
{
	color: #EFEFF6;
	color: #222233;
	margin-left: 12px;
}

/* 'standard' p (plus ul, li) is below, can be overridden by *txt classes that come later */
/* treat the 40px below as 'medium', and scale up/down as before to
vvs vs s m l vl vvl; */
/* alt: look for ANOTHER p at the BOTTOM of this file */
p
{
	color: #222233;
	font-size: 40px;
	margin: 15px 5px 5px 5px;
}

ul
{
	color: #F0F0FF;
	color: #222233;
	font-size: 40px;
	margin-top: 4px;
}

li
{
	color: #F0F0FF;
	color: #222233;
	font-size: 33px;
	margin-left: 0px;
	padding-left: 15px;
}

/* next are the smaller versions of p, ul, li */
.smp
{
	color: #222233;
	font-size: 30px;
	margin: 4px 4px 12px 4px;
}


.sml
{
	color: #F0F0FF;
	color: #222233;
	font-size: 25px;
	margin-top: 0px;
}


table
{
	margin: -4px;
	margin-top: -2px;
}

td
{
	vertical-align: middle;
}

img
{
	margin-left: 5px;
	margin-top: -10px;
	margin-right: 14px;
	padding: 10px;
	border: 1px solid white;
	border-color: #494961;
	margin: 5px;
}

svg
{
	margin-left: 5px;
	margin-top: -5px;
	margin-right: 14px;
	padding: 10px;
	border: 1px solid white;
}

object
{
	margin-left: 5px;
	margin-top: 5px;
	margin-right: 14px;
	padding: 10px;
	border: 1px solid white;
}

embed
{
	margin-left: 5px;
	margin-top: 5px;
	margin-right: 14px;
	padding: 10px;
	border: 1px solid white;
}

video
{
	margin-left: 5px;
	margin-top: 5px;
	margin-right: 14px;
	padding: 10px;
	border: 1px solid white;
}

iframe
{
	margin-left: 15px;
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 5px;
	padding: 6px;
	border: 1px solid white;
	width: 96%;
	height: 550px;
}


/*
dots indicate classes, meant to provide alt ways of styling the same el; dots by themselves define
freestanding classes that can be      m&m with any el; conversely, el.class {} defines a class alt
just for that el - this can be used to override a stdalone . class? :)
*/

div.slide
{
	position: relative;
	left: 0px;
	top: 0px; /* was 0; was 20 px */

	/* as a result of 0.9 opa and bg spec, the body bg shows through each slide,
	slide bg is at L/R, body bg is
	100% as an external (outer) frame */
	/*background-image: url('pics/grid.png'); /* great for writing over :) */
	background-repeat: repeat;*/ /* better place for this: body :) */
	margin: 2px;
	/*margin-top:-10px;*/
}

div#osframe
{
	/* not 1067x800  or 666x500*/
	margin: 1px auto;
	padding: 6px;
	border: 3px;
	border-style: ridge;
	border-color: #B5B5FF;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	width: 1024px;
	height: 750px;
	overflow: auto;
	opacity: 1.0;
}

/* talk title frame, ie v. first slide */
div#tframe
{
	font-weight: bold;
	/*border-color: black;padding:10px;
	border:1px solid black;*/
	margin: 3px;
	border: none;
}

/* each slide's title frame */
div#itframe
{
	padding: 1px;
	/* moved to h1.st: */
	/*border: 2px;
	border-style: ridge;
	border-color: #8989D4;
	border-radius: 6px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 6px;*/
	margin: 10px 2px 2px 2px;
}

/* don't (CAN'T) have >=2 lframes or rframes in succession
for the most part, what's common is L, or L-R, or L-R-L, nothing else */
/* in other words, to get 2 or 3 cols, do
table
tr
td
div, ilfr
/div
/td
td
div, irfr
...
*/


div#ilframe
{

	padding: 40px;
	margin: 2px;
	float: left;
	border: 1px white;
	border-style: solid;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	/* no border, since we'll have a var-ht one if we allow it */
	border: none;
}

/* mirrored version of ilframe, for when I embed a div/frame/obj/img on the left */
div#irframe
{
	padding: 40px;
	margin: 2px;
	float: right;
	border: 1px solid white; //
	border: 2px white;
	border-style: solid;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border: none;
}

div#title
{
	color: #000046;
	text-align: center
}
div#subtitle
{
	color: #000046;
	text-align: center
}
div#xtxt
{
	color: #000046;
	text-align: left
}
div#btxt
{
	color: #000046;
	text-align: left
}
div#ltxt
{
	color: #000046;
	text-align: left
}
div#mtxt
{
	color: #000046;
	text-align: left
}
div#stxt
{
	color: #000046;
	text-align: left
}
div#tinytxt
{
	color: #000046;
	text-align: left
}
div#ittytxt
{
	color: #000046;
	text-align: left
}
div#hidtxt
{
	color: #B2B1BC;
	text-align: left
}
div#invtxt
{
	color: #B2B1BC;
	text-align: left
}

div#posterA
{
	color: #000046;
	text-align: center
}
div#posterB
{
	color: #000046;
	text-align: center
}

/* colors */
.ltblue
{
	color: #B5B5FF;
}

.oryell
{
	color: #FFE500;
}

p.more
{
	color: #000046;
	/* background: #B2B1BC; */
}

/* p class="stxt" .... etc. */ /*or instead of p: span, h1, h2.. */
.vvvstxt
{
	font-size: 5pt;
	text-align: left;
}
.vvstxt
{
	font-size: 10pt;
	text-align: left;
}
.vstxt
{
	font-size: 15pt;
	text-align: left;
}
.stxt
{
	font-size: 20pt;
	text-align: left;
}
.mtxt
{
	font-size: 30pt;
	text-align: left;
}
.ltxt
{
	font-size: 40pt;
	text-align: left;
}
.vltxt
{
	font-size: 50pt;
	text-align: left;
}
.vvltxt
{
	font-size: 60pt;
	text-align: left;
}

.hidtxt
{
	color: #B2B1BC;
	text-align: left;
}
.invtxt
{
	color: #B2B1BC;
	text-align: left;
}

/*.title
{
font: 72pt/80pt Trebuchet MS, sans-serif;color: #000046;text-align: center;
}
.subtitle
{
font: 48pt/60pt Trebuchet MS, sans-serif;color: #000046;text-align: center;
}*/

.posterA
{
	font-size: 320pt;
	color: #000046;
	text-align: center;
}

.posterB
{
	font-size: 240pt;
	color: #000046;
	text-align: center;
}


.title
{
	color: #222233;
	font-size: 100px;
	line-height: 110%;
	text-transform: none;
	margin: 1px;
	padding: 4px 4px 16px 4px;
	text-align: center;
	border: none;
}

.bigtitle
{
	color: #FFFFFF;
	color: #222233;
	font-size: 200px;
	line-height: 110%;
	text-transform: none;
	margin: 1px;
	padding: 4px 4px 16px 4px;
	text-align: center;
	border: none;
}

.verybigtitle
{
	color: #FFFFFF;
	color: #222233;
	font-size: 300px;
	line-height: 110%;
	text-transform: none;
	margin: 1px;
	padding: 4px 4px 16px 4px;
	text-align: center;
	border: none;
}

.subtitleA
{
	color: #FFFFFF;
	color: #222233;
	font-size: 80px;
	line-height: 100%;
	text-transform: none;
	margin: 1px;
	padding: 4px 4px 16px 4px;
	text-align: center;
	border: none;
}

.subtitleB
{
	color: #FFFFFF;
	color: #222233;
	font-size: 60px;
	line-height: 90%
	text-transform: none;
	margin: 1px;
	padding: 4px 4px 16px 4px;
	text-align: center;
	border: none;
}

.subtitleC
{
	color: #FFFFFF;
	color: #222233;
	font-size: 40px;
	line-height: normal;
	text-transform: none;
	margin: 1px;
	padding: 4px 4px 16px 4px;
	text-align: center;
	border: none;
}

/* slide title, typically used inside an itframe */
h1.st
{
	color: #222255;
	font-size: 45px;
	line-height: normal;
	text-transform: none;
	margin: 4px 2px 1px 6px;
	margin-left: 3px;
	padding: 3px;
	padding-bottom: 1px;
        padding-top:6px;
	/* the border below lies inside the itframe's white border, creating
	a widespaced-double-line effect :) */
	/* update - no need, just use the container div's (itframe) border */
	/* moved over from div's itframe: */
	border: 2px; 
	border-style: ridge; /* solid; double; */
	border-color: transparent; /* was #8989D4; */
	border-radius: 6px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 6px;
         
}

img#simg
{
	padding: 1px;
	border-color: #666666;
	border: 1px solid;
	text-align: center;
}

/* usage: pre class="lcode" .... */
pre.lcode
{
	font-size: 36px;
	font-weight: bold;
	line-height: 100%;
	padding-top: 2px;
	padding-right: 4px;
	padding-bottom: 2px;
	padding-left: 4px;
	border: #000000;
	border-style: dashed;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	width: auto;
}
pre.mcode
{
	font-size: 24px;
	font-weight: bold;
	line-height: 100%;
	padding-top: 2px;
	padding-right: 4px;
	padding-bottom: 2px;
	padding-left: 4px;
	border: #000000;
	border-style: dashed;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	width: auto;
}
pre.scode
{
	font-size: 12px;
	font-weight: bold;
	line-height: 100%;
	padding-top: 2px;
	padding-right: 4px;
	padding-bottom: 2px;
	padding-left: 4px;
	border: #000000;
	border-style: dashed;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	width: auto;
}

p,ul,li
{
	font-size: 30px;
	margin-left: 15px;
}

/* all (ALL!) of our regular text! */
p
{
	font-size: 34px;
}

ul
{
	margin-left: 0px;
}


div.slide
{
}

pre
{
	/* might need to spec 'p pre' to create a small top margin */
	border: 1px solid #AAAACA;
	padding: 4px;
	margin-top: 0px;
	margin-bottom: 3px;
	margin-left: 18px;
	padding-left: 5px;
	font-size: 24px;
	font-weight: bold;
	letter-spacing: 0.5px;/* valid to spec 0px! */
	line-height: 150%;	/* 650 px - PERFECT for printing w/ 0.5" margin on all sides.. */
	white-space: pre-wrap;                 /* CSS3 browsers  */
	white-space: -moz-pre-wrap !important; /* 1999+ Mozilla  */
	white-space: -pre-wrap;                /* Opera 4 thru 6 */
	white-space: -o-pre-wrap;              /* Opera 7 and up */
	word-wrap: break-word;                 /* IE 5.5+ and up */
	/* overflow-x: auto; */                /* Firefox 2 only */
	/* width: 99%; */         /* only if needed */
	color: #FFFFFF;
	color: #222233;
	/*font-family: 'PT Mono';*/
	width: 96%; /* scales nicely w/ the browser width */
	white-space: pre-wrap;                 /* CSS3 browsers  */
	white-space: -moz-pre-wrap !important; /* 1999+ Mozilla  */
	white-space: -pre-wrap;                /* Opera 4 thru 6 */
	white-space: -o-pre-wrap;              /* Opera 7 and up */
	word-wrap: break-word;                 /* IE 5.5+ and up */
	margin-left: 30px;
	margin-top: 10px;
	margin-right: 5px;
	margin-bottom: 5px;
	padding: 6px;
	border: 1px solid #555555;
	width: 94.25%;
}



p.teeny
{
	font-size: 12px;
	margin-top: -10px;
	margin-left: 40px;
}

img
{
	width: 100%;
	border: 2px solid #33336F;
	padding: 3px;
	margin-right: 0px;
}

img
{
	width: auto;
	height: auto;
	margin-left: auto;
	margin-right: auto;
}

.btn2
{
	opacity: 0.4;
}

/* wrapping */
pre
{
	white-space: pre-wrap;       /* CSS 3 */
	white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
	white-space: -pre-wrap;      /* Opera 4-6 */
	white-space: -o-pre-wrap;    /* Opera 7 */
	word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

body {
        background-image: url('pics/grid.png'); 
	background-repeat: repeat;
        /*opacity: 0.5;*/
}

/* 1/30/18: making p be 30px instead of 40px */
p
{

	font-size: 30px;
}