@import url("Slimbox/slimbox2.css");

html,
body                                                            { margin: 0; padding: 0;
                                                                  color: #333;
                                                                  font: 12pt Calibri, Arial, Sans-serif; }
body                                                            { background: #fff url('Background.jpg') repeat-x top center; }

#container                                                      { width: 942px;
                                                                  margin: 0 auto; }
                                                                  
#frame-top                                                      { width: 942px; height: 71px;
                                                                  background: transparent url('Frame-Top.jpg') no-repeat 0 0; }
                                                                  
#frame-middle                                                   { height: 593px; }

#frame-left                                                     { width: 32px; height: 593px;
                                                                  float: left;
                                                                  background: transparent url('Frame-Left.jpg') no-repeat 0 0; }
                                                                  
#frame-inner                                                    { width: 878px; height: 593px;
                                                                  float: left;
                                                                  background: transparent url('Frame-Background.jpg') no-repeat 0 0; }
                                                                  
#frame-right                                                    { width: 32px; height: 593px;
                                                                  float: left;
                                                                  background: transparent url('Frame-Right.jpg') no-repeat 0 0; }
                                                                  
#frame-bottom                                                   { width: 942px; height: 42px;
                                                                  clear: left;
                                                                  background: transparent url('Frame-Bottom.jpg') no-repeat 0 0; }
                                                                  
#canvas                                                         { width: 826px; height: 593px;
                                                                  float: left; }
                                                                  
#canvas-upper                                                   { }

#canvas-top                                                     { height: 11px;
                                                                  overflow: hidden;
                                                                  background: transparent url('Canvas-Top.jpg') no-repeat 0 0; }

#canvas-image                                                   { height: 306px;
                                                                  padding: 0 0 0 14px;
                                                                  background: #fff url('Canvas-Left-Top.jpg') no-repeat 0 0; }
                                                                  
#canvas-left                                                    { width: 252px; height: 276px;
                                                                  float: left; }
                                                                  
#canvas-container                                               { width: 562px; height: 276px;
                                                                  overflow: hidden; }
                                                                  
#content-left                                                   { height: 123px;
                                                                  padding: 0 0 0 14px;
                                                                  overflow: hidden;
                                                                  background: #fff url('Canvas-Left-Bottom.jpg') no-repeat 0 0; }
                                                                  
#asset-pageturn-upper                                           { height: 93px;
                                                                  background: transparent url('Canvas-PageTurn-Upper.jpg') no-repeat 0 0; }
                                                                  
#asset-pageturn                                                 { }

#mdcad-logo,
#mdcad-logo a                                                   { display: block;
                                                                  width: 160px; height: 60px;
                                                                  float: left; }
#mdcad-logo a                                                   { background: transparent url('MDCAD-Logo.jpg') no-repeat 0 0; }
#mdcad-logo a span                                              { display: none; }

#asset-pageturn-lower                                           { width: 92px; height: 60px;
                                                                  float: left;
                                                                  background: transparent url('Canvas-PageTurn-Lower.jpg') no-repeat 0 0; }
                                                                  
#nav                                                            { width: 52px; height: 593px;
                                                                  float: left; }
                                                                  
#nav ul                                                         { width: 52px; height: 593px;
                                                                  margin: 0; padding: 0;
                                                                  list-style: none; }

#nav ul li                                                      { width: 52px;
                                                                  float: left; }

#nav ul li a                                                    { display: block;
                                                                  width: 52px; }

#nav ul li a span                                               { display: none; }

#primary                                                        { }
#primary ul li, #primary ul li a                                { overflow:hidden; }
#primary-about, #primary-about a                                { height: 129px; }
#primary-portfolio, #primary-portfolio a, #primary-modelling, #primary-modelling a, #primary-surveying, #primary-surveying a, #primary-portfolio, #primary-portfolio a, #primary-contact, #primary-contact a
                                                                { height: 116px; }
ul.about #primary-about a                                       { background: transparent url('Navigation-About-Us-Active.jpg') no-repeat 0 0; }
ul.about #primary-portfolio a                                   { background: transparent url('Navigation-Portfolio.jpg') no-repeat 0 0; }
ul.about #primary-portfolio a:hover                             { background: transparent url('Navigation-Portfolio-Hover.jpg') no-repeat 0 0; }
ul.about #primary-modelling a                                   { background: transparent url('Navigation-Modelling.jpg') no-repeat 0 0; }
ul.about #primary-modelling a:hover                             { background: transparent url('Navigation-Modelling-Hover.jpg') no-repeat 0 0; }
ul.about #primary-surveying a                                   { background: transparent url('Navigation-Surveying.jpg') no-repeat 0 0; }
ul.about #primary-surveying a:hover                             { background: transparent url('Navigation-Surveying-Hover.jpg') no-repeat 0 0; }
ul.about #primary-contact a                                     { background: transparent url('Navigation-Contact-Us.jpg') no-repeat 0 0; }
ul.about #primary-contact a:hover                               { background: transparent url('Navigation-Contact-Us-Hover.jpg') no-repeat 0 0; }

ul.portfolio #primary-about a                                   { background: transparent url('Navigation-About-Us-Next.jpg') no-repeat 0 0; }
ul.portfolio #primary-about a:hover                             { background: transparent url('Navigation-About-Us-Next-Hover.jpg') no-repeat 0 0; }
ul.portfolio #primary-portfolio a                               { background: transparent url('Navigation-Portfolio-Active.jpg') no-repeat 0 0; }
ul.portfolio #primary-modelling a                               { background: transparent url('Navigation-Modelling.jpg') no-repeat 0 0; }
ul.portfolio #primary-modelling a:hover                         { background: transparent url('Navigation-Modelling-Hover.jpg') no-repeat 0 0; }
ul.portfolio #primary-surveying a                               { background: transparent url('Navigation-Surveying.jpg') no-repeat 0 0; }
ul.portfolio #primary-surveying a:hover                         { background: transparent url('Navigation-Surveying-Hover.jpg') no-repeat 0 0; }
ul.portfolio #primary-contact a                                 { background: transparent url('Navigation-Contact-Us.jpg') no-repeat 0 0; }
ul.portfolio #primary-contact a:hover                           { background: transparent url('Navigation-Contact-Us-Hover.jpg') no-repeat 0 0; }

ul.modelling #primary-about a                                   { background: transparent url('Navigation-About-Us.jpg') no-repeat 0 0; }
ul.modelling #primary-about a:hover                             { background: transparent url('Navigation-About-Us-Hover.jpg') no-repeat 0 0; }
ul.modelling #primary-portfolio a                               { background: transparent url('Navigation-Portfolio-Next.jpg') no-repeat 0 0; }
ul.modelling #primary-portfolio a:hover                         { background: transparent url('Navigation-Portfolio-Next-Hover.jpg') no-repeat 0 0; }
ul.modelling #primary-modelling a                               { background: transparent url('Navigation-Modelling-Active.jpg') no-repeat 0 0; }
ul.modelling #primary-surveying a                               { background: transparent url('Navigation-Surveying.jpg') no-repeat 0 0; }
ul.modelling #primary-surveying a:hover                         { background: transparent url('Navigation-Surveying-Hover.jpg') no-repeat 0 0; }
ul.modelling #primary-contact a                                 { background: transparent url('Navigation-Contact-Us.jpg') no-repeat 0 0; }
ul.modelling #primary-contact a:hover                           { background: transparent url('Navigation-Contact-Us-Hover.jpg') no-repeat 0 0; }

ul.surveying #primary-about a                                   { background: transparent url('Navigation-About-Us.jpg') no-repeat 0 0; }
ul.surveying #primary-about a:hover                             { background: transparent url('Navigation-About-Us-Hover.jpg') no-repeat 0 0; }
ul.surveying #primary-portfolio a                               { background: transparent url('Navigation-Portfolio.jpg') no-repeat 0 0; }
ul.surveying #primary-portfolio a:hover                         { background: transparent url('Navigation-Portfolio-Hover.jpg') no-repeat 0 0; }
ul.surveying #primary-modelling a                               { background: transparent url('Navigation-Modelling-Next.jpg') no-repeat 0 0; }
ul.surveying #primary-modelling a:hover                         { background: transparent url('Navigation-Modelling-Next-Hover.jpg') no-repeat 0 0; }
ul.surveying #primary-surveying a                               { background: transparent url('Navigation-Surveying-Active.jpg') no-repeat 0 0; }
ul.surveying #primary-contact a                                 { background: transparent url('Navigation-Contact-Us.jpg') no-repeat 0 0; }
ul.surveying #primary-contact a:hover                           { background: transparent url('Navigation-Contact-Us-Hover.jpg') no-repeat 0 0; }

ul.contact #primary-about a                                     { background: transparent url('Navigation-About-Us.jpg') no-repeat 0 0; }
ul.contact #primary-about a:hover                               { background: transparent url('Navigation-About-Us-Hover.jpg') no-repeat 0 0; }
ul.contact #primary-portfolio a                                 { background: transparent url('Navigation-Portfolio.jpg') no-repeat 0 0; }
ul.contact #primary-portfolio a:hover                           { background: transparent url('Navigation-Portfolio-Hover.jpg') no-repeat 0 0; }
ul.contact #primary-modelling a                                 { background: transparent url('Navigation-Modelling.jpg') no-repeat 0 0; }
ul.contact #primary-modelling a:hover                           { background: transparent url('Navigation-Modelling-Hover.jpg') no-repeat 0 0; }
ul.contact #primary-surveying a                                 { background: transparent url('Navigation-Surveying-Next.jpg') no-repeat 0 0; }
ul.contact #primary-surveying a:hover                           { background: transparent url('Navigation-Surveying-Next-Hover.jpg') no-repeat 0 0; }
ul.contact #primary-contact a                                   { background: transparent url('Navigation-Contact-Us-Active.jpg') no-repeat 0 0; }
/*
#secondary-empty                                                { height: 129px; }
                                                                  
#secondary-about,
#secondary-about a                                              { height: 116px; }
#secondary-surveying,
#secondary-surveying a                                          { height: 116px; }
#secondary-design,
#secondary-design a                                             { height: 116px; }
#secondary-printing,
#secondary-printing a                                           { height: 116px; }

ul.surveying #secondary-empty                                   { background: transparent url('Navigation-Surveying-Empty.jpg') no-repeat 0 0; }
ul.surveying #secondary-about a                                 { background: transparent url('Navigation-Surveying-AboutUs.jpg') no-repeat 0 0; }
ul.surveying #secondary-about a:hover                           { background: transparent url('Navigation-Surveying-AboutUs-Hover.jpg') no-repeat 0 0; }
ul.surveying #secondary-surveying a                             { background: transparent url('Navigation-Surveying-Surveying.jpg') no-repeat 0 0; }
ul.surveying #secondary-design a                                { background: transparent url('Navigation-Surveying-Design.jpg') no-repeat 0 0; }
ul.surveying #secondary-design a:hover                          { background: transparent url('Navigation-Surveying-Design-Hover.jpg') no-repeat 0 0; }
ul.surveying #secondary-printing a                              { background: transparent url('Navigation-Surveying-Printing.jpg') no-repeat 0 0; }
ul.surveying #secondary-printing a:hover                        { background: transparent url('Navigation-Surveying-Printing-Hover.jpg') no-repeat 0 0; }

ul.design #secondary-empty                                      { background: transparent url('Navigation-Design-Empty.jpg') no-repeat 0 0; }
ul.design #secondary-about a                                    { background: transparent url('Navigation-Design-AboutUs.jpg') no-repeat 0 0; }
ul.design #secondary-about a:hover                              { background: transparent url('Navigation-Design-AboutUs-Hover.jpg') no-repeat 0 0; }
ul.design #secondary-surveying a                                { background: transparent url('Navigation-Design-Surveying.jpg') no-repeat 0 0; }
ul.design #secondary-surveying a:hover                          { background: transparent url('Navigation-Design-Surveying-Hover.jpg') no-repeat 0 0; }
ul.design #secondary-design a                                   { background: transparent url('Navigation-Design-Design.jpg') no-repeat 0 0; }
ul.design #secondary-printing a                                 { background: transparent url('Navigation-Design-Printing.jpg') no-repeat 0 0; }
ul.design #secondary-printing a:hover                           { background: transparent url('Navigation-Design-Printing-Hover.jpg') no-repeat 0 0; }

ul.printing #secondary-empty                                    { background: transparent url('Navigation-Printing-Empty.jpg') no-repeat 0 0; }
ul.printing #secondary-about a                                  { background: transparent url('Navigation-Printing-AboutUs.jpg') no-repeat 0 0; }
ul.printing #secondary-about a:hover                            { background: transparent url('Navigation-Printing-AboutUs-Hover.jpg') no-repeat 0 0; }
ul.printing #secondary-surveying a                              { background: transparent url('Navigation-Printing-Surveying.jpg') no-repeat 0 0; }
ul.printing #secondary-surveying a:hover                        { background: transparent url('Navigation-Printing-Surveying-Hover.jpg') no-repeat 0 0; }
ul.printing #secondary-design a                                 { background: transparent url('Navigation-Printing-Design.jpg') no-repeat 0 0; }
ul.printing #secondary-design a:hover                           { background: transparent url('Navigation-Printing-Design-Hover.jpg') no-repeat 0 0; }
ul.printing #secondary-printing a                               { background: transparent url('Navigation-Printing-Printing.jpg') no-repeat 0 0; }
*/
#header-image                                                   { height: 280px;
                                                                  overflow: hidden; }
                                                                  
#header-image.loading                                           { background:transparent url('loading.gif') no-repeat 50% 50%; }

#header-image img                                               { padding: 9px;
                                                                  border: 1px solid #ccc; }
                                                                  
#header-text                                                    { height: 23px;
                                                                  margin: 0 12px 0 0;
                                                                  border-bottom: 1px solid #ddd;
                                                                  font-size: 1.2em; line-height: 23px; font-weight: bold;
                                                                  color: #88172b; }
                                                                  
.justify                                                        { text-align: justify; }

a.more:link,
a.more:visited                                                  { text-decoration: none;
                                                                  color: #000; }
a.more:hover                                                    { text-decoration: underline;
                                                                  color: #000; }
a.more:active                                                   { text-decoration: none;
                                                                  color: #000; }
                                                                  
#canvas-right                                                   { width: 562px; height: 276px;
                                                                  padding: 0 12px 0 0;
                                                                  float: left;
                                                                  background: #fff url('Canvas-Bottom.jpg') no-repeat left bottom;
                                                                  background-position: bottom left; }

#canvas-right .singlePage                                       { width: 555px; height: 270px;
                                                                  padding: 0 7px 0 0;
                                                                  overflow: auto; }
                                                                  
#canvas-right .singlePage h3                                    { font-weight: bold; }

#canvas-right .page                                             { width: 562px; height: 275px;
                                                                  padding: 1px 0 0 0; }
                                                                  
#canvas-right h3                                                { margin: 15px 0 5px 0; }
#canvas-right p                                                 { margin: 5px 0;
                                                                  font-size: 0.9em; }
                                                                  
#canvas-right .page ul                                          { margin: 40px 0 0 13px; padding: 0;
                                                                  list-style: none; }
                                                                  
#canvas-right .page ul li                                       { width: 176px; height: 62px;
                                                                  margin: 0 7px 7px 0; padding: 0;
                                                                  float: left;
                                                                  overflow: hidden; }
                                                                  
#canvas-right .page ul li.noRightMargin                         { margin-right: 0; }

#canvas-right .page ul li a                                     { display: block;
                                                                  width: 176px; height: 62px;}
                                                                  
#canvas-right .page ul li a span                                { display: none; }
                                                                  
#canvas-right .page ul li img                                   { border: 1px solid #cccccc;}

#content-left p                                                 { margin: 0;
                                                                  font-size: 0.75em; }
                                                                  
#content-left .pageset                                          { display: none; }
#content-left .activePageset                                    { display: block; }

#content-left .page                                             { height: 123px; }
                                                                  
.bold                                                           { font-weight: bold; }

#div-personal                                                   { width: 281px;
                                                                  float: left; }
#div-company                                                    { width: 281px;
                                                                  float: left; }
                                                                  
#div-comments                                                   { clear: left; }

label                                                           { display: inline-block;
                                                                  width: 35%;
                                                                  /*line-height: 100%;*/ }
                                                                  
input,
select,
textarea                                                        { font-family: Calibri, Arial, Sans-Serif; }

.req                                                            { font-size: 0.8em;
                                                                  color: #f00; }
                                                                  
input.text,
select,
textarea                                                        { border: 1px solid #ccc; }
                                                                  
input.error,
select.error,
textarea.error                                                  { border: 1px solid #f00; }

textarea                                                        { width:  60%; 
                                                                  font-size: 0.8em; }

#para-submit                                                    { width: 20%;
                                                                  float: left; }
                                                                  
#progress,
#goodResult,
#badResult                                                      { display: none;
                                                                  width: 75%; height: 23px;
                                                                  float: left;
                                                                  line-height: 23px; }
                                                                  
#goodResult                                                     { color: #2f4f2f;
                                                                  font-weight: bold; }
                                                                  
#badResult                                                      { color: #f00;
                                                                  font-weight: bold; }
                                                                  
.centered                                                       { text-align: center; }