/***1101+ px-------------------------
 --------------------------------***/


/***main container--------------
----------------------------***/
main {
    position:absolute;
    margin-top:5em;
    height:100%;
    width:100%;
    float:left;
}

/***intro image & links --------
----------------------------***/
#about-links{
	width:100%;
	display:block;
	margin-top:12em;
	padding-bottom:2em;
	border-bottom:1px solid;
	text-align:center;
}
#about-links li{
    display:inline-block;
    font-size:1.4em;
	margin:.25em .25em .25em .25em;
	padding:.05em .15em .05em .15em;
	background-color:#212121;
}
#about-links li a:link, #about-links li a:visited{
    color:white;
    font-family:nexa, Ariel, Helvetica, Sans-serif;
    margin:0 1em 0 1em;
    text-decoration:none;
}
#about-links li a:focus, #about-links li a:hover, #about-links li a:active{
    color:#b6b7b7;
}
.aboutimg{
	float:left;
    position:relative;
	text-align:center;
	border-bottom:.25em solid;
	border-bottom-color:rgba(230,230,230,.5);
}
.aboutimg img{
	display:block;
    width:100%;
    max-width:100%;
	height:100%;
	max-height:60em;
	border:0;
}
.aboutimg-mobile, .aboutimg-mobile img{
        display:none;
}

/*** article & content ---------
----------------------------***/
article{
	float:left;
	padding:1em 3em 1em 3em;
	background-color:white;
}
article+article{
	margin-top:1em;
}
article h3{
	font-family:nexa, Helvetica, Arial, Sans-serif;
	font-size:3em;
	letter-spacing:.12em;
	word-spacing:.2em;
}
article p{
	padding:.5em 0 .5em 0;
	font-family: nexa, Helvetica, Arial, Sans-serif;
	font-size:1.5em;
	color:#212121;
	letter-spacing:.04em;
	word-spacing:.025em;	
}
article p a:link, article p a:visited{
	color:#9e9e9e;
	text-decoration:none;
}
article p a:focus, article p a:hover, article p a:active{
	color:#212121;
}
article ul{
	padding:1em 0 0 3em;
}
article ul li{
	list-style-type:cricle;
	font-family: nexa, Helvetica, Arial, Sans-serif;
	font-size:1.5em;
    list-style-type:circle;
}

/***1100px----------------------------------
----------------------------------------***/
@media screen and (max-width:1100px){

}


/***760px-----------------------------------
----------------------------------------***/
@media screen and (max-width:760px){

/*** links ---------------------------------
----------------------------------------***/
#about-links{
	margin-top:11em;
}
#about-links li{
    font-size:1.2em;
	margin:.15em .15em .15em .15em;
	padding:.025em .05em .025em .05em;
}
/*** article & content ---------
----------------------------***/
article{
	padding:1em 2em 1em 2em;	
}
article h3{
	font-size:2.5em;
}
article p{
	font-size:1.25em;
	letter-spacing:.04em;
	word-spacing:.025em;	
}
article ul li{
	font-size:1.25em;
}

}


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


/***intro image & text----------
----------------------------***/
.aboutimg-mobile{
	display:block;
	float:left;
	position:relative;
	text-align:center;
	border-bottom:.25em solid;
	border-bottom-color:rgba(230,230,230,.5);
	width:100%;
	max-width:100%;
	height:100%;
	max-height:25em;
	overflow:none;
	margin:-1em 0 1em 0;
}
.aboutimg-mobile img{
	display:block;
	height:100%;
	width:100%;
	max-width:100%;
	max-height:25em;
	border:0;
}
.aboutimg, .aboutimg img{
	display:none;
}


/*** article & content ---------
----------------------------***/
article{
	padding:0 .5em 0 .5em;
	margin-bottom:1em;
}
article h3{
	font-size:1.5em;
}
article p{
	font-size:1em;
}
article ul li{
	font-size:1em;
}


}


/***320px-----------------------------------
----------------------------------------***/
@media screen and (max-width:320px){

/*** links ---------------------------------
----------------------------------------***/
#about-links{
	margin-top:10em;
}
#about-links li{
    font-size:1em;
	
}

/*** article & content ---------
----------------------------***/
article{
	padding:0 1.5em 0 1.5em;
}
article ul{
	padding:1em 0 0 1em;
}

}