@import url('https://fonts.googleapis.com/css?family=Cinzel+Decorative|Amatic+SC|Reenie+Beanie|Dancing+Script|Cinzel');


/*======= Body style ======== 
   =========================== */
   

#preload-01 { background: url(http://yasmeensong.com/backgrounds/large.png) no-repeat -9999px -9999px; }

body {
	
background-image: url('backgrounds/large.png');
	
color: #000;
	
font-size: 87.5%; /* Base font size: 14px */
	
font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
	
line-height: 1.429;
	
margin: 0;
	
padding: 0;
	
text-align: left;
	}
	


.body {
	
clear: both; 
	
margin: 0 auto; 
	
width: 100%;
}


	
/* ===========================
   ========= Headings ======== 
   =========================== */


h2 {font-size: 2.571em;
font-family: 'Reenie Beanie', cursive, arial, trajan pro;}	/* 22px */


h3 {
font-family: Cinzel Decorative; serif;
color: #fff;
 font-size: 2.429em;
}	/* 20px */


h4 {font-family: Cinzel Decorative; serif;
color: #000;
font-size: 2.286em;
}	/* 18px */


h5 {font-size: 1.143em}	/* 16px */

h6 {font-size: 1em}     /* 14px */


h2, h3, h4, h5, h6 
{
	
font-weight: 400;

line-height: 1.1;
	
margin-bottom: .8em;

}

h7
{
font-family: Calibri; serif;	
font-weight: 400;
color: white;
line-height: 1.1;
	
margin-bottom: .8em;

font-size: 1.643em}	/* 16px */

h8
{
font-family: Calibri; serif;	
font-weight: 400;
color: white;
line-height: 2.1;
	
margin-bottom: .8em;

font-size: 1.243em}	/* 16px */

/* ===========================
   ======= Anchor style ====== 
   =========================== */


a {
	
outline: 0;
	
}


a img {
	
border: 0px; 
	
text-decoration: none;

}


a:link, a:visited {
	
color: #C0C0C0;
	
padding: 0 1px;
	
text-decoration: none;

}



a:hover, a:active {
	
background-color: #C0C0C0;
	
color: #000;
	
text-decoration: none;

}



/* ===========================
   ===== Main Navigation ===== 
   =========================== */
   

.mainHeader nav {

color: #000;
position: static;	
background: url(backgrounds/.png);
	
font-size: 1.500em;

font-family: Cinzel Decorative; serif;
width: 100%;	
height: 40px;
	
line-height: 40px;
	
margin: 0px 0px 0px 0px;
	
text-align: center;
	
}
	


.mainHeader nav ul {
	
list-style: none; 
	
margin: 0 auto;

}



.mainHeader nav ul li {
	
float: left; 
	
display: inline; 

}
	


.mainHeader nav a:link, .mainHeader nav a:visited {

	color: #fff;

	display: block;

	height: 30px;

	padding: 5px 23px;

	text-decoration: none;

}


.mainHeader nav a:hover, .mainHeader nav a:active,
.mainHeader nav .active a:link, .mainHeader nav .active a:visited {
	
	color: #fff;

	display: block;

	height: 30px;

	padding: 5px 23px;

	text-decoration: none;

}

	

.mainHeader nav li a {

	}

.mainHeader cart{

          position: fixed;
          float: right;
          margin-top: -10px;
          margin-bottom: 10px;
          margin-left: -80px;
          line-height: 30px;


}


.mainHeader cart li a{

         non

}


.mainHeader cart a:hover{
	
        background: none;

        opacity: none;
}




.mainHeader nav2 {
position: static;

background: #000;
	
font-size: 1.500em;

font-family: Cinzel Decorative; serif;
width: 100%;		
	
float: right;
	
height: 40px;
	
line-height: 40px;

margin-top: 0px;	
}
	


.mainHeader nav2 ul {
	
list-style: none; 
	
margin-left: 0 auto;
float: right;
margin-top: 0px;
padding-top: 0px;
padding-bottom: 20px;
}



.mainHeader nav2 ul li {
	

display: inline; 

float: left;
padding-bottom: 20px;
}
	


.mainHeader nav2 a:link, .mainHeader nav a:visited {

	color: #fff;

	display: block;

	height: 30px;

	padding: 5px 23px;

	text-decoration: none;

}


.mainHeader nav2 a:hover, .mainHeader nav a:active,
.mainHeader nav .active a:link, .mainHeader nav .active a:visited {
	
        color: #fff;

	display: block;

	height: 30px;

	padding: 5px 23px;

	text-decoration: underline;

}

	

.mainHeader nav2 li a {

        color: #fff;
        margin-bottom: 10px;
        margin-top: 0px;


	}




.mainHeader img {

        margin-left:0px;
	height: auto;

	margin: 0% 0;

}



.mainHeader social{
list-style: none;
 background:transparent; 
 top:0px; 
 left:0px;	
 line-height: 40px;
		
 text-align: right;
 
}
.mainHeader social a {
 top:0px; 
 left:0px;	
 line-height: 40px;

}
.mainHeader social a img {
 display: 100%;
 width: 20px;

 float:right; 
 height: 20px;

 padding: 5px 1px 3px 1px;
	
 text-align: right;
 
 margin-right: 0px
}
.mainHeader social li a{
 top:0px; 
 left:0px;
 line-height: 30px;

 	
}

.mainHeader social a:hover{
	
        background: none;

        opacity: none;
}




/* ===========================
   ======= Content Area ====== 
   =========================== */



.mainContent {

	background-color: #fff;
        opacity: 0.7%;
        float: right;
   	line-height: 25px;
        margin-top: 00px;

	border-radius: 5px;

	-moz-border-radius: 5px;

	-webkit-border-radius: 5px;

}



.topcontent {
 	width: 68%;
	background-color: 0;
        line-height: 25px;
        margin-top: 100px;
        margin-left: 0px;
      	border-radius: 5px;

	-moz-border-radius: 5px;

	-webkit-border-radius: 5px;


}





.bottomcontent {

	background-color: #0;	
        line-height: 25px;
        border-radius: 5px;

	-moz-border-radius: 5px;

	-webkit-border-radius: 5px;


}



.content {

	width: 68%;

        margin-left: 30px;
	float: left;

	
}





.post-info {

	font-style: italic;

	color: #000;

	font-size: 85%;

}



/* ===========================
   ======== Sidebar ========== 
   =========================== */



.top-sidebar {

        color: #fff;
 	width: 51%;
        height:360px;

	float: right;

        margin-top: -550px;
	border-radius: 5px;

	-moz-border-radius: 5px;

	-webkit-border-radius: 5px;
	
	background-color: #;
	

}



.middle-sidebar {

	margin-top: 600px;
padding:30px;
font-family: arial;
width: 400px;
line-height: 1.7em;
font-size: 1.0em;
margin-left: 0px;
background-color: ;
color: #ffffff;
      border-radius: 5px;

	-moz-border-radius: 5px;

	-webkit-border-radius: 5px;
	
	
	
}



.bottom-sidebar {

	width: 25%;

	float: right;
	margin-top: -599px;
	border-radius: 5px;

	-moz-border-radius: 5px;

	-webkit-border-radius: 5px;
	
	
	padding: 2% 3%;

}

.bottom-sidebar img{

	width: 100%;
	
	padding: 2% 3%;

}

/*-------music---------------*/
audio::-webkit-media-controls-panel
{
position: absolute;
background:  rgba(214, 198, 220, 0.0);
	width:5px;
	height:30px;
margin-left: 20px;
margin-top: 5px;
line-height: .5em;
display:block;
padding: 0%;
	background-image: url('backgrounds/playbutton.png');

}

/* ===========================
   ========= Footer ========== 
   =========================== */



.mainFooter {


	width: 100%;

        height: 50px; 
	float: left;

	padding-left: 0;

        background-color: #000;
        margin-top: 20px;
        margin-bottom: 0px;	
color: #ffff;
                text-align: right;
                font-size: 1.0em;
                font-family: Trebuchet MS; serif;


}



.mainFooter p {

	width: 91%;

	
}



input[type=button], input[type=submit], input[type=reset] {
    background-color: #;
width: 275px;
height: 50px;
    border:2px;
    color: black;
    padding: 16px 32px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: pointer;
}

input {
width: 240px;
    border: 5px solid white; 
    -webkit-box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    -moz-box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    padding: 15px;
    background: rgba(255,255,255,0.5);
    margin: 0 0 10px 0;
}

input[type=email]::-ms-clear {
  /* remove the big X on ie */
  display: none;
}

input[type=submit] {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
}

/* ===========================
   ====== Media Queries ====== 
   =========================== */



@media only screen and (min-width : 150px) and (max-width : 900px)
{


body {
	
background-image: url('backgrounds/large.png');
	
color: #000;
	
font-size: 87.5%; /* Base font size: 14px */
	
font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
	
line-height: 1.429;
	
margin: 0;
	
padding: 0;
	
text-align: left;
	}
	


.body {
	
clear: both; 
	
margin: 0 auto; 
	
width: 100%;
}

	
	
	
.mainHeader nav {

          position: static;		
          background: url(backgrounds/lotus.png);
		
          font-size: 1.143em;
		
          height: 370px;

          border-radius: 5px;

		-moz-border-radius: 5px;

		-webkit-border-radius: 5px;
	
		color: #FFF;
		line-height: 30px;

		margin-bottom: 0;

	}
		
	
.mainHeader nav ul {

		list-style: none; 

		margin: 0 auto;
	
        	padding-left: 0;
	
}
	
	
.mainHeader nav li {

		margin-left: 0 auto;

		width: 100%;

                text-align: left;
                padding-left: 0px;
	
}
	
	

.mainHeader nav a:link, .mainHeader nav a:visited {

		color: #FFF;

		display: block;

		height: 30px;

		padding: 5px 0;

        	text-decoration: none;

                padding-left: 0;	
}
	
	
.mainHeader nav a:active,
	.mainHeader nav .active a:link, .mainHeader nav .active a:visited {

		background: #007F46;

		color: #fff;

		text-shadow: none !important;

	}
		
	

.mainHeader nav li a {
	}


mainHeader cart img{

          width: 0 auto;
          float: left;

}


.mainHeader cart{

          position: static;
          clear: both; 
		
          margin: 0 auto; 
	


}


.mainHeader cart li a{


}


.mainHeader cart a:hover{
	

}



.mainHeader nav2 {

          position: static;		
          background: #000;
		
          font-size: 1.143em;
		
          height: 180px;

border-radius: 5px;

		-moz-border-radius: 5px;

		-webkit-border-radius: 5px;
	
		color: #FFF;
		line-height: 20px;

		margin-bottom: 0;

		margin-top: 70px;

	}
		
	
.mainHeader nav2 ul {

		list-style: none; 

		margin: 0 auto;
	
        	padding-left: 0;
	
}
	
	
.mainHeader nav2 li {

		margin-left: 0 auto;

                text-align: left;
                padding-left: 0px;
	
}
	
	

.mainHeader nav2 a:link, .mainHeader nav a:visited {

	
}
	
	
.mainHeader nav2 a:active,
	.mainHeader nav .active a:link, .mainHeader nav .active a:visited {

	}
		
	

.mainHeader nav2 li a {
	}



.mainHeader img {

        margin-left:20%;
	height: auto;

	margin: 0% 0;

}


	
	


.mainContent {

	background-color: #fff;
        opacity: 0.7%;
        float: right;
   	line-height: 25px;
        margin-top: -200px;

	border-radius: 5px;

	-moz-border-radius: 5px;

	-webkit-border-radius: 5px;

}



.topcontent {

	background-color: 0;
        line-height: 25px;
        margin-top: 70px;
        margin-left: 0px;
      	border-radius: 5px;

	-moz-border-radius: 5px;

	-webkit-border-radius: 5px;


}





.bottomcontent {

	background-color: #0;	
        line-height: 25px;
        border-radius: 5px;

	-moz-border-radius: 5px;

	-webkit-border-radius: 5px;


}



.content {

	width: 68%;

        margin-left: 30px;
	float: left;

	
}


.content img{

	width: ;
        height: ;
	border-radius: 0px;
        margin-top: 0px;

	
}



.post-info {

	font-style: italic;

	color: #000;

	font-size: 85%;

}



/* ===========================
   ======== Sidebar ========== 
   =========================== */



.top-sidebar {

        color: #fff;
 	width: 100%;
        height:360px;

	float: left;

        margin-top: 50px;
	margin-left: 56px;
	border-radius: 5px;

	-moz-border-radius: 5px;

	-webkit-border-radius: 5px;
	
	background-color: #;
	
	padding: 1% 2%;
	margin-bottom: 0%;

}



.middle-sidebar {

font-family: arial;
width: 100%;
line-height: 1.7em;
font-size: 1.0em;
margin-top:200px;
background-color: ;
color: #;
	
	
}



.bottom-sidebar {

	width: 100%;

	float: left;

	margin-left: 7%;
	margin-top: 59px;
	border-radius: 5px;

	-moz-border-radius: 5px;

	-webkit-border-radius: 5px;
	
	background-color: #;
	
	padding: 2% 3%;

}


		
	

.mainFooter {

		width: 78%;

		float: left;

		margin: 2% 0;

		padding-left: 0;

		background-color: #000;

		border-radius: 5px;

		-moz-border-radius: 5px;

		-webkit-border-radius: 5px;
	
		color: #FFF;	
	
}
	
	

.mainFooter {
		
                 width: 100%;

		margin-top:400px;

.mainHeader social{
list-style: none;
 background:transparent; 
 top:0px; 
 left:0px;	
 line-height: 40px;
		
 text-align: left;
 
}
.mainHeader social a {
}
.mainHeader social a img {
 display: 100%;
}
.mainHeader social li a{
 top:0px; 
 left:0px;
 line-height: 30px;


}




	}
}