picasso 0.3.6.beta.3 → 0.3.6.beta.4

Sign up to get free protection for your applications and to get access to all the features.
data/README.md CHANGED
@@ -12,7 +12,7 @@ http://gitorious.despegar.it/picasso/picasso
12
12
  Ejecutar:
13
13
 
14
14
  ```bash
15
- $ (sudo) gem install picasso
15
+ $ (sudo) gem install picasso --version="0.3.6.beta.4"
16
16
  ```
17
17
 
18
18
  > Opcional: [Instalación de oily_png](#oily-png).
@@ -22,7 +22,7 @@ En el `config.rb` agregar:
22
22
  ```ruby
23
23
  require 'picasso'
24
24
  require 'magick'
25
- gem 'picasso', '~> 0.3.5'
25
+ gem 'picasso', '~> 0.3.6.beta.4'
26
26
  ```
27
27
 
28
28
  Modificar el número de versión a medida que se quiere usar nuevas versiones del framework.
@@ -1566,6 +1566,9 @@ body {
1566
1566
  width: 20px;
1567
1567
  top: -13px;
1568
1568
  right: -13px;
1569
+ -webkit-box-sizing: content-box;
1570
+ -moz-box-sizing: content-box;
1571
+ box-sizing: content-box;
1569
1572
  }
1570
1573
  .ie7 .popup-demo-1 {
1571
1574
  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
@@ -1577,10 +1580,6 @@ body {
1577
1580
  top: -13px;
1578
1581
  right: -13px;
1579
1582
  }
1580
- .ie9 .popup-demo-1 .popup-close {
1581
- height: 25px;
1582
- width: 25px;
1583
- }
1584
1583
  .popup-demo-1:after {
1585
1584
  background: black;
1586
1585
  background: rgba(0, 0, 0, 0.7);
@@ -1726,6 +1725,9 @@ body {
1726
1725
  width: 20px;
1727
1726
  top: -13px;
1728
1727
  right: -13px;
1728
+ -webkit-box-sizing: content-box;
1729
+ -moz-box-sizing: content-box;
1730
+ box-sizing: content-box;
1729
1731
  }
1730
1732
  .ie7 .popup-demo-2 {
1731
1733
  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
@@ -1737,10 +1739,6 @@ body {
1737
1739
  top: -13px;
1738
1740
  right: -13px;
1739
1741
  }
1740
- .ie9 .popup-demo-2 .popup-close {
1741
- height: 25px;
1742
- width: 25px;
1743
- }
1744
1742
  .popup-demo-2:after {
1745
1743
  background: gray;
1746
1744
  background: rgba(128, 128, 128, 0.5);
@@ -1,5 +1,2604 @@
1
1
  <!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. Framework CSS/Sass.
2
- </title><meta charset="utf-8"><link rel="stylesheet" href="docs.css"><link rel="stylesheet" href="css/picasso-docs.css"><!--[if IE]><link rel="stylesheet" href="css/picasso-demos.css"><![endif]--><style type="text/preview">body{font-family:sans-serif;font-size:16px;padding:20px 0}.ie7 .preview,.ie8 .preview,.ie9 .preview{padding:15px}.tooltip-demo-1{display:block;position:absolute;padding:0.267em;font-size:0.8em;background-color:#000;color:#fff;-webkit-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;border-radius:2px;-webkit-box-shadow:#000 0 0 3px;-moz-box-shadow:#000 0 0 3px;box-shadow:#000 0 0 3px;left:20px}.tooltip-demo-1.tooltip-left:after,.ie7 .tooltip-demo-1.tooltip-left span{position:absolute;top:0;padding:0.267em 0;left:-0.82em;content:"\25C4"}.ie7 .tooltip-demo-1.tooltip-left{zoom:expression(this.runtimeStyle.zoom="1", this.insertBefore(document.createElement("span"), this.firstChild).innerHTML="&#9668;")}.tooltip-demo-1.tooltip-left:after,.ie7 .tooltip-demo-1 span{font-family:arial, sans-serif;font-size:1em;color:#000}.ie8 .tooltip-demo-1.tooltip-left:after{font-size:0.8em}.tooltip-demo-2{display:block;position:absolute;padding:0.267em;font-size:0.8em;background-color:#000;color:#fff;-webkit-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;border-radius:2px;-webkit-box-shadow:#000 0 0 3px;-moz-box-shadow:#000 0 0 3px;box-shadow:#000 0 0 3px;left:140px}.tooltip-demo-2.tooltip-right:after,.ie7 .tooltip-demo-2.tooltip-right span{position:absolute;top:0;padding:0.267em 0;right:-0.82em;content:"\25BA"}.ie7 .tooltip-demo-2.tooltip-right{zoom:expression(this.runtimeStyle.zoom="1", this.appendChild(document.createElement("span")).innerHTML="&#9658;")}.tooltip-demo-2.tooltip-right:after,.ie7 .tooltip-demo-2 span{font-family:arial, sans-serif;font-size:1em;color:#000}.ie8 .tooltip-demo-2.tooltip-right:after{font-size:0.8em}.tooltip-demo-3{display:block;position:absolute;padding:0.4em;font-size:1.2em;background-color:#0074cc;color:#fff;-webkit-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;border-radius:2px;-webkit-box-shadow:#0074cc 0 0 3px;-moz-box-shadow:#0074cc 0 0 3px;box-shadow:#0074cc 0 0 3px;left:20px}.tooltip-demo-3.tooltip-left:after,.ie7 .tooltip-demo-3.tooltip-left span{position:absolute;top:0;padding:0.4em 0;left:-0.82em;content:"\25C4"}.ie7 .tooltip-demo-3.tooltip-left{zoom:expression(this.runtimeStyle.zoom="1", this.insertBefore(document.createElement("span"), this.firstChild).innerHTML="&#9668;")}.tooltip-demo-3.tooltip-left:after,.ie7 .tooltip-demo-3 span{font-family:arial, sans-serif;font-size:1em;color:#0074cc}.ie8 .tooltip-demo-3.tooltip-left:after{font-size:1.2em}.tooltip-demo-4{display:block;position:absolute;padding:0.4em;font-size:1.2em;background-color:#faa732;color:#fff;-webkit-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;border-radius:2px;-webkit-box-shadow:#faa732 0 0 3px;-moz-box-shadow:#faa732 0 0 3px;box-shadow:#faa732 0 0 3px;left:300px}.tooltip-demo-4.tooltip-right:after,.ie7 .tooltip-demo-4.tooltip-right span{position:absolute;top:0;padding:0.4em 0;right:-0.82em;content:"\25BA"}.ie7 .tooltip-demo-4.tooltip-right{zoom:expression(this.runtimeStyle.zoom="1", this.appendChild(document.createElement("span")).innerHTML="&#9658;")}.tooltip-demo-4.tooltip-right:after,.ie7 .tooltip-demo-4 span{font-family:arial, sans-serif;font-size:1em;color:#faa732}.ie8 .tooltip-demo-4.tooltip-right:after{font-size:1.2em}.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:#fff}.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%, #0088cc), color-stop(100%, #0077b3)),-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #006699), color-stop(100%, #00334d));background:-webkit-linear-gradient(#0088cc,#0077b3),-webkit-linear-gradient(#006699,#00334d);background:-moz-linear-gradient(#0088cc,#0077b3),-moz-linear-gradient(#006699,#00334d);background:-o-linear-gradient(#0088cc,#0077b3),-o-linear-gradient(#006699,#00334d);background:linear-gradient(#0088cc,#0077b3),linear-gradient(#006699,#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:#fff}.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%, #66ccff), color-stop(100%, #000000)) 50%;background:-webkit-linear-gradient(#66ccff 15%,#000000) 50%;background:-moz-linear-gradient(#66ccff 15%,#000000) 50%;background:-o-linear-gradient(#66ccff 15%,#000000) 50%;background:linear-gradient(#66ccff 15%,#000000) 50%}.button-glossy-demo-2:before{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(100%, #0077b3)),-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #006699), color-stop(100%, #00334d));background:-webkit-linear-gradient(#0088cc,#0077b3),-webkit-linear-gradient(#006699,#00334d);background:-moz-linear-gradient(#0088cc,#0077b3),-moz-linear-gradient(#006699,#00334d);background:-o-linear-gradient(#0088cc,#0077b3),-o-linear-gradient(#006699,#00334d);background:linear-gradient(#0088cc,#0077b3),linear-gradient(#006699,#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%, #0088cc));background:-webkit-linear-gradient(#1ab2ff,#0070a8,#0088cc);background:-moz-linear-gradient(#1ab2ff,#0070a8,#0088cc);background:-o-linear-gradient(#1ab2ff,#0070a8,#0088cc);background:linear-gradient(#1ab2ff,#0070a8,#0088cc)}.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%, #0088cc));background:-webkit-linear-gradient(#1ab2ff,#0070a8,#0088cc);background:-moz-linear-gradient(#1ab2ff,#0070a8,#0088cc);background:-o-linear-gradient(#1ab2ff,#0070a8,#0088cc);background:linear-gradient(#1ab2ff,#0070a8,#0088cc)}.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:#fff}.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:#fff;border:1px solid #c00811;font-family:sans-serif;font-size:13px;text-decoration:none;text-align:center;cursor:pointer;text-shadow:0 1px 0 #000;-webkit-border-radius:0.4em;-moz-border-radius:0.4em;-ms-border-radius:0.4em;-o-border-radius:0.4em;border-radius:0.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:#fff}.button-3d-demo-1:hover{text-decoration:none;color:#fff}.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 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.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 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5),inset 0 0 1em #ff2f3a;-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5),inset 0 0 1em #ff2f3a;box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5),inset 0 0 1em #ff2f3a}.button-3d-demo-1 span:active{text-shadow:0 -1px 0 #000;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 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75)}.button-3d-demo-1.disabled{border:1px solid #755354;cursor:not-allowed;color:#fff}.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 #000;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 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,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:#fff;border:1px solid #046;font-family:sans-serif;font-size:13px;text-decoration:none;text-align:center;cursor:pointer;text-shadow:0 1px 0 #000;-webkit-border-radius:0.4em;-moz-border-radius:0.4em;-ms-border-radius:0.4em;-o-border-radius:0.4em;border-radius:0.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:#fff}.button-3d-demo-2:hover{text-decoration:none;color:#fff}.button-3d-demo-2 span{background-color:#08c;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(100%, #002233));background-image:-webkit-linear-gradient(#0088cc,#002233);background-image:-moz-linear-gradient(#0088cc,#002233);background-image:-o-linear-gradient(#0088cc,#002233);background-image:linear-gradient(#0088cc,#002233);-webkit-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.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%, #004466));background-image:-webkit-linear-gradient(rgba(255,255,255,0),#004466);background-image:-moz-linear-gradient(rgba(255,255,255,0),#004466);background-image:-o-linear-gradient(rgba(255,255,255,0),#004466);background-image:linear-gradient(rgba(255,255,255,0),#004466);-webkit-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5),inset 0 0 1em #08c;-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5),inset 0 0 1em #08c;box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5),inset 0 0 1em #08c}.button-3d-demo-2 span:active{text-shadow:0 -1px 0 #000;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(100%, #002233));background-image:-webkit-linear-gradient(#0088cc,#002233);background-image:-moz-linear-gradient(#0088cc,#002233);background-image:-o-linear-gradient(#0088cc,#002233);background-image:linear-gradient(#0088cc,#002233);-webkit-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75)}.button-3d-demo-2.disabled{border:1px solid #755354;cursor:not-allowed;color:#fff}.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 #000;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 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,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:#fff;border:1px solid #e08505;font-family:sans-serif;font-size:13px;text-decoration:none;text-align:center;cursor:pointer;text-shadow:0 1px 0 #000;-webkit-border-radius:0.4em;-moz-border-radius:0.4em;-ms-border-radius:0.4em;-o-border-radius:0.4em;border-radius:0.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:#fff}.button-3d-demo-3:hover{text-decoration:none;color:#fff}.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 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.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 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5),inset 0 0 1em #ffb54c;-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5),inset 0 0 1em #ffb54c;box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5),inset 0 0 1em #ffb54c}.button-3d-demo-3 span:active{text-shadow:0 -1px 0 #000;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 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75)}.button-3d-demo-3.disabled{border:1px solid #755354;cursor:not-allowed;color:#fff}.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 #000;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 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,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:#fff;border:1px solid #00132e;font-family:sans-serif;font-size:24px;text-decoration:none;text-align:center;cursor:pointer;text-shadow:0 1px 0 #000;-webkit-border-radius:0.4em;-moz-border-radius:0.4em;-ms-border-radius:0.4em;-o-border-radius:0.4em;border-radius:0.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:#fff}.button-3d-demo-4:hover{text-decoration:none;color:#fff}.button-3d-demo-4 span{background-color:#013d93;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #013d93), color-stop(100%, #000000));background-image:-webkit-linear-gradient(#013d93,#000000);background-image:-moz-linear-gradient(#013d93,#000000);background-image:-o-linear-gradient(#013d93,#000000);background-image:linear-gradient(#013d93,#000000);-webkit-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.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 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5),inset 0 0 1em #003d94;-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5),inset 0 0 1em #003d94;box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5),inset 0 0 1em #003d94}.button-3d-demo-4 span:active{text-shadow:0 -1px 0 #000;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #013d93), color-stop(100%, #000000));background-image:-webkit-linear-gradient(#013d93,#000000);background-image:-moz-linear-gradient(#013d93,#000000);background-image:-o-linear-gradient(#013d93,#000000);background-image:linear-gradient(#013d93,#000000);-webkit-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75)}.button-3d-demo-4.disabled{border:1px solid #755354;cursor:not-allowed;color:#fff}.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 #000;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 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,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%, #eeeeee), color-stop(100%, #a2a2a2));background-image:-webkit-linear-gradient(#eeeeee,#a2a2a2);background-image:-moz-linear-gradient(#eeeeee,#a2a2a2);background-image:-o-linear-gradient(#eeeeee,#a2a2a2);background-image:linear-gradient(#eeeeee,#a2a2a2);-webkit-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.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%, #bbbbbb));background-image:-webkit-linear-gradient(rgba(255,255,255,0),#bbbbbb);background-image:-moz-linear-gradient(rgba(255,255,255,0),#bbbbbb);background-image:-o-linear-gradient(rgba(255,255,255,0),#bbbbbb);background-image:linear-gradient(rgba(255,255,255,0),#bbbbbb);-webkit-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5),inset 0 0 1em #f0ecec;-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5),inset 0 0 1em #f0ecec;box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.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%, #eeeeee), color-stop(100%, #a2a2a2));background-image:-webkit-linear-gradient(#eeeeee,#a2a2a2);background-image:-moz-linear-gradient(#eeeeee,#a2a2a2);background-image:-o-linear-gradient(#eeeeee,#a2a2a2);background-image:linear-gradient(#eeeeee,#a2a2a2);-webkit-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.1),inset 0 0.1em 0.2em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(0,0,0,0.1),inset 0 0 1em rgba(0,0,0,0.75)}.button-3d-demo-5.disabled{border:1px solid #755354;cursor:not-allowed;color:#fff}.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 #000;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 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,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 0px 1px 2px 0px;-moz-box-shadow:#333 0px 1px 2px 0px;box-shadow:#333 0px 1px 2px 0px}.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 0px 0px 3px 3px inset;-moz-box-shadow:#999 0px 0px 3px 3px inset;box-shadow:#999 0px 0px 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%, #0088cc), color-stop(50%, #0077b3), color-stop(51%, #006699), color-stop(100%, #005580));background:-webkit-linear-gradient(top, #0088cc 0%,#0077b3 50%,#006699 51%,#005580 100%);background:-moz-linear-gradient(top, #0088cc 0%,#0077b3 50%,#006699 51%,#005580 100%);background:-o-linear-gradient(top, #0088cc 0%,#0077b3 50%,#006699 51%,#005580 100%);background:linear-gradient(top, #0088cc 0%,#0077b3 50%,#006699 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 0px 1px 2px 0px;-moz-box-shadow:#333 0px 1px 2px 0px;box-shadow:#333 0px 1px 2px 0px}.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 0px 0px 3px 3px inset;-moz-box-shadow:#999 0px 0px 3px 3px inset;box-shadow:#999 0px 0px 3px 3px inset}.button-mini-demo-2 span{color:#fff;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 0px 1px 2px 0px;-moz-box-shadow:#333 0px 1px 2px 0px;box-shadow:#333 0px 1px 2px 0px}.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 0px 0px 3px 3px inset;-moz-box-shadow:#999 0px 0px 3px 3px inset;box-shadow:#999 0px 0px 3px 3px inset}.button-mini-demo-3 span{color:#fff;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 0px 1px 2px 0px;-moz-box-shadow:#333 0px 1px 2px 0px;box-shadow:#333 0px 1px 2px 0px}.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 0px 0px 3px 3px inset;-moz-box-shadow:#999 0px 0px 3px 3px inset;box-shadow:#999 0px 0px 3px 3px inset}.button-mini-demo-4 span{color:#fff;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:0px;margin:0px;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 #fff}.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 #fff}.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 #000;-moz-box-shadow:0 6px 6px -6px #000;box-shadow:0 6px 6px -6px #000}.nav-demo-1 ul li{background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #e6e6e6));background-image:-webkit-linear-gradient(#ffffff,#e6e6e6);background-image:-moz-linear-gradient(#ffffff,#e6e6e6);background-image:-o-linear-gradient(#ffffff,#e6e6e6);background-image:linear-gradient(#ffffff,#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%, #ffffff), color-stop(100%, #f2f2f2));background-image:-webkit-linear-gradient(#ffffff,#f2f2f2);background-image:-moz-linear-gradient(#ffffff,#f2f2f2);background-image:-o-linear-gradient(#ffffff,#f2f2f2);background-image:linear-gradient(#ffffff,#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%, #ffffff));background-image:-webkit-linear-gradient(#e6e6e6,#ffffff);background-image:-moz-linear-gradient(#e6e6e6,#ffffff);background-image:-o-linear-gradient(#e6e6e6,#ffffff);background-image:linear-gradient(#e6e6e6,#ffffff)}.ie7 .nav-demo-1 ul li,.ie8 .nav-demo-1 ul li,.ie9 .nav-demo-1 ul li{border-left:none;border-top:none;border-bottom:none;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:none}.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:none}.popup-demo-1{padding:10px;position:absolute}.popup-demo-1:after,.ie7 .popup-demo-1 .after{content:"";position:absolute;top:0px;left:0px;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:0px;width:0px}.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,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{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:#fff;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,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,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,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,0.7)}.popup-demo-1 .popup-close{cursor:pointer;border:3px solid #fff;color:#fff;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 .popup-demo-1:after,.ie7 .popup-demo-1 .after,.ie8 .popup-demo-1:after,.ie8 .popup-demo-1 .after{background:#000;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 #000}.ie7 .popup-demo-1 .popup-arrow-top,.ie8 .popup-demo-1 .popup-arrow-top{border-bottom:10px solid #000}.ie7 .popup-demo-1 .popup-arrow-left,.ie8 .popup-demo-1 .popup-arrow-left{border-right:10px solid #000}.ie7 .popup-demo-1 .popup-arrow-right,.ie8 .popup-demo-1 .popup-arrow-right{border-left:10px solid #000}.ie7 .popup-demo-1 .popup-close,.ie8 .popup-demo-1 .popup-close{border-width:0px;background-color:transparent;background:url('../img/picasso-popup.png');background-position:0px -1px}.popup-demo-2{padding:10px;position:absolute;color:white}.popup-demo-2:after,.ie7 .popup-demo-2 .after{content:"";position:absolute;top:0px;left:0px;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:0px;width:0px}.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(128,128,128,0.5);-webkit-border-radius:10px;-moz-border-radius:10px;-ms-border-radius:10px;-o-border-radius:10px;border-radius:10px;-webkit-box-shadow:0px 0px 5px #333;-moz-box-shadow:0px 0px 5px #333;box-shadow:0px 0px 5px #333}.popup-demo-2 .popup-header{background:#fff;display:block}.popup-demo-2 .popup-header h4{margin:0;color:#000;font-family:sans-serif;font-size:16px;font-weight:normal}.popup-demo-2 .popup-content{background:#000;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(128,128,128,0.5)}.popup-demo-2 .popup-arrow-top{border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid rgba(128,128,128,0.5)}.popup-demo-2 .popup-arrow-left{border-top:10px solid transparent;border-bottom:10px solid transparent;border-right:10px solid rgba(128,128,128,0.5)}.popup-demo-2 .popup-arrow-right{border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:10px solid rgba(128,128,128,0.5)}.popup-demo-2 .popup-close{cursor:pointer;border:3px solid #fff;color:#fff;font-weight:bold;font-family:sans-serif;font-size:16px;background:#000;-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border-radius:20px;-webkit-box-shadow:0px 0px 5px #333;-moz-box-shadow:0px 0px 5px #333;box-shadow:0px 0px 5px #333}.ie7 .popup-demo-2:after,.ie7 .popup-demo-2 .after,.ie8 .popup-demo-2:after,.ie8 .popup-demo-2 .after{background:gray;filter:alpha(opacity=50)}.ie7 .popup-demo-2 .popup-arrow,.ie8 .popup-demo-2 .popup-arrow{filter:alpha(opacity=50)}.ie7 .popup-demo-2 .popup-arrow-bottom,.ie8 .popup-demo-2 .popup-arrow-bottom{border-top:10px solid gray}.ie7 .popup-demo-2 .popup-arrow-top,.ie8 .popup-demo-2 .popup-arrow-top{border-bottom:10px solid gray}.ie7 .popup-demo-2 .popup-arrow-left,.ie8 .popup-demo-2 .popup-arrow-left{border-right:10px solid gray}.ie7 .popup-demo-2 .popup-arrow-right,.ie8 .popup-demo-2 .popup-arrow-right{border-left:10px solid gray}.ie7 .popup-demo-2 .popup-close,.ie8 .popup-demo-2 .popup-close{border-width:0px;background-color:transparent;background:url('../img/picasso-popup.png');background-position:0px -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{border:1px solid #ccc}.accordion-demo-1 .accordion-section{margin-top:1px}.accordion-demo-1 .accordion-section:first-child{margin-top:0}.accordion-demo-1 .accordion-header{padding:0.4em 10px;overflow:hidden}.accordion-demo-1 .accordion-header h4{margin:0;float:left}.accordion-demo-1 .accordion-header .accordion-arrow{float:right}.accordion-demo-1 .accordion-header{background-color:#013d93;color:#fff;cursor:pointer;font-size:0.8em;line-height:0.8em}.accordion-demo-1 .accordion-header.accordion-header-open .accordion-arrow:after{content:"\25BC"}.accordion-demo-1 .accordion-header.accordion-header-close .accordion-arrow:after{content:"\25BA"}.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:#fff;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:#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,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}.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,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:#888;color:#fff;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:0px 5px;display:inline-block;height:14px;line-height:16px;position:relative;background:#b94a48;color:#fff;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:0px 5px;display:inline-block;height:14px;line-height:16px;position:relative;background:#f89406;color:#fff;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:0px 5px;display:inline-block;height:14px;line-height:16px;position:relative;background:#468847;color:#fff;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}.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:90%;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:#000;color:white}.despegar-white-demo{padding:10px;background:#fff}.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}
2
+ </title><meta charset="utf-8"><link rel="stylesheet" href="docs.css"><link rel="stylesheet" href="css/picasso-docs.css"><!--[if IE]><link rel="stylesheet" href="css/picasso-demos.css"><![endif]--><style type="text/preview">html {
3
+ font-size: 16px;
4
+ }
5
+
6
+ body {
7
+ font-family: sans-serif;
8
+ padding: 20px 0;
9
+ }
10
+
11
+ .ie7 .preview, .ie8 .preview, .ie9 .preview {
12
+ padding: 15px;
13
+ }
14
+
15
+ .tooltip-demo-1 {
16
+ display: block;
17
+ position: absolute;
18
+ padding: 0.267em;
19
+ font-size: 0.8em;
20
+ background-color: black;
21
+ color: white;
22
+ -webkit-border-radius: 2px;
23
+ -moz-border-radius: 2px;
24
+ -ms-border-radius: 2px;
25
+ -o-border-radius: 2px;
26
+ border-radius: 2px;
27
+ -webkit-box-shadow: black 0 0 3px;
28
+ -moz-box-shadow: black 0 0 3px;
29
+ box-shadow: black 0 0 3px;
30
+ left: 20px;
31
+ }
32
+ .tooltip-demo-1.tooltip-left:after, .ie7 .tooltip-demo-1.tooltip-left span {
33
+ position: absolute;
34
+ top: 0;
35
+ padding: 0.267em 0;
36
+ left: -0.82em;
37
+ content: "\25C4";
38
+ }
39
+ .ie7 .tooltip-demo-1.tooltip-left {
40
+ zoom: expression(this.runtimeStyle.zoom="1", this.insertBefore(document.createElement("span"), this.firstChild).innerHTML="&#9668;");
41
+ }
42
+ .tooltip-demo-1.tooltip-left:after, .ie7 .tooltip-demo-1 span {
43
+ font-family: arial, sans-serif;
44
+ font-size: 1em;
45
+ color: black;
46
+ }
47
+ .ie8 .tooltip-demo-1.tooltip-left:after {
48
+ font-size: 0.8em;
49
+ }
50
+
51
+ .tooltip-demo-2 {
52
+ display: block;
53
+ position: absolute;
54
+ padding: 0.267em;
55
+ font-size: 0.8em;
56
+ background-color: black;
57
+ color: white;
58
+ -webkit-border-radius: 2px;
59
+ -moz-border-radius: 2px;
60
+ -ms-border-radius: 2px;
61
+ -o-border-radius: 2px;
62
+ border-radius: 2px;
63
+ -webkit-box-shadow: black 0 0 3px;
64
+ -moz-box-shadow: black 0 0 3px;
65
+ box-shadow: black 0 0 3px;
66
+ left: 140px;
67
+ }
68
+ .tooltip-demo-2.tooltip-right:after, .ie7 .tooltip-demo-2.tooltip-right span {
69
+ position: absolute;
70
+ top: 0;
71
+ padding: 0.267em 0;
72
+ right: -0.82em;
73
+ content: "\25BA";
74
+ }
75
+ .ie7 .tooltip-demo-2.tooltip-right {
76
+ zoom: expression(this.runtimeStyle.zoom="1", this.appendChild(document.createElement("span")).innerHTML="&#9658;");
77
+ }
78
+ .tooltip-demo-2.tooltip-right:after, .ie7 .tooltip-demo-2 span {
79
+ font-family: arial, sans-serif;
80
+ font-size: 1em;
81
+ color: black;
82
+ }
83
+ .ie8 .tooltip-demo-2.tooltip-right:after {
84
+ font-size: 0.8em;
85
+ }
86
+
87
+ .tooltip-demo-3 {
88
+ display: block;
89
+ position: absolute;
90
+ padding: 0.4em;
91
+ font-size: 1.2em;
92
+ background-color: #0074cc;
93
+ color: white;
94
+ -webkit-border-radius: 2px;
95
+ -moz-border-radius: 2px;
96
+ -ms-border-radius: 2px;
97
+ -o-border-radius: 2px;
98
+ border-radius: 2px;
99
+ -webkit-box-shadow: #0074cc 0 0 3px;
100
+ -moz-box-shadow: #0074cc 0 0 3px;
101
+ box-shadow: #0074cc 0 0 3px;
102
+ left: 20px;
103
+ }
104
+ .tooltip-demo-3.tooltip-left:after, .ie7 .tooltip-demo-3.tooltip-left span {
105
+ position: absolute;
106
+ top: 0;
107
+ padding: 0.4em 0;
108
+ left: -0.82em;
109
+ content: "\25C4";
110
+ }
111
+ .ie7 .tooltip-demo-3.tooltip-left {
112
+ zoom: expression(this.runtimeStyle.zoom="1", this.insertBefore(document.createElement("span"), this.firstChild).innerHTML="&#9668;");
113
+ }
114
+ .tooltip-demo-3.tooltip-left:after, .ie7 .tooltip-demo-3 span {
115
+ font-family: arial, sans-serif;
116
+ font-size: 1em;
117
+ color: #0074cc;
118
+ }
119
+ .ie8 .tooltip-demo-3.tooltip-left:after {
120
+ font-size: 1.2em;
121
+ }
122
+
123
+ .tooltip-demo-4 {
124
+ display: block;
125
+ position: absolute;
126
+ padding: 0.4em;
127
+ font-size: 1.2em;
128
+ background-color: #faa732;
129
+ color: white;
130
+ -webkit-border-radius: 2px;
131
+ -moz-border-radius: 2px;
132
+ -ms-border-radius: 2px;
133
+ -o-border-radius: 2px;
134
+ border-radius: 2px;
135
+ -webkit-box-shadow: #faa732 0 0 3px;
136
+ -moz-box-shadow: #faa732 0 0 3px;
137
+ box-shadow: #faa732 0 0 3px;
138
+ left: 300px;
139
+ }
140
+ .tooltip-demo-4.tooltip-right:after, .ie7 .tooltip-demo-4.tooltip-right span {
141
+ position: absolute;
142
+ top: 0;
143
+ padding: 0.4em 0;
144
+ right: -0.82em;
145
+ content: "\25BA";
146
+ }
147
+ .ie7 .tooltip-demo-4.tooltip-right {
148
+ zoom: expression(this.runtimeStyle.zoom="1", this.appendChild(document.createElement("span")).innerHTML="&#9658;");
149
+ }
150
+ .tooltip-demo-4.tooltip-right:after, .ie7 .tooltip-demo-4 span {
151
+ font-family: arial, sans-serif;
152
+ font-size: 1em;
153
+ color: #faa732;
154
+ }
155
+ .ie8 .tooltip-demo-4.tooltip-right:after {
156
+ font-size: 1.2em;
157
+ }
158
+
159
+ .button-glossy-demo-1 {
160
+ width: 90px;
161
+ height: 30px;
162
+ display: inline-block;
163
+ text-align: center;
164
+ position: relative;
165
+ z-index: 1;
166
+ font-family: sans-serif;
167
+ font-size: 12px;
168
+ text-decoration: none;
169
+ cursor: pointer;
170
+ 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));
171
+ background: -webkit-linear-gradient(#de1f2a, #c81c26), -webkit-linear-gradient(#b11922, #6e0f15);
172
+ background: -moz-linear-gradient(#de1f2a, #c81c26), -moz-linear-gradient(#b11922, #6e0f15);
173
+ background: -o-linear-gradient(#de1f2a, #c81c26), -o-linear-gradient(#b11922, #6e0f15);
174
+ background: linear-gradient(#de1f2a, #c81c26), linear-gradient(#b11922, #6e0f15);
175
+ -webkit-border-radius: 5px;
176
+ -moz-border-radius: 5px;
177
+ -ms-border-radius: 5px;
178
+ -o-border-radius: 5px;
179
+ border-radius: 5px;
180
+ background-position: left top, left 15px;
181
+ }
182
+ .button-glossy-demo-1:after, .button-glossy-demo-1:before {
183
+ content: "";
184
+ position: absolute;
185
+ display: inline-block;
186
+ }
187
+ .button-glossy-demo-1:after {
188
+ width: 88px;
189
+ height: 28px;
190
+ left: 1px;
191
+ top: 1px;
192
+ z-index: 2;
193
+ }
194
+ .button-glossy-demo-1:before {
195
+ width: 86px;
196
+ height: 26px;
197
+ left: 2px;
198
+ top: 2px;
199
+ z-index: 3;
200
+ }
201
+ .button-glossy-demo-1 span {
202
+ position: relative;
203
+ z-index: 4;
204
+ line-height: 30px;
205
+ }
206
+ .button-glossy-demo-1 span {
207
+ color: white;
208
+ }
209
+ .button-glossy-demo-1:after, .button-glossy-demo-1:before {
210
+ -webkit-border-radius: 4px;
211
+ -moz-border-radius: 4px;
212
+ -ms-border-radius: 4px;
213
+ -o-border-radius: 4px;
214
+ border-radius: 4px;
215
+ }
216
+ .button-glossy-demo-1:after {
217
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(15%, #f2a4a8), color-stop(100%, #150304)) 50%;
218
+ background: -webkit-linear-gradient(#f2a4a8 15%, #150304) 50%;
219
+ background: -moz-linear-gradient(#f2a4a8 15%, #150304) 50%;
220
+ background: -o-linear-gradient(#f2a4a8 15%, #150304) 50%;
221
+ background: linear-gradient(#f2a4a8 15%, #150304) 50%;
222
+ }
223
+ .button-glossy-demo-1:before {
224
+ 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));
225
+ background: -webkit-linear-gradient(#de1f2a, #c81c26), -webkit-linear-gradient(#b11922, #6e0f15);
226
+ background: -moz-linear-gradient(#de1f2a, #c81c26), -moz-linear-gradient(#b11922, #6e0f15);
227
+ background: -o-linear-gradient(#de1f2a, #c81c26), -o-linear-gradient(#b11922, #6e0f15);
228
+ background: linear-gradient(#de1f2a, #c81c26), linear-gradient(#b11922, #6e0f15);
229
+ background-position: left top, left 13px;
230
+ }
231
+ .button-glossy-demo-1, .button-glossy-demo-1:before {
232
+ background-size: 100% 50%;
233
+ background-repeat: no-repeat;
234
+ }
235
+ .button-glossy-demo-1:hover {
236
+ text-decoration: none;
237
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e96168), color-stop(50%, #bf1b24), color-stop(100%, #f10c19));
238
+ background: -webkit-linear-gradient(#e96168, #bf1b24, #f10c19);
239
+ background: -moz-linear-gradient(#e96168, #bf1b24, #f10c19);
240
+ background: -o-linear-gradient(#e96168, #bf1b24, #f10c19);
241
+ background: linear-gradient(#e96168, #bf1b24, #f10c19);
242
+ }
243
+ .button-glossy-demo-1:hover:after {
244
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #f4b1b5), color-stop(100%, #d11d27)) 50%;
245
+ background: -webkit-linear-gradient(#f4b1b5 20%, #d11d27) 50%;
246
+ background: -moz-linear-gradient(#f4b1b5 20%, #d11d27) 50%;
247
+ background: -o-linear-gradient(#f4b1b5 20%, #d11d27) 50%;
248
+ background: linear-gradient(#f4b1b5 20%, #d11d27) 50%;
249
+ }
250
+ .button-glossy-demo-1:hover:before {
251
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e96168), color-stop(50%, #bf1b24), color-stop(100%, #f10c19));
252
+ background: -webkit-linear-gradient(#e96168, #bf1b24, #f10c19);
253
+ background: -moz-linear-gradient(#e96168, #bf1b24, #f10c19);
254
+ background: -o-linear-gradient(#e96168, #bf1b24, #f10c19);
255
+ background: linear-gradient(#e96168, #bf1b24, #f10c19);
256
+ }
257
+ .button-glossy-demo-1:hover, .button-glossy-demo-1:hover:before {
258
+ background-size: 100% 100%;
259
+ background-position: left top;
260
+ background-repeat: no-repeat;
261
+ }
262
+ .ie7 .button-glossy-demo-1, .ie8 .button-glossy-demo-1, .ie9 .button-glossy-demo-1 {
263
+ -webkit-border-radius: none;
264
+ -moz-border-radius: none;
265
+ -ms-border-radius: none;
266
+ -o-border-radius: none;
267
+ border-radius: none;
268
+ background: url('../img/picasso-buttons-glossy.png');
269
+ background-position: 0 -1px;
270
+ }
271
+ .ie7 .button-glossy-demo-1:hover, .ie8 .button-glossy-demo-1:hover, .ie9 .button-glossy-demo-1:hover {
272
+ background-position: 0 -31px;
273
+ }
274
+ .ie9 .button-glossy-demo-1 {
275
+ -webkit-border-radius: none;
276
+ -moz-border-radius: none;
277
+ -ms-border-radius: none;
278
+ -o-border-radius: none;
279
+ border-radius: none;
280
+ }
281
+
282
+ .button-glossy-demo-2 {
283
+ width: 70px;
284
+ height: 30px;
285
+ display: inline-block;
286
+ text-align: center;
287
+ position: relative;
288
+ z-index: 1;
289
+ font-family: sans-serif;
290
+ font-size: 12px;
291
+ text-decoration: none;
292
+ cursor: pointer;
293
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(100%, #0077b3)), -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #006699), color-stop(100%, #00334d));
294
+ background: -webkit-linear-gradient(#0088cc, #0077b3), -webkit-linear-gradient(#006699, #00334d);
295
+ background: -moz-linear-gradient(#0088cc, #0077b3), -moz-linear-gradient(#006699, #00334d);
296
+ background: -o-linear-gradient(#0088cc, #0077b3), -o-linear-gradient(#006699, #00334d);
297
+ background: linear-gradient(#0088cc, #0077b3), linear-gradient(#006699, #00334d);
298
+ -webkit-border-radius: 5px;
299
+ -moz-border-radius: 5px;
300
+ -ms-border-radius: 5px;
301
+ -o-border-radius: 5px;
302
+ border-radius: 5px;
303
+ background-position: left top, left 15px;
304
+ }
305
+ .button-glossy-demo-2:after, .button-glossy-demo-2:before {
306
+ content: "";
307
+ position: absolute;
308
+ display: inline-block;
309
+ }
310
+ .button-glossy-demo-2:after {
311
+ width: 68px;
312
+ height: 28px;
313
+ left: 1px;
314
+ top: 1px;
315
+ z-index: 2;
316
+ }
317
+ .button-glossy-demo-2:before {
318
+ width: 66px;
319
+ height: 26px;
320
+ left: 2px;
321
+ top: 2px;
322
+ z-index: 3;
323
+ }
324
+ .button-glossy-demo-2 span {
325
+ position: relative;
326
+ z-index: 4;
327
+ line-height: 30px;
328
+ }
329
+ .button-glossy-demo-2 span {
330
+ color: white;
331
+ }
332
+ .button-glossy-demo-2:after, .button-glossy-demo-2:before {
333
+ -webkit-border-radius: 4px;
334
+ -moz-border-radius: 4px;
335
+ -ms-border-radius: 4px;
336
+ -o-border-radius: 4px;
337
+ border-radius: 4px;
338
+ }
339
+ .button-glossy-demo-2:after {
340
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(15%, #66ccff), color-stop(100%, #000000)) 50%;
341
+ background: -webkit-linear-gradient(#66ccff 15%, #000000) 50%;
342
+ background: -moz-linear-gradient(#66ccff 15%, #000000) 50%;
343
+ background: -o-linear-gradient(#66ccff 15%, #000000) 50%;
344
+ background: linear-gradient(#66ccff 15%, #000000) 50%;
345
+ }
346
+ .button-glossy-demo-2:before {
347
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(100%, #0077b3)), -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #006699), color-stop(100%, #00334d));
348
+ background: -webkit-linear-gradient(#0088cc, #0077b3), -webkit-linear-gradient(#006699, #00334d);
349
+ background: -moz-linear-gradient(#0088cc, #0077b3), -moz-linear-gradient(#006699, #00334d);
350
+ background: -o-linear-gradient(#0088cc, #0077b3), -o-linear-gradient(#006699, #00334d);
351
+ background: linear-gradient(#0088cc, #0077b3), linear-gradient(#006699, #00334d);
352
+ background-position: left top, left 13px;
353
+ }
354
+ .button-glossy-demo-2, .button-glossy-demo-2:before {
355
+ background-size: 100% 50%;
356
+ background-repeat: no-repeat;
357
+ }
358
+ .button-glossy-demo-2:hover {
359
+ text-decoration: none;
360
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1ab2ff), color-stop(50%, #0070a8), color-stop(100%, #0088cc));
361
+ background: -webkit-linear-gradient(#1ab2ff, #0070a8, #0088cc);
362
+ background: -moz-linear-gradient(#1ab2ff, #0070a8, #0088cc);
363
+ background: -o-linear-gradient(#1ab2ff, #0070a8, #0088cc);
364
+ background: linear-gradient(#1ab2ff, #0070a8, #0088cc);
365
+ }
366
+ .button-glossy-demo-2:hover:after {
367
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #75d1ff), color-stop(100%, #007ebd)) 50%;
368
+ background: -webkit-linear-gradient(#75d1ff 20%, #007ebd) 50%;
369
+ background: -moz-linear-gradient(#75d1ff 20%, #007ebd) 50%;
370
+ background: -o-linear-gradient(#75d1ff 20%, #007ebd) 50%;
371
+ background: linear-gradient(#75d1ff 20%, #007ebd) 50%;
372
+ }
373
+ .button-glossy-demo-2:hover:before {
374
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1ab2ff), color-stop(50%, #0070a8), color-stop(100%, #0088cc));
375
+ background: -webkit-linear-gradient(#1ab2ff, #0070a8, #0088cc);
376
+ background: -moz-linear-gradient(#1ab2ff, #0070a8, #0088cc);
377
+ background: -o-linear-gradient(#1ab2ff, #0070a8, #0088cc);
378
+ background: linear-gradient(#1ab2ff, #0070a8, #0088cc);
379
+ }
380
+ .button-glossy-demo-2:hover, .button-glossy-demo-2:hover:before {
381
+ background-size: 100% 100%;
382
+ background-position: left top;
383
+ background-repeat: no-repeat;
384
+ }
385
+ .ie7 .button-glossy-demo-2, .ie8 .button-glossy-demo-2, .ie9 .button-glossy-demo-2 {
386
+ -webkit-border-radius: none;
387
+ -moz-border-radius: none;
388
+ -ms-border-radius: none;
389
+ -o-border-radius: none;
390
+ border-radius: none;
391
+ background: url('../img/picasso-buttons-glossy.png');
392
+ background-position: 0 -61px;
393
+ }
394
+ .ie7 .button-glossy-demo-2:hover, .ie8 .button-glossy-demo-2:hover, .ie9 .button-glossy-demo-2:hover {
395
+ background-position: 0 -91px;
396
+ }
397
+ .ie9 .button-glossy-demo-2 {
398
+ -webkit-border-radius: none;
399
+ -moz-border-radius: none;
400
+ -ms-border-radius: none;
401
+ -o-border-radius: none;
402
+ border-radius: none;
403
+ }
404
+
405
+ .button-glossy-demo-3 {
406
+ width: 80px;
407
+ height: 30px;
408
+ display: inline-block;
409
+ text-align: center;
410
+ position: relative;
411
+ z-index: 1;
412
+ font-family: sans-serif;
413
+ font-size: 12px;
414
+ text-decoration: none;
415
+ cursor: pointer;
416
+ 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));
417
+ background: -webkit-linear-gradient(#fbb450, #faa937), -webkit-linear-gradient(#fa9f1e, #c77605);
418
+ background: -moz-linear-gradient(#fbb450, #faa937), -moz-linear-gradient(#fa9f1e, #c77605);
419
+ background: -o-linear-gradient(#fbb450, #faa937), -o-linear-gradient(#fa9f1e, #c77605);
420
+ background: linear-gradient(#fbb450, #faa937), linear-gradient(#fa9f1e, #c77605);
421
+ -webkit-border-radius: 5px;
422
+ -moz-border-radius: 5px;
423
+ -ms-border-radius: 5px;
424
+ -o-border-radius: 5px;
425
+ border-radius: 5px;
426
+ background-position: left top, left 15px;
427
+ }
428
+ .button-glossy-demo-3:after, .button-glossy-demo-3:before {
429
+ content: "";
430
+ position: absolute;
431
+ display: inline-block;
432
+ }
433
+ .button-glossy-demo-3:after {
434
+ width: 78px;
435
+ height: 28px;
436
+ left: 1px;
437
+ top: 1px;
438
+ z-index: 2;
439
+ }
440
+ .button-glossy-demo-3:before {
441
+ width: 76px;
442
+ height: 26px;
443
+ left: 2px;
444
+ top: 2px;
445
+ z-index: 3;
446
+ }
447
+ .button-glossy-demo-3 span {
448
+ position: relative;
449
+ z-index: 4;
450
+ line-height: 30px;
451
+ }
452
+ .button-glossy-demo-3 span {
453
+ color: white;
454
+ }
455
+ .button-glossy-demo-3:after, .button-glossy-demo-3:before {
456
+ -webkit-border-radius: 4px;
457
+ -moz-border-radius: 4px;
458
+ -ms-border-radius: 4px;
459
+ -o-border-radius: 4px;
460
+ border-radius: 4px;
461
+ }
462
+ .button-glossy-demo-3:after {
463
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(15%, #fef4e6), color-stop(100%, #633b02)) 50%;
464
+ background: -webkit-linear-gradient(#fef4e6 15%, #633b02) 50%;
465
+ background: -moz-linear-gradient(#fef4e6 15%, #633b02) 50%;
466
+ background: -o-linear-gradient(#fef4e6 15%, #633b02) 50%;
467
+ background: linear-gradient(#fef4e6 15%, #633b02) 50%;
468
+ }
469
+ .button-glossy-demo-3:before {
470
+ 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));
471
+ background: -webkit-linear-gradient(#fbb450, #faa937), -webkit-linear-gradient(#fa9f1e, #c77605);
472
+ background: -moz-linear-gradient(#fbb450, #faa937), -moz-linear-gradient(#fa9f1e, #c77605);
473
+ background: -o-linear-gradient(#fbb450, #faa937), -o-linear-gradient(#fa9f1e, #c77605);
474
+ background: linear-gradient(#fbb450, #faa937), linear-gradient(#fa9f1e, #c77605);
475
+ background-position: left top, left 13px;
476
+ }
477
+ .button-glossy-demo-3, .button-glossy-demo-3:before {
478
+ background-size: 100% 50%;
479
+ background-repeat: no-repeat;
480
+ }
481
+ .button-glossy-demo-3:hover {
482
+ text-decoration: none;
483
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fdd49b), color-stop(50%, #faa52d), color-stop(100%, #ffb54c));
484
+ background: -webkit-linear-gradient(#fdd49b, #faa52d, #ffb54c);
485
+ background: -moz-linear-gradient(#fdd49b, #faa52d, #ffb54c);
486
+ background: -o-linear-gradient(#fdd49b, #faa52d, #ffb54c);
487
+ background: linear-gradient(#fdd49b, #faa52d, #ffb54c);
488
+ }
489
+ .button-glossy-demo-3:hover:after {
490
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #fffbf5), color-stop(100%, #fbae41)) 50%;
491
+ background: -webkit-linear-gradient(#fffbf5 20%, #fbae41) 50%;
492
+ background: -moz-linear-gradient(#fffbf5 20%, #fbae41) 50%;
493
+ background: -o-linear-gradient(#fffbf5 20%, #fbae41) 50%;
494
+ background: linear-gradient(#fffbf5 20%, #fbae41) 50%;
495
+ }
496
+ .button-glossy-demo-3:hover:before {
497
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fdd49b), color-stop(50%, #faa52d), color-stop(100%, #ffb54c));
498
+ background: -webkit-linear-gradient(#fdd49b, #faa52d, #ffb54c);
499
+ background: -moz-linear-gradient(#fdd49b, #faa52d, #ffb54c);
500
+ background: -o-linear-gradient(#fdd49b, #faa52d, #ffb54c);
501
+ background: linear-gradient(#fdd49b, #faa52d, #ffb54c);
502
+ }
503
+ .button-glossy-demo-3:hover, .button-glossy-demo-3:hover:before {
504
+ background-size: 100% 100%;
505
+ background-position: left top;
506
+ background-repeat: no-repeat;
507
+ }
508
+ .ie7 .button-glossy-demo-3, .ie8 .button-glossy-demo-3, .ie9 .button-glossy-demo-3 {
509
+ -webkit-border-radius: none;
510
+ -moz-border-radius: none;
511
+ -ms-border-radius: none;
512
+ -o-border-radius: none;
513
+ border-radius: none;
514
+ background: url('../img/picasso-buttons-glossy.png');
515
+ background-position: 0 -121px;
516
+ }
517
+ .ie7 .button-glossy-demo-3:hover, .ie8 .button-glossy-demo-3:hover, .ie9 .button-glossy-demo-3:hover {
518
+ background-position: 0 -151px;
519
+ }
520
+ .ie9 .button-glossy-demo-3 {
521
+ -webkit-border-radius: none;
522
+ -moz-border-radius: none;
523
+ -ms-border-radius: none;
524
+ -o-border-radius: none;
525
+ border-radius: none;
526
+ }
527
+
528
+ .button-3d-demo-1 {
529
+ overflow: hidden;
530
+ display: inline-block;
531
+ line-height: 2.2em;
532
+ color: white;
533
+ border: 1px solid #c00811;
534
+ font-family: sans-serif;
535
+ font-size: 13px;
536
+ text-decoration: none;
537
+ text-align: center;
538
+ cursor: pointer;
539
+ text-shadow: 0 1px 0 black;
540
+ -webkit-border-radius: 0.4em;
541
+ -moz-border-radius: 0.4em;
542
+ -ms-border-radius: 0.4em;
543
+ -o-border-radius: 0.4em;
544
+ border-radius: 0.4em;
545
+ }
546
+ .button-3d-demo-1:active {
547
+ position: relative;
548
+ top: 1px;
549
+ }
550
+ .button-3d-demo-1.disabled:active {
551
+ position: static;
552
+ }
553
+ .button-3d-demo-1 span {
554
+ display: block;
555
+ padding: 0 13px;
556
+ }
557
+ .button-3d-demo-1:visited {
558
+ color: white;
559
+ }
560
+ .button-3d-demo-1:hover {
561
+ text-decoration: none;
562
+ color: white;
563
+ }
564
+ .button-3d-demo-1 span {
565
+ background-color: #f73741;
566
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f73741), color-stop(100%, #8f060d));
567
+ background-image: -webkit-linear-gradient(#f73741, #8f060d);
568
+ background-image: -moz-linear-gradient(#f73741, #8f060d);
569
+ background-image: -o-linear-gradient(#f73741, #8f060d);
570
+ background-image: linear-gradient(#f73741, #8f060d);
571
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
572
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
573
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
574
+ }
575
+ .button-3d-demo-1 span:hover {
576
+ background-color: #ff2f3a;
577
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, #c00811));
578
+ background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), #c00811);
579
+ background-image: -moz-linear-gradient(rgba(255, 255, 255, 0), #c00811);
580
+ background-image: -o-linear-gradient(rgba(255, 255, 255, 0), #c00811);
581
+ background-image: linear-gradient(rgba(255, 255, 255, 0), #c00811);
582
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #ff2f3a;
583
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #ff2f3a;
584
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #ff2f3a;
585
+ }
586
+ .button-3d-demo-1 span:active {
587
+ text-shadow: 0 -1px 0 black;
588
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f73741), color-stop(100%, #8f060d));
589
+ background-image: -webkit-linear-gradient(#f73741, #8f060d);
590
+ background-image: -moz-linear-gradient(#f73741, #8f060d);
591
+ background-image: -o-linear-gradient(#f73741, #8f060d);
592
+ background-image: linear-gradient(#f73741, #8f060d);
593
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
594
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
595
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
596
+ }
597
+ .button-3d-demo-1.disabled {
598
+ border: 1px solid #755354;
599
+ cursor: not-allowed;
600
+ color: white;
601
+ }
602
+ .button-3d-demo-1.disabled span, .button-3d-demo-1.disabled span:hover, .button-3d-demo-1.disabled span:active {
603
+ text-shadow: 0 -1px 0 black;
604
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));
605
+ background-image: -webkit-linear-gradient(#979797, #4b4b4b);
606
+ background-image: -moz-linear-gradient(#979797, #4b4b4b);
607
+ background-image: -o-linear-gradient(#979797, #4b4b4b);
608
+ background-image: linear-gradient(#979797, #4b4b4b);
609
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
610
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
611
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
612
+ }
613
+ .ie7 .button-3d-demo-1 span, .ie8 .button-3d-demo-1 span, .ie9 .button-3d-demo-1 span {
614
+ *zoom: 1;
615
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00F73741', endColorstr='#FF8F060D');
616
+ }
617
+ .ie7 .button-3d-demo-1 span:hover, .ie8 .button-3d-demo-1 span:hover, .ie9 .button-3d-demo-1 span:hover {
618
+ *zoom: 1;
619
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FFC00811');
620
+ }
621
+ .ie7 .button-3d-demo-1 span:active, .ie8 .button-3d-demo-1 span:active, .ie9 .button-3d-demo-1 span:active {
622
+ *zoom: 1;
623
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00F73741', endColorstr='#FF8F060D');
624
+ }
625
+ .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 {
626
+ *zoom: 1;
627
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B');
628
+ }
629
+
630
+ .button-3d-demo-2 {
631
+ overflow: hidden;
632
+ display: inline-block;
633
+ line-height: 2.2em;
634
+ color: white;
635
+ border: 1px solid #004466;
636
+ font-family: sans-serif;
637
+ font-size: 13px;
638
+ text-decoration: none;
639
+ text-align: center;
640
+ cursor: pointer;
641
+ text-shadow: 0 1px 0 black;
642
+ -webkit-border-radius: 0.4em;
643
+ -moz-border-radius: 0.4em;
644
+ -ms-border-radius: 0.4em;
645
+ -o-border-radius: 0.4em;
646
+ border-radius: 0.4em;
647
+ }
648
+ .button-3d-demo-2:active {
649
+ position: relative;
650
+ top: 1px;
651
+ }
652
+ .button-3d-demo-2.disabled:active {
653
+ position: static;
654
+ }
655
+ .button-3d-demo-2 span {
656
+ display: block;
657
+ padding: 0 13px;
658
+ }
659
+ .button-3d-demo-2:visited {
660
+ color: white;
661
+ }
662
+ .button-3d-demo-2:hover {
663
+ text-decoration: none;
664
+ color: white;
665
+ }
666
+ .button-3d-demo-2 span {
667
+ background-color: #0088cc;
668
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(100%, #002233));
669
+ background-image: -webkit-linear-gradient(#0088cc, #002233);
670
+ background-image: -moz-linear-gradient(#0088cc, #002233);
671
+ background-image: -o-linear-gradient(#0088cc, #002233);
672
+ background-image: linear-gradient(#0088cc, #002233);
673
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
674
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
675
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
676
+ }
677
+ .button-3d-demo-2 span:hover {
678
+ background-color: #0088cc;
679
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, #004466));
680
+ background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), #004466);
681
+ background-image: -moz-linear-gradient(rgba(255, 255, 255, 0), #004466);
682
+ background-image: -o-linear-gradient(rgba(255, 255, 255, 0), #004466);
683
+ background-image: linear-gradient(rgba(255, 255, 255, 0), #004466);
684
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #0088cc;
685
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #0088cc;
686
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #0088cc;
687
+ }
688
+ .button-3d-demo-2 span:active {
689
+ text-shadow: 0 -1px 0 black;
690
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(100%, #002233));
691
+ background-image: -webkit-linear-gradient(#0088cc, #002233);
692
+ background-image: -moz-linear-gradient(#0088cc, #002233);
693
+ background-image: -o-linear-gradient(#0088cc, #002233);
694
+ background-image: linear-gradient(#0088cc, #002233);
695
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
696
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
697
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
698
+ }
699
+ .button-3d-demo-2.disabled {
700
+ border: 1px solid #755354;
701
+ cursor: not-allowed;
702
+ color: white;
703
+ }
704
+ .button-3d-demo-2.disabled span, .button-3d-demo-2.disabled span:hover, .button-3d-demo-2.disabled span:active {
705
+ text-shadow: 0 -1px 0 black;
706
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));
707
+ background-image: -webkit-linear-gradient(#979797, #4b4b4b);
708
+ background-image: -moz-linear-gradient(#979797, #4b4b4b);
709
+ background-image: -o-linear-gradient(#979797, #4b4b4b);
710
+ background-image: linear-gradient(#979797, #4b4b4b);
711
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
712
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
713
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
714
+ }
715
+ .ie7 .button-3d-demo-2 span, .ie8 .button-3d-demo-2 span, .ie9 .button-3d-demo-2 span {
716
+ *zoom: 1;
717
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#000088CC', endColorstr='#FF002233');
718
+ }
719
+ .ie7 .button-3d-demo-2 span:hover, .ie8 .button-3d-demo-2 span:hover, .ie9 .button-3d-demo-2 span:hover {
720
+ *zoom: 1;
721
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FF004466');
722
+ }
723
+ .ie7 .button-3d-demo-2 span:active, .ie8 .button-3d-demo-2 span:active, .ie9 .button-3d-demo-2 span:active {
724
+ *zoom: 1;
725
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#000088CC', endColorstr='#FF002233');
726
+ }
727
+ .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 {
728
+ *zoom: 1;
729
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B');
730
+ }
731
+
732
+ .button-3d-demo-3 {
733
+ overflow: hidden;
734
+ display: inline-block;
735
+ line-height: 2.2em;
736
+ color: white;
737
+ border: 1px solid #e08505;
738
+ font-family: sans-serif;
739
+ font-size: 13px;
740
+ text-decoration: none;
741
+ text-align: center;
742
+ cursor: pointer;
743
+ text-shadow: 0 1px 0 black;
744
+ -webkit-border-radius: 0.4em;
745
+ -moz-border-radius: 0.4em;
746
+ -ms-border-radius: 0.4em;
747
+ -o-border-radius: 0.4em;
748
+ border-radius: 0.4em;
749
+ }
750
+ .button-3d-demo-3:active {
751
+ position: relative;
752
+ top: 1px;
753
+ }
754
+ .button-3d-demo-3.disabled:active {
755
+ position: static;
756
+ }
757
+ .button-3d-demo-3 span {
758
+ display: block;
759
+ padding: 0 13px;
760
+ }
761
+ .button-3d-demo-3:visited {
762
+ color: white;
763
+ }
764
+ .button-3d-demo-3:hover {
765
+ text-decoration: none;
766
+ color: white;
767
+ }
768
+ .button-3d-demo-3 span {
769
+ background-color: #fbb450;
770
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fbb450), color-stop(100%, #ae6704));
771
+ background-image: -webkit-linear-gradient(#fbb450, #ae6704);
772
+ background-image: -moz-linear-gradient(#fbb450, #ae6704);
773
+ background-image: -o-linear-gradient(#fbb450, #ae6704);
774
+ background-image: linear-gradient(#fbb450, #ae6704);
775
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
776
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
777
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
778
+ }
779
+ .button-3d-demo-3 span:hover {
780
+ background-color: #ffb54c;
781
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, #e08505));
782
+ background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), #e08505);
783
+ background-image: -moz-linear-gradient(rgba(255, 255, 255, 0), #e08505);
784
+ background-image: -o-linear-gradient(rgba(255, 255, 255, 0), #e08505);
785
+ background-image: linear-gradient(rgba(255, 255, 255, 0), #e08505);
786
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #ffb54c;
787
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #ffb54c;
788
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #ffb54c;
789
+ }
790
+ .button-3d-demo-3 span:active {
791
+ text-shadow: 0 -1px 0 black;
792
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fbb450), color-stop(100%, #ae6704));
793
+ background-image: -webkit-linear-gradient(#fbb450, #ae6704);
794
+ background-image: -moz-linear-gradient(#fbb450, #ae6704);
795
+ background-image: -o-linear-gradient(#fbb450, #ae6704);
796
+ background-image: linear-gradient(#fbb450, #ae6704);
797
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
798
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
799
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
800
+ }
801
+ .button-3d-demo-3.disabled {
802
+ border: 1px solid #755354;
803
+ cursor: not-allowed;
804
+ color: white;
805
+ }
806
+ .button-3d-demo-3.disabled span, .button-3d-demo-3.disabled span:hover, .button-3d-demo-3.disabled span:active {
807
+ text-shadow: 0 -1px 0 black;
808
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));
809
+ background-image: -webkit-linear-gradient(#979797, #4b4b4b);
810
+ background-image: -moz-linear-gradient(#979797, #4b4b4b);
811
+ background-image: -o-linear-gradient(#979797, #4b4b4b);
812
+ background-image: linear-gradient(#979797, #4b4b4b);
813
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
814
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
815
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
816
+ }
817
+ .ie7 .button-3d-demo-3 span, .ie8 .button-3d-demo-3 span, .ie9 .button-3d-demo-3 span {
818
+ *zoom: 1;
819
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FBB450', endColorstr='#FFAE6704');
820
+ }
821
+ .ie7 .button-3d-demo-3 span:hover, .ie8 .button-3d-demo-3 span:hover, .ie9 .button-3d-demo-3 span:hover {
822
+ *zoom: 1;
823
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FFE08505');
824
+ }
825
+ .ie7 .button-3d-demo-3 span:active, .ie8 .button-3d-demo-3 span:active, .ie9 .button-3d-demo-3 span:active {
826
+ *zoom: 1;
827
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FBB450', endColorstr='#FFAE6704');
828
+ }
829
+ .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 {
830
+ *zoom: 1;
831
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B');
832
+ }
833
+
834
+ .button-3d-demo-4 {
835
+ overflow: hidden;
836
+ display: block;
837
+ line-height: 2.2em;
838
+ color: white;
839
+ border: 1px solid #00132e;
840
+ font-family: sans-serif;
841
+ font-size: 24px;
842
+ text-decoration: none;
843
+ text-align: center;
844
+ cursor: pointer;
845
+ text-shadow: 0 1px 0 black;
846
+ -webkit-border-radius: 0.4em;
847
+ -moz-border-radius: 0.4em;
848
+ -ms-border-radius: 0.4em;
849
+ -o-border-radius: 0.4em;
850
+ border-radius: 0.4em;
851
+ }
852
+ .button-3d-demo-4:active {
853
+ position: relative;
854
+ top: 1px;
855
+ }
856
+ .button-3d-demo-4.disabled:active {
857
+ position: static;
858
+ }
859
+ .button-3d-demo-4 span {
860
+ display: block;
861
+ padding: 0 24px;
862
+ }
863
+ .button-3d-demo-4:visited {
864
+ color: white;
865
+ }
866
+ .button-3d-demo-4:hover {
867
+ text-decoration: none;
868
+ color: white;
869
+ }
870
+ .button-3d-demo-4 span {
871
+ background-color: #013d93;
872
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #013d93), color-stop(100%, #000000));
873
+ background-image: -webkit-linear-gradient(#013d93, #000000);
874
+ background-image: -moz-linear-gradient(#013d93, #000000);
875
+ background-image: -o-linear-gradient(#013d93, #000000);
876
+ background-image: linear-gradient(#013d93, #000000);
877
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
878
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
879
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
880
+ }
881
+ .button-3d-demo-4 span:hover {
882
+ background-color: #003d94;
883
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, #00132e));
884
+ background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), #00132e);
885
+ background-image: -moz-linear-gradient(rgba(255, 255, 255, 0), #00132e);
886
+ background-image: -o-linear-gradient(rgba(255, 255, 255, 0), #00132e);
887
+ background-image: linear-gradient(rgba(255, 255, 255, 0), #00132e);
888
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #003d94;
889
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #003d94;
890
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #003d94;
891
+ }
892
+ .button-3d-demo-4 span:active {
893
+ text-shadow: 0 -1px 0 black;
894
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #013d93), color-stop(100%, #000000));
895
+ background-image: -webkit-linear-gradient(#013d93, #000000);
896
+ background-image: -moz-linear-gradient(#013d93, #000000);
897
+ background-image: -o-linear-gradient(#013d93, #000000);
898
+ background-image: linear-gradient(#013d93, #000000);
899
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
900
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
901
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
902
+ }
903
+ .button-3d-demo-4.disabled {
904
+ border: 1px solid #755354;
905
+ cursor: not-allowed;
906
+ color: white;
907
+ }
908
+ .button-3d-demo-4.disabled span, .button-3d-demo-4.disabled span:hover, .button-3d-demo-4.disabled span:active {
909
+ text-shadow: 0 -1px 0 black;
910
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));
911
+ background-image: -webkit-linear-gradient(#979797, #4b4b4b);
912
+ background-image: -moz-linear-gradient(#979797, #4b4b4b);
913
+ background-image: -o-linear-gradient(#979797, #4b4b4b);
914
+ background-image: linear-gradient(#979797, #4b4b4b);
915
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
916
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
917
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
918
+ }
919
+ .ie7 .button-3d-demo-4 span, .ie8 .button-3d-demo-4 span, .ie9 .button-3d-demo-4 span {
920
+ *zoom: 1;
921
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00013D93', endColorstr='#FF000000');
922
+ }
923
+ .ie7 .button-3d-demo-4 span:hover, .ie8 .button-3d-demo-4 span:hover, .ie9 .button-3d-demo-4 span:hover {
924
+ *zoom: 1;
925
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FF00132E');
926
+ }
927
+ .ie7 .button-3d-demo-4 span:active, .ie8 .button-3d-demo-4 span:active, .ie9 .button-3d-demo-4 span:active {
928
+ *zoom: 1;
929
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00013D93', endColorstr='#FF000000');
930
+ }
931
+ .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 {
932
+ *zoom: 1;
933
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B');
934
+ }
935
+
936
+ .button-3d-demo-5 {
937
+ overflow: hidden;
938
+ display: inline-block;
939
+ line-height: 1.75em;
940
+ color: #013d93;
941
+ border: 1px solid #bbbbbb;
942
+ font-family: sans-serif;
943
+ font-size: 11px;
944
+ text-decoration: none;
945
+ text-align: center;
946
+ cursor: pointer;
947
+ text-shadow: 0 1px 0 #b5b5b5;
948
+ -webkit-border-radius: 1.1em;
949
+ -moz-border-radius: 1.1em;
950
+ -ms-border-radius: 1.1em;
951
+ -o-border-radius: 1.1em;
952
+ border-radius: 1.1em;
953
+ }
954
+ .button-3d-demo-5:active {
955
+ position: relative;
956
+ top: 1px;
957
+ }
958
+ .button-3d-demo-5.disabled:active {
959
+ position: static;
960
+ }
961
+ .button-3d-demo-5 span {
962
+ display: block;
963
+ padding: 0 11px;
964
+ }
965
+ .button-3d-demo-5:visited {
966
+ color: #013d93;
967
+ }
968
+ .button-3d-demo-5:hover {
969
+ text-decoration: none;
970
+ color: #013d93;
971
+ }
972
+ .button-3d-demo-5 span {
973
+ background-color: #eeeeee;
974
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #eeeeee), color-stop(100%, #a2a2a2));
975
+ background-image: -webkit-linear-gradient(#eeeeee, #a2a2a2);
976
+ background-image: -moz-linear-gradient(#eeeeee, #a2a2a2);
977
+ background-image: -o-linear-gradient(#eeeeee, #a2a2a2);
978
+ background-image: linear-gradient(#eeeeee, #a2a2a2);
979
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
980
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
981
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
982
+ }
983
+ .button-3d-demo-5 span:hover {
984
+ background-color: #f0ecec;
985
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, #bbbbbb));
986
+ background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), #bbbbbb);
987
+ background-image: -moz-linear-gradient(rgba(255, 255, 255, 0), #bbbbbb);
988
+ background-image: -o-linear-gradient(rgba(255, 255, 255, 0), #bbbbbb);
989
+ background-image: linear-gradient(rgba(255, 255, 255, 0), #bbbbbb);
990
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #f0ecec;
991
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #f0ecec;
992
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #f0ecec;
993
+ }
994
+ .button-3d-demo-5 span:active {
995
+ text-shadow: 0 -1px 0 #b5b5b5;
996
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #eeeeee), color-stop(100%, #a2a2a2));
997
+ background-image: -webkit-linear-gradient(#eeeeee, #a2a2a2);
998
+ background-image: -moz-linear-gradient(#eeeeee, #a2a2a2);
999
+ background-image: -o-linear-gradient(#eeeeee, #a2a2a2);
1000
+ background-image: linear-gradient(#eeeeee, #a2a2a2);
1001
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
1002
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
1003
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
1004
+ }
1005
+ .button-3d-demo-5.disabled {
1006
+ border: 1px solid #755354;
1007
+ cursor: not-allowed;
1008
+ color: white;
1009
+ }
1010
+ .button-3d-demo-5.disabled span, .button-3d-demo-5.disabled span:hover, .button-3d-demo-5.disabled span:active {
1011
+ text-shadow: 0 -1px 0 black;
1012
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));
1013
+ background-image: -webkit-linear-gradient(#979797, #4b4b4b);
1014
+ background-image: -moz-linear-gradient(#979797, #4b4b4b);
1015
+ background-image: -o-linear-gradient(#979797, #4b4b4b);
1016
+ background-image: linear-gradient(#979797, #4b4b4b);
1017
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
1018
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
1019
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
1020
+ }
1021
+ .ie7 .button-3d-demo-5 span, .ie8 .button-3d-demo-5 span, .ie9 .button-3d-demo-5 span {
1022
+ *zoom: 1;
1023
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00EEEEEE', endColorstr='#FFA2A2A2');
1024
+ }
1025
+ .ie7 .button-3d-demo-5 span:hover, .ie8 .button-3d-demo-5 span:hover, .ie9 .button-3d-demo-5 span:hover {
1026
+ *zoom: 1;
1027
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FFBBBBBB');
1028
+ }
1029
+ .ie7 .button-3d-demo-5 span:active, .ie8 .button-3d-demo-5 span:active, .ie9 .button-3d-demo-5 span:active {
1030
+ *zoom: 1;
1031
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00EEEEEE', endColorstr='#FFA2A2A2');
1032
+ }
1033
+ .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 {
1034
+ *zoom: 1;
1035
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B');
1036
+ }
1037
+
1038
+ .button-mini-demo-1 {
1039
+ display: inline-block;
1040
+ height: 20px;
1041
+ padding-right: 10px;
1042
+ padding-right: 10px;
1043
+ font-family: sans-serif;
1044
+ text-decoration: none;
1045
+ cursor: pointer;
1046
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f0f0f0), color-stop(50%, #e3e3e3), color-stop(51%, #d6d6d6), color-stop(100%, #cacaca));
1047
+ background: -webkit-linear-gradient(top, #f0f0f0 0%, #e3e3e3 50%, #d6d6d6 51%, #cacaca 100%);
1048
+ background: -moz-linear-gradient(top, #f0f0f0 0%, #e3e3e3 50%, #d6d6d6 51%, #cacaca 100%);
1049
+ background: -o-linear-gradient(top, #f0f0f0 0%, #e3e3e3 50%, #d6d6d6 51%, #cacaca 100%);
1050
+ background: linear-gradient(top, #f0f0f0 0%, #e3e3e3 50%, #d6d6d6 51%, #cacaca 100%);
1051
+ -webkit-border-radius: 20px;
1052
+ -moz-border-radius: 20px;
1053
+ -ms-border-radius: 20px;
1054
+ -o-border-radius: 20px;
1055
+ border-radius: 20px;
1056
+ -webkit-box-shadow: #333333 0px 1px 2px 0px;
1057
+ -moz-box-shadow: #333333 0px 1px 2px 0px;
1058
+ box-shadow: #333333 0px 1px 2px 0px;
1059
+ }
1060
+ .button-mini-demo-1 span {
1061
+ height: 20px;
1062
+ line-height: 20px;
1063
+ padding-left: 10px;
1064
+ display: block;
1065
+ }
1066
+ .button-mini-demo-1:hover {
1067
+ text-decoration: none;
1068
+ background: #e3e3e3;
1069
+ }
1070
+ .button-mini-demo-1:active {
1071
+ background: #cacaca;
1072
+ -webkit-box-shadow: #999999 0px 0px 3px 3px inset;
1073
+ -moz-box-shadow: #999999 0px 0px 3px 3px inset;
1074
+ box-shadow: #999999 0px 0px 3px 3px inset;
1075
+ }
1076
+ .button-mini-demo-1 span {
1077
+ color: #0e6695;
1078
+ font-size: 11px;
1079
+ }
1080
+ .ie7 .button-mini-demo-1, .ie8 .button-mini-demo-1, .ie9 .button-mini-demo-1 {
1081
+ background: url('../img/picasso-buttons-mini.png');
1082
+ background-position: right -1px;
1083
+ }
1084
+ .ie7 .button-mini-demo-1:hover, .ie8 .button-mini-demo-1:hover, .ie9 .button-mini-demo-1:hover {
1085
+ background-position: right -21px;
1086
+ }
1087
+ .ie7 .button-mini-demo-1 span, .ie8 .button-mini-demo-1 span, .ie9 .button-mini-demo-1 span {
1088
+ background-image: url('../img/picasso-buttons-mini.png');
1089
+ background-color: white;
1090
+ background-position: 0 -1px;
1091
+ }
1092
+ .ie7 .button-mini-demo-1 span:hover, .ie8 .button-mini-demo-1 span:hover, .ie9 .button-mini-demo-1 span:hover {
1093
+ background-position: 0 -21px;
1094
+ }
1095
+ .ie9 .button-mini-demo-1 {
1096
+ -webkit-border-radius: none;
1097
+ -moz-border-radius: none;
1098
+ -ms-border-radius: none;
1099
+ -o-border-radius: none;
1100
+ border-radius: none;
1101
+ -webkit-box-shadow: none;
1102
+ -moz-box-shadow: none;
1103
+ box-shadow: none;
1104
+ }
1105
+
1106
+ .button-mini-demo-2 {
1107
+ display: inline-block;
1108
+ height: 20px;
1109
+ padding-right: 10px;
1110
+ padding-right: 10px;
1111
+ font-family: sans-serif;
1112
+ text-decoration: none;
1113
+ cursor: pointer;
1114
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(50%, #0077b3), color-stop(51%, #006699), color-stop(100%, #005580));
1115
+ background: -webkit-linear-gradient(top, #0088cc 0%, #0077b3 50%, #006699 51%, #005580 100%);
1116
+ background: -moz-linear-gradient(top, #0088cc 0%, #0077b3 50%, #006699 51%, #005580 100%);
1117
+ background: -o-linear-gradient(top, #0088cc 0%, #0077b3 50%, #006699 51%, #005580 100%);
1118
+ background: linear-gradient(top, #0088cc 0%, #0077b3 50%, #006699 51%, #005580 100%);
1119
+ -webkit-border-radius: 20px;
1120
+ -moz-border-radius: 20px;
1121
+ -ms-border-radius: 20px;
1122
+ -o-border-radius: 20px;
1123
+ border-radius: 20px;
1124
+ -webkit-box-shadow: #333333 0px 1px 2px 0px;
1125
+ -moz-box-shadow: #333333 0px 1px 2px 0px;
1126
+ box-shadow: #333333 0px 1px 2px 0px;
1127
+ }
1128
+ .button-mini-demo-2 span {
1129
+ height: 20px;
1130
+ line-height: 20px;
1131
+ padding-left: 10px;
1132
+ display: block;
1133
+ }
1134
+ .button-mini-demo-2:hover {
1135
+ text-decoration: none;
1136
+ background: #0077b3;
1137
+ }
1138
+ .button-mini-demo-2:active {
1139
+ background: #005580;
1140
+ -webkit-box-shadow: #999999 0px 0px 3px 3px inset;
1141
+ -moz-box-shadow: #999999 0px 0px 3px 3px inset;
1142
+ box-shadow: #999999 0px 0px 3px 3px inset;
1143
+ }
1144
+ .button-mini-demo-2 span {
1145
+ color: white;
1146
+ font-size: 11px;
1147
+ }
1148
+ .ie7 .button-mini-demo-2, .ie8 .button-mini-demo-2, .ie9 .button-mini-demo-2 {
1149
+ background: url('../img/picasso-buttons-mini.png');
1150
+ background-position: right -41px;
1151
+ }
1152
+ .ie7 .button-mini-demo-2:hover, .ie8 .button-mini-demo-2:hover, .ie9 .button-mini-demo-2:hover {
1153
+ background-position: right -61px;
1154
+ }
1155
+ .ie7 .button-mini-demo-2 span, .ie8 .button-mini-demo-2 span, .ie9 .button-mini-demo-2 span {
1156
+ background-image: url('../img/picasso-buttons-mini.png');
1157
+ background-color: white;
1158
+ background-position: 0 -41px;
1159
+ }
1160
+ .ie7 .button-mini-demo-2 span:hover, .ie8 .button-mini-demo-2 span:hover, .ie9 .button-mini-demo-2 span:hover {
1161
+ background-position: 0 -61px;
1162
+ }
1163
+ .ie9 .button-mini-demo-2 {
1164
+ -webkit-border-radius: none;
1165
+ -moz-border-radius: none;
1166
+ -ms-border-radius: none;
1167
+ -o-border-radius: none;
1168
+ border-radius: none;
1169
+ -webkit-box-shadow: none;
1170
+ -moz-box-shadow: none;
1171
+ box-shadow: none;
1172
+ }
1173
+
1174
+ .button-mini-demo-3 {
1175
+ display: inline-block;
1176
+ height: 20px;
1177
+ padding-right: 10px;
1178
+ padding-right: 10px;
1179
+ font-family: sans-serif;
1180
+ text-decoration: none;
1181
+ cursor: pointer;
1182
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #da4f49), color-stop(50%, #d63b34), color-stop(51%, #c72f29), color-stop(100%, #b22a24));
1183
+ background: -webkit-linear-gradient(top, #da4f49 0%, #d63b34 50%, #c72f29 51%, #b22a24 100%);
1184
+ background: -moz-linear-gradient(top, #da4f49 0%, #d63b34 50%, #c72f29 51%, #b22a24 100%);
1185
+ background: -o-linear-gradient(top, #da4f49 0%, #d63b34 50%, #c72f29 51%, #b22a24 100%);
1186
+ background: linear-gradient(top, #da4f49 0%, #d63b34 50%, #c72f29 51%, #b22a24 100%);
1187
+ -webkit-border-radius: 20px;
1188
+ -moz-border-radius: 20px;
1189
+ -ms-border-radius: 20px;
1190
+ -o-border-radius: 20px;
1191
+ border-radius: 20px;
1192
+ -webkit-box-shadow: #333333 0px 1px 2px 0px;
1193
+ -moz-box-shadow: #333333 0px 1px 2px 0px;
1194
+ box-shadow: #333333 0px 1px 2px 0px;
1195
+ }
1196
+ .button-mini-demo-3 span {
1197
+ height: 20px;
1198
+ line-height: 20px;
1199
+ padding-left: 10px;
1200
+ display: block;
1201
+ }
1202
+ .button-mini-demo-3:hover {
1203
+ text-decoration: none;
1204
+ background: #d63b34;
1205
+ }
1206
+ .button-mini-demo-3:active {
1207
+ background: #b22a24;
1208
+ -webkit-box-shadow: #999999 0px 0px 3px 3px inset;
1209
+ -moz-box-shadow: #999999 0px 0px 3px 3px inset;
1210
+ box-shadow: #999999 0px 0px 3px 3px inset;
1211
+ }
1212
+ .button-mini-demo-3 span {
1213
+ color: white;
1214
+ font-size: 11px;
1215
+ }
1216
+ .ie7 .button-mini-demo-3, .ie8 .button-mini-demo-3, .ie9 .button-mini-demo-3 {
1217
+ background: url('../img/picasso-buttons-mini.png');
1218
+ background-position: right -81px;
1219
+ }
1220
+ .ie7 .button-mini-demo-3:hover, .ie8 .button-mini-demo-3:hover, .ie9 .button-mini-demo-3:hover {
1221
+ background-position: right -101px;
1222
+ }
1223
+ .ie7 .button-mini-demo-3 span, .ie8 .button-mini-demo-3 span, .ie9 .button-mini-demo-3 span {
1224
+ background-image: url('../img/picasso-buttons-mini.png');
1225
+ background-color: white;
1226
+ background-position: 0 -81px;
1227
+ }
1228
+ .ie7 .button-mini-demo-3 span:hover, .ie8 .button-mini-demo-3 span:hover, .ie9 .button-mini-demo-3 span:hover {
1229
+ background-position: 0 -101px;
1230
+ }
1231
+ .ie9 .button-mini-demo-3 {
1232
+ -webkit-border-radius: none;
1233
+ -moz-border-radius: none;
1234
+ -ms-border-radius: none;
1235
+ -o-border-radius: none;
1236
+ border-radius: none;
1237
+ -webkit-box-shadow: none;
1238
+ -moz-box-shadow: none;
1239
+ box-shadow: none;
1240
+ }
1241
+
1242
+ .button-mini-demo-4 {
1243
+ display: inline-block;
1244
+ height: 20px;
1245
+ padding-right: 10px;
1246
+ padding-right: 10px;
1247
+ font-family: sans-serif;
1248
+ text-decoration: none;
1249
+ cursor: pointer;
1250
+ background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #414141), color-stop(50%, #343434), color-stop(51%, #272727), color-stop(100%, #1b1b1b));
1251
+ background: -webkit-linear-gradient(top, #414141 0%, #343434 50%, #272727 51%, #1b1b1b 100%);
1252
+ background: -moz-linear-gradient(top, #414141 0%, #343434 50%, #272727 51%, #1b1b1b 100%);
1253
+ background: -o-linear-gradient(top, #414141 0%, #343434 50%, #272727 51%, #1b1b1b 100%);
1254
+ background: linear-gradient(top, #414141 0%, #343434 50%, #272727 51%, #1b1b1b 100%);
1255
+ -webkit-border-radius: 20px;
1256
+ -moz-border-radius: 20px;
1257
+ -ms-border-radius: 20px;
1258
+ -o-border-radius: 20px;
1259
+ border-radius: 20px;
1260
+ -webkit-box-shadow: #333333 0px 1px 2px 0px;
1261
+ -moz-box-shadow: #333333 0px 1px 2px 0px;
1262
+ box-shadow: #333333 0px 1px 2px 0px;
1263
+ }
1264
+ .button-mini-demo-4 span {
1265
+ height: 20px;
1266
+ line-height: 20px;
1267
+ padding-left: 10px;
1268
+ display: block;
1269
+ }
1270
+ .button-mini-demo-4:hover {
1271
+ text-decoration: none;
1272
+ background: #343434;
1273
+ }
1274
+ .button-mini-demo-4:active {
1275
+ background: #1b1b1b;
1276
+ -webkit-box-shadow: #999999 0px 0px 3px 3px inset;
1277
+ -moz-box-shadow: #999999 0px 0px 3px 3px inset;
1278
+ box-shadow: #999999 0px 0px 3px 3px inset;
1279
+ }
1280
+ .button-mini-demo-4 span {
1281
+ color: white;
1282
+ font-size: 11px;
1283
+ }
1284
+ .ie7 .button-mini-demo-4, .ie8 .button-mini-demo-4, .ie9 .button-mini-demo-4 {
1285
+ background: url('../img/picasso-buttons-mini.png');
1286
+ background-position: right -121px;
1287
+ }
1288
+ .ie7 .button-mini-demo-4:hover, .ie8 .button-mini-demo-4:hover, .ie9 .button-mini-demo-4:hover {
1289
+ background-position: right -141px;
1290
+ }
1291
+ .ie7 .button-mini-demo-4 span, .ie8 .button-mini-demo-4 span, .ie9 .button-mini-demo-4 span {
1292
+ background-image: url('../img/picasso-buttons-mini.png');
1293
+ background-color: white;
1294
+ background-position: 0 -121px;
1295
+ }
1296
+ .ie7 .button-mini-demo-4 span:hover, .ie8 .button-mini-demo-4 span:hover, .ie9 .button-mini-demo-4 span:hover {
1297
+ background-position: 0 -141px;
1298
+ }
1299
+ .ie9 .button-mini-demo-4 {
1300
+ -webkit-border-radius: none;
1301
+ -moz-border-radius: none;
1302
+ -ms-border-radius: none;
1303
+ -o-border-radius: none;
1304
+ border-radius: none;
1305
+ -webkit-box-shadow: none;
1306
+ -moz-box-shadow: none;
1307
+ box-shadow: none;
1308
+ }
1309
+
1310
+ .list-grid-demo-1:before, .list-grid-demo-1:after {
1311
+ content: "";
1312
+ display: table;
1313
+ }
1314
+ .list-grid-demo-1:after {
1315
+ clear: both;
1316
+ }
1317
+ .ie6 .list-grid-demo-1, .ie7 .list-grid-demo-1 {
1318
+ zoom: 1;
1319
+ }
1320
+ .list-grid-demo-1 ul {
1321
+ float: left;
1322
+ padding: 0px;
1323
+ margin: 0px;
1324
+ width: 130px;
1325
+ }
1326
+ .list-grid-demo-1 ul li {
1327
+ height: 30px;
1328
+ line-height: 30px;
1329
+ padding-left: 10px;
1330
+ padding-right: 10px;
1331
+ }
1332
+ .list-grid-demo-1 ul {
1333
+ list-style: none outside none;
1334
+ border-top: 1px solid #cccccc;
1335
+ border-bottom: 1px solid #cccccc;
1336
+ border-right: 1px solid #cccccc;
1337
+ }
1338
+ .list-grid-demo-1 ul:first-child {
1339
+ border-left: 1px solid #cccccc;
1340
+ }
1341
+ .list-grid-demo-1 ul li {
1342
+ text-align: center;
1343
+ border: 1px solid transparent;
1344
+ }
1345
+ .list-grid-demo-1 ul li:first-child {
1346
+ border-bottom: 1px solid #cccccc;
1347
+ }
1348
+ .list-grid-demo-1 ul li:nth-child(odd) {
1349
+ background: none repeat scroll 0 0 #eeeeee;
1350
+ }
1351
+ .list-grid-demo-1 ul li:nth-child(even) {
1352
+ background: none repeat scroll 0 0 white;
1353
+ }
1354
+ .list-grid-demo-1 ul li.cell-hover:hover {
1355
+ border: 1px solid #319fda;
1356
+ background: #f4fafd;
1357
+ cursor: pointer;
1358
+ }
1359
+ .ie7 .list-grid-demo-1 ul li:first-child, .ie8 .list-grid-demo-1 ul li:first-child {
1360
+ background: none repeat scroll 0 0 #eeeeee;
1361
+ }
1362
+ .ie7 .list-grid-demo-1 ul li.even, .ie8 .list-grid-demo-1 ul li.even {
1363
+ background: none repeat scroll 0 0 white;
1364
+ }
1365
+ .ie7 .list-grid-demo-1 ul li.odd, .ie8 .list-grid-demo-1 ul li.odd {
1366
+ background: none repeat scroll 0 0 #eeeeee;
1367
+ }
1368
+
1369
+ .nav-demo-1:before, .nav-demo-1:after {
1370
+ content: "";
1371
+ display: table;
1372
+ }
1373
+ .nav-demo-1:after {
1374
+ clear: both;
1375
+ }
1376
+ .ie6 .nav-demo-1, .ie7 .nav-demo-1 {
1377
+ zoom: 1;
1378
+ }
1379
+ .nav-demo-1 ul {
1380
+ margin: 0;
1381
+ padding: 0;
1382
+ text-align: center;
1383
+ float: left;
1384
+ }
1385
+ .nav-demo-1 ul:before, .nav-demo-1 ul:after {
1386
+ content: "";
1387
+ display: table;
1388
+ }
1389
+ .nav-demo-1 ul:after {
1390
+ clear: both;
1391
+ }
1392
+ .ie6 .nav-demo-1 ul, .ie7 .nav-demo-1 ul {
1393
+ zoom: 1;
1394
+ }
1395
+ .nav-demo-1 ul li {
1396
+ display: inline-block;
1397
+ height: 40px;
1398
+ line-height: 40px;
1399
+ float: left;
1400
+ }
1401
+ .nav-demo-1 ul li a {
1402
+ display: block;
1403
+ padding: 0 15px;
1404
+ }
1405
+ .ie7 .nav-demo-1 ul li, .ie8 .nav-demo-1 ul li, .ie9 .nav-demo-1 ul li {
1406
+ height: 46px;
1407
+ }
1408
+ .nav-demo-1 ul {
1409
+ list-style: none;
1410
+ -webkit-box-shadow: 0 6px 6px -6px black;
1411
+ -moz-box-shadow: 0 6px 6px -6px black;
1412
+ box-shadow: 0 6px 6px -6px black;
1413
+ }
1414
+ .nav-demo-1 ul li {
1415
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #e6e6e6));
1416
+ background-image: -webkit-linear-gradient(#ffffff, #e6e6e6);
1417
+ background-image: -moz-linear-gradient(#ffffff, #e6e6e6);
1418
+ background-image: -o-linear-gradient(#ffffff, #e6e6e6);
1419
+ background-image: linear-gradient(#ffffff, #e6e6e6);
1420
+ border-left: 1px solid #acacac;
1421
+ border-top: 1px solid #acacac;
1422
+ border-bottom: 1px solid #acacac;
1423
+ }
1424
+ .nav-demo-1 ul li:hover {
1425
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #f2f2f2));
1426
+ background-image: -webkit-linear-gradient(#ffffff, #f2f2f2);
1427
+ background-image: -moz-linear-gradient(#ffffff, #f2f2f2);
1428
+ background-image: -o-linear-gradient(#ffffff, #f2f2f2);
1429
+ background-image: linear-gradient(#ffffff, #f2f2f2);
1430
+ }
1431
+ .nav-demo-1 ul li:first-child {
1432
+ -moz-border-radius-topleft: 5px;
1433
+ -webkit-border-top-left-radius: 5px;
1434
+ border-top-left-radius: 5px;
1435
+ -moz-border-radius-bottomleft: 5px;
1436
+ -webkit-border-bottom-left-radius: 5px;
1437
+ border-bottom-left-radius: 5px;
1438
+ }
1439
+ .nav-demo-1 ul li:last-child {
1440
+ -moz-border-radius-topright: 5px;
1441
+ -webkit-border-top-right-radius: 5px;
1442
+ border-top-right-radius: 5px;
1443
+ -moz-border-radius-bottomright: 5px;
1444
+ -webkit-border-bottom-right-radius: 5px;
1445
+ border-bottom-right-radius: 5px;
1446
+ border-right: 1px solid #acacac;
1447
+ }
1448
+ .nav-demo-1 ul li a {
1449
+ font-size: 16px;
1450
+ font-family: sans-serif;
1451
+ }
1452
+ .nav-demo-1 ul .active {
1453
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e6e6e6), color-stop(100%, #ffffff));
1454
+ background-image: -webkit-linear-gradient(#e6e6e6, #ffffff);
1455
+ background-image: -moz-linear-gradient(#e6e6e6, #ffffff);
1456
+ background-image: -o-linear-gradient(#e6e6e6, #ffffff);
1457
+ background-image: linear-gradient(#e6e6e6, #ffffff);
1458
+ }
1459
+ .ie7 .nav-demo-1 ul li, .ie8 .nav-demo-1 ul li, .ie9 .nav-demo-1 ul li {
1460
+ border-left: none;
1461
+ border-top: none;
1462
+ border-bottom: none;
1463
+ background: transparent url('../img/picasso-nav.png') no-repeat center -1px;
1464
+ }
1465
+ .ie7 .nav-demo-1 ul li a, .ie8 .nav-demo-1 ul li a, .ie9 .nav-demo-1 ul li a {
1466
+ border-left: 1px solid #acacac;
1467
+ }
1468
+ .ie7 .nav-demo-1 ul li:hover, .ie8 .nav-demo-1 ul li:hover, .ie9 .nav-demo-1 ul li:hover {
1469
+ background: transparent url('../img/picasso-nav.png') center -47px no-repeat;
1470
+ }
1471
+ .ie7 .nav-demo-1 ul li:first-child, .ie8 .nav-demo-1 ul li:first-child, .ie9 .nav-demo-1 ul li:first-child {
1472
+ background: transparent url('../img/picasso-nav.png') no-repeat left -1px;
1473
+ }
1474
+ .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 {
1475
+ border-left: none;
1476
+ }
1477
+ .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 {
1478
+ background: transparent url('../img/picasso-nav.png') left -47px no-repeat;
1479
+ }
1480
+ .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 {
1481
+ background: transparent url('../img/picasso-nav.png') no-repeat left -47px;
1482
+ }
1483
+ .ie7 .nav-demo-1 ul .last, .ie8 .nav-demo-1 ul .last, .ie9 .nav-demo-1 ul .last {
1484
+ background: transparent url('../img/picasso-nav.png') no-repeat right -47px;
1485
+ }
1486
+ .ie7 .nav-demo-1 ul .last:hover, .ie8 .nav-demo-1 ul .last:hover, .ie9 .nav-demo-1 ul .last:hover {
1487
+ background: transparent url('../img/picasso-nav.png') right -47px no-repeat;
1488
+ }
1489
+ .ie7 .nav-demo-1 ul .active, .ie8 .nav-demo-1 ul .active, .ie9 .nav-demo-1 ul .active {
1490
+ background: transparent url('../img/picasso-nav.png') no-repeat center -47px;
1491
+ }
1492
+ .ie7 .nav-demo-1 ul .last.active, .ie8 .nav-demo-1 ul .last.active, .ie9 .nav-demo-1 ul .last.active {
1493
+ background: transparent url('../img/picasso-nav.png') no-repeat right -47px;
1494
+ }
1495
+ .ie9 .nav-demo-1 ul {
1496
+ -webkit-box-shadow: none;
1497
+ -moz-box-shadow: none;
1498
+ box-shadow: none;
1499
+ }
1500
+ .ie9 .nav-demo-1 ul li:first-child {
1501
+ -moz-border-radius-topleft: none;
1502
+ -webkit-border-top-left-radius: none;
1503
+ border-top-left-radius: none;
1504
+ -moz-border-radius-bottomleft: none;
1505
+ -webkit-border-bottom-left-radius: none;
1506
+ border-bottom-left-radius: none;
1507
+ }
1508
+ .ie9 .nav-demo-1 ul li:last-child {
1509
+ -moz-border-radius-topright: none;
1510
+ -webkit-border-top-right-radius: none;
1511
+ border-top-right-radius: none;
1512
+ -moz-border-radius-bottomright: none;
1513
+ -webkit-border-bottom-right-radius: none;
1514
+ border-bottom-right-radius: none;
1515
+ border: none;
1516
+ }
1517
+
1518
+ .popup-demo-1 {
1519
+ padding: 10px;
1520
+ position: absolute;
1521
+ }
1522
+ .popup-demo-1:after, .ie7 .popup-demo-1 .after {
1523
+ content: "";
1524
+ position: absolute;
1525
+ top: 0;
1526
+ left: 0;
1527
+ width: 100%;
1528
+ height: 100%;
1529
+ z-index: 0;
1530
+ }
1531
+ .popup-demo-1 .popup-header h4 {
1532
+ line-height: 20px;
1533
+ padding: 10px;
1534
+ }
1535
+ .popup-demo-1 .popup-container {
1536
+ z-index: 1;
1537
+ position: relative;
1538
+ }
1539
+ .popup-demo-1 .popup-arrow {
1540
+ position: absolute;
1541
+ height: 0;
1542
+ width: 0;
1543
+ }
1544
+ .popup-demo-1 .popup-arrow-bottom {
1545
+ bottom: -10px;
1546
+ left: 10px;
1547
+ }
1548
+ .popup-demo-1 .popup-arrow-top {
1549
+ top: -10px;
1550
+ left: 10px;
1551
+ }
1552
+ .popup-demo-1 .popup-arrow-left {
1553
+ left: -10px;
1554
+ top: 10px;
1555
+ }
1556
+ .popup-demo-1 .popup-arrow-right {
1557
+ right: -10px;
1558
+ top: 10px;
1559
+ }
1560
+ .popup-demo-1 .popup-close {
1561
+ position: absolute;
1562
+ z-index: 10;
1563
+ text-align: center;
1564
+ line-height: 20px;
1565
+ height: 20px;
1566
+ width: 20px;
1567
+ top: -13px;
1568
+ right: -13px;
1569
+ }
1570
+ .ie7 .popup-demo-1 {
1571
+ zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
1572
+ }
1573
+ .ie7 .popup-demo-1 .popup-close, .ie8 .popup-demo-1 .popup-close {
1574
+ line-height: 26px;
1575
+ height: 26px;
1576
+ width: 26px;
1577
+ top: -13px;
1578
+ right: -13px;
1579
+ }
1580
+ .ie9 .popup-demo-1 .popup-close {
1581
+ height: 25px;
1582
+ width: 25px;
1583
+ }
1584
+ .popup-demo-1:after {
1585
+ background: black;
1586
+ background: rgba(0, 0, 0, 0.7);
1587
+ -webkit-border-radius: 3px;
1588
+ -moz-border-radius: 3px;
1589
+ -ms-border-radius: 3px;
1590
+ -o-border-radius: 3px;
1591
+ border-radius: 3px;
1592
+ -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0 0 10px;
1593
+ -moz-box-shadow: rgba(0, 0, 0, 0.5) 0 0 10px;
1594
+ box-shadow: rgba(0, 0, 0, 0.5) 0 0 10px;
1595
+ }
1596
+ .popup-demo-1 .popup-header {
1597
+ background: none repeat scroll 0 0 #f7f7f7;
1598
+ display: block;
1599
+ }
1600
+ .popup-demo-1 .popup-header h4 {
1601
+ margin: 0;
1602
+ color: #003770;
1603
+ font-family: sans-serif;
1604
+ font-size: 16px;
1605
+ font-weight: normal;
1606
+ }
1607
+ .popup-demo-1 .popup-content {
1608
+ background: white;
1609
+ border: 1px solid transparent;
1610
+ }
1611
+ .popup-demo-1 .popup-arrow-bottom {
1612
+ border-left: 10px solid transparent;
1613
+ border-right: 10px solid transparent;
1614
+ border-top: 10px solid rgba(0, 0, 0, 0.7);
1615
+ }
1616
+ .popup-demo-1 .popup-arrow-top {
1617
+ border-left: 10px solid transparent;
1618
+ border-right: 10px solid transparent;
1619
+ border-bottom: 10px solid rgba(0, 0, 0, 0.7);
1620
+ }
1621
+ .popup-demo-1 .popup-arrow-left {
1622
+ border-top: 10px solid transparent;
1623
+ border-bottom: 10px solid transparent;
1624
+ border-right: 10px solid rgba(0, 0, 0, 0.7);
1625
+ }
1626
+ .popup-demo-1 .popup-arrow-right {
1627
+ border-top: 10px solid transparent;
1628
+ border-bottom: 10px solid transparent;
1629
+ border-left: 10px solid rgba(0, 0, 0, 0.7);
1630
+ }
1631
+ .popup-demo-1 .popup-close {
1632
+ cursor: pointer;
1633
+ border: 3px solid white;
1634
+ color: white;
1635
+ font-weight: bold;
1636
+ font-family: arial, sans-serif;
1637
+ font-size: 20px;
1638
+ background: #319fda;
1639
+ -webkit-border-radius: 20px;
1640
+ -moz-border-radius: 20px;
1641
+ -ms-border-radius: 20px;
1642
+ -o-border-radius: 20px;
1643
+ border-radius: 20px;
1644
+ -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0 0 10px;
1645
+ -moz-box-shadow: rgba(0, 0, 0, 0.5) 0 0 10px;
1646
+ box-shadow: rgba(0, 0, 0, 0.5) 0 0 10px;
1647
+ }
1648
+ .ie7 .popup-demo-1 .after {
1649
+ background-color: black;
1650
+ filter: alpha(opacity=70);
1651
+ }
1652
+ .ie8 .popup-demo-1:after {
1653
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAQAAADYv8WvAAAAEElEQVR4nGNi2MywmYkBCAAJ8gFrYOfxtwAAAABJRU5ErkJggg==');
1654
+ }
1655
+ .ie7 .popup-demo-1 .popup-arrow, .ie8 .popup-demo-1 .popup-arrow {
1656
+ filter: alpha(opacity=70);
1657
+ }
1658
+ .ie7 .popup-demo-1 .popup-arrow-bottom, .ie8 .popup-demo-1 .popup-arrow-bottom {
1659
+ border-top: 10px solid black;
1660
+ }
1661
+ .ie7 .popup-demo-1 .popup-arrow-top, .ie8 .popup-demo-1 .popup-arrow-top {
1662
+ border-bottom: 10px solid black;
1663
+ }
1664
+ .ie7 .popup-demo-1 .popup-arrow-left, .ie8 .popup-demo-1 .popup-arrow-left {
1665
+ border-right: 10px solid black;
1666
+ }
1667
+ .ie7 .popup-demo-1 .popup-arrow-right, .ie8 .popup-demo-1 .popup-arrow-right {
1668
+ border-left: 10px solid black;
1669
+ }
1670
+ .ie7 .popup-demo-1 .popup-close, .ie8 .popup-demo-1 .popup-close {
1671
+ border-width: 0;
1672
+ background-color: transparent;
1673
+ background: url('../img/picasso-popup.png');
1674
+ background-position: 0 -1px;
1675
+ }
1676
+
1677
+ .popup-demo-2 {
1678
+ padding: 10px;
1679
+ position: absolute;
1680
+ color: white;
1681
+ }
1682
+ .popup-demo-2:after, .ie7 .popup-demo-2 .after {
1683
+ content: "";
1684
+ position: absolute;
1685
+ top: 0;
1686
+ left: 0;
1687
+ width: 100%;
1688
+ height: 100%;
1689
+ z-index: 0;
1690
+ }
1691
+ .popup-demo-2 .popup-header h4 {
1692
+ line-height: 20px;
1693
+ padding: 10px;
1694
+ }
1695
+ .popup-demo-2 .popup-container {
1696
+ z-index: 1;
1697
+ position: relative;
1698
+ }
1699
+ .popup-demo-2 .popup-arrow {
1700
+ position: absolute;
1701
+ height: 0;
1702
+ width: 0;
1703
+ }
1704
+ .popup-demo-2 .popup-arrow-bottom {
1705
+ bottom: -10px;
1706
+ left: 10px;
1707
+ }
1708
+ .popup-demo-2 .popup-arrow-top {
1709
+ top: -10px;
1710
+ left: 10px;
1711
+ }
1712
+ .popup-demo-2 .popup-arrow-left {
1713
+ left: -10px;
1714
+ top: 10px;
1715
+ }
1716
+ .popup-demo-2 .popup-arrow-right {
1717
+ right: -10px;
1718
+ top: 10px;
1719
+ }
1720
+ .popup-demo-2 .popup-close {
1721
+ position: absolute;
1722
+ z-index: 10;
1723
+ text-align: center;
1724
+ line-height: 20px;
1725
+ height: 20px;
1726
+ width: 20px;
1727
+ top: -13px;
1728
+ right: -13px;
1729
+ }
1730
+ .ie7 .popup-demo-2 {
1731
+ zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
1732
+ }
1733
+ .ie7 .popup-demo-2 .popup-close, .ie8 .popup-demo-2 .popup-close {
1734
+ line-height: 26px;
1735
+ height: 26px;
1736
+ width: 26px;
1737
+ top: -13px;
1738
+ right: -13px;
1739
+ }
1740
+ .ie9 .popup-demo-2 .popup-close {
1741
+ height: 25px;
1742
+ width: 25px;
1743
+ }
1744
+ .popup-demo-2:after {
1745
+ background: gray;
1746
+ background: rgba(128, 128, 128, 0.5);
1747
+ -webkit-border-radius: 10px;
1748
+ -moz-border-radius: 10px;
1749
+ -ms-border-radius: 10px;
1750
+ -o-border-radius: 10px;
1751
+ border-radius: 10px;
1752
+ -webkit-box-shadow: 0px 0px 5px #333333;
1753
+ -moz-box-shadow: 0px 0px 5px #333333;
1754
+ box-shadow: 0px 0px 5px #333333;
1755
+ }
1756
+ .popup-demo-2 .popup-header {
1757
+ background: white;
1758
+ display: block;
1759
+ }
1760
+ .popup-demo-2 .popup-header h4 {
1761
+ margin: 0;
1762
+ color: black;
1763
+ font-family: sans-serif;
1764
+ font-size: 16px;
1765
+ font-weight: normal;
1766
+ }
1767
+ .popup-demo-2 .popup-content {
1768
+ background: black;
1769
+ border: 1px solid transparent;
1770
+ }
1771
+ .popup-demo-2 .popup-arrow-bottom {
1772
+ border-left: 10px solid transparent;
1773
+ border-right: 10px solid transparent;
1774
+ border-top: 10px solid rgba(128, 128, 128, 0.5);
1775
+ }
1776
+ .popup-demo-2 .popup-arrow-top {
1777
+ border-left: 10px solid transparent;
1778
+ border-right: 10px solid transparent;
1779
+ border-bottom: 10px solid rgba(128, 128, 128, 0.5);
1780
+ }
1781
+ .popup-demo-2 .popup-arrow-left {
1782
+ border-top: 10px solid transparent;
1783
+ border-bottom: 10px solid transparent;
1784
+ border-right: 10px solid rgba(128, 128, 128, 0.5);
1785
+ }
1786
+ .popup-demo-2 .popup-arrow-right {
1787
+ border-top: 10px solid transparent;
1788
+ border-bottom: 10px solid transparent;
1789
+ border-left: 10px solid rgba(128, 128, 128, 0.5);
1790
+ }
1791
+ .popup-demo-2 .popup-close {
1792
+ cursor: pointer;
1793
+ border: 3px solid white;
1794
+ color: white;
1795
+ font-weight: bold;
1796
+ font-family: arial, sans-serif;
1797
+ font-size: 20px;
1798
+ background: black;
1799
+ -webkit-border-radius: 20px;
1800
+ -moz-border-radius: 20px;
1801
+ -ms-border-radius: 20px;
1802
+ -o-border-radius: 20px;
1803
+ border-radius: 20px;
1804
+ -webkit-box-shadow: 0px 0px 5px #333333;
1805
+ -moz-box-shadow: 0px 0px 5px #333333;
1806
+ box-shadow: 0px 0px 5px #333333;
1807
+ }
1808
+ .ie7 .popup-demo-2 .after {
1809
+ background-color: gray;
1810
+ filter: alpha(opacity=50);
1811
+ }
1812
+ .ie8 .popup-demo-2:after {
1813
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAQAAADYv8WvAAAAD0lEQVR4nGNqAAImBiAAAA8oAgWZ/tnVAAAAAElFTkSuQmCC');
1814
+ }
1815
+ .ie7 .popup-demo-2 .popup-arrow, .ie8 .popup-demo-2 .popup-arrow {
1816
+ filter: alpha(opacity=50);
1817
+ }
1818
+ .ie7 .popup-demo-2 .popup-arrow-bottom, .ie8 .popup-demo-2 .popup-arrow-bottom {
1819
+ border-top: 10px solid gray;
1820
+ }
1821
+ .ie7 .popup-demo-2 .popup-arrow-top, .ie8 .popup-demo-2 .popup-arrow-top {
1822
+ border-bottom: 10px solid gray;
1823
+ }
1824
+ .ie7 .popup-demo-2 .popup-arrow-left, .ie8 .popup-demo-2 .popup-arrow-left {
1825
+ border-right: 10px solid gray;
1826
+ }
1827
+ .ie7 .popup-demo-2 .popup-arrow-right, .ie8 .popup-demo-2 .popup-arrow-right {
1828
+ border-left: 10px solid gray;
1829
+ }
1830
+ .ie7 .popup-demo-2 .popup-close, .ie8 .popup-demo-2 .popup-close {
1831
+ border-width: 0;
1832
+ background-color: transparent;
1833
+ background: url('../img/picasso-popup.png');
1834
+ background-position: 0 -27px;
1835
+ }
1836
+
1837
+ .bubble-demo-1 {
1838
+ margin: 0 0 30px 0;
1839
+ }
1840
+
1841
+ .bubble-demo-1 {
1842
+ padding: 0.7em;
1843
+ position: relative;
1844
+ background: #eeeeee;
1845
+ -webkit-border-radius: 0.5em;
1846
+ -moz-border-radius: 0.5em;
1847
+ -ms-border-radius: 0.5em;
1848
+ -o-border-radius: 0.5em;
1849
+ border-radius: 0.5em;
1850
+ }
1851
+ .bubble-demo-1 blockquote, .bubble-demo-1 h4 {
1852
+ margin: 0;
1853
+ }
1854
+ .bubble-demo-1:after {
1855
+ content: '';
1856
+ position: absolute;
1857
+ right: 1em;
1858
+ bottom: -1em;
1859
+ }
1860
+ .bubble-demo-1 blockquote {
1861
+ color: #999999;
1862
+ }
1863
+ .bubble-demo-1:after {
1864
+ border-left: 0.7em solid transparent;
1865
+ border-right: 0.7em solid transparent;
1866
+ border-top: 1em solid #eeeeee;
1867
+ }
1868
+
1869
+ .bubble-demo-2 {
1870
+ padding: 0.7em;
1871
+ position: relative;
1872
+ background: #eeeeee;
1873
+ -webkit-border-radius: 0.5em;
1874
+ -moz-border-radius: 0.5em;
1875
+ -ms-border-radius: 0.5em;
1876
+ -o-border-radius: 0.5em;
1877
+ border-radius: 0.5em;
1878
+ }
1879
+ .bubble-demo-2 blockquote, .bubble-demo-2 h4 {
1880
+ margin: 0;
1881
+ }
1882
+ .bubble-demo-2:after {
1883
+ content: '';
1884
+ position: absolute;
1885
+ left: 1em;
1886
+ bottom: -1em;
1887
+ }
1888
+ .bubble-demo-2 blockquote {
1889
+ color: #999999;
1890
+ }
1891
+ .bubble-demo-2:after {
1892
+ border-left: 0.7em solid transparent;
1893
+ border-right: 0.7em solid transparent;
1894
+ border-top: 1em solid #eeeeee;
1895
+ }
1896
+
1897
+ .bubble-demo-3 {
1898
+ padding: 0.7em;
1899
+ position: relative;
1900
+ background: #eeeeee;
1901
+ -webkit-border-radius: 0.5em;
1902
+ -moz-border-radius: 0.5em;
1903
+ -ms-border-radius: 0.5em;
1904
+ -o-border-radius: 0.5em;
1905
+ border-radius: 0.5em;
1906
+ }
1907
+ .bubble-demo-3 blockquote, .bubble-demo-3 h4 {
1908
+ margin: 0;
1909
+ }
1910
+ .bubble-demo-3 blockquote {
1911
+ width: 100%;
1912
+ }
1913
+ .bubble-demo-3:after {
1914
+ content: '';
1915
+ position: absolute;
1916
+ right: 1em;
1917
+ bottom: -1em;
1918
+ }
1919
+ .bubble-demo-3 blockquote {
1920
+ color: #999999;
1921
+ white-space: nowrap;
1922
+ overflow: hidden;
1923
+ -ms-text-overflow: ellipsis;
1924
+ -o-text-overflow: ellipsis;
1925
+ text-overflow: ellipsis;
1926
+ }
1927
+ .bubble-demo-3:after {
1928
+ border-left: 0.7em solid transparent;
1929
+ border-right: 0.7em solid transparent;
1930
+ border-top: 1em solid #eeeeee;
1931
+ }
1932
+
1933
+ .accordion-demo-1 {
1934
+ border: 1px solid #cccccc;
1935
+ }
1936
+ .accordion-demo-1 .accordion-section {
1937
+ margin-top: 1px;
1938
+ }
1939
+ .accordion-demo-1 .accordion-section:first-child {
1940
+ margin-top: 0;
1941
+ }
1942
+ .accordion-demo-1 .accordion-header {
1943
+ padding: 0.407em 10px;
1944
+ }
1945
+ .accordion-demo-1 .accordion-header:before, .accordion-demo-1 .accordion-header:after {
1946
+ content: "";
1947
+ display: table;
1948
+ }
1949
+ .accordion-demo-1 .accordion-header:after {
1950
+ clear: both;
1951
+ }
1952
+ .ie6 .accordion-demo-1 .accordion-header, .ie7 .accordion-demo-1 .accordion-header {
1953
+ zoom: 1;
1954
+ }
1955
+ .accordion-demo-1 .accordion-header h4 {
1956
+ margin: 0;
1957
+ float: left;
1958
+ }
1959
+ .accordion-demo-1 .accordion-header .accordion-arrow {
1960
+ float: right;
1961
+ }
1962
+ .accordion-demo-1 .accordion-header {
1963
+ background-color: #013d93;
1964
+ color: white;
1965
+ cursor: pointer;
1966
+ font-size: 0.813em;
1967
+ line-height: 0.813em;
1968
+ }
1969
+ .accordion-demo-1 .accordion-header.accordion-header-open .accordion-arrow:after {
1970
+ content: "\25BC";
1971
+ }
1972
+ .accordion-demo-1 .accordion-header.accordion-header-close .accordion-arrow:after {
1973
+ content: "\25BA";
1974
+ }
1975
+
1976
+ .pagination-demo-1 {
1977
+ text-align: center;
1978
+ }
1979
+ .pagination-demo-1 ul {
1980
+ display: inline-block;
1981
+ }
1982
+ .pagination-demo-1 ul li {
1983
+ height: 27px;
1984
+ text-align: center;
1985
+ float: left;
1986
+ margin-left: 2px;
1987
+ margin-right: 2px;
1988
+ }
1989
+ .pagination-demo-1 ul li a {
1990
+ display: block;
1991
+ line-height: 27px;
1992
+ min-width: 27px;
1993
+ }
1994
+ .pagination-demo-1 ul .prev {
1995
+ margin: 0 10px 0 0;
1996
+ }
1997
+ .pagination-demo-1 ul .next {
1998
+ margin: 0 0 0 10px;
1999
+ }
2000
+ .pagination-demo-1 li {
2001
+ background: #eeeeee;
2002
+ border: 1px solid #cccccc;
2003
+ -webkit-border-radius: 5px;
2004
+ -moz-border-radius: 5px;
2005
+ -ms-border-radius: 5px;
2006
+ -o-border-radius: 5px;
2007
+ border-radius: 5px;
2008
+ list-style: none;
2009
+ }
2010
+ .pagination-demo-1 li a {
2011
+ color: #319fda;
2012
+ }
2013
+ .pagination-demo-1 li a:hover {
2014
+ color: white;
2015
+ }
2016
+ .pagination-demo-1 li:hover {
2017
+ background: #013d93;
2018
+ }
2019
+ .pagination-demo-1 .active, .pagination-demo-1 .prev, .pagination-demo-1 .next, .pagination-demo-1 .dots {
2020
+ background: none;
2021
+ border: none;
2022
+ }
2023
+ .pagination-demo-1 .active a:hover, .pagination-demo-1 .prev a:hover, .pagination-demo-1 .next a:hover, .pagination-demo-1 .dots a:hover {
2024
+ color: #319fda;
2025
+ }
2026
+ .pagination-demo-1 .active:hover, .pagination-demo-1 .prev:hover, .pagination-demo-1 .next:hover, .pagination-demo-1 .dots:hover {
2027
+ background: none;
2028
+ }
2029
+ .pagination-demo-1 .prev a:hover, .pagination-demo-1 .next a:hover {
2030
+ text-decoration: underline;
2031
+ }
2032
+ .pagination-demo-1 .active a, .pagination-demo-1 .dots a {
2033
+ color: #888888;
2034
+ cursor: default;
2035
+ text-decoration: none;
2036
+ }
2037
+ .pagination-demo-1 .active a:hover, .pagination-demo-1 .dots a:hover {
2038
+ color: #888888;
2039
+ text-decoration: none;
2040
+ }
2041
+ .pagination-demo-1 .disabled {
2042
+ background: none;
2043
+ border: none;
2044
+ }
2045
+ .pagination-demo-1 .disabled:hover {
2046
+ background: none;
2047
+ }
2048
+ .pagination-demo-1 .disabled a {
2049
+ color: #cccccc;
2050
+ text-decoration: none;
2051
+ cursor: not-allowed;
2052
+ }
2053
+ .pagination-demo-1 .disabled a:hover {
2054
+ text-decoration: none;
2055
+ color: #cccccc;
2056
+ }
2057
+
2058
+ .text-input-demo-1 {
2059
+ width: 200px;
2060
+ height: 20px;
2061
+ line-height: 20px;
2062
+ padding: 1px;
2063
+ border: 1px solid #dddddd;
2064
+ border-top: 1px solid #919191;
2065
+ color: #333333;
2066
+ font-size: 11px;
2067
+ -webkit-box-sizing: border-box;
2068
+ -moz-box-sizing: border-box;
2069
+ box-sizing: border-box;
2070
+ -webkit-border-radius: 3px 3px 3px 3px;
2071
+ -moz-border-radius: 3px 3px 3px 3px;
2072
+ -ms-border-radius: 3px 3px 3px 3px;
2073
+ -o-border-radius: 3px 3px 3px 3px;
2074
+ border-radius: 3px 3px 3px 3px;
2075
+ -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
2076
+ -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
2077
+ box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
2078
+ }
2079
+ .text-input-demo-1:focus {
2080
+ outline: 0;
2081
+ border: 1px solid #319fda;
2082
+ -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
2083
+ -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
2084
+ box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
2085
+ }
2086
+
2087
+ .select-demo-1 {
2088
+ width: 200px;
2089
+ height: 20px;
2090
+ line-height: 20px;
2091
+ padding: 1px;
2092
+ border: 1px solid #dddddd;
2093
+ border-top: 1px solid #919191;
2094
+ color: #333333;
2095
+ font-size: 11px;
2096
+ -webkit-box-sizing: border-box;
2097
+ -moz-box-sizing: border-box;
2098
+ box-sizing: border-box;
2099
+ -webkit-border-radius: 3px 3px 3px 3px;
2100
+ -moz-border-radius: 3px 3px 3px 3px;
2101
+ -ms-border-radius: 3px 3px 3px 3px;
2102
+ -o-border-radius: 3px 3px 3px 3px;
2103
+ border-radius: 3px 3px 3px 3px;
2104
+ -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
2105
+ -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
2106
+ box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
2107
+ }
2108
+ .select-demo-1:focus {
2109
+ outline: 0;
2110
+ border: 1px solid #319fda;
2111
+ -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
2112
+ -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
2113
+ box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
2114
+ }
2115
+
2116
+ .arrow-demo-1, .arrow-demo-3 {
2117
+ margin: 0 40px 0 0;
2118
+ }
2119
+
2120
+ .arrow-demo-1 {
2121
+ position: relative;
2122
+ height: 1.6em;
2123
+ line-height: 1.6em;
2124
+ display: inline-block;
2125
+ padding: 0 0 0 0.5em;
2126
+ font-style: normal;
2127
+ font-size: 10px;
2128
+ font-size: 0.625rem;
2129
+ background: black;
2130
+ color: white;
2131
+ -moz-border-radius-topleft: 0.1em;
2132
+ -webkit-border-top-left-radius: 0.1em;
2133
+ border-top-left-radius: 0.1em;
2134
+ -moz-border-radius-bottomleft: 0.1em;
2135
+ -webkit-border-bottom-left-radius: 0.1em;
2136
+ border-bottom-left-radius: 0.1em;
2137
+ }
2138
+ .arrow-demo-1:after {
2139
+ content: '';
2140
+ position: absolute;
2141
+ left: 100%;
2142
+ }
2143
+ .ie7 .arrow-demo-1 {
2144
+ padding: 0 0.5em;
2145
+ }
2146
+ .arrow-demo-1:after {
2147
+ border-top: 0.8em solid transparent;
2148
+ border-bottom: 0.8em solid transparent;
2149
+ border-left: 0.8em solid black;
2150
+ }
2151
+
2152
+ .arrow-demo-2 {
2153
+ position: relative;
2154
+ height: 1.6em;
2155
+ line-height: 1.6em;
2156
+ display: inline-block;
2157
+ padding: 0 0.5em 0 0;
2158
+ font-style: normal;
2159
+ font-size: 10px;
2160
+ font-size: 0.625rem;
2161
+ background: black;
2162
+ color: white;
2163
+ -moz-border-radius-topright: 0.1em;
2164
+ -webkit-border-top-right-radius: 0.1em;
2165
+ border-top-right-radius: 0.1em;
2166
+ -moz-border-radius-bottomright: 0.1em;
2167
+ -webkit-border-bottom-right-radius: 0.1em;
2168
+ border-bottom-right-radius: 0.1em;
2169
+ }
2170
+ .arrow-demo-2:after {
2171
+ content: '';
2172
+ position: absolute;
2173
+ right: 100%;
2174
+ }
2175
+ .ie7 .arrow-demo-2 {
2176
+ padding: 0 0.5em;
2177
+ }
2178
+ .arrow-demo-2:after {
2179
+ border-top: 0.8em solid transparent;
2180
+ border-bottom: 0.8em solid transparent;
2181
+ border-right: 0.8em solid black;
2182
+ }
2183
+
2184
+ .arrow-demo-3 {
2185
+ position: relative;
2186
+ height: 1.6em;
2187
+ line-height: 1.6em;
2188
+ display: inline-block;
2189
+ padding: 0 0 0 0.5em;
2190
+ font-style: normal;
2191
+ font-size: 25px;
2192
+ font-size: 1.563rem;
2193
+ background: #5fc8ff;
2194
+ color: white;
2195
+ -moz-border-radius-topleft: 0.1em;
2196
+ -webkit-border-top-left-radius: 0.1em;
2197
+ border-top-left-radius: 0.1em;
2198
+ -moz-border-radius-bottomleft: 0.1em;
2199
+ -webkit-border-bottom-left-radius: 0.1em;
2200
+ border-bottom-left-radius: 0.1em;
2201
+ }
2202
+ .arrow-demo-3:after {
2203
+ content: '';
2204
+ position: absolute;
2205
+ left: 100%;
2206
+ }
2207
+ .ie7 .arrow-demo-3 {
2208
+ padding: 0 0.5em;
2209
+ }
2210
+ .arrow-demo-3:after {
2211
+ border-top: 0.8em solid transparent;
2212
+ border-bottom: 0.8em solid transparent;
2213
+ border-left: 0.8em solid #5fc8ff;
2214
+ }
2215
+
2216
+ .arrow-demo-4 {
2217
+ position: relative;
2218
+ height: 1.6em;
2219
+ line-height: 1.6em;
2220
+ display: inline-block;
2221
+ padding: 0 0.5em 0 0;
2222
+ font-style: normal;
2223
+ font-size: 25px;
2224
+ font-size: 1.563rem;
2225
+ background: #5fc8ff;
2226
+ color: white;
2227
+ -moz-border-radius-topright: 0.1em;
2228
+ -webkit-border-top-right-radius: 0.1em;
2229
+ border-top-right-radius: 0.1em;
2230
+ -moz-border-radius-bottomright: 0.1em;
2231
+ -webkit-border-bottom-right-radius: 0.1em;
2232
+ border-bottom-right-radius: 0.1em;
2233
+ }
2234
+ .arrow-demo-4:after {
2235
+ content: '';
2236
+ position: absolute;
2237
+ right: 100%;
2238
+ }
2239
+ .ie7 .arrow-demo-4 {
2240
+ padding: 0 0.5em;
2241
+ }
2242
+ .arrow-demo-4:after {
2243
+ border-top: 0.8em solid transparent;
2244
+ border-bottom: 0.8em solid transparent;
2245
+ border-right: 0.8em solid #5fc8ff;
2246
+ }
2247
+
2248
+ .container {
2249
+ width: 90%;
2250
+ max-width: 1200px;
2251
+ min-width: 950px;
2252
+ }
2253
+
2254
+ .row-col {
2255
+ width: 100%;
2256
+ }
2257
+ .row-col:before, .row-col:after {
2258
+ content: "";
2259
+ display: table;
2260
+ }
2261
+ .row-col:after {
2262
+ clear: both;
2263
+ }
2264
+ .ie6 .row-col, .ie7 .row-col {
2265
+ zoom: 1;
2266
+ }
2267
+ .row-col [class^="col"] {
2268
+ width: 100%;
2269
+ min-height: 25px;
2270
+ display: block;
2271
+ float: left;
2272
+ margin-left: 2.174%;
2273
+ -webkit-box-sizing: border-box;
2274
+ -moz-box-sizing: border-box;
2275
+ box-sizing: border-box;
2276
+ }
2277
+ .row-col [class^="col"]:first-child {
2278
+ margin-left: 0;
2279
+ }
2280
+ .row-col [class^="col"] img {
2281
+ max-width: 100%;
2282
+ }
2283
+ .row-col .col1 {
2284
+ width: 6.341%;
2285
+ }
2286
+ .ie7 .row-col .col1 {
2287
+ width: 6.249%;
2288
+ }
2289
+ .row-col [class^="col"].offset1 {
2290
+ margin-left: 10.507%;
2291
+ }
2292
+ .row-col [class^="col"].offset1:first-child {
2293
+ margin-left: 8.424%;
2294
+ }
2295
+ .row-col .col2 {
2296
+ width: 14.855%;
2297
+ }
2298
+ .ie7 .row-col .col2 {
2299
+ width: 14.763%;
2300
+ }
2301
+ .row-col [class^="col"].offset2 {
2302
+ margin-left: 19.022%;
2303
+ }
2304
+ .row-col [class^="col"].offset2:first-child {
2305
+ margin-left: 16.938%;
2306
+ }
2307
+ .row-col .col3 {
2308
+ width: 23.37%;
2309
+ }
2310
+ .ie7 .row-col .col3 {
2311
+ width: 23.278%;
2312
+ }
2313
+ .row-col [class^="col"].offset3 {
2314
+ margin-left: 27.536%;
2315
+ }
2316
+ .row-col [class^="col"].offset3:first-child {
2317
+ margin-left: 25.453%;
2318
+ }
2319
+ .row-col .col4 {
2320
+ width: 31.884%;
2321
+ }
2322
+ .ie7 .row-col .col4 {
2323
+ width: 31.792%;
2324
+ }
2325
+ .row-col [class^="col"].offset4 {
2326
+ margin-left: 36.051%;
2327
+ }
2328
+ .row-col [class^="col"].offset4:first-child {
2329
+ margin-left: 33.967%;
2330
+ }
2331
+ .row-col .col5 {
2332
+ width: 40.399%;
2333
+ }
2334
+ .ie7 .row-col .col5 {
2335
+ width: 40.307%;
2336
+ }
2337
+ .row-col [class^="col"].offset5 {
2338
+ margin-left: 44.565%;
2339
+ }
2340
+ .row-col [class^="col"].offset5:first-child {
2341
+ margin-left: 42.482%;
2342
+ }
2343
+ .row-col .col6 {
2344
+ width: 48.913%;
2345
+ }
2346
+ .ie7 .row-col .col6 {
2347
+ width: 48.821%;
2348
+ }
2349
+ .row-col [class^="col"].offset6 {
2350
+ margin-left: 53.08%;
2351
+ }
2352
+ .row-col [class^="col"].offset6:first-child {
2353
+ margin-left: 50.996%;
2354
+ }
2355
+ .row-col .col7 {
2356
+ width: 57.428%;
2357
+ }
2358
+ .ie7 .row-col .col7 {
2359
+ width: 57.336%;
2360
+ }
2361
+ .row-col [class^="col"].offset7 {
2362
+ margin-left: 61.594%;
2363
+ }
2364
+ .row-col [class^="col"].offset7:first-child {
2365
+ margin-left: 59.511%;
2366
+ }
2367
+ .row-col .col8 {
2368
+ width: 65.942%;
2369
+ }
2370
+ .ie7 .row-col .col8 {
2371
+ width: 65.85%;
2372
+ }
2373
+ .row-col [class^="col"].offset8 {
2374
+ margin-left: 70.109%;
2375
+ }
2376
+ .row-col [class^="col"].offset8:first-child {
2377
+ margin-left: 68.025%;
2378
+ }
2379
+ .row-col .col9 {
2380
+ width: 74.457%;
2381
+ }
2382
+ .ie7 .row-col .col9 {
2383
+ width: 74.365%;
2384
+ }
2385
+ .row-col [class^="col"].offset9 {
2386
+ margin-left: 78.623%;
2387
+ }
2388
+ .row-col [class^="col"].offset9:first-child {
2389
+ margin-left: 76.54%;
2390
+ }
2391
+ .row-col .col10 {
2392
+ width: 82.971%;
2393
+ }
2394
+ .ie7 .row-col .col10 {
2395
+ width: 82.879%;
2396
+ }
2397
+ .row-col [class^="col"].offset10 {
2398
+ margin-left: 87.138%;
2399
+ }
2400
+ .row-col [class^="col"].offset10:first-child {
2401
+ margin-left: 85.054%;
2402
+ }
2403
+ .row-col .col11 {
2404
+ width: 91.486%;
2405
+ }
2406
+ .ie7 .row-col .col11 {
2407
+ width: 91.394%;
2408
+ }
2409
+ .row-col [class^="col"].offset11 {
2410
+ margin-left: 95.652%;
2411
+ }
2412
+ .row-col [class^="col"].offset11:first-child {
2413
+ margin-left: 93.569%;
2414
+ }
2415
+ .row-col .col12 {
2416
+ width: 100%;
2417
+ }
2418
+ .row-col [class^="col"].offset12 {
2419
+ margin-left: 104.167%;
2420
+ }
2421
+ .row-col [class^="col"].offset12:first-child {
2422
+ margin-left: 102.083%;
2423
+ }
2424
+
2425
+ .row-col {
2426
+ margin: 10px 0;
2427
+ }
2428
+
2429
+ [class^="col"] {
2430
+ -webkit-border-radius: 5px;
2431
+ -moz-border-radius: 5px;
2432
+ -ms-border-radius: 5px;
2433
+ -o-border-radius: 5px;
2434
+ border-radius: 5px;
2435
+ background: #CCC;
2436
+ }
2437
+
2438
+ [class^="col"] [class^="col"] {
2439
+ background: #AAA;
2440
+ }
2441
+
2442
+ [class^="col"] [class^="col"] [class^="col"] {
2443
+ background: #696969;
2444
+ color: #C0C0C0;
2445
+ }
2446
+
2447
+ .clearfix-demo {
2448
+ background: #58608D;
2449
+ width: 90%;
2450
+ padding: 10px;
2451
+ }
2452
+ .clearfix-demo:before, .clearfix-demo:after {
2453
+ content: "";
2454
+ display: table;
2455
+ }
2456
+ .clearfix-demo:after {
2457
+ clear: both;
2458
+ }
2459
+ .ie6 .clearfix-demo, .ie7 .clearfix-demo {
2460
+ zoom: 1;
2461
+ }
2462
+ .clearfix-demo div {
2463
+ background: white;
2464
+ }
2465
+
2466
+ .despegar-size-1-demo {
2467
+ font-size: 11px;
2468
+ }
2469
+
2470
+ .despegar-size-2-demo {
2471
+ font-size: 13px;
2472
+ }
2473
+
2474
+ .despegar-size-3-demo {
2475
+ font-size: 16px;
2476
+ }
2477
+
2478
+ .despegar-size-4-demo {
2479
+ font-size: 20px;
2480
+ }
2481
+
2482
+ .despegar-size-5-demo {
2483
+ font-size: 24px;
2484
+ }
2485
+
2486
+ .despegar-size-6-demo {
2487
+ font-size: 28px;
2488
+ }
2489
+
2490
+ .despegar-black-demo {
2491
+ padding: 10px;
2492
+ background: black;
2493
+ color: white;
2494
+ }
2495
+
2496
+ .despegar-white-demo {
2497
+ padding: 10px;
2498
+ background: white;
2499
+ }
2500
+
2501
+ .despegar-yellow-demo {
2502
+ padding: 10px;
2503
+ background: #ffff33;
2504
+ }
2505
+
2506
+ .despegar-red-demo {
2507
+ padding: 10px;
2508
+ background: red;
2509
+ }
2510
+
2511
+ .despegar-blue-demo {
2512
+ padding: 10px;
2513
+ background: #013d93;
2514
+ color: white;
2515
+ }
2516
+
2517
+ .despegar-gray-1-demo {
2518
+ padding: 10px;
2519
+ background: #222222;
2520
+ color: white;
2521
+ }
2522
+
2523
+ .despegar-gray-2-demo {
2524
+ padding: 10px;
2525
+ background: #444444;
2526
+ color: white;
2527
+ }
2528
+
2529
+ .despegar-gray-3-demo {
2530
+ padding: 10px;
2531
+ background: #666666;
2532
+ color: white;
2533
+ }
2534
+
2535
+ .despegar-gray-4-demo {
2536
+ padding: 10px;
2537
+ background: #888888;
2538
+ color: white;
2539
+ }
2540
+
2541
+ .despegar-gray-5-demo {
2542
+ padding: 10px;
2543
+ background: #aaaaaa;
2544
+ color: white;
2545
+ }
2546
+
2547
+ .despegar-gray-6-demo {
2548
+ padding: 10px;
2549
+ background: #cccccc;
2550
+ }
2551
+
2552
+ .despegar-gray-7-demo {
2553
+ padding: 10px;
2554
+ background: #eeeeee;
2555
+ }
2556
+
2557
+ .despegar-searchbox-bg-demo {
2558
+ padding: 10px;
2559
+ background: #ffff33;
2560
+ }
2561
+
2562
+ .despegar-title-color-demo {
2563
+ padding: 10px;
2564
+ background: #013d93;
2565
+ color: white;
2566
+ }
2567
+
2568
+ .despegar-titlealt-color-demo {
2569
+ padding: 10px;
2570
+ background: #ff9900;
2571
+ }
2572
+
2573
+ .despegar-link-color-demo {
2574
+ padding: 10px;
2575
+ background: #319fda;
2576
+ }
2577
+
2578
+ .despegar-link-color-hover-demo {
2579
+ padding: 10px;
2580
+ background: #66ccff;
2581
+ }
2582
+
2583
+ .despegar-error-bg-demo {
2584
+ padding: 10px;
2585
+ background: #ffe6e6;
2586
+ }
2587
+
2588
+ .despegar-error-border-demo {
2589
+ padding: 10px;
2590
+ background: red;
2591
+ }
2592
+
2593
+ .despegar-warning-bg-demo {
2594
+ padding: 10px;
2595
+ background: #ffffe1;
2596
+ }
2597
+
2598
+ .despegar-warning-border-demo {
2599
+ padding: 10px;
2600
+ background: #ffcc33;
2601
+ }
3
2602
  </style><!--[if lt IE 9]><script src="js/html5shiv.js"></script><![endif]--></head><body class="picasso-"><section class="container"><aside><h1><a href="index.html">Docs</a></h1><nav><ul><li><a href="_picasso.html">_picasso
4
2603
  </a></li><li><p>picasso</p><ul><li><a href="picasso-_components.html">_components
5
2604
  </a></li><li><a href="picasso-_despegar.html">_despegar
@@ -21,6 +2620,7 @@
21
2620
  </a></li></ul></li><li><p>utils</p><ul><li><a href="picasso-utils-_clearfix.html">_clearfix
22
2621
  </a></li><li><a href="picasso-utils-_grid.html">_grid
23
2622
  </a></li><li><a href="picasso-utils-_ie.html">_ie
2623
+ </a></li><li><a href="picasso-utils-_rem.html">_rem
24
2624
  </a></li><li><a href="picasso-utils-_sprite.html">_sprite
25
2625
  </a></li></ul></li></ul></nav></aside><section class="content"><article id="" class="section"><div class="docs"><p><img src="img/picasso.png" alt="Picasso. Framework CSS/Sass." title="Picasso. Framework CSS/Sass.">
26
2626
 
@@ -46,7 +2646,7 @@
46
2646
  </p>
47
2647
  <pre><code class="lang-ruby">require &#39;picasso&#39;
48
2648
  require &#39;magick&#39;
49
- gem &#39;picasso&#39;, &#39;~&gt; 0.3.3&#39;</code></pre>
2649
+ gem &#39;picasso&#39;, &#39;~&gt; 0.3.5&#39;</code></pre>
50
2650
  <p>Modificar el n&uacute;mero de versi&oacute;n a medida que se quiere usar nuevas versiones del framework.
51
2651
 
52
2652
  </p>
@@ -72,7 +2672,17 @@ gem &#39;picasso&#39;, &#39;~&gt; 0.3.3&#39;</code></pre>
72
2672
  <h3>Linux</h3>
73
2673
  <pre><code class="lang-bash">$ (sudo) apt-get update
74
2674
  $ (sudo) apt-get install ruby-oily-png</code></pre>
75
- </div></article><article id="changelog" class="section"><div class="docs"><h1>Changelog</h1><a href="#changelog" class="permalink ir">Changelog</a><h2>0.3.3</h2>
2675
+ </div></article><article id="changelog" class="section"><div class="docs"><h1>Changelog</h1><a href="#changelog" class="permalink ir">Changelog</a><h2>0.3.5</h2>
2676
+ <ul>
2677
+ <li>Refactor componente arrow para utilizar <code>em</code>;</li>
2678
+ <li>Agregado nuevo par&aacute;metro en el componente pagination: <code>disabled-color</code>;</li>
2679
+ </ul>
2680
+ <h2>0.3.4</h2>
2681
+ <ul>
2682
+ <li>Se quita soporte para IE7 de las flechas indicadoras en el componente accordion;</li>
2683
+ <li>Actualizaci&oacute;n de la documentaci&oacute;n para que use StyleDocco 0.5.0;</li>
2684
+ </ul>
2685
+ <h2>0.3.3</h2>
76
2686
  <ul>
77
2687
  <li>Se utiliza <code>image-url</code> en lugar de <code>generated-image-url</code> para la URL de los sprites;</li>
78
2688
  </ul>