qcubed/framework

/*@import url('http://fonts.googleapis.com/css?family=Brawler|Titillium+Web:400,700');*/
@font-face {
  font-family: 'Brawler';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/Brawler.eot);
  src: local('Brawler'), url(../fonts/Brawler.eot) format('embedded-opentype'), url(../fonts/Brawler.woff) format('woff');
}
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/Titillium+Web.eot');
  src: local('Titillium Web'), local('TitilliumWeb-Regular'), url('../fonts/Titillium+Web.eot') format('embedded-opentype'), url('../fonts/Titillium+Web.woff') format('woff');
}
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/Titillium+WebBold.eot');
  src: local('Titillium WebBold'), local('TitilliumWeb-Bold'), url('../fonts/Titillium+WebBold.eot') format('embedded-opentype'), url('../fonts/Titillium+WebBold.woff') format('woff');
}
/* Basic elements */
body { color: #333; font-family: 'Titillium Web', sans-serif; font-size: 1em; line-height: 1.22; margin:0; padding: 0; }
a, a:visited, a:link { color: #780000; }
a:hover, a:active { color: #d90d0d; }
button { cursor: pointer; }

h1 { font-family: 'Brawler', serif; font-weight: 400; }
h2, h3, h4, h5, h6 { font-weight: 700; }

form { margin:0; padding: 0; position: relative; }

.disabled {color: #dedede}

section { padding: 10px; }
footer { background: #333; color: #fff; padding: 10px; }

pre code { background: #f6f6f6; border: 1px solid #dedede; border-radius: 3px; display: block; padding: 10px; margin:10px auto; white-space: pre-wrap; }

#logo { float: left; height: 30px; }
#tagline a { color: #fff; font-weight: 700; line-height: 30px; margin-left: 10px; text-decoration: none; }

/* QControls */
.datagrid { margin: auto; width: 100%; }
.datagrid th { background: #333; color: #fff; padding: 5px; }
.datagrid th a { color:#f6f6f6; text-decoration: none; text-transform: uppercase; white-space: nowrap}
.datagrid th a:hover { text-decoration: underline; }
.datagrid td { border-bottom:1px solid #dedede; padding: 5px; }
.datagrid th.sortable :hover {
    opacity: 0.95;
}
.datagrid th.sortable div span {
    display: table-cell;
    vertical-align: bottom;
    padding-right:4px;
}
.datagrid th.sortable div i.fa {
    display: table-cell;
    vertical-align: bottom;
    padding-bottom:2px;
}

.datagrid caption { overflow: hidden; padding: 5px; position: relative; }
.datagrid .paginator-control { float: right; }
.datagrid .paginator-results { float: left; }
.paginator .arrow { color: #dedede; font-style: italic; }
.paginator .arrow a { font-style: normal; }
.paginator .break { color: #dedede; padding: 5px; }
.paginator .page { color: #dedede; display: inline-block; padding: 0 5px; }
.paginator .selected { background: #780000; border:1px solid #d90d0d; border-radius: 3px; display: inline-block; color: #fff; padding: 0 5px; }

/* Form fields */
.renderWithName { padding: 5px 0; position: relative; }
.renderWithName .form-name {overflow: hidden; }

.form-field input[type=text],
.form-field input[type=password],
.form-field textarea { max-width: 300px; width: 99%; }
.form-actions { border-radius: 3px; background: #333; padding: 10px; margin: 10px auto; }
.form-save,
.form-cancel,
.form-delete{ display: inline; }
.form-delete button { color: #780000; font-weight: 700; }

/* To change form label/field layout, swap the comment here */
.form-name { padding-right: 10px; }
.form-field {  }
.form-save {  }
.form-delete { padding-left: 20px; }
/*
.form-name { float: left; padding-right: 10px; text-align: right; width: 33%; }
.form-field { float: left; width: 50%; }
.form-save { padding-left: 33%; }
.form-delete { padding-left: 6%; }
*/

/* Status coloring */
.warning, .error { color: #d90d0d; }
.success { color: green; }

.link-list li { margin-top: 7px; }

/* SQL Profiling */
.qDbProfile {
    /*position: absolute;*/
    background-color: white;
    padding: 5px;
    top: 0;
    right: 0;
    z-index: 5000;
    border: 1px solid black;
}

.qDbProfile a {
    position: relative;
}


/* Modification to jquery ui dialog styling that allows for left/right buttons and other fixes */
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
    float: none !important;
    text-align: right;
}
.ui-button-left {
    float: left;
}

/* The following is to allow for correct positioning of an alert icon */
.ui-dialog-title {
    float: none !important;
    width: auto !important;
}
.ui-dialog-titlebar .ui-icon {
    display: inline-block;
    margin-right: .3em;
    vertical-align: middle;
}

/* Format objects as tables, without using table tags to be more correct in our html */
.qc-table {
    display: table;
}
.qc-tableRow {
    display: table-row;
}
.qc-tableCell {
    display: table-cell;
}

.clickable-rows tr td,th {
    -webkit-user-select: none; /* webkit (safari, chrome) browsers */
    -moz-user-select: none; /* mozilla browsers */
    -khtml-user-select: none; /* webkit (konqueror) browsers */
    -ms-user-select: none; /* IE10+ */
    cursor: default;
}

.clickable-rows tr:hover {
    background-color:#f0f0f0;
}

/** Error notice styling */
#Qcubed_AJAX_Error {
    position:fixed;
    background-color: white;
    border: 2px solid black;
    left: 20px;
    right: 20px;
    top: 20px;
    z-index: 10000;
    padding: 20px;
}

.installsteps .instructions {
    background: #f6f6f6; border: 1px solid #dedede; border-radius: 3px; margin:10px auto; padding: 1%;
}
.installsteps .full label {
    width: 250px;
    display: inline-block;
}
.installsteps .full input, .full select {
    width: 400px;
}