picasso 0.2.3 → 0.3.0

data/.gitignore

@@ -16,3 +16,4 @@ test/tmp
 test/version_tmp
 tmp
 .project
+.sass-cache

data/README.md

@@ -1,5 +1,218 @@
-# Picasso
+![Picasso. Framework CSS/Sass.](img/picasso.png "Picasso. Framework CSS/Sass.")
 
-## Instalación
+### Framework CSS/Sass.
+
+http://gitorious.despegar.it/picasso/picasso
+
+
+-----
+
+
+# Instalación
+
+Ejecutar:
+
+```
+$ (sudo) gem install picasso
+```
+
+> Opcional: [Instalación de oily_png](#oily-png).
+
+En el `config.rb` agregar:
+
+```
+require 'picasso'
+require 'magick'
+gem 'picasso', '~> 0.3.0'
+```
+
+Modificar el número de versión a medida que se quiere usar nuevas versiones del framework. 
+
+Finalmente, en el archivo Sass importar el framework completo:
+
+```
+@import "picasso";
+```
+
+o sólo lo necesario:
+
+```
+@import "picasso/components/buttons";
+@import "picasso/despegar/variables";
+```
+
+
+# Actualización
+
+```
+$ (sudo) gem update picasso
+```
+
+# <a id="oily-png"></a>Opcional: Instalaci&oacute;n de oily_png
+
+[oily_png](https://github.com/wvanbergen/oily_png/) es una gema que permite acelerar la creaci&oacute;n de im&aacute;genes din&aacute;micas. Se recomienda su instalaci&oacute;n en caso de utilizar Picasso para la creaci&oacute;n de sprites.
+
+## Windows
+
+Bajar el paquete [Development Kit](http://rubyinstaller.org/downloads/). Extraer dicho paquete en una ruta conocida (por ejemplo `C:\DevKit`). Abrir una consola, ir a la ruta en donde se pusieron los archivos del *Development Kit* y ejecutar `ruby dk.rb init` y luego `ruby dk.rb install`.
+
+## Linux
+
+```
+$ (sudo) apt-get update
+$ (sudo) apt-get install ruby-oily-png
+```
+
+-----
+
+
+# <a id="changelog"></a>Changelog
+
+## 0.3.0
+
+* Nueva utilidad: Grillas;
+* Nuevo componente: mini-tooltips;
+* Nuevo sistema para documentar (styledocco);
+
+## 0.2.3
+
+* Fix estado estado `disabled` para IE;
+
+## 0.2.2
+
+* Se agrega estado `disabled` para los botones 3D;
+
+## 0.2.1
+
+* Fix sombras, gradientes y bordes de botones y nav de IE9;
+
+## 0.2.0
+
+* Fix degradados de botones en Chrome;
+* Separaci&oacute;n de botones por tipo;
+* Nuevos botones 3D;
+* Se quita a oily_png como dependencia;
+
+## 0.1.0
+
+* Agregados nuevos componentes:
+* - Popups
+* - Pagination
+* - Navs
+* - List Grids
+* - Inputs
+* - Accordions
+* Agregadas nuevas utilidades:
+* - Sprite: `insert-in-sprite()`
+* - IE: `after()` / `before()`
+* Nuevo fallback para IE: Generaci&oacute;n din&aacute;mica de sprites para componentes a trav&eacute;s de [compass-magick](https://github.com/StanAngeloff/compass-magick).
+* Se elimina el soporte para CSS3 Pie, siendo reemplazado por fallback de sprites.
+* Reorganizaci&oacute;n interna de la documentaci&oacute;n.
+
+## 0.0.3
+
+* Agregados estilos de fallback para Internet Explorer.
+* Soporte para CSS3 Pie (de manera predeterminado apagado).
+* Agregada la documentaci&oacute;n sobre la generaci&oacute;n de docs.
+
+## 0.0.2
+
+* Modularizaci&oacute;n del componente.
+* Agregados: buttons, mini-buttons, bubbles y arrows.
+* Creaci&oacute;n de la documentaci&oacute;n.
+
+## 0.0.1
+
+* Versi&oacute;n inicial.
+* Agregadas las variables de la marca Despegar y clearfix.
+
+
+-----
+
+
+# Todo
+
+## Componentes
+* Tabs;
+* Tooltips;
+* Breadcrumbs;
+
+## Utilidades
+* Grillas responsivas;
+* Tipografias con pictogramas comunes;
+
+## Otros
+* Creaci&oacute;n de sprites: Implementar API para poder detectar si un archivo ya existe.
+* Mejoras en la documentaci&oacute;n especificando variables por defecto de cada componente y mejor descripci&oacute;n de sus par&aacute;metros.
+
+
+-----
+
+
+# Mejoras / A&ntilde;adidos
+
+## Utilizar el c&oacute;digo fuente
+
+* Clonar el repositorio de Picasso:
+
+```
+$ git clone git@gitorious.despegar.it:picasso/picasso.git
+```
+
+* Pasarse al branch `development`:
+
+```
+$ cd picasso
+$ git checkout --track origin/development
+```
+
+* Verificar que se esta parado en dicho branch:
+
+```
+$ git branch
+```
+
+## Pruebas locales de nuevos a&ntilde;adidos/cambios:
+
+* En la carpeta del proyecto donde se encuentra el archivo `config.rb`, crear una carpeta `extensions`.
+* En dicha lugar copiar la carpeta `picasso` tal cual se la clon&oacute; del repositorio, de manera tal que quede `extensiones\picasso\<archivos de picasso>`.
+* En caso que el proyecto este configurado para usar Picasso, comentar dichas lineas en el `config.rb`.
+* Compass de manera predeterminada detecta las extensiones que sean guardadas en la carpeta `extensions`, por lo tanto, las directivas `@import "picasso";` deber&iacute;an funcionar sin problemas.
+
+El n&uacute;cleo de Picasso se encuentra en la carpeta `stylesheets`. All&iacute; mismo existen tres carpetas `components`, `utils` y `despegar` en donde se alojan, de manera modularizada, los mixins y variables de cada secci&oacute;n.
+En caso de agregar alguna funcionalidad nueva, tomar de ejemplo alg&uacute;n componente ya existente para entender su l&oacute;gica interna.
+
+## Subidas en el repositorio
+
+* Una vez realizados los cambios o a&ntilde;adidos, subirlos al repositorio:
+
+```
+$ git status
+$ git add <archivos a subir>;
+$ git commit -m "<un mensaje descriptivo del commit>"
+$ git push
+```
+
+> **Nota**: Toda mejora o cambio debe tener su documentaci&oacute;n pertinente, caso contrario, no se incorporar&aacute;n en Picasso.
+
+
+## Generar la documentaci&oacute;n
+
+* Para generar una nueva versi&oacute;n de la documentaci&oacute;n es necesario tener instalado node.js: http://nodejs.org/#download
+
+* Abrir una terminal e instalar [Styledocco](https://github.com/jacobrask/styledocco):
+
+```
+$ npm install -g styledocco
+```
+
+* Dentro de la carpeta `stylesheets`, existen archivos `.scss` que componen a Picasso. Cada archivo posee la documentaci&oacute;n pertinente que se utiliza para generar el documento final. La anotaci&oacute;n de la documentaci&oacute;n utiliza la sintaxis [markdown](http://daringfireball.net/projects/markdown/basics). 
+
+* Pararse sobre la carpeta raiz del proyecto y ejecutar:
+
+```
+$ compass compile docs/ && styledocco --name "Picasso" --preprocessor "--compass" --resources docs/resources/ --include docs/css/picasso-docs.css stylesheets/
+```
+
+* Revisar que la documentaci&oacute;n se haya generado correctamente abriendo el archivo `docs/index.html`.
 
-    $ gem install picasso

data/docs/_picasso.html

@@ -0,0 +1,38 @@
+<!DOCTYPE html><!--[if IE 7]><html class="ie7"></html><![endif]--><!--[if IE 8]><html class="ie8"></html><![endif]--><!--[if IE 9]><html class="ie9"></html><![endif]--><!-- [if gt IE 9] <!--><html><head><title>_picasso | Picasso. Framework CSS/Sass.
+</title><meta charset="utf-8"><style>.styledocco-docs img{width:100%}.button-glossy-demo-1{width:90px;height:30px;display:inline-block;text-align:center;position:relative;z-index:1;font-family:sans-serif;font-size:12px;text-decoration:none;cursor:pointer;background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#de1f2a),color-stop(100%,#c81c26)),-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#b11922),color-stop(100%,#6e0f15));background:-webkit-linear-gradient(#de1f2a,#c81c26),-webkit-linear-gradient(#b11922,#6e0f15);background:-moz-linear-gradient(#de1f2a,#c81c26),-moz-linear-gradient(#b11922,#6e0f15);background:-o-linear-gradient(#de1f2a,#c81c26),-o-linear-gradient(#b11922,#6e0f15);background:linear-gradient(#de1f2a,#c81c26),linear-gradient(#b11922,#6e0f15);-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;background-position:left top,left 15px}.button-glossy-demo-1:after,.button-glossy-demo-1:before{content:"";position:absolute;display:inline-block}.button-glossy-demo-1:after{width:88px;height:28px;left:1px;top:1px;z-index:2}.button-glossy-demo-1:before{width:86px;height:26px;left:2px;top:2px;z-index:3}.button-glossy-demo-1 span{position:relative;z-index:4;line-height:30px}.button-glossy-demo-1 span{color:white}.button-glossy-demo-1:after,.button-glossy-demo-1:before{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;border-radius:4px}.button-glossy-demo-1:after{background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(15%,#f2a4a8),color-stop(100%,#150304)) 50%;background:-webkit-linear-gradient(#f2a4a8 15%,#150304) 50%;background:-moz-linear-gradient(#f2a4a8 15%,#150304) 50%;background:-o-linear-gradient(#f2a4a8 15%,#150304) 50%;background:linear-gradient(#f2a4a8 15%,#150304) 50%}.button-glossy-demo-1:before{background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#de1f2a),color-stop(100%,#c81c26)),-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#b11922),color-stop(100%,#6e0f15));background:-webkit-linear-gradient(#de1f2a,#c81c26),-webkit-linear-gradient(#b11922,#6e0f15);background:-moz-linear-gradient(#de1f2a,#c81c26),-moz-linear-gradient(#b11922,#6e0f15);background:-o-linear-gradient(#de1f2a,#c81c26),-o-linear-gradient(#b11922,#6e0f15);background:linear-gradient(#de1f2a,#c81c26),linear-gradient(#b11922,#6e0f15);background-position:left top,left 13px}.button-glossy-demo-1,.button-glossy-demo-1:before{background-size:100% 50%;background-repeat:no-repeat}.button-glossy-demo-1:hover{text-decoration:none;background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#e96168),color-stop(50%,#bf1b24),color-stop(100%,#f10c19));background:-webkit-linear-gradient(#e96168,#bf1b24,#f10c19);background:-moz-linear-gradient(#e96168,#bf1b24,#f10c19);background:-o-linear-gradient(#e96168,#bf1b24,#f10c19);background:linear-gradient(#e96168,#bf1b24,#f10c19)}.button-glossy-demo-1:hover:after{background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(20%,#f4b1b5),color-stop(100%,#d11d27)) 50%;background:-webkit-linear-gradient(#f4b1b5 20%,#d11d27) 50%;background:-moz-linear-gradient(#f4b1b5 20%,#d11d27) 50%;background:-o-linear-gradient(#f4b1b5 20%,#d11d27) 50%;background:linear-gradient(#f4b1b5 20%,#d11d27) 50%}.button-glossy-demo-1:hover:before{background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#e96168),color-stop(50%,#bf1b24),color-stop(100%,#f10c19));background:-webkit-linear-gradient(#e96168,#bf1b24,#f10c19);background:-moz-linear-gradient(#e96168,#bf1b24,#f10c19);background:-o-linear-gradient(#e96168,#bf1b24,#f10c19);background:linear-gradient(#e96168,#bf1b24,#f10c19)}.button-glossy-demo-1:hover,.button-glossy-demo-1:hover:before{background-size:100% 100%;background-position:left top;background-repeat:no-repeat}.ie7 .button-glossy-demo-1,.ie8 .button-glossy-demo-1,.ie9 .button-glossy-demo-1{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none;background:url('../img/picasso-buttons-glossy.png');background-position:0 -1px}.ie7 .button-glossy-demo-1:hover,.ie8 .button-glossy-demo-1:hover,.ie9 .button-glossy-demo-1:hover{background-position:0 -31px}.ie9 .button-glossy-demo-1{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none}.button-glossy-demo-2{width:70px;height:30px;display:inline-block;text-align:center;position:relative;z-index:1;font-family:sans-serif;font-size:12px;text-decoration:none;cursor:pointer;background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#08c),color-stop(100%,#0077b3)),-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#069),color-stop(100%,#00334d));background:-webkit-linear-gradient(#08c,#0077b3),-webkit-linear-gradient(#069,#00334d);background:-moz-linear-gradient(#08c,#0077b3),-moz-linear-gradient(#069,#00334d);background:-o-linear-gradient(#08c,#0077b3),-o-linear-gradient(#069,#00334d);background:linear-gradient(#08c,#0077b3),linear-gradient(#069,#00334d);-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;background-position:left top,left 15px}.button-glossy-demo-2:after,.button-glossy-demo-2:before{content:"";position:absolute;display:inline-block}.button-glossy-demo-2:after{width:68px;height:28px;left:1px;top:1px;z-index:2}.button-glossy-demo-2:before{width:66px;height:26px;left:2px;top:2px;z-index:3}.button-glossy-demo-2 span{position:relative;z-index:4;line-height:30px}.button-glossy-demo-2 span{color:white}.button-glossy-demo-2:after,.button-glossy-demo-2:before{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;border-radius:4px}.button-glossy-demo-2:after{background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(15%,#6cf),color-stop(100%,#000)) 50%;background:-webkit-linear-gradient(#6cf 15%,#000) 50%;background:-moz-linear-gradient(#6cf 15%,#000) 50%;background:-o-linear-gradient(#6cf 15%,#000) 50%;background:linear-gradient(#6cf 15%,#000) 50%}.button-glossy-demo-2:before{background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#08c),color-stop(100%,#0077b3)),-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#069),color-stop(100%,#00334d));background:-webkit-linear-gradient(#08c,#0077b3),-webkit-linear-gradient(#069,#00334d);background:-moz-linear-gradient(#08c,#0077b3),-moz-linear-gradient(#069,#00334d);background:-o-linear-gradient(#08c,#0077b3),-o-linear-gradient(#069,#00334d);background:linear-gradient(#08c,#0077b3),linear-gradient(#069,#00334d);background-position:left top,left 13px}.button-glossy-demo-2,.button-glossy-demo-2:before{background-size:100% 50%;background-repeat:no-repeat}.button-glossy-demo-2:hover{text-decoration:none;background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#1ab2ff),color-stop(50%,#0070a8),color-stop(100%,#08c));background:-webkit-linear-gradient(#1ab2ff,#0070a8,#08c);background:-moz-linear-gradient(#1ab2ff,#0070a8,#08c);background:-o-linear-gradient(#1ab2ff,#0070a8,#08c);background:linear-gradient(#1ab2ff,#0070a8,#08c)}.button-glossy-demo-2:hover:after{background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(20%,#75d1ff),color-stop(100%,#007ebd)) 50%;background:-webkit-linear-gradient(#75d1ff 20%,#007ebd) 50%;background:-moz-linear-gradient(#75d1ff 20%,#007ebd) 50%;background:-o-linear-gradient(#75d1ff 20%,#007ebd) 50%;background:linear-gradient(#75d1ff 20%,#007ebd) 50%}.button-glossy-demo-2:hover:before{background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#1ab2ff),color-stop(50%,#0070a8),color-stop(100%,#08c));background:-webkit-linear-gradient(#1ab2ff,#0070a8,#08c);background:-moz-linear-gradient(#1ab2ff,#0070a8,#08c);background:-o-linear-gradient(#1ab2ff,#0070a8,#08c);background:linear-gradient(#1ab2ff,#0070a8,#08c)}.button-glossy-demo-2:hover,.button-glossy-demo-2:hover:before{background-size:100% 100%;background-position:left top;background-repeat:no-repeat}.ie7 .button-glossy-demo-2,.ie8 .button-glossy-demo-2,.ie9 .button-glossy-demo-2{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none;background:url('../img/picasso-buttons-glossy.png');background-position:0 -61px}.ie7 .button-glossy-demo-2:hover,.ie8 .button-glossy-demo-2:hover,.ie9 .button-glossy-demo-2:hover{background-position:0 -91px}.ie9 .button-glossy-demo-2{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none}.button-glossy-demo-3{width:80px;height:30px;display:inline-block;text-align:center;position:relative;z-index:1;font-family:sans-serif;font-size:12px;text-decoration:none;cursor:pointer;background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#fbb450),color-stop(100%,#faa937)),-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#fa9f1e),color-stop(100%,#c77605));background:-webkit-linear-gradient(#fbb450,#faa937),-webkit-linear-gradient(#fa9f1e,#c77605);background:-moz-linear-gradient(#fbb450,#faa937),-moz-linear-gradient(#fa9f1e,#c77605);background:-o-linear-gradient(#fbb450,#faa937),-o-linear-gradient(#fa9f1e,#c77605);background:linear-gradient(#fbb450,#faa937),linear-gradient(#fa9f1e,#c77605);-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;background-position:left top,left 15px}.button-glossy-demo-3:after,.button-glossy-demo-3:before{content:"";position:absolute;display:inline-block}.button-glossy-demo-3:after{width:78px;height:28px;left:1px;top:1px;z-index:2}.button-glossy-demo-3:before{width:76px;height:26px;left:2px;top:2px;z-index:3}.button-glossy-demo-3 span{position:relative;z-index:4;line-height:30px}.button-glossy-demo-3 span{color:white}.button-glossy-demo-3:after,.button-glossy-demo-3:before{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;border-radius:4px}.button-glossy-demo-3:after{background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(15%,#fef4e6),color-stop(100%,#633b02)) 50%;background:-webkit-linear-gradient(#fef4e6 15%,#633b02) 50%;background:-moz-linear-gradient(#fef4e6 15%,#633b02) 50%;background:-o-linear-gradient(#fef4e6 15%,#633b02) 50%;background:linear-gradient(#fef4e6 15%,#633b02) 50%}.button-glossy-demo-3:before{background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#fbb450),color-stop(100%,#faa937)),-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#fa9f1e),color-stop(100%,#c77605));background:-webkit-linear-gradient(#fbb450,#faa937),-webkit-linear-gradient(#fa9f1e,#c77605);background:-moz-linear-gradient(#fbb450,#faa937),-moz-linear-gradient(#fa9f1e,#c77605);background:-o-linear-gradient(#fbb450,#faa937),-o-linear-gradient(#fa9f1e,#c77605);background:linear-gradient(#fbb450,#faa937),linear-gradient(#fa9f1e,#c77605);background-position:left top,left 13px}.button-glossy-demo-3,.button-glossy-demo-3:before{background-size:100% 50%;background-repeat:no-repeat}.button-glossy-demo-3:hover{text-decoration:none;background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#fdd49b),color-stop(50%,#faa52d),color-stop(100%,#ffb54c));background:-webkit-linear-gradient(#fdd49b,#faa52d,#ffb54c);background:-moz-linear-gradient(#fdd49b,#faa52d,#ffb54c);background:-o-linear-gradient(#fdd49b,#faa52d,#ffb54c);background:linear-gradient(#fdd49b,#faa52d,#ffb54c)}.button-glossy-demo-3:hover:after{background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(20%,#fffbf5),color-stop(100%,#fbae41)) 50%;background:-webkit-linear-gradient(#fffbf5 20%,#fbae41) 50%;background:-moz-linear-gradient(#fffbf5 20%,#fbae41) 50%;background:-o-linear-gradient(#fffbf5 20%,#fbae41) 50%;background:linear-gradient(#fffbf5 20%,#fbae41) 50%}.button-glossy-demo-3:hover:before{background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#fdd49b),color-stop(50%,#faa52d),color-stop(100%,#ffb54c));background:-webkit-linear-gradient(#fdd49b,#faa52d,#ffb54c);background:-moz-linear-gradient(#fdd49b,#faa52d,#ffb54c);background:-o-linear-gradient(#fdd49b,#faa52d,#ffb54c);background:linear-gradient(#fdd49b,#faa52d,#ffb54c)}.button-glossy-demo-3:hover,.button-glossy-demo-3:hover:before{background-size:100% 100%;background-position:left top;background-repeat:no-repeat}.ie7 .button-glossy-demo-3,.ie8 .button-glossy-demo-3,.ie9 .button-glossy-demo-3{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none;background:url('../img/picasso-buttons-glossy.png');background-position:0 -121px}.ie7 .button-glossy-demo-3:hover,.ie8 .button-glossy-demo-3:hover,.ie9 .button-glossy-demo-3:hover{background-position:0 -151px}.ie9 .button-glossy-demo-3{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none}.button-3d-demo-1{overflow:hidden;display:inline-block;line-height:2.2em;color:white;border:1px solid #c00811;font-family:sans-serif;font-size:13px;text-decoration:none;text-align:center;cursor:pointer;text-shadow:0 1px 0 black;-webkit-border-radius:.4em;-moz-border-radius:.4em;-ms-border-radius:.4em;-o-border-radius:.4em;border-radius:.4em}.button-3d-demo-1:active{position:relative;top:1px}.button-3d-demo-1.disabled:active{position:static}.button-3d-demo-1 span{display:block;padding:0 13px}.button-3d-demo-1:visited{color:white}.button-3d-demo-1:hover{text-decoration:none;color:white}.button-3d-demo-1 span{background-color:#f73741;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#f73741),color-stop(100%,#8f060d));background-image:-webkit-linear-gradient(#f73741,#8f060d);background-image:-moz-linear-gradient(#f73741,#8f060d);background-image:-o-linear-gradient(#f73741,#8f060d);background-image:linear-gradient(#f73741,#8f060d);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5);box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5)}.button-3d-demo-1 span:hover{background-color:#ff2f3a;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,rgba(255,255,255,0)),color-stop(100%,#c00811));background-image:-webkit-linear-gradient(rgba(255,255,255,0),#c00811);background-image:-moz-linear-gradient(rgba(255,255,255,0),#c00811);background-image:-o-linear-gradient(rgba(255,255,255,0),#c00811);background-image:linear-gradient(rgba(255,255,255,0),#c00811);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #ff2f3a;-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #ff2f3a;box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #ff2f3a}.button-3d-demo-1 span:active{text-shadow:0 -1px 0 black;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#f73741),color-stop(100%,#8f060d));background-image:-webkit-linear-gradient(#f73741,#8f060d);background-image:-moz-linear-gradient(#f73741,#8f060d);background-image:-o-linear-gradient(#f73741,#8f060d);background-image:linear-gradient(#f73741,#8f060d);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75);box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75)}.button-3d-demo-1.disabled{border:1px solid #755354;cursor:not-allowed;color:white}.button-3d-demo-1.disabled span,.button-3d-demo-1.disabled span:hover,.button-3d-demo-1.disabled span:active{text-shadow:0 -1px 0 black;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#979797),color-stop(100%,#4b4b4b));background-image:-webkit-linear-gradient(#979797,#4b4b4b);background-image:-moz-linear-gradient(#979797,#4b4b4b);background-image:-o-linear-gradient(#979797,#4b4b4b);background-image:linear-gradient(#979797,#4b4b4b);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75);box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75)}.ie7 .button-3d-demo-1 span,.ie8 .button-3d-demo-1 span,.ie9 .button-3d-demo-1 span{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#00F73741',endColorstr='#FF8F060D')}.ie7 .button-3d-demo-1 span:hover,.ie8 .button-3d-demo-1 span:hover,.ie9 .button-3d-demo-1 span:hover{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#00FFFFFF',endColorstr='#FFC00811')}.ie7 .button-3d-demo-1 span:active,.ie8 .button-3d-demo-1 span:active,.ie9 .button-3d-demo-1 span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#00F73741',endColorstr='#FF8F060D')}.ie7 .button-3d-demo-1.disabled span,.ie7 .button-3d-demo-1.disabled span:hover,.ie7 .button-3d-demo-1.disabled span:active,.ie8 .button-3d-demo-1.disabled span,.ie8 .button-3d-demo-1.disabled span:hover,.ie8 .button-3d-demo-1.disabled span:active,.ie9 .button-3d-demo-1.disabled span,.ie9 .button-3d-demo-1.disabled span:hover,.ie9 .button-3d-demo-1.disabled span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#FF979797',endColorstr='#FF4B4B4B')}.button-3d-demo-2{overflow:hidden;display:inline-block;line-height:2.2em;color:white;border:1px solid #046;font-family:sans-serif;font-size:13px;text-decoration:none;text-align:center;cursor:pointer;text-shadow:0 1px 0 black;-webkit-border-radius:.4em;-moz-border-radius:.4em;-ms-border-radius:.4em;-o-border-radius:.4em;border-radius:.4em}.button-3d-demo-2:active{position:relative;top:1px}.button-3d-demo-2.disabled:active{position:static}.button-3d-demo-2 span{display:block;padding:0 13px}.button-3d-demo-2:visited{color:white}.button-3d-demo-2:hover{text-decoration:none;color:white}.button-3d-demo-2 span{background-color:#08c;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#08c),color-stop(100%,#023));background-image:-webkit-linear-gradient(#08c,#023);background-image:-moz-linear-gradient(#08c,#023);background-image:-o-linear-gradient(#08c,#023);background-image:linear-gradient(#08c,#023);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5);box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5)}.button-3d-demo-2 span:hover{background-color:#08c;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,rgba(255,255,255,0)),color-stop(100%,#046));background-image:-webkit-linear-gradient(rgba(255,255,255,0),#046);background-image:-moz-linear-gradient(rgba(255,255,255,0),#046);background-image:-o-linear-gradient(rgba(255,255,255,0),#046);background-image:linear-gradient(rgba(255,255,255,0),#046);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #08c;-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #08c;box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #08c}.button-3d-demo-2 span:active{text-shadow:0 -1px 0 black;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#08c),color-stop(100%,#023));background-image:-webkit-linear-gradient(#08c,#023);background-image:-moz-linear-gradient(#08c,#023);background-image:-o-linear-gradient(#08c,#023);background-image:linear-gradient(#08c,#023);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75);box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75)}.button-3d-demo-2.disabled{border:1px solid #755354;cursor:not-allowed;color:white}.button-3d-demo-2.disabled span,.button-3d-demo-2.disabled span:hover,.button-3d-demo-2.disabled span:active{text-shadow:0 -1px 0 black;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#979797),color-stop(100%,#4b4b4b));background-image:-webkit-linear-gradient(#979797,#4b4b4b);background-image:-moz-linear-gradient(#979797,#4b4b4b);background-image:-o-linear-gradient(#979797,#4b4b4b);background-image:linear-gradient(#979797,#4b4b4b);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75);box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75)}.ie7 .button-3d-demo-2 span,.ie8 .button-3d-demo-2 span,.ie9 .button-3d-demo-2 span{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#000088CC',endColorstr='#FF002233')}.ie7 .button-3d-demo-2 span:hover,.ie8 .button-3d-demo-2 span:hover,.ie9 .button-3d-demo-2 span:hover{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#00FFFFFF',endColorstr='#FF004466')}.ie7 .button-3d-demo-2 span:active,.ie8 .button-3d-demo-2 span:active,.ie9 .button-3d-demo-2 span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#000088CC',endColorstr='#FF002233')}.ie7 .button-3d-demo-2.disabled span,.ie7 .button-3d-demo-2.disabled span:hover,.ie7 .button-3d-demo-2.disabled span:active,.ie8 .button-3d-demo-2.disabled span,.ie8 .button-3d-demo-2.disabled span:hover,.ie8 .button-3d-demo-2.disabled span:active,.ie9 .button-3d-demo-2.disabled span,.ie9 .button-3d-demo-2.disabled span:hover,.ie9 .button-3d-demo-2.disabled span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#FF979797',endColorstr='#FF4B4B4B')}.button-3d-demo-3{overflow:hidden;display:inline-block;line-height:2.2em;color:white;border:1px solid #e08505;font-family:sans-serif;font-size:13px;text-decoration:none;text-align:center;cursor:pointer;text-shadow:0 1px 0 black;-webkit-border-radius:.4em;-moz-border-radius:.4em;-ms-border-radius:.4em;-o-border-radius:.4em;border-radius:.4em}.button-3d-demo-3:active{position:relative;top:1px}.button-3d-demo-3.disabled:active{position:static}.button-3d-demo-3 span{display:block;padding:0 13px}.button-3d-demo-3:visited{color:white}.button-3d-demo-3:hover{text-decoration:none;color:white}.button-3d-demo-3 span{background-color:#fbb450;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#fbb450),color-stop(100%,#ae6704));background-image:-webkit-linear-gradient(#fbb450,#ae6704);background-image:-moz-linear-gradient(#fbb450,#ae6704);background-image:-o-linear-gradient(#fbb450,#ae6704);background-image:linear-gradient(#fbb450,#ae6704);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5);box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5)}.button-3d-demo-3 span:hover{background-color:#ffb54c;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,rgba(255,255,255,0)),color-stop(100%,#e08505));background-image:-webkit-linear-gradient(rgba(255,255,255,0),#e08505);background-image:-moz-linear-gradient(rgba(255,255,255,0),#e08505);background-image:-o-linear-gradient(rgba(255,255,255,0),#e08505);background-image:linear-gradient(rgba(255,255,255,0),#e08505);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #ffb54c;-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #ffb54c;box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #ffb54c}.button-3d-demo-3 span:active{text-shadow:0 -1px 0 black;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#fbb450),color-stop(100%,#ae6704));background-image:-webkit-linear-gradient(#fbb450,#ae6704);background-image:-moz-linear-gradient(#fbb450,#ae6704);background-image:-o-linear-gradient(#fbb450,#ae6704);background-image:linear-gradient(#fbb450,#ae6704);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75);box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75)}.button-3d-demo-3.disabled{border:1px solid #755354;cursor:not-allowed;color:white}.button-3d-demo-3.disabled span,.button-3d-demo-3.disabled span:hover,.button-3d-demo-3.disabled span:active{text-shadow:0 -1px 0 black;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#979797),color-stop(100%,#4b4b4b));background-image:-webkit-linear-gradient(#979797,#4b4b4b);background-image:-moz-linear-gradient(#979797,#4b4b4b);background-image:-o-linear-gradient(#979797,#4b4b4b);background-image:linear-gradient(#979797,#4b4b4b);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75);box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75)}.ie7 .button-3d-demo-3 span,.ie8 .button-3d-demo-3 span,.ie9 .button-3d-demo-3 span{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#00FBB450',endColorstr='#FFAE6704')}.ie7 .button-3d-demo-3 span:hover,.ie8 .button-3d-demo-3 span:hover,.ie9 .button-3d-demo-3 span:hover{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#00FFFFFF',endColorstr='#FFE08505')}.ie7 .button-3d-demo-3 span:active,.ie8 .button-3d-demo-3 span:active,.ie9 .button-3d-demo-3 span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#00FBB450',endColorstr='#FFAE6704')}.ie7 .button-3d-demo-3.disabled span,.ie7 .button-3d-demo-3.disabled span:hover,.ie7 .button-3d-demo-3.disabled span:active,.ie8 .button-3d-demo-3.disabled span,.ie8 .button-3d-demo-3.disabled span:hover,.ie8 .button-3d-demo-3.disabled span:active,.ie9 .button-3d-demo-3.disabled span,.ie9 .button-3d-demo-3.disabled span:hover,.ie9 .button-3d-demo-3.disabled span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#FF979797',endColorstr='#FF4B4B4B')}.button-3d-demo-4{overflow:hidden;display:block;line-height:2.2em;color:white;border:1px solid #00132e;font-family:sans-serif;font-size:24px;text-decoration:none;text-align:center;cursor:pointer;text-shadow:0 1px 0 black;-webkit-border-radius:.4em;-moz-border-radius:.4em;-ms-border-radius:.4em;-o-border-radius:.4em;border-radius:.4em}.button-3d-demo-4:active{position:relative;top:1px}.button-3d-demo-4.disabled:active{position:static}.button-3d-demo-4 span{display:block;padding:0 24px}.button-3d-demo-4:visited{color:white}.button-3d-demo-4:hover{text-decoration:none;color:white}.button-3d-demo-4 span{background-color:#013d93;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#013d93),color-stop(100%,#000));background-image:-webkit-linear-gradient(#013d93,#000);background-image:-moz-linear-gradient(#013d93,#000);background-image:-o-linear-gradient(#013d93,#000);background-image:linear-gradient(#013d93,#000);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5);box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5)}.button-3d-demo-4 span:hover{background-color:#003d94;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,rgba(255,255,255,0)),color-stop(100%,#00132e));background-image:-webkit-linear-gradient(rgba(255,255,255,0),#00132e);background-image:-moz-linear-gradient(rgba(255,255,255,0),#00132e);background-image:-o-linear-gradient(rgba(255,255,255,0),#00132e);background-image:linear-gradient(rgba(255,255,255,0),#00132e);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #003d94;-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #003d94;box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #003d94}.button-3d-demo-4 span:active{text-shadow:0 -1px 0 black;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#013d93),color-stop(100%,#000));background-image:-webkit-linear-gradient(#013d93,#000);background-image:-moz-linear-gradient(#013d93,#000);background-image:-o-linear-gradient(#013d93,#000);background-image:linear-gradient(#013d93,#000);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75);box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75)}.button-3d-demo-4.disabled{border:1px solid #755354;cursor:not-allowed;color:white}.button-3d-demo-4.disabled span,.button-3d-demo-4.disabled span:hover,.button-3d-demo-4.disabled span:active{text-shadow:0 -1px 0 black;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#979797),color-stop(100%,#4b4b4b));background-image:-webkit-linear-gradient(#979797,#4b4b4b);background-image:-moz-linear-gradient(#979797,#4b4b4b);background-image:-o-linear-gradient(#979797,#4b4b4b);background-image:linear-gradient(#979797,#4b4b4b);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75);box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75)}.ie7 .button-3d-demo-4 span,.ie8 .button-3d-demo-4 span,.ie9 .button-3d-demo-4 span{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#00013D93',endColorstr='#FF000000')}.ie7 .button-3d-demo-4 span:hover,.ie8 .button-3d-demo-4 span:hover,.ie9 .button-3d-demo-4 span:hover{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#00FFFFFF',endColorstr='#FF00132E')}.ie7 .button-3d-demo-4 span:active,.ie8 .button-3d-demo-4 span:active,.ie9 .button-3d-demo-4 span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#00013D93',endColorstr='#FF000000')}.ie7 .button-3d-demo-4.disabled span,.ie7 .button-3d-demo-4.disabled span:hover,.ie7 .button-3d-demo-4.disabled span:active,.ie8 .button-3d-demo-4.disabled span,.ie8 .button-3d-demo-4.disabled span:hover,.ie8 .button-3d-demo-4.disabled span:active,.ie9 .button-3d-demo-4.disabled span,.ie9 .button-3d-demo-4.disabled span:hover,.ie9 .button-3d-demo-4.disabled span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#FF979797',endColorstr='#FF4B4B4B')}.button-3d-demo-5{overflow:hidden;display:inline-block;line-height:1.75em;color:#013d93;border:1px solid #bbb;font-family:sans-serif;font-size:11px;text-decoration:none;text-align:center;cursor:pointer;text-shadow:0 1px 0 #b5b5b5;-webkit-border-radius:1.1em;-moz-border-radius:1.1em;-ms-border-radius:1.1em;-o-border-radius:1.1em;border-radius:1.1em}.button-3d-demo-5:active{position:relative;top:1px}.button-3d-demo-5.disabled:active{position:static}.button-3d-demo-5 span{display:block;padding:0 11px}.button-3d-demo-5:visited{color:#013d93}.button-3d-demo-5:hover{text-decoration:none;color:#013d93}.button-3d-demo-5 span{background-color:#eee;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#eee),color-stop(100%,#a2a2a2));background-image:-webkit-linear-gradient(#eee,#a2a2a2);background-image:-moz-linear-gradient(#eee,#a2a2a2);background-image:-o-linear-gradient(#eee,#a2a2a2);background-image:linear-gradient(#eee,#a2a2a2);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5);box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5)}.button-3d-demo-5 span:hover{background-color:#f0ecec;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,rgba(255,255,255,0)),color-stop(100%,#bbb));background-image:-webkit-linear-gradient(rgba(255,255,255,0),#bbb);background-image:-moz-linear-gradient(rgba(255,255,255,0),#bbb);background-image:-o-linear-gradient(rgba(255,255,255,0),#bbb);background-image:linear-gradient(rgba(255,255,255,0),#bbb);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #f0ecec;-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #f0ecec;box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.5),inset 0 0 1em #f0ecec}.button-3d-demo-5 span:active{text-shadow:0 -1px 0 #b5b5b5;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#eee),color-stop(100%,#a2a2a2));background-image:-webkit-linear-gradient(#eee,#a2a2a2);background-image:-moz-linear-gradient(#eee,#a2a2a2);background-image:-o-linear-gradient(#eee,#a2a2a2);background-image:linear-gradient(#eee,#a2a2a2);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75);box-shadow:0 .1em .1em rgba(0,0,0,.1),inset 0 .1em .2em rgba(0,0,0,.5),inset 0 .1em 0 rgba(0,0,0,.1),inset 0 0 1em rgba(0,0,0,.75)}.button-3d-demo-5.disabled{border:1px solid #755354;cursor:not-allowed;color:white}.button-3d-demo-5.disabled span,.button-3d-demo-5.disabled span:hover,.button-3d-demo-5.disabled span:active{text-shadow:0 -1px 0 black;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#979797),color-stop(100%,#4b4b4b));background-image:-webkit-linear-gradient(#979797,#4b4b4b);background-image:-moz-linear-gradient(#979797,#4b4b4b);background-image:-o-linear-gradient(#979797,#4b4b4b);background-image:linear-gradient(#979797,#4b4b4b);-webkit-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75);-moz-box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75);box-shadow:0 .1em .1em rgba(0,0,0,.5),inset 0 .1em 0 rgba(255,255,255,.25),inset 0 0 1em rgba(0,0,0,.75)}.ie7 .button-3d-demo-5 span,.ie8 .button-3d-demo-5 span,.ie9 .button-3d-demo-5 span{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#00EEEEEE',endColorstr='#FFA2A2A2')}.ie7 .button-3d-demo-5 span:hover,.ie8 .button-3d-demo-5 span:hover,.ie9 .button-3d-demo-5 span:hover{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#00FFFFFF',endColorstr='#FFBBBBBB')}.ie7 .button-3d-demo-5 span:active,.ie8 .button-3d-demo-5 span:active,.ie9 .button-3d-demo-5 span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#00EEEEEE',endColorstr='#FFA2A2A2')}.ie7 .button-3d-demo-5.disabled span,.ie7 .button-3d-demo-5.disabled span:hover,.ie7 .button-3d-demo-5.disabled span:active,.ie8 .button-3d-demo-5.disabled span,.ie8 .button-3d-demo-5.disabled span:hover,.ie8 .button-3d-demo-5.disabled span:active,.ie9 .button-3d-demo-5.disabled span,.ie9 .button-3d-demo-5.disabled span:hover,.ie9 .button-3d-demo-5.disabled span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#FF979797',endColorstr='#FF4B4B4B')}.button-mini-demo-1{display:inline-block;height:20px;padding-right:10px;padding-right:10px;font-family:sans-serif;text-decoration:none;cursor:pointer;background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#f0f0f0),color-stop(50%,#e3e3e3),color-stop(51%,#d6d6d6),color-stop(100%,#cacaca));background:-webkit-linear-gradient(top,#f0f0f0 0,#e3e3e3 50%,#d6d6d6 51%,#cacaca 100%);background:-moz-linear-gradient(top,#f0f0f0 0,#e3e3e3 50%,#d6d6d6 51%,#cacaca 100%);background:-o-linear-gradient(top,#f0f0f0 0,#e3e3e3 50%,#d6d6d6 51%,#cacaca 100%);background:linear-gradient(top,#f0f0f0 0,#e3e3e3 50%,#d6d6d6 51%,#cacaca 100%);-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border-radius:20px;-webkit-box-shadow:#333 0 1px 2px 0;-moz-box-shadow:#333 0 1px 2px 0;box-shadow:#333 0 1px 2px 0}.button-mini-demo-1 span{height:20px;line-height:20px;padding-left:10px;display:block}.button-mini-demo-1:hover{text-decoration:none;background:#e3e3e3}.button-mini-demo-1:active{background:#cacaca;-webkit-box-shadow:#999 0 0 3px 3px inset;-moz-box-shadow:#999 0 0 3px 3px inset;box-shadow:#999 0 0 3px 3px inset}.button-mini-demo-1 span{color:#0e6695;font-size:11px}.ie7 .button-mini-demo-1,.ie8 .button-mini-demo-1,.ie9 .button-mini-demo-1{background:url('../img/picasso-buttons-mini.png');background-position:right -1px}.ie7 .button-mini-demo-1:hover,.ie8 .button-mini-demo-1:hover,.ie9 .button-mini-demo-1:hover{background-position:right -21px}.ie7 .button-mini-demo-1 span,.ie8 .button-mini-demo-1 span,.ie9 .button-mini-demo-1 span{background-image:url('../img/picasso-buttons-mini.png');background-color:white;background-position:0 -1px}.ie7 .button-mini-demo-1 span:hover,.ie8 .button-mini-demo-1 span:hover,.ie9 .button-mini-demo-1 span:hover{background-position:0 -21px}.ie9 .button-mini-demo-1{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.button-mini-demo-2{display:inline-block;height:20px;padding-right:10px;padding-right:10px;font-family:sans-serif;text-decoration:none;cursor:pointer;background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#08c),color-stop(50%,#0077b3),color-stop(51%,#069),color-stop(100%,#005580));background:-webkit-linear-gradient(top,#08c 0,#0077b3 50%,#069 51%,#005580 100%);background:-moz-linear-gradient(top,#08c 0,#0077b3 50%,#069 51%,#005580 100%);background:-o-linear-gradient(top,#08c 0,#0077b3 50%,#069 51%,#005580 100%);background:linear-gradient(top,#08c 0,#0077b3 50%,#069 51%,#005580 100%);-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border-radius:20px;-webkit-box-shadow:#333 0 1px 2px 0;-moz-box-shadow:#333 0 1px 2px 0;box-shadow:#333 0 1px 2px 0}.button-mini-demo-2 span{height:20px;line-height:20px;padding-left:10px;display:block}.button-mini-demo-2:hover{text-decoration:none;background:#0077b3}.button-mini-demo-2:active{background:#005580;-webkit-box-shadow:#999 0 0 3px 3px inset;-moz-box-shadow:#999 0 0 3px 3px inset;box-shadow:#999 0 0 3px 3px inset}.button-mini-demo-2 span{color:white;font-size:11px}.ie7 .button-mini-demo-2,.ie8 .button-mini-demo-2,.ie9 .button-mini-demo-2{background:url('../img/picasso-buttons-mini.png');background-position:right -41px}.ie7 .button-mini-demo-2:hover,.ie8 .button-mini-demo-2:hover,.ie9 .button-mini-demo-2:hover{background-position:right -61px}.ie7 .button-mini-demo-2 span,.ie8 .button-mini-demo-2 span,.ie9 .button-mini-demo-2 span{background-image:url('../img/picasso-buttons-mini.png');background-color:white;background-position:0 -41px}.ie7 .button-mini-demo-2 span:hover,.ie8 .button-mini-demo-2 span:hover,.ie9 .button-mini-demo-2 span:hover{background-position:0 -61px}.ie9 .button-mini-demo-2{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.button-mini-demo-3{display:inline-block;height:20px;padding-right:10px;padding-right:10px;font-family:sans-serif;text-decoration:none;cursor:pointer;background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#da4f49),color-stop(50%,#d63b34),color-stop(51%,#c72f29),color-stop(100%,#b22a24));background:-webkit-linear-gradient(top,#da4f49 0,#d63b34 50%,#c72f29 51%,#b22a24 100%);background:-moz-linear-gradient(top,#da4f49 0,#d63b34 50%,#c72f29 51%,#b22a24 100%);background:-o-linear-gradient(top,#da4f49 0,#d63b34 50%,#c72f29 51%,#b22a24 100%);background:linear-gradient(top,#da4f49 0,#d63b34 50%,#c72f29 51%,#b22a24 100%);-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border-radius:20px;-webkit-box-shadow:#333 0 1px 2px 0;-moz-box-shadow:#333 0 1px 2px 0;box-shadow:#333 0 1px 2px 0}.button-mini-demo-3 span{height:20px;line-height:20px;padding-left:10px;display:block}.button-mini-demo-3:hover{text-decoration:none;background:#d63b34}.button-mini-demo-3:active{background:#b22a24;-webkit-box-shadow:#999 0 0 3px 3px inset;-moz-box-shadow:#999 0 0 3px 3px inset;box-shadow:#999 0 0 3px 3px inset}.button-mini-demo-3 span{color:white;font-size:11px}.ie7 .button-mini-demo-3,.ie8 .button-mini-demo-3,.ie9 .button-mini-demo-3{background:url('../img/picasso-buttons-mini.png');background-position:right -81px}.ie7 .button-mini-demo-3:hover,.ie8 .button-mini-demo-3:hover,.ie9 .button-mini-demo-3:hover{background-position:right -101px}.ie7 .button-mini-demo-3 span,.ie8 .button-mini-demo-3 span,.ie9 .button-mini-demo-3 span{background-image:url('../img/picasso-buttons-mini.png');background-color:white;background-position:0 -81px}.ie7 .button-mini-demo-3 span:hover,.ie8 .button-mini-demo-3 span:hover,.ie9 .button-mini-demo-3 span:hover{background-position:0 -101px}.ie9 .button-mini-demo-3{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.button-mini-demo-4{display:inline-block;height:20px;padding-right:10px;padding-right:10px;font-family:sans-serif;text-decoration:none;cursor:pointer;background:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#414141),color-stop(50%,#343434),color-stop(51%,#272727),color-stop(100%,#1b1b1b));background:-webkit-linear-gradient(top,#414141 0,#343434 50%,#272727 51%,#1b1b1b 100%);background:-moz-linear-gradient(top,#414141 0,#343434 50%,#272727 51%,#1b1b1b 100%);background:-o-linear-gradient(top,#414141 0,#343434 50%,#272727 51%,#1b1b1b 100%);background:linear-gradient(top,#414141 0,#343434 50%,#272727 51%,#1b1b1b 100%);-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border-radius:20px;-webkit-box-shadow:#333 0 1px 2px 0;-moz-box-shadow:#333 0 1px 2px 0;box-shadow:#333 0 1px 2px 0}.button-mini-demo-4 span{height:20px;line-height:20px;padding-left:10px;display:block}.button-mini-demo-4:hover{text-decoration:none;background:#343434}.button-mini-demo-4:active{background:#1b1b1b;-webkit-box-shadow:#999 0 0 3px 3px inset;-moz-box-shadow:#999 0 0 3px 3px inset;box-shadow:#999 0 0 3px 3px inset}.button-mini-demo-4 span{color:white;font-size:11px}.ie7 .button-mini-demo-4,.ie8 .button-mini-demo-4,.ie9 .button-mini-demo-4{background:url('../img/picasso-buttons-mini.png');background-position:right -121px}.ie7 .button-mini-demo-4:hover,.ie8 .button-mini-demo-4:hover,.ie9 .button-mini-demo-4:hover{background-position:right -141px}.ie7 .button-mini-demo-4 span,.ie8 .button-mini-demo-4 span,.ie9 .button-mini-demo-4 span{background-image:url('../img/picasso-buttons-mini.png');background-color:white;background-position:0 -121px}.ie7 .button-mini-demo-4 span:hover,.ie8 .button-mini-demo-4 span:hover,.ie9 .button-mini-demo-4 span:hover{background-position:0 -141px}.ie9 .button-mini-demo-4{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.list-grid-demo-1:before,.list-grid-demo-1:after{content:"";display:table}.list-grid-demo-1:after{clear:both}.ie6 .list-grid-demo-1,.ie7 .list-grid-demo-1{zoom:1}.list-grid-demo-1 ul{float:left;padding:0;margin:0;width:130px}.list-grid-demo-1 ul li{height:30px;line-height:30px;padding-left:10px;padding-right:10px}.list-grid-demo-1 ul{list-style:none outside none;border-top:1px solid #ccc;border-bottom:1px solid #ccc;border-right:1px solid #ccc}.list-grid-demo-1 ul:first-child{border-left:1px solid #ccc}.list-grid-demo-1 ul li{text-align:center;border:1px solid transparent}.list-grid-demo-1 ul li:first-child{border-bottom:1px solid #ccc}.list-grid-demo-1 ul li:nth-child(odd){background:none repeat scroll 0 0 #eee}.list-grid-demo-1 ul li:nth-child(even){background:none repeat scroll 0 0 white}.list-grid-demo-1 ul li.cell-hover:hover{border:1px solid #319fda;background:#f4fafd;cursor:pointer}.ie7 .list-grid-demo-1 ul li:first-child,.ie8 .list-grid-demo-1 ul li:first-child{background:none repeat scroll 0 0 #eee}.ie7 .list-grid-demo-1 ul li.even,.ie8 .list-grid-demo-1 ul li.even{background:none repeat scroll 0 0 white}.ie7 .list-grid-demo-1 ul li.odd,.ie8 .list-grid-demo-1 ul li.odd{background:none repeat scroll 0 0 #eee}.nav-demo-1:before,.nav-demo-1:after{content:"";display:table}.nav-demo-1:after{clear:both}.ie6 .nav-demo-1,.ie7 .nav-demo-1{zoom:1}.nav-demo-1 ul{margin:0;padding:0;text-align:center;float:left}.nav-demo-1 ul:before,.nav-demo-1 ul:after{content:"";display:table}.nav-demo-1 ul:after{clear:both}.ie6 .nav-demo-1 ul,.ie7 .nav-demo-1 ul{zoom:1}.nav-demo-1 ul li{display:inline-block;height:40px;line-height:40px;float:left}.nav-demo-1 ul li a{display:block;padding:0 15px}.ie7 .nav-demo-1 ul li,.ie8 .nav-demo-1 ul li,.ie9 .nav-demo-1 ul li{height:46px}.nav-demo-1 ul{list-style:none;-webkit-box-shadow:0 6px 6px -6px black;-moz-box-shadow:0 6px 6px -6px black;box-shadow:0 6px 6px -6px black}.nav-demo-1 ul li{background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#fff),color-stop(100%,#e6e6e6));background-image:-webkit-linear-gradient(#fff,#e6e6e6);background-image:-moz-linear-gradient(#fff,#e6e6e6);background-image:-o-linear-gradient(#fff,#e6e6e6);background-image:linear-gradient(#fff,#e6e6e6);border-left:1px solid #acacac;border-top:1px solid #acacac;border-bottom:1px solid #acacac}.nav-demo-1 ul li:hover{background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#fff),color-stop(100%,#f2f2f2));background-image:-webkit-linear-gradient(#fff,#f2f2f2);background-image:-moz-linear-gradient(#fff,#f2f2f2);background-image:-o-linear-gradient(#fff,#f2f2f2);background-image:linear-gradient(#fff,#f2f2f2)}.nav-demo-1 ul li:first-child{-moz-border-radius-topleft:5px;-webkit-border-top-left-radius:5px;border-top-left-radius:5px;-moz-border-radius-bottomleft:5px;-webkit-border-bottom-left-radius:5px;border-bottom-left-radius:5px}.nav-demo-1 ul li:last-child{-moz-border-radius-topright:5px;-webkit-border-top-right-radius:5px;border-top-right-radius:5px;-moz-border-radius-bottomright:5px;-webkit-border-bottom-right-radius:5px;border-bottom-right-radius:5px;border-right:1px solid #acacac}.nav-demo-1 ul li a{font-size:16px;font-family:sans-serif}.nav-demo-1 ul .active{background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#e6e6e6),color-stop(100%,#fff));background-image:-webkit-linear-gradient(#e6e6e6,#fff);background-image:-moz-linear-gradient(#e6e6e6,#fff);background-image:-o-linear-gradient(#e6e6e6,#fff);background-image:linear-gradient(#e6e6e6,#fff)}.ie7 .nav-demo-1 ul li,.ie8 .nav-demo-1 ul li,.ie9 .nav-demo-1 ul li{border-left:0;border-top:0;border-bottom:0;background:transparent url('../img/picasso-nav.png') no-repeat center -1px}.ie7 .nav-demo-1 ul li a,.ie8 .nav-demo-1 ul li a,.ie9 .nav-demo-1 ul li a{border-left:1px solid #acacac}.ie7 .nav-demo-1 ul li:hover,.ie8 .nav-demo-1 ul li:hover,.ie9 .nav-demo-1 ul li:hover{background:transparent url('../img/picasso-nav.png') center -47px no-repeat}.ie7 .nav-demo-1 ul li:first-child,.ie8 .nav-demo-1 ul li:first-child,.ie9 .nav-demo-1 ul li:first-child{background:transparent url('../img/picasso-nav.png') no-repeat left -1px}.ie7 .nav-demo-1 ul li:first-child a,.ie8 .nav-demo-1 ul li:first-child a,.ie9 .nav-demo-1 ul li:first-child a{border-left:0}.ie7 .nav-demo-1 ul li:first-child:hover,.ie8 .nav-demo-1 ul li:first-child:hover,.ie9 .nav-demo-1 ul li:first-child:hover{background:transparent url('../img/picasso-nav.png') left -47px no-repeat}.ie7 .nav-demo-1 ul li:first-child.active,.ie8 .nav-demo-1 ul li:first-child.active,.ie9 .nav-demo-1 ul li:first-child.active{background:transparent url('../img/picasso-nav.png') no-repeat left -47px}.ie7 .nav-demo-1 ul .last,.ie8 .nav-demo-1 ul .last,.ie9 .nav-demo-1 ul .last{background:transparent url('../img/picasso-nav.png') no-repeat right -47px}.ie7 .nav-demo-1 ul .last:hover,.ie8 .nav-demo-1 ul .last:hover,.ie9 .nav-demo-1 ul .last:hover{background:transparent url('../img/picasso-nav.png') right -47px no-repeat}.ie7 .nav-demo-1 ul .active,.ie8 .nav-demo-1 ul .active,.ie9 .nav-demo-1 ul .active{background:transparent url('../img/picasso-nav.png') no-repeat center -47px}.ie7 .nav-demo-1 ul .last.active,.ie8 .nav-demo-1 ul .last.active,.ie9 .nav-demo-1 ul .last.active{background:transparent url('../img/picasso-nav.png') no-repeat right -47px}.ie9 .nav-demo-1 ul{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.ie9 .nav-demo-1 ul li:first-child{-moz-border-radius-topleft:none;-webkit-border-top-left-radius:none;border-top-left-radius:none;-moz-border-radius-bottomleft:none;-webkit-border-bottom-left-radius:none;border-bottom-left-radius:none}.ie9 .nav-demo-1 ul li:last-child{-moz-border-radius-topright:none;-webkit-border-top-right-radius:none;border-top-right-radius:none;-moz-border-radius-bottomright:none;-webkit-border-bottom-right-radius:none;border-bottom-right-radius:none;border:0}.picasso-_popups .styledocco-example{position:relative;height:150px}.popup-demo-1{padding:10px;position:absolute}.popup-demo-1:after,.ie7 .popup-demo-1 .after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:0}.popup-demo-1 .popup-header h4{line-height:20px;padding:10px}.popup-demo-1 .popup-container{z-index:1;position:relative}.popup-demo-1 .popup-arrow{position:absolute;height:0;width:0}.popup-demo-1 .popup-arrow-bottom{bottom:-10px;left:10px}.popup-demo-1 .popup-arrow-top{top:-10px;left:10px}.popup-demo-1 .popup-arrow-left{left:-10px;top:10px}.popup-demo-1 .popup-arrow-right{right:-10px;top:10px}.popup-demo-1 .popup-close{position:absolute;z-index:10;text-align:center;line-height:17px;height:20px;width:20px;top:-13px;right:-13px}.ie7 .popup-demo-1 .popup-close,.ie8 .popup-demo-1 .popup-close{line-height:23px;height:26px;width:26px;top:-13px;right:-13px}.ie7 .popup-demo-1{zoom:expression(this.runtimeStyle.zoom="1",this.appendChild(document.createElement("i")).className="after")}.popup-demo-1:after,.ie7 .popup-demo-1 .after{background:rgba(0,0,0,.7);-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;border-radius:3px;-webkit-box-shadow:rgba(0,0,0,.5) 0 0 10px;-moz-box-shadow:rgba(0,0,0,.5) 0 0 10px;box-shadow:rgba(0,0,0,.5) 0 0 10px}.popup-demo-1 .popup-header{background:none repeat scroll 0 0 #f7f7f7;display:block}.popup-demo-1 .popup-header h4{margin:0;color:#003770;font-family:sans-serif;font-size:16px;font-weight:normal}.popup-demo-1 .popup-content{background:white;border:1px solid transparent}.popup-demo-1 .popup-arrow-bottom{border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid rgba(0,0,0,.7)}.popup-demo-1 .popup-arrow-top{border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid rgba(0,0,0,.7)}.popup-demo-1 .popup-arrow-left{border-top:10px solid transparent;border-bottom:10px solid transparent;border-right:10px solid rgba(0,0,0,.7)}.popup-demo-1 .popup-arrow-right{border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:10px solid rgba(0,0,0,.7)}.popup-demo-1 .popup-close{cursor:pointer;border:3px solid white;color:white;font-weight:bold;font-family:sans-serif;font-size:16px;background:#319fda;-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border-radius:20px;-webkit-box-shadow:rgba(0,0,0,.5) 0 0 10px;-moz-box-shadow:rgba(0,0,0,.5) 0 0 10px;box-shadow:rgba(0,0,0,.5) 0 0 10px}.ie7 .popup-demo-1:after,.ie7 .popup-demo-1 .after,.ie8 .popup-demo-1:after,.ie8 .popup-demo-1 .after{background:black;filter:alpha(opacity=70)}.ie7 .popup-demo-1 .popup-arrow,.ie8 .popup-demo-1 .popup-arrow{filter:alpha(opacity=70)}.ie7 .popup-demo-1 .popup-arrow-bottom,.ie8 .popup-demo-1 .popup-arrow-bottom{border-top:10px solid black}.ie7 .popup-demo-1 .popup-arrow-top,.ie8 .popup-demo-1 .popup-arrow-top{border-bottom:10px solid black}.ie7 .popup-demo-1 .popup-arrow-left,.ie8 .popup-demo-1 .popup-arrow-left{border-right:10px solid black}.ie7 .popup-demo-1 .popup-arrow-right,.ie8 .popup-demo-1 .popup-arrow-right{border-left:10px solid black}.ie7 .popup-demo-1 .popup-close,.ie8 .popup-demo-1 .popup-close{border-width:0;background-color:transparent;background-image:url('../img/picasso-popup.png');background-position:0 -1px}.popup-demo-2{padding:10px;position:absolute}.popup-demo-2:after,.ie7 .popup-demo-2 .after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:0}.popup-demo-2 .popup-header h4{line-height:20px;padding:10px}.popup-demo-2 .popup-container{z-index:1;position:relative}.popup-demo-2 .popup-arrow{position:absolute;height:0;width:0}.popup-demo-2 .popup-arrow-bottom{bottom:-10px;left:10px}.popup-demo-2 .popup-arrow-top{top:-10px;left:10px}.popup-demo-2 .popup-arrow-left{left:-10px;top:10px}.popup-demo-2 .popup-arrow-right{right:-10px;top:10px}.popup-demo-2 .popup-close{position:absolute;z-index:10;text-align:center;line-height:17px;height:20px;width:20px;top:-13px;right:-13px}.ie7 .popup-demo-2 .popup-close,.ie8 .popup-demo-2 .popup-close{line-height:23px;height:26px;width:26px;top:-13px;right:-13px}.ie7 .popup-demo-2{zoom:expression(this.runtimeStyle.zoom="1",this.appendChild(document.createElement("i")).className="after")}.popup-demo-2:after,.ie7 .popup-demo-2 .after{background:rgba(1,61,147,.7);-webkit-border-radius:10px;-moz-border-radius:10px;-ms-border-radius:10px;-o-border-radius:10px;border-radius:10px;-webkit-box-shadow:rgba(0,0,0,.5) 0 0 20px;-moz-box-shadow:rgba(0,0,0,.5) 0 0 20px;box-shadow:rgba(0,0,0,.5) 0 0 20px}.popup-demo-2 .popup-header{background:rgba(1,61,147,.7);display:block}.popup-demo-2 .popup-header h4{margin:0;color:white;font-family:sans-serif;font-size:16px;font-weight:normal}.popup-demo-2 .popup-content{background:black;border:1px solid transparent}.popup-demo-2 .popup-arrow-bottom{border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid rgba(1,61,147,.7)}.popup-demo-2 .popup-arrow-top{border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid rgba(1,61,147,.7)}.popup-demo-2 .popup-arrow-left{border-top:10px solid transparent;border-bottom:10px solid transparent;border-right:10px solid rgba(1,61,147,.7)}.popup-demo-2 .popup-arrow-right{border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:10px solid rgba(1,61,147,.7)}.popup-demo-2 .popup-close{cursor:pointer;border:3px solid black;color:black;font-weight:bold;font-family:sans-serif;font-size:16px;background:red;-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border-radius:20px;-webkit-box-shadow:rgba(0,0,0,.5) 0 0 20px;-moz-box-shadow:rgba(0,0,0,.5) 0 0 20px;box-shadow:rgba(0,0,0,.5) 0 0 20px}.ie7 .popup-demo-2:after,.ie7 .popup-demo-2 .after,.ie8 .popup-demo-2:after,.ie8 .popup-demo-2 .after{background:#013d93;filter:alpha(opacity=70)}.ie7 .popup-demo-2 .popup-arrow,.ie8 .popup-demo-2 .popup-arrow{filter:alpha(opacity=70)}.ie7 .popup-demo-2 .popup-arrow-bottom,.ie8 .popup-demo-2 .popup-arrow-bottom{border-top:10px solid #013d93}.ie7 .popup-demo-2 .popup-arrow-top,.ie8 .popup-demo-2 .popup-arrow-top{border-bottom:10px solid #013d93}.ie7 .popup-demo-2 .popup-arrow-left,.ie8 .popup-demo-2 .popup-arrow-left{border-right:10px solid #013d93}.ie7 .popup-demo-2 .popup-arrow-right,.ie8 .popup-demo-2 .popup-arrow-right{border-left:10px solid #013d93}.ie7 .popup-demo-2 .popup-close,.ie8 .popup-demo-2 .popup-close{border-width:0;background-color:transparent;background-image:url('../img/picasso-popup.png');background-position:0 -27px}.bubble-demo-1{padding:10px;display:block;width:auto;position:relative;background:#eee;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px}.bubble-demo-1:after,.ie7 .bubble-demo-1 .after{content:"";position:absolute;bottom:-15px;right:20px;width:0;height:0}.ie7 .bubble-demo-1{zoom:expression(this.runtimeStyle.zoom="1",this.appendChild(document.createElement("i")).className="after")}.bubble-demo-1 blockquote{color:#999}.bubble-demo-1:after,.ie7 .bubble-demo-1 .after{border-left:10px solid transparent;border-right:10px solid transparent;border-top:15px solid #eee}.accordion-demo-1 .accordion-header{position:relative;height:20px;padding:0 10px;display:block}.accordion-demo-1 .accordion-header h4{line-height:20px;margin:0}.accordion-demo-1 .accordion-header .arrow{height:0;position:absolute;right:10px;width:0}.accordion-demo-1 .accordion-header-open .arrow{top:7.5px}.accordion-demo-1 .accordion-header-close .arrow{top:6px}.accordion-demo-1 .accordion-content{position:relative;top:-1px}.accordion-demo-1 .accordion-header{cursor:pointer;background:#013d93;border-bottom:1px solid white}.accordion-demo-1 .accordion-header h4{color:white;font-size:13px}.accordion-demo-1 .accordion-header-open .arrow{border-left:5px solid transparent;border-right:5px solid transparent;border-top:8px solid white}.accordion-demo-1 .accordion-header-close .arrow{border-left:8px solid white;border-bottom:5px solid transparent;border-top:5px solid transparent}.accordion-demo-1 .accordion-content{border:1px solid #ccc}.pagination-demo-1{text-align:center}.pagination-demo-1 ul{display:inline-block}.pagination-demo-1 ul li{display:inline-block;height:27px;text-align:center;float:left;margin-left:2px;margin-right:2px}.pagination-demo-1 ul li a{display:block;line-height:27px;min-width:27px}.pagination-demo-1 ul .prev{margin:0 10px 0 0}.pagination-demo-1 ul .next{margin:0 0 0 10px}.pagination-demo-1 ul .disabled{display:none}.pagination-demo-1 li{background:#eee;border:1px solid #ccc;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;list-style:none}.pagination-demo-1 li a{color:#319fda}.pagination-demo-1 li a:hover{color:white;text-decoration:none}.pagination-demo-1 li:hover{background:#013d93}.pagination-demo-1 .active,.pagination-demo-1 .prev,.pagination-demo-1 .next,.pagination-demo-1 .dots{background:0;border:0}.pagination-demo-1 .active a:hover,.pagination-demo-1 .prev a:hover,.pagination-demo-1 .next a:hover,.pagination-demo-1 .dots a:hover{color:#319fda}.pagination-demo-1 .active:hover,.pagination-demo-1 .prev:hover,.pagination-demo-1 .next:hover,.pagination-demo-1 .dots:hover{background:0}.pagination-demo-1 .prev:hover,.pagination-demo-1 .next:hover{text-decoration:underline}.pagination-demo-1 .active a,.pagination-demo-1 .dots a{color:#888;cursor:default;text-decoration:none}.pagination-demo-1 .active a:hover,.pagination-demo-1 .dots a:hover{color:#888;text-decoration:none}.text-input-demo-1{width:200px;height:20px;line-height:20px;padding:1px;border:1px solid #ddd;border-top:1px solid #919191;color:#333;font-size:11px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-border-radius:3px 3px 3px 3px;-moz-border-radius:3px 3px 3px 3px;-ms-border-radius:3px 3px 3px 3px;-o-border-radius:3px 3px 3px 3px;border-radius:3px 3px 3px 3px;-webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,.2) inset;-moz-box-shadow:0 1px 2px 0 rgba(0,0,0,.2) inset;box-shadow:0 1px 2px 0 rgba(0,0,0,.2) inset}.text-input-demo-1:focus{outline:0;border:1px solid #319fda;-webkit-box-shadow:rgba(0,0,0,.2) 0 1px 2px 0 inset,#01a9db 0 0 2px 0;-moz-box-shadow:rgba(0,0,0,.2) 0 1px 2px 0 inset,#01a9db 0 0 2px 0;box-shadow:rgba(0,0,0,.2) 0 1px 2px 0 inset,#01a9db 0 0 2px 0}.select-demo-1{width:200px;height:20px;line-height:20px;padding:1px;border:1px solid #ddd;border-top:1px solid #919191;color:#333;font-size:11px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-border-radius:3px 3px 3px 3px;-moz-border-radius:3px 3px 3px 3px;-ms-border-radius:3px 3px 3px 3px;-o-border-radius:3px 3px 3px 3px;border-radius:3px 3px 3px 3px;-webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,.2) inset;-moz-box-shadow:0 1px 2px 0 rgba(0,0,0,.2) inset;box-shadow:0 1px 2px 0 rgba(0,0,0,.2) inset}.select-demo-1:focus{outline:0;border:1px solid #319fda;-webkit-box-shadow:rgba(0,0,0,.2) 0 1px 2px 0 inset,#01a9db 0 0 2px 0;-moz-box-shadow:rgba(0,0,0,.2) 0 1px 2px 0 inset,#01a9db 0 0 2px 0;box-shadow:rgba(0,0,0,.2) 0 1px 2px 0 inset,#01a9db 0 0 2px 0}.arrow-demo-1,.arrow-demo-2,.arrow-demo-3,.arrow-demo-4{margin:0 10px 0 0}.arrow-demo-1{padding:0 5px;display:inline-block;height:14px;line-height:16px;position:relative;background:#888;color:white;font-family:sans-serif;font-style:normal;font-size:9px}.arrow-demo-1:after,.ie7 .arrow-demo-1 .after{content:"";position:absolute;top:0;right:-7px;width:0;height:0}.ie7 .arrow-demo-1{zoom:expression(this.runtimeStyle.zoom="1",this.appendChild(document.createElement("i")).className="after")}.arrow-demo-1:after,.ie7 .arrow-demo-1 .after{border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:7px solid #888}.arrow-demo-2{padding:0 5px;display:inline-block;height:14px;line-height:16px;position:relative;background:#b94a48;color:white;font-family:sans-serif;font-style:normal;font-size:9px}.arrow-demo-2:after,.ie7 .arrow-demo-2 .after{content:"";position:absolute;top:0;right:-7px;width:0;height:0}.ie7 .arrow-demo-2{zoom:expression(this.runtimeStyle.zoom="1",this.appendChild(document.createElement("i")).className="after")}.arrow-demo-2:after,.ie7 .arrow-demo-2 .after{border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:7px solid #b94a48}.arrow-demo-3{padding:0 5px;display:inline-block;height:14px;line-height:16px;position:relative;background:#f89406;color:white;font-family:sans-serif;font-style:normal;font-size:9px}.arrow-demo-3:after,.ie7 .arrow-demo-3 .after{content:"";position:absolute;top:0;right:-7px;width:0;height:0}.ie7 .arrow-demo-3{zoom:expression(this.runtimeStyle.zoom="1",this.appendChild(document.createElement("i")).className="after")}.arrow-demo-3:after,.ie7 .arrow-demo-3 .after{border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:7px solid #f89406}.arrow-demo-4{padding:0 5px;display:inline-block;height:14px;line-height:16px;position:relative;background:#468847;color:white;font-family:sans-serif;font-style:normal;font-size:9px}.arrow-demo-4:after,.ie7 .arrow-demo-4 .after{content:"";position:absolute;top:0;right:-7px;width:0;height:0}.ie7 .arrow-demo-4{zoom:expression(this.runtimeStyle.zoom="1",this.appendChild(document.createElement("i")).className="after")}.arrow-demo-4:after,.ie7 .arrow-demo-4 .after{border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:7px solid #468847}.mini-tooltip-demo-1{color:white;font-size:11px;float:left;position:relative;padding:0 10px;margin-left:10px;z-index:0;line-height:20px}.mini-tooltip-demo-1:after,.ie7 .mini-tooltip-demo-1 .after{opacity:.5;border-top:7px solid transparent;border-bottom:7px solid transparent;border-right:7px solid black}.mini-tooltip-demo-1:before,.ie7 .mini-tooltip-demo-1 .before{background:black;opacity:.5}.ie7 .mini-tooltip-demo-1:before,.ie7 .mini-tooltip-demo-1 .before,.ie8 .mini-tooltip-demo-1:before,.ie8 .mini-tooltip-demo-1 .before{filter:alpha(opacity=50);opacity:.5}.mini-tooltip-demo-1:after,.ie7 .mini-tooltip-demo-1 .after{content:"";position:absolute;width:0;height:0;left:-7px;top:3px}.mini-tooltip-demo-1:before,.ie7 .mini-tooltip-demo-1 .before{content:"";position:absolute;width:100%;height:20px;top:0;left:0;z-index:-1}.ie7 .mini-tooltip-demo-1{zoom:expression(this.runtimeStyle.zoom="1",this.insertBefore(document.createElement("i"),this.firstChild).className="before")}.ie7 .mini-tooltip-demo-1 .before{zoom:expression(this.runtimeStyle.zoom="1",this.appendChild(document.createElement("i")).className="after")}.mini-tooltip-demo-2{color:black;font-size:11px;float:left;position:relative;padding:0 10px;margin-left:10px;z-index:0;line-height:30px}.mini-tooltip-demo-2:after,.ie7 .mini-tooltip-demo-2 .after{opacity:.4;border-top:7px solid transparent;border-bottom:7px solid transparent;border-right:7px solid red}.mini-tooltip-demo-2:before,.ie7 .mini-tooltip-demo-2 .before{background:red;opacity:.4}.ie7 .mini-tooltip-demo-2:before,.ie7 .mini-tooltip-demo-2 .before,.ie8 .mini-tooltip-demo-2:before,.ie8 .mini-tooltip-demo-2 .before{filter:alpha(opacity=40);opacity:.4}.mini-tooltip-demo-2:after,.ie7 .mini-tooltip-demo-2 .after{content:"";position:absolute;width:0;height:0;left:-7px;top:8px}.mini-tooltip-demo-2:before,.ie7 .mini-tooltip-demo-2 .before{content:"";position:absolute;width:100%;height:30px;top:0;left:0;z-index:-1}.ie7 .mini-tooltip-demo-2{zoom:expression(this.runtimeStyle.zoom="1",this.insertBefore(document.createElement("i"),this.firstChild).className="before")}.ie7 .mini-tooltip-demo-2 .before{zoom:expression(this.runtimeStyle.zoom="1",this.appendChild(document.createElement("i")).className="after")}.mini-tooltip-demo-3{color:white;font-size:11px;float:left;position:relative;padding:0 10px;margin-left:10px;z-index:0;line-height:20px}.mini-tooltip-demo-3:after,.ie7 .mini-tooltip-demo-3 .after{opacity:1;border-top:7px solid transparent;border-bottom:7px solid transparent;border-right:7px solid #013d93}.mini-tooltip-demo-3:before,.ie7 .mini-tooltip-demo-3 .before{background:#013d93;opacity:1}.ie7 .mini-tooltip-demo-3:before,.ie7 .mini-tooltip-demo-3 .before,.ie8 .mini-tooltip-demo-3:before,.ie8 .mini-tooltip-demo-3 .before{filter:alpha(opacity=100);opacity:1}.mini-tooltip-demo-3:after,.ie7 .mini-tooltip-demo-3 .after{content:"";position:absolute;width:0;height:0;left:-7px;top:3px}.mini-tooltip-demo-3:before,.ie7 .mini-tooltip-demo-3 .before{content:"";position:absolute;width:100%;height:20px;top:0;left:0;z-index:-1}.ie7 .mini-tooltip-demo-3{zoom:expression(this.runtimeStyle.zoom="1",this.insertBefore(document.createElement("i"),this.firstChild).className="before")}.ie7 .mini-tooltip-demo-3 .before{zoom:expression(this.runtimeStyle.zoom="1",this.appendChild(document.createElement("i")).className="after")}.container{width:90%;max-width:1200px;min-width:950px}.row-col{width:100%}.row-col:before,.row-col:after{content:"";display:table}.row-col:after{clear:both}.ie6 .row-col,.ie7 .row-col{zoom:1}.row-col [class^="col"]{width:100%;min-height:25px;display:block;float:left;margin-left:2.174%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.row-col [class^="col"]:first-child{margin-left:0}.row-col [class^="col"] img{max-width:100%}.row-col .col1{width:6.341%}.ie7 .row-col .col1{width:6.249%}.row-col [class^="col"].offset1{margin-left:10.507%}.row-col [class^="col"].offset1:first-child{margin-left:8.424%}.row-col .col2{width:14.855%}.ie7 .row-col .col2{width:14.763%}.row-col [class^="col"].offset2{margin-left:19.022%}.row-col [class^="col"].offset2:first-child{margin-left:16.938%}.row-col .col3{width:23.37%}.ie7 .row-col .col3{width:23.278%}.row-col [class^="col"].offset3{margin-left:27.536%}.row-col [class^="col"].offset3:first-child{margin-left:25.453%}.row-col .col4{width:31.884%}.ie7 .row-col .col4{width:31.792%}.row-col [class^="col"].offset4{margin-left:36.051%}.row-col [class^="col"].offset4:first-child{margin-left:33.967%}.row-col .col5{width:40.399%}.ie7 .row-col .col5{width:40.307%}.row-col [class^="col"].offset5{margin-left:44.565%}.row-col [class^="col"].offset5:first-child{margin-left:42.482%}.row-col .col6{width:48.913%}.ie7 .row-col .col6{width:48.821%}.row-col [class^="col"].offset6{margin-left:53.08%}.row-col [class^="col"].offset6:first-child{margin-left:50.996%}.row-col .col7{width:57.428%}.ie7 .row-col .col7{width:57.336%}.row-col [class^="col"].offset7{margin-left:61.594%}.row-col [class^="col"].offset7:first-child{margin-left:59.511%}.row-col .col8{width:65.942%}.ie7 .row-col .col8{width:65.85%}.row-col [class^="col"].offset8{margin-left:70.109%}.row-col [class^="col"].offset8:first-child{margin-left:68.025%}.row-col .col9{width:74.457%}.ie7 .row-col .col9{width:74.365%}.row-col [class^="col"].offset9{margin-left:78.623%}.row-col [class^="col"].offset9:first-child{margin-left:76.54%}.row-col .col10{width:82.971%}.ie7 .row-col .col10{width:82.879%}.row-col [class^="col"].offset10{margin-left:87.138%}.row-col [class^="col"].offset10:first-child{margin-left:85.054%}.row-col .col11{width:91.486%}.ie7 .row-col .col11{width:91.394%}.row-col [class^="col"].offset11{margin-left:95.652%}.row-col [class^="col"].offset11:first-child{margin-left:93.569%}.row-col .col12{width:100%}.row-col [class^="col"].offset12{margin-left:104.167%}.row-col [class^="col"].offset12:first-child{margin-left:102.083%}.row-col{margin:10px 0}[class^="col"]{-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;background:#ccc}[class^="col"] [class^="col"]{background:#aaa}[class^="col"] [class^="col"] [class^="col"]{background:#696969;color:#c0c0c0}.clearfix-demo{background:#58608d;width:100%;padding:10px}.clearfix-demo:before,.clearfix-demo:after{content:"";display:table}.clearfix-demo:after{clear:both}.ie6 .clearfix-demo,.ie7 .clearfix-demo{zoom:1}.clearfix-demo div{background:white}.despegar-size-1-demo{font-size:11px}.despegar-size-2-demo{font-size:13px}.despegar-size-3-demo{font-size:16px}.despegar-size-4-demo{font-size:20px}.despegar-size-5-demo{font-size:24px}.despegar-size-6-demo{font-size:28px}.despegar-black-demo{padding:10px;background:black;color:white}.despegar-white-demo{padding:10px;background:white}.despegar-yellow-demo{padding:10px;background:#ff3}.despegar-red-demo{padding:10px;background:red}.despegar-blue-demo{padding:10px;background:#013d93;color:white}.despegar-gray-1-demo{padding:10px;background:#222;color:white}.despegar-gray-2-demo{padding:10px;background:#444;color:white}.despegar-gray-3-demo{padding:10px;background:#666;color:white}.despegar-gray-4-demo{padding:10px;background:#888;color:white}.despegar-gray-5-demo{padding:10px;background:#aaa;color:white}.despegar-gray-6-demo{padding:10px;background:#ccc}.despegar-gray-7-demo{padding:10px;background:#eee}.despegar-searchbox-bg-demo{padding:10px;background:#ff3}.despegar-title-color-demo{padding:10px;background:#013d93;color:white}.despegar-titlealt-color-demo{padding:10px;background:#f90}.despegar-link-color-demo{padding:10px;background:#319fda}.despegar-link-color-hover-demo{padding:10px;background:#6cf}.despegar-error-bg-demo{padding:10px;background:#ffe6e6}.despegar-error-border-demo{padding:10px;background:red}.despegar-warning-bg-demo{padding:10px;background:#ffffe1}.despegar-warning-border-demo{padding:10px;background:#fc3}body{width:100%;max-width:100%;margin:0;padding:0;background-color:#f6f7f9}.styledocco-sidebar,.styledocco-docs>:not(.styledocco-example){box-sizing:content-box;margin:15px 20px;color:#334;line-height:1.618;font-family:sans-serif;-webkit-font-smoothing:subpixel-antialiased}.styledocco-sidebar,.styledocco-docs>p,.styledocco-docs>ul,.styledocco-docs>ol,.styledocco-docs>a{font-size:12px}.styledocco-docs>h1,.styledocco-docs>h2,.styledocco-docs>h3,.styledocco-docs>h4,.styledocco-docs>h5,.styledocco-docs>h6{font-weight:bold;margin:25px 20px 0!important;line-height:1.2!important;color:#555f6a!important}.styledocco-docs>:not(.styledocco-example) a{color:#27a;text-decoration:none}.styledocco-docs>:not(.styledocco-example) a:hover{color:#157;text-decoration:underline}.styledocco-docs>:not(.styledocco-example) a:visited{color:#146}.styledocco-docs>:not(.styledocco-example):not(pre) var,.styledocco-docs>:not(.styledocco-example):not(pre) code{padding:.1em 3px;background:rgba(0,0,0,.025);border:1px solid rgba(0,0,0,.05);border-radius:3px;font-style:normal;font-family:"Ubuntu Mono","Andale Mono","DejaVu Sans Mono","Monaco","Bitstream Vera Sans Mono","Consolas","Lucida Console",monospace}.styledocco-code pre code,.styledocco-docs>pre samp,.styledocco-docs>pre code{padding:0;background:transparent;border:0;font-family:"Ubuntu Mono","Andale Mono","DejaVu Sans Mono","Monaco","Bitstream Vera Sans Mono","Consolas","Lucida Console",monospace;font-size:12px}.styledocco-code code::selection,.styledocco-docs>pre code::selection{background:#248;color:#fff}.styledocco-container{width:95%;max-width:1500px;margin:0 auto}.styledocco-main{float:right;width:83%}.styledocco-sidebar{position:fixed;width:9%;padding:1%}.styledocco-section{position:relative;min-height:200px}.styledocco-sidebar{max-height:90%;overflow-y:auto;margin-top:20px;word-wrap:break-word;background-color:#777f88;border-radius:5px;box-shadow:0 0 5px rgba(0,0,0,.25);opacity:.75;-webkit-transition:opacity 2.5s;-moz-transition:opacity 2.5s;-o-transition:opacity 2.5s}.styledocco-sidebar:hover{opacity:1;-webkit-transition:opacity .5s;-moz-transition:opacity .5s;-o-transition:opacity .5s}.styledocco-sidebar a{text-decoration:none}.styledocco-brand{display:block;margin:0 0 10px;text-align:center;color:#eee;font-size:16px;font-weight:bold;text-shadow:rgba(0,0,0,.5) 0 0 1px}.styledocco-brand:hover{color:#fff;text-decoration:none}.styledocco-nav{margin:0;padding:0}.styledocco-nav-heading{display:block;padding:.3em 0;margin:.5em 0 0;color:#ddd;font-size:13px;text-shadow:rgba(0,0,0,.25) 0 0 1px}.styledocco-nav li{margin:0;padding:0;list-style:none;border-top:1px solid rgba(255,255,255,.1)}.styledocco-nav li:active,.styledocco-nav li:focus,.styledocco-nav li:hover{background:rgba(255,255,255,.2);border-color:transparent;border-radius:3px;text-decoration:none}.styledocco-nav li:active + li,.styledocco-nav li:focus + li,.styledocco-nav li:hover + li{border-color:transparent}.styledocco-nav a{display:block;padding:.2em 5%;color:#f7f7f7}.styledocco-docs{position:relative;width:58%;min-height:200px;margin:20px 0 40px;background:#fff;background-clip:padding-box;border:1px solid rgba(0,0,0,.1);border-radius:5px;box-shadow:0 0 3px rgba(0,0,0,.1)}.styledocco-code{position:absolute;top:5px;bottom:5px;right:0;width:42%;overflow:auto;padding:10px;-moz-box-sizing:border-box;box-sizing:border-box;border-radius:0 5px 5px 0;border:1px solid rgba(0,0,0,.1);background:rgba(255,255,255,.75);opacity:.75;-webkit-transition:opacity .25s;-moz-transition:opacity .25s;-o-transition:opacity .25s}.styledocco-code:hover{opacity:1}.styledocco-example{margin-top:10px;padding:15px;overflow:auto;background:url(data:image/png;base64,ivborw0kggoaaaansuheugaaabaaaaaqaqmaaaalpw0iaaaaaxnsr0iars4c6qaaaazqtfrf+vr6////+o8bnqaaabbjrefucb1jypjpgbxheayafr8p8bm+jeoaaaaasuvork5cyii=);border-top:1px dotted #dcdce1}pre + .styledocco-example{margin-top:0;border-top:0}.styledocco-example:before,.styledocco-example:after{display:table;content:""}.styledocco-example:after{clear:both}.styledocco-docs>pre,.styledocco-code pre{white-space:pre-wrap;word-wrap:break-word;color:#445;margin:0!important;line-height:1.1!important}.styledocco-docs>.pilcrow{position:absolute;right:0;top:0;text-decoration:none;font-weight:bold;opacity:.5}.styledocco-docs>.pilcrow:hover{opacity:1}.styledocco-docs>pre{max-height:200px;overflow-y:auto;padding:10px 20px;background:#f8f9fb;border:1px solid rgba(220,220,225,.8);border-left:0;border-right:0}.styledocco-example + pre{border-top:1px dotted #dcdce1}.styledocco-docs>pre:first-child{border-top:0}.styledocco-docs>pre:last-child{border-bottom:0}.styledocco-code pre{padding:0;background:transparent;border:0}</style></head><body class="picasso-_picasso"><div class="styledocco-container"><div class="styledocco-sidebar"><a href="index.html" class="styledocco-brand">Picasso</a><ul class="styledocco-nav"><li><a href="_picasso.html">_picasso
+</a></li></ul><strong class="styledocco-nav-heading">picasso</strong><ul class="styledocco-nav"><li><a href="picasso-_components.html">_components
+</a></li><li><a href="picasso-_despegar.html">_despegar
+</a></li><li><a href="picasso-_utils.html">_utils
+</a></li></ul><strong class="styledocco-nav-heading">components</strong><ul class="styledocco-nav"><li><a href="picasso-components-_accordions.html">_accordions
+</a></li><li><a href="picasso-components-_arrows.html">_arrows
+</a></li><li><a href="picasso-components-_bubbles.html">_bubbles
+</a></li><li><a href="picasso-components-_buttons.html">_buttons
+</a></li><li><a href="picasso-components-_inputs.html">_inputs
+</a></li><li><a href="picasso-components-_list-grids.html">_list-grids
+</a></li><li><a href="picasso-components-_mini-tooltips.html">_mini-tooltips
+</a></li><li><a href="picasso-components-_navs.html">_navs
+</a></li><li><a href="picasso-components-_pagination.html">_pagination
+</a></li><li><a href="picasso-components-_popups.html">_popups
+</a></li></ul><strong class="styledocco-nav-heading">buttons</strong><ul class="styledocco-nav"><li><a href="picasso-components-buttons-_3d.html">_3d
+</a></li><li><a href="picasso-components-buttons-_glossy.html">_glossy
+</a></li><li><a href="picasso-components-buttons-_mini.html">_mini
+</a></li></ul><strong class="styledocco-nav-heading">despegar</strong><ul class="styledocco-nav"><li><a href="picasso-despegar-_variables.html">_variables
+</a></li></ul><strong class="styledocco-nav-heading">utils</strong><ul class="styledocco-nav"><li><a href="picasso-utils-_clearfix.html">_clearfix
+</a></li><li><a href="picasso-utils-_grid.html">_grid
+</a></li><li><a href="picasso-utils-_ie.html">_ie
+</a></li><li><a href="picasso-utils-_sprite.html">_sprite
+</a></li></ul></div><div class="styledocco-main"><div id="section-1" class="styledocco-section"><div class="styledocco-docs"><a href="#section-1" class="pilcrow">&#182;</a><h2>Picasso</h2>
+<p> M&oacute;dulo principal que importa los siguientes sub-m&oacute;dulos:
+</p>
+<ul>
+<li><code>utils</code> (<a href="picasso-_utils.html">secci&oacute;n dedicada</a>)</li>
+<li><code>components</code> (<a href="picasso-_components.html">secci&oacute;n dedicada</a>)</li>
+<li><code>despegar</code> (<a href="picasso-_utils.html">secci&oacute;n dedicada</a>)</li>
+</ul>
+<h3>Sass</h3>
+<h4>Import</h4>
+<p> <code>@import &quot;picasso&quot;;</code>
+</p>
+</div><div class="styledocco-code"><pre><code>@import "picasso/utils";
+@import "picasso/components";
+@import "picasso/despegar";</code></pre></div></div></div></div><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><script>(function(){"use strict";var a=function(a){return Array.prototype.slice.call(a,0)},b=function(a,b){return a+b},c=["link","visited","hover","active","focus","target","enabled","disabled","checked"],d=new RegExp(":(("+c.join(")|(")+"))","gi"),e=a(document.styleSheets).filter(function(a){return a.href==null}).map(function(c){return a(c.cssRules).filter(function(a){return a.selectorText&&a.selectorText.match(d)}).map(function(a){return a.cssText.replace(d,".\\3A $1")}).reduce(b)}).reduce(b,"");if(e.length){var f=document.createElement("style");return f.innerText=e,document.querySelectorAll("head")[0].appendChild(f)}})(),$(document).ready(function(){$(".accordion-header").click(function(){var a=$(this),b=a.parent().find(".accordion-content");b.slideToggle("fast"),a.hasClass("accordion-header-open")?(a.removeClass("accordion-header-open"),a.addClass("accordion-header-close")):(a.removeClass("accordion-header-close"),a.addClass("accordion-header-open"))})})</script></body></html><!-- Generated with StyleDocco (http://jacobrask.github.com/styledocco). -->

data/docs/config.rb

@@ -3,7 +3,7 @@ require 'magick'
 
 css_dir           = "css"
 sass_dir          = "sass"
-sass_options      = { :cache => false }
+#sass_options      = { :cache => false }
 line_comments     = false
 output_style      = :expanded
 add_import_path "../stylesheets"

data/docs/css/{style.css → picasso-docs.css}

@@ -1,3 +1,7 @@
+.styledocco-docs img {
+  width: 100%;
+}
+
 .button-glossy-demo-1 {
   width: 90px;
   height: 30px;
@@ -367,129 +371,6 @@
   border-radius: none;
 }
 
-.button-glossy-demo-4 {
-  width: 250px;
-  height: 30px;
-  display: inline-block;
-  text-align: center;
-  position: relative;
-  z-index: 1;
-  font-family: sans-serif;
-  font-size: 12px;
-  text-decoration: none;
-  cursor: pointer;
-  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #62c462), color-stop(100%, #4fbd4f)), -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #42b142), color-stop(100%, #2d792d));
-  background: -webkit-linear-gradient(#62c462, #4fbd4f), -webkit-linear-gradient(#42b142, #2d792d);
-  background: -moz-linear-gradient(#62c462, #4fbd4f), -moz-linear-gradient(#42b142, #2d792d);
-  background: -o-linear-gradient(#62c462, #4fbd4f), -o-linear-gradient(#42b142, #2d792d);
-  background: linear-gradient(#62c462, #4fbd4f), linear-gradient(#42b142, #2d792d);
-  -webkit-border-radius: 5px;
-  -moz-border-radius: 5px;
-  -ms-border-radius: 5px;
-  -o-border-radius: 5px;
-  border-radius: 5px;
-  background-position: left top, left 15px;
-}
-.button-glossy-demo-4:after, .button-glossy-demo-4:before {
-  content: "";
-  position: absolute;
-  display: inline-block;
-}
-.button-glossy-demo-4:after {
-  width: 248px;
-  height: 28px;
-  left: 1px;
-  top: 1px;
-  z-index: 2;
-}
-.button-glossy-demo-4:before {
-  width: 246px;
-  height: 26px;
-  left: 2px;
-  top: 2px;
-  z-index: 3;
-}
-.button-glossy-demo-4 span {
-  position: relative;
-  z-index: 4;
-  line-height: 30px;
-}
-.button-glossy-demo-4 span {
-  color: white;
-}
-.button-glossy-demo-4:after, .button-glossy-demo-4:before {
-  -webkit-border-radius: 4px;
-  -moz-border-radius: 4px;
-  -ms-border-radius: 4px;
-  -o-border-radius: 4px;
-  border-radius: 4px;
-}
-.button-glossy-demo-4:after {
-  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(15%, #d1eed1), color-stop(100%, #122f12)) 50%;
-  background: -webkit-linear-gradient(#d1eed1 15%, #122f12) 50%;
-  background: -moz-linear-gradient(#d1eed1 15%, #122f12) 50%;
-  background: -o-linear-gradient(#d1eed1 15%, #122f12) 50%;
-  background: linear-gradient(#d1eed1 15%, #122f12) 50%;
-}
-.button-glossy-demo-4:before {
-  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #62c462), color-stop(100%, #4fbd4f)), -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #42b142), color-stop(100%, #2d792d));
-  background: -webkit-linear-gradient(#62c462, #4fbd4f), -webkit-linear-gradient(#42b142, #2d792d);
-  background: -moz-linear-gradient(#62c462, #4fbd4f), -moz-linear-gradient(#42b142, #2d792d);
-  background: -o-linear-gradient(#62c462, #4fbd4f), -o-linear-gradient(#42b142, #2d792d);
-  background: linear-gradient(#62c462, #4fbd4f), linear-gradient(#42b142, #2d792d);
-  background-position: left top, left 13px;
-}
-.button-glossy-demo-4, .button-glossy-demo-4:before {
-  background-size: 100% 50%;
-  background-repeat: no-repeat;
-}
-.button-glossy-demo-4:hover {
-  text-decoration: none;
-  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #9ad99a), color-stop(50%, #48ba48), color-stop(100%, #52d452));
-  background: -webkit-linear-gradient(#9ad99a, #48ba48, #52d452);
-  background: -moz-linear-gradient(#9ad99a, #48ba48, #52d452);
-  background: -o-linear-gradient(#9ad99a, #48ba48, #52d452);
-  background: linear-gradient(#9ad99a, #48ba48, #52d452);
-}
-.button-glossy-demo-4:hover:after {
-  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #dcf2dc), color-stop(100%, #57c057)) 50%;
-  background: -webkit-linear-gradient(#dcf2dc 20%, #57c057) 50%;
-  background: -moz-linear-gradient(#dcf2dc 20%, #57c057) 50%;
-  background: -o-linear-gradient(#dcf2dc 20%, #57c057) 50%;
-  background: linear-gradient(#dcf2dc 20%, #57c057) 50%;
-}
-.button-glossy-demo-4:hover:before {
-  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #9ad99a), color-stop(50%, #48ba48), color-stop(100%, #52d452));
-  background: -webkit-linear-gradient(#9ad99a, #48ba48, #52d452);
-  background: -moz-linear-gradient(#9ad99a, #48ba48, #52d452);
-  background: -o-linear-gradient(#9ad99a, #48ba48, #52d452);
-  background: linear-gradient(#9ad99a, #48ba48, #52d452);
-}
-.button-glossy-demo-4:hover, .button-glossy-demo-4:hover:before {
-  background-size: 100% 100%;
-  background-position: left top;
-  background-repeat: no-repeat;
-}
-.ie7 .button-glossy-demo-4, .ie8 .button-glossy-demo-4, .ie9 .button-glossy-demo-4 {
-  -webkit-border-radius: none;
-  -moz-border-radius: none;
-  -ms-border-radius: none;
-  -o-border-radius: none;
-  border-radius: none;
-  background: url('../img/picasso-buttons-glossy.png');
-  background-position: 0 -181px;
-}
-.ie7 .button-glossy-demo-4:hover, .ie8 .button-glossy-demo-4:hover, .ie9 .button-glossy-demo-4:hover {
-  background-position: 0 -211px;
-}
-.ie9 .button-glossy-demo-4 {
-  -webkit-border-radius: none;
-  -moz-border-radius: none;
-  -ms-border-radius: none;
-  -o-border-radius: none;
-  border-radius: none;
-}
-
 .button-3d-demo-1 {
   overflow: hidden;
   display: inline-block;
@@ -1272,178 +1153,63 @@
   box-shadow: none;
 }
 
-.text-input-demo-1 {
-  width: 200px;
-  height: 20px;
-  line-height: 20px;
-  padding: 1px;
-  border: 1px solid #dddddd;
-  border-top: 1px solid #919191;
-  color: #333333;
-  font-size: 11px;
-  -webkit-box-sizing: border-box;
-  -moz-box-sizing: border-box;
-  box-sizing: border-box;
-  -webkit-border-radius: 3px 3px 3px 3px;
-  -moz-border-radius: 3px 3px 3px 3px;
-  -ms-border-radius: 3px 3px 3px 3px;
-  -o-border-radius: 3px 3px 3px 3px;
-  border-radius: 3px 3px 3px 3px;
-  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
-  -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
+.list-grid-demo-1:before, .list-grid-demo-1:after {
+  content: "";
+  display: table;
 }
-.text-input-demo-1:focus {
-  outline: 0;
-  border: 1px solid #319fda;
-  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
-  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
-  box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
+.list-grid-demo-1:after {
+  clear: both;
 }
-
-.text-input-demo-2 {
-  width: 120px;
-  height: 20px;
-  line-height: 20px;
-  padding: 1px;
-  border: 1px solid red;
-  border-top: 1px solid #660000;
-  color: #333333;
-  font-size: 11px;
-  -webkit-box-sizing: border-box;
-  -moz-box-sizing: border-box;
-  box-sizing: border-box;
-  -webkit-border-radius: 10px;
-  -moz-border-radius: 10px;
-  -ms-border-radius: 10px;
-  -o-border-radius: 10px;
-  border-radius: 10px;
-  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
-  -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
+.ie6 .list-grid-demo-1, .ie7 .list-grid-demo-1 {
+  zoom: 1;
 }
-.text-input-demo-2:focus {
-  outline: 0;
-  border: 1px solid green;
-  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
-  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
-  box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
+.list-grid-demo-1 ul {
+  float: left;
+  padding: 0px;
+  margin: 0px;
+  width: 130px;
 }
-
-.text-input-demo-3 {
-  width: 200px;
-  height: 40px;
-  line-height: 40px;
-  padding: 1px;
-  border: 1px solid #dddddd;
-  border-top: 1px solid #919191;
-  color: blue;
-  font-size: 25px;
-  -webkit-box-sizing: border-box;
-  -moz-box-sizing: border-box;
-  box-sizing: border-box;
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  -ms-border-radius: 3px;
-  -o-border-radius: 3px;
-  border-radius: 3px;
-  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
-  -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
+.list-grid-demo-1 ul li {
+  height: 30px;
+  line-height: 30px;
+  padding-left: 10px;
+  padding-right: 10px;
 }
-.text-input-demo-3:focus {
-  outline: 0;
-  border: 1px solid blue;
-  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
-  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
-  box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
+.list-grid-demo-1 ul {
+  list-style: none outside none;
+  border-top: 1px solid #cccccc;
+  border-bottom: 1px solid #cccccc;
+  border-right: 1px solid #cccccc;
 }
-
-.select-demo-1 {
-  width: 200px;
-  height: 20px;
-  line-height: 20px;
-  padding: 1px;
-  border: 1px solid #dddddd;
-  border-top: 1px solid #919191;
-  color: #333333;
-  font-size: 11px;
-  -webkit-box-sizing: border-box;
-  -moz-box-sizing: border-box;
-  box-sizing: border-box;
-  -webkit-border-radius: 3px 3px 3px 3px;
-  -moz-border-radius: 3px 3px 3px 3px;
-  -ms-border-radius: 3px 3px 3px 3px;
-  -o-border-radius: 3px 3px 3px 3px;
-  border-radius: 3px 3px 3px 3px;
-  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
-  -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
+.list-grid-demo-1 ul:first-child {
+  border-left: 1px solid #cccccc;
 }
-.select-demo-1:focus {
-  outline: 0;
-  border: 1px solid #319fda;
-  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
-  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
-  box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
+.list-grid-demo-1 ul li {
+  text-align: center;
+  border: 1px solid transparent;
 }
-
-.select-demo-2 {
-  width: 120px;
-  height: 20px;
-  line-height: 20px;
-  padding: 1px;
-  border: 1px solid red;
-  border-top: 1px solid #660000;
-  color: #333333;
-  font-size: 11px;
-  -webkit-box-sizing: border-box;
-  -moz-box-sizing: border-box;
-  box-sizing: border-box;
-  -webkit-border-radius: 10px;
-  -moz-border-radius: 10px;
-  -ms-border-radius: 10px;
-  -o-border-radius: 10px;
-  border-radius: 10px;
-  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
-  -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
+.list-grid-demo-1 ul li:first-child {
+  border-bottom: 1px solid #cccccc;
 }
-.select-demo-2:focus {
-  outline: 0;
-  border: 1px solid green;
-  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
-  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
-  box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
+.list-grid-demo-1 ul li:nth-child(odd) {
+  background: none repeat scroll 0 0 #eeeeee;
 }
-
-.select-demo-3 {
-  width: 200px;
-  height: 40px;
-  line-height: 40px;
-  padding: 1px;
-  border: 1px solid #dddddd;
-  border-top: 1px solid #919191;
-  color: blue;
-  font-size: 25px;
-  -webkit-box-sizing: border-box;
-  -moz-box-sizing: border-box;
-  box-sizing: border-box;
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  -ms-border-radius: 3px;
-  -o-border-radius: 3px;
-  border-radius: 3px;
-  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
-  -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
+.list-grid-demo-1 ul li:nth-child(even) {
+  background: none repeat scroll 0 0 white;
 }
-.select-demo-3:focus {
-  outline: 0;
-  border: 1px solid blue;
-  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
-  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
-  box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
+.list-grid-demo-1 ul li.cell-hover:hover {
+  border: 1px solid #319fda;
+  background: #f4fafd;
+  cursor: pointer;
+}
+.ie7 .list-grid-demo-1 ul li:first-child, .ie8 .list-grid-demo-1 ul li:first-child {
+  background: none repeat scroll 0 0 #eeeeee;
+}
+.ie7 .list-grid-demo-1 ul li.even, .ie8 .list-grid-demo-1 ul li.even {
+  background: none repeat scroll 0 0 white;
+}
+.ie7 .list-grid-demo-1 ul li.odd, .ie8 .list-grid-demo-1 ul li.odd {
+  background: none repeat scroll 0 0 #eeeeee;
 }
 
 .nav-demo-1:before, .nav-demo-1:after {
@@ -1595,468 +1361,540 @@
   border: none;
 }
 
-.nav-demo-2:before, .nav-demo-2:after {
-  content: "";
-  display: table;
-}
-.nav-demo-2:after {
-  clear: both;
-}
-.ie6 .nav-demo-2, .ie7 .nav-demo-2 {
-  zoom: 1;
+.picasso-_popups .styledocco-example {
+  position: relative;
+  height: 150px;
 }
-.nav-demo-2 ul {
-  margin: 0;
-  padding: 0;
-  text-align: center;
-  float: right;
+
+.popup-demo-1 {
+  padding: 10px;
+  position: absolute;
 }
-.nav-demo-2 ul:before, .nav-demo-2 ul:after {
+.popup-demo-1:after, .ie7 .popup-demo-1 .after {
   content: "";
-  display: table;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  width: 100%;
+  height: 100%;
+  z-index: 0;
 }
-.nav-demo-2 ul:after {
-  clear: both;
+.popup-demo-1 .popup-header h4 {
+  line-height: 20px;
+  padding: 10px;
 }
-.ie6 .nav-demo-2 ul, .ie7 .nav-demo-2 ul {
-  zoom: 1;
+.popup-demo-1 .popup-container {
+  z-index: 1;
+  position: relative;
 }
-.nav-demo-2 ul li {
-  display: inline-block;
-  height: 30px;
-  line-height: 30px;
-  float: left;
+.popup-demo-1 .popup-arrow {
+  position: absolute;
+  height: 0px;
+  width: 0px;
 }
-.nav-demo-2 ul li a {
-  display: block;
-  padding: 0 15px;
+.popup-demo-1 .popup-arrow-bottom {
+  bottom: -10px;
+  left: 10px;
 }
-.ie7 .nav-demo-2 ul li, .ie8 .nav-demo-2 ul li, .ie9 .nav-demo-2 ul li {
-  height: 36px;
+.popup-demo-1 .popup-arrow-top {
+  top: -10px;
+  left: 10px;
 }
-.nav-demo-2 ul {
-  list-style: none;
-  -webkit-box-shadow: 0 6px 6px -6px black;
-  -moz-box-shadow: 0 6px 6px -6px black;
-  box-shadow: 0 6px 6px -6px black;
+.popup-demo-1 .popup-arrow-left {
+  left: -10px;
+  top: 10px;
 }
-.nav-demo-2 ul li {
-  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1164bf), color-stop(100%, #0d4b90));
-  background-image: -webkit-linear-gradient(#1164bf, #0d4b90);
-  background-image: -moz-linear-gradient(#1164bf, #0d4b90);
-  background-image: -o-linear-gradient(#1164bf, #0d4b90);
-  background-image: linear-gradient(#1164bf, #0d4b90);
-  border-left: 1px solid #083c78;
-  border-top: 1px solid #083c78;
-  border-bottom: 1px solid #083c78;
-}
-.nav-demo-2 ul li:hover {
-  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1164bf), color-stop(100%, #0f58a8));
-  background-image: -webkit-linear-gradient(#1164bf, #0f58a8);
-  background-image: -moz-linear-gradient(#1164bf, #0f58a8);
-  background-image: -o-linear-gradient(#1164bf, #0f58a8);
-  background-image: linear-gradient(#1164bf, #0f58a8);
-}
-.nav-demo-2 ul li:first-child {
-  -moz-border-radius-topleft: 5px;
-  -webkit-border-top-left-radius: 5px;
-  border-top-left-radius: 5px;
-  -moz-border-radius-bottomleft: 5px;
-  -webkit-border-bottom-left-radius: 5px;
-  border-bottom-left-radius: 5px;
+.popup-demo-1 .popup-arrow-right {
+  right: -10px;
+  top: 10px;
 }
-.nav-demo-2 ul li:last-child {
-  -moz-border-radius-topright: 5px;
-  -webkit-border-top-right-radius: 5px;
-  border-top-right-radius: 5px;
-  -moz-border-radius-bottomright: 5px;
-  -webkit-border-bottom-right-radius: 5px;
-  border-bottom-right-radius: 5px;
-  border-right: 1px solid #083c78;
+.popup-demo-1 .popup-close {
+  position: absolute;
+  z-index: 10;
+  text-align: center;
+  line-height: 17px;
+  height: 20px;
+  width: 20px;
+  top: -13px;
+  right: -13px;
 }
-.nav-demo-2 ul li a {
-  font-size: 16px;
-  font-family: sans-serif;
+.ie7 .popup-demo-1 .popup-close, .ie8 .popup-demo-1 .popup-close {
+  line-height: 23px;
+  height: 26px;
+  width: 26px;
+  top: -13px;
+  right: -13px;
 }
-.nav-demo-2 ul .active {
-  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0d4b90), color-stop(100%, #1164bf));
-  background-image: -webkit-linear-gradient(#0d4b90, #1164bf);
-  background-image: -moz-linear-gradient(#0d4b90, #1164bf);
-  background-image: -o-linear-gradient(#0d4b90, #1164bf);
-  background-image: linear-gradient(#0d4b90, #1164bf);
+.ie7 .popup-demo-1 {
+  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
 }
-.ie7 .nav-demo-2 ul li, .ie8 .nav-demo-2 ul li, .ie9 .nav-demo-2 ul li {
-  border-left: none;
-  border-top: none;
-  border-bottom: none;
-  background: transparent url('../img/picasso-nav.png') no-repeat center -139px;
+.popup-demo-1:after, .ie7 .popup-demo-1 .after {
+  background: rgba(0, 0, 0, 0.7);
+  -webkit-border-radius: 3px;
+  -moz-border-radius: 3px;
+  -ms-border-radius: 3px;
+  -o-border-radius: 3px;
+  border-radius: 3px;
+  -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
+  -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
+  box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
 }
-.ie7 .nav-demo-2 ul li a, .ie8 .nav-demo-2 ul li a, .ie9 .nav-demo-2 ul li a {
-  border-left: 1px solid #083c78;
+.popup-demo-1 .popup-header {
+  background: none repeat scroll 0 0 #f7f7f7;
+  display: block;
 }
-.ie7 .nav-demo-2 ul li:hover, .ie8 .nav-demo-2 ul li:hover, .ie9 .nav-demo-2 ul li:hover {
-  background: transparent url('../img/picasso-nav.png') center -175px no-repeat;
+.popup-demo-1 .popup-header h4 {
+  margin: 0;
+  color: #003770;
+  font-family: sans-serif;
+  font-size: 16px;
+  font-weight: normal;
 }
-.ie7 .nav-demo-2 ul li:first-child, .ie8 .nav-demo-2 ul li:first-child, .ie9 .nav-demo-2 ul li:first-child {
-  background: transparent url('../img/picasso-nav.png') no-repeat left -139px;
+.popup-demo-1 .popup-content {
+  background: white;
+  border: 1px solid transparent;
 }
-.ie7 .nav-demo-2 ul li:first-child a, .ie8 .nav-demo-2 ul li:first-child a, .ie9 .nav-demo-2 ul li:first-child a {
-  border-left: none;
+.popup-demo-1 .popup-arrow-bottom {
+  border-left: 10px solid transparent;
+  border-right: 10px solid transparent;
+  border-top: 10px solid rgba(0, 0, 0, 0.7);
 }
-.ie7 .nav-demo-2 ul li:first-child:hover, .ie8 .nav-demo-2 ul li:first-child:hover, .ie9 .nav-demo-2 ul li:first-child:hover {
-  background: transparent url('../img/picasso-nav.png') left -175px no-repeat;
+.popup-demo-1 .popup-arrow-top {
+  border-left: 10px solid transparent;
+  border-right: 10px solid transparent;
+  border-bottom: 10px solid rgba(0, 0, 0, 0.7);
 }
-.ie7 .nav-demo-2 ul li:first-child.active, .ie8 .nav-demo-2 ul li:first-child.active, .ie9 .nav-demo-2 ul li:first-child.active {
-  background: transparent url('../img/picasso-nav.png') no-repeat left -175px;
+.popup-demo-1 .popup-arrow-left {
+  border-top: 10px solid transparent;
+  border-bottom: 10px solid transparent;
+  border-right: 10px solid rgba(0, 0, 0, 0.7);
 }
-.ie7 .nav-demo-2 ul .last, .ie8 .nav-demo-2 ul .last, .ie9 .nav-demo-2 ul .last {
-  background: transparent url('../img/picasso-nav.png') no-repeat right -175px;
+.popup-demo-1 .popup-arrow-right {
+  border-top: 10px solid transparent;
+  border-bottom: 10px solid transparent;
+  border-left: 10px solid rgba(0, 0, 0, 0.7);
 }
-.ie7 .nav-demo-2 ul .last:hover, .ie8 .nav-demo-2 ul .last:hover, .ie9 .nav-demo-2 ul .last:hover {
-  background: transparent url('../img/picasso-nav.png') right -175px no-repeat;
+.popup-demo-1 .popup-close {
+  cursor: pointer;
+  border: 3px solid white;
+  color: white;
+  font-weight: bold;
+  font-family: sans-serif;
+  font-size: 16px;
+  background: #319fda;
+  -webkit-border-radius: 20px;
+  -moz-border-radius: 20px;
+  -ms-border-radius: 20px;
+  -o-border-radius: 20px;
+  border-radius: 20px;
+  -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
+  -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
+  box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
 }
-.ie7 .nav-demo-2 ul .active, .ie8 .nav-demo-2 ul .active, .ie9 .nav-demo-2 ul .active {
-  background: transparent url('../img/picasso-nav.png') no-repeat center -175px;
+.ie7 .popup-demo-1:after, .ie7 .popup-demo-1 .after, .ie8 .popup-demo-1:after, .ie8 .popup-demo-1 .after {
+  background: black;
+  filter: alpha(opacity=70);
 }
-.ie7 .nav-demo-2 ul .last.active, .ie8 .nav-demo-2 ul .last.active, .ie9 .nav-demo-2 ul .last.active {
-  background: transparent url('../img/picasso-nav.png') no-repeat right -175px;
+.ie7 .popup-demo-1 .popup-arrow, .ie8 .popup-demo-1 .popup-arrow {
+  filter: alpha(opacity=70);
 }
-.ie9 .nav-demo-2 ul {
-  -webkit-box-shadow: none;
-  -moz-box-shadow: none;
-  box-shadow: none;
+.ie7 .popup-demo-1 .popup-arrow-bottom, .ie8 .popup-demo-1 .popup-arrow-bottom {
+  border-top: 10px solid black;
 }
-.ie9 .nav-demo-2 ul li:first-child {
-  -moz-border-radius-topleft: none;
-  -webkit-border-top-left-radius: none;
-  border-top-left-radius: none;
-  -moz-border-radius-bottomleft: none;
-  -webkit-border-bottom-left-radius: none;
-  border-bottom-left-radius: none;
+.ie7 .popup-demo-1 .popup-arrow-top, .ie8 .popup-demo-1 .popup-arrow-top {
+  border-bottom: 10px solid black;
 }
-.ie9 .nav-demo-2 ul li:last-child {
-  -moz-border-radius-topright: none;
-  -webkit-border-top-right-radius: none;
-  border-top-right-radius: none;
-  -moz-border-radius-bottomright: none;
-  -webkit-border-bottom-right-radius: none;
-  border-bottom-right-radius: none;
-  border: none;
+.ie7 .popup-demo-1 .popup-arrow-left, .ie8 .popup-demo-1 .popup-arrow-left {
+  border-right: 10px solid black;
 }
-.nav-demo-2 a, .nav-demo-2 a:hover {
-  color: white;
+.ie7 .popup-demo-1 .popup-arrow-right, .ie8 .popup-demo-1 .popup-arrow-right {
+  border-left: 10px solid black;
+}
+.ie7 .popup-demo-1 .popup-close, .ie8 .popup-demo-1 .popup-close {
+  border-width: 0px;
+  background-color: transparent;
+  background-image: url('../img/picasso-popup.png');
+  background-position: 0px -1px;
 }
 
-.list-grid-demo-1:before, .list-grid-demo-1:after {
+.popup-demo-2 {
+  padding: 10px;
+  position: absolute;
+}
+.popup-demo-2:after, .ie7 .popup-demo-2 .after {
   content: "";
-  display: table;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  width: 100%;
+  height: 100%;
+  z-index: 0;
 }
-.list-grid-demo-1:after {
-  clear: both;
+.popup-demo-2 .popup-header h4 {
+  line-height: 20px;
+  padding: 10px;
 }
-.ie6 .list-grid-demo-1, .ie7 .list-grid-demo-1 {
-  zoom: 1;
+.popup-demo-2 .popup-container {
+  z-index: 1;
+  position: relative;
 }
-.list-grid-demo-1 ul {
-  float: left;
-  padding: 0px;
-  margin: 0px;
-  width: 130px;
+.popup-demo-2 .popup-arrow {
+  position: absolute;
+  height: 0px;
+  width: 0px;
 }
-.list-grid-demo-1 ul li {
-  height: 30px;
-  line-height: 30px;
-  padding-left: 10px;
-  padding-right: 10px;
+.popup-demo-2 .popup-arrow-bottom {
+  bottom: -10px;
+  left: 10px;
 }
-.list-grid-demo-1 ul {
-  list-style: none outside none;
-  border-top: 1px solid #cccccc;
-  border-bottom: 1px solid #cccccc;
-  border-right: 1px solid #cccccc;
+.popup-demo-2 .popup-arrow-top {
+  top: -10px;
+  left: 10px;
 }
-.list-grid-demo-1 ul:first-child {
-  border-left: 1px solid #cccccc;
+.popup-demo-2 .popup-arrow-left {
+  left: -10px;
+  top: 10px;
 }
-.list-grid-demo-1 ul li {
+.popup-demo-2 .popup-arrow-right {
+  right: -10px;
+  top: 10px;
+}
+.popup-demo-2 .popup-close {
+  position: absolute;
+  z-index: 10;
   text-align: center;
-  border: 1px solid transparent;
+  line-height: 17px;
+  height: 20px;
+  width: 20px;
+  top: -13px;
+  right: -13px;
 }
-.list-grid-demo-1 ul li:first-child {
-  border-bottom: 1px solid #cccccc;
+.ie7 .popup-demo-2 .popup-close, .ie8 .popup-demo-2 .popup-close {
+  line-height: 23px;
+  height: 26px;
+  width: 26px;
+  top: -13px;
+  right: -13px;
 }
-.list-grid-demo-1 ul li:nth-child(odd) {
-  background: none repeat scroll 0 0 #eeeeee;
+.ie7 .popup-demo-2 {
+  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
 }
-.list-grid-demo-1 ul li:nth-child(even) {
-  background: none repeat scroll 0 0 white;
+.popup-demo-2:after, .ie7 .popup-demo-2 .after {
+  background: rgba(1, 61, 147, 0.7);
+  -webkit-border-radius: 10px;
+  -moz-border-radius: 10px;
+  -ms-border-radius: 10px;
+  -o-border-radius: 10px;
+  border-radius: 10px;
+  -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 20px;
+  -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 20px;
+  box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 20px;
 }
-.list-grid-demo-1 ul li.hover-cell:hover {
-  border: 1px solid #319fda;
-  background: #f4fafd;
-  cursor: pointer;
+.popup-demo-2 .popup-header {
+  background: rgba(1, 61, 147, 0.7);
+  display: block;
 }
-.ie7 .list-grid-demo-1 ul li:first-child, .ie8 .list-grid-demo-1 ul li:first-child {
-  background: none repeat scroll 0 0 #eeeeee;
+.popup-demo-2 .popup-header h4 {
+  margin: 0;
+  color: white;
+  font-family: sans-serif;
+  font-size: 16px;
+  font-weight: normal;
 }
-.ie7 .list-grid-demo-1 ul li.even, .ie8 .list-grid-demo-1 ul li.even {
-  background: none repeat scroll 0 0 white;
+.popup-demo-2 .popup-content {
+  background: black;
+  border: 1px solid transparent;
 }
-.ie7 .list-grid-demo-1 ul li.odd, .ie8 .list-grid-demo-1 ul li.odd {
-  background: none repeat scroll 0 0 #eeeeee;
+.popup-demo-2 .popup-arrow-bottom {
+  border-left: 10px solid transparent;
+  border-right: 10px solid transparent;
+  border-top: 10px solid rgba(1, 61, 147, 0.7);
 }
-.list-grid-demo-1 .first-column {
-  width: 100px;
+.popup-demo-2 .popup-arrow-top {
+  border-left: 10px solid transparent;
+  border-right: 10px solid transparent;
+  border-bottom: 10px solid rgba(1, 61, 147, 0.7);
 }
-
-.list-grid-demo-2:before, .list-grid-demo-2:after {
-  content: "";
-  display: table;
+.popup-demo-2 .popup-arrow-left {
+  border-top: 10px solid transparent;
+  border-bottom: 10px solid transparent;
+  border-right: 10px solid rgba(1, 61, 147, 0.7);
 }
-.list-grid-demo-2:after {
-  clear: both;
+.popup-demo-2 .popup-arrow-right {
+  border-top: 10px solid transparent;
+  border-bottom: 10px solid transparent;
+  border-left: 10px solid rgba(1, 61, 147, 0.7);
 }
-.ie6 .list-grid-demo-2, .ie7 .list-grid-demo-2 {
-  zoom: 1;
+.popup-demo-2 .popup-close {
+  cursor: pointer;
+  border: 3px solid black;
+  color: black;
+  font-weight: bold;
+  font-family: sans-serif;
+  font-size: 16px;
+  background: red;
+  -webkit-border-radius: 20px;
+  -moz-border-radius: 20px;
+  -ms-border-radius: 20px;
+  -o-border-radius: 20px;
+  border-radius: 20px;
+  -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 20px;
+  -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 20px;
+  box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 20px;
 }
-.list-grid-demo-2 ul {
-  float: left;
-  padding: 0px;
-  margin: 0px;
-  width: 400px;
+.ie7 .popup-demo-2:after, .ie7 .popup-demo-2 .after, .ie8 .popup-demo-2:after, .ie8 .popup-demo-2 .after {
+  background: #013d93;
+  filter: alpha(opacity=70);
 }
-.list-grid-demo-2 ul li {
-  height: 30px;
-  line-height: 30px;
-  padding-left: 10px;
-  padding-right: 10px;
+.ie7 .popup-demo-2 .popup-arrow, .ie8 .popup-demo-2 .popup-arrow {
+  filter: alpha(opacity=70);
 }
-.list-grid-demo-2 ul {
-  list-style: none outside none;
-  border-top: 1px solid transparent;
-  border-bottom: 1px solid transparent;
-  border-right: 1px solid transparent;
+.ie7 .popup-demo-2 .popup-arrow-bottom, .ie8 .popup-demo-2 .popup-arrow-bottom {
+  border-top: 10px solid #013d93;
 }
-.list-grid-demo-2 ul:first-child {
-  border-left: 1px solid transparent;
+.ie7 .popup-demo-2 .popup-arrow-top, .ie8 .popup-demo-2 .popup-arrow-top {
+  border-bottom: 10px solid #013d93;
 }
-.list-grid-demo-2 ul li {
-  text-align: center;
-  border: 1px solid transparent;
+.ie7 .popup-demo-2 .popup-arrow-left, .ie8 .popup-demo-2 .popup-arrow-left {
+  border-right: 10px solid #013d93;
 }
-.list-grid-demo-2 ul li:first-child {
-  border-bottom: 1px solid transparent;
+.ie7 .popup-demo-2 .popup-arrow-right, .ie8 .popup-demo-2 .popup-arrow-right {
+  border-left: 10px solid #013d93;
 }
-.list-grid-demo-2 ul li:nth-child(odd) {
-  background: none repeat scroll 0 0 white;
+.ie7 .popup-demo-2 .popup-close, .ie8 .popup-demo-2 .popup-close {
+  border-width: 0px;
+  background-color: transparent;
+  background-image: url('../img/picasso-popup.png');
+  background-position: 0px -27px;
 }
-.list-grid-demo-2 ul li:nth-child(even) {
-  background: none repeat scroll 0 0 white;
+
+.bubble-demo-1 {
+  padding: 10px;
+  display: block;
+  width: auto;
+  position: relative;
+  background: #eeeeee;
+  -webkit-border-radius: 5px;
+  -moz-border-radius: 5px;
+  -ms-border-radius: 5px;
+  -o-border-radius: 5px;
+  border-radius: 5px;
 }
-.list-grid-demo-2 ul li.hover-cell:hover {
-  border: 1px solid #319fda;
-  background: #f4fafd;
-  cursor: pointer;
+.bubble-demo-1:after, .ie7 .bubble-demo-1 .after {
+  content: "";
+  position: absolute;
+  bottom: -15px;
+  right: 20px;
+  width: 0;
+  height: 0;
 }
-.ie7 .list-grid-demo-2 ul li:first-child, .ie8 .list-grid-demo-2 ul li:first-child {
-  background: none repeat scroll 0 0 white;
+.ie7 .bubble-demo-1 {
+  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
 }
-.ie7 .list-grid-demo-2 ul li.even, .ie8 .list-grid-demo-2 ul li.even {
-  background: none repeat scroll 0 0 white;
+.bubble-demo-1 blockquote {
+  color: #999999;
 }
-.ie7 .list-grid-demo-2 ul li.odd, .ie8 .list-grid-demo-2 ul li.odd {
-  background: none repeat scroll 0 0 white;
+.bubble-demo-1:after, .ie7 .bubble-demo-1 .after {
+  border-left: 10px solid transparent;
+  border-right: 10px solid transparent;
+  border-top: 15px solid #eeeeee;
 }
 
-.list-grid-demo-3:before, .list-grid-demo-3:after {
-  content: "";
-  display: table;
-}
-.list-grid-demo-3:after {
-  clear: both;
-}
-.ie6 .list-grid-demo-3, .ie7 .list-grid-demo-3 {
-  zoom: 1;
+.accordion-demo-1 .accordion-header {
+  position: relative;
+  height: 20px;
+  padding: 0 10px;
+  display: block;
 }
-.list-grid-demo-3 ul {
-  float: left;
-  padding: 0px;
+.accordion-demo-1 .accordion-header h4 {
+  line-height: 20px;
   margin: 0px;
-  width: 130px;
-}
-.list-grid-demo-3 ul li {
-  height: 40px;
-  line-height: 40px;
-  padding-left: 10px;
-  padding-right: 10px;
 }
-.list-grid-demo-3 ul {
-  list-style: none outside none;
-  border-top: 1px solid #999999;
-  border-bottom: 1px solid #999999;
-  border-right: 1px solid #999999;
-}
-.list-grid-demo-3 ul:first-child {
-  border-left: 1px solid #999999;
-}
-.list-grid-demo-3 ul li {
-  text-align: center;
-  border: 1px solid transparent;
+.accordion-demo-1 .accordion-header .arrow {
+  height: 0;
+  position: absolute;
+  right: 10px;
+  width: 0;
 }
-.list-grid-demo-3 ul li:first-child {
-  border-bottom: 1px solid #999999;
+.accordion-demo-1 .accordion-header-open .arrow {
+  top: 7.5px;
 }
-.list-grid-demo-3 ul li:nth-child(odd) {
-  background: none repeat scroll 0 0 white;
+.accordion-demo-1 .accordion-header-close .arrow {
+  top: 6px;
 }
-.list-grid-demo-3 ul li:nth-child(even) {
-  background: none repeat scroll 0 0 #319fda;
+.accordion-demo-1 .accordion-content {
+  position: relative;
+  top: -1px;
 }
-.list-grid-demo-3 ul li.hover-cell:hover {
-  border: 1px solid #319fda;
-  background: #f4fafd;
+.accordion-demo-1 .accordion-header {
   cursor: pointer;
+  background: #013d93;
+  border-bottom: 1px solid white;
 }
-.ie7 .list-grid-demo-3 ul li:first-child, .ie8 .list-grid-demo-3 ul li:first-child {
-  background: none repeat scroll 0 0 white;
+.accordion-demo-1 .accordion-header h4 {
+  color: white;
+  font-size: 13px;
+}
+.accordion-demo-1 .accordion-header-open .arrow {
+  border-left: 5px solid transparent;
+  border-right: 5px solid transparent;
+  border-top: 8px solid white;
 }
-.ie7 .list-grid-demo-3 ul li.even, .ie8 .list-grid-demo-3 ul li.even {
-  background: none repeat scroll 0 0 #319fda;
+.accordion-demo-1 .accordion-header-close .arrow {
+  border-left: 8px solid white;
+  border-bottom: 5px solid transparent;
+  border-top: 5px solid transparent;
 }
-.ie7 .list-grid-demo-3 ul li.odd, .ie8 .list-grid-demo-3 ul li.odd {
-  background: none repeat scroll 0 0 white;
+.accordion-demo-1 .accordion-content {
+  border: 1px solid #CCCCCC;
 }
 
-.list-grid-demo-4:before, .list-grid-demo-4:after {
-  content: "";
-  display: table;
-}
-.list-grid-demo-4:after {
-  clear: both;
+.pagination-demo-1 {
+  text-align: center;
 }
-.ie6 .list-grid-demo-4, .ie7 .list-grid-demo-4 {
-  zoom: 1;
+.pagination-demo-1 ul {
+  display: inline-block;
 }
-.list-grid-demo-4 ul {
+.pagination-demo-1 ul li {
+  display: inline-block;
+  height: 27px;
+  text-align: center;
   float: left;
-  padding: 0px;
-  margin: 0px;
-  width: 130px;
-}
-.list-grid-demo-4 ul li {
-  height: 15px;
-  line-height: 15px;
-  padding-left: 10px;
-  padding-right: 10px;
+  margin-left: 2px;
+  margin-right: 2px;
 }
-.list-grid-demo-4 ul {
-  list-style: none outside none;
-  border-top: 1px solid black;
-  border-bottom: 1px solid black;
-  border-right: 1px solid black;
+.pagination-demo-1 ul li a {
+  display: block;
+  line-height: 27px;
+  min-width: 27px;
 }
-.list-grid-demo-4 ul:first-child {
-  border-left: 1px solid black;
+.pagination-demo-1 ul .prev {
+  margin: 0 10px 0 0;
 }
-.list-grid-demo-4 ul li {
-  text-align: center;
-  border: 1px solid transparent;
+.pagination-demo-1 ul .next {
+  margin: 0 0 0 10px;
 }
-.list-grid-demo-4 ul li:first-child {
-  border-bottom: 1px solid black;
+.pagination-demo-1 ul .disabled {
+  display: none;
 }
-.list-grid-demo-4 ul li:nth-child(odd) {
-  background: none repeat scroll 0 0 #cccccc;
+.pagination-demo-1 li {
+  background: #eeeeee;
+  border: 1px solid #cccccc;
+  -webkit-border-radius: 5px;
+  -moz-border-radius: 5px;
+  -ms-border-radius: 5px;
+  -o-border-radius: 5px;
+  border-radius: 5px;
+  list-style: none;
 }
-.list-grid-demo-4 ul li:nth-child(even) {
-  background: none repeat scroll 0 0 #eeeeee;
+.pagination-demo-1 li a {
+  color: #319fda;
 }
-.list-grid-demo-4 ul li.hover-cell:hover {
-  border: 1px solid red;
-  background: #ffe5e5;
-  cursor: pointer;
+.pagination-demo-1 li a:hover {
+  color: white;
+  text-decoration: none;
 }
-.ie7 .list-grid-demo-4 ul li:first-child, .ie8 .list-grid-demo-4 ul li:first-child {
-  background: none repeat scroll 0 0 #cccccc;
+.pagination-demo-1 li:hover {
+  background: #013d93;
 }
-.ie7 .list-grid-demo-4 ul li.even, .ie8 .list-grid-demo-4 ul li.even {
-  background: none repeat scroll 0 0 #eeeeee;
+.pagination-demo-1 .active, .pagination-demo-1 .prev, .pagination-demo-1 .next, .pagination-demo-1 .dots {
+  background: none;
+  border: none;
 }
-.ie7 .list-grid-demo-4 ul li.odd, .ie8 .list-grid-demo-4 ul li.odd {
-  background: none repeat scroll 0 0 #cccccc;
+.pagination-demo-1 .active a:hover, .pagination-demo-1 .prev a:hover, .pagination-demo-1 .next a:hover, .pagination-demo-1 .dots a:hover {
+  color: #319fda;
 }
-
-.arrow-demo-1 {
-  padding: 0px 5px;
-  display: inline-block;
-  height: 14px;
-  line-height: 16px;
-  position: relative;
-  background: #888888;
-  color: white;
-  font-family: sans-serif;
-  font-style: normal;
-  font-size: 9px;
+.pagination-demo-1 .active:hover, .pagination-demo-1 .prev:hover, .pagination-demo-1 .next:hover, .pagination-demo-1 .dots:hover {
+  background: none;
 }
-.arrow-demo-1:after, .ie7 .arrow-demo-1 .after {
-  content: "";
-  position: absolute;
-  top: 0;
-  right: -7px;
-  width: 0;
-  height: 0;
+.pagination-demo-1 .prev:hover, .pagination-demo-1 .next:hover {
+  text-decoration: underline;
 }
-.ie7 .arrow-demo-1 {
-  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
+.pagination-demo-1 .active a, .pagination-demo-1 .dots a {
+  color: #888888;
+  cursor: default;
+  text-decoration: none;
 }
-.arrow-demo-1:after, .ie7 .arrow-demo-1 .after {
-  border-top: 7px solid transparent;
-  border-bottom: 7px solid transparent;
-  border-left: 7px solid #888888;
+.pagination-demo-1 .active a:hover, .pagination-demo-1 .dots a:hover {
+  color: #888888;
+  text-decoration: none;
 }
 
-.arrow-demo-2 {
-  padding: 0px 5px;
-  display: inline-block;
-  height: 14px;
-  line-height: 16px;
-  position: relative;
-  background: #b94a48;
-  color: white;
-  font-family: sans-serif;
-  font-style: normal;
-  font-size: 9px;
-}
-.arrow-demo-2:after, .ie7 .arrow-demo-2 .after {
-  content: "";
-  position: absolute;
-  top: 0;
-  right: -7px;
-  width: 0;
-  height: 0;
-}
-.ie7 .arrow-demo-2 {
-  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
-}
-.arrow-demo-2:after, .ie7 .arrow-demo-2 .after {
-  border-top: 7px solid transparent;
-  border-bottom: 7px solid transparent;
-  border-left: 7px solid #b94a48;
+.text-input-demo-1 {
+  width: 200px;
+  height: 20px;
+  line-height: 20px;
+  padding: 1px;
+  border: 1px solid #dddddd;
+  border-top: 1px solid #919191;
+  color: #333333;
+  font-size: 11px;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  -webkit-border-radius: 3px 3px 3px 3px;
+  -moz-border-radius: 3px 3px 3px 3px;
+  -ms-border-radius: 3px 3px 3px 3px;
+  -o-border-radius: 3px 3px 3px 3px;
+  border-radius: 3px 3px 3px 3px;
+  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
+  -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
+}
+.text-input-demo-1:focus {
+  outline: 0;
+  border: 1px solid #319fda;
+  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
+  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
+  box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
 }
 
-.arrow-demo-3 {
+.select-demo-1 {
+  width: 200px;
+  height: 20px;
+  line-height: 20px;
+  padding: 1px;
+  border: 1px solid #dddddd;
+  border-top: 1px solid #919191;
+  color: #333333;
+  font-size: 11px;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  -webkit-border-radius: 3px 3px 3px 3px;
+  -moz-border-radius: 3px 3px 3px 3px;
+  -ms-border-radius: 3px 3px 3px 3px;
+  -o-border-radius: 3px 3px 3px 3px;
+  border-radius: 3px 3px 3px 3px;
+  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
+  -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
+}
+.select-demo-1:focus {
+  outline: 0;
+  border: 1px solid #319fda;
+  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
+  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
+  box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
+}
+
+.arrow-demo-1, .arrow-demo-2, .arrow-demo-3, .arrow-demo-4 {
+  margin: 0 10px 0 0;
+}
+
+.arrow-demo-1 {
   padding: 0px 5px;
   display: inline-block;
   height: 14px;
   line-height: 16px;
   position: relative;
-  background: #f89406;
+  background: #888888;
   color: white;
   font-family: sans-serif;
   font-style: normal;
   font-size: 9px;
 }
-.arrow-demo-3:after, .ie7 .arrow-demo-3 .after {
+.arrow-demo-1:after, .ie7 .arrow-demo-1 .after {
   content: "";
   position: absolute;
   top: 0;
@@ -2064,28 +1902,28 @@
   width: 0;
   height: 0;
 }
-.ie7 .arrow-demo-3 {
+.ie7 .arrow-demo-1 {
   zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
 }
-.arrow-demo-3:after, .ie7 .arrow-demo-3 .after {
+.arrow-demo-1:after, .ie7 .arrow-demo-1 .after {
   border-top: 7px solid transparent;
   border-bottom: 7px solid transparent;
-  border-left: 7px solid #f89406;
+  border-left: 7px solid #888888;
 }
 
-.arrow-demo-4 {
+.arrow-demo-2 {
   padding: 0px 5px;
   display: inline-block;
   height: 14px;
   line-height: 16px;
   position: relative;
-  background: #468847;
+  background: #b94a48;
   color: white;
   font-family: sans-serif;
   font-style: normal;
   font-size: 9px;
 }
-.arrow-demo-4:after, .ie7 .arrow-demo-4 .after {
+.arrow-demo-2:after, .ie7 .arrow-demo-2 .after {
   content: "";
   position: absolute;
   top: 0;
@@ -2093,805 +1931,433 @@
   width: 0;
   height: 0;
 }
-.ie7 .arrow-demo-4 {
+.ie7 .arrow-demo-2 {
   zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
 }
-.arrow-demo-4:after, .ie7 .arrow-demo-4 .after {
+.arrow-demo-2:after, .ie7 .arrow-demo-2 .after {
   border-top: 7px solid transparent;
   border-bottom: 7px solid transparent;
-  border-left: 7px solid #468847;
-}
-
-.pagination-demo-1 {
-  text-align: center;
-}
-.pagination-demo-1 ul {
-  display: inline-block;
-}
-.pagination-demo-1 ul li {
-  display: inline-block;
-  height: 27px;
-  text-align: center;
-  float: left;
-  margin-left: 2px;
-  margin-right: 2px;
-}
-.pagination-demo-1 ul li a {
-  display: block;
-  line-height: 27px;
-  min-width: 27px;
-}
-.pagination-demo-1 ul .prev {
-  margin: 0 10px 0 0;
-}
-.pagination-demo-1 ul .next {
-  margin: 0 0 0 10px;
-}
-.pagination-demo-1 ul .disabled {
-  display: none;
-}
-.pagination-demo-1 li {
-  background: #eeeeee;
-  border: 1px solid #cccccc;
-  -webkit-border-radius: 5px;
-  -moz-border-radius: 5px;
-  -ms-border-radius: 5px;
-  -o-border-radius: 5px;
-  border-radius: 5px;
-  list-style: none;
-}
-.pagination-demo-1 li a {
-  color: #319fda;
-}
-.pagination-demo-1 li a:hover {
-  color: white;
-  text-decoration: none;
-}
-.pagination-demo-1 li:hover {
-  background: #013d93;
-}
-.pagination-demo-1 .active, .pagination-demo-1 .prev, .pagination-demo-1 .next, .pagination-demo-1 .dots {
-  background: none;
-  border: none;
-}
-.pagination-demo-1 .active a:hover, .pagination-demo-1 .prev a:hover, .pagination-demo-1 .next a:hover, .pagination-demo-1 .dots a:hover {
-  color: #319fda;
-}
-.pagination-demo-1 .active:hover, .pagination-demo-1 .prev:hover, .pagination-demo-1 .next:hover, .pagination-demo-1 .dots:hover {
-  background: none;
-}
-.pagination-demo-1 .prev:hover, .pagination-demo-1 .next:hover {
-  text-decoration: underline;
-}
-.pagination-demo-1 .active a, .pagination-demo-1 .dots a {
-  color: #888888;
-  cursor: default;
-  text-decoration: none;
-}
-.pagination-demo-1 .active a:hover, .pagination-demo-1 .dots a:hover {
-  color: #888888;
-  text-decoration: none;
+  border-left: 7px solid #b94a48;
 }
 
-.pagination-demo-2 {
-  text-align: center;
-}
-.pagination-demo-2 ul {
-  display: inline-block;
-}
-.pagination-demo-2 ul li {
+.arrow-demo-3 {
+  padding: 0px 5px;
   display: inline-block;
-  height: 27px;
-  text-align: center;
-  float: left;
-  margin-left: 2px;
-  margin-right: 2px;
-}
-.pagination-demo-2 ul li a {
-  display: block;
-  line-height: 27px;
-  min-width: 27px;
-}
-.pagination-demo-2 ul .prev {
-  margin: 0 10px 0 0;
-}
-.pagination-demo-2 ul .next {
-  margin: 0 0 0 10px;
-}
-.pagination-demo-2 ul .disabled {
-  display: none;
-}
-.pagination-demo-2 li {
-  background: white;
-  border: 1px solid red;
-  -webkit-border-radius: 10px;
-  -moz-border-radius: 10px;
-  -ms-border-radius: 10px;
-  -o-border-radius: 10px;
-  border-radius: 10px;
-  list-style: none;
-}
-.pagination-demo-2 li a {
-  color: black;
-}
-.pagination-demo-2 li a:hover {
-  color: yellow;
-  text-decoration: none;
-}
-.pagination-demo-2 li:hover {
-  background: green;
-}
-.pagination-demo-2 .active, .pagination-demo-2 .prev, .pagination-demo-2 .next, .pagination-demo-2 .dots {
-  background: none;
-  border: none;
-}
-.pagination-demo-2 .active a:hover, .pagination-demo-2 .prev a:hover, .pagination-demo-2 .next a:hover, .pagination-demo-2 .dots a:hover {
-  color: black;
-}
-.pagination-demo-2 .active:hover, .pagination-demo-2 .prev:hover, .pagination-demo-2 .next:hover, .pagination-demo-2 .dots:hover {
-  background: none;
-}
-.pagination-demo-2 .prev:hover, .pagination-demo-2 .next:hover {
-  text-decoration: underline;
-}
-.pagination-demo-2 .active a, .pagination-demo-2 .dots a {
-  color: blue;
-  cursor: default;
-  text-decoration: none;
-}
-.pagination-demo-2 .active a:hover, .pagination-demo-2 .dots a:hover {
-  color: blue;
-  text-decoration: none;
-}
-
-.bubble-demo-1 {
-  padding: 10px;
-  display: block;
-  width: auto;
+  height: 14px;
+  line-height: 16px;
   position: relative;
-  background: #eeeeee;
-  -webkit-border-radius: 5px;
-  -moz-border-radius: 5px;
-  -ms-border-radius: 5px;
-  -o-border-radius: 5px;
-  border-radius: 5px;
+  background: #f89406;
+  color: white;
+  font-family: sans-serif;
+  font-style: normal;
+  font-size: 9px;
 }
-.bubble-demo-1:after, .ie7 .bubble-demo-1 .after {
+.arrow-demo-3:after, .ie7 .arrow-demo-3 .after {
   content: "";
   position: absolute;
-  bottom: -15px;
-  right: 20px;
+  top: 0;
+  right: -7px;
   width: 0;
   height: 0;
 }
-.ie7 .bubble-demo-1 {
+.ie7 .arrow-demo-3 {
   zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
 }
-.bubble-demo-1 blockquote {
-  color: #999999;
-}
-.bubble-demo-1:after, .ie7 .bubble-demo-1 .after {
-  border-left: 10px solid transparent;
-  border-right: 10px solid transparent;
-  border-top: 15px solid #eeeeee;
+.arrow-demo-3:after, .ie7 .arrow-demo-3 .after {
+  border-top: 7px solid transparent;
+  border-bottom: 7px solid transparent;
+  border-left: 7px solid #f89406;
 }
 
-.bubble-demo-2 {
-  padding: 10px;
-  display: block;
-  width: 400px;
+.arrow-demo-4 {
+  padding: 0px 5px;
+  display: inline-block;
+  height: 14px;
+  line-height: 16px;
   position: relative;
-  background: #e6e6e6;
-  -webkit-border-radius: 5px;
-  -moz-border-radius: 5px;
-  -ms-border-radius: 5px;
-  -o-border-radius: 5px;
-  border-radius: 5px;
+  background: #468847;
+  color: white;
+  font-family: sans-serif;
+  font-style: normal;
+  font-size: 9px;
 }
-.bubble-demo-2:after, .ie7 .bubble-demo-2 .after {
+.arrow-demo-4:after, .ie7 .arrow-demo-4 .after {
   content: "";
   position: absolute;
-  bottom: -15px;
-  right: 20px;
+  top: 0;
+  right: -7px;
   width: 0;
   height: 0;
 }
-.ie7 .bubble-demo-2 {
+.ie7 .arrow-demo-4 {
   zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
 }
-.bubble-demo-2 blockquote {
-  color: #333333;
-  white-space: nowrap;
-  overflow: hidden;
-  -ms-text-overflow: ellipsis;
-  -o-text-overflow: ellipsis;
-  text-overflow: ellipsis;
-}
-.bubble-demo-2 h4 {
-  white-space: nowrap;
-  overflow: hidden;
-  -ms-text-overflow: ellipsis;
-  -o-text-overflow: ellipsis;
-  text-overflow: ellipsis;
-}
-.bubble-demo-2:after, .ie7 .bubble-demo-2 .after {
-  border-left: 10px solid transparent;
-  border-right: 10px solid transparent;
-  border-top: 15px solid #e6e6e6;
-}
-
-.bubble-demo-1, .bubble-demo-2 {
-  margin: 20px 0;
+.arrow-demo-4:after, .ie7 .arrow-demo-4 .after {
+  border-top: 7px solid transparent;
+  border-bottom: 7px solid transparent;
+  border-left: 7px solid #468847;
 }
 
-.popup-demo-1, .popup-demo-2, .popup-demo-3, .popup-demo-4 {
-  padding: 10px;
-  position: absolute;
-}
-.popup-demo-1:after, .ie7 .popup-demo-1 .after, .popup-demo-2:after, .ie7 .popup-demo-2 .after, .popup-demo-3:after, .ie7 .popup-demo-3 .after, .popup-demo-4:after, .ie7 .popup-demo-4 .after {
-  content: "";
-  position: absolute;
-  top: 0px;
-  left: 0px;
-  width: 100%;
-  height: 100%;
+.mini-tooltip-demo-1 {
+  color: white;
+  font-size: 11px;
+  float: left;
+  position: relative;
+  padding: 0px 10px;
+  margin-left: 10px;
   z-index: 0;
-}
-.popup-demo-1 .popup-header h4, .popup-demo-2 .popup-header h4, .popup-demo-3 .popup-header h4, .popup-demo-4 .popup-header h4 {
   line-height: 20px;
-  padding: 10px;
-}
-.popup-demo-1 .popup-container, .popup-demo-2 .popup-container, .popup-demo-3 .popup-container, .popup-demo-4 .popup-container {
-  z-index: 1;
-  position: relative;
-}
-.popup-demo-1 .popup-arrow, .popup-demo-2 .popup-arrow, .popup-demo-3 .popup-arrow, .popup-demo-4 .popup-arrow {
-  position: absolute;
-  height: 0px;
-  width: 0px;
-}
-.popup-demo-1 .popup-arrow-bottom, .popup-demo-2 .popup-arrow-bottom, .popup-demo-3 .popup-arrow-bottom, .popup-demo-4 .popup-arrow-bottom {
-  bottom: -10px;
-  left: 10px;
-}
-.popup-demo-1 .popup-arrow-top, .popup-demo-2 .popup-arrow-top, .popup-demo-3 .popup-arrow-top, .popup-demo-4 .popup-arrow-top {
-  top: -10px;
-  left: 10px;
-}
-.popup-demo-1 .popup-arrow-left, .popup-demo-2 .popup-arrow-left, .popup-demo-3 .popup-arrow-left, .popup-demo-4 .popup-arrow-left {
-  left: -10px;
-  top: 10px;
-}
-.popup-demo-1 .popup-arrow-right, .popup-demo-2 .popup-arrow-right, .popup-demo-3 .popup-arrow-right, .popup-demo-4 .popup-arrow-right {
-  right: -10px;
-  top: 10px;
-}
-.popup-demo-1 .popup-close, .popup-demo-2 .popup-close, .popup-demo-3 .popup-close, .popup-demo-4 .popup-close {
-  position: absolute;
-  z-index: 10;
-  text-align: center;
-  line-height: 17px;
-  height: 20px;
-  width: 20px;
-  top: -13px;
-  right: -13px;
-}
-.ie7 .popup-demo-1 .popup-close, .ie8 .popup-demo-1 .popup-close, .ie7 .popup-demo-2 .popup-close, .ie8 .popup-demo-2 .popup-close, .ie7 .popup-demo-3 .popup-close, .ie8 .popup-demo-3 .popup-close, .ie7 .popup-demo-4 .popup-close, .ie8 .popup-demo-4 .popup-close {
-  line-height: 23px;
-  height: 26px;
-  width: 26px;
-  top: -13px;
-  right: -13px;
-}
-.ie7 .popup-demo-1, .ie7 .popup-demo-2, .ie7 .popup-demo-3, .ie7 .popup-demo-4 {
-  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
-}
-.popup-demo-1:after, .ie7 .popup-demo-1 .after, .popup-demo-2:after, .ie7 .popup-demo-2 .after, .popup-demo-3:after, .ie7 .popup-demo-3 .after, .popup-demo-4:after, .ie7 .popup-demo-4 .after {
-  background: rgba(0, 0, 0, 0.7);
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  -ms-border-radius: 3px;
-  -o-border-radius: 3px;
-  border-radius: 3px;
-  -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
-  -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
-  box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
-}
-.popup-demo-1 .popup-header, .popup-demo-2 .popup-header, .popup-demo-3 .popup-header, .popup-demo-4 .popup-header {
-  background: none repeat scroll 0 0 #f7f7f7;
-  display: block;
-}
-.popup-demo-1 .popup-header h4, .popup-demo-2 .popup-header h4, .popup-demo-3 .popup-header h4, .popup-demo-4 .popup-header h4 {
-  margin: 0;
-  color: #003770;
-  font-family: sans-serif;
-  font-size: 16px;
-  font-weight: normal;
-}
-.popup-demo-1 .popup-content, .popup-demo-2 .popup-content, .popup-demo-3 .popup-content, .popup-demo-4 .popup-content {
-  background: white;
-  border: 1px solid transparent;
-}
-.popup-demo-1 .popup-arrow-bottom, .popup-demo-2 .popup-arrow-bottom, .popup-demo-3 .popup-arrow-bottom, .popup-demo-4 .popup-arrow-bottom {
-  border-left: 10px solid transparent;
-  border-right: 10px solid transparent;
-  border-top: 10px solid rgba(0, 0, 0, 0.7);
-}
-.popup-demo-1 .popup-arrow-top, .popup-demo-2 .popup-arrow-top, .popup-demo-3 .popup-arrow-top, .popup-demo-4 .popup-arrow-top {
-  border-left: 10px solid transparent;
-  border-right: 10px solid transparent;
-  border-bottom: 10px solid rgba(0, 0, 0, 0.7);
-}
-.popup-demo-1 .popup-arrow-left, .popup-demo-2 .popup-arrow-left, .popup-demo-3 .popup-arrow-left, .popup-demo-4 .popup-arrow-left {
-  border-top: 10px solid transparent;
-  border-bottom: 10px solid transparent;
-  border-right: 10px solid rgba(0, 0, 0, 0.7);
 }
-.popup-demo-1 .popup-arrow-right, .popup-demo-2 .popup-arrow-right, .popup-demo-3 .popup-arrow-right, .popup-demo-4 .popup-arrow-right {
-  border-top: 10px solid transparent;
-  border-bottom: 10px solid transparent;
-  border-left: 10px solid rgba(0, 0, 0, 0.7);
-}
-.popup-demo-1 .popup-close, .popup-demo-2 .popup-close, .popup-demo-3 .popup-close, .popup-demo-4 .popup-close {
-  cursor: pointer;
-  border: 3px solid white;
-  color: white;
-  font-weight: bold;
-  font-family: sans-serif;
-  font-size: 16px;
-  background: #319fda;
-  -webkit-border-radius: 20px;
-  -moz-border-radius: 20px;
-  -ms-border-radius: 20px;
-  -o-border-radius: 20px;
-  border-radius: 20px;
-  -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
-  -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
-  box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
+.mini-tooltip-demo-1:after, .ie7 .mini-tooltip-demo-1 .after {
+  opacity: 0.5;
+  border-top: 7px solid transparent;
+  border-bottom: 7px solid transparent;
+  border-right: 7px solid black;
 }
-.ie7 .popup-demo-1:after, .ie7 .popup-demo-1 .after, .ie8 .popup-demo-1:after, .ie8 .popup-demo-1 .after, .ie7 .popup-demo-2:after, .ie7 .popup-demo-2 .after, .ie8 .popup-demo-2:after, .ie8 .popup-demo-2 .after, .ie7 .popup-demo-3:after, .ie7 .popup-demo-3 .after, .ie8 .popup-demo-3:after, .ie8 .popup-demo-3 .after, .ie7 .popup-demo-4:after, .ie7 .popup-demo-4 .after, .ie8 .popup-demo-4:after, .ie8 .popup-demo-4 .after {
+.mini-tooltip-demo-1:before, .ie7 .mini-tooltip-demo-1 .before {
   background: black;
-  filter: alpha(opacity=70);
-}
-.ie7 .popup-demo-1 .popup-arrow, .ie8 .popup-demo-1 .popup-arrow, .ie7 .popup-demo-2 .popup-arrow, .ie8 .popup-demo-2 .popup-arrow, .ie7 .popup-demo-3 .popup-arrow, .ie8 .popup-demo-3 .popup-arrow, .ie7 .popup-demo-4 .popup-arrow, .ie8 .popup-demo-4 .popup-arrow {
-  filter: alpha(opacity=70);
-}
-.ie7 .popup-demo-1 .popup-arrow-bottom, .ie8 .popup-demo-1 .popup-arrow-bottom, .ie7 .popup-demo-2 .popup-arrow-bottom, .ie8 .popup-demo-2 .popup-arrow-bottom, .ie7 .popup-demo-3 .popup-arrow-bottom, .ie8 .popup-demo-3 .popup-arrow-bottom, .ie7 .popup-demo-4 .popup-arrow-bottom, .ie8 .popup-demo-4 .popup-arrow-bottom {
-  border-top: 10px solid black;
-}
-.ie7 .popup-demo-1 .popup-arrow-top, .ie8 .popup-demo-1 .popup-arrow-top, .ie7 .popup-demo-2 .popup-arrow-top, .ie8 .popup-demo-2 .popup-arrow-top, .ie7 .popup-demo-3 .popup-arrow-top, .ie8 .popup-demo-3 .popup-arrow-top, .ie7 .popup-demo-4 .popup-arrow-top, .ie8 .popup-demo-4 .popup-arrow-top {
-  border-bottom: 10px solid black;
-}
-.ie7 .popup-demo-1 .popup-arrow-left, .ie8 .popup-demo-1 .popup-arrow-left, .ie7 .popup-demo-2 .popup-arrow-left, .ie8 .popup-demo-2 .popup-arrow-left, .ie7 .popup-demo-3 .popup-arrow-left, .ie8 .popup-demo-3 .popup-arrow-left, .ie7 .popup-demo-4 .popup-arrow-left, .ie8 .popup-demo-4 .popup-arrow-left {
-  border-right: 10px solid black;
+  opacity: 0.5;
 }
-.ie7 .popup-demo-1 .popup-arrow-right, .ie8 .popup-demo-1 .popup-arrow-right, .ie7 .popup-demo-2 .popup-arrow-right, .ie8 .popup-demo-2 .popup-arrow-right, .ie7 .popup-demo-3 .popup-arrow-right, .ie8 .popup-demo-3 .popup-arrow-right, .ie7 .popup-demo-4 .popup-arrow-right, .ie8 .popup-demo-4 .popup-arrow-right {
-  border-left: 10px solid black;
-}
-.ie7 .popup-demo-1 .popup-close, .ie8 .popup-demo-1 .popup-close, .ie7 .popup-demo-2 .popup-close, .ie8 .popup-demo-2 .popup-close, .ie7 .popup-demo-3 .popup-close, .ie8 .popup-demo-3 .popup-close, .ie7 .popup-demo-4 .popup-close, .ie8 .popup-demo-4 .popup-close {
-  border-width: 0px;
-  background-color: transparent;
-  background-image: url('../img/picasso-popup.png');
-  background-position: 0px -1px;
-}
-
-.popup-demo-5 {
-  padding: 10px;
-  position: absolute;
+.ie7 .mini-tooltip-demo-1:before, .ie7 .mini-tooltip-demo-1 .before, .ie8 .mini-tooltip-demo-1:before, .ie8 .mini-tooltip-demo-1 .before {
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
+  opacity: 0.5;
 }
-.popup-demo-5:after, .ie7 .popup-demo-5 .after {
+.mini-tooltip-demo-1:after, .ie7 .mini-tooltip-demo-1 .after {
   content: "";
   position: absolute;
-  top: 0px;
-  left: 0px;
-  width: 100%;
-  height: 100%;
-  z-index: 0;
-}
-.popup-demo-5 .popup-header h4 {
-  line-height: 20px;
-  padding: 10px;
-}
-.popup-demo-5 .popup-container {
-  z-index: 1;
-  position: relative;
-}
-.popup-demo-5 .popup-arrow {
-  position: absolute;
-  height: 0px;
-  width: 0px;
-}
-.popup-demo-5 .popup-arrow-bottom {
-  bottom: -10px;
-  left: 10px;
-}
-.popup-demo-5 .popup-arrow-top {
-  top: -10px;
-  left: 10px;
-}
-.popup-demo-5 .popup-arrow-left {
-  left: -10px;
-  top: 10px;
-}
-.popup-demo-5 .popup-arrow-right {
-  right: -10px;
-  top: 10px;
-}
-.popup-demo-5 .popup-close {
-  position: absolute;
-  z-index: 10;
-  text-align: center;
-  line-height: 17px;
-  height: 20px;
-  width: 20px;
-  top: -13px;
-  right: -13px;
-}
-.ie7 .popup-demo-5 .popup-close, .ie8 .popup-demo-5 .popup-close {
-  line-height: 23px;
-  height: 26px;
-  width: 26px;
-  top: -13px;
-  right: -13px;
-}
-.ie7 .popup-demo-5 {
-  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
-}
-.popup-demo-5:after, .ie7 .popup-demo-5 .after {
-  background: rgba(1, 61, 147, 0.7);
-  -webkit-border-radius: 10px;
-  -moz-border-radius: 10px;
-  -ms-border-radius: 10px;
-  -o-border-radius: 10px;
-  border-radius: 10px;
-  -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 20px;
-  -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 20px;
-  box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 20px;
-}
-.popup-demo-5 .popup-header {
-  background: rgba(1, 61, 147, 0.7);
-  display: block;
-}
-.popup-demo-5 .popup-header h4 {
-  margin: 0;
-  color: white;
-  font-family: sans-serif;
-  font-size: 16px;
-  font-weight: normal;
-}
-.popup-demo-5 .popup-content {
-  background: black;
-  border: 1px solid transparent;
-}
-.popup-demo-5 .popup-arrow-bottom {
-  border-left: 10px solid transparent;
-  border-right: 10px solid transparent;
-  border-top: 10px solid rgba(1, 61, 147, 0.7);
+  width: 0;
+  height: 0;
+  left: -7px;
+  top: 3px;
 }
-.popup-demo-5 .popup-arrow-top {
-  border-left: 10px solid transparent;
-  border-right: 10px solid transparent;
-  border-bottom: 10px solid rgba(1, 61, 147, 0.7);
+.mini-tooltip-demo-1:before, .ie7 .mini-tooltip-demo-1 .before {
+  content: "";
+  position: absolute;
+  width: 100%;
+  height: 20px;
+  top: 0px;
+  left: 0px;
+  z-index: -1;
 }
-.popup-demo-5 .popup-arrow-left {
-  border-top: 10px solid transparent;
-  border-bottom: 10px solid transparent;
-  border-right: 10px solid rgba(1, 61, 147, 0.7);
+.ie7 .mini-tooltip-demo-1 {
+  zoom: expression(this.runtimeStyle.zoom="1", this.insertBefore( document.createElement("i"), this.firstChild ).className="before" );
 }
-.popup-demo-5 .popup-arrow-right {
-  border-top: 10px solid transparent;
-  border-bottom: 10px solid transparent;
-  border-left: 10px solid rgba(1, 61, 147, 0.7);
+.ie7 .mini-tooltip-demo-1 .before {
+  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
 }
-.popup-demo-5 .popup-close {
-  cursor: pointer;
-  border: 3px solid black;
+
+.mini-tooltip-demo-2 {
   color: black;
-  font-weight: bold;
-  font-family: sans-serif;
-  font-size: 16px;
+  font-size: 11px;
+  float: left;
+  position: relative;
+  padding: 0px 10px;
+  margin-left: 10px;
+  z-index: 0;
+  line-height: 30px;
+}
+.mini-tooltip-demo-2:after, .ie7 .mini-tooltip-demo-2 .after {
+  opacity: 0.4;
+  border-top: 7px solid transparent;
+  border-bottom: 7px solid transparent;
+  border-right: 7px solid red;
+}
+.mini-tooltip-demo-2:before, .ie7 .mini-tooltip-demo-2 .before {
   background: red;
-  -webkit-border-radius: 20px;
-  -moz-border-radius: 20px;
-  -ms-border-radius: 20px;
-  -o-border-radius: 20px;
-  border-radius: 20px;
-  -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 20px;
-  -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 20px;
-  box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 20px;
+  opacity: 0.4;
 }
-.ie7 .popup-demo-5:after, .ie7 .popup-demo-5 .after, .ie8 .popup-demo-5:after, .ie8 .popup-demo-5 .after {
-  background: #013d93;
-  filter: alpha(opacity=70);
+.ie7 .mini-tooltip-demo-2:before, .ie7 .mini-tooltip-demo-2 .before, .ie8 .mini-tooltip-demo-2:before, .ie8 .mini-tooltip-demo-2 .before {
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
+  opacity: 0.4;
 }
-.ie7 .popup-demo-5 .popup-arrow, .ie8 .popup-demo-5 .popup-arrow {
-  filter: alpha(opacity=70);
+.mini-tooltip-demo-2:after, .ie7 .mini-tooltip-demo-2 .after {
+  content: "";
+  position: absolute;
+  width: 0;
+  height: 0;
+  left: -7px;
+  top: 8px;
 }
-.ie7 .popup-demo-5 .popup-arrow-bottom, .ie8 .popup-demo-5 .popup-arrow-bottom {
-  border-top: 10px solid #013d93;
+.mini-tooltip-demo-2:before, .ie7 .mini-tooltip-demo-2 .before {
+  content: "";
+  position: absolute;
+  width: 100%;
+  height: 30px;
+  top: 0px;
+  left: 0px;
+  z-index: -1;
 }
-.ie7 .popup-demo-5 .popup-arrow-top, .ie8 .popup-demo-5 .popup-arrow-top {
-  border-bottom: 10px solid #013d93;
+.ie7 .mini-tooltip-demo-2 {
+  zoom: expression(this.runtimeStyle.zoom="1", this.insertBefore( document.createElement("i"), this.firstChild ).className="before" );
 }
-.ie7 .popup-demo-5 .popup-arrow-left, .ie8 .popup-demo-5 .popup-arrow-left {
-  border-right: 10px solid #013d93;
+.ie7 .mini-tooltip-demo-2 .before {
+  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
 }
-.ie7 .popup-demo-5 .popup-arrow-right, .ie8 .popup-demo-5 .popup-arrow-right {
-  border-left: 10px solid #013d93;
+
+.mini-tooltip-demo-3 {
+  color: white;
+  font-size: 11px;
+  float: left;
+  position: relative;
+  padding: 0px 10px;
+  margin-left: 10px;
+  z-index: 0;
+  line-height: 20px;
 }
-.ie7 .popup-demo-5 .popup-close, .ie8 .popup-demo-5 .popup-close {
-  border-width: 0px;
-  background-color: transparent;
-  background-image: url('../img/picasso-popup.png');
-  background-position: 0px -27px;
+.mini-tooltip-demo-3:after, .ie7 .mini-tooltip-demo-3 .after {
+  opacity: 1;
+  border-top: 7px solid transparent;
+  border-bottom: 7px solid transparent;
+  border-right: 7px solid #013d93;
 }
-.popup-demo-5 .popup-bottom-arrow:after {
-  left: 132px;
+.mini-tooltip-demo-3:before, .ie7 .mini-tooltip-demo-3 .before {
+  background: #013d93;
+  opacity: 1;
 }
-
-.popup-demo-6 {
-  padding: 10px;
+.ie7 .mini-tooltip-demo-3:before, .ie7 .mini-tooltip-demo-3 .before, .ie8 .mini-tooltip-demo-3:before, .ie8 .mini-tooltip-demo-3 .before {
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+  opacity: 1;
+}
+.mini-tooltip-demo-3:after, .ie7 .mini-tooltip-demo-3 .after {
+  content: "";
   position: absolute;
+  width: 0;
+  height: 0;
+  left: -7px;
+  top: 3px;
 }
-.popup-demo-6:after, .ie7 .popup-demo-6 .after {
+.mini-tooltip-demo-3:before, .ie7 .mini-tooltip-demo-3 .before {
   content: "";
   position: absolute;
+  width: 100%;
+  height: 20px;
   top: 0px;
   left: 0px;
+  z-index: -1;
+}
+.ie7 .mini-tooltip-demo-3 {
+  zoom: expression(this.runtimeStyle.zoom="1", this.insertBefore( document.createElement("i"), this.firstChild ).className="before" );
+}
+.ie7 .mini-tooltip-demo-3 .before {
+  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
+}
+
+.container {
+  width: 90%;
+  max-width: 1200px;
+  min-width: 950px;
+}
+
+.row-col {
   width: 100%;
-  height: 100%;
-  z-index: 0;
 }
-.popup-demo-6 .popup-header h4 {
-  line-height: 20px;
-  padding: 10px;
+.row-col:before, .row-col:after {
+  content: "";
+  display: table;
 }
-.popup-demo-6 .popup-container {
-  z-index: 1;
-  position: relative;
+.row-col:after {
+  clear: both;
 }
-.popup-demo-6 .popup-arrow {
-  position: absolute;
-  height: 0px;
-  width: 0px;
+.ie6 .row-col, .ie7 .row-col {
+  zoom: 1;
 }
-.popup-demo-6 .popup-arrow-bottom {
-  bottom: -10px;
-  left: 10px;
+.row-col [class^="col"] {
+  width: 100%;
+  min-height: 25px;
+  display: block;
+  float: left;
+  margin-left: 2.174%;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
 }
-.popup-demo-6 .popup-arrow-top {
-  top: -10px;
-  left: 10px;
+.row-col [class^="col"]:first-child {
+  margin-left: 0;
 }
-.popup-demo-6 .popup-arrow-left {
-  left: -10px;
-  top: 10px;
+.row-col [class^="col"] img {
+  max-width: 100%;
 }
-.popup-demo-6 .popup-arrow-right {
-  right: -10px;
-  top: 10px;
+.row-col .col1 {
+  width: 6.341%;
 }
-.popup-demo-6 .popup-close {
-  position: absolute;
-  z-index: 10;
-  text-align: center;
-  line-height: 17px;
-  height: 20px;
-  width: 20px;
-  top: -13px;
-  right: -13px;
+.ie7 .row-col .col1 {
+  width: 6.249%;
 }
-.ie7 .popup-demo-6 .popup-close, .ie8 .popup-demo-6 .popup-close {
-  line-height: 23px;
-  height: 26px;
-  width: 26px;
-  top: -13px;
-  right: -13px;
+.row-col [class^="col"].offset1 {
+  margin-left: 10.507%;
 }
-.ie7 .popup-demo-6 {
-  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
+.row-col [class^="col"].offset1:first-child {
+  margin-left: 8.424%;
 }
-.popup-demo-6:after, .ie7 .popup-demo-6 .after {
-  background: rgba(68, 137, 81, 0.7);
-  -webkit-border-radius: 20px;
-  -moz-border-radius: 20px;
-  -ms-border-radius: 20px;
-  -o-border-radius: 20px;
-  border-radius: 20px;
-  -webkit-box-shadow: rgba(0, 0, 0, 0.5) 10px -10px 10px;
-  -moz-box-shadow: rgba(0, 0, 0, 0.5) 10px -10px 10px;
-  box-shadow: rgba(0, 0, 0, 0.5) 10px -10px 10px;
+.row-col .col2 {
+  width: 14.855%;
 }
-.popup-demo-6 .popup-header {
-  background: none repeat scroll 0 0 #f7f7f7;
-  display: block;
+.ie7 .row-col .col2 {
+  width: 14.763%;
 }
-.popup-demo-6 .popup-header h4 {
-  margin: 0;
-  color: #003770;
-  font-family: sans-serif;
-  font-size: 16px;
-  font-weight: normal;
+.row-col [class^="col"].offset2 {
+  margin-left: 19.022%;
 }
-.popup-demo-6 .popup-content {
-  background: white;
-  border: 1px solid transparent;
+.row-col [class^="col"].offset2:first-child {
+  margin-left: 16.938%;
 }
-.popup-demo-6 .popup-arrow-bottom {
-  border-left: 10px solid transparent;
-  border-right: 10px solid transparent;
-  border-top: 10px solid rgba(68, 137, 81, 0.7);
+.row-col .col3 {
+  width: 23.37%;
 }
-.popup-demo-6 .popup-arrow-top {
-  border-left: 10px solid transparent;
-  border-right: 10px solid transparent;
-  border-bottom: 10px solid rgba(68, 137, 81, 0.7);
+.ie7 .row-col .col3 {
+  width: 23.278%;
 }
-.popup-demo-6 .popup-arrow-left {
-  border-top: 10px solid transparent;
-  border-bottom: 10px solid transparent;
-  border-right: 10px solid rgba(68, 137, 81, 0.7);
+.row-col [class^="col"].offset3 {
+  margin-left: 27.536%;
 }
-.popup-demo-6 .popup-arrow-right {
-  border-top: 10px solid transparent;
-  border-bottom: 10px solid transparent;
-  border-left: 10px solid rgba(68, 137, 81, 0.7);
+.row-col [class^="col"].offset3:first-child {
+  margin-left: 25.453%;
 }
-.popup-demo-6 .popup-close {
-  cursor: pointer;
-  border: 3px solid white;
-  color: white;
-  font-weight: bold;
-  font-family: sans-serif;
-  font-size: 16px;
-  background: rgba(68, 137, 81, 0.7);
-  -webkit-border-radius: 20px;
-  -moz-border-radius: 20px;
-  -ms-border-radius: 20px;
-  -o-border-radius: 20px;
-  border-radius: 20px;
-  -webkit-box-shadow: rgba(0, 0, 0, 0.5) 10px -10px 10px;
-  -moz-box-shadow: rgba(0, 0, 0, 0.5) 10px -10px 10px;
-  box-shadow: rgba(0, 0, 0, 0.5) 10px -10px 10px;
+.row-col .col4 {
+  width: 31.884%;
 }
-.ie7 .popup-demo-6:after, .ie7 .popup-demo-6 .after, .ie8 .popup-demo-6:after, .ie8 .popup-demo-6 .after {
-  background: #448951;
-  filter: alpha(opacity=70);
+.ie7 .row-col .col4 {
+  width: 31.792%;
 }
-.ie7 .popup-demo-6 .popup-arrow, .ie8 .popup-demo-6 .popup-arrow {
-  filter: alpha(opacity=70);
+.row-col [class^="col"].offset4 {
+  margin-left: 36.051%;
 }
-.ie7 .popup-demo-6 .popup-arrow-bottom, .ie8 .popup-demo-6 .popup-arrow-bottom {
-  border-top: 10px solid #448951;
+.row-col [class^="col"].offset4:first-child {
+  margin-left: 33.967%;
 }
-.ie7 .popup-demo-6 .popup-arrow-top, .ie8 .popup-demo-6 .popup-arrow-top {
-  border-bottom: 10px solid #448951;
+.row-col .col5 {
+  width: 40.399%;
 }
-.ie7 .popup-demo-6 .popup-arrow-left, .ie8 .popup-demo-6 .popup-arrow-left {
-  border-right: 10px solid #448951;
+.ie7 .row-col .col5 {
+  width: 40.307%;
 }
-.ie7 .popup-demo-6 .popup-arrow-right, .ie8 .popup-demo-6 .popup-arrow-right {
-  border-left: 10px solid #448951;
+.row-col [class^="col"].offset5 {
+  margin-left: 44.565%;
 }
-.ie7 .popup-demo-6 .popup-close, .ie8 .popup-demo-6 .popup-close {
-  border-width: 0px;
-  background-color: transparent;
-  background-image: url('../img/picasso-popup.png');
-  background-position: 0px -53px;
+.row-col [class^="col"].offset5:first-child {
+  margin-left: 42.482%;
 }
-.popup-demo-6 .popup-bottom-arrow:after {
-  left: 132px;
+.row-col .col6 {
+  width: 48.913%;
 }
-
-.popup-demo-container {
-  float: left;
-  width: 330px;
-  height: 180px;
-  positon: relative;
+.ie7 .row-col .col6 {
+  width: 48.821%;
 }
-.ie8 .popup-demo-container, .ie7 .popup-demo-container {
-  width: 240px;
+.row-col [class^="col"].offset6 {
+  margin-left: 53.08%;
 }
-
-.accordion-demo-1 .accordion-header {
-  position: relative;
-  height: 20px;
-  padding: 0 10px;
-  display: block;
+.row-col [class^="col"].offset6:first-child {
+  margin-left: 50.996%;
 }
-.accordion-demo-1 .accordion-header h4 {
-  line-height: 20px;
-  margin: 0px;
+.row-col .col7 {
+  width: 57.428%;
 }
-.accordion-demo-1 .accordion-header .arrow {
-  height: 0;
-  position: absolute;
-  right: 10px;
-  width: 0;
+.ie7 .row-col .col7 {
+  width: 57.336%;
 }
-.accordion-demo-1 .accordion-header-open .arrow {
-  top: 7.5px;
+.row-col [class^="col"].offset7 {
+  margin-left: 61.594%;
 }
-.accordion-demo-1 .accordion-header-close .arrow {
-  top: 6px;
+.row-col [class^="col"].offset7:first-child {
+  margin-left: 59.511%;
 }
-.accordion-demo-1 .accordion-content {
-  position: relative;
-  top: -1px;
+.row-col .col8 {
+  width: 65.942%;
 }
-.accordion-demo-1 .accordion-header {
-  cursor: pointer;
-  background: #013d93;
-  border-bottom: 1px solid white;
+.ie7 .row-col .col8 {
+  width: 65.85%;
 }
-.accordion-demo-1 .accordion-header h4 {
-  color: white;
-  font-size: 13px;
+.row-col [class^="col"].offset8 {
+  margin-left: 70.109%;
 }
-.accordion-demo-1 .accordion-header-open .arrow {
-  border-left: 5px solid transparent;
-  border-right: 5px solid transparent;
-  border-top: 8px solid white;
+.row-col [class^="col"].offset8:first-child {
+  margin-left: 68.025%;
 }
-.accordion-demo-1 .accordion-header-close .arrow {
-  border-left: 8px solid white;
-  border-bottom: 5px solid transparent;
-  border-top: 5px solid transparent;
+.row-col .col9 {
+  width: 74.457%;
 }
-.accordion-demo-1 .accordion-content {
-  border: 1px solid #CCCCCC;
+.ie7 .row-col .col9 {
+  width: 74.365%;
 }
-
-.accordion-demo-2 {
-  width: 300px;
+.row-col [class^="col"].offset9 {
+  margin-left: 78.623%;
 }
-.accordion-demo-2 .accordion-header {
-  position: relative;
-  height: 40px;
-  padding: 0 10px;
-  display: block;
+.row-col [class^="col"].offset9:first-child {
+  margin-left: 76.54%;
 }
-.accordion-demo-2 .accordion-header h4 {
-  line-height: 40px;
-  margin: 0px;
+.row-col .col10 {
+  width: 82.971%;
 }
-.accordion-demo-2 .accordion-header .arrow {
-  height: 0;
-  position: absolute;
-  right: 10px;
-  width: 0;
+.ie7 .row-col .col10 {
+  width: 82.879%;
 }
-.accordion-demo-2 .accordion-header-open .arrow {
-  top: 17.5px;
+.row-col [class^="col"].offset10 {
+  margin-left: 87.138%;
 }
-.accordion-demo-2 .accordion-header-close .arrow {
-  top: 16px;
+.row-col [class^="col"].offset10:first-child {
+  margin-left: 85.054%;
 }
-.accordion-demo-2 .accordion-content {
-  position: relative;
-  top: -1px;
+.row-col .col11 {
+  width: 91.486%;
 }
-.accordion-demo-2 .accordion-header {
-  cursor: pointer;
-  background: #cccccc;
-  border-bottom: 1px solid white;
+.ie7 .row-col .col11 {
+  width: 91.394%;
 }
-.accordion-demo-2 .accordion-header h4 {
-  color: black;
-  font-size: 13px;
+.row-col [class^="col"].offset11 {
+  margin-left: 95.652%;
 }
-.accordion-demo-2 .accordion-header-open .arrow {
-  border-left: 5px solid transparent;
-  border-right: 5px solid transparent;
-  border-top: 8px solid black;
+.row-col [class^="col"].offset11:first-child {
+  margin-left: 93.569%;
 }
-.accordion-demo-2 .accordion-header-close .arrow {
-  border-left: 8px solid black;
-  border-bottom: 5px solid transparent;
-  border-top: 5px solid transparent;
+.row-col .col12 {
+  width: 100%;
 }
-.accordion-demo-2 .accordion-content {
-  border: 1px solid #CCCCCC;
+.row-col [class^="col"].offset12 {
+  margin-left: 104.167%;
+}
+.row-col [class^="col"].offset12:first-child {
+  margin-left: 102.083%;
+}
+
+.row-col {
+  margin: 10px 0;
+}
+
+[class^="col"] {
+  -webkit-border-radius: 5px;
+  -moz-border-radius: 5px;
+  -ms-border-radius: 5px;
+  -o-border-radius: 5px;
+  border-radius: 5px;
+  background: #CCC;
+}
+
+[class^="col"] [class^="col"] {
+  background: #AAA;
+}
+
+[class^="col"] [class^="col"] [class^="col"] {
+  background: #696969;
+  color: #C0C0C0;
+}
+
+.clearfix-demo {
+  background: #58608D;
+  width: 100%;
+  padding: 10px;
+}
+.clearfix-demo:before, .clearfix-demo:after {
+  content: "";
+  display: table;
+}
+.clearfix-demo:after {
+  clear: both;
+}
+.ie6 .clearfix-demo, .ie7 .clearfix-demo {
+  zoom: 1;
+}
+.clearfix-demo div {
+  background: white;
 }
 
 .despegar-size-1-demo {