@media screen and (min-width: 641px) {

body {
margin:0; 
padding:0; 
font-family:Helvetica, Arial,Verdana,sans-serif;
color: #000;
background-color: #f2f7fc;
font-size: 100%
}
a{
color: #00f;
}
a:hover {
background-color:yellow;
}
h1 {
font-family:Helvetica, Verdana,sans-serif;
color: #000;
font-weight: normal;
font-size: 2em;
text-shadow: 2px 2px #CCC;
}

h2 {
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
color: #000;
text-shadow: 2px 2px #CCC;
}


div#wrapper {
margin:0 auto;
width:100%;
background-color: #FFF;
margin-bottom: 20px;
}
div#header {
background: transparent url(/images/bluesky.jpg) repeat-x 0 0;
overflow: hidden;
}
div#header .fn {
margin: 0;
}
div#header .org {
margin: 1px 0 0 0;
}
div#header .adr{
margin: 0 0 8px 0;
}
.contact-info {
font-size: 110%;
}
.vcard {
background-color:#fff; /* e7f1ff */
margin: 8px;
padding: 8px;
box-shadow: 4px 4px #ddd;
float: left;
height: auto;
width: 560px;
}

div#face {
float: left;
margin: 5px 10px 5px 5px;
height: 200px;
}
#face img {
box-shadow: 4px 4px #ddd;
}

div#hcard-Patricia-Mozgai-Lupo h1 {
margin:0 0 10px 0;
padding: 0;
}
div#hcard-Patricia-Mozgai-Lupo h1 span {
font-size: 50%;
}
div#logoimage {
float: right;
margin: 5px;
}
#logoimage img {
width: 250px;
height: 76px;
box-shadow: 4px 4px #ddd;
margin-left: 8px;
}
div#content {
padding: 5px 5px 5px 20px;

}
p#whoiam {
font-size:150%;
padding: 2px 40px 2px 40px;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
text-shadow: 1px 1px #ddd;
}

div#left {
width: auto;
}

div#right {
float:right;
width:50%;
margin-top:50px;
}

#right img {
box-shadow: 4px 4px #ddd;
}

div#promos {
color: #000;
background-color: #FFF;
padding: 8px;
line-height:160%;
min-height:50px;
border-bottom: 1px solid #CCC;
border-top: 2px solid #CCC;
}


ul.resources {
width:360px;
}

div#footer{
text-align: center;
font-size: 80%;
height: 150px;
}

iframe.listings {
border:1px solid gray; 
width:96%; 
height:640px; 
background-color:#FFF
}


}  /* end Desktop */

@media screen and (max-width: 640px){

body {
margin:0; 
padding:0; 
font-family:Helvetica, Arial,Verdana,sans-serif;
color: #000;
background-color: #f2f7fc;
font-size: 100%
}
a{
color: #00f;
}
a:hover {
background-color:yellow;
}
h1 {
font-family:Helvetica, Verdana,sans-serif;
color: #000;
font-weight: normal;
font-size: 2em;
text-shadow: 2px 2px #CCC;
}

h2 {
font-family:Helvetica, Verdana,sans-serif;
color: #000;
text-shadow: 2px 2px #CCC;
}

div#wrapper {
width:100%;
background-color: #FFF;
margin-bottom: 20px;
}
div#header {
background: transparent url(/images/bluesky.jpg) no-repeat 0 0;
overflow: hidden;
border-bottom: 1px solid #EEF;
}
div#header .fn {
margin: 0;
}
div#header .org {
margin: 8px 0 0 0;
}
div#header .adr{
margin: 0 0 8px 0;
}
.contact-info {
font-size: 110%;
}
.vcard {
background-color:#fff;
margin: 8px;
padding: 8px;
box-shadow: 4px 4px #ddd;
height: auto;
}

div#face {
float: left;
margin: 5px 10px 5px 5px;
width: 82px;
height: 210px;
}
div#face img{
width: 82px;
height: 99px;
box-shadow: 4px 4px #ddd;
}

div.vcard h1 {
margin:0 0 10px 0;
padding: 0;
font-size: 120%;
}
div#logoimage {
display:none;
}
#logoimage img {
width: 250px;
height: 76px;
}
div#content {
padding: 10px;
}

div#left {
width: auto;
}

div#right {
display: none;
}

div#promos {
color: #000;
background-color: #FFF;
padding: 8px;
line-height:160%;
min-height:50px;
border-bottom: 1px solid #CCC;
border-top: 2px solid #CCC;
}

ul.resources {
width:90%;
}

div#footer{
text-align: center;
font-size: 80%;
}

iframe.listings {
border:1px solid gray; 
width:95%; 
height:640px; 
background-color:#FFF
}

} /* end Mobile */