Login   Register  
PHP Classes
elePHPant
Icontem

File: style.css

Recommend this page to a friend!
Stumble It! Stumble It! Bookmark in del.icio.us Bookmark in del.icio.us
  Classes of Alex  >  Lights GD  >  style.css  >  Download  
File: style.css
Role: Auxiliary data
Content type: text/plain
Description: css for expampe page
Class: Lights GD
Render blueprint image of house windows with panes
Author: By
Last change:
Date: 11 months ago
Size: 6,170 bytes
 

Contents

Class file image Download
h1, h2, h3, article, label, input, select, section {
    display: block;
}

html {
    font-size: 100%;
    overflow-y: scroll;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%}
body {
    margin: 0;
    font-family: Open Sans, "Lucida Console", "Lucida Unicode", Tahoma, "Trebuchet MS", sans-serif,
    font-size: 0.8em;
    line-height: 1.4;
    background:gray url('./bg.png');
    overflow: hidden;
}

#wrapper {
    width:88%;
    height:auto;
    min-width:600px;
    margin:0 auto;
    overflow:hidden;
}

#mainheader {
    width:60%;
    height:120px;
    padding:20px 2px;
    margin:0 auto;
}
#mainheader h1 {
    margin:0 auto;
    font-size:1.2em;
    font-style:oblique;
    color:#383832;
    width:60%;
    min-width:520px;
    height:32px;
    text-align:center;
    border-bottom:1px solid #644;
}
#mainheader article {
    width:80%;
    height:auto;
    min-width:690px;
    margin:20px 0 10px 20%;
    font-size:0.75em;
    font-style:italic;
    color:#5E5E54;
    text-align:right;
}

section.settings {
    float:left;
    width:50%;
    height:auto;
    min-width:560px;
    margin:0 0 0 4%;
    padding:20px 2px; 
}
section.settings h2 {
    padding:0 40px 0 20px;
    font-size:1.1em;
    font-weight:600;
    border-bottom:1px dotted #988;
    float:left;
}

section.preview {
    float:right;
    width:40%;
    height:200px;
    background:url('./preview_placeholder.jpg') center center no-repeat;
    min-width:460px;
    margin-top:240px;
}
section.preview img {
    display:block;
    margin:0 auto;
}
section.preview p {
    margin:20px 0 0 0;
    text-align:center;
    font-size:0.75em;
    line-height:2em;
}
section.preview p a {
    color:#644C4C;
    border-bottom:1px dotted #634C4C;
    text-shadow:1px 1px 1px #cff;
}
section.preview p a:hover {
    border:none;
}

select.q_panes, select.s_empty, select.s_emptyBorder, select.s_bColor, select.s_border2line, select.s_door, select.s_doorknob, select.s_separator, select.s_star, select.s_devide, select.s_distanceDevider, select.s_cell11, select.s_typeDevider {
    margin:14px 0 0 0;
    width:auto;
    height:28px;
    border:1px solid #988;
    background:#b4b4b2;
    font-size:0.9em;
    text-align:center;
    border-radius:2px;
    box-shadow:2px 2px 2px #aaa;
    font-family:Tahoma,monospace,sans-serif;
    color:#fffeeb;
}

select.q_panes > option {
    background:#fffeeb;
    color:#a89896;
}

.clean {float:none;clear:both;}
div#tab_temp, div#tabs_nav, #tabs_container, div.notEmptyBlock, div.separatorWidth, div.doorknobType, div.cell11 {
    display:none;
}

/* TABS */
section#tabs_container {
    width:100%;
    height:auto;
    margin:40px 0 0 10px;
}
#flip-tabs{
    position:relative;
}
#flip-navigation{
    margin:0 0 10px; padding:0; 
    list-style:none;
}
#flip-navigation li{ 
    display:inline;
    margin-right:4px; 
}
#flip-navigation li a{
    text-decoration:none; padding:10px; 
    margin-right:0px;
    background:#f9f9f9;
    color:#333; outline:none;
    font-family:Arial; font-size:12px; text-transform:uppercase;
}
#flip-navigation li a:hover{
    background:#999; 
    color:#f0f0f0;
}
#flip-navigation li.selected a{
    background:#b4b4b2;
    color:#fffeeb;
}
#flip-container{  
    width:80%;
    height:auto;
}
#flip-container > div{  
    width:96%;
    height:auto;
    min-width:380px;
}
#flip-container div h3{ 
    width:80%;
    height:30px;
    margin:20px 0 10px 0;
    text-align:center;
    font-size:0.9em;
    font-weight:600px;
    text-shadow: 1px 1px 2px #dadada;
    color:#6E6362;
}

label.l_sizes, label.l_empty, label.l_emptyBorder, label.l_border, label.l_border2line, label.l_bColor, label.l_doorknob, label.l_door, label.l_separator, label.l_star, label.l_typeStar, label.l_dash, label.l_devide, label.l_typeDevider, label.l_distanceDevider, label.l_cell11, label.l_thicknessDeviders, label.l_setDistanceCols, label.l_setDistanceRows {
    float:left;
    width:60%;
    height:16px;
    margin:4px 0 4px 0;
    padding:4px;
    border-bottom:1px dotted #988;
    font-size:0.88em;
}
label.l_star {
    float:none;
    width:88%;
    text-align:left;
    margin-top:16px;
    color:#693640;
}
input.i_sizes, input.i_border, input.i_setDistanceCols, input.i_dash, input.i_thicknessDeviders, input.i_setDistanceRows, input.i_separator {
    float:none;
    width:80px;
    height:24px;
    margin:4px 0 4px 0;
    border:1px solid #988;
    background:#fffffc;
    color:#988;
    font-size:0.9em;
    font-weight:800;
}
input.i_dash {
    float:left;
    width:auto;
    height:auto;
}
input.i_setDistanceCols, input.i_setDistanceRows {
    width:140px;
    margin-top:8px;
}
input.c_star {
    display:inline;
    margin-right:40px;
}
input.preview_button {
    width:68%;
    height:30px;
    text-align:center;
    margin:40px 0 10px 0;
    color:#988;
    text-shadow: 1px 1px 2px #dadada;
    font-weight:800;
    border:1px solid #988;
    background: #eaeaea;
    background: -moz-linear-gradient(top, #FFFFFF 0%, #D4D4D4 100%);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFCD1), to(#FFFFFF));
    background: -webkit-linear-gradient(top, #FFFFFF 0%, #D4D4D4 100%);
    background: -o-linear-gradient(top, #FFFFFF 0%, #D4D4D4 100%);
    background: -ms-linear-gradient(top, #FFFFFF 0%, #D4D4D4 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#D4D4D4', GradientType=0);
    background: linear-gradient(top, #FFFFFF 0%, #D4D4D4 100%);
}
select.s_empty, select.s_emptyBorder, select.s_door, select.s_bColor, select.s_border2line, select.s_doorknob, select.s_separator, select.s_star, select.s_devide, select.s_distanceDevider, select.s_cell11, select.s_typeDevider {
    margin-top:4px;
    width:140px;
}
select.s_star, select.s_devide, select.s_distanceDevider, select.s_typeDevider {
    margin:0 0 4px 0;
}
select.s_cell11 {
    background:#988;
}
span.sp_star {
    font-size:0.88em;
}
label.clear {
    float:none;
    clear:both;
}
label.minp {
    margin-top:6px;
}

@media (max-width: 1240px) {
section.settings {
    float:none;
    clear:both;
}
section.preview {
    float:none;
    margin:0;
}    
}