'@charset "UTF-8";



@font-face {
	font-family:'WitchesMagic';
	src:url('../images/witches_magic.woff')format('woff');
}
.witches_magic { font-family: 'WitchesMagic', "MS Serif", "New York", serif;
}

<!----------------- Responsive ----------------> 


@media screen and (max-width:1110px) { 
	#header{ 
		width:70%;
	}
	#container{
		 width:100%;
	}

	#contactinfo{ 
		width:100%;
	}
	#about{
		width:50%;
		
	}
	#abouth{
		width:20%;
	}
	.footer{
		width:30%;
	}
	.footerc{
		width:80%;
	}
	
	.contactinfo{
		width:50%;
	}
	
	.oil1{
		width:80%;
	}

	.oil2{
		width:80%;
	}
	.oil3{
		width:80%;
	}
	.oil4{
		width:80%;
	}
	.oil5{
		width:80%;
	}
	.oil6{
		width:80%;
	}
	
	.water1{
		width:80%;
	}
	
	.water2{
		width:80%;
	}
	.water3{
		width:80%;
	}
	.water4{
		width:80%;
	}
	.draw1{
		width:75%;
	}
	.draw2{
		width:75%;
	}
	.draw3{
		width:75%;
	}
	.draw4{
		width:75%;
	}
	#oil_gallery {
		width:80%;
	}

}



@media screen and (max-width:1000px) { 
	#header{ 
		width:70%;
	}
	#container{
		 width:100%;
	}

	#contactinfo{ 
		width:100%;
	}
	#about{
		width:50%;	
	}
	#abouth{
		width:20%;
	}
	.footer{
		width:30%;
	}
	.footerc{
		width:80%;
	}
	
	.contactinfo{
		width:50%;
	}
	
	.oil1{
		width:80%;
	}

	.oil2{
		width:80%;
	}
	.oil3{
		width:80%;
	}
	.oil4{
		width:80%;
	}
	.oil5{
		width:80%;
	}
	.oil6{
		width:80%;
	}
	
	.water1{
		width:80%;
	}
	
	.water2{
		width:80%;
	}
	.water3{
		width:80%;
	}
	.water4{
		width:80%;
	}
	.draw1{
		width:75%;
	}
	.draw2{
		width:75%;
	}
	.draw3{
		width:75%;
	}
	.draw4{
		width:75%;
	}
	#oil_gallery {
		width:80%;
	}

}






@media screen and (max-width:400px) { 
	.header{ 
		background-image: url(../images/header_phone.png);
	}
	.navigation{
		width:100%;
		
	}
	.container{
		width:320px;
		height:1000px;
	}
	
	img{
		width:20%;
	}	
	#about{
		width:50%;
		
	}
	#abouth{
		width:20%;
	}
	.footer{
		width:30%;
	}
	.footerc{
		width:80%;
	}
	
	.contactinfo{
		width:50%;
	}
	
	.oil1{
		width:80%;
	}

	.oil2{
		width:80%;
	}
	.oil3{
		width:80%;
	}
	.oil4{
		width:80%;
	}
	.oil5{
		width:80%;
	}
	.oil6{
		width:80%;
	}
	
	.water1{
		width:80%;
	}
	
	.water2{
		width:80%;
	}
	.water3{
		width:80%;
	}
	.water4{
		width:80%;
	}
	.draw1{
		width:75%;
	}
	.draw2{
		width:75%;
	}
	.draw3{
		width:75%;
	}
	.draw4{
		width:75%;
	}
	#oil_gallery {
		width:80%;
	}	
	
}


<!----------------- END of Responsive ----------------> 



body {
	background-color: #FFFFFF;
	height: 100%;
	width: 100%;
    font-family: Arial, Helvetica, sans-serif;
	
}

.header {
	height: 270px;
	width: 1100px;
	margin-right: auto;
	margin-left: auto;
	background-image: url(../images/header9.png);
	background-repeat:no-repeat;
	
}

.container {
	width: 1110px;
	margin-top: -60px;
	margin-right: auto;
	margin-left: auto;
	background-color: #75bba1;
	boarder-radius: 15px;
}





.containerc {
	width: 1110px;
	height: 735px !important;
	margin-top: -60px;
	margin-right: auto;
	margin-left: auto;
	background-color: #75bba1;
	boarder-radius: 15px;
}



/* Main Navigation */
.navigation {
	list-style-image: none;
	list-style-type: none;
	width: 900px;
	height: 100px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 40px;
	margin-top: -51px ;
	font-size: 28px;
	text-decoration: none;
}
.navigation a {
	text-decoration: none;
	color: #000000;
	font-size: 30px;
	margin-left: 10px;
	text-shadow: 1px 1px 1px #4C3855;
	
}
.navigation li a:hover {
	color: #d95d7f;
	text-decoration: none;
	text-shadow: 1px 1px 1px #d95d7f;
	
}
.navigation li:last-child {
	border-right-style: none;
	border-right-width: 0px;
	text-decoration: none;
	
	
}
.navigation li {
	display: block;
	height: 55px;
	width: 170px;
	float: left;
	text-decoration: none;
	color: #d95d7f;
	
	
}

/* Drop Down Navigation */

nav ul li ul {
	display: none;
	
	
	
}
nav ul li:hover ul {
	display: block;
	
	
	
	
}
nav ul li ul li {
	height: 100px;
	border: none !important;
	margin-top: 5px;
	margin-bottom: -15px;
	margin-right: 30px;
	
}
nav ul li ul li a {
	height: 100px;
	
	
}
nav ul li ul li a:hover {
	color: #f0b4cd !important;

}


/*End of Drop Down Navigation*/



/*--------- Header -----------*/

#welcome {
	margin-left: 40px;
	margin-top: 10px;
	font-size: 70px;
	padding-top: 30px;
}


#oil_gallery {
	margin-left: 40px;
	margin-top: 10px;
	font-size: 70px;
	padding-top: 30px;
}


#oil {
	margin-left: 300px;
	margin-top: -130px;
	font-size: 40px;
	padding-top: 30px;
}



#water {
	margin-left: 300px;
	margin-top: -130px;
	font-size: 40px;
	padding-top: 30px;
}

#draw {
	margin-left: 300px;
	margin-top: -130px;
	font-size: 40px;
	padding-top: 30px;
}



#abouth {
	margin-left: 40px;
	margin-top: 10px;
	font-size: 70px;
	padding-top: 30px;
}

#contacth {
	margin-left: 40px;
	margin-top: 10px;
	font-size: 70px;
	padding-top: 30px;
}

/*-------- Text Box ----------*/


.text_box_welcome {
	height: 286px;
	width: 350px;
	margin-top: 60px;
	margin-left: 90px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	text-align:justify;
}



.lena {
	height: 286px;
	width: 400px;
	margin-top: -350px;
	margin-left: 600px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	text-align:justify;
	text-decoration: none;
	
}



.about {
	height: 286px;
	width: 400px;
	margin-top: -480px;
	margin-left: 80px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 17px;
	text-align:justify;
	text-decoration: none;
	
}




.contactinfo{
	height: 286px;
	width: 400px;
	margin-top: -430px;
	margin-left: 645px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 17px;
	text-align:justify;
	text-decoration: none;
	
}



/*----------Images------------*/


.painter {
	margin-left: 550px;
	margin-top: -320px;
	margin-bottom: -20px;
}



.lady_sleep {
	margin-left: 60px;
	margin-top: -150px;
	margin-bottom: -20px;
}




.lena_about {
	margin-left: 580px;
	margin-top: 50px;
	margin-bottom: -20px;
}



.lena_smile {
	margin-left: 60px;
	margin-top: 270px;
	margin-bottom: -20px;
}



.lena_contact {
	margin-left: 50px;
	margin-top: 50px;
	margin-bottom: -20px;
}


/*---------Thumb Nail Images-------*/

.oil1 {
	margin-left: 60px;
	margin-top: 120px;
	margin-bottom: -20px;
}

.oil2 {
	margin-left: 410px;
	margin-top: -370px;
	margin-bottom: -20px;
}

.oil3 {
	margin-left: 760px;
	margin-top: -370px;
	margin-bottom: -20px;
}


.oil4 {
	margin-left: 60px;
	margin-top: 80px;
	margin-bottom: -20px;
}

.oil5 {
	margin-left: 410px;
	margin-top: -370px;
	margin-bottom: -20px;
}


.oil6 {
	margin-left: 760px;
	margin-top: -370px;
	margin-bottom: -20px;
}




.water1 {
	margin-left: 40px;
	margin-top: 120px;
	margin-bottom: -20px;
}

.water2 {
	margin-left: 590px;
	margin-top: -350px;
	margin-bottom: -20px;
}

.water3 {
	margin-left: 60px;
	margin-top: 80px;
	margin-bottom: -20px;
}


.water4 {
	margin-left: 520px;
	margin-top: -500px;
	margin-bottom: -20px;
}





.draw1 {
	margin-left: 70px;
	margin-top: 170px;
	margin-bottom: -20px;
}

.draw2 {
	margin-left: 650px;
	margin-top: -490px;
	margin-bottom: 5px;
}

.draw3 {
	margin-left: 50px;
	margin-top: 60px;
	margin-bottom: -20px;
}


.draw4 {
	margin-left: 580px;
	margin-top: -410px;
	margin-bottom: -20px;
}




/*-----End Oil Painting Thumbs-------*/


/*Form Styles*/



.text_box_contact {
	height: 286px;
	width: 275px;
	color: #f8deac;
	margin-top: -460px;
	margin-left: 680px;
	font-family: Adobe Garamond Pro, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight:bold;
	text-align:justify;
}





.form {
	padding: 0px;
	width: 500px;
	margin: 6px;
	margin-left: 20px;
}

#forms {

	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	width: 500px;
}



/*Footer*/

.footer { 
	height: 25px;
	margin-top: 20px;
	width: 1110px;
	padding-top: 5px;
	background-color: #d95d7f;
	margin-top: 270px;
	text-align:center;
	font-family: Adobe Garamond Pro, Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	margin-bottom: 15px;
}


.footerc { 
	height: 25px;
	width: 1110px;
	background-color: #d95d7f;
	padding-top: 5px;
	margin-top: 160px;
	margin-left: -680px;
	text-align:center;
	font-family: Adobe Garamond Pro, Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	margin-bottom: 15px;
}



font-family: Arial, Helvetica, sans-serif;