@charset "UTF-8";
/* CSS Document */
.see-big {
display:inline;
}
.see-tiny {
display:none;
}
@media screen and (min-width: 900px) and (max-width: 1280px) 
{
        /* Most smartphones in landscape mode (Holding a smartphone on its side) */

.see-big {
display:inline;
}
.see-tiny {
display:none;
}

#wrapper {
width: 100%;
margin:auto;
border-left:none;
border-right:none;
        }




.columnleft-half {
float:left;
padding-left:3%;
padding-right:3%;
width:44%;
min-height:5em;
}








        /* place the rest of your css here */
    }

@media screen and (min-width: 700px) and (max-width: 899px) 
{
        /* Most smartphones in landscape mode (Holding a smartphone on its side) */

.see-big {
display:inline;
}
.see-tiny {
display:none;
}

#wrapper {
width: 100%;
margin:auto;
border-left:none;
border-right:none;
        }


#branding{
position:relative;
width:100%;
height:185px;
}


.menu a,
.menu a:link,
.menu a:visited{
text-decoration:none;
color: #999;
display:block;
padding-left:1.4em;
padding-right:1.1em;
text-align:center;
outline-style:none;
letter-spacing:0.02em;
line-height:2.4em;
}

.columnleft-half {
float:left;
padding-left:3%;
padding-right:3%;
width:44%;
min-height:5em;
}

.columnleft-quarter {
float:left;
width:44%;
min-height:3em;
}

.columnleft-three-quarter {
float:left;
width:44%;
padding-left:3%;
padding-right:3%;
min-height:6em;
}

#footer {
width:100%;
font-size:13px;
/*border-top:#eee thin solid;*/
border-bottom:#eee thin solid;
height:20em;
background-color: #55627d;/*darker-matt*/
background-color:#000000;
color: #CCC;
}





        /* place the rest of your css here */
    }



@media screen and (min-width: 300px) and (max-width: 699px) {
        /* Most smartphones in landscape mode (Holding a smartphone on its side) */
.see-big {
display:none;
}
.see-tiny {
display:inline;
}

#wrapper {
width: 100%;
margin:auto;
border-left:none;
border-right:none;
        }

#branding{
position:relative;
width:100%;
height:185px;
}

.branding-top{
font-weight:normal;
width:98%;
height:4.0em;
padding-left:2%;
}



.branding-top h1{
margin-left:2%;
font-size:120%;
letter-spacing:0.06em;
line-height:1.1em;
}

.branding-top h2{
font-size:90%;
letter-spacing:0.06em;
line-height:1.1em;
text-align:center;
}

.branding-below a{
border-bottom:#CCCCCC thin solid;
}
.menu{
font-size:18px;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
background-color:#ffffed;
height:2.6em;
background-color:#ebeffc;/*blueish*/
background-color:#f8f4e5;/*cream*/
border-bottom:#CCCCCC thin solid;
}

.menu li{
width:50%;
}

.menu a,
.menu a:link,
.menu a:visited{
text-decoration:none;
color: #000;
display:block;
padding-left:1.5em;
padding-right:0.5em;
text-align:center;
outline-style:none;
letter-spacing:0.04em;
line-height:2.0em;


}





.columnleft-quarter {
float:left;
width:95%;
min-height:3em;
}

.columnleft-three-quarter {
float:left;
width:95%;
padding-left:3%;
padding-right:3%;
min-height:6em;
}

.columnleft-third {
padding-left:2%;
padding-right:2%;
width:98%;
min-height:3em;
}

.columnleft-two-third {
padding-left:2%;
padding-right:2%;
width:98%;
min-height:3em;

}

.columnleft-half {
padding-left:2%;
padding-right:2%;
width:96%;
min-height:3em;
}


.columnleft-fifth {
float:left;
padding-left:2%;
padding-right:2%;
width:96%;
min-height:5em;
}


.columnleft-fifth p a{
outline-style:none;
text-decoration:none;
color: #fff;
}

.columnleft-four-fifths {
float:left;
padding-left:2%;
padding-right:2%;
width:96%;
min-height:5em;
}


#footer {
width:100%;
font-size:13px;
/*border-top:#eee thin solid;*/
border-bottom:#eee thin solid;
height:20em;
background-color: #55627d;/*darker-matt*/
background-color:#000000;
color: #CCC;
}








        /* place the rest of your css here */
    }