@font-face {
font-family: 'love';
src: url('/font/Quick Love.ttf') format('OpenType');
} 

@font-face {
font-family: 'Kopi';
src: url('/font/Warung Kopi.otf') format('OpenType');
} 

@font-face {
font-family: 'porkys';
src: url(https://dl.dropbox.com/s/w27c0suxh1i3q8s/PORKYS_.TTF);
}

@font-face {
font-family: 'Sprinkle';
src: url('/font/Sprinkle-Regular.ttf') format('OpenType');
} 

*{
margin: 0;
padding: 0;
box-sizing: border-box;
}

*{
 cursor: url(https://cur.cursors-4u.net/others/oth-8/oth716.png), auto !important;
}

a:link {
 font-family: 'porkys';
  color: #b5e2f7;
  background-color: transparent;
  text-decoration: none;
  text-shadow: -1px 0 #ff8fb6, 0 1px #ff8fb6, 1px 0 #ff8fb6, 0 -1px #ff8fb6, 0 0, 1px 0 #ff8fb6;
  color: white;
 transition: 0.4s;
 letter-spacing:2px;
}

a:link:hover{
 letter-spacing:5px;
	
}

a:visited{
 color:white;
 background:transparent;
}

#regularlink{
	font-family:'kopi';
}


::selection {
 color: #ffdee7;
 background: transparent;
}
::-webkit-scrollbar {
 width: 18px;
}
::-webkit-scrollbar-track {
  background:white;
}
::-webkit-scrollbar-thumb {
  background-image:url(/img/bluestripes.png);
  border: 3px solid #f2acc9;
  border-radius:6px;
}

p{
 padding:5px 0 5px 0;
}

h2{
font-family:'Sprinkle';
text-shadow: -2px 0px pink, 2px 0 pink, 0 2px pink, 0px -2px pink, 0 0;
color:white;
font-size:35px;
padding:15px 0 20px 0;
}

h2::before,h2::after{
content:url(/img/startwinkles.gif);
padding: 0 5px;
}

h3{
 text-shadow: -1px 1px 0 #73beff, 1px 1px 0 #73beff,
1px -1px 0 #73beff,-1px -1px 0 #73beff;
 color:white;
 font-size:25px;
 font-style:italic;
 padding:5px 0 5px 0;
 margin-bottom:10px;
 background-color:aliceblue;
 border-radius:15px;
}

body{
	background-color:#fff5d9;
	background-image:url("http://media.tumblr.com/tumblr_me41pp36WX1r52dl9.gif");
	background-repeat: repeat;
	background-size:10rem;
	font-size:15px;
	font-family:'Kopi';
}

.wrapper{
  margin:3rem auto;
  width:40rem;
  height:100%;
}

.container{
 border:#c7e6ff 4px outset;
 border-top-left-radius: 50px;
 border-top-right-radius: 50px;
 padding:5px;
 background-image:url("http://media.tumblr.com/e4100e4df882df9f07c79d3cae5212e0/tumblr_inline_misxo83RUs1qz4rgp.gif");
  padding:10px;
}

.header{
 padding:10px;
 height:7rem;
 border:#9ebdff 2px solid;
 border-top-left-radius: 50px;
 border-top-right-radius: 50px;
 background-image:url(https://i.pinimg.com/736x/bd/71/af/bd71af0ad22df1cf5873e9a6f88aa5c0.jpg);
 background-repeat:repeat-x;
 background-size:500px;
}

.headerpadding{
	text-align: center;
	margin:10px 0 40px 0;
}

#headerfont{
 font-size:70px;
 text-shadow: -3px 0px #ffff, 2px 0px #ffff, 0px 2px #ffff, 0px -2px #ffff, 0 0;
 color:#ffdee6;
 font-family: 'love';
}

.navigation{
	border:1px solid;
	background-image:url("http://media.tumblr.com/tumblr_me414xXUxs1r52dl9.png")
}


#navbar{
 display: flex;
 padding: 5px;
 margin: 0;
justify-content: space-evenly;
}

#navbar button{
	background-color:white;
	border:#c2e1ff 2px dashed;
	padding:1% 3% 1% 3%;
	border-radius:10px;
     color:#85c3ff;
     transition: 0.4s;
}

#navbar button:hover{
 color:pink;
}

#navbar button.active{
 color:pink;	
}

.frilltop{
 background-image:url("https://64.media.tumblr.com/8dc1488fd7bff605fe58b8d4b159fff9/9a28dd4ffe158176-7f/s400x600/db2740be6711ad0099f332496369fcfe53c10cf8.pnj");
 height:2.2rem;
 background-size:410px;
 background-repeat:repeat-x;
}

.contents{
	display:flex;
	flex-direction: column;
	padding:10px;
	height:25rem;
	overflow:auto;
	border:pink 3px solid;

	background-color:white;
	color:#79bdfc;
	text-align:center;
	line-height: 1.5em;
}

.footer{
	padding:10px;
	border:2px solid pink;
	background-color:#ffdbe4;
	text-align:center;
	color:white;
	font-size:18px;
}

@media screen and (max-width: 850px){
  .wrapper{
	  max-width:40rem;
	  width:95%;
	}
.container{
  width: 100%;
  height:auto;
  }

.contents{
   width:100%;
  
}
	#headerfont{
		font-size:50px;
	}
	
	#navbar{
		flex-wrap:wrap;
	}


}