/* Common Stuff */

a:link, a:visited, a:hover, a:active {
	text-decoration: none;
}

div {
	box-sizing: border-box;
}

dd {
    margin-top: 10px;
    margin-bottom: 20px;
}

body {
	font-family: "PT Serif", serif;
	background-color:#666;
	padding:100px 0;
	margin:0;
	color: #000;
}

.card-header {
	font-family: Roboto, sans-serif;
	color: #333;
}

/* Title */

.title {
  position: fixed;
  z-index: 10;
  width: 100%;
  top: 0;
	background-color: #444;
	color: #eee;
	height:64px;
	padding:16px;
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}
.title a {
    color: #eee;
    text-decoration: underline;
}

/* Blog entry stuff */

.body {
  margin-left: auto;
  margin-right: auto;
  max-width: 768px;
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  padding: 10px 10px 10px 10px;
  background-color: rgb(221, 221, 221)
}

/* Card stuff */

.card {
	background-color: #ddd;
	width: 320px;
/*	float: left;
	height: 380px; */
	margin: 20px;
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  padding-bottom: 5px;
}

a.github {
  background: no-repeat url('linkicon/github.png');
  background-position: 5px center;
  background-size: 14px;
  padding-left:24px;
}

a.playstore {
  background: no-repeat url('linkicon/play.png');
  background-position: 5px center;
  background-size: 14px;
  padding-left:24px;
}

a.twitter {
  background: no-repeat url('linkicon/twitter_bw.png');
  background-position: 5px center;
  background-size: 14px;
  padding-left:24px;
}

a.youtube {
  background: no-repeat url('linkicon/youtube.png');
  background-position: 5px center;
  background-size: 14px;
  padding-left:24px;
}

a.link {
  background: no-repeat url('linkicon/link.png');
  background-position: 5px center;
  background-size: 14px;
  padding-left:24px;
}

.card-link {
  padding: 10px 10px;
}

.card-link img {
  width: 12px;
  height: 12px;
  padding: 0px 5px;
}

.card-header {
	background-color:#88f;
	color:#fff;
	text-align:center;
	font-size:40px;
	height:180px;
	vertical-align:middle;
	padding-top:70px;
}

.card-title {
	clear: both;
	padding: 10px 10px 10px 10px;
	font-weight: bold;
}


.card-content {
  display: block;
	padding: 0px 10px 10px 10px;
  margin: 0;
}

.tag-active,
.tag-android,
.tag-cpp,
.tag-experimental,
.tag-game,
.tag-gwt,
.tag-java,
.tag-javascript,
.tag-kotlin,
.tag-kmp,
.tag-library,
.tag-programming,
.tag-typescript,
.tag-stable {
	color: white;
	background-color: #88d;
	font-family: Roboto, sans-serif;
	padding: 3px 6px;
	border-radius: 10px;
	font-size:14px;
	float: left;
	margin: 10px 0px 10px 10px;
}

.tag-active::before {
	content: "Active";
}

.tag-android,
.tag-kotlin,
.tag-kmp {
	background-color: #a4c639;
}
.tag-android::before {
	content: "Android";
}

.tag-cpp::before {
	content: "C++";
}

.tag-experimental {
	background-color: #c00;
}
.tag-experimental::before {
	content: "Experimental";
}

.tag-game::before {
	content: "Game";
}

.tag-gwt::before {
	content: "GWT";
}

.tag-java::before {
	content: "Java";
}

.tag-kotlin::before {
	content: "Kotlin";
}

.tag-kmp::before {
	content: "KMP";
}

.tag-javascript::before {
	content: "JavaScript";
}

.tag-library::before {
	content: "Library";
}

.tag-programming::before {
	content: "Programming";
}

.tag-stable::before {
	content: "Stable";
}
.tag-stable {
	background-color: #777;
}

.tag-typescript::before {
	content: "TypeScript";
}