*{
	-webkit-transition:all .5s ease;
	-moz-transition:all .5s ease;
	-o-transition:all .5s ease;
	transition:all .5s ease;
}
@media all and (min-width:750px){

/* Overall Site Css */

body { 
	background-color:black;
	display: block;	
	position: static;
	background-image: url(images/back_1.png);
	background-size:cover;
	background-repeat: round;
	background-size: 100%;
	height: 100%;
	width: 100%;
}

body header {
	position:inherit;
	display: block;
	width: 90%;
	height: 400px;
	margin-bottom: -5%;
	margin-left: 4%;
	margin-top: 3%;
	background-image: url(images/vs_logo-01.png);
	background-repeat: no-repeat;
	background-size:contain;
	background-position: center;
}

h2 {
	font-size: 20pt;
	color: white;
	text-align: center;
	margin-top: 3%;
	font-family: 'Metamorphous', cursive;
}

nav h2 {
	font-family: 'Metamorphous', cursive;

}
footer{
	display: list-item;
	position: relative;
	color: whitesmoke;
}
footer nav ul li{
	display: inline-block;
	width: 15%;
	color: azure;
	margin: 5% 1% 0% 3%;
	padding: 2% 0% 0% 0%;
	text-align: center;
	position: static;
	
}
footer nav ul li a{
	display: inline-block;
	font-size: 25px;
	color: azure;
	text-align: center;
	position: static;
	
}

	
/* Home Page Css */

#home_text p { 
	display: block;
	position: relative;
	text-align: center;
	height: 200px;
	max-height: 200px;
	padding-right: 15%;
	padding-left: 15%;
	margin-top: 5%;
	font-size: 28px ;
	color: white;
	font-family: 'Didact Gothic', sans-serif;

}

#slideshow {
	position: relative;
align-content: center;
	width: 1000px;
	height: auto;
	margin: 0 auto;

transform: scale(.8);
	
}
#slideshow object{
	width: 80%;
	
}
/* Paintings Page Css */

#gallery1 ul li{
	background: rgba(0, 0, 0, 0);
	align-content: center;}
#gallery1 ul li img{
	
	border: groove gold 20px;
	background-color: black;
	align-content: center;
	width: 50%;
	margin-left: 18%;
	margin-top: 5%;
	padding:5%;
	transform: scale(1.0);
}
#gallery1 ul li img:hover {
transform: scale(1.35);
}

/* Pen & Ink Page Css */
#gallery2 ul li{
	background: rgba(0, 0, 0, 0);
	border: groove rgba(0, 0, 0, 0) 20px;
	align-content: center;
}
#gallery2 ul li img{
	
	border: groove gold 20px;
	background-color: black;
	align-content: center;
	width: 50%;
	margin-left: 19%;
	margin-top: 2%;
	padding:5%;
	transform: scale(.9);
}
#gallery2 ul li img:hover {
transform: scale(1.5);
}



/* About Me Page Css */
#about_text{
	text-align: center;
	font-size: 28px;
	font-size: 28px;
	color: white;
	font-family: 'Didact Gothic', sans-serif;
	margin-left: 25%;
	margin-right: 25%;
}
#selfie img{
	transform: rotate(90deg);
	width: 25%;
	margin-left: 37%;
	margin-top: 1%;
	transform: scale()
}

/* Contact Page Css */
#contact_pics ul{
	display:inline-block;
	position:inherit;
	margin-top: 3%;
	margin-left: 5%;
	width: 100%;
	column-count: 3;
}
#contact_pics ul li{
	position:inherit;
	margin: 0% 0% 0% 0%;
	
	max-height: 440px;
	

}
#contact_pics ul li img{ 

transform: scale(1.0);
	
}
/* Navigation Css */

.dropbtn {
   	display: block;
	background-color: rgba(0, 0, 0, 0.71);
    color: #ffffff;
	width:100%; 
    padding-top: 5px;
	padding-bottom: 5px;
	margin: auto;
    font-size: 36px;
    border: groove 10px gold;
	margin-top: 5%;
	font-family: 'Metamorphous', cursive;
	position: static;

}

.dropdown {
	width: 100%;
	background-image: url(images/nav_background.jpg);
	background-repeat: repeat;
	background-size:cover;
	background-position: top;
	position:relative;
}


.dropdown-content {
	display: none;
    position: relative;
	background-color: white;
	background-image: url(images/nav_background2.jpg);
	background-repeat: repeat;
	background-size:100%;
	background-position: center;
	background-color: rgb(255, 255, 255);
    color: #ffffff;
	width:100%;
    font-size: 28px;
    border: groove 10px rgb(0, 0, 0);
	
	
}


.dropdown-content a {
	display: inline-block;
	background-color: rgba(0, 0, 0, 0.46);
    color: #ffffff;
	width:100%;
    padding-top: 1%;
	padding-bottom: 1%;
	padding-right: 5%;
		padding-left: -5%;
	text-align: center;
	font-family: 'Didact Gothic', sans-serif;
    text-decoration: none;

}


.dropdown-content a:hover {
	background-color: #000000;
 
}


.dropdown:hover .dropdown-content {
    display:block;
	
}


.dropdown:hover .dropbtn {
    background-color: rgba(0, 0, 0, 0.47);
	color: #ffffff;
}

	/*Contact Form Css */


.container {
	max-width:800px;
	width:100%;
	height: 500px;
	margin:0 auto;
	position:relative;
}

#contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea, #contact button[type="submit"] { font-family: 'Didact Gothic', sans-serif;}

#contact {
	background:#F9F9F9;
	background-image: url(images/nav_background.jpg);
	padding:25px;
	margin:0px 0;
	border: gold groove 10pt
}

#contact h3 {
	color: #000000;
	display: block;
	text-align: center;
	font-size: 30px;
	font-weight: 400;
}

#contact h4 {
	margin:5px 0 15px;
	display:block;
	font-size:13px;
}

fieldset {
	border: medium none !important;
	margin: 0 0 10px;
	min-width: 100%;
	padding: 0;
	width: 100%;
}

#contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea {
	
	width:100%;
	border:1px solid #ffffff;
	background:#FFF;
	margin:0 0 5px;
	padding:10px;
}


}

#contact textarea {
	height:100px;
	max-width:100%;
  resize:none;
}

#contact button {
	cursor:pointer;
	width:100%;
	border:none;
	background:#000000;
	color:#FFF;
	margin:0 0 5px;
	padding:10px;
	font-size:20px;
}

#contact button:hover {
	background:gold;
	}

#contact button{ 
	box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.5); }

#contact input:focus, #contact textarea:focus {
	outline:0;
	border:1px solid #999;
}


@media all and (max-width:750px){
	/* Overall Site Css */

body { 
	background-color:black;
	display: block;	
	position: static;
	background-image: url(images/back_1.png);
	background-size:cover;
	background-repeat: round;
	background-size: 100%;
	height: 100%;
	width: 100%;
}

body header {
	position:inherit;
	display: block;
	width: 90%;
	height: 400px;
	margin-bottom: -5%;
	margin-left: 4%;
	margin-top: 3%;
	background-image: url(images/vs_logo-01.png);
	background-repeat: no-repeat;
	background-size:contain;
	background-position: center;
}

h2 {
	font-size: 20pt;
	color: white;
	text-align: center;
	margin-top: 3%;
	font-family: 'Metamorphous', cursive;
}

nav h2 {
	font-family: 'Metamorphous', cursive;

}
footer{
	display: list-item;
	position: relative;
	color: whitesmoke;
}
footer nav ul li{
	display: inline-block;
	width: 15%;
	color: azure;
	margin: 5% 1% 0% 3%;
	padding: 2% 0% 0% 0%;
	text-align: center;
	position: static;
	
}
footer nav ul li a{
	display: inline-block;
	font-size: 25px;
	color: azure;
	text-align: center;
	position: static;
	
}

	
/* Home Page Css */

#home_text p { 
	display: block;
	position: relative;
	text-align: center;
	height: 200px;
	max-height: 200px;
	padding-right: 15%;
	padding-left: 15%;
	margin-top: 5%;
	font-size: 28px ;
	color: white;
	font-family: 'Didact Gothic', sans-serif;

}

#slideshow {
	width: 600px;
	height: auto;
	margin: 0 auto;
	margin-left: -15%;

transform: scale(.6);
	
}
#slideshow object{
	width: 80%;
	
}
/* Paintings Page Css */

#gallery1 ul li{
	background: rgba(0, 0, 0, 0);
	align-content: center;}
#gallery1 ul li img{
	
	border: groove gold 20px;
	background-color: black;
	align-content: center;
	width: 50%;
	margin-left: 18%;
	margin-top: 5%;
	padding:5%;
	transform: scale(1.0);
}
#gallery1 ul li img:hover {
transform: scale(1.35);
}

/* Pen & Ink Page Css */
#gallery2 ul li{
	background: rgba(0, 0, 0, 0);
	border: groove rgba(0, 0, 0, 0) 20px;
	align-content: center;
}
#gallery2 ul li img{
	
	border: groove gold 20px;
	background-color: black;
	align-content: center;
	width: 50%;
	margin-left: 19%;
	margin-top: 2%;
	padding:5%;
	transform: scale(.9);
}
#gallery2 ul li img:hover {
transform: scale(1.5);
}



/* About Me Page Css */
#about_text{
	text-align: center;
	font-size: 28px;
	font-size: 28px;
	color: white;
	font-family: 'Didact Gothic', sans-serif;
	margin-left: 25%;
	margin-right: 25%;
}
#selfie img{
	transform: rotate(90deg);
	width: 25%;
	margin-left: 37%;
	margin-top: 1%;
	transform: scale()
}

/* Contact Page Css */
#contact_pics ul{
	display: block;
	position:inherit;
	margin-top: 3%;
	width: 100%;
	column-count: 3;
	transform: scale(.8)
}
#contact_pics ul li{
display: none;
	

}
#contact_pics ul li img{ 

transform: scale(1.0);
	
}
/* Navigation Css */

.dropbtn {
   	display: block;
	background-color: rgba(0, 0, 0, 0.71);
    color: #ffffff;
	width:100%; 
    padding-top: 5px;
	padding-bottom: 5px;
	margin: auto;
    font-size: 36px;
    border: groove 10px gold;
	margin-top: 5%;
	font-family: 'Metamorphous', cursive;
	position: static;

}

.dropdown {
	width: 100%;
	background-image: url(images/nav_background.jpg);
	background-repeat: repeat;
	background-size:cover;
	background-position: top;
	position:relative;
}


.dropdown-content {
	display: none;
    position: relative;
	background-color: white;
	background-image: url(images/nav_background2.jpg);
	background-repeat: repeat;
	background-size:100%;
	background-position: center;
	background-color: rgb(255, 255, 255);
    color: #ffffff;
	width:100%;
    font-size: 28px;
    border: groove 10px rgb(0, 0, 0);
	
	
}


.dropdown-content a {
	display: inline-block;
	background-color: rgba(0, 0, 0, 0.46);
    color: #ffffff;
	width:100%;
    padding-top: 1%;
	padding-bottom: 1%;
	padding-right: 5%;
		padding-left: -5%;
	text-align: center;
	font-family: 'Didact Gothic', sans-serif;
    text-decoration: none;

}


.dropdown-content a:hover {
	background-color: #000000;
 
}


.dropdown:hover .dropdown-content {
    display:block;
	
}


.dropdown:hover .dropbtn {
    background-color: rgba(0, 0, 0, 0.47);
	color: #ffffff;
}

	/*Contact Form Css */


.container {
	max-width:800px;
	width:100%;
	height: 500px;
	margin:0 auto;
	position:relative;
}

#contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea, #contact button[type="submit"] { font-family: 'Didact Gothic', sans-serif;}

#contact {
	background:#F9F9F9;
	background-image: url(images/nav_background.jpg);
	padding:25px;
	margin:0px 0;
	border: gold groove 10pt
}

#contact h3 {
	color: #000000;
	display: block;
	text-align: center;
	font-size: 30px;
	font-weight: 400;
}

#contact h4 {
	margin:5px 0 15px;
	display:block;
	font-size:13px;
}

fieldset {
	border: medium none !important;
	margin: 0 0 10px;
	min-width: 100%;
	padding: 0;
	width: 100%;
}

#contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea {
	
	width:100%;
	border:1px solid #ffffff;
	background:#FFF;
	margin:0 0 5px;
	padding:10px;
}




#contact textarea {
	height:100px;
	max-width:100%;
  resize:none;
}

#contact button {
	cursor:pointer;
	width:100%;
	border:none;
	background:#000000;
	color:#FFF;
	margin:0 0 5px;
	padding:10px;
	font-size:20px;
}

#contact button:hover {
	background:gold;
	}

#contact button{ 
	box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.5); }

#contact input:focus, #contact textarea:focus {
	outline:0;
	border:1px solid #999;
}
}



@media all and (max-width:480px){

body { 
	background-color:black;
	display: block;	
	position: static;
	background-image: url(images/back_1.png);
	background-size:cover;
	background-repeat: round;
	background-size: 100%;
	height: 100%;
	width: 100%;
}

body header {
	position:inherit;
	display: block;
	width: 90%;
	height: 300px;
	margin-bottom: -15%;
	margin-left: 4%;
	background-image: url(images/vs_logo-01.png);
	background-repeat: no-repeat;
	background-size:contain;
	background-position: center;
}

h2 {
	font-size: 16pt;
	color: white;
	text-align: center;
	margin-top: 15%;
	font-family: 'Metamorphous', cursive;
}

nav h2 {
	font-family: 'Metamorphous', cursive;

}
	footer {
		position: static;
		margin-top: 10%;
		margin-bottom: 5%;
	color: whitesmoke;
}
footer nav ul li{

	display: inline-block;
	width: 15%;
	color: azure;
	margin: 0% 1% -10% 3%;

	text-align: center;
	position: static;
	
}
footer nav ul li a{
	display: inline-block;
	font-size: 10px;
	color: azure;
	text-align: center;
	position: static;
	
}

	footer h2 {
	font-size: 16pt;
	color: white;
	text-align: center;
	margin-top: 5%;
	font-family: 'Metamorphous', cursive;
}
	
/* Home Page Css */

#home_text p { 
	display: block;
	text-align: center;
	height: 400px;
	max-height: 500px;
	padding-right: 15%;
	padding-left: 15%;
	margin-top: 5%;
	font-size: 24px ;
	color: white;
	font-family: 'Didact Gothic', sans-serif;

}

#slideshow {
	display:none;
	
}

/* Paintings Page Css */
	#gallery1 h2 {
		
	}
#gallery1 ul li{
	background: rgba(0, 0, 0, 0);
	align-content: center;}
#gallery1 ul li img{
	
	border: groove gold 5px;
	background-color: black;
	align-content: center;
	width: 50%;
	margin-left: 19%;
	margin-top: 35%;
	padding:5%;
	transform: scale(1.5);
}
#gallery1 ul li img:hover {
transform: scale(1.6);
}

/* Pen & Ink Page Css */
#gallery2 ul li{
	background: rgba(0, 0, 0, 0);
	border: groove rgba(0, 0, 0, 0) 20px;
	align-content: center;
	
}
#gallery2 ul li img{
	
	border: groove gold 5px;
	background-color: black;
	align-content: center;
	width: 50%;
	margin-left: 19%;
	margin-top: 20%;
	padding:2%;
	transform: scale(1.5);
}
#gallery2 ul li img:hover {
transform: scale(1.75);
}



/* About Me Page Css */
#about_text{
	text-align: center;
	font-size: 18px;	color: white;
	font-family: 'Didact Gothic', sans-serif;
	margin-left: 15%;
	margin-right: 15%;
	margin-bottom: 5%;
}
#selfie img{
	transform: rotate(90deg);
	width: 45%;
	margin-left: 27%;
	margin-top: 1%;
	transform: scale()
}

/* Contact Page Css */
#contact_pics ul{
	display:block;
	margin-bottom: -25%;
		margin-top: -15%;
	position:static;
	width: 100%;
	height: 250px;
	column-count: 3;
}
#contact_pics ul li{
	position:inherit;
	width:25%;
	margin: 0% 2% 2% -15%;
	padding-left: 15%;
	max-height: 250px;
	transform: scale(.4);
	

}
#contact_pics ul li img{ 

transform: scale(1.0);
	
}
	#contact_form h2{ 
	margin-top: -45%;
	}
/* Navigation Css */

.dropbtn {
   	display: block;
	background-color: rgba(0, 0, 0, 0.71);
    color: #ffffff;
	width:100%; 
    padding-top: 5px;
	padding-bottom: 5px;
	margin: auto;
    font-size: 36px;
    border: groove 10px gold;
	margin-top: 7%;
	font-family: 'Metamorphous', cursive;
	position: static;

}

.dropdown {
	width: 100%;
	background-image: url(images/nav_background.jpg);
	background-repeat: repeat;
	background-size:cover;
	background-position: top;
	position:relative;
}


.dropdown-content {
	display: none;
    position: relative;
	background-color: white;
	background-image: url(images/nav_background2.jpg);
	background-repeat: repeat;
	background-size:100%;
	background-position: center;
	background-color: rgb(255, 255, 255);
    color: #ffffff;
	width:100%;
    font-size: 28px;
    border: groove 10px rgb(0, 0, 0);
	
	
}


.dropdown-content a {
	display: inline-block;
	background-color: rgba(0, 0, 0, 0.46);
    color: #ffffff;
	width:100%;
    padding-top: 1%;
	padding-bottom: 1%;
	padding-right: 5%;
		padding-left: -5%;
	text-align: center;
	font-family: 'Didact Gothic', sans-serif;
    text-decoration: none;

}


.dropdown-content a:hover {
	background-color: #000000;
 
}


.dropdown:hover .dropdown-content {
    display:block;
	
}


.dropdown:hover .dropbtn {
    background-color: rgba(0, 0, 0, 0.47);
	color: #ffffff;
}
	
.container {
	max-width:800px;
	width:100%;
	height: 400px;
	margin:0 auto;
	position:relative;
	transform: scale(.9);
}

#contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea, #contact button[type="submit"] { font-family: 'Didact Gothic', sans-serif;}

#contact {
	background:#F9F9F9;
	background-image: url(images/nav_background.jpg);
	padding:25px;
	margin:0px 0;
	border: gold groove 10pt;
}

#contact h3 {
	color: #000000;
	
	display: block;
	text-align: center;
	font-size: 30px;
	font-weight: 400;
}

#contact h4 {
	margin:5px 0 15px;
	display:block;
	font-size:13px;
}

fieldset {
	border: medium none !important;
	margin: 0 0 5px;
	min-width: 80%;
	padding:25px;
	padding: 0;
	width: 90%;
}

#contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea {
	
	width:100%;
	border:1px solid #CCC;
	background:#FFF;
	margin:0 0 15px;
	padding:10px;
}

#contact input[type="text"]:hover, #contact input[type="email"]:hover, #contact input[type="tel"]:hover, #contact input[type="url"]:hover, #contact textarea:hover {
	-webkit-transition:border-color 0.3s ease-in-out;
	-moz-transition:border-color 0.3s ease-in-out;
	transition:border-color 0.3s ease-in-out;
	border:1px solid #AAA;
}

#contact textarea {
	height:100px;
	max-width:100%;
  resize:none;
}

#contact button {
	cursor:pointer;
	width:100%;
	border:none;
	background:#0CF;
	color:#FFF;
	margin:0 0 5px;
	padding:10px;
	font-size:15px;
}

#contact button:hover {
	background:#09C;
}

#contact button: 0 1px 3px rgba(0, 0, 0, 0.5); }

#contact input:focus, #contact textarea:focus {
	outline:0;
	border:1px solid #999;
}



}