andrewdh

Moving from jQuery

Events

// jQuery
$(document).ready(function() {
  // code
})

andrewdh

/**
 * Header Underline Reduced Case
 */
 
 body {
 	font-family:Arial, sans-serif;
 	line-height:1;
 }

.title {

andrewdh

/**
 * Text align within circle 
 */

.info-title {
  text-align: center;
  color: #fff;
  line-height: 1;
  margin: 2em auto;
  width: 4em;

andrewdh

/**
 * Inline-Block Grid
 */

* {
	margin: 0;
	padding: 0;
	list-style: none;
}

andrewdh

/**
 * Expanding Title
 */

a {
	text-decoration: none;
	background-color: #000;
	float: left;
	position: relative;
	overflow :hidden;

andrewdh

/**
 * Chrome border-radius bug
 */

body {
	background-color: #777;
}
.wrapper {
	position:relative;
	width:200px;

andrewdh

/**
 * Collapsing Title
 */

a {
	text-decoration: none;
	background-color: #000;
	float: left;
	position: relative;
	overflow :hidden;

andrewdh

/**
 * Animated CSS hover effect

Replicate:
http://www.vanschneider.com/ */

body {
	background-color: #000;
}

andrewdh

/**
 * Site Nav Idea
 */
body { font:1em/1.5 Georgia, serif; }
.nav { margin-left: 0; list-style: none; }
.nav li { display: inline; }
.nav a { display: inline-block; text-decoration: none; }
.dropdown { position: absolute; visibility: hidden; }

.site-nav > li {

andrewdh

/**
 * Abstract Border Radius Shapes
 */

.shape {
	background-color: hsla(50,100%,50%,1);
	width: 10%;
	height: 7em;
	margin: 2em auto;
	border-radius: 90% 10% 90% 10% / 50% 10% 50% 10%;