machal

/**
 * Dabblet: CSS transitions demo
 */

#example {
  transition: background .5s, top .5s 1s;
  position: absolute;
  top: 20px;
  padding: 20px;
  background: #999;

machal

/**
 * Dabblet: Loading spinner – CSS animation with PNGa
 * Author: Martin Michalek, twitter.com/machal
 */

body {
   	background: lightgrey;
}

.loading {  

machal

/**
 * Dabblet: accessible navigation with WAI-ARIA and fallback for older assistive technologies
 *
 * Více česky na http://zdrojak.root.cz/clanky/pristupnost-ria-strukturovani-dokumentu-a-pristupnost-z-klavesnice/
 */

machal

/*
 * Dabblet: ukazky "krapy first" technicke implementace
 */

/*
 Vrstva pro krapy:
 * reset/normalizace
 * zakladni typografie
*/ 

machal

/**
 * Dabblet: Testing HTML5 input attributes (placeholder, required, pattern)
 * and CSS3 styling of required
 */

input[required] {
	border: 3px solid #333;
}

input[required]:invalid:focus {

machal

/**
 * Dabblet: Loading spinner with animated SVG
 */

body {
  	background: lightgrey;
}

/* Modern browsers */

machal

/**
 * Dabblet: SVG sandbox
 */

body {
  	background: lightgrey;
}

/* Modern browsers */

machal

/**
 * Border transition on hover / animace zmen vlastnosti ramecku po najeti mysi
 * Source / zdroj: http://jsdo.it/ksk1015/cLLl/fullscreen
 */

.circle {
	display: inline-block;
	width: 150px;
	height: 150px;
	margin: 0;

machal

/*

Novy obsahovy stylopis pro weby DCK Rekrea Ostrava (2011)
=========================================================

Autor: Martin Michalek, webmaster@eslovensko.cz

Struktura
.........

machal

/**
 * Dabblet: CSS speech or tooltip bubble with box shadow
 * Author: Martin Michálek, twitter.com/machal
 */

.bubble {
  	width: 200px;
}

.bubble_head {