a img {border:none;}

body
{
background-image:url('images/bg.png');
background-color:#fcfcfc;
font-family:Arial,Helvetica,sans-serif;
color: rgb(102, 102, 102);

}

#navleft
{
margin:0px;
padding:0px;
border:0px;
position:fixed;
left:0px;
top:0px;
z-index: 2;

}

#navleftmove
{
margin:0px;
padding:0px;
border:0px;
position:fixed;
left:0px;
top:0px;
z-index: 2;
	display: block;
	width: 50px;
	height: 52px;
	background: url('images/left2long.png') top;
	text-indent: -99999px;
}

#navleftmove:hover
{
background-position: bottom;
}

#navright
{
margin:0px;
padding:0px;
border:0px;
position:fixed;
right:0px;
top:0px;
z-index: 2;
}

#navrightmove
{
margin:0px;
padding:0px;
border:0px;
position:fixed;
right:0px;
top:0px;
z-index: 2;
	display: block;
	width: 50px;
	height: 52px;
	background: url('images/right2long.png') top;
	text-indent: -99999px;
}

#navrightmove:hover
{
background-position: bottom;
}

#navmiddle
{
position:fixed;
left:283px;
width:100%;
height:52px;
top:0px;
z-index: 1;
}

#navleftbutton
{
margin:0px;
padding:0px;
border:0px;
position:fixed;
left:49px;
top:0px;
z-index: 2;
}

#navrightbutton
{
margin:0px;
padding:0px;
border:0px;
position:fixed;
left:166px;
top:0px;
z-index: 2;
}

#navtopad
{
margin:0px;
padding:0px;
border:0px;
position:fixed;
right:52px;
top:1px;
z-index: 3;
display: none;
}

#navtopadi
{
margin:0px;
padding:0px;
border:0px;
position:fixed;
right:0px;
top:1px;
z-index: 3;
}

h1
{
text-align:center;
font-size: 20pt;
text-shadow: -2px 2px 2px #999999;
}

.button1
{
cursor: pointer; 
background: #ffffff;
border:1px solid #bbbbbb;
border-radius: 0.2em;
border-top-left-radius:1.3em;
border-bottom-right-radius:1.3em;
text-shadow: -1px 1px 1px #999999;
line-height:2em;
transition: all 0.3s;
margin: 2px 0px;
}
.button1:hover
{
background: #cccccc;
}
.button1:focus
{
outline: none;
}

.textboxstyle1
{
background: #ffffff;
border:1px solid #bbbbbb;
border-radius: 0.2em;
border-top-left-radius:1.2em;
border-bottom-right-radius:1.2em;
line-height:1.5em;
transition: all 0.3s;
margin: 2px 0px;
padding-left:6px;
padding-top:4px;
padding-bottom:4px;
}
.textboxstyle1:focus
{
outline: none;
background: #eee;
}


.question
{
width: 80%;
max-width: 1020px;
}

.page-curl {
	background: #FFFFFF;
	background: -moz-linear-gradient(0deg, #F5F5F5 0%, #FFF 25%, #FFF 75%, #F5F5F5 100%);
	background: -ms-linear-gradient(0deg, #F5F5F5 0%, #FFF 25%, #FFF 75%, #F5F5F5 100%);
	background: -webkit-linear-gradient(0deg, #F5F5F5 0%, #FFF 25%, #FFF 75%, #F5F5F5 100%);
	background: linear-gradient(0deg, #F5F5F5 0%, #FFF 25%, #FFF 75%, #F5F5F5 100%);
	border: 1px solid #777777;
	-moz-border-radius: 2em 0 2em 0;
	-webkit-border-radius: 2em 0 2em 0;
	border-radius: 2em 0.3em 2em 0.3em;
	-moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
	box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
	margin: 50px auto;
	padding: 15px;
	position: relative;
	
}
@media screen{
.page-curl:before, .page-curl:after {
	background: none;
	bottom: 12px;
	-moz-box-shadow: 0 10px 12px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 10px 12px rgba(0, 0, 0, 0.5);
	box-shadow: 0 10px 12px rgba(0, 0, 0, 0.5);
	content: "";
	height: 10px;
	left: 12px;
	position: absolute;
	width: 40%;
	z-index: -1;
	-moz-transform: skew(-4deg) rotate(-4deg);
	-webkit-transform: skew(-4deg) rotate(-4deg);
	transform: skew(-4deg) rotate(-4deg);
}

.page-curl:after {
	-moz-transform: skew(4deg) rotate(4deg);
	-webkit-transform: skew(4deg) rotate(4deg);
	transform: skew(4deg) rotate(4deg);
	left: auto;
	right: 15px;
}

.page-curl.shadow-left {
	background: -moz-linear-gradient(0deg, #F5F5F5 0%, #FFF 50%) !important;
	background: -ms-linear-gradient(0deg, #F5F5F5 0%, #FFF 50%) !important;
	background: -webkit-linear-gradient(0deg, #F5F5F5 0%, #FFF 50%) !important;
	background: linear-gradient(0deg, #F5F5F5 0%, #FFF 50%) !important;
}

.page-curl.shadow-right {
	background: -moz-linear-gradient(0deg, #FFF 50%, #F5F5F5 100%) !important;
	background: -ms-linear-gradient(0deg, #FFF 50%, #F5F5F5 100%) !important;
	background: -webkit-linear-gradient(0deg, #FFF 50%, #F5F5F5 100%) !important;
	background: linear-gradient(0deg, #FFF 50%, #F5F5F5 100%) !important;
}

.shadow-bottom:before, .shadow-bottom:after {
	top: auto;
	bottom: 18px;
	-moz-box-shadow: 0 16px 13px rgba(0, 0, 0, 0.6);
	-webkit-box-shadow: 0 16px 13px rgba(0, 0, 0, 0.6);
	box-shadow: 0 16px 13px rgba(0, 0, 0, 0.6);
}

.shadow-left:after {
	display: none;
}

.shadow-right:before {
	display: none;
}

.shadow-top-bottom.shadow-left:after {
	display: block;
	bottom: auto;
	top: 15px;
	right: auto;
	left: 12px;
	-moz-box-shadow: 0 -10px 12px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 -10px 12px rgba(0, 0, 0, 0.5);
	box-shadow: 0 -10px 12px rgba(0, 0, 0, 0.5);
}

.shadow-top-bottom.shadow-right:before {
	display: block;
	bottom: auto;
	top: 15px;
	right: 12px;
	left: auto;
	-moz-box-shadow: 0 -10px 12px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 -10px 12px rgba(0, 0, 0, 0.5);
	box-shadow: 0 -10px 12px rgba(0, 0, 0, 0.5);
}
}
.idifrange
{

border: 0px;
padding-left: 0.1em;
padding-right: 0.1em;
padding-top: 0.1em;
padding-bottom: 0.1px;
max-width: 42em;
background-color:#eeeeee; 
text-align:center;
margin-left: auto;
margin-right: auto;
margin-top: 6px;
margin-bottom: 1px;
font-size: 12pt;
line-height: 0;
vertical-align: 0.5em;
border-top-left-radius:2.8em;
border-bottom-right-radius:2.8em;
box-shadow: -1px 1px 6px rgba(0,0,0, 0.5);
}


.iquestion
{
display: block;
border: 0px;
padding-left: 0.8em;
padding-right: 1em;
padding-top: 0.5em;
padding-bottom: 6px;
width: 94%;
margin-left: auto;
margin-right: auto;
margin-top: 6px;
margin-bottom: 1px;
font-size: 10pt;
line-height: 1.3em;
border-radius: 0.4em;
border-top-left-radius:2.8em;
border-bottom-right-radius:2.8em;
box-shadow: -1px 1px 3px rgba(0,0,0, 0.2); 
transition: all 0.2s;
-webkit-transition: all 0.2s; /* Safari and Chrome*/
}
.iquestion:hover
{
transform: matrix(1.01, 0, 0, 1.01, 0, -2.02);
-webkit-transform: matrix(1.01, 0, 0, 1.01, 0, -2.02); /* Safari and Chrome */
box-shadow: -3px 3px 15px rgba(0,0,0, 0.9);
}

.smalllight
{
font-size: 9pt;
color: #888888;
line-height: 1em;
}

.intro
{
font-size: 13pt;
font-weight:700;
text-shadow: -1px 1px 1px #c5c5c5;
}

.semisup 
{
vertical-align: .4em;
line-height: 0;
}
.q35specials{display:none;}
sup 
{
font-size: 0.7em;
vertical-align: .65em;
line-height: 0;
}

sub 
{
font-size: 0.7em;
vertical-align: -.25em;
line-height: 0;
}

h2
{
font-size: 15pt;
text-shadow: -1px 1px 1px #999999;
}
strong
{
text-shadow: -1px 1px 1px #999999;
font-weight:700;
}
pre {white-space: pre-wrap;}

.sometext
{
}
#ppal
{
margin-left: auto;
margin-right: auto;
text-align:center;
font-size: 8pt;
}
.mainbody
{
margin-bottom: 20px;
}
.mainbody .left
{
position: absolute;
left: 18px;
top: 52px;
margin-right:172px;
}
.mainbody .left a:link {color:#303030;}   
.mainbody .left a:visited {color:#505050;} 
.mainbody .left a:hover {color:#505050;}  
.mainbody .left a:active {color:#505050;} 

.mainbody .ileft
{
position: absolute;
left: 18px;
top: 52px;
margin-right:174px;
}
.mainbody .ileft .iquestion  a:link{text-decoration: none; color:#404040;}
.mainbody .ileft a:link {color:#404040;}   
.mainbody .ileft a:visited {color:#505050;} 
.mainbody .ileft a:hover {color:#202020;}  
.mainbody .ileft a:active {color:#202020;} 

.mainbody .right
{
position: absolute;
right:5px;
top: 52px;
width: 160px;
}

.mainbody .iright
{
position: fixed;
right:5px;
top: 52px;
width: 160px;
}

.iqbuttons{}
.pad5{padding: 5pt;}
.pad10{padding: 10pt;}
.imginbodyright
{
float:right;
}
.imginbodyleft
{
float:left;
}
.imginbodycenter
{
display: block;
margin-left: auto;
margin-right: auto;
}

.center /* for class="center" */
{
text-align:center;
}
table.p4table {color:#333333; border-width: 1px;border-color: #a9a9a9;border-collapse: collapse; margin-left:auto; margin-right:auto; }
table.p4table th {background-color:#b8b8b8;border-width: 1px;padding: 3px;border-style: solid;border-color: #a9a9a9;text-align:center;text-shadow: -1px 1px 1px #999999;}
table.p4table tr {background-color:#ffffff;text-align:center;}
table.p4table td {border-width: 1px;padding: 3px;border-style: solid;border-color: #a9a9a9;text-align:center;}
table.inptable {border-width: 1px;border-color: #a9a9a9;border-collapse: collapse; table-layout: fixed;}
.inptablecell {border-width: 1px;padding: 3px;border-style: solid;border-color: #a9a9a9;text-align:center; background-color:#cacaca;  width: 50px;}
.inptablecellin {border-width: 1px;padding: 3px;border-style: solid;border-color: #a9a9a9;text-align:center; transition: all 0.3s; }
.inptablecellin:hover {background-color:#eaeaea; cursor:pointer;}
.inptablecellin2 {border-width: 1px;padding: 3px;border-style: solid;border-color: #a9a9a9;text-align:center; transition: all 0.3s; }

.width10 {width:10%;}
.width15 {width:15%;}
.width20 {width:20%;}
.width25 {width:25%;}
.width30 {width:30%;}
.width35 {width:35%;}
.width40 {width:40%;}
.width50 {width:50%;}
.width60 {width:60%;}
.width70 {width:70%;}
.width80 {width:80%;}
.width90 {width:90%;}
.width6em {width:6em;}
.width10em {width:10em;}
.width15em {width:15em;}
.minw100p {min-width:100px}
.minw150p {min-width:150px}
.minw200p {min-width:200px}
.minw250p {min-width:250px}
.minw300p {min-width:300px}
.minw350p {min-width:350px}
.minw400p {min-width:400px}
.minw500p {min-width:500px}
.mw30 {
width:auto;
height:auto;
max-width:30%;
}
.mw40 {
width:auto;
height:auto;
max-width:40%;
}

.brightpink {
	color: #F0F;
	text-shadow: -1px 1px 1px #999999;
}
.brightred {
	color: #F00;
	text-shadow: -1px 1px 1px #999999;
}
.brightgreen {
	color: #0F0;
	text-shadow: -1px 1px 1px #999999;
}
.brightblue {
	color: #00F;
	text-shadow: -1px 1px 1px #999999;
}
.brightamber {
	color: #FFCC00;
	text-shadow: -1px 1px 1px #999999;
}
.palepink {
	color: #f58dc0;
	text-shadow: -1px 1px 1px #999999;
}


table.p14table {border-width: 0px;border-color: #a9a9a9;border-collapse: collapse; margin-left:auto; margin-right:auto; }
table.p14atable {border-width: 0px;border-color: #a9a9a9;border-collapse: collapse; }
.p14tablecell {border-width: 1px;padding: 3px;border-style: solid;border-color: #a9a9a9;text-align:center;}
.lightgreenback {background-color:#ccffcc; }
.lightredback {background-color:#ffcccc;}
.lightamberback{background-color:#fffdcc;}
.lightmoreamberback{background-color:#ffe0cc;}
.iqlightgreyback {background-color:#cacaca;}
.lightgreyback {background-color:#ccc; border-width: 1px;padding: 3px;border-style: solid;border-color: #a9a9a9;text-align:center;}
.opencell {border-width: 0px;padding: 3px;border-style: solid;border-color: #a9a9a9;text-align:center;}
.closedcell {border-width: 1px;padding: 3px;border-style: solid;border-color: #a9a9a9;text-align:center;}

.clearb{clear:both;}
.opac3{opacity:0.3;}
.opac4{opacity:0.4;}
.opac5{opacity:0.5;}
.opac6{opacity:0.6;}
.opac7{opacity:0.7;}
.opac8{opacity:0.8;}
.opac9{opacity:0.9;}

img.hard1
{
width:143px;
height:20px;
background:url(images/hardness_sprite.png) 0 0;
}

img.hard2
{
width:143px;
height:20px;
background:url(images/hardness_sprite.png) 0 -20px;
}

img.hard3
{
width:143px;
height:20px;
background:url(images/hardness_sprite.png) 0 -40px;
}

img.hard4
{
width:143px;
height:20px;
background:url(images/hardness_sprite.png) 0 -60px;
}

img.hard5
{
width:143px;
height:20px;
background:url(images/hardness_sprite.png) 0 -80px;
}

img.hard6
{
width:143px;
height:20px;
background:url(images/hardness_sprite.png) 0 -100px;
}

img.hard7
{
width:143px;
height:20px;
background:url(images/hardness_sprite.png) 0 -120px;
}

img.hard8
{
width:143px;
height:20px;
background:url(images/hardness_sprite.png) 0 -140px;
}

img.hard9
{
width:143px;
height:20px;
background:url(images/hardness_sprite.png) 0 -160px;
}

img.hard10
{
width:143px;
height:20px;
background:url(images/hardness_sprite.png) 0 -180px;
}

#fbcont{	
position:fixed;
	right:10px;
	top:10px;
	z-index:3;
}
.fb-like
{
vertical-align:top;
z-index:2;
}

.g-plusone
{

}
.buttonlink
{
margin-top: 0.2em;
display: inline-block;
background: #f9f9f9;
border: 1px solid #a1a1a1;
border-radius: 0.2em;
line-height:1.5em;
box-shadow: -2px 2px 1px rgba(0,0,0,0.5);
font-size: 11pt;
color:#000000;
text-shadow: -1px 1px 1px #999999;
transition: all 0.3s;
padding-left: 1em;
padding-right: 1em;
border-top-left-radius:1.3em;
border-bottom-right-radius:1.3em;
}
/*
.buttonlink:active
{
transform: matrix(1, 0, 0, 1, -2, 2);
}
.buttonlink:visited
{
background: #e9e9f0;
} */
.buttonlink:hover
{
background: #ccc;
}
.buttonlink:focus
{
outline: none;
}
s { 
    text-decoration: line-through;
}
.one {}
.two {}
.three {}
.four {}
.five {}
.six {}
.seven {}
.eight {}
.nine {}
.ten {}

#bard, #chatgpt
{
	background-color:rgba(255,255,255, 0.5);
	border-radius: 1em;
    padding-right: 1em;
    padding-bottom: 1em;
    padding-left: 1em;
	padding-top: 0.9em;
	border-style: solid;
    border-color: rgb(102, 102, 102);
	border-width: 1px;
	clear: both;
}





#cookiebox
{
position: fixed;
display: none;
bottom:1em;
left:1em;
background-color:rgba(255,255,255, 0.85);
border-radius: 1em;
width: 30em;
z-index: 4;
box-shadow: 2px -2px 8px rgb(101, 73, 138);
font-weight: normal;
text-align: left; 
color: rgb(80, 80, 80);
    padding-top: 0.1em;
    padding-right: 1em;
    padding-bottom: 1em;
    padding-left: 1em;
font-size: .8em;
    border-style: solid;
    border-color: rgb(101, 73, 138);
	border-width: 2px;
}
#cookiebox2
{
position: fixed;
display: none;
bottom:1em;
left:1em;
background-color:rgba(255,255,255, 0.5);
border-radius: 1em;
width: 1em;
height: 2em;
z-index: 4;
box-shadow: 2px -2px 8px rgb(101, 73, 138);
font-weight: normal;
text-align: left; 
color: rgb(80, 80, 80);
    padding-top: 0.1em;
    padding-right: 1em;
    padding-bottom: 1em;
    padding-left: 1em;
font-size: .8em;
    border-style: solid;
    border-color: rgb(101, 73, 138);
	border-width: 2px;
}

#cookiebox h4
{
font-weight: bold;
font-size: 1.2em;
line-height: 0.1em;
text-shadow: -1px 1px 1px #999999;
}
#cookiebox .accept
{
border-radius: 15pt; 
border: 1px; 
padding: 0px; 
cursor: pointer; 
margin: 0px; 

width: 30pt;
height: 30pt;
position: absolute;
top: 5pt;
right: 5pt;
text-align: center;
font-weight: bold;
line-height: 24pt;
font-size: 30pt;
background-color: rgb(90, 185, 90);
color: rgb(255, 255, 255); 
}
#cookiebox2 .accept
{
border-radius: 15pt; 
border: 1px; 
padding: 0px; 
cursor: pointer; 
margin: 0px; 

width: 20pt;
height: 20pt;
position: absolute;
top: 5pt;
right: 4.5pt;
text-align: center;
font-weight: bold;
line-height: 20pt;
font-size: 20pt;
background-color: rgb(90, 185, 90, 0.8);
color: rgb(255, 255, 255); 
}
#cookiebox2 a
{text-decoration: none;
color: rgb(255, 255 ,255, 0.8);}



input[type=range] {
    width: 10em;
	height: 1.2em;
	padding: 0.1em;
}

input[type=range]::-ms-track {
    height: 1em;
    color: transparent;
	border: none;
}
input[type=range]::-ms-fill-lower {
    background: #bbb;
    border-radius: 10px;
}
input[type=range]::-ms-fill-upper {
    background: #bbb;
    border-radius: 10px;}
	
input[type=range]::-ms-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: goldenrod;
}	

.lighter{color: rgb(190,190,190); font-weight: lighter;}
.block{display:block;}
.rhs51{line-height:2em; padding-left: 1em;}
.answerbox{max-height:20.5em; overflow-y: auto;}
.lagrande{max-width: 1020px; margin-left: auto; margin-right: auto;}
.matched{margin-left: auto; margin-right: auto; width: 85%; max-width: 950px; margin-top:2em; clear:both;}

@media (max-device-width:449px) {
h1{
color: rgb(102, 102, 120);
font-size:24pt;
}
h2{
font-size:22pt;
}
.sometext
{
font-size: 21pt;
}
.iquestion{
font-size: 21pt;
line-height: 1.2em;
width: 93%;
}
.question{
font-size: 21pt;
width: 95%;
}
.buttonlink{
font-size: 21pt;
}				
.intro
{
font-size: 19pt;
}
#navtopadi
{
display: none;
}
.button1
{
font-size: 21pt;
}
.q36special{
font-size: 12pt;
}
.textboxstyle1
{
font-size: 21pt;
}
.q35special {display:none;}
.smalllight{font-size: 14pt;
line-height: 1em;}
.lagrande{
position: fixed;
bottom:0;
z-index: 3;
width:100%;	
}
#cookiebox {bottom:80px;}
.mainbody .left {padding-bottom: 70px;}
.mainbody .ileft {padding-bottom: 70px;}
.matched{margin-left: auto; margin-right: auto; width: 100%; max-width: 100%; margin-top: 1em;}
					}
iframe #p84 {
width:100%;
}	

.aspect-ratio {
  position: relative;
  width: 90%;
  height: 0;
  padding-bottom: 50.625%;
  margin-left:auto;
margin-right:auto;
}	
.aspect-ratio iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0; top: 0;
}
					
@media (max-device-width:799px) and (min-device-width:450px)  {
h1{
color: rgb(102, 120, 102);
font-size:22pt;
}
h2{
font-size:20pt;
}
.sometext
{
font-size: 14pt;
}
.iquestion{
font-size: 14pt;
}
.question{
font-size: 14pt;
width: 95%;
}
.buttonlink{
font-size: 14pt;
}				
.intro
{
font-size: 14pt;
}

.button1
{
font-size: 14pt;
}
.q36special{
font-size: 12pt;
}
.textboxstyle1
{
font-size: 14pt;
}
.q35special {display:none;}
.q35specials {display:block;}
.lagrande{
position: fixed;
bottom:0;
z-index: 3;
width:100%;	
}
#cookiebox {bottom:80px;}
.mainbody .left {padding-bottom: 70px;}
.mainbody .ileft {padding-bottom: 70px;}
.matched{margin-left: auto; margin-right: auto; width: 100%; max-width: 100%; margin-top: 1em;}
					}
					
@media (width: 830px) and (min-device-width:800px) {	
h1{
color: rgb(120, 102, 102);
font-size:22pt;
}
.question{
width: 95%;
}
.q35special {display:none;}
.q35specials {display:block;}
.lagrande{
position: fixed;
bottom:0;
z-index: 3;
width:100%;	
}
#cookiebox {bottom:80px;}
.mainbody .left {padding-bottom: 70px;}
.mainbody .ileft {padding-bottom: 70px;}
.matched{margin-left: auto; margin-right: auto; width: 100%; max-width: 100%; margin-top: 1em;}
}
						
@media print {
body {background-image: none; background-color: #ffffff; }
#navleft, #navleftmove, #navright, #navrightmove, #navmiddle, #navleftbutton, #navrightbutton, #navtopad, #navtopadi, #cookiebox, #wherenext {display: none;}
.mainbody .right, .addthis_sharing_toolbox, .lagrande, .q35special {display: none;}
.mainbody .left {left: 5px; top: 0px; margin-right:0px; }
.mainbody .ileft {left: 5px; top: 0px; margin-right:0px; }
.question{width: 95%;}
.matched{display: none;}
}