Import cal + css from Jiyoun

design_membership/stylesheet.css

@@ -0,0 +1,166 @@
+@charset "utf-8";
+/* CSS Document */
+
+/* ---------- FONTAWESOME ---------- */
+/* ---------- http://fortawesome.github.com/Font-Awesome/ ---------- */
+/* ---------- http://weloveiconfonts.com/ ---------- */
+
+@import url(http://weloveiconfonts.com/api/?family=fontawesome);
+
+*[class*="fontawesome-"]:before {
+  font-family: 'FontAwesome', sans-serif;
+}
+
+/* ---------- GENERAL ---------- */
+
+body {
+	background: #f9f9f9;
+	color: #0e171c;
+	font: 100 100%/.7em 'Lato', sans-serif;
+	margin: 0;
+}
+
+a {
+	text-decoration: none;
+}
+
+/*Month size*/
+h2 {
+	font-size: .8em;
+	line-height: 1em;
+	/*margin: .1em 0;*/
+}
+
+td{
+	font-size:.7em;
+}
+
+h3 {
+	font-size: .7em;
+	line-height: .1em;
+	margin: .13em 0;
+}
+
+table {
+	/*border-collapse: collapse;*/
+	border-spacing: 0;
+}
+
+.container {
+	height: 270px;
+	left: 50%;
+	margin: -100px 0 0 -100px; /* Calendar location */
+	position: absolute;
+	top: 50%;
+	width: 13%;
+}
+
+/* ---------- CALENDAR ---------- */
+
+.calendar {
+	text-align: center;
+}
+
+.calendar header {
+	position: relative;
+}
+
+.calendar h2 {
+	text-transform: uppercase;
+	color: #1A6687;
+}
+/*Title*/
+.calendar thead {
+	font-size: .9em;
+	font-weight: 600;
+	text-transform: uppercase;
+	color: #8BC4C9;
+}
+
+/*Body text*/
+.calendar tbody {
+	color: #7c8a95;
+}
+
+/*select date*/
+.calendar tbody td:hover {
+	border: .2em solid #8BC4C9;
+}
+
+.calendar td {
+	border: .7em solid none;
+	border-radius: 50%;
+	display: inline-block;
+	height: 2em;
+	line-height: 2em;
+	text-align: center;
+	width: 2em;
+}
+
+.calendar .prev-month,
+.calendar .next-month {
+	color: #cbd1d2;
+}
+
+.calendar .prev-month:hover,
+.calendar .next-month:hover {
+	border: 2px solid #cbd1d2;
+}
+
+/*Today*/
+.current-day {
+	background: #8BC4C9;
+	color: #f9f9f9;
+}
+
+.event {
+	cursor: pointer;
+	position: relative;
+}
+
+/*Little dot*/
+.event:after {
+	background: #8BC4C9;
+	border-radius: 50%;
+	bottom: .3em;
+	display: block;
+	content: '';
+	height: .3em;
+	left: 50%;
+	margin: -.5em 0 0 -.1em;
+	position: absolute;
+	width: .3em;
+}
+
+.event.current-day:after {
+	background: #f9f9f9;
+}
+
+/*Next,Prev month*/
+.btn-prev,
+.btn-next {
+	border: 2px solid none;
+	border-radius: 50%;
+	color: #8BC4C9;
+	height: 2em;
+	font-size: .75em;
+	line-height: 2em;
+	margin: -1em;
+	position: absolute;
+	top: 50%;
+	width: 2em;
+}
+
+.btn-prev:hover,
+.btn-next:hover {
+	background: none;
+	color: #1A6687;
+}
+
+.btn-prev {
+	left: 1.7em;
+}
+
+.btn-next {
+	right: 1.7em;
+}