@charset "utf-8";
/* CSS Document */
#wrapper{
max-width:1300px;
margin: 0 auto;
}

#header{
position:relative;
background-image: url(../images/graffittiheader.png);
background-repeat: no-repeat;
width:100%;
height:171px;
}

#artthumbs {
width:800px;
text-align:justify;
padding:20px;
}

#artthumbs img {
text-align:justify;
border:0px;
margin: 2px;
width:40px;
height:82px;
}

body{
background-color: #f5dd7e;
background-image: url(../images/retrogrungesbgstrip.png);
background-repeat: repeat;
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
font-size: 16px;
letter-spacing: 2px;
line-height: 19px;
color: #000;
}

a:link{
color:#0db2ac;
font-family:  Tahoma, Verdana, Segoe, sans-serif;
font-size: 16px;
letter-spacing:2px;
line-height: 19px;
font-weight: bold;
font-variant: normal;
text-decoration: none;
}

a:active{
color:#0db2ac;
font-family:  Tahoma, Verdana, Segoe, sans-serif;
font-size: 16px;
letter-spacing:2px;
line-height: 19px;
font-weight: bold;
font-variant: normal;
text-decoration: none;
}

a:visited{
color:#0db2ac;
font-family:  Tahoma, Verdana, Segoe, sans-serif;
font-size: 16px;
letter-spacing:2px;
line-height: 19px;
font-weight: bold;
font-variant: normal;
text-decoration: none;
}


a:hover{
color:#fc694d;
font-family:  Tahoma, Verdana, Segoe, sans-serif;
font-size: 16px;
letter-spacing:2px;
line-height: 19px;
font-weight: bold;
font-variant: normal;
text-decoration: none;
}

.menubox{
width:300px;
border-radius:5px;
background-color:rgba(255,255,255,0.70);
float:left;
margin-left: 20px;
margin-top: 50px;
}

.menubox a:link{
padding: 10px;
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 18px;
line-height: 22px;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#0db2ac;
}

.menubox a:active{
padding: 10px;
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 18px;
line-height: 22px;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#0db2ac;
}

.menubox a:visited{
padding: 10px;
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 18px;
line-height: 22px;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#0db2ac;
}

.menubox a:hover{
padding: 10px;
font-family:"Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 18px;
line-height: 22px;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#fc694d;		
}

.jumplink a:link{
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 10px;
line-height: 14px;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#fc694d;
}

.jumplink a:active{
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 10px;
line-height: 14px;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#fc694d;
}

.jumplink a:visited{
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 10px;
line-height: 14px;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#fc694d;
}

.jumplink a:hover{
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 10px;
line-height: 14px;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#0db2ac;
}

.contentbox{
width:900px;
border-radius:5px;
background-color:rgba(255,255,255,0.70);
float:right;
padding: 20px;
margin-right: 30px;
margin-top: 50px;
}


h3{
font-family:"Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 26px;
letter-spacing: 4px;
line-height: 24px;
color:#0db2ac;
font-variant: normal;
text-decoration: none;
font-weight: lighter;
margin: 10px;
}

h2{
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 24px;
letter-spacing: 2px;
line-height: 22px;
color:#fc694d;
font-variant: normal;
text-decoration: none;	
font-weight: lighter;
margin: 10px;
}

.credit{
background-image:url("../images/creditimageseven.png");
background-repeat: no-repeat;
width:400px;
height:52px;
margin:0,auto;
clear:both;
}



@media only screen and (max-width: 768px) {
	
#header{
position:relative;
background-image:url( "../images/minigraffittiheader3.png");
width:70%;
height:53px;
}	

#artthumbs {
width:auto;
text-align:justify;
padding:1.250em;
}

#artthumbs img {
text-align:justify;
border:0em;
margin: 0.125em;
width:40px;
height:82px;
}
	
	
body{
background-color: #f5dd7e;
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
font-size: 1em;
letter-spacing:0.125em;
line-height: 1.188em;
color: #000;
}

a:link{
color:#0db2ac;
font-family:  Tahoma, Verdana, Segoe, sans-serif;
font-size: 1em;
letter-spacing:0.125em;
line-height: 1.188em;
font-weight: bold;
font-variant: normal;
text-decoration: none;
}
	
a:active{
color:#0db2ac;
font-family:  Tahoma, Verdana, Segoe, sans-serif;
font-size: 1em;
letter-spacing:0.125em;
line-height: 1.188em;
font-weight: bold;
font-variant: normal;
text-decoration: none;
}
	
a:visited{
color:#0db2ac;
font-family:  Tahoma, Verdana, Segoe, sans-serif;
font-size: 1em;
letter-spacing:0.125em;
line-height: 1.188em;
font-weight: bold;
font-variant: normal;
text-decoration: none;
}

a:hover{
color:#fc694d;
font-family:  Tahoma, Verdana, Segoe, sans-serif;
font-size: 1em;
letter-spacing:0.125em;
line-height: 1.188em;
font-weight: bold;
font-variant: normal;
text-decoration: none;
}

.menubox{
width:auto;
border-radius:0.313em;
background-color:rgba(255,255,255,0.70);
float:left;
margin-left: 1.250em;
margin-top: 3.125em;
}

.menubox a:link{
padding: 0.625em;
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 1.125em;
line-height: 1.375em;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#0db2ac;
}

.menubox a:active{
padding: 0.625em;
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 1.125em;
line-height: 1.375em;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#0db2ac;
}	
	
.menubox a:visited{
padding: 0.625em;
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 1.125em;
line-height: 1.375em;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#0db2ac;
}	
	
.menubox a:hover{
padding: 0.625em;
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 1.125em;
line-height: 1.375em;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#fc694d;		
}

.jumplink a:link{
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 0.625em;
line-height: 0.875em;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#fc694d;
}

.jumplink a:active{
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 0.625em;
line-height: 0.875em;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#fc694d;
}	
	
.jumplink a:visited{
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 0.625em;
line-height: 0.875em;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#fc694d;
}	
	
.jumplink a:hover{
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 0.625em;
line-height: 0.875em;
font-variant: normal;
text-decoration: none;
font-weight:lighter;
color:#0db2ac;
}
	
	
.contentbox{
width:auto;
border-radius:0.313em;
background-color:rgba(255,255,255,0.70);
float:right;
padding: 1.250em;
margin-right: 1.875em;
margin-top: 3.125em;
}
	

h3{
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 1.625em;
letter-spacing: 0.250em;
line-height: 1.500em;
color:#0db2ac;
font-variant: normal;
text-decoration: none;
font-weight: lighter;
margin: 0.625em;
}

h2{
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 1.500em;
letter-spacing: 0.125em;
line-height: 1.375em;
color:#fc694d;
font-variant: normal;
text-decoration: none;	
font-weight: lighter;
margin: 0.625em;   
}

.credit{
background-image: url("../images/creditimageseven.png");
background-repeat: no-repeat;
width:auto;
margin:0,auto;
clear:both;
}

}