/* -------------------------------------------------------------- */
/* Sublime by Design */
/* -------------------------------------------------------------- */

@import url('reset.css');
@import url('960.css');
@import url('drop-down-menu.css');
@import url('typography.css');
@import url('forms.css');

/* Tables 
--------------------------------------------------------------   */
table{width:100%; border:0}
thead th{background:#c3d9ff}
th,td,caption{vertical-align:top; padding:9px}
tr.even td{background:#e5ecf9}
caption{background:#eee}

/* Table columns 
--------------------------------------------------------------   */
.inflow,table.inflow,img.inflow{margin:18px 0}
td.1column,.1column {width:100%}
td.2columns,.2columns {width:50%}
td.3columns,.3columns {width:33%}
td.4columns,.4columns {width:25%}

/* Floats and sidebars
--------------------------------------------------------------   */
.callout{margin-bottom:18px;padding:9px; width:auto}
.callout :last-child{margin-bottom:0}
.left{float:left;margin:0 18px 18px 0}
.right{float:right;margin:0 0 18px 18px}

/* Common classes
--------------------------------------------------------------   */
.align-center{text-align:center}
.align-justify{text-align:justify}
.align-left{text-align:left}
.align-right{text-align:right}
.block{display:block !important}
.bottom{margin-bottom:0;padding-bottom:0}
.cleared {clear:both}
.clear-left{clear:left}
.clear-right{clear:right}
.first{margin-left:0;padding-left:0}
.float-left{float:left}
.float-right{float:right}
.hide{display:none}
.inline{display:inline !important}
.last{margin-right:0;padding-right:0}
.top{margin-top:0;padding-top:0}

/* Images
-------------------------------------------------------------- */
img{border:none; padding:0; margin:0}

/* -------------------------------------------------------------- */
/* TEMPLATE SPECIFIC */
/* -------------------------------------------------------------- */
/* General structure and background
--------------------------------------------------------------    */
body{width:960px;background-color:#FFF; margin:0 auto}
#contentall{background-color:#FFF; margin-top:30px}
#footerwrapper{background-color:#FFF; border-top:1px solid #DDD; margin:40px 0 5px 0; padding:10px 0 0 0}

/* Boxes and borders
-------------------------------------------------------------- */
.border,table.border,td.border,img.border {border:solid 1px #999}
.enclose{background-color:#EBEDF7;background-image:url("../images/gradient_half.jpg");background-repeat:repeat-x}
.box {margin:9px 0;padding:10px}

/* Navigation - menu
--------------------------------------------------------------    */

/* Footer
-------------------------------------------------------------- */
.footertext{vertical-align:bottom;font-size:8pt;color:#4E4E71}
img.butterfly{margin-right:10px}

/* Homepage - memberships 
-------------------------------------------------------------- */  
.memberships{vertical-align:middle;width:580px}
img.imagestyle3{margin-left:5px;vertical-align:middle;border:0}

/* Portfolio 
-------------------------------------------------------------- */ 
.portfoliowrapped {background-color:#ECECEC}
.worksWrapper {position:relative;width:460px;height:276px;overflow:hidden; margin:5px}
.workscaption{position:absolute; background:#46424A; height:276px; width:100%; top:276px; left:0; padding:20px 30px 20px 20px}
.details {margin:0 30px 0 80px}

/* The design process page 
-------------------------------------------------------------- */
td.backgrounddk1 {background-color:#8fbd59}
td.backgrounddk2 {background-color:#93c9bf}
td.backgrounddk3 {background-color:#b698cd}
td.backgrounddk4 {background-color:#8d72a5}

td.background1 {background-color:#bfd9a0}
td.background2 {background-color:#c1e0db}
td.background3 {background-color:#d5c5e3}
td.background4 {background-color:#bfb0cc}

td.backgroundlt1 {background-color:#edf4e4}
td.backgroundlt2 {background-color:#eef6f5}
td.backgroundlt3 {background-color:#f4f0f8}
td.backgroundlt4 {background-color:#e8e3ed}

td.categories {padding:20px}

/* Images
-------------------------------------------------------------- */
img.design{margin:20px 0 0}
img.imagestyle{margin:0 0 40px 0}
img.imagestyle2{vertical-align:baseline}
.inset{border:1px dashed #999;margin:10px 0}
img.inline{clear:both;border:1px solid #999;margin:20px 0 5px}

/* Misc
-------------------------------------------------------------- */
.message {text-align:center}

/* ------------------------------------------------------------- 
   404 - error
--------------------------------------------------------------  */
.404 {background-color:#573E8F}