/*********************** 
general styling
************************/
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

body { margin: 0; font-size: 16px; line-height: 1.25; background-color: #fffded}

body, button, input, select, textarea { font-family:Georgia, "Times New Roman", Times, serif; color: #000; }

a { color:#840045; }
a:visited { color:#840045; }
a:hover { color:#840045; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }

html { font-size: 100%; overflow-y: auto; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

/*********************** 
important for easy em usage
************************/
body { font-size: 80%; }


/*********************** 
our mobile-first styles
************************/
[role="main"] {
    float:left;
    width:100%;
}
#container {
    width:100%;
    margin:0 auto;
    max-width: 700px;
    position:relative;
}
#inner-wrap {
    -webkit-box-shadow: 0 0 0 0 transparent;
    -moz-box-shadow: 0 0 0 0 transparent;
    box-shadow: 0 0 0 0 transparent;
    float:left;
    padding:2em 1em;
}
.col-one header {
    float:none;
    width:80%;
    white-space: nowrap;
}
header h2,
article h2 {
    color:#840045;
}
header h1,
header h2 {
    margin: 0;
    font-weight:normal;
	color:#840045;
}   

header h1 {
    font-size: 2.5em;
    margin-bottom:-0.1em;
}
header h2 {
    font-size: 2em;
	margin-bottom: .75em;
}

article h2 {
	font-size: 1.2em;
	margin-bottom:-0.1em;
	color: #840045;
}

article hgroup {
    float:left;
    width:100%;
}
article hgroup * {
        margin:0;
        padding:0;
    }

dl {
    clear:left;
    margin: 0 0 1em;
}

dt {
    text-align:left;
    width:100%; 
    float:left;
    text-align:left;
    font-style:italic;
    clear:left;
	color:#6c575a;
}
dd {
    margin:0;
}
.col-one {
    float:none;
    width:auto;
    clear:left;
}

    .col-one article {
        float:right;
        clear:left;
        margin-bottom:1em;
		margin-top: 1em;
		
     }
    #contact-info {
        margin-bottom:.5em;
        float:left;
        width:100%;
    }
    #contact-info dd {
        float:left;
        width: 79.5361%;
    }
    .col-one > div {
        padding: 0;
    }
   
#pic {
    position:absolute;
    top:0;
    right:0;
}
/*********************** 
these styles will override
our mobile-first styles for
larger displays
************************/
@media only screen and (min-width: 520px) {
  /* Style adjustments for viewports 520px and over go here */
    .col-one {
        float:left;
        width: 85%;
    }
    .col-one header {
        float:right;
   }
    
    dt {
        text-align:right;
        width: 15.4639%;
    }
    #contact-info dd {
        float:right;
    }
	
	.col-one article {
		float: right;
		width: 79.5361%;
	}
    article hgroup {
        float: right;
        width: 79.5361%;
    }
    #inner-wrap {
        -webkit-box-shadow: 0 0 3px 2px #ccc;
        -moz-box-shadow: 0 0 3px 2px #ccc;
        box-shadow: 0 0 3px 2px #ccc;
    }
    
    #pic {
        top: 1.5em;
        right: 1em;
    }
 
}