body {margin:0px; }

#page {min-width:220px;}
div#wrapper {display:flex;flex-wrap:wrap;padding:1px;}

table#searchy, table#searchy td {border:none;background:transparent;vertical-align:middle;font-weight:normal;}
table#searchy td:last-child {text-align:right;}

h1 {font-size:1.8rem;opacity:0.85;}
h2 {color:black;font-size:1.3rem;opacity:0.90}
h3 {color:black;font-size:1.2rem;opacity:0.90}
h2 b, h3 b, h4 b {color:purple;}
h4 {color:slateblue;font-size:4vh;}

article {background-color:white;order:2;flex:100 1 ;min-width:270px;padding:0px 2%;font-size:18px;text-align: justify;}
article p#mtpic {display:none;}


nav {background-color:white;order:1;flex:1 100 412px; padding : 5px;}


footer,#togglemenuu, #togglemenuu a {background-color:lightgreen;order:4;text-align:center;padding:2px 0px;
background-image: -webkit-gradient(linear, left top, left bottom, from(#ff91ff), to(#97ded4));
 background-image: -webkit-linear-gradient(top, #ff91ff, #97ded4);
 background-image: -moz-linear-gradient(top, #ff91ff, #97ded4);
 background-image: -ms-linear-gradient(top, #ff91ff, #97ded4);
 background-image: -o-linear-gradient(top, #ff91ff, #97ded4);
 background-image: linear-gradient(to bottom, #ff91ff, #97ded4);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ff91ff, endColorstr=#97ded4);}
footer {
clear : both;
border-top : 1px solid #cecece;
text-align : center;
padding : 5px 10px;
color : #fff;
background-image : url(footerbg2.jpg);
font-family : "arial", helvetica, sans-serif;
font-size : 0.7em;
background-repeat : repeat-x;

}

nav ul, article ul {list-style:none;margin:0px;padding:0px;}


nav ul li a {display:block;text-decoration:none;font-size:18px;}

nav#topmenu ul  {display:flex ;margin:0px;padding:0px;}
nav#topmenu ul li {margin:0px;padding:0px;}
nav#topmenu ul li a {font-size:3vmin;}
 
a {cursor:pointer;}



#togglemenuu, #togglemenuu a {display:block;width:inherit;height:44px;background-color:mistyrose;text-align:center;margin:0px;vertical-align:middle;}

nav#topmenu ul li {
  background: #0000ff;
  background: -moz-linear-gradient(top, #0000ff 0%, #2a8a8f 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #0000ff), color-stop(100%, #2a8a8f));
  background: -webkit-linear-gradient(top, #0000ff 0%, #2a8a8f 100%);
  background: -o-linear-gradient(top, #0000ff 0%, #2a8a8f 100%);
  background: -ms-linear-gradient(top, #0000ff 0%, #2a8a8f 100%);
  background: linear-gradient(top, #0000ff 0%, #2a8a8f 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0000ff', endColorstr='#2a8a8f', GradientType=0);
  padding: 5px 10px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
}


nav#topmenu ul li:hover {background:  -moz-linear-gradient(top, #ffa500, #dd8322);
background:  -webkit-linear-gradient(top, #ffa500, #dd8322);
background:  -ms-linear-gradient(top, #ffa500, #dd8322);
 background-image: linear-gradient(to bottom,  #ffa500, #dd8322);}


nav#topmenu ul li a {color:white;}

nav ul li {width:100%;height:44px;line-height: 44px;vertical-align:middle;text-align:center;
border:1px solid #ffffff; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px; text-decoration:none; display:inline-block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);color: #FFFFFF;
 background-color: #ffc579; background-image: -webkit-gradient(linear, left top, left bottom, from(#ffc579), to(#fb9d23));
 background-image: -webkit-linear-gradient(top, #ffc579, #fb9d23);
 background-image: -moz-linear-gradient(top, #ffc579, #fb9d23);
 background-image: -ms-linear-gradient(top, #ffc579, #fb9d23);
 background-image: -o-linear-gradient(top, #ffc579, #fb9d23);
 background-image: linear-gradient(to bottom, #ffc579, #fb9d23);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ffc579, endColorstr=#fb9d23);
}

nav ul li:hover{
 border:1px solid #009913;
 background-color: #ffaf46; background-image: -webkit-gradient(linear, left top, left bottom, from(#ffaf46), to(#e78404));
 background-image: -webkit-linear-gradient(top, #ffaf46, #e78404);
 background-image: -moz-linear-gradient(top, #ffaf46, #e78404);
 background-image: -ms-linear-gradient(top, #ffaf46, #e78404);
 background-image: -o-linear-gradient(top, #ffaf46, #e78404);
 background-image: linear-gradient(to bottom, #ffaf46, #e78404);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ffaf46, endColorstr=#e78404);
}

 nav:not(#topmenu) ul li:first-child {
 background-color: #244eaf; background-image: -webkit-gradient(linear, left top, left bottom, from(#244eaf), to(#2b58b4));
 background-image: -webkit-linear-gradient(top, #244eaf, #2b58b4);
 background-image: -moz-linear-gradient(top, #244eaf, #2b58b4);
 background-image: -ms-linear-gradient(top, #244eaf, #2b58b4);
 background-image: -o-linear-gradient(top, #244eaf, #2b58b4);
 background-image: linear-gradient(to bottom, #244eaf, #2b58b4);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#244eaf, endColorstr=#2b58b4);

}


nav:not(#topmenu) ul li:last-child {background:tomato;background-color: #97ded4; 
background-image: -webkit-gradient(linear, left top, left bottom, from(#ff91ff), to(#97ded4));
 background-image: -webkit-linear-gradient(top, #ff91ff, #97ded4);
 background-image: -moz-linear-gradient(top, #ff91ff, #97ded4);
 background-image: -ms-linear-gradient(top, #ff91ff, #97ded4);
 background-image: -o-linear-gradient(top, #ff91ff, #97ded4);
 background-image: linear-gradient(to bottom, #ff91ff, #97ded4);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ff91ff, endColorstr=#97ded4);}

nav:not(#topmenu) ul li:nth-last-child(-n+1):hover {background:tomato;
background-color: #97ded4; 
background-image: -webkit-gradient(linear, left top, left bottom, from(#df71df), to(#77beb4));
 background-image: -webkit-linear-gradient(top, #df71df,#77beb4);
 background-image: -moz-linear-gradient(top, #df71df,#77beb4);
 background-image: -ms-linear-gradient(top, #df71df,#77beb4);
 background-image: -o-linear-gradient(top, #df71df,#77beb4);
 background-image: linear-gradient(to bottom,  #df71df,#77beb4);
 filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#df71df, endColorstr=#77beb4));}

nav#topmenu #flexible {padding: 0;text-align: center;display: -webkit-flex;display: flex;-webkit-flex-wrap: wrap;flex-wrap: wrap;}

nav#topmenu #flexible li {min-width: 8em;margin: 0em;padding: 0em;display: inline-block;/* non-flexbox browsers */-webkit-flex: 1 0;flex: 1 0;}


#leftbox { 
margin-top : 15px;
font-size:18px;
border : 1px solid #999999;
padding: 5px;
text-align: justify;
} 



table.Tablej {background-color:blue;margin: inherit; padding-top:0.2em; table-layout: inherit;border-radius: 5px;}
.Tablej td {padding:0.1em 0.6em;border-bottom:solid 1px;}
.Tablej th {background-color:#3333ff;border-top:solid 2px;padding:0.5em 1em;font-size:1.2em;color:white;border-bottom:solid 1px;}
.Tablej td:nth-child(odd) {font-weight:normal;background-color:blanchedalmond;border-top:solid 1px;}
.Tablej td:nth-child(odd) i {font-weight:normal;}
.Tablej td:nth-child(even) {background-color:ivory;border-bottom:solid 1px;}
.Tablej th.cap {display:flex 1;font-size:1.2em;padding:0.5em 1em;background-color:sandybrown;border-top:solid 2px navy;}

table.TableTr {table-layout: inherit;border-radius: 0px;color:#000000;}
.TableTr tr:nth-child(odd) {font-weight:normal;background-color:#e7e7e7;border-top:solid 0px;}
.TableTr tr:nth-child(odd):hover {background-color:#d7d7d7;}
.TableTr tr:nth-child(even):hover {background-color:#d7d7d7;}
.TableTr tr:nth-child(odd) i {font-weight:normal;}
.TableTr tr:nth-child(even) {background-color:ivory;border-bottom:solid 0px;}
.TableTr th {background-color:lightgrey;border-top:solid 0px;padding:0.5em 1em;font-size:1.2em;color:black;border-bottom:solid 0px;}
.TableTr th.cap {display:flex 1;font-size:1.2em;padding:0.5em 1em;background-color:sandybrown;border-top:solid 0px navy;}
.TableTr th:hover{background-color:none;}
.TableTr th:first-child{border-radius:5px 5px 5px 5px;}
.TableTr th:last-child{border-radius:5px 5px 5px 5px;}

table.TableVC {table-layout: inherit;border-radius: 0px;color:#000000;}
.TableVC tr:nth-child(odd) {font-weight:normal;background-color:#e7e7e7;border-top:solid 0px;}
.TableVC tr:nth-child(odd):hover {background-color:#d7d7d7;}
.TableVC tr:nth-child(even):hover {background-color:#d7d7d7;}
.TableVC tr:nth-child(odd) i {font-weight:normal;}
.TableVC tr:nth-child(even) {background-color:ivory;border-bottom:solid 0px;}
.TableVC th {background-color:white;border-top:solid 0px;padding:0.5em 1em;font-size:1.2em;color:black;border-bottom:solid 0px;}
.TableVC th.cap {display:flex 1;font-size:1.2em;padding:0.5em 1em;background-color:sandybrown;border-top:solid 0px navy;}
.TableVC th:hover{background-color:white;}
.TableVC th:first-child{border-radius:5px 5px 5px 5px;}
.TableVC th:last-child{border-radius:5px 5px 5px 5px;}

@media only screen and (min-width : 412px) and (max-width : 1000px) {
table.TablePhrases {font-size: 0.9rem;}
table.TablePhrases { display:block; }
table.TablePhrases tr { display:block; }
table.TablePhrases td { display:block; }
table.TablePhrases tbody { display:block; }
table.TablePhrases thead{ display:block; }
table.TablePhrases th { display:block; }
table.TablePhrases {width:100%;}
nav#topmenu ul li a {font-size:20px;}
}

@media only screen and (min-width : 120px) and (max-width : 411px) {
table.TablePhrases {font-size: 0.8rem;}
table.TablePhrases { display:block; }
table.TablePhrases tr { display:block; }
table.TablePhrases td { display:block; }
table.TablePhrases tbody { display:block; }
table.TablePhrases thead{ display:block; }
table.TablePhrases th { display:block; }
table.TablePhrases {width:100%;}
nav#topmenu ul li a {font-size:18px;}
}


@media only screen and (min-width : 120px) and (max-width : 411px) {
table.TableNarrow {font-size: 12px;}
}

@media only screen and (min-width : 120px) and (max-width : 1000px) {
table.TableNumbers {font-size: 0.9rem;}
table.TableNumbers { display:block; }
table.TableNumbers tr { display:block; }
table.TableNumbers td { display:block; }
table.TableNumbers tbody { display:block; }
table.TableNumbers thead{ display:block; }
table.TableNumbers th { display:block; }
table.TableNumbers {width:1%;}
}


@media only screen  and (max-width : 1000px) {
table.TableTrans {font-size: 0.9rem;}
}

@media only screen  and (max-width : 1000px) {
table.TableTr {font-size: 0.9rem;}
}

@media only screen  and (max-width : 1000px) {
h1 {font-size:1.6rem;}
}

@media only screen  and (max-width : 799px) {
h1 {font-size:1.4rem;}
h2 {font-size:1.2rem;}
h3 {font-size:1.1rem;}
}
@media only screen  and (max-width : 480px) {
h1 {font-size:1.2rem;opacity:0.85;}
h2 {font-size:1.1rem;}
h3 {font-size:1rem;}
}



@media only screen  and (max-width : 1000px) {
table.Tablej {font-size: 0.9rem;}
}
