/* 
    Document   : metro-helper
    Created on : 05-Apr-2013, 01:39:42
    Author     : Bent
    Description:
        Purpose of the stylesheet follows.
*/

.link{
    color: rgba(255, 255, 255, 0.8) !important;
}
.link:hover{
    color: rgba(255, 255, 255, 0.5) !important;
}

table[data-sorter='true'] > thead > tr{
    cursor: pointer;
}

/* background helper */
.bg-none{ background-color: transparent !important; }
.bg-transparent{ background-color: rgba(255, 255, 255, 0.25) !important; color: #FFFFFF !important; }
.bg-white{ background-color: #FFFFFF !important; color: #333333 !important; }

.bg-black, .bg-inverse{ background-color: #323232 !important; color: #FFFFFF !important; } /* RGB(50, 50, 50) */
.bg-silver{ background-color: #f3f3f3 !important; color: #333333 !important; } /* RGB(243, 243, 243) */
.bg-lime{ background-color: #A4C400 !important; color: #FFFFFF !important; } /* RGB(164, 196, 0) */
.bg-green{ background-color: #60A917 !important; color: #FFFFFF !important; } /* RGB(96, 169, 23) */
.bg-emerald{ background-color: #008A00 !important; color: #FFFFFF !important; } /* RGB(0, 138, 0) */
.bg-teal{ background-color: #00ABA9 !important; color: #FFFFFF !important; } /* RGB(0, 171, 169) */
.bg-cyan{ background-color: #2CAB56  !important; color: #FFFFFF !important; } /* RGB(27, 161, 226) */
.bg-cobalt{ background-color: #0050EF !important; color: #FFFFFF !important; } /* RGB(0, 80, 239) */
.bg-indigo{ background-color: #6A00FF !important; color: #FFFFFF !important; } /* RGB(106, 0, 255) */
.bg-violet{ background-color: #AA00FF !important; color: #FFFFFF !important; } /* RGB(170, 0, 255) */
.bg-pink{ background-color: #F472D0 !important; color: #FFFFFF !important; } /* RGB(244, 114, 208) */
.bg-magenta{ background-color: #D80073 !important; color: #FFFFFF !important; } /* RGB(216, 0, 115) */
.bg-crimson{ background-color: #A20025 !important; color: #FFFFFF !important; } /* RGB(162, 0, 37) */
.bg-red{ background-color: #E51400 !important; color: #FFFFFF !important; } /* RGB(229, 20, 0) */
.bg-orange{ background-color: #FA6800 !important; color: #FFFFFF !important; } /* RGB(250, 104, 0) */
.bg-amber{ background-color: #F0A30A !important; color: #FFFFFF !important; } /* RGB(240, 163, 10) */
.bg-yellow{ background-color: #E3C800 !important; color: #FFFFFF !important; } /* RGB(227, 200, 0) */
.bg-brown{ background-color: #825A2C !important; color: #FFFFFF !important; } /* RGB(130, 90, 44) */
.bg-olive{ background-color: #6D8764 !important; color: #FFFFFF !important; } /* RGB(109, 135, 100) */
.bg-steel{ background-color: #647687 !important; color: #FFFFFF !important; } /* RGB(100, 118, 135) */
.bg-mauve{ background-color: #76608A !important; color: #FFFFFF !important; } /* RGB(118, 96, 138) */
.bg-taupe{ background-color: #87794E !important; color: #FFFFFF !important; } /* RGB(135, 121, 78) */
/* end background helper */


/* border helper */
[class*='bordered'].border-2x{ border-width: 2px !important; }
[class*='bordered'].border-3x{ border-width: 3px !important; }

.bordered{ border: 1px solid #dddddd; }
.bordered-top{ border-top: 1px solid #dddddd; }
.bordered-right{ border-right: 1px solid #dddddd; }
.bordered-bottom{ border-bottom: 1px solid #dddddd; }
.bordered-left{ border-left: 1px solid #dddddd; }

.border-white{ border-color: #FFFFFF !important; }
.no-border{ border: 0 none !important; }

.border-black, .border-inverse{ border-color: #323232 !important; }
.border-silver{ border-color: #f3f3f3 !important; }
.border-lime{ border-color: #A4C400 !important; }
.border-green{ border-color: #60A917 !important; }
.border-emerald{ border-color: #008A00 !important; }
.border-teal{ border-color: #00ABA9 !important; }
.border-cyan{ border-color: #10541c !important; }
.border-cobalt{ border-color: #0050EF !important; }
.border-indigo{ border-color: #6A00FF !important; }
.border-violet{ border-color: #AA00FF !important; }
.border-pink{ border-color: #F472D0 !important; }
.border-magenta{ border-color: #D80073 !important; }
.border-crimson{ border-color: #A20025 !important; }
.border-red{ border-color: #E51400 !important; }
.border-orange{ border-color: #FA6800 !important; }
.border-amber{ border-color: #F0A30A !important; }
.border-yellow{ border-color: #E3C800 !important; }
.border-brown{ border-color: #825A2C !important; }
.border-olive{ border-color: #6D8764 !important; }
.border-steel{ border-color: #647687 !important; }
.border-mauve{ border-color: #76608A !important; }
.border-taupe{ border-color: #87794E !important; }

.border-circle{
    border: 2px solid #FFFFFF;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
/* end border helper */


/* outline helper */
[class*="outline-"]{
    cursor: pointer;
}
[class*="outline-"]:hover{
    outline: 3px solid;
}
.outline-white:hover{ outline-color: #FFFFFF !important; }
.no-outline:hover{ outline: 0 none !important; }

.outline-black:hover, .outline-inverse:hover{ outline-color: #323232 !important; }
.outline-silver:hover{ outline-color: #f3f3f3 !important; }
.outline-lime:hover{ outline-color: #A4C400 !important; }
.outline-green:hover{ outline-color: #60A917 !important; }
.outline-emerald:hover{ outline-color: #008A00 !important; }
.outline-teal:hover{ outline-color: #00ABA9 !important; }
.outline-cyan:hover{ outline-color: #40802b !important; }
.outline-cobalt:hover{ outline-color: #0050EF !important; }
.outline-indigo:hover{ outline-color: #6A00FF !important; }
.outline-violet:hover{ outline-color: #AA00FF !important; }
.outline-pink:hover{ outline-color: #F472D0 !important; }
.outline-magenta:hover{ outline-color: #D80073 !important; }
.outline-crimson:hover{ outline-color: #A20025 !important; }
.outline-red:hover{ outline-color: #E51400 !important; }
.outline-orange:hover{ outline-color: #FA6800 !important; }
.outline-amber:hover{ outline-color: #F0A30A !important; }
.outline-yellow:hover{ outline-color: #E3C800 !important; }
.outline-brown:hover{ outline-color: #825A2C !important; }
.outline-olive:hover{ outline-color: #6D8764 !important; }
.outline-steel:hover{ outline-color: #647687 !important; }
.outline-mauve:hover{ outline-color: #76608A !important; }
.outline-taupe:hover{ outline-color: #87794E !important; }
/* end outline helper */


/* font color helper */
.color-black, .color-inverse{color: #333333 !important;}
.color-white{color: #ffffff !important;}

.color-silver{ color: #f3f3f3 !important; }
.color-lime{ color: #A4C400 !important; }
.color-green{ color: #60A917 !important; }
.color-emerald{ color: #008A00 !important; }
.color-teal{ color: #00ABA9 !important; }
.color-cyan{ color: #10541c !important; }
.color-cobalt{ color: #0050EF !important; }
.color-indigo{ color: #6A00FF !important; }
.color-violet{ color: #AA00FF !important; }
.color-pink{ color: #F472D0 !important; }
.color-magenta{ color: #D80073 !important; }
.color-crimson{ color: #A20025 !important; }
.color-red{ color: #E51400 !important; }
.color-orange{ color: #FA6800 !important; }
.color-amber{ color: #F0A30A !important; }
.color-yellow{ color: #E3C800 !important; }
.color-brown{ color: #825A2C !important; }
.color-olive{ color: #6D8764 !important; }
.color-steel{ color: #647687 !important; }
.color-mauve{ color: #76608A !important; }
.color-taupe{ color: #87794E !important; }
/* font color helper */

/* text helper */
.text-small{
    font-size: 0.8em;
    vertical-align: middle;
}
.text-2x{
    font-size: 1.5em;
    vertical-align: middle;
}
.text-3x{
    font-size: 2em;
    vertical-align: middle;
}
.text-4x{
    font-size: 2.5em;
    vertical-align: middle;
}
.text-light{
    font-weight: lighter;
}
/* end text helper */


/* collumn helper */
.coll-helper{
    position: relative;
}
.coll-helper:after{
    content: '';
    display: table-cell;
    clear: both;
}
.coll-helper > div,
.coll-helper > .coll1{
    text-align: center;
    float: left;
    display: inline-block;
    width: 100%;
}
.coll-helper > .coll2{
    width: 50%;
}
.coll-helper > .coll3{
    width: 33.3333%;
}
.coll-helper > .coll4{
    width: 25%;
}
.coll-helper > .coll5{
    width: 20%;
}
.coll-helper > .coll6{
    width: 16.6666%;
}
.coll-helper > div > div{
    padding: 19px 0;
}
.coll-helper > div:last-child{
    margin-right: 0;
}
.coll-helper > [class*="coll"] > .btn{
    font-size: 1.2em;
    padding: 19px 0;
    font-weight: lighter
}
/* end collumn helper */


/* dashboard helper */
.shortcut{
    margin-bottom: 20px;
}
/* end dashboard helper */



/* dropdown menu theme */
/* black */
.dropdown-menu.black { border: 2px solid #323232; border: 2px solid rgba(50, 50, 50, 1); }
.dropdown-menu.black .divider { background-color: #323232; }
.dropdown-menu.black > .active > a,
.dropdown-menu.black > .active > a:hover,
.dropdown-menu.black > .active > a:focus { background-color: #323232; }
.navbar .nav > li > .dropdown-menu.black:after { border-bottom: 6px solid #323232; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.black:after { border-top: 7px solid #323232; }

/* lime */
.dropdown-menu.lime { border: 2px solid #A4C400; border: 2px solid rgba(164, 196, 0, 1); }
.dropdown-menu.lime .divider { background-color: #A4C400; }
.dropdown-menu.lime > .active > a,
.dropdown-menu.lime > .active > a:hover,
.dropdown-menu.lime > .active > a:focus { background-color: #A4C400; }
.navbar .nav > li > .dropdown-menu.lime:after { border-bottom: 6px solid #A4C400; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.lime:after { border-top: 7px solid #A4C400; }

/* green */
.dropdown-menu.green { border: 2px solid #60A917; border: 2px solid rgba(96, 169, 23, 1); }
.dropdown-menu.green .divider { background-color: #60A917; }
.dropdown-menu.green > .active > a,
.dropdown-menu.green > .active > a:hover,
.dropdown-menu.green > .active > a:focus { background-color: #60A917; }
.navbar .nav > li > .dropdown-menu.green:after { border-bottom: 6px solid #60A917; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.green:after { border-top: 7px solid #60A917; }

/* emerald */
.dropdown-menu.emerald { border: 2px solid #008A00; border: 2px solid rgba(0, 138, 0, 1); }
.dropdown-menu.emerald .divider { background-color: #008A00; }
.dropdown-menu.emerald > .active > a,
.dropdown-menu.emerald > .active > a:hover,
.dropdown-menu.emerald > .active > a:focus { background-color: #008A00; }
.navbar .nav > li > .dropdown-menu.emerald:after { border-bottom: 6px solid #008A00; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.emerald:after { border-top: 7px solid #008A00; }

/* teal */
.dropdown-menu.teal { border: 2px solid #00ABA9; border: 2px solid rgba(0, 171, 169, 1); }
.dropdown-menu.teal .divider { background-color: #00ABA9; }
.dropdown-menu.teal > .active > a,
.dropdown-menu.teal > .active > a:hover,
.dropdown-menu.teal > .active > a:focus { background-color: #00ABA9; }
.navbar .nav > li > .dropdown-menu.teal:after { border-bottom: 6px solid #00ABA9; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.teal:after { border-top: 7px solid #00ABA9; }

/* cyan */
.dropdown-menu.cyan { border: 2px solid #40802b; border: 2px solid rgba(27, 161, 226, 1); }
.dropdown-menu.cyan .divider { background-color: #40802b; }
.dropdown-menu.cyan > .active > a,
.dropdown-menu.cyan > .active > a:hover,
.dropdown-menu.cyan > .active > a:focus { background-color: #40802b; }
.navbar .nav > li > .dropdown-menu.cyan:after { border-bottom: 6px solid #40802b; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.cyan:after { border-top: 7px solid #40802b; }

/* silver */
.dropdown-menu.silver { border: 2px solid #dddddd; border: 2px solid rgba(221, 221, 221, 1); }
.dropdown-menu.silver .divider { background-color: #dddddd; }
.dropdown-menu.silver > .active > a,
.dropdown-menu.silver > .active > a:hover,
.dropdown-menu.silver > .active > a:focus { background-color: #dddddd; color: #000000; }
.navbar .nav > li > .dropdown-menu.silver:after { border-bottom: 6px solid #111111; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.silver:after { border-top: 7px solid #111111; }

/* cobalt */
.dropdown-menu.cobalt { border: 2px solid #0050EF; border: 2px solid rgba(0, 80, 239, 1); }
.dropdown-menu.cobalt .divider { background-color: #0050EF; }
.dropdown-menu.cobalt > .active > a,
.dropdown-menu.cobalt > .active > a:hover,
.dropdown-menu.cobalt > .active > a:focus { background-color: #0050EF; }
.navbar .nav > li > .dropdown-menu.cobalt:after { border-bottom: 6px solid #0050EF; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.cobalt:after { border-top: 7px solid #0050EF; }

/* indigo */
.dropdown-menu.indigo { border: 2px solid #6A00FF; border: 2px solid rgba(106, 0, 255, 1); }
.dropdown-menu.indigo .divider { background-color: #6A00FF; }
.dropdown-menu.indigo > .active > a,
.dropdown-menu.indigo > .active > a:hover,
.dropdown-menu.indigo > .active > a:focus { background-color: #6A00FF; }
.navbar .nav > li > .dropdown-menu.indigo:after { border-bottom: 6px solid #6A00FF; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.indigo:after { border-top: 7px solid #6A00FF; }

/* violet */
.dropdown-menu.violet { border: 2px solid #AA00FF; border: 2px solid rgba(170, 0, 255, 1); }
.dropdown-menu.violet .divider { background-color: #AA00FF; }
.dropdown-menu.violet > .active > a,
.dropdown-menu.violet > .active > a:hover,
.dropdown-menu.violet > .active > a:focus { background-color: #AA00FF; }
.navbar .nav > li > .dropdown-menu.violet:after { border-bottom: 6px solid #AA00FF; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.violet:after { border-top: 7px solid #AA00FF; }

/* pink */
.dropdown-menu.pink { border: 2px solid #F472D0; border: 2px solid rgba(244, 114, 208, 1); }
.dropdown-menu.pink .divider { background-color: #F472D0; }
.dropdown-menu.pink > .active > a,
.dropdown-menu.pink > .active > a:hover,
.dropdown-menu.pink > .active > a:focus { background-color: #F472D0; }
.navbar .nav > li > .dropdown-menu.pink:after { border-bottom: 6px solid #F472D0; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.pink:after { border-top: 7px solid #F472D0; }

/* magenta */
.dropdown-menu.magenta { border: 2px solid #D80073; border: 2px solid rgba(216, 0, 115, 1); }
.dropdown-menu.magenta .divider { background-color: #D80073; }
.dropdown-menu.magenta > .active > a,
.dropdown-menu.magenta > .active > a:hover,
.dropdown-menu.magenta > .active > a:focus { background-color: #D80073; }
.navbar .nav > li > .dropdown-menu.magenta:after { border-bottom: 6px solid #D80073; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.magenta:after { border-top: 7px solid #D80073; }

/* crimson */
.dropdown-menu.crimson { border: 2px solid #A20025; border: 2px solid rgba(162, 0, 37, 1); }
.dropdown-menu.crimson .divider { background-color: #A20025; }
.dropdown-menu.crimson > .active > a,
.dropdown-menu.crimson > .active > a:hover,
.dropdown-menu.crimson > .active > a:focus { background-color: #A20025; }
.navbar .nav > li > .dropdown-menu.crimson:after { border-bottom: 6px solid #A20025; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.crimson:after { border-top: 7px solid #A20025; }

/* red */
.dropdown-menu.red { border: 2px solid #E51400; border: 2px solid rgba(229, 20, 0, 1); }
.dropdown-menu.red .divider { background-color: #E51400; }
.dropdown-menu.red > .active > a,
.dropdown-menu.red > .active > a:hover,
.dropdown-menu.red > .active > a:focus { background-color: #E51400; }
.navbar .nav > li > .dropdown-menu.red:after { border-bottom: 6px solid #E51400; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.red:after { border-top: 7px solid #E51400; }

/* orange */
.dropdown-menu.orange { border: 2px solid #FA6800; border: 2px solid rgba(250, 104, 0, 1); }
.dropdown-menu.orange .divider { background-color: #FA6800; }
.dropdown-menu.orange > .active > a,
.dropdown-menu.orange > .active > a:hover,
.dropdown-menu.orange > .active > a:focus { background-color: #FA6800; }
.navbar .nav > li > .dropdown-menu.orange:after { border-bottom: 6px solid #FA6800; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.orange:after { border-top: 7px solid #FA6800; }

/* amber */
.dropdown-menu.amber { border: 2px solid #F0A30A; border: 2px solid rgba(240, 163, 10, 1); }
.dropdown-menu.amber .divider { background-color: #F0A30A; }
.dropdown-menu.amber > .active > a,
.dropdown-menu.amber > .active > a:hover,
.dropdown-menu.amber > .active > a:focus { background-color: #F0A30A; }
.navbar .nav > li > .dropdown-menu.amber:after { border-bottom: 6px solid #F0A30A; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.amber:after { border-top: 7px solid #F0A30A; }

/* yellow */
.dropdown-menu.yellow { border: 2px solid #E3C800; border: 2px solid rgba(227, 200, 0, 1); }
.dropdown-menu.yellow .divider { background-color: #E3C800; }
.dropdown-menu.yellow > .active > a,
.dropdown-menu.yellow > .active > a:hover,
.dropdown-menu.yellow > .active > a:focus { background-color: #E3C800; }
.navbar .nav > li > .dropdown-menu.yellow:after { border-bottom: 6px solid #E3C800; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.yellow:after { border-top: 7px solid #E3C800; }

/* brown */
.dropdown-menu.brown { border: 2px solid #825A2C; border: 2px solid rgba(130, 90, 44, 1); }
.dropdown-menu.brown .divider { background-color: #825A2C; }
.dropdown-menu.brown > .active > a,
.dropdown-menu.brown > .active > a:hover,
.dropdown-menu.brown > .active > a:focus { background-color: #825A2C; }
.navbar .nav > li > .dropdown-menu.brown:after { border-bottom: 6px solid #825A2C; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.brown:after { border-top: 7px solid #825A2C; }

/* olive */
.dropdown-menu.olive { border: 2px solid #6D8764; border: 2px solid rgba(109, 135, 100, 1); }
.dropdown-menu.olive .divider { background-color: #6D8764; }
.dropdown-menu.olive > .active > a,
.dropdown-menu.olive > .active > a:hover,
.dropdown-menu.olive > .active > a:focus { background-color: #6D8764; }
.navbar .nav > li > .dropdown-menu.olive:after { border-bottom: 6px solid #6D8764; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.olive:after { border-top: 7px solid #6D8764; }

/* steel */
.dropdown-menu.steel { border: 2px solid #647687; border: 2px solid rgba(100, 118, 135, 1); }
.dropdown-menu.steel .divider { background-color: #647687; }
.dropdown-menu.steel > .active > a,
.dropdown-menu.steel > .active > a:hover,
.dropdown-menu.steel > .active > a:focus { background-color: #647687; }
.navbar .nav > li > .dropdown-menu.steel:after { border-bottom: 6px solid #647687; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.steel:after { border-top: 7px solid #647687; }

/* mauve */
.dropdown-menu.mauve { border: 2px solid #76608A; border: 2px solid rgba(118, 96, 138, 1); }
.dropdown-menu.mauve .divider { background-color: #76608A; }
.dropdown-menu.mauve > .active > a,
.dropdown-menu.mauve > .active > a:hover,
.dropdown-menu.mauve > .active > a:focus { background-color: #76608A; }
.navbar .nav > li > .dropdown-menu.mauve:after { border-bottom: 6px solid #76608A; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.mauve:after { border-top: 7px solid #76608A; }

/* taupe */
.dropdown-menu.taupe { border: 2px solid #87794E; border: 2px solid rgba(135, 121, 78, 1); }
.dropdown-menu.taupe .divider { background-color: #87794E; }
.dropdown-menu.taupe > .active > a,
.dropdown-menu.taupe > .active > a:hover,
.dropdown-menu.taupe > .active > a:focus { background-color: #87794E; }
.navbar .nav > li > .dropdown-menu.taupe:after { border-bottom: 6px solid #87794E; }
.navbar-fixed-bottom .nav > li > .dropdown-menu.taupe:after { border-top: 7px solid #87794E; }

/* end dropdown menu theme */


/* Bootstrap code examples
-------------------------------------------------- */
/* Icons
------------------------- */
.the-icomoon{
    font-size: 16px;
    display: inline-block;
    float: left;
    line-height: 24px;
    text-align: center;
    width: 170px;
    height: 150px;
    padding: 15px;
    background: #f3f3f3;
    margin: .5em .5em .5em 0;
    
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.widget[class*="bg-"] .the-icomoon{
    background: rgba(255, 255, 255, 0.25);
}
.the-icomoon span {
    font-size: 42px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5px;
    
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.the-icons{
    margin-top:22px;
}
.the-icons .span3{
    cursor:pointer;
    line-height:32px;
    height:32px;
    padding-left:10px;
    -webkit-border-radius:6px;
    -moz-border-radius:6px;
    border-radius:6px;
}
.the-icons .span3{
    color:#222222;
    width:228px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: clip;
}

.the-icons .span3 [class^="aweso-"],
.the-icons .span3 [class*=" aweso-"]{
    width:32px;
    font-size:14px;
    display:inline-block;
    text-align:right;
    margin-right:10px;
}
.the-icons .span3:hover{
    background-color:#fff0f0;
    text-decoration:none;
}
.the-icons .span3:hover [class^="aweso-"],
.the-icons .span3:hover [class*=" aweso-"]{
    *font-size:28px;*vertical-align:middle;
}
.the-icons .span3:hover [class^="aweso-"]:before,
.the-icons .span3:hover [class*=" aweso-"]:before{
    font-size:28px;vertical-align:-5px;
}
.the-icons li {
    font-size: 16px;
    display: inline-block;
    float: left;
    line-height: 24px;
    text-align: center;
    width: 170px;
    height: 150px;
    padding: 15px;
    background: #f3f3f3;
    margin: .5em .5em .5em 0;
    
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
/* demo class */
.stilearn-block-demo {
    position: relative;
    margin: 15px 0;
    padding: 39px 19px 14px;
    *padding-top: 19px;
    background-color: rgba(255, 255, 255, 0.25);
    border: 1px solid rgba(255, 255, 255, 0.5);
    
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}
.stilearn-block-demo p > .btn,
.stilearn-block-demo > .btn,
.stilearn-block-demo > .btn-group,
.stilearn-block-demo .btn-toolbar > .btn-group{
    margin-bottom: 5px;
}
/* Echo out a label for the example */
.stilearn-block-demo:after {
    content: "Demo";
    position: absolute;
    top: -1px;
    left: -1px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: bold;
    background-color: rgba(255, 255, 255, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.5);
    
    -webkit-border-radius: 0px 0 0px 0;
    -moz-border-radius: 0px 0 0px 0;
    border-radius: 0px 0 0px 0;
}

/* Remove spacing between an example and it's code */
.stilearn-block-demo + .prettyprint {
    margin-top: -15px;
    padding-top: 15px;
}

/* Tweak examples
------------------------- */
.stilearn-block-demo > p:last-child {
    margin-bottom: 0;
}
.stilearn-block-demo .table,
.stilearn-block-demo .progress,
.stilearn-block-demo .well,
.stilearn-block-demo .alert,
.stilearn-block-demo .hero-unit,
.stilearn-block-demo .pagination,
.stilearn-block-demo .navbar,
.stilearn-block-demo > .nav,
.stilearn-block-demo blockquote {
    margin-bottom: 5px;
}
.stilearn-block-demo .pagination {
    margin-top: 0;
}
form.stilearn-block-demo {
    padding-bottom: 19px;
}
/* Images */
.stilearn-block-demo-images img {
    margin: 10px;
    display: inline-block;
}
/* Tooltips */
.tooltip-demo {
    text-align: center;
    margin: 0 0 10px;
    list-style: none;
}
.tooltip-demo li {
    display: inline;
    padding: 0 10px;
}
/* Popovers */
.stilearn-block-demo-popover {
    padding-bottom: 24px;
    background-color: #f9f9f9;
}
.stilearn-block-demo-popover .popover {
    position: relative;
    display: block;
    float: left;
    width: 260px;
    margin: 20px;
}
/* Dropdowns */
.stilearn-block-demo-pull{
    min-height: 60px;
}
.stilearn-block-demo-submenus {
    min-height: 180px;
}
.stilearn-block-demo-pull > .pull-left,
.stilearn-block-demo-submenus > .pull-left {
    margin-right: 20px;
    margin-bottom: 20px;
}
.stilearn-block-demo-submenus .dropup > .dropdown-menu,
.stilearn-block-demo-submenus .dropdown > .dropdown-menu {
    display: block;
    position: static;
    margin-bottom: 5px;
    *width: 180px;
}

/* Special grid styles
-------------------------------------------------- */
.show-grid {
  margin-top: 10px;
  margin-bottom: 20px;
}
.show-grid [class*="span"] {
  background-color: #eee;
  text-align: center;
  min-height: 40px;
  line-height: 40px;
}
.show-grid [class*="span"]:hover {
  background-color: #ddd;
}
.show-grid .show-grid {
  margin-top: 0;
  margin-bottom: 0;
}
.show-grid .show-grid [class*="span"] {
  margin-top: 5px;
}
.show-grid [class*="span"] [class*="span"] {
  background-color: #ccc;
}
.show-grid [class*="span"] [class*="span"] [class*="span"] {
  background-color: #999;
}

/* slider demo */
.demo-slider-vertical{
    float: left;
    margin-left: 20px;
    margin-right: 20px;
    margin-bottom: 20px;
}
/* themes-switcher */
.theme-switcher{
    margin: 0px;
    padding: 0px;
    list-style: none;
}
.theme-switcher > li{
    padding: 0px;
    display: inline-block;
    margin: 5px 2px;
}
.theme-switcher > li > a{
    margin: 0px;
    display: block;
    padding: 2px 5px;
    width: 100px;
}


/* jqueryui helper */
.ui-sortable-placeholder {
    line-height: 1.2em;
    border: 1px dotted black; 
    visibility: visible !important; 
    height: 50px !important;
}