body {
background-color : # f6f6f6 ;
}
body p {
font-size : 0 . 9em ;
}
body p . sub {
color : # 999 ;
}
body h1 , body h2 , body h3 , body h4 , body h5 , body h6 {
text-transform : uppercase ;
font-weight : 300 ;
}
# logo {
color : # 333 ;
}
a # logo : hover {
text-decoration : none ;
}
. page {
width : 1210px ;
min-width : 1210px ;
margin : auto ;
background-color : # FFF ;
border-radius : 6px ;
margin-top : -70px ;
padding : 20px 0px ;
box-shadow : 0 0 6px rgba ( 0 , 0 , 0 , 0 . 1 ) ;
}
. page . header {
padding-bottom : 10px ;
margin-bottom : 20px ;
border-bottom : 1px solid # EEE ;
}
# in-nav {
background-color : white ;
background-repeat : repeat ;
height : 50px ;
padding-top : 10px ;
}
# in-nav ul {
position : relative ;
top : 10px ;
}
# in-nav ul li {
list-style-type : none ;
display : inline ;
}
# in-nav ul li a {
padding : 10px ;
}
# in-sub-nav {
background-color : # 333333 ;
-moz-box-shadow : inset 0px 0px 10px # 111111 ;
-webkit-box-shadow : inset 0px 0px 10px # 111111 ;
box-shadow : inset 0px 0px 10px # 111111 ;
}
# in-sub-nav ul {
text-align : center ;
margin-bottom : 80px ;
}
# in-sub-nav li {
list-style-type : none ;
display : inline-block ;
}
# in-sub-nav li a {
display : block ;
border-radius : 6px ;
padding : 15px 10px 5px ;
min-height : 56px ;
min-width : 64px ;
margin : 20px 10px 10px ;
color : # FFF ;
font-weight : 100 ;
}
# in-sub-nav li a : hover , # in-sub-nav li a . active {
background-color : # 555 ;
text-decoration : none ;
}
# in-sub-nav li span . label . pull-right {
position : relative ;
top : 24px ;
right : 14px ;
}
footer {
padding-top : 20px ;
padding-bottom : 20px ;
color : # 999 ;
}
footer a {
color : # 999 ;
}
. divide {
border-top : 1px solid # EEE ;
margin-top : 40px ;
padding-top : 40px ;
}
. small-divide {
border-top : 1px solid # EEE ;
margin-top : 20px ;
padding-top : 20px ;
}
. batch {
background-image : url ( images / white-batch-32 . png ) ;
display : inline-block ;
height : 32px ;
width : 32px ;
}
. home {
background-position : -128px -96px ;
}
. star {
background-position : -192px -96px ;
}
. forms {
background-position : -96px -32px ;
}
. stream {
background-position : 0 -64px ;
}
. tables {
background-position : -32px -32px ;
}
. settings {
background-position : -288px -128px ;
}
. quill {
background-position : -288px 0px ;
}
. users {
background-position : 0 -96px ;
}
. plane {
background-position : -256px -96px ;
}
. calendar {
background-position : -160px -128px ;
}
. batch-big {
background-image : url ( images / white-batch-64 . png ) ;
display : inline-block ;
height : 64px ;
width : 64px ;
}
. b-wifi {
background-position : -256px -64px ;
}
. b-code {
background-position : -64px 0px ;
}
. b-comment {
background-position : -192px -256px ;
}
. b-flag {
background-position : -384px -256px ;
}
. b-database {
background-position : -256px 0px ;
}
. b-alarm {
background-position : -384px 0px ;
}
/* ============== messages ============== */
. message-sidebar {
border-right : 1px solid # EEE ;
margin : -20px ;
margin-right : 0 ;
overflow : auto ;
height : 700px ;
}
. message-sidebar a . message-preview {
display : block ;
background-color : # F6F6F6 ;
border-bottom : 1px solid # EEE ;
padding : 10px 20px ;
}
. message-sidebar a . message-preview h4 {
font-weight : 400 ;
text-transform : none ;
}
. message-sidebar a . message-preview p , . message-sidebar a . message-preview h5 {
color : # 999 ;
}
. message-sidebar a . new {
background-color : # FFF ;
}
. message-sidebar a . active {
background-color : # 008DCD ;
color : # FFF ;
}
. message-sidebar a . active p , . message-sidebar a . active h5 {
color : rgba ( 255 , 255 , 255 , 0 . 8 ) ;
}
. message-sidebar a : hover {
text-decoration : none ;
cursor : pointer ;
}
. message-sidebar . load-more {
text-align : center ;
}
. message-sidebar . load-more a {
padding : 20px ;
display : block ;
}
. messages h4 {
text-transform : none ;
font-weight : 400 ;
}
. messages . message {
padding-bottom : 20px ;
border-bottom : 1px solid # EEE ;
margin-bottom : 20px ;
}
. messages . message h5 {
font-weight : 300 ;
}
. messages . message-body {
padding-left : 80px ;
}
. messages . message-body textarea {
height : 80px ;
margin-right : 20px ;
width : 96 % ;
}
/* ============== login ============== */
. login {
padding : 20px ;
margin-top : 40px ;
margin-bottom : 80px ;
}
/* ============== sidebar ============== */
. sidebar {
border-top : 1px solid # EEE ;
}
. sidebar ul {
padding : 0 ;
margin : 0 ;
}
. sidebar ul li {
list-style-type : none ;
}
. sidebar ul li a {
display : block ;
padding : 10px ;
border-bottom : 1px solid # EEE ;
text-transform : uppercase ;
}
. sidebar ul li a : hover {
background-color : # EEE ;
/* color: #FFF;*/
text-decoration : none ;
}
. sidebar ul li ul {
background-color : # F6F6F6 ;
box-shadow : inset 0 1px 10px # E0E0E0 ;
}
/* ============== stat lists ============== */
ul . stat-list {
margin : 0 ;
}
ul . stat-list li {
list-style-type : none ;
}
ul . stat-list li label , ul . stat-list li h4 , ul . stat-list li small , ul . stat-list li p {
display : inline-block ;
}
ul . stat-list li label {
height : 32px ;
width : 32px ;
border-radius : 2px ;
text-align : center ;
vertical-align : middle ;
margin-right : 10px ;
}
ul . stat-list li label i {
margin-top : 8px ;
}
ul . stat-list li h4 {
font-weight : 600 ;
margin-right : 10px ;
min-width : 30px ;
}
ul . stat-list li h4 . sub {
color : # 999 ;
font-weight : 300 ;
}
. progress-small {
height : 8px ;
}
/* ============== widgets ============== */
. widget {
background-color : # eeeeee ;
color : # 555555 ;
padding : 20px ;
border-radius : 6px ;
margin-bottom : 20px ;
}
. widget td . bar-label {
width : 20 % ;
text-align : right ;
padding-right : 20px ;
color : # 999 ;
font-weight : 300 ;
}
. widget td . bar-number , . widget td . bar-percent {
width : 15 % ;
font-weight : 600 ;
}
. widget td . bar-percent span {
font-weight : 300 ;
}
. widget td . progress {
margin-top : 10px ;
margin-bottom : 10px ;
border-radius : 4px ;
display : block ;
width : 100 % ;
height : 8px ;
overflow : hidden ;
}
/* ============== sparks ============== */
. spark {
margin-bottom : 20px ;
}
. spark h4 {
font-weight : 500 ;
}
. spark h4 . sub {
color : # 999 ;
font-weight : 300 ;
}
. spark h4 . sub span . minus {
color : # ea494a ;
float : right ;
}
. spark h4 . sub span . plus {
color : # 4cb158 ;
float : right ;
}
. spark . sparklines {
float : right ;
}
/* ============== knobs ============== */
. knob {
text-align : center ;
}
/* ============== table-panel ============== */
. table-panel i {
margin : 4px ;
}
. table-panel table {
border-top : 1px solid # EEE ;
}
/* ============== peity ============== */
. peity {
margin-bottom : 20px ;
}
. peity canvas {
margin-right : 10px ;
}
. peity h4 {
display : inline-block ;
font-weight : 600 ;
min-width : 30px ;
margin : 0 ;
}
. peity h4 . sub {
font-weight : 300 ;
color : # 999 ;
}
/* ============== panels ============== */
. panel {
width : 150px ;
background-color : # EEE ;
border-radius : 6px ;
text-align : center ;
display : inline-block ;
margin-bottom : 20px ;
margin-right : 20px ;
}
. panel . top {
border-top-left-radius : 6px ;
border-top-right-radius : 6px ;
background-color : # 555555 ;
padding-top : 20px ;
}
. panel . top i {
display : block ;
margin : 0px auto 20px ;
}
. panel . top h6 {
display : inline ;
background-color : # 555555 ;
position : relative ;
top : 5px ;
padding : 6px 12px ;
border-radius : 30px ;
color : # FFF ;
font-weight : 600 ;
font-size : 0 . 7em ;
}
. panel . bottom {
padding-top : 20px ;
border-bottom-left-radius : 6px ;
border-bottom-right-radius : 6px ;
text-align : center ;
border-top : none ;
}
. panel . bottom h2 {
font-weight : 600 ;
margin : 0 ;
}
. panel . bottom h6 {
font-size : 0 . 7em ;
font-weight : 600 ;
position : relative ;
bottom : 10px ;
color : # 555555 ;
}
. panel . warning , . panel . warning h6 {
background-color : # ffa93c ;
/ * box-shadow : inset 0 0 10px lighten ( $ warning , 8 % ) ;
border : 1px solid darken ( $ warning , 20 % ) * /
}
. panel . success , . panel . success h6 {
background-color : # 4cb158 ;
/ * box-shadow : inset 0 0 10px lighten ( $ success , 8 % ) ;
border : 1px solid darken ( $ success , 20 % ) * /
}
. panel . danger , . panel . danger h6 {
background-color : # ea494a ;
/ * box-shadow : inset 0 0 10px lighten ( $ danger , 8 % ) ;
border : 1px solid darken ( $ danger , 20 % ) * /
}
. panel . info , . panel . info h6 {
background-color : # 14b8d4 ;
/ * box-shadow : inset 0 0 10px lighten ( $ info , 8 % ) ;
border : 1px solid darken ( $ info , 20 % ) * /
}
. panel . primary , . panel . primary h6 {
background-color : # 007ccd ;
/ * box-shadow : inset 0 0 10px lighten ( $ primary , 8 % ) ;
border : 1px solid darken ( $ primary , 20 % ) * /
}
. panel . purple , . panel . purple h6 {
background-color : # 7932ea ;
/ * box-shadow : inset 0 0 10px lighten ( $ purple , 8 % ) ;
border : 1px solid darken ( $ purple , 20 % ) * /
}
/* ============== profile ============== */
. stats {
text-align : center ;
}
. stats . stat {
background-color : # eeeeee ;
color : # 555555 ;
padding : 10px ;
border-radius : 6px ;
margin-bottom : 20px ;
text-align : center ;
}
. stats . stat h2 {
font-weight : 600 ;
}
. stats . stat h6 {
margin-top : -10px ;
}
. stats . warning {
background-color : # ffa93c ;
color : # FFF ;
}
. stats . success {
background-color : # 4cb158 ;
color : # FFF ;
}
. stats . danger {
background-color : # ea494a ;
color : # FFF ;
}
. stats . info {
background-color : # 14b8d4 ;
color : # FFF ;
}
. stats . primary {
background-color : # 007ccd ;
color : # FFF ;
}
. stats . purple {
background-color : # 7932ea ;
color : # FFF ;
}
. stats . inverse {
background-color : # 333 ;
color : # FFF ;
}
. rating-star , . no-star , . half-star {
display : inline-block ;
height : 16px ;
width : 16px ;
background-image : url ( . . / img / stars . png ) ;
}
. no-star {
background-position : 0 -16px ;
}
. half-star {
background-position : 0 -32px ;
}
. profile-sidebar ul {
margin : 0 ;
margin-top : 20px ;
}
. profile-sidebar ul li {
list-style-type : none ;
border-top : 1px solid # EEE ;
padding : 10px 0px ;
}
. profile-sidebar ul li i {
margin-right : 5px ;
}
/* ============== tables ============== */
. tables code {
display : inline-block ;
margin : 2px ;
}
/* ============== stream ============== */
. filters input [ type = "checkbox" ] {
float : left ;
margin-right : 10px ;
}
. filters h5 {
margin-top : 20px ;
padding-bottom : 5px ;
border-bottom : 1px solid # EEE ;
}
. filters span {
color : # 999 ;
}
. stream . item {
border-bottom : 1px solid # EEE ;
padding : 10px 0px 30px 60px ;
}
. stream . item . stream-icon {
display : inline-block ;
background-color : # CCC ;
border-radius : 4px ;
height : 40px ;
width : 40px ;
text-align : center ;
margin-left : -40px ;
margin-bottom : -40px ;
position : relative ;
top : 15px ;
right : 20px ;
float : left ;
}
. stream . item . stream-icon i {
margin-top : 12px ;
}
. stream . item . stream-success {
background-color : # 4cb158 ;
}
. stream . item . stream-danger {
background-color : # ea494a ;
}
. stream . item . stream-warning {
background-color : # ffa93c ;
}
. stream . item . stream-info {
background-color : # 14b8d4 ;
}
. stream . item . avatar {
border-radius : 4px ;
margin-left : -40px ;
margin-bottom : -40px ;
height : 40px ;
position : relative ;
top : 15px ;
right : 20px ;
float : left ;
}
. stream . item h4 {
margin-bottom : 6px ;
}
. stream . item p {
color : # 777 ;
}
. stream . item p . date {
padding : 0 ;
float : right ;
margin-top : 10px ;
}
/* ============== faq ============== */
. qa {
border-bottom : 1px solid # EEE ;
padding-bottom : 20px ;
margin-bottom : 20px ;
margin-top : 20px ;
}
. qa h4 {
text-transform : none ;
font-weight : 400 ;
}
/* ============== calendar ============== */
. event {
display : inline-block ;
width : 100 % ;
margin-bottom : 10px ;
border-top : 1px solid # EEE ;
padding-top : 10px ;
}
. event p {
color : # 999 ;
}
. event h4 {
text-transform : none ! important ;
font-weight : 500 ;
color : # 008dcd ;
margin : 5px 0px ;
}
. event . date {
text-align : center ;
display : inline-block ;
border-left : 4px solid # EEE ;
padding-left : 16px ;
float : left ;
margin-right : 20px ;
}
. event . date h1 {
font-weight : 500 ;
line-height : 0 . 8em ;
}
. event . date h4 {
line-height : 1em ;
color : # 555555 ;
font-weight : 300 ;
}
. event . success {
border-color : # 4cb158 ;
}
. event . danger {
border-color : # ea494a ;
}
. event . info {
border-color : # 14b8d4 ;
}
. event . primary {
border-color : # 007ccd ;
}
. event . warning {
border-color : # ffa93c ;
}
. event . purple {
border-color : # 7932ea ;
}
. event . inverse {
border-color : # 333 ;
}
# events . load-more {
text-align : center ;
overflow : auto ;
height : 600px ;
}
# calendar h2 {
font-size : 17 . 5px ;
}
# calendar th {
background-color : # EEE ;
}
# calendar th , # calendar td {
border-color : # EEE ;
}
# calendar . fc-event-skin {
background-color : # 007ccd ;
border : 1px solid # 007ccd ;
border-radius : 4px ;
text-align : center ;
}
/* ============== tags ============== */
. tag {
display : inline-block ;
background-color : # EEE ;
padding : 3px 8px ;
margin-right : 5px ;
margin-bottom : 5px ;
border-radius : 4px ;
}
. tag : hover {
background-color : # 008dcd ;
color : # FFF ;
text-decoration : none ;
}
/* ============== settings ============== */
. settings-group {
margin-top : 40px ;
}