﻿* 
{  /*make all the measurements include borders, padding wetx */
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/* #### Mobile Phones Portrait #### */
 @media screen and (max-device-width: 480px) and (orientation: portrait){
   /* some CSS here */
 }

 /* #### Mobile Phones Landscape #### */
 @media screen and (max-device-width: 640px) and (orientation: landscape){
   /* some CSS here */
 }

 /* #### Mobile Phones Portrait or Landscape #### */
 @media screen and (max-device-width: 800px){
body 
{
  /*  max-width: 1200px;*/
    font-family: Arial,helvetica,sans-serif;
    font-size: 2.0em;
    width: 1000px;
}

ul, ol
{
    padding-left: 20px;
    margin-left: 20px;
}

.header   /* Header wrapper */
{
    margin: 0px;
    padding: 0px;
    width: 100%;
}

.headerleft
{
    margin: 0px;
    padding-left: 50px;
    padding-top: 10px;
    float: none;
    width: 100%
}

.headerright
{
    margin: 0px;
    padding-top: 30px;
    padding-right: 0px;
    float: none;
    width: 100%;
}

.headertext
{
    text-align: center;
    width: 100%;
}

img.right   /* an image that floats right in its container */
{
    float: right;
}

img.left   /* an image that floats left in its container */
{
    float:left;
}

/* makes the image fill the column that it is in */
img.scale-with-grid 
{
	width: 100%;
	height: auto; 
}

/* Style the top Menu */

.topmenu
{
    clear: both;
    padding: 0px 0px 14px 8px;
    margin:0 auto;
}

.topmenu ul
{
    display:inline-block;
    list-style: none;
    margin-top: 0px;
    padding-left: 0px;
    width: auto;
}

.topmenu li
{
    display: inline-block;
    padding-left: 15px;
   /* color: Red; */
}
.topmenu li a
{
    text-decoration:none;
    font-size: 1.2em;
    font-weight: 400;
    /*border-right: 1px;*/
    color: #a30000;
}

/*.topmenu select {
  display: none;
}*/

/*-- style three column page 
.maintext3column
{
    width: auto;
    float: none;
    margin-left:1%;
    margin-right:1%
}*/

.sidebarleft
{
    
    width:auto;
    float:none;
    margin-left:1%;
    margin-right:1%
}
.sidebarright
{
    width:auto;
    float: none;
    margin-left:1%;
    margin-right:1%
}


/*-- style two column page */
.maintext2column
{
   /* background-color:Green;*/
    width: 100%;
    padding-left:0px;
   /* float: left;*/
}

/*== style a 4 column page */
.fourcolumncol1
{
    width: 25%;
    float:none;
}

.fourcolumncol2
{
    width: 25%;
    float: none;
}

.fourcolumncol3
{
    width:30%;
    float:none;
}

.fourcolumncol4
{
    width: 20%;
    float: none;
}

.footer
{
    clear: both;
    margin: 0px;
    padding: 0px;
    width: 100%;
    text-align: center; 
    margin-top: 50px;   
}
.clear
{
    clear: both;
}

h1, h2, h3, h4 {
    font-weight: bold;
}

h1 {
    font-size: 1.6em;
}

h2 
{
    font-size: 1.5em;
}
h3 
{
    font-size: 1.2m;
}
h4 
{
    font-size: 1.0em;
}

/*#selectmenu
{
      display: none;
}*/
 }
 

 /* #### iPhone 4+ Portrait or Landscape #### */
/* @media screen and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2){
 }*/

 /* #### Tablets Portrait or Landscape #### */
/* @media screen and (min-device-width: 768px) and (max-device-width: 1024px){
  }*/
  
   
 /* #### Desktops #### */
 
/* @media screen and (min-width: 1024px){
}*/   
body 
{
    max-width: 1200px;
    font-family: Arial,helvetica,sans-serif;
    font-size:1.0em;
    width: 100%;
}

ul, ol
{
    padding-left: 20px;
    margin-left: 20px;
}

.header   /* Header wrapper */
{
    margin: 0px;
    padding: 0px;
    width: 100%;
}

.headerleft
{
    margin: 0px;
    padding-left: 50px;
    padding-top: 10px;
    float: left;
    width: 50%
}

.headerright
{
    margin: 0px;
    padding-top: 30px;
    padding-right: 50px;
    float: right;
    width: 50%;
}

.headertext
{
    text-align: center;
    width: 100%;
}

img.right   /* an image that floats right in its container */
{
    float: right;
}

img.left   /* an image that floats left in its container */
{
    float:left;
}

/* makes the image fill the column that it is in */
img.scale-with-grid 
{
	width: 100%;
	height: auto; 
}

/* Style the top Menu */

.topmenu
{
    clear: both;
    padding: 0px 0px 14px 8px;
    margin:0 auto;
}

.topmenu ul
{
    display:inline-block;
    list-style: none;
    margin-top: 0px;
    padding-left: 50px;
    width: auto;
}

.topmenu li
{
    display: inline-block;
    padding-left: 15px;
   /* color: Red; */
}
.topmenu li a
{
    text-decoration:none;
    font-size: 1.2em;
    font-weight: 400;
    border-right: 1px;
    color: #a30000;
}

.topmenu select {
  display: none;
}

/*-- style three column page */
.maintext3column
{
    width: 31%;
    float: left;
    margin-left:1%;
    margin-right:1%
 /*   background-color:Green;*/
}

.sidebarleft
{
    
    width:31%;
    float:left;
    margin-left:1%;
    margin-right:1%
}
.sidebarright
{
    width:31%;
    float: right;
    margin-left:1%;
    margin-right:1%
}

/*-- style one centre column page */
.maintextonecentrecolumn
{
    width: 65%;
    float: left;
    margin-left:1%;
    margin-right:1%;
 /*   background-color:Green;*/
}

.sidebarleftonecentrecolumn
{
    
    width:15%;
    float:left;
    margin-left:1%;
    margin-right:1%;
  /*  background-color:Yellow;*/
}

.sidebarrightonecentrecolumn
{
    width:10%;
    float: right;
    margin-left:1%;
    margin-right:1%;
   /* background-color:Blue;*/
}


/*-- style two column page */
.maintext2column
{
   /* background-color:Green;*/
    width: 60%;
    padding-left:30px;
   /* float: left;*/
}

/*== style a 4 column page */
.fourcolumncol1
{
    width: 25%;
    float:left;
}

.fourcolumncol2
{
    width: 25%;
    float: left;
}

.fourcolumncol3
{
    width:30%;
    float:left;
}

.fourcolumncol4
{
    width: 20%;
    float: right;
}

.footer
{
    clear: both;
    margin: 0px;
    padding: 0px;
    width: 100%;
    text-align: center; 
    margin-top: 50px;   
}
.clear
{
    clear: both;
}

h1, h2, h3, h4 {
    font-weight: bold;
}

h1 {
    font-size: 1.4em;
}

h2 
{
    font-size: 1.0em;
}
h3 
{
    font-size: 0.8m;
}
h4 
{
    font-size: .8em;
}

/*#selectmenu
{
      display: none;
}*/
    
