/* Global site styles */


    body{
        position:relative;
        padding:0px;
        background-color: #C7D9C0;         
        background-attachment:fixed;
        font: 10pt arial, helvetica, sans-serif;
	    color: #000;
    }
        
    #content{
        /*float: left;*/
        margin-left: 230px;
        margin-top: 10px;
        padding-bottom: 1em;
        padding-top: 10px;
        padding-left: 15px;
        padding-right: 15px;
        width: 840px;
        background-color: #fff;
        box-shadow: 2px 2px 3px #555;
    }

/*added for header landmark */   
    #content_top{
        /*float: left;*/
        margin-left: 230px;
        margin-top: 10px;
        margin-bottom: -11px;
        padding-bottom: 1em;
        padding-top: 10px;
        padding-left: 15px;
        padding-right: 15px;
        width: 840px;
        background-color: #fff;
        box-shadow: 2px 2px 3px #555;
    }
    
#footer 
{        
        background-color: #fff;
        box-shadow: 2px 2px 3px #555;
        margin-left: 230px;
        padding-bottom: 1em;
        padding-top: 10px;
        padding-left: 15px;
        padding-right: 15px;
        width: 840px;
        text-align:right;
}






#footer.p
{
        background: url(images/footerbg.png) bottom left no-repeat;
        margin-top: 0px;
        padding-bottom: 1em;
        padding-top: 0px;
        text-align:right;
}
 

img.left  {display: inline; float: left; margin: 0 1em 1em 0; padding-top: 10px;}
img.right {display: inline; float: right; margin: 0 0 1em 1em;}   
img.text {margin:0; vertical-align: middle; }
img.texttop {margin:0; vertical-align: text-top; }
img.padded {padding: 0 0 1em 0; }

figure {
    border: thin #c0c0c0 solid;
    display: flex;
    flex-flow: column;
    padding: 5px;
    max-width: 280px;
    margin: auto;
}


figcaption {
    color: #000;
    font-weight: bold; 
    padding: 6px;
    text-align: center;
}
    
#space
    {
        position: static;
        display: block;
        float:none;
        margin: 0 auto; 
        padding: 0; 
        width: 100%; 
        font: 10pt arial, helvetica, sans-serif;
	    color: #303030;
    }
    
#space p {font-size: 1em; margin: 0; padding: 0 0 1em;}
    
    
    #header
    {
        height:160px;
        background-color:#fbf5ea;
        width: 840px;
        margin-left: 230px;
        font-size:x-small;
        padding:0px;
        float: left;

    }
    
    blockquote {

          margin-top: 10px;
          margin-bottom: 10px;
          margin-left: 50px;
          padding-left: 15px;
          border-left: 3px solid #ccc;
    }
    
    .box
    {
        border: solid 1px #ccc; padding: 10px;
    }

.hyp {
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
    
    .serif {font-family: times new roman, times, georgia, serif;}
    
    #writtensample 
    {
          margin-top: 10px;
          margin-bottom: 10px;
          margin-left: 50px;
          padding-left: 15px;
          padding-right: 30px;
          /*font: 10pt "Courier New", Courier New, Courier, georgia, times, monospace;  */
    
        
    } 
    

    
    #writtensample h2
    {
          margin-top: 10px;
          margin-bottom: 10px;
          margin-left: 50px;
          padding-left: 15px;
          padding-right: 30px;
          text-align: center;
          font: 11pt times, serif; 
          font-weight:bold; 
          color: #000;
    } 
    
    h1{
        color:#D76D49;
        background: url(images/header_small.jpg) top left no-repeat;
        border-bottom: solid 2px #124C60;
        font-size: 20pt;
        font-family:arial;
        margin: 0 -11px 0 -11px; 
        font-weight:bold;
        width: auto;
        text-align:center;
        padding: 0; 
        line-height: 91px;
    }
    
    h1.double {
        color:#D76D49;
        background: url(images/header.jpg) top left repeat-x;
        font-size: 20pt;
        font-family:arial;
        margin: 0 10px 0 -11px; 
        font-weight:bold;
        width: 760px;
        text-align:center;
        padding: 0 0 20px 0; 
        line-height: 40px;
    }
    
    
    h2{
        color:#124C60;
        font-size:18pt;
        font-family:arial;
      
        font-weight:bold;
    }
    
    h3{
        color:#124C60;
        font-size: 16pt;
        font-family:arial;
      
        font-weight:bold;
    }
    
    h4{
        color:#3D1F18;
        font-size: 13pt;
        font-family:arial;
       
        font-weight:bold;
    }
    
h4.h5   {
        color:#303030;
        background: url(images/ob_bg.png) top left repeat-y;
        font-size: 90%;
        font-family:arial;
        padding:10px 10px 10px 10px;
        font-weight:bold;
    } 
    
    h5{
        color:#303030;
        background: url(images/ob_bg.png) top left repeat-y;
        font-size: 90%;
        font-family:arial;
        padding:10px 10px 10px 10px;
        font-weight:bold;
    }
   
    h2 span{
        font-size:105%;
        font-weight:normal;
    }
    
        h6 {
        color:#3D1F18;
        font-size: 10pt;
        font-family:arial;
       
        font-weight:bold;
        font-style:italic;
    }

        h6.h6 {
        color:#3D1F18;
        font-size: 10pt;
        font-family:arial;
       
        font-weight:bold;
        font-style:italic;
    }
    
    a   
    {
        color:#2F5691;
        text-decoration: underline;
    }
        
    
    .left
    {
        float: left;
    }    
    
   .example_item
   {border: 1px solid #C0C0C0; margin: 0 0px 0 0px; padding: 30px;} 
   .example_item ol.ABC li {margin-left:-1em;}
   .example_item ul li {margin-left:-1em; list-style-type:disc; padding: 0 0 .25em 1.5em; background: none; color: #000;}
   
  ul.classic {list-style-type: disc;
    padding: 0 0 .25em 1.5em;
    background: none;
    color: #000;
  }
   
       .handwriting
    {
        font-family: Sher, Comic Sans MS, comic sans, Lucida Handwriting, Lucida Sans, Monotype Corsiva, courier new, arial ;
        font-size: 12pt;
        font-weight: normal;
    }
    
    .handwriting_teacher
    {
        font-family: Lucida Sans, Monotype Corsiva, Lucida Handwriting, Comic Sans MS, comic sans, courier new, arial ;
        font-style: italic;
    }

   
/* Tables */
    /*table       {border-top: 1px solid #C0C0C0; border-collapse: collapse; margin: 1em 0; width: 100%;}*/
    table       {border-collapse: collapse; margin: 1em 0; width: 100%;}
    th          {border: 1px solid #C0C0C0; background-color:#F0F0F0; border-collapse: collapse; text-align: left; font-size: .95em; line-height: 1.5em; margin: 0; padding: .35em .5em;  font-weight: 700;}
    td          {border: 1px solid #C0C0C0; border-collapse: collapse; font-size: .95em; line-height: 1.5em; margin: 0; padding: .35em .5em;}
    td.center   {text-align: center;}
    td.left   {text-align: left;}
    
    td.midd {vertical-align:middle;}
        
    th.center   {text-align: center;}
    td input    {clear: none; display: inline; float: none; margin: 0; padding: 0;}
    
    .testList td {vertical-align:top;}
    
    table.noborder       {border-top: none;  width: auto;}
    .noborder th         {border: none; background-color:transparent; white-space: nowrap; vertical-align: top;}
    .noborder td         {border: none; vertical-align:top;}

    table.nobordert       {border-top: none;}
    .nobordert th         {border: none; background-color:transparent; white-space: nowrap; vertical-align: top;}
    .nobordert td         {border: none; vertical-align:top;}

	table.noborder2       {border-top: none;  width: auto;}
    .noborder2 th         {border: none; background-color:transparent; white-space: nowrap; vertical-align: top;}
    .noborder2 td         {border: none; vertical-align:top; padding:0;}
    
    table.borderless       {border-top: none;  width: auto; padding: .7em 1em;}
    /*.borderless th         {border: none; background-color:transparent; white-space: nowrap; vertical-align: middle; text-align: center; color:#3D1F18; font-size: 13pt; font-family:arial; font-weight:bold;}*/
    .borderless th         {border: none; background-color:transparent; vertical-align: middle; text-align: center; color:#3D1F18; font-size: 13pt; font-family:arial; font-weight:bold; width:30%; }
    .borderless td         {border: none; vertical-align:top;}
    
    .padbig {padding:10px; margin: 0px;}
    

    .table70 {width:70%;}
    
    .clear {background-color: #FFFFFF; border: 1px solid #000000; padding:.5em 1em;}
    table.thick {border: 2px solid #000000; width: auto}
    td.right {text-align: right;}
    
.score tbody {vertical-align: top;}
.score th {text-align: center;}
.score td > ul {padding: 0 0 0 .75em; margin: 0 0 0 .75em;}
 
/* Test Framework Table */
  /*  table.framework {border-top: 1px solid #C0C0C0; border-collapse: collapse; margin: 1em 0; width: 85%;}*/
    table.framework {border-collapse: collapse; margin: 1em 0; width: 95%;}
    

    
      img.piechart {
        display: block;
        margin-left: auto;
        margin-right: auto;
    }
    
caption {color: #000; font-size: 1em; line-height: 1.4em; margin: .5em 0; font-weight: 700;}

.dotfil { background: url(images/dotfill.png);}
.linefil { background: url(images/linefill.png);}



p.blankline {
   width: 100%; 
   text-align: left; 
   border-bottom: 1px solid #000; 
   line-height: 0.5em;
   margin: 10px 0 20px; 
} 

span.blank { 
    background:#fff; 
}

/* Menu */
    
    #sideBar{
        position: fixed;
        width: 220px;
        top: 55px;
        left:0px;
        background-color: #eef5eb;
        border-radius: 0px 6px 6px 0px;
		overflow: auto;
    }

	.sideBarBig {
        width: 220px;
		overflow: auto;
    }
	 
	
    #sideBar img
    {border: none;}    

    .mid {padding: 10px 0 10px 0;}
    
    .home {margin-left:90px;}

   
    /*#sideBarTab{
        float:left;
 
        width:28px;
    }*/
   
    #sideBarTab img{
        border:0px solid #FFFFFF;
    }
    #sideBar   ul{
        margin:10px 0px 16px 0px;
        padding:0px 0px 0px 0px;
        font-weight:600;
        
    }
   
    #sideBar li{
        margin:5px 0px 5px 6px;
        padding:0px 0px 0px 14px;
        list-style-type:none;
        background: url(images/menu_bg_gr.png) top left no-repeat;
        width:180px;
    }
    

   
    #sideBar li a:link,
    #sideBar li a:visited{
        color:#2F5691;
        font-family:verdana;
        font-size:90%;
        text-decoration:none;
        margin:0px 0px 0px 0px;
        padding:0px;
        width:100%;
    }
   
    #sideBar li a:hover{
        color:#3b639f;

    }
    
    #pages {margin-left: 5px; font-weight: bold; color:#003c48;}
    #pages a{
            border: solid 1px #3d1f18;
            margin: 1px;
            padding: 2px 4px 2px 4px;
            background-color: #c7d9c0;
            text-decoration: none;
            color: #3d1f18;
			display: inline-block;
        }
    #pages a.active {border: none; margin: 0px; padding: 2px 2px 2px 2px; background-color: #EEF5EB; text-decoration:none; color:#3d1f18;}
    #pages a:hover{background-color: #D76D49; color:#000;}

	
	#pagesnarrow {margin-left: 5px; font-weight: bold; color:#003c48;}
    #pagesnarrow a{
            border: solid 1px #3d1f18;
            margin: 1px;
            padding: 2px 3px 2px 3px;
            background-color: #c7d9c0;
            text-decoration: none;
            color: #3d1f18;
			display: inline-block;
        }
    #pagesnarrow a.active {border: none; margin: 0px; padding: 2px 2px 2px 2px; background-color: #EEF5EB; text-decoration:none; color:#3d1f18;}
    #pagesnarrow a:hover{background-color: #D76D49; color:#000;}
    
    #sideBar p {margin: 3px 0px 3px 6px; padding: 0 0 0 10px; background: url(images/menu_bg_sub.png) top left no-repeat; }

    #sideBar p a:hover{
        color:#000;   
    }
    
    #sideBar h2     
    {
     color:  #0c4962; 
     font-size: 13pt;
     font-weight: bolder;
    }
    #sideBar h2.bookmark
    {padding: 0 0 0 17px; background: url(images/menu_bm.png) top left no-repeat; }
    #sideBar h2.page
    {padding: 0 0 0 17px; background: url(images/menu_pg.png) top left no-repeat; }
    #sideBar h2.more
    {padding: 0 0 0 17px; background: url(images/menu_mo.png) top left no-repeat; }  

    .standards {background-color: #e1edf5; border: solid 1px #b9cbd7; text-align: center; width: 50%; } 


/***/
/* Type Styles */


p          {color: #000; font-size: 1em; line-height: 1.4em; margin: 1em 0;}
.error     {color: #C00; font-weight: 700;}
p.small,
span.small {font-size: .85em;}
strong     {font-weight: 700;}
em         {font-style: italic;}
.price     {color: #369; font-size: 1.2em;}

.jp, ol li.jp         { font-family:  Meiryo, "Hiragino Kaku Gothic Pro", Osaka, sans-serif;}
.rus, ol li.rus         { font-family:  "Geneva CY", "Helvetica CY", Arial, sans-serif; }
.greek, ol li.greek         { font-family:  Gentium, OdysseaU, GraecaUBSU,  Arial, sans-serif;  }
.ChSimplified, .ChTraditional   {font-family: PMingLiU, SimSun, SimHei, STHeiti, Tahoma, Helvetica, Arial, sans-serif;}
.arabic, ol li.arabic          
{
    font-family: "Simplified Arabic", "Urdu Typesetting", "STFangsong", "STHeiti", "STKaiti", "STSong", "AB AlBayan", "AB Geeza", "AB Kufi", "DecoType Naskh", "Aldhabi", "Andalus", "Sakkal Majalla", "Traditional Arabic", "Arabic Typesetting", "Urdu Typesetting", "Droid Naskh", "Droid Kufi", "Roboto", "Tahoma", "Times New Roman", "Arial", serif;
    font-size: 1.3em;}
sup {
   vertical-align: baseline;
   position: relative;
   top: -0.4em;
}

sup.smll {vertical-align: baseline;
    position: relative;
    top: -0.3em;
    font-size: x-small;}
	
sub {
   top: 0.4em;
}

span[dir] {
  unicode-bidi: bidi-override;
}

.lg {font-size: 1.3em; line-height: 2em; margin: 1em 0;}
.ChSimplified, .ChTraditional   {font-family: PMingLiU, SimHei, STHeiti, Tahoma, Helvetica, Arial, sans-serif;}
.hebrew {text-align: right;}

.typed div {
    display: block;
}

.typed {
    font-family: Courier, Courier New, serif;
    font-size: 10pt;
    font-weight: normal;
}

p.indent1 {
    padding: 0px;
    text-indent: 3em;
}

p.indent3 {
    padding: 0px;
    text-indent: 6em;
}

p.indent6 {
    padding: 0px;
    text-indent: 12em;
}

span.indent1 {
    padding-left: 3em;
    font-family: Courier, Courier New, serif;
    font-size: 10pt;
    font-weight: normal;
}
span.indent3 {
    padding-left: 6em;
    font-family: Courier, Courier New, serif;
    font-size: 10pt;
    font-weight: normal;
}

/* List Styles */
/* ol         {list-style: decimal none outside; margin-left:0px; padding-left:20px;}*/ 
ol         {list-style: decimal none outside; margin: 1em 0 1em 1.5em;}
ol.num    {list-style: decimal none outside; margin: 1em 0 1em 1.5em;}
ol.num li  {background: none; color: #000; font-size: 1em; line-height: 1.4em; padding: 0 0 .5em 1.5em;}
ol.ABC     {list-style: decimal none outside; margin: 1em 0 1em 3em; list-style-type: upper-alpha; }
ol.ABC li  {background: none; color: #000; font-size: 1em; line-height: 1.4em; padding: 0 0 .5em .5em;}
ol.unstyled li {list-style: none;}

.standlist ol { counter-reset: item; list-style-type: none; }
.standlist li { display: block ; counter-increment: item; margin-left: 20px;  }
.standlist li:before { content: " ("counter(item,decimal)") "; margin-left: -20px;}

blockquote.poetry {
    text-indent: -30px;
    padding-left: 45px;
}

pre.poem {font-family: arial, helvetica, sans-serif;}


span.linecount {float: right;}
.under  {text-decoration:underline;}
.center  {text-align:center;}
.over {text-decoration: overline;}
 .root {white-space: nowrap;}
.circle 
    {
    border: solid 1px #525051; border-radius: 10px; padding: 1px 1px 2px 1px; 
    }   
p.indent {text-indent: 15px;}
/*ul          {margin-left:0px; padding-left:20px;}
ul            {list-style-image: none; list-style: outside; list-style-type: none; margin: 1em 0 1em 2em; }
ul li         {background: url(images/bullet.gif) 0 0 no-repeat; color: #363636; font-size: 1em; line-height: 1.4em; padding: 0 0 .5em 1.5em;} */
ul            {margin: 1em 0 1em 2em;}
li            {font-size: 1em; line-height: 1.4em; padding: 0 0 .25em;}

table.lists tr td > ul, li {margin:0 .5em .5em .5em; padding:0;}
table.lists tr > th, td.lists {text-align:center; font-weight:bold;}

span.padtop {display: inline-block; padding-top: 4px;}
span.padtop8 {display: inline-block; padding-top: 8px;}
div.padtop8 {padding-top: 8px;}
div.martop1 {margin-top: 1em;}

.box60 {border:1px solid #000000; width:60%; padding:10px;}
.box90 {border:1px solid #000000; width:90%; padding:10px;}

p.ul          {margin: 0em 0 .5em 0em; }  


   ol.unstyled.bib.hangingindent > li > p 
    {
        padding-left: 25px ;
        text-indent: -25px ;
    }
    
        ol.unstyled.bib.hangingindent > li > blockquote
    {
        padding-top: 0;
        margin-top: 0;
        -webkit-margin-before: 0;
    }
    
            ol.unstyled.bib.hangingindent > li > blockquote > p
    {
        padding-top: 5px;
        margin-top: 0.25em;
    }
    
    ul.list-unstyled 
{
  margin: 0;
  padding-left: 12px;
  list-style: none;
}



    p.indent 
    {
        padding-left: 2em;
    }

.indent_16 {text-indent: 16em;}

.hangingindent_2 {
	padding-left: 4em;
    text-indent: -2em;
}

/*ul--- li----->*/

ul.check     {list-style-image: none; list-style-position: outside; list-style-type: none; margin: 1em 0 1em 1.5em;}
ul.check li  {background: url(images/li_check.png) 0 4px no-repeat; padding: 0 0 .75em 1.5em;}
ul.scoring     {list-style-image: none; list-style-position: outside; list-style-type: none; margin: 1em 0 1em 1.5em;}
ul.scoring li  {background: none; padding: 0 0 .75em 1.5em;}
dl.faqs      {clear: both; margin: 1em 0;}
dl.faqs dt   {background: url(images/dt_faq.png) 0 0 no-repeat; color: #444; cursor: pointer; font-weight: 700; margin: 1em 0; padding: 0 0 0 24px;}
dl.faqs dt.e {background: url(images/dt_faq_expanded.png) 0 0 no-repeat; margin: 1em 0; padding: 0 0 0 24px;}
dl.faqs dd   {background: #FFFFFF; border-left: 5px solid #CCC; border-top: 5px solid #CCC; font: normal 13px/18px Arial, Sans-Serif; margin: 0 0 1em 24px; padding: 1em;}
dl.faqs a   {color: #444; cursor: pointer; font-weight: 700; text-decoration:none;}

dl.faqs dt  span.open {display:none;}
dl.faqs dt.e span.shut {display:none;}
dl.faqs dt.e  span.open {display:inline;}

.standard {font: normal 16px/18px Arial, Sans-Serif;}

/* Sample styles */
/* div.faqs      {clear: both; margin: 1em 0;} */
dl.faqs dd.expandable   {background: #FFFFFF; border-left: 5px solid #CCC; border-top: 5px solid #CCC; font: normal 13px/18px Arial, Sans-Serif; margin: 0 0 1em 24px; padding: 1em;}


/* style the expandable's button */
[data-expandable] {
  display: block;
  width: 100%;
  text-align: left;
  font-weight: 700;
  background: #ffffff;
  border: 0;
  color: #444;
}

/* make sure there is a focus style for keyboard accessibility */
[data-expandable]:focus {
  outline: 2px solid #005C9C;
  outline-offset: 1px;
}

/* the arrow using pseudo-content and unicode*/
[data-expandable][aria-expanded="false"]::before {
}
/* the arrow for the expanded state using pseudo-content and unicode */
[data-expandable][aria-expanded="true"]::before {
}

/* the arrow using pseudo-content and unicode
[data-expandable][aria-expanded="false"]::before {
  content: url(images/answer.png);
}*/
/* the arrow for the expanded state using pseudo-content and unicode
[data-expandable][aria-expanded="true"]::before {
  content: url(images/answer_expanded.png);
} */

/* pair visual appearance with accessible state  */
.expandable[aria-hidden="true"] {
  display: none;
}

/* Questions */
.q-controls {font-size: 11px;}


span.frac {
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  min-width: 14.83px;
  padding: 0;
}

span.frac > sup {
  display: block;
  border-bottom: 1px solid;
  font: inherit;
  top: 0;
}

span.frac > span {
  display: none;
}

span.frac > sub {
  display: block;
  font: inherit;
  top: 0;
}

.parenthetical
{
            
}

.parenthetical:after
{
    display: inline-block;
    content: ")";
    transform: scale(0.8,2);
}

.parenthetical:before
{
    display: inline-block;
    content: "(";
    transform: scale(0.8,2);
}

.matrix {
	display: inline-block;
	vertical-align: middle;
	position: relative;
	min-width: 4em;
	min-height: 3em;
	border-left: 1px solid;
	border-right: 1px solid;
}

.matrix > .ul, .matrix > .ur, .matrix > .ll, .matrix > .lr {
	position: absolute;
}

.matrix > .ul, .matrix > .ur {
	top: 0;
}

.matrix > .ll, .matrix > .lr {
	bottom: 0;
}

.matrix > .ul, .matrix > .ll {
	left: 0;
	padding-left: 5px;
}

.matrix > .ur, .matrix > .lr {
	right: 0;
	padding-right: 5px;
}

.radical 
{
    text-decoration: overline;
    padding-left: 5px;
    padding-right: auto;
}

.radical:before 
{
    content: "\23B7";
    font-size: inherit;
}

.nobr 
{
    white-space:nowrap;
}

.abs 
{
        
}

.abs:before, abs:after
{
    display: inline-block;
    height: 100%;
    content: "|";        
}

    table.tictac {width: 600px; height: 600px; text-align: center; overflow-x: auto; }
    table.tictac td {width: 33%; height: 33%; }

/* Fillable
table.fillable td, th {
    min-width: 50px;
    height: 70px;
}

table.fillablesm td, th {
    height: 50px;
} */

span.plan {
    width: 100%;
    display: block;
}

span.plan:hover {
  outline:  1px dotted;
  background-color: #FFFFB3;
  line-height: 1.5;
}

span.planbig:hover {
  line-height: 3.5;
}

input:focus { background-color: #FDF8BC; border: 2px dotted #000000 !important;}

    .tabletop {}
    .tabletop th, td {vertical-align:top; text-align: left;}
    /*.tabletop ul  {margin: 1em 0 1em .5em;}*/
    .tabletop ul, ol {padding-inline-start: 10px;}

    /*.tabletop ol, ul {padding-left:1em; margin: 1em 0 1em .5em;}*/
    .tabletop ul li {padding:0 0 .25em .5em;}
    
    /*.tablecenter {}
    .tablecenter th, td {vertical-align:top; text-align:center;}*/
    
        ul.list-unstyled2 
{
 
  padding-left: 12px;
  list-style: none;
}

    ul.list-unstyled2 li
{
  list-style: none;
}

.width25 {width:25%;}
.width30 {width:30%;}
.width30t {width:30%;}
.width33 {width:33%;}
.width40 {width:40%;}
.width50 {width:50%;}
.width60 {width:60%;}
.width70 {width:70%;}
.width80 {width:80%;}
.width90 {width:90%;}
.tablecntr {margin-left:auto; margin-right:auto;}

.scale {max-width: 100%; height: auto;}

.nobr {white-space: nowrap;}

/*Responsive*/

.break {
  /* Careful, this breaks the word wherever it is without a hyphen */
  overflow-wrap: break-word;
  word-wrap: break-word;

  /* Adds a hyphen where the word breaks */
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
}

@media (min-width: 850px) and (max-width: 1024px) 
{
    #content{
           
            width: 600px;
            background-color: #fff;
            box-shadow: 2px 2px 3px #bbb;
        }
    #content_top{
           
            width: 600px;
            background-color: #fff;
            box-shadow: 2px 2px 3px #bbb;
        }
        
    #footer 
    {        
            background-color: #fff;
            box-shadow: 2px 2px 3px #bbb;        
            width: 600px;        
    }

}

@media (max-width: 850px) 
{
    #content{
              width: 500px;
    }
    #content_top{
              width: 500px;
    }
    #footer 
    {   
            width: 500px;        
    }

    blockquote {margin-left: 20px; margin-right: 10px;}
   .blockquote_sm {margin-left: 0px; margin-right: 0px;}    

    .width50 {width:80%;}
	.width60 {width:80%;}
    .width70 {width:80%;}
	.box60 {border:1px solid #000000; width:80%; padding:10px;}
   	.width25 {width:50%;}
	.width30 {width:60%;}
	.width30t {width:60%;}
	.width33 {width:60%;}
	.width40 {width:60%;}
	.width80 {width:100%;}
}

@media (max-width: 768px)

{
    #content{
              width: 450px;
    }
    #content_top{
              width: 450px;
    }
    
    #footer 
    {   
            width: 450px;        
    }  
    
}
    

@media (max-width: 700px) 
{
    #content{
        margin-left: 0px;
        margin-top: 5px;
        width: auto;
        box-shadow: none;
    }
    #content_top{
        margin-left: 0px;
        margin-top: 5px;
        width: auto;
        box-shadow: none;
    }
    
    #footer 
    {        
            background-color: #fff; 
            box-shadow: none;
            margin-left: 0px;
            width: auto;
    }  
    #sideBar{
        position: relative;
        margin-left: 0px;
        margin-right: 0px;
        width: 100%;
        top: 0px;
        left:0px;
    }

    .sideBarBig {
        width: 100%;
    }

    
    .top {display:none;}
    .mid {background-color: #e1edf5; padding: 10px 0 10px 0; }
    .bot {display:none;}
    
    .width50 {width:100%;}
	.width60 {width:100%;}
    .width70 {width:100%;}
	.box60 {border:1px solid #000000; width:100%; padding:10px;}
   	.width25 {width:75%;}
	.width30 {width:90%;}
	.width30t {width:60%;}
	.width33 {width:90%;}
	.width40 {width:90%;}
	.width80 {width:100%;}

	.noShow {display:none;}


    #sideBar   ul{
        margin: 0px 0px 0px 5px;
        padding: 0px 0px 0px 5px;
        font-weight:600;
        width: 95%;
    }
   
    #sideBar li{
        margin: 3px 0px 3px 0px;
        padding: 0px 10px 0px 15px;
        list-style-type: disc;
        width: auto;
        display: block;
        background: url(images/menu_bg_gr.png) top left no-repeat;
    }
    
  
    #sideBar li a:link,
    #sideBar li a:visited{
        font-size:80%;
        margin:0px 0px 0px 0px;
        padding:0px;
    }
    
    #sideBar h2  {font-size: 11pt; font-weight: bold; margin: 0 0 0 5px;}
    #sideBar h2.bookmark, #sideBar h2.more, #sideBar h2.page {padding: 0 0 0 0px; background: none;}
    #sideBar h2.page {margin-bottom: 1em;}

   h1 {background: none; line-height: 30px; margin: 0; padding: 0;}

   #sideBar img {height: 25px; width: 25px; display: inline; } 
/*#sideBar img {height: 15px; width: 15px; display: inline; margin-left: -250px;}*/ 

	#sideBar p {display:none;}

 /*    #pages a{
            border: solid 1px #3d1f18;
            margin: 4px;
            padding: 4px 8px;
            background-color: #c7d9c0;
            text-decoration: none;
            color: #3d1f18;
        }
   #pagesnarrow a{
            border: solid 1px #3d1f18;
            margin: 3px;
            padding: 3px 6px;
            background-color: #c7d9c0;
            text-decoration: none;
            color: #3d1f18;
        } */
}

@media (max-width: 400px) 
{
/*    #sideBar   ul{display:none;} 
    #sideBar{
        position: fixed;
        margin-left: 0px;
        margin-right: 0px;
        width: 100%;
        top: 0px;
        left:0px;
    }

    .sideBarBig {
        width: 100%;
    }

    h2.bookmark, h2.more {display:none;}*/

/*    #content{margin-top: 100px;
    }
    #content_top{margin-top: 100px;
    }
    
	#sideBar p {display:none;} */
    
    .box50 {border:1px solid #000000; width:90%; padding:1em;}

   .example_item {padding: 10px;} 
	
	.example_item ul li {padding: 0 0 .25em .5em;}

	ul {margin: 1em 0 1em 1em;}





	audio { width: 220px; }

	.width25 {width:75%;}
	.width30 {width:90%;}
	.width30t {width:60%;}
	.width33 {width:90%;}
	.width40 {width:90%;}
	.width80 {width:100%;}


}

@media (max-width:$screen-xs-max) {}

@media (min-width:$screen-sm) {}

@media (min-width:$screen-sm) {}


[class*="tooltip"] {
    position: relative;
    text-decoration: none;
}

[class*="tooltip"]:after,
[class*="tooltip"]:before {
    position: absolute;
    z-index: 100;
    opacity: 0
}

[class*="tooltip"]:after {
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
    content: attr(aria-label);
    height: 25px;
    line-height: 25px;
    padding: 0 10px;
    font-size: 1em;
    text-align: center;
    color: #fff;
    background: #222;
    border-radius: 4px;
    text-shadow: 0 0 5px #000;
    white-space: nowrap
}

[class*="tooltip"]:before {
    content: '';
    width: 0;
    height: 0;
    border-width: 6px;
    border-style: solid
}

[class*="tooltip"]:hover:after,
[class*="tooltip"]:focus:after,
[class*="tooltip"]:hover:before,
[class*="tooltip"]:focus:before {
    opacity: 1
}

.tooltip-top:after,
.tooltip-top:before {
    transition: bottom .25s ease-in-out;
    bottom: 90%;
    left: -9999px;
    margin-bottom: 12px
}

.tooltip-top:before {
    border-color: #222 transparent transparent transparent;
    margin-bottom: 0
}

.tooltip-top:hover:after,
.tooltip-top:focus:after,
.tooltip-top:hover:before,
.tooltip-top:focus:before {
    bottom: 85%;
    left: 0
}

.tooltip-top:hover:before,
.tooltip-top:focus:before {
    left: 5px
}

.tooltip-bottom:after,
.tooltip-bottom:before {
    transition: top .25s ease-in-out;
    top: 90%;
    left: -9999px;
    margin-top: 12px
}

.tooltip-bottom:before {
    border-color: transparent transparent #222 transparent;
    margin-top: 0
}

.tooltip-bottom:hover:after,
.tooltip-bottom:focus:after,
.tooltip-bottom:hover:before,
.tooltip-bottom:focus:before {
    top: 85%;
    left: 0
}

.tooltip-bottom:hover:before,
.tooltip-bottom:focus:before {
    left: 5px
}

[class*="tooltip"]:after,
[class*="tooltip"]:before {
    transition: opacity .25s ease-in-out
}

    
/*for screen readers only, otherwise hidden*/

.hidden 
{position:absolute;
left:-10000px;
top:auto;
width:1px;
height:1px;
overflow:hidden;}

/*offscreen used matching es.site.css*/
    
.offscreen {position:absolute; left:-999em; top:auto; width:1px; height:1px; overflow:hidden;}

#print_helper {
  display: none;
}