Skip to content

Instantly share code, notes, and snippets.

@0gust1
Created February 15, 2012 10:41
Show Gist options
  • Save 0gust1/1834959 to your computer and use it in GitHub Desktop.
Save 0gust1/1834959 to your computer and use it in GitHub Desktop.
Pseudo cross browser stylesheets from my work (grid, buttons, icons)
@CHARSET "ISO-8859-1";
/*
Cette feuille de style est la brique de base :
Elle est composee :
- d'un reset CSS (normalisation cross browser des styles par defaut)
- un premier niveau de stylage minimal et générique (couleurs, marges, tailles et fontes)
- un ensemble de classes utilitaires destinees a etre reutilisees dans les differents developpements
- quelques classes spécifiques aux principaux plugins utilises sur stores.com (que nous vous invitons à supprimer si aucun besoin sur ce sujet)
*/
/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit; /*attention lors des surcharges*/
vertical-align: baseline;
color:inherit;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
/******************************************************************************/
/*STYLE BASE : Headings, text, content, links, table, forms... ****************/
/******************************************************************************/
/*STYLE BASE : Headings, text, content ****************************************/
html body{
font-family:Arial, Helvetica,sans-serif;
font-size: 11px;
line-height: 20px;
color:#00618d;
background-color:#ffffff;
}
/*Redefinition de la taille de police de base pour certaines langues*/
html body :lang(ar){font-size: 16px;}
html body :lang(zh){font-size: 16px;}
h1, h2, h3, h4, h5, h6{font-family: Arial, Helvetica, sans-serif; font-weight:bold;}
h1{font-size:18px; line-height:25px;}
h2{font-size:15px; line-height:20px;}
h3{font-size:14px; line-height:20px;}
h4{font-size:12px; line-height:20px;}
h5{font-size:10px; line-height:20px;}
h6{font-size:10px; line-height:20px;}
em{font-style: italic;}
strong{font-weight:bold;}
pre{font-family:monospace; white-space: pre; white-space: pre-wrap; word-wrap: break-word;}
blockquote{font-size:14px; line-height:20px; border:1px solid #eee;}
hr{border:0; width: 80%; color:#ddd; background-color:#ddd; height:1px; margin:9px auto 10px; clear:both;}
small{font-size:75%;}
.underline{text-decoration: underline;}
/* Remove the gap between images and borders on image containers h5bp.com/e
*/
img{border: 0; vertical-align: middle;}
/*STYLE BASE : Links *********************************************************/
a{color: #008fcb; cursor: pointer;}
a:link{color:#008fcb; -webkit-tap-highlight-color: #FF5E99; } /* j.mp/webkit-tap-highlight-color */
a:visited{color:#008ac6;}
a:focus{}
a:hover{color: #004766;}
a:active{}
/*STYLE BASE : List elements *************************************************/
ul{}
ul li{line-height:20px;}
/*ul li:before{content:'-';}*/
/*STYLES BASE : table elements ***********************************************/
/******
WARNING, if you use these stylesheet for refactoring an old application (layout made with tables) :
- The :hover rules on tables can annoy you
- If so, comment the :hover rules for tables
***********/
table{
width:100%;
border-collapse: collapse;
/*border:none;*/
line-height:2em;
margin:0;
font-family:Verdana, Geneva, sans-serif;
font-size:10px;
}
table thead{border-bottom:1px solid #ddd;}
table tbody th{font-weight:bold; text-align:left;}
table tbody tr:hover{background: rgb(169, 227, 255); background: rgba(118, 159, 179, 0.3);}
table td, table th{padding:1px 3px 1px 3px; vertical-align:middle;}
table thead td, table thead th{padding:1px 3px 1px 3px; vertical-align:bottom; text-align:center; font-weight:bold;}
table input[type='text']{font-family:Verdana, Geneva, sans-serif; font-size:10px; vertical-align:middle;}
table button{padding:0.2em;}
table tfoot td, table tfoot th{font-weight: bold;}
table tfoot{border-top:1px solid #ddd;}
/*A FINIR*/
#todo table caption{font-size:15px; font-weight:bold; background:#dedede; line-height:15px; padding:4px 0 4px 9px;}
#todo table input[type='text']{font-size:11px; vertical-align:middle;}/*explicit rule for inputs*/
#todo table button{padding:0;}
#todo table tfoot td{}
#todo table tfoot tr {}
#todo table tbody td{}
/*IE>6:OK*/
#todo table tbody tr{}
/*STYLE BASE : Form Elements *************************************************/
/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea, label { margin: 0; vertical-align: baseline;}
input[type='text']{border:1px solid #008fcb; padding-left:3px; padding-right:3px; background-color: white;}
input[type='radio']{border:none; cursor:pointer; vertical-align:text-bottom;}
input[type='checkbox']{border:none; cursor:pointer; vertical-align:text-bottom;}
input[type='text']:focus, textarea:focus{outline:orange solid 2px;}
input[disabled]{background: #ccc; color:#aaa;border:1px solid #999999; cursor:not-allowed;}
button[disabled]{background: #ccc; color:#aaa; border:1px solid #999999; cursor:not-allowed;}
select[disabled]{background: #ccc; color:#aaa; border:1px solid #999999; cursor:not-allowed;}
textarea{font-size:1.2em; line-height:1.2em; font-family:arial, sans-serif; overflow:auto; border:1px solid #008fcb; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; padding-left:3px; padding-right:3px;background-color: white;}
textarea[disabled]{cursor:not-allowed; background: #ccc; color:#aaa; border:1px solid #999999;}
select{border:1px solid #008fcb; color:#333; cursor:pointer; background:#fff;}
select option{border:none; color:#333;}
label{cursor:pointer;}
fieldset{
border:1px solid #cccccc;
margin:0 0 9px; padding:0 1% 9px 1%;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
fieldset legend{
color:#666666;
font-size:11px;
font-weight:bold;
padding: 0 3px;
line-height: 1.5em;
}
fieldset[disabled]{color:#ddd; background:#f0f0f0;}
form ul > li {margin:4px 0 0 0;}
/*sometimes, there are "buttons" and clickable elements in old apps which are not very cool (not button,nor inputs or links)
this rule helps to get back the original behavior (cursor change on rollover). Maybe it could a performance issue (universal selector as the key).*/
*[onclick]{cursor:pointer;}
/*STYLE BASE : Form Elements : Utility and misc ********************************/
.table-control{margin:0; line-height: 1em; padding: 0.5em 0 0 0;}
/*control-bars and button-bar are similars : controls are aligned to the left, buttons to the right*/
.button-bar{text-align:right;}
.button-bar .left{float:left; margin:0 0 0 1em;}
.button-bar .right{float:right; margin:0 1em 0 0;}
.button-bar button, .button-bar input{margin: 0 5px 5px 0;}
.controls-bar{text-align:left;}
.controls-bar .left{float:left; margin:0 0 0 1em;}
.controls-bar .right{float:right; margin:0 1em 0 0;}
.controls-bar button, .button-bar input{margin: 0 0 5px 5px;}
/*STYLE BASE : General : Utility and misc ********************************/
.error{color:red; font-weight:bold; background:#ddd;
border-radius:3px;
-moz-border-radius:3px;
padding:0 5px;
}
/*ajouter une classe nowrap aux tableaux dont on veut maitriser la hauteur de ligne*/
.nowrap{white-space: nowrap}
/*ajouter une classe .layout_fixed aux tableaux dont on veut maitriser la largeur de colonne (via la largeur des entetes)*/
.layout_fixed{table-layout:fixed;}
.invisible {display: none;}
.inactive{opacity:0.4; cursor:not-allowed;}
.active{opacity:1; cursor:pointer;}
/* Utility classes to easily make columns in a layout
don't forget to use a clearfix on the container, or a clear:left; or clear:both; on the next element after the container */
.col_15{width:13%; float:left; margin-right:1%; display:inline; position:relative;}
.col_25{width:22%; float:left; margin-right:1%; display:inline; position:relative;}
.col_33{width:31%; float:left; margin-right:1%; display:inline; position:relative;}
.col_50{width:49%; float:left; margin-right:1%; display:inline; position:relative;}
.col_75{width:72%; float:left; margin-right:1%; display:inline; position:relative;}
.col_100{width:97%; float:left; margin-right:0; display:inline; position:relative;}
/*ClearFix : Use this class on a element which contain floated elements, in order to get the normal flow back
i.e.: to have your parent element the right height.
*/
/* >> The Magnificent CLEARFIX: Updated to prevent margin-collapsing on child elements << j.mp/bestclearfix */
.clearfix:before, .clearfix:after {content: "\0020"; display: block; height: 0; visibility: hidden;}
.clearfix:after { clear: both; }
/* Fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */
.clearfix { zoom: 1; }
/* Redefinition de certains styles existants dans le fwk dkt ********************************/
.off{background:#ffffff;}
.alt{background:#f3f3f3;}
.center{text-align:center;}
.left{text-align:left;}
.right{text-align:right;}
.submit{color:#333;}
.off.selected-zone,
.alt.selected-zone{background-color: #a9e3ff;}
.selected{background-color:#a9e3ff;}
/*@TODO : A bouger*/
#stcom-menu li.level2.on.leaf ,
#stcom-menu li.level3.on {background-color: #a2dcf5;}
/* Class to define thousand numbers separator */
.sep {
margin-left: 2px;
}
/* Renders as strong (highlighted) text */
.strong{font-weight: bold;}
/* TODO A voir s'il faut les bouger */
div.moduleFrameLoaderWrapper{display:none;padding:5px 5px 0 5px; border:1px solid #ddd;}
iframe.moduleFrameLoader{width:100%; height: 100%;}
button.moduleBackButton{margin:0 0 10px 0px; box-shadow:0 0 10px #999;}
/*backgrounds==========================================*/
/*backgrounds du menu*/
.backg1{
background: #ACE6FF; /* old browsers */
background: -moz-linear-gradient(top, #ACE6FF 1%, #00B0FC 14%, #008FCB 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#ACE6FF), color-stop(14%,#00B0FC), color-stop(100%,#008FCB)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ACE6FF', endColorstr='#008FCB',GradientType=0 ); /* ie */
}
/*.backg1.on{border-top:1px solid #d0d0d0;border-left:1px solid #d0d0d0;border-right:1px solid #d0d0d0;background: #FFFFFF;color:#333333;}*/
/*backgrounds du mes preferences*/
.backg2{
border-top:1px solid #d0d0d0;
border-left:1px solid #d0d0d0;
border-right:1px solid #d0d0d0;
background: #EEEEEE; /* old browsers */
background: -moz-linear-gradient(top, #EEEEEE 0%, #FFFFFF 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#EEEEEE), color-stop(100%,#FFFFFF)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#EEEEEE', endColorstr='#FFFFFF',GradientType=0 ); /* ie */
}
/*backgrounds du stcom-content*/
/* bg used for iFrame */
.backg3{
background: url(images/bg_content.png) white repeat-x fixed;
}
/* bg used for stcom-content (bg fixed are positioned with respect to the viewport) */
.backg3bis{
background: url(images/bg_content.png) white repeat-x;
}
.backg4{
background: #008fcb; /* old browsers */
background: -moz-linear-gradient(top, #33c3ff 0%, #008fcb 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#33c3ff), color-stop(100%,#008fcb)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#33c3ff', endColorstr='#008fcb',GradientType=0 ); /* ie */
color:#fff;
}
/*Degrade gris sombre vers gris clair*/
/*utilise dans itemrecord.jsp*/
.backg5{
background-color: #444444;
background-image: -moz-linear-gradient(top, #999999, #444444); /* FF3.6 */
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #999999),color-stop(1, #444444)); /* Saf4+, Chrome */
background-image: -webkit-linear-gradient( #999999, #444444); /* Chrome 10+, Saf6 */
background-image: linear-gradient(top, #999999, #444444);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#999999', EndColorStr='#444444'); /* IE6 IE9 */
}
/*Degrade blanc vers gris clair*/
.backg6{
/*utilise dans itemrecord.jsp*/
background-color: #ffffff;
background-image: -moz-linear-gradient(top, #ffffff, #eeeeee); /* FF3.6 */
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #ffffff),color-stop(1, #eeeeee)); /* Saf4+, Chrome */
background-image: -webkit-linear-gradient(#ffffff, #eeeeee); /* Chrome 10+, Saf6 */
background-image: linear-gradient(top, #ffffff, #eeeeee);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#eeeeee'); /* IE6 IE9 */
}
/*ombre portee grise : 10px de rayon (pour l arbo et mes preferences*/
.shadow1{
-moz-box-shadow: 0px 0px 10px #585858; /* FF3.5+ */
-webkit-box-shadow: 0px 0px 10px #585858; /* Saf3.0+, Chrome */
box-shadow: 0px 0px 10px #585858; /* Opera 10.5, IE9 */
}
/*ombre portee grise : 5px de rayon */
.shadow2{
-moz-box-shadow: 0px 0px 5px #585858; /* FF3.5+ */
-webkit-box-shadow: 0px 0px 5px #585858; /* Saf3.0+, Chrome */
box-shadow: 0px 0px 5px #585858; /* Opera 10.5, IE9 */
}
/****************************************************************/
/** Tableaux simples **/
/******
WARNING, if you use these stylesheet for refactoring an old application (layout made with tables) :
***********/
table.stcom-table{
width:100%;
border-collapse: collapse;
border:0 none;
line-height:2em;
margin:0;
}
table.stcom-table caption{font-size:10px; font-weight:bold; background:#dedede; line-height:16px; padding:4px 0 4px 9px;}
table.stcom-table td, table.stcom-table th{padding:1px 3px 1px 3px; color:#585858; font-size:10px; vertical-align:middle;}
table.stcom-table th{font-weight:bold;}
table.stcom-table thead td, table.stcom-table thead th{padding:1px 3px 1px 3px; color:#00618d; font-weight:bold; vertical-align:top; text-align:center;}
table.stcom-table thead td{border:0 none;}
table.stcom-table tfoot td, table.stcom-table tfoot th{font-weight: bold;}
table.stcom-table tfoot td{}
table.stcom-table tfoot tr {}
table.stcom-table tbody th{font-weight:bold; text-align:left;}
table.stcom-table tbody td{}
/*IE>6:OK*/
table.stcom-table tbody tr:hover{background: rgb(221, 255, 115);
background: rgba(221, 255, 115, 0.3);}
/* NOT SUPPORTED BY IE<9
table tbody tr:nth-child(odd) td{}
table tbody tr:nth-child(even) td{
background: rgb(240, 240, 240);
background: rgba(230, 230, 230, 0.5);
}*/
/*FOR IE<=8*/
table.stcom-table tr.highlight{
background: rgb(238, 238, 238);
background: rgba(228, 228, 228, 0.5);
}
table.stcom-table{border-left:5px solid #E5E5E5; border-right:5px solid #E5E5E5; border-bottom:5px solid #E5E5E5;}
table.stcom-table colgroup{}
table.stcom-table colgroup:first-child{border:none;}/*column borders are managed with a border-left, so the first elem won't get it*/
table.stcom-table col{border-left:1px solid #ccc;}
table.stcom-table col:first-child{border:none;}/*column borders are managed with a border-left, so the first elem won't get it*/
table.stcom-table thead{background-color:#e5e5e5}
table.stcom-table thead tr{}
table.stcom-table thead td, table.stcom-table thead th{vertical-align:middle;}
table.stcom-table thead tr td:first-child, table.stcom-table thead tr th:first-child{border:none;}
table.stcom-table tfoot{color:#333; background-color:#e5e5e5;}
table.stcom-table tbody{}
table.stcom-table tbody tr{}
table.stcom-table tbody tr.alt{background-color:#f5f5f5;}
table.stcom-table tbody tr.off{background-color:#ffffff;}
table.stcom-table tbody th, table.stcom-table tbody td{vertical-align:middle; border-left:1px solid #E5E5E5;}
table.stcom-table tbody tr th:first-child, table.stcom-table tbody tr td:first-child{border-left:none;}
/*
.stcom-table tbody tr:hover{background: rgb(169, 227, 255);
background: rgba(169, 227, 255, 0.3);}
*/
table.stcom-table tbody tr:hover{background-color:#CBEEFF;}
/*table.stcom-table tbody tr.selected{background: rgb(169, 227, 255);}*/
/* tableau v2*/
table.stcom-table2{
width:100%;
border-collapse: collapse;
border:0 none;
line-height:2em;
margin:0;
border:1px solid #33c3ff;
}
table.stcom-table2 caption{font-size:16px; font-weight:bold; background:#dedede; line-height:16px; padding:4px 0 4px 9px;}
table.stcom-table2 button{}
table.stcom-table2 td{padding:1px 3px 1px 3px; vertical-align:middle;}
table.stcom-table2 th{font-weight:bold; padding:1px 3px 1px 3px; vertical-align:middle;}
table.stcom-table2 thead td, table.stcom-table2 thead th{padding:1px 3px 1px 3px; font-weight:bold; vertical-align:top; text-align:center;}
table.stcom-table2 thead td{border:0 none;}
table.stcom-table2 tfoot td, table.stcom-table2 tfoot th{font-weight: bold;}
table.stcom-table2 tfoot td{}
table.stcom-table2 tfoot tr {border-top:1px solid #77d3ff;}
table.stcom-table2 tbody th{font-weight:bold; text-align:left;}
table.stcom-table2 tbody td{}
/*IE>6:OK*/
table.stcom-table2 tbody tr:hover{background: rgb(221, 255, 115);
background: rgba(221, 255, 115, 0.3);}
/* NOT SUPPORTED BY IE<9
table tbody tr:nth-child(odd) td{}
table tbody tr:nth-child(even) td{
background: rgb(240, 240, 240);
background: rgba(230, 230, 230, 0.5);
}*/
/*FOR IE<=8*/
table.stcom-table2 tr.highlight{
background: rgb(238, 238, 238);
background: rgba(228, 228, 228, 0.5);
}
table.stcom-table2{border:1px solid #33c3ff;}
table.stcom-table2 colgroup{}
table.stcom-table2 colgroup:first-child{border:none;}/*column borders are managed with a border-left, so the first elem won't get it*/
table.stcom-table2 col{border-left:1px solid #77d3ff;}
table.stcom-table2 col:first-child{border:none;}/*column borders are managed with a border-left, so the first elem won't get it*/
table.stcom-table2 thead{background-color: #18a7e3; /* old browsers */
background: -moz-linear-gradient(top, #33c3ff 0%, #008fcb 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#33c3ff), color-stop(100%,#008fcb)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#33c3ff', endColorstr='#008fcb',GradientType=0 ); /* ie */
color:#fff;
border-bottom: 1px solid #33c3ff;
}
table.stcom-table2 thead tr{}
table.stcom-table2 thead td, table.stcom-table2 thead th{vertical-align:middle; border-left:1px solid #77d3ff;}
table.stcom-table2 thead tr td:first-child, table.stcom-table2 thead tr th:first-child{border:none;}
table.stcom-table2 tfoot{background-color:#008fcb; color:#eee;}
table.stcom-table2 tbody{}
table.stcom-table2 tbody tr{}
table.stcom-table2 tbody tr:last-child{border-bottom:1px solid #33c3ff;}
table.stcom-table2 tbody th, table.stcom-table2 tbody td{vertical-align:middle; border-left:1px solid #77d3ff;}
table.stcom-table2 tbody tr th:first-child, table.stcom-table2 tbody tr td:first-child{border-left:none;}
/*.stcom-table2 tbody tr:hover{background: rgb(169, 227, 255);
background: rgba(169, 227, 255, 0.3);}
*/
table.stcom-table2 tbody tr:hover{background: #cce9f5;}
table.stcom-table2 tbody tr.selected{background: #a2dcf5;}
/*gestion des entetes complexes (colspan, rowspan) de ce type de tableau*/
table.stcom-table2 thead tr th.th_borderB, table.stcom-table2 thead tr td.th_borderB, .stcom-table2 .th_borderB {border-bottom:1px solid #77d3ff;}
table.stcom-table2 thead tr th.th_borderL, table.stcom-table2 thead tr td.th_borderL, .stcom-table2 .th_borderL{border-left:1px solid #77d3ff;}
table.stcom-table2 thead tr th.th_borderR, table.stcom-table2 thead tr td.th_borderR, .stcom-table2 .th_borderR{border-right:1px solid #77d3ff;}
/****************************************************************/
/*******STYLES SPECIFIQUES : plugins stores *********************/
/****************************************************************/
/*********** Plugin Fixed table headers */
.table_overflow {overflow-y: scroll;}
/******************************************* Plugin Breadcrumb */
.breadcrumb ol li{float:left;}
/***************************************** Plugin Table sorter */
.colSort, .col_tri{
border-left:2px solid orange;
border-right:2px solid orange;
border-bottom:2px solid orange;
}
.col_tri_th {background:orange;}
table thead th.header{background: url(images/fleche_default.gif) no-repeat right 50% transparent; cursor:pointer; padding-right:13px;}
table thead th.header:hover{background: url(images/fleche_default_hover.gif) no-repeat right 50% transparent; padding-right:13px;}
table thead th.headerSortUp{background:url(images/fleche_asc.gif) no-repeat right center orange; padding-right:13px;}
table thead th.headerSortUp:hover{background:url(images/fleche_asc_hover.gif) no-repeat right center orange; padding-right:13px;}
table thead th.headerSortDown{background: url(images/fleche_desc.gif) no-repeat right center orange; padding-right:13px;}
table thead th.headerSortDown:hover{background: url(images/fleche_desc_hover.gif) no-repeat right center orange; padding-right:13px;}
table th.text, table td.text{text-align:left;}
/****************************************** Plugin MenuPath */
#menupath {
height:20px;
padding-left:20px; /* because .angle */
padding-top:3px;
padding-bottom:2px;
font-size:10px;
color:#006699;
background: #CDE8F6;
font-weight:bold;
width: auto;
}
#menupath ol.menumain {float:left;position:relative;display:inline;}
#menupath ol.menumain li{float:left;position:relative;display:inline;padding-left: 5px;}
#menupath ol.menuoptions {float:right;position:relative;display:inline;}
#menupath ol.menuoptions li{float:right;position:relative;display:inline;margin-right:5px;padding-right: 5px;}
#menupath a.factsheets {
background:url(../../image/stores/bg_btn_fichesP.gif) repeat-x top left;
color:#ffffff;
font-size:10px;
font-weight:bold;
height:21px;
padding:2px 5px 2px 5px;
cursor:pointer;
}
#menupath select.language {
background-color:#CDE8F6;
font-size:10px;
font-weight:bold;
}
#menupath a.pleinecran{
padding-top:1px;
font-size:10px;
color:#FF9900;
text-decoration:none;
white-space:nowrap;
}
#menupath div.angle{
background-color:#3399CC;
left:0;
top:0;
width:19px;
height:20px;
overflow:hidden;
position:absolute;
text-align:right;
}
/****************************************************************/
/*******FIN DES STYLES SPECIFIQUES : plugins stores *************/
/****************************************************************/
/*===========================================================================================*/
/*Surcharge des CSS de jQueryUI*/
/*Global*/
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { font-weight: bold; }
.ui-widget-header {
background: #008fcb; /* old browsers */
background: -moz-linear-gradient(top, #33c3ff 0%, #008fcb 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#33c3ff), color-stop(100%,#008fcb)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#33c3ff', endColorstr='#008fcb',GradientType=0 ); /* ie */
color:#fff;
}
.ui-tabs{border:none;}
/*Accordion plugin*/
.ui-accordion .ui-accordion-content{padding:0.5em;}
.ui-accordion .ui-accordion-header { border-color: #dedede; }
.ui-accordion .ui-accordion-header a {padding:0.05em 0 0.05em 0;}
.ui-accordion .ui-accordion-header{} /*header de l'accordeon ferme*/
.ui-accordion-icons .ui-accordion-header a {padding-left:16px;}
.ui-accordion .ui-accordion-header .ui-icon{left:0;}
.ui-state-active .ui-icon{}
.ui-icon-triangle-1-s{}/*ouvert*/
.ui-icon-triangle-1-e{}/*ferme*/
.ui-icon{}
/*Tabs plugin*/
.ui-tabs .ui-tabs-panel{padding:0.5em;}
.ui-tabs .ui-tabs-nav li a {padding:0 0.5em 0 0.5em;}
/*Date Picket plugin*/
.ui-datepicker table { font-size: 1em; }
/*Buttons plugin*/
.ui-widget .ui-button {
-webkit-border-radius: .3em;
-moz-border-radius: .3em;
-o-border-radius: .3em; /* Opera removed support but it might work in older (pre 10.5) versions? */
border-radius: .3em;
border: 1px solid #999999;
}
/*===========================================================================================*/
/**
* Media queries for responsive design.
*
* These follow after primary styles so they will successfully override.
*/
@media all and (orientation:portrait) {
/* Style adjustments for portrait mode goes here */
}
@media all and (orientation:landscape) {
/* Style adjustments for landscape mode goes here */
}
/* Grade-A Mobile Browsers (Opera Mobile, Mobile Safari, Android Chrome)
consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {
/* Uncomment if you don't want iOS and WinMobile to mobile-optimize the text for you: j.mp/textsizeadjust */
/* html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } */
}
/**
* Print styles.
*
* Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/
*/
@media print {
* { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important;
-ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */
a, a:visited { color: #444 !important; text-decoration: underline; }
a[href]:after { content: " (" attr(href) ")"; }
abbr[title]:after { content: " (" attr(title) ")"; }
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
tr, img { page-break-inside: avoid; }
@page { margin: 0.5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3{ page-break-after: avoid; }
}
/* This stylesheet is for normalizing buttons styles across most web browsers
The first part was written by David Hund.
*It uses CSS hacks for degrading gracefully in older browsers.*
-> if your target is well known, you should remove the hacks which won't be used
-> (hacks are bad and can introduce incompatibilities and inconstitencies in future versions of browsers)
*/
/* =================================== BUTTONS ===============================
AUTHOR: David Hund - http://valuedstandards.com
License: DoWhatEverYouWantButBeNice
Description: Various CSS button styles. Semi-crossbrowser.
Note: - Uses inline(!) IE hacks for maintainability etc.
- Uses data-uri's for browsers not supporting CSS gradients
0gust1 : Adaptation
If your target audience don't use old browsers, you should consider removing them (CSS Hacks are *bad* !)
*/
button{width:auto; overflow:visible;}
/*especially for FF, which is the most annoying in this case*/
button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
padding: 0;
border: none;
}
button, .button, ul.button-bar li a, input[type='submit'], input[type='button'], input[type='reset'], input[type='file']{
/* (X-browser-) inline-block */
position: relative; /* Google Thinks So: http://vlst.nl/x/3u */
display: -moz-inline-stack; /* Fx: TODO: also test -moz-inline-box?! */
display: inline-block; /* Proper */
font-size:1em;
/* Padding/Margins */
padding: 0.1em 0.6em;
margin: 0 ;
/* Generic Font Styles */
/* outline: none; */ /* Here be dragons! */
font-family:Arial, sans-serif;
text-align: center;
text-decoration: none;
cursor: pointer;
vertical-align: middle; /* from: http://vlst.nl/x/3v */
/* *vertical-align: auto; */ /* from: http://vlst.nl/x/3v */
/* Text-Shadow */
text-shadow: 0 1px 1px rgba(0,0,0,.4); /*Outset*/
text-shadow: 0 1px 0 rgba(255,255,255,.6); /*Inset*/
/*text-shadow: 0 1px rgba(255, 255, 255, .75);*/
/* Border Radius */
-webkit-border-radius: .3em;
-moz-border-radius: .3em;
-o-border-radius: .3em; /* Opera removed support but it might work in older (pre 10.5) versions? */
border-radius: .3em;
/* Box Shadow */
-webkit-box-shadow: 0 0 4px rgba(0,0,0,.2);
-moz-box-shadow: 0 0 4px rgba(0,0,0,.2);
-o-box-shadow: 0 0 4px rgba(0,0,0,.2);
box-shadow: 0 0 4px rgba(0,0,0,.2);
/* We could simulate this in IE with ('glow') filters, but we will not... */
/* DEFAULT Color: Dark Blue */
color: #00618d;
border: solid 1px #999;
background: #EEE; /* Basic fallback */
/* Fx < 3.6 & other browsers supporting data uri's */
background: url("data:image/jpeg,%FF%D8%FF%E0%00%10JFIF%00%01%01%00%00%01%00%01%00%00%FF%DB%00C%00%08%06%06%07%06%05%08%07%07%07%09%09%08%0A%0C%14%0D%0C%0B%0B%0C%19%12%13%0F%14%1D%1A%1F%1E%1D%1A%1C%1C%20%24.'%20%22%2C%23%1C%1C(7)%2C01444%1F'9%3D82%3C.342%FF%DB%00C%01%09%09%09%0C%0B%0C%18%0D%0D%182!%1C!22222222222222222222222222222222222222222222222222%FF%C0%00%11%08%002%00%01%03%01%22%00%02%11%01%03%11%01%FF%C4%00%17%00%01%01%01%01%00%00%00%00%00%00%00%00%00%00%00%00%00%03%02%07%FF%C4%00%15%10%01%01%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%12%FF%C4%00%14%01%01%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%FF%C4%00%14%11%01%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%FF%DA%00%0C%03%01%00%02%11%03%11%00%3F%00%EF%B4%23%40%25B4%02T%23%400%00%3F%FF%D9") repeat-x 0 0;
/* Webkit/Safari */
background: -webkit-gradient(linear, left top, left bottom, from(#f4f4f4), to(#e5e5e5));
/* Fx 3.6+ */
background: -moz-linear-gradient(top, #f4f4f4, #e5e5e5);
/* IE... Beware filters cancel the type anti-alias... */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f4f4', endColorstr='#e5e5e5',GradientType=0 )"; /* ie */
}
/* Ugly hack: but Fx needs this to have INPUT elements the same height as A elements (?) */
button, input.button, ul.button-bar li a, x:-moz-any-link { padding: 0.1em 0.6em; }
/* Hover / Active styles/colors */
button:hover,
button:active,
.button:hover,
.button:active,
.button.active,
ul.button-bar li a:hover,
ul.button-bar li a:active ,
input[type='submit']:hover,
input[type='submit']:active,
input[type='button']:hover,
input[type='button']:active,
input[type='reset']:hover,
input[type='reset']:active,
input[type='file']:hover,
input[type='file']:active {
/* Default: Grey */
border-color: #666;
background: #f4f4f4;
text-shadow: 0 1px 1px rgba(0,0,0,.4); /*Outset*/
text-shadow: 0 1px 0 rgba(255,255,255,.6); /*Inset*/
/*-ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled=false)";*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5e5e5', endColorstr='#f4f4f4',GradientType=0 )"; /* ie */
}
button[disabled],.button[disabled],button[disabled]:hover,.button[disabled]:hover{cursor:not-allowed; background-color: #ccc; -ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled=false)"; /* ie */ color:#aaa; border:1px solid #999999;}
button:active, .button:active, ul.button-bar li a:active, input[type='submit']:active, input[type='button']:active, input[type='reset']:active, input[type='file']:active { top: 1px; /* Popup the button a bit */ }
button[disabled]:active, .button[disabled]:active, ul.button-bar li a[disabled]:active, input[disabled]:active{ top: 0px; /* Popup the button a bit */ }
/* ALT Color: orange */
.button.orange, .button.green, .button.blue { color: #FFF; font-weight: bold; /*text-shadow: 0 1px 1px rgba(0,0,0,.4);*/ }
.button.orange {
border-color: #da7c0c;
background: #f78d1d;
background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
background: -moz-linear-gradient(top, #faa51a, #f47a20);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#faa51a', endColorstr='#f47a20',GradientType=0 )";
text-shadow: 0 1px rgba(28, 28, 28, .35);
}
.button.orange:hover, .button.orange:active, .button.orange.active {
border-color: #da7c0c;
/*-ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled=false)";*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#f47a20', endColorstr='#faa51a',GradientType=0 )";
background: #FFAA00;
text-shadow: 0 1px rgba(0, 0, 0, .35);
}
/* ALT Color: green */
.button.green {
border-color: #6C8F00;
background: #90BF00;
background: -webkit-gradient(linear, left top, left bottom, from(#90BF00), to(#789F00));
background: -moz-linear-gradient(top, #90BF00, #789F00);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#90BF00', endColorstr='#789F00',GradientType=0 )";
text-shadow: 0 1px rgba(28, 28, 28, .35);
}
.button.green:active, .button.green:hover, .button.green.active {
border-color: #6C8F00;
background: #789F00;
background: -webkit-gradient(linear, left top, left bottom, from(#789F00), to(#90BF00));
background: -moz-linear-gradient(top, #789F00, #90BF00);
/*-ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled=false)";*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#789F00', endColorstr='#90BF00',GradientType=0 )";
text-shadow: 0 1px rgba(0, 0, 0, .35);
}
/* ALT Color: blue */
.button.blue {
border-color: #0069BF;
background: #18a7e3; /* old browsers */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#33c3ff), color-stop(100%,#008fcb)); /* webkit */
background: -moz-linear-gradient(top, #33c3ff 0%, #008fcb 100%); /* firefox */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#33c3ff', endColorstr='#008fcb',GradientType=0 )"; /* ie */
text-shadow: 0 1px rgba(28, 28, 28, .35);
}
.button.blue:active, .button.blue:hover, .button.blue.active {
border-color: #0069BF;
background: #18a7e3;
background: -webkit-gradient(linear, left top, left bottom, from(#008fcb), to(#33c3ff));
background: -moz-linear-gradient(top, #008fcb, #33c3ff);
/*-ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled=false)";*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#008fcb', endColorstr='#33c3ff',GradientType=0 )";
text-shadow: 0 1px rgba(0, 0, 0, .35);
}
.button.orange[disabled], .button.blue[disabled], .button.green[disabled]{
background: #ccc; color:#aaa; border:1px solid #999999;
font-weight:normal;
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled=false)";
/* Text-Shadow */
text-shadow: 0 1px 1px rgba(0,0,0,.4); /*Outset*/
text-shadow: 0 1px 0 rgba(255,255,255,.6); /*Inset*/
}
/* ALT FORMS */
.inset {
-webkit-box-shadow: inset 0 0 3px rgba(0,0,0,.5);
-moz-box-shadow: inset 0 0 3px rgba(0,0,0,.5);
box-shadow: inset 0 0 3px rgba(0,0,0,.5);
}
.rounded { -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; }
.square, .bullet { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }
.bullet { -webkit-border-top-right-radius: 1em; -webkit-border-bottom-right-radius: 1em; -moz-border-radius-topright: 1em; -moz-border-radius-bottomright: 1em; border-top-right-radius: 1em; border-bottom-right-radius: 1em; }
.large { font-size: 1.5em; }
.small { font-size: .8em; padding: .4em .8em; -webkit-border-radius: 2px 2px; -moz-border-radius: 2px 2px; border-radius: 2px 2px; }
.combined, ul.button-bar li a {
margin: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
border-width: 1px 0;
}
.combined.first, .combined:first-child, ul.button-bar li:first-child a {
padding-left: 1.5em;
-webkit-border-top-left-radius: 1em;
-webkit-border-bottom-left-radius: 1em;
-moz-border-radius-topleft: 1em;
-moz-border-radius-bottomleft: 1em;
border-top-left-radius: 1em;
border-bottom-left-radius: 1em;
}
.combined.last, .combined:last-child, ul.button-bar li:last-child a {
padding-right: 1.5em;
-webkit-border-top-right-radius: 1em;
-webkit-border-bottom-right-radius: 1em;
-moz-border-radius-topright: 1em;
-moz-border-radius-bottomright: 1em;
border-top-right-radius: 1em;
border-bottom-right-radius: 1em;
}
.combined:hover, .combined:active { border-color: #999; }
.combined.square { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }
/* Combined buttons in a bar, in a list. Better semantics and accessibility */
ul.button-bar { list-style-type: none; margin: 0; padding: 0; }
ul.button-bar li { display: inline; margin: 0; padding: 0; }
ul.button-bar li a { /* Same as .button! */}
/* .round with extra span :-( */
.round {
-webkit-border-radius: 1em;
-moz-border-radius: 1em;
border-radius: 1em;
padding: .5em;
overflow: hidden;
}
.round span { position: absolute; left: -999em; /* Hide tekst */ }
/* .round2 without! extra span :-) */
.round2 {
-webkit-border-radius: 1em;
-moz-border-radius: 1em;
border-radius: 1em;
padding: .5em .6em; /* Webkit */
text-indent: -999em;
overflow: hidden;
}
/* Ugly hack: but Fx needs this */
.round2, x:-moz-any-link { padding: .5em 1em; }
.round2:after { content: "\186A4"; float: left; text-indent: 0; }
/* Ugly hack: but Fx needs this */
.round2:after, x:-moz-any-link { margin-left: -.35em; }
@CHARSET "ISO-8859-1";
/*** shamelessly borrowed from twitter bootstrap ****/
/*1st*/
.row {
margin-left: -20px;
*zoom: 1;
}
.row:before, .row:after {
display: table;
content: "";
}
.row:after {
clear: both;
}
[class*="span"] {
float: left;
margin-left: 20px;
}
.span1 {
width: 60px;
}
.span2 {
width: 140px;
}
.span3 {
width: 220px;
}
.span4 {
width: 300px;
}
.span5 {
width: 380px;
}
.span6 {
width: 460px;
}
.span7 {
width: 540px;
}
.span8 {
width: 620px;
}
.span9 {
width: 700px;
}
.span10 {
width: 780px;
}
.span11 {
width: 860px;
}
.span12, .container {
width: 940px;
}
.offset1 {
margin-left: 100px;
}
.offset2 {
margin-left: 180px;
}
.offset3 {
margin-left: 260px;
}
.offset4 {
margin-left: 340px;
}
.offset5 {
margin-left: 420px;
}
.offset6 {
margin-left: 500px;
}
.offset7 {
margin-left: 580px;
}
.offset8 {
margin-left: 660px;
}
.offset9 {
margin-left: 740px;
}
.offset10 {
margin-left: 820px;
}
.offset11 {
margin-left: 900px;
}
.row-fluid {
width: 100%;
*zoom: 1;
}
.row-fluid:before, .row-fluid:after {
display: table;
content: "";
}
.row-fluid:after {
clear: both;
}
.row-fluid > [class*="span"] {
float: left;
margin-left: 2.127659574%;
}
.row-fluid > [class*="span"]:first-child {
margin-left: 0;
}
.row-fluid .span1 {
width: 6.382978723%;
}
.row-fluid .span2 {
width: 14.89361702%;
}
.row-fluid .span3 {
width: 23.404255317%;
}
.row-fluid .span4 {
width: 31.914893614%;
}
.row-fluid .span5 {
width: 40.425531911%;
}
.row-fluid .span6 {
width: 48.93617020799999%;
}
.row-fluid .span7 {
width: 57.446808505%;
}
.row-fluid .span8 {
width: 65.95744680199999%;
}
.row-fluid .span9 {
width: 74.468085099%;
}
.row-fluid .span10 {
width: 82.97872339599999%;
}
.row-fluid .span11 {
width: 91.489361693%;
}
.row-fluid .span12 {
width: 99.99999998999999%;
}
.container {
width: 940px;
margin-left: auto;
margin-right: auto;
*zoom: 1;
}
.container:before, .container:after {
display: table;
content: "";
}
.container:after {
clear: both;
}
.container-fluid {
padding-left: 20px;
padding-right: 20px;
*zoom: 1;
}
.container-fluid:before, .container-fluid:after {
display: table;
content: "";
}
.container-fluid:after {
clear: both;
}
/*Responsive*/
/*!
* Bootstrap Responsive v2.0.0
*
* Copyright 2012 Twitter, Inc
* Licensed under the Apache License v2.0
* http://www.apache.org/licenses/LICENSE-2.0
*
* Designed and built with all the love in the world @twitter by @mdo and @fat.
*/
.hidden {
display: none;
visibility: hidden;
}
@media (max-width: 480px) {
.nav-collapse {
-webkit-transform: translate3d(0, 0, 0);
}
.page-header h1 small {
display: block;
line-height: 18px;
}
input[class*="span"],
select[class*="span"],
textarea[class*="span"],
.uneditable-input {
display: block;
width: 100%;
height: 28px;
/* Make inputs at least the height of their button counterpart */
/* Makes inputs behave like true block-level elements */
-webkit-box-sizing: border-box;
/* Older Webkit */
-moz-box-sizing: border-box;
/* Older FF */
-ms-box-sizing: border-box;
/* IE8 */
box-sizing: border-box;
/* CSS3 spec*/
}
.input-prepend input[class*="span"], .input-append input[class*="span"] {
width: auto;
}
input[type="checkbox"], input[type="radio"] {
border: 1px solid #ccc;
}
.form-horizontal .control-group > label {
float: none;
width: auto;
padding-top: 0;
text-align: left;
}
.form-horizontal .controls {
margin-left: 0;
}
.form-horizontal .control-list {
padding-top: 0;
}
.form-horizontal .form-actions {
padding-left: 10px;
padding-right: 10px;
}
.modal {
position: absolute;
top: 10px;
left: 10px;
right: 10px;
width: auto;
margin: 0;
}
.modal.fade.in {
top: auto;
}
.modal-header .close {
padding: 10px;
margin: -10px;
}
.carousel-caption {
position: static;
}
}
@media (max-width: 768px) {
.container {
width: auto;
padding: 0 20px;
}
.row-fluid {
width: 100%;
}
.row {
margin-left: 0;
}
.row > [class*="span"], .row-fluid > [class*="span"] {
float: none;
display: block;
width: auto;
margin: 0;
}
}
@media (min-width: 768px) and (max-width: 980px) {
.row {
margin-left: -20px;
*zoom: 1;
}
.row:before, .row:after {
display: table;
content: "";
}
.row:after {
clear: both;
}
[class*="span"] {
float: left;
margin-left: 20px;
}
.span1 {
width: 42px;
}
.span2 {
width: 104px;
}
.span3 {
width: 166px;
}
.span4 {
width: 228px;
}
.span5 {
width: 290px;
}
.span6 {
width: 352px;
}
.span7 {
width: 414px;
}
.span8 {
width: 476px;
}
.span9 {
width: 538px;
}
.span10 {
width: 600px;
}
.span11 {
width: 662px;
}
.span12, .container {
width: 724px;
}
.offset1 {
margin-left: 82px;
}
.offset2 {
margin-left: 144px;
}
.offset3 {
margin-left: 206px;
}
.offset4 {
margin-left: 268px;
}
.offset5 {
margin-left: 330px;
}
.offset6 {
margin-left: 392px;
}
.offset7 {
margin-left: 454px;
}
.offset8 {
margin-left: 516px;
}
.offset9 {
margin-left: 578px;
}
.offset10 {
margin-left: 640px;
}
.offset11 {
margin-left: 702px;
}
.row-fluid {
width: 100%;
*zoom: 1;
}
.row-fluid:before, .row-fluid:after {
display: table;
content: "";
}
.row-fluid:after {
clear: both;
}
.row-fluid > [class*="span"] {
float: left;
margin-left: 2.762430939%;
}
.row-fluid > [class*="span"]:first-child {
margin-left: 0;
}
.row-fluid .span1 {
width: 5.801104972%;
}
.row-fluid .span2 {
width: 14.364640883%;
}
.row-fluid .span3 {
width: 22.928176794%;
}
.row-fluid .span4 {
width: 31.491712705%;
}
.row-fluid .span5 {
width: 40.055248616%;
}
.row-fluid .span6 {
width: 48.618784527%;
}
.row-fluid .span7 {
width: 57.182320438000005%;
}
.row-fluid .span8 {
width: 65.74585634900001%;
}
.row-fluid .span9 {
width: 74.30939226%;
}
.row-fluid .span10 {
width: 82.87292817100001%;
}
.row-fluid .span11 {
width: 91.436464082%;
}
.row-fluid .span12 {
width: 99.999999993%;
}
input.span1, textarea.span1, .uneditable-input.span1 {
width: 32px;
}
input.span2, textarea.span2, .uneditable-input.span2 {
width: 94px;
}
input.span3, textarea.span3, .uneditable-input.span3 {
width: 156px;
}
input.span4, textarea.span4, .uneditable-input.span4 {
width: 218px;
}
input.span5, textarea.span5, .uneditable-input.span5 {
width: 280px;
}
input.span6, textarea.span6, .uneditable-input.span6 {
width: 342px;
}
input.span7, textarea.span7, .uneditable-input.span7 {
width: 404px;
}
input.span8, textarea.span8, .uneditable-input.span8 {
width: 466px;
}
input.span9, textarea.span9, .uneditable-input.span9 {
width: 528px;
}
input.span10, textarea.span10, .uneditable-input.span10 {
width: 590px;
}
input.span11, textarea.span11, .uneditable-input.span11 {
width: 652px;
}
input.span12, textarea.span12, .uneditable-input.span12 {
width: 714px;
}
}
@media (max-width: 980px) {
body {
padding-top: 0;
}
.navbar-fixed-top {
position: static;
margin-bottom: 18px;
}
.navbar-fixed-top .navbar-inner {
padding: 5px;
}
.navbar .container {
width: auto;
padding: 0;
}
.navbar .brand {
padding-left: 10px;
padding-right: 10px;
margin: 0 0 0 -5px;
}
.navbar .nav-collapse {
clear: left;
}
.navbar .nav {
float: none;
margin: 0 0 9px;
}
.navbar .nav > li {
float: none;
}
.navbar .nav > li > a {
margin-bottom: 2px;
}
.navbar .nav > .divider-vertical {
display: none;
}
.navbar .nav > li > a, .navbar .dropdown-menu a {
padding: 6px 15px;
font-weight: bold;
color: #999999;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.navbar .dropdown-menu li + li a {
margin-bottom: 2px;
}
.navbar .nav > li > a:hover, .navbar .dropdown-menu a:hover {
background-color: #222222;
}
.navbar .dropdown-menu {
position: static;
top: auto;
left: auto;
float: none;
display: block;
max-width: none;
margin: 0 15px;
padding: 0;
background-color: transparent;
border: none;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.navbar .dropdown-menu:before, .navbar .dropdown-menu:after {
display: none;
}
.navbar .dropdown-menu .divider {
display: none;
}
.navbar-form, .navbar-search {
float: none;
padding: 9px 15px;
margin: 9px 0;
border-top: 1px solid #222222;
border-bottom: 1px solid #222222;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
}
.navbar .nav.pull-right {
float: none;
margin-left: 0;
}
.navbar-static .navbar-inner {
padding-left: 10px;
padding-right: 10px;
}
.btn-navbar {
display: block;
}
.nav-collapse {
overflow: hidden;
height: 0;
}
}
@media (min-width: 980px) {
.nav-collapse.collapse {
height: auto !important;
}
}
@media (min-width: 1200px) {
.row {
margin-left: -30px;
*zoom: 1;
}
.row:before, .row:after {
display: table;
content: "";
}
.row:after {
clear: both;
}
[class*="span"] {
float: left;
margin-left: 30px;
}
.span1 {
width: 70px;
}
.span2 {
width: 170px;
}
.span3 {
width: 270px;
}
.span4 {
width: 370px;
}
.span5 {
width: 470px;
}
.span6 {
width: 570px;
}
.span7 {
width: 670px;
}
.span8 {
width: 770px;
}
.span9 {
width: 870px;
}
.span10 {
width: 970px;
}
.span11 {
width: 1070px;
}
.span12, .container {
width: 1170px;
}
.offset1 {
margin-left: 130px;
}
.offset2 {
margin-left: 230px;
}
.offset3 {
margin-left: 330px;
}
.offset4 {
margin-left: 430px;
}
.offset5 {
margin-left: 530px;
}
.offset6 {
margin-left: 630px;
}
.offset7 {
margin-left: 730px;
}
.offset8 {
margin-left: 830px;
}
.offset9 {
margin-left: 930px;
}
.offset10 {
margin-left: 1030px;
}
.offset11 {
margin-left: 1130px;
}
.row-fluid {
width: 100%;
*zoom: 1;
}
.row-fluid:before, .row-fluid:after {
display: table;
content: "";
}
.row-fluid:after {
clear: both;
}
.row-fluid > [class*="span"] {
float: left;
margin-left: 2.564102564%;
}
.row-fluid > [class*="span"]:first-child {
margin-left: 0;
}
.row-fluid .span1 {
width: 5.982905983%;
}
.row-fluid .span2 {
width: 14.529914530000001%;
}
.row-fluid .span3 {
width: 23.076923077%;
}
.row-fluid .span4 {
width: 31.623931624%;
}
.row-fluid .span5 {
width: 40.170940171000005%;
}
.row-fluid .span6 {
width: 48.717948718%;
}
.row-fluid .span7 {
width: 57.264957265%;
}
.row-fluid .span8 {
width: 65.81196581200001%;
}
.row-fluid .span9 {
width: 74.358974359%;
}
.row-fluid .span10 {
width: 82.905982906%;
}
.row-fluid .span11 {
width: 91.45299145300001%;
}
.row-fluid .span12 {
width: 100%;
}
input.span1, textarea.span1, .uneditable-input.span1 {
width: 60px;
}
input.span2, textarea.span2, .uneditable-input.span2 {
width: 160px;
}
input.span3, textarea.span3, .uneditable-input.span3 {
width: 260px;
}
input.span4, textarea.span4, .uneditable-input.span4 {
width: 360px;
}
input.span5, textarea.span5, .uneditable-input.span5 {
width: 460px;
}
input.span6, textarea.span6, .uneditable-input.span6 {
width: 560px;
}
input.span7, textarea.span7, .uneditable-input.span7 {
width: 660px;
}
input.span8, textarea.span8, .uneditable-input.span8 {
width: 760px;
}
input.span9, textarea.span9, .uneditable-input.span9 {
width: 860px;
}
input.span10, textarea.span10, .uneditable-input.span10 {
width: 960px;
}
input.span11, textarea.span11, .uneditable-input.span11 {
width: 1060px;
}
input.span12, textarea.span12, .uneditable-input.span12 {
width: 1160px;
}
.thumbnails {
margin-left: -30px;
}
.thumbnails > li {
margin-left: 30px;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment