/* 
   IMPORTANT NOTICE
   This HTML5 and CSS layout is COPYRIGHT 2015-2018 Design215 Inc. 
   
   It MAY NOT be copied or used for any other web site without the express
   written permission of Design215 Inc. 954-630-3695 www.design215.com

   Design215.com CSS/115 stylesheet, v02.14.2015 
   for design215.com/dcal, NEW SITE v09.01.2018 
   
   Container layout of each page:

   body
     #pagehead
       #headerbox
         .navbar
         .navlinks
         .navlinks2
     #container
       #pagebody
         .contentbg
           .contentbox
             .C_med, .C_small, etc.
           .contentbox2
             .C_med, .C_small, etc.
     #footer
      
   -----------------------------------------------------------------------------

   
   Page Defaults and CSS Fixes
   ----------------------------------------------------------------------------- 
*/
html {
  line-height: 1.15; 
  -webkit-text-size-adjust: 100%; 
}
html,body {
  text-align:center; margin:0; padding:0; height:100%;
  box-sizing:border-box;
}

::-moz-selection {
  background: #ffffcc; color:#000;
  text-shadow: none;
}
::selection {
  background: #ffffcc; color:#000;
  text-shadow: none;
}

/*
   Fonts
   ----------------------------------------------------------------------------- 
   Define all fonts for the entire site in this section. 

*/
body {
  font-family:'PT Sans',verdana,helvetica,sans-serif; font-size:12px; color:#aaa;
  background:#363636;
}
p,dl,ul,ol,table td,pre.p2,.xtitle,div.navlinks {
  font-family:'PT Sans',verdana,helvetica,sans-serif; font-size:16px; color:#aaa;
}
p {
  font-family:'PT Sans',verdana,helvetica,sans-serif; line-height:120%;
  margin:0 10px 0 0; padding:0; max-width:800px;
}
p.p1 {
  margin:4px; font-size:12px; color:#aaa;
}
p.p2 {
  font-family:'PT Sans',verdana,helvetica,sans-serif; font-size:14px; color:#ccc; 
  line-height:120%;
  margin:4px; padding:0;
}
p.p4,ul.blist li {
  font-family:'PT Sans',verdana,helvetica,sans-serif; font-size:16px; color:#ccc;
  line-height:130%; letter-spacing:1px; 
  margin:2px 2px 2px 4px;
}  
p.p5,
.blogpost p,
#projDesc p {
  font-family:'PT Sans',verdana,helvetica,sans-serif; font-size:16px; color:#ccc;
  line-height:140%; letter-spacing:1px;
  margin:2px 2px 2px 4px; padding:0;
} 
h3,
span.h3,
span.h4 {
  font-family:'Josefin Sans',arial,helvetica,sans-serif; 
  font-size:18px; color:#fff; font-weight:normal;
  margin:2px 2px 4px 4px; padding:0;
  text-transform:uppercase; letter-spacing:1px;
}
  h3 a:link,
  h3 a:visited,
  h3 a:hover {
    font-weight:normal;
  }
  #fullName {
    margin-top:6px;
    text-transform:none;
  }
  span.h3 {
    display:block;
  }
  div.projlink h3 {
    padding-top:4px;
  }
  div.partlink h3 {
    padding-bottom:4px;
  }
  div.projlink h3,
  div.projlink a,
  div.partlink a {
    font-weight:normal; font-size:18px; text-transform:none;
  }
    
h2 {
  font-family:'Josefin Sans',arial,helvetica,sans-serif; 
  font-size:22px; color:#fff; font-weight:400;
  margin:0 2px 2px 2px; padding:0;
  text-transform:uppercase; letter-spacing:1px;
  line-height:100%;
}
  h2 span,
  h3 span {
    text-transform:none;
  }
  #menu h2 {
    font-size:30px; color:#e4701e; margin:2px 2px 2px 0;
    font-variant:small-caps;
  }
  #projTitle h2 {
    font-size:32px;
    text-transform:none;
  }
  
h1 {
  font-family:'Josefin Sans',arial,helvetica,sans-serif; 
  font-size:28px; color:#fff; font-weight:normal;
  margin:2px 0 2px 2px; padding:0; 
  text-transform:uppercase; letter-spacing:1px;
}
  h1.workbox {
    margin:10px 0 4px 0;
  }
  h1 span {
    font-size:16px;
  }
  .center {
    text-align:center;
  }
  #projAuthor h1 {
    font-size:22px;
  } 
  
p#projweight,
p#partweight,
p.pweight,
p#toolresult {
  font-family:'Josefin Sans',arial,helvetica,sans-serif; 
  font-size:32px; color:#ccff66; font-weight:normal;
  text-align:right; margin:0; padding:4px 8px 0 0; 
  letter-spacing:1px;
} 
p.pweight {
  font-size:24px; padding:0 4px 0 0;
}
p#proddesc,
p.posthead {
  font-family:'PT Sans',verdana,helvetica,sans-serif; font-size:14px; color:#aaa; 
}
p.posthead {
  color:#fff; margin:0 0 0 2px;
}
p.udm {
  font-family:'PT Sans',verdana,helvetica,sans-serif; font-size:14px; color:#ccff66;
  margin:4px; padding:0;
}
p.userbio {
  max-width:600px;
}

pre,code,.ckBox,.formula {
  font-family:'Courier New',courier,monospace; font-size:12px; color:#009900;
}
.code {
  font-family:'Courier New',courier,monospace; font-size:13px; color:#ccff66;
}

#footer p,.xsmall {
  font-family:arial,sans-serif; font-size:11px; color:#666;
  max-width:100%;
}
div.navlinks {
  font-family:'PT Sans',verdana,helvetica,sans-serif; font-size:16px; color:#ccc;
}
div.navlinks2 {
  font-family:'PT Sans',verdana,helvetica,san-serif; font-size:16px; color:#ccc;
}

span.req,
span.req2 {
  font-family:'PT Sans',verdana,helvetica,sans-serif; font-size:12px; font-weight:bold; color:#ff0000;
}
span.req2 {
  background:transparent url('images/reqicon.png') left center no-repeat; 
  padding-left:30px; font-weight:normal; color:#ccc;
}

span.divider {
  display:block; background:#333; color:#ccff66;
  font-family:'Josefin Sans',arial,helvetica,sans-serif; 
  font-size:18px; font-weight:normal;
  padding:10px 4px 8px 8px;
  text-align:left;
}

span.hdate { /* dates under H2 headings (articles, etc) */
  position:relative; display:inline-block;
  font-family:'PT Sans',verdana,helvetica,sans-serif; text-transform:uppercase; font-size:14px; color:#ccff66;
  margin:0 10px 4px 2px; padding:2px;
}
span.active {color:#ccff66;}

span.result {
  font-family:'PT Sans',verdana,helvetica,sans-serif; font-size:18px; color:#ccff66;
}

.boxBlur,
.boxBlurDisable,
.boxBlur:focus,.boxFocus,
.boxBlurR,
.boxBlurR:focus,.boxFocusR,
.boxError,.boxErrorR,
.boxRequired,.boxRequiredR,
.boxRequired:focus,.boxRequiredR:focus,
.boxClear { 
  font-family:'Courier New',courier,monospace; font-size:14px;
  padding:4px 6px 4px 6px;
}

a.m1,
a.del,
a.btn2,
a.btnfade {
  line-height:20px;
  font-size:16px; font-weight:400;
  vertical-align:middle;
}

.sm {position:relative; top:-4px; font-size:9px; font-weight:normal;} /* service mark (sm) */
.super {position:relative; top:-4px; font-size:11px;} /* superscript */
.subscript {position:relative; bottom:-2px; font-size:11px;} /* subscript */

.xred {color:#ffaa00;}
.xhlight {color:#ffcc00;}
.xgo {color:#008000;} /* confirmation messages */
.xword {font-weight:bold; color:#dddddd;}

.xcourier {font-family:'Courier New',courier; font-size:11px;}

/* 
  "font-family" should not be used below this line. 
  Of course, there may be exceptions. 


   HTML Element Defaults
   ----------------------------------------------------------------------------- 
*/

a {color:#78c5ff; cursor:pointer;}

a:link,
a:visited {text-decoration:none; font-weight:400; color:#78c5ff;}
a:hover {text-decoration:underline; font-weight:400; color:#fff;}

h1 a:hover {text-decoration:none;}

form {
  margin:0; padding:2px 0 0 4px;
}
img {
  margin:0; padding:0; border:0;
}
ol li {
  padding:2px 0 4px 0;
}
p {
  margin:2px 6px 2px 0; padding:0;  /* default is no left margin */
}
pre {
  margin:0; padding:0;
}

/* defaults for tables */  
table {
  margin:2px 6px 2px 4px; padding:0;
}
table td {  /* eliminates the need for valign="top" */
  font-size:11px; line-height:130%;
  vertical-align:top;
  padding:2px 2px 2px 0; margin:0;
}
table td.rt {  /* eliminates the need for align="right" */
  text-align:right;
}
table td.ct {  /* eliminates the need for align="center" */
  text-align:center;
}
.nwrap {
  white-space:nowrap;
}

table.navorder td {
  vertical-align:middle;
}

/* Fix Internet Explorer 11 word wrap */
textarea {
  white-space:pre-wrap;
}

ul {
  list-style:none;
  margin:4px 0 0 4px; padding:0;
}
ul li {
  margin:2px 0 10px 0; padding:1px 0 0 18px; width:98%;
  background:transparent url(images/bullet.png) 0 4px no-repeat;
}
  
iframe {
  border:0; margin:4px;
}
label {
  white-space:nowrap;
}
option {
  padding:2px;
}

form table { /* no left margin for tables inside forms */
  margin:2px 6px 2px 0; padding:0;
}


/* 
   Custom Styles
   ----------------------------------------------------------------------------- 
*/

/* Mobile Menu button */
a.mobile {
  display:block; line-height:20px; margin:0; padding:0 6px 0 0; 
  width:40px; height:40px; font-size:10px; color:#000;
  background:transparent url(images/mobilemenu.png) 1px 0px no-repeat;
  cursor:pointer;
}
a.mobile:link,
a.mobile:visited {text-decoration:none; font-weight:bold; color:#000;}
a.mobile:hover {text-decoration:none; font-weight:bold; color:#000;}

a.mobile span {visibility:hidden;}

/* Convert Menu button */
a.convert {
  display:block; line-height:20px; margin:0; padding:0 6px 0 0; 
  width:52px; height:40px; font-size:10px; color:#000;
  background:transparent url(images/convert-icon.png) 1px 0px no-repeat;
  cursor:pointer;
}
a.convert:link,
a.convert:visited {text-decoration:none; font-weight:bold; color:#000;}
a.convert:hover {text-decoration:none; font-weight:bold; color:#000;}

a.convert span {visibility:hidden;}

/* Edit Icon */
a.edit {
  display:inline-block; position:relative; width:28px; height:28px; top:3px;
  font-size:6px; margin:0; padding:0;
  background:transparent url(images/edit.png) 2px 2px no-repeat;
  cursor:pointer;
}
a.edit span {display:none;}

a.edit:link,
a.edit:visited {background:transparent url(images/edit.png) 2px 2px no-repeat;}
a.edit:hover {background:transparent url(images/edit.png) 2px -22px no-repeat;}

/* Tools Icon */
a.tools {
  display:inline-block; position:relative; width:28px; height:24px;
  font-size:6px; margin:0; padding:0;
  background:transparent url(images/tools.png) 0 0 no-repeat;
  cursor:pointer;
}
a.tools span {display:none;}

a.tools:link,
a.tools:visited {background:transparent url(images/tools.png) 0 0 no-repeat;}
a.tools:hover {background:transparent url(images/tools.png) 0 -24px no-repeat;}

/* footer links */
#footer a:link,
#footer a:visited {text-decoration:none; font-weight:bold; color:#fff;}
#footer a:hover {text-decoration:underline; font-weight:bold; color:#fff;}

/* W3C validation links */
#footer a.w3:link,
#footer a.w3:visited {text-decoration:none; font-weight:normal; color:#aaa;}
#footer a.w3:hover {text-decoration:none; font-weight:normal; color:#fff;}

  /* Style for link "buttons" like "New", etc */
  a.m1 {
    margin:0 8px 0 0; padding:10px 14px 10px 14px; background:#111;
    border-radius:4px;
    cursor:pointer;
  }
  a.m1:link,
  a.m1:visited {text-decoration:none; font-weight:400; color:#fefefe;}
  a.m1:hover   {
    text-decoration:none; font-weight:400; color:#000; background:#eee;
  }

  /* Style for link "buttons" like "Delete", etc */
  a.del {
    margin:0 20px 0 0; padding:10px 24px 10px 24px;
    background:#111 url('images/trash-icon.png') center center no-repeat;
    border-radius:4px;
    cursor:pointer;
  }
  a.del:link,
  a.del:visited {text-decoration:none; font-weight:400; color:#fefefe;}
  a.del:hover   {
    text-decoration:none; font-weight:400; color:#fff; 
    background:#aa0000 url('images/trash-icon.png') center center no-repeat;
  }
  a.del span {display:none;}

  /* Style for link "buttons" like "Save", "Go", etc */
  input.btn2 {
    line-height:20px; vertical-align:middle;
    letter-spacing:1px; color:#fff; font-weight:400;
    margin:0 1px 0 4px; padding:10px 14px 10px 14px; background:#0088ed;
    border-radius:4px; border:0;
    cursor:pointer;
  }

  a.btn2 {
    letter-spacing:1px; color:#fff;
    margin:0 1px -4px 4px; padding:10px 14px 10px 14px; background:#0088ed;
    border-radius:4px;
    cursor:pointer;
  }
  a.btn2:link,
  a.btn2:visited {text-decoration:none; font-weight:400; color:#fdfdfd;}
  a.btn2:hover   {
    text-decoration:none; font-weight:400; color:#fff; background:#00cc00;
  }

  /* Style for button once submitted */
  a.btnfade {
    letter-spacing:1px; color:#444;
    margin:0 1px 0 4px; padding:10px 14px 10px 14px; background:#2c2c2c;
    border-radius:4px;
  }
  a.btnfade:link,
  a.btnfade:visited {text-decoration:none; font-weight:400; color:#444;}
  a.btnfade:hover   {
    text-decoration:none; font-weight:400; color:#444; background:#2c2c2c;
  }

  a.copybtn {
    margin:0 0 0 40px;
  }
    
br.clr {
  clear:both;
}
br.nb { /* use on mobile */
  display:none; 
}
  
/* Separators to clear column floats */
div.xclear {
  position:relative; clear:both; height:1px; line-height:1px; 
  margin:0; padding:0;
}
div.xclearline { /* content under columns */
  position:relative; clear:both; width:90%; line-height:3px;
  margin:0; padding:0;
}

div.postlink {
  position:relative; width:95%;
  padding:12px 10px 12px 10px; margin:4px 0 6px 2px;
  background:rgba(0,0,0,0.3);
  border-radius:4px;
}

div.pthumb {
  position:relative; display:inline-block; vertical-align:top;
  text-align:center; width:248px; height:148px;
  background:#222;  
  margin:4px 6px 12px 6px; padding:0; overflow:hidden;
  border:2px solid #222;
}
  div.pthumb a {
    text-transform:uppercase; font-size:12px;  
  }
  div.pthumb a:link,
  div.pthumb a:visited {text-decoration:none; font-weight:normal; color:#fff;}
  div.pthumb a:hover {text-decoration:none; font-weight:normal; color:#ff7f00;}
  
  div.pthumb img {
    border:4px solid #fff;
    max-width:99%;
  }

div#modal {
  position:fixed; top:0; left:0;
  width:100%; height:100%;
  display:none;
  background-color: rgba(0,0,0,0.6);
  overflow:auto;
  margin:0; padding:0;
  z-index:97;
}

/* iframe box for editing */
div#workbox {
  position:relative; display:inline-block;
  min-width:460px; max-width:960px; min-height:240px;
  background:#282828;
  border:4px solid #555;
  margin:20px auto 0 auto;  /* auto margin doesn't work with flex */
  padding:8px 4px 4px 8px;
  text-align:left;
  z-index:97;
  border-radius:4px;
  box-shadow:2px 2px 16px rgba(0,0,0,0.4);
}
iframe#df2 {
  position:relative;
  margin:0; padding:0; border:0;
  display:none;
}
#partform {
  position:relative;
  display:flex; flex-direction:row; flex-wrap:wrap;
  align-items:flex-start;
}

p#modedesc {
  max-width:400px;
}

div.prodimgedit,
div.prodimgview {
  position:relative; display:inline-block; width:400px; height:225px;
  background:#111 url('images/prodimg.png') center center no-repeat; 
  border:1px solid #555;
  margin:0 8px 0 0; padding:0;
}
p.proddescedit,
p.proddescview {
  display:block; width:400px;
} 
 
div.projlink,
div.partlink {
  position:relative;
  max-width:800px; min-height:50px;
  padding:4px 4px 12px 4px;
  border:1px solid #252525; margin:-1px 0 0 0;
}
.xbga {background:#2c2c30;}
.xbgb {background:#323238;} 

  div.projlink p.p1 {
    display:block; position:absolute; right:2px; bottom:2px;
    text-align:right;
  }
  div.projlink h2,
  div.partlink h2,
  div.partlink h3 {
    width:90%; white-space:nowrap;
    overflow:hidden;
  }
  .locked {
    background:transparent url(images/lock.png) left center no-repeat;
    padding-left:28px;
  }
  div.partlink div {
    position:relative; display:inline-block; vertical-align:top; 
    max-width:80%;
  }
  div.partlink a {
    color:#78c5ff; cursor:pointer;
  }
  div.projlink a:hover,
  div.partlink a:hover {
    text-decoration:none; color:#fff;
  }
  div.editlink {
    position:absolute; top:2px; right:2px; 
    margin:0; padding:0;
  }
  h3.totweight {
    position:absolute; width:150px; bottom:32px; right:4px;
    text-align:right;
  } 
  
a.proj2 { 
  display:block; max-width:90%; padding:6px 4px 6px 4px;
  text-decoration:none; font-weight:bold; color:#78c5ff;
  cursor:pointer; white-space:nowrap; overflow:hidden;
} 
a.proj2:link,
a.proj2:visited {text-decoration:none; font-weight:bold; color:#78c5ff;}
a.proj2:hover {text-decoration:none; font-weight:bold; color:#fff;
  background:#282828;
}
  
p#projweight {
  position:absolute; right:6px; top:0; width:160px;
  margin:0 2px 0 2px; padding:0; 
  line-height:100%;
}
p#partweight,
p.pweight {
  position:absolute; right:4px; top:4px; width:160px;
  margin:0; padding:0;
}
p.ptools {
  position:absolute; right:4px; bottom:4px; width:32px;
  margin:0; padding:0;
}

img.xpic {
  margin:0; padding:0;
}
img.npic {
  width:80%; border:6px solid #fff;
  margin:4px 0 0 15%; padding:0;
}
img.xthumb {
  margin:8px 5px 15px 20px; padding:10px;
  background:#fff; border:solid 1px #fff;
}
img.menu {
  width:300px; border:4px solid #fff;
  margin:10px 0 0 12px; padding:0;
}
img.xleft {  /* left aligned image */
  float:left; margin:2px 10px 2px 0;
}
img.xright {  /* right aligned image */
  float:right; margin:2px 0 2px 10px;
}
img.dleft {  /* left aligned image for use with ul.dlist */
  float:left; margin:2px 10px 2px 12px;
  border:1px solid #666666;
}
img.social {
  margin:4px 10px 0 0;
}
img.avatar {
  float:left; margin:2px 10px 20px 4px;
  width:64px; height:64px;
}
img.tinyimg {
  display:inline-block;
  height:45px; margin:0 8px 0 0;
  cursor:pointer;
}
.blogpost img {
  max-width:100%;
}

div#projDesc img {
  max-width:98%;
  margin:4px 0 4px 0;
}

div.photo_main {
  position:absolute;
  left:304px; top:38px;
}
div.img_border {
  position:absolute;
  left:12px; top:4px;
  z-index:95;
}
  

label.noshow,
h1.noshow,
h2.noshow,
span.tt,
span.noshow {display:none;}


#pagehead h1,#pagehead h2 {
  display:none;
}
  
ul.blist {
}
ul.blist li {
  margin:2px 0 10px 0; padding:1px 0 0 28px; width:90%;
  background:transparent url(images/bullet-df.png) 0 2px no-repeat;
}

  
/* Form fields */
.ckBox { /* checkboxes */
  margin:1px; padding:0;
}
  
.boxBlur {
  border:1px solid #555; color:#ccff66; background:#212121;
}
.boxBlurDisable {
  border:1px solid #555; color:#aaa; background:#303030;
}
.boxBlur:focus,.boxFocus {
  border:1px solid #ccff66; color:#fff; background:#000;
}
.boxBlurR {
  border:1px solid #555; color:#ccff66; background:#212121;
  text-align:right;
}
.boxBlurR:focus,.boxFocusR {
  border:1px solid #ccff66; color:#fff; background:#003300;
  text-align:right;
}
  .boxError,.boxErrorR {
    border:1px solid #ff0000; background:#ffcccc; 
  }
  .boxErrorR {
    text-align:right;
  }
  .boxRequired,.boxRequiredR {
    border:1px solid #ff0000; color:#fff; background:#212121; 
  }
  .boxRequiredR {
    text-align:right; 
  }
  .boxRequired:focus,.boxRequiredR:focus {
    border:1px solid #ff0000; color:#fff; background:#000; 
  }
  .boxRrequiredR:focus {
    text-align:right;
  }
  .boxDisable {
    display:none;
  }
  .boxHidden {
    visibility:hidden;
  }
  .boxClear {
    text-align:right;
    border:1px solid #000; color:#fff; background:#212121;
  }
  
  .projDesc,
  .projInfo,
  .profileImg {
    width:95%;
  }


/* hide "spinners" on input type="number" */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance:none;
  margin:0;
}
input[type=number] {
  -moz-appearance:textfield;
} 

/* Form fields generated by makeFormField()  */
div.formfield {
  position:relative; display:inline-block; vertical-align:top;
  text-align:left; min-width:50px;
  margin:0 10px 15px 0; padding:0;
}
div.formfield label,
div.formfield p,
div.formfield p b {
  font-weight:normal; color:#eee;
}
p.charcount {
  position:absolute; width:80px; top:0px; right:4px;
  text-align:right; margin:0; padding:0;
}

#mshortdes {height:172px;}

/* Radio Buttons */
label.radio {
  display:block; margin:6px 0 6px 0;
  font-size:20px; 
  line-height:28px; /* adjusts text vert pos */
  cursor:pointer;
}
input[type="radio"]:not(old) {
  display:none;
}
input[type="radio"]:not(old)+span:before {
  display:inline-block;
  content: url('images/radio-unselected.png');
  width:30px; height:24px;
  margin:0; padding:0;
  vertical-align:bottom;
}
input[type="radio"]:not(old):checked+span:before {
  content: url('images/radio-selected.png');
}
.p-radio {
  margin:-8px 0 8px 30px !important; padding:0;
}

/* Checkboxes */
label.ckbox {
  display:block; margin:4px 0 4px 0;
  font-size:20px; 
  line-height:26px; /* adjusts text vert pos */
  cursor:pointer;
  width:34px; /* prevent full width box */
}
input[type="checkbox"]:not(old) {
  display:none;
}
input[type="checkbox"]:not(old)+span:before {
  display:inline-block;
  content: url('images/checkbox.png');
  width:34px; height:28px;
  margin:0; padding:0;
  vertical-align:bottom;
}
input[type="checkbox"]:not(old):checked+span:before {
  content: url('images/checkbox-checked.png');
}

#svbox1,
#svbox2 {
  width:90%; height:auto;
}
  

/* 
   Containers for this layout
   -----------------------------------------------------------------------------
*/

#pagehead {
  position:fixed; left:0; top:0; height:90px; width:100%;
  text-align:left; margin:0; padding:0;
  background:#202020;
  overflow:visible; z-index:96; /* must be less than drop menu z-index */
  border-bottom:1px solid #424242;
}
  #headerbox {
    margin:0; padding:0; width:100%;
  }
    #pagehead div.navbar {
      position:relative; display:block; 
      width:180px; left:0; top:6px;
      margin:0 auto 0 auto; padding:0;
    }
    div.navlinks {
      position:absolute; width:100%; height:32px; top:86px;
      padding:0; margin:0;
      background:#111;
      border-top:1px solid #000;
      border-bottom:1px solid #444;
      display:none;
    }
      div.navlinks div {
        position:relative; top:6px; width:470px;
        margin:0 auto 0 auto;
        text-align:center;
      }
    div.navlinks2 {
      display:none;
    }
  div.mobilemenu {
    position:absolute; top:26px; left:15px; width:44px; height:44px; 
    margin:0; padding:0; overflow:hidden; display:block;
  }
  div.convertmenu {
    position:absolute; top:30px; right:15px; width:56px; height:44px; 
    margin:0; padding:0; overflow:hidden; display:none;
  }
  #convert {
    position:absolute; top:32px; right:15px; width:340px; height:32px; 
    text-align:right; margin:0; padding:0;
  }    
    #convert p.mm {
      display:inline;
      text-align:left;
    }
  
#container {
  position:relative; display:flex; justify-content:center; height:100%;
  text-align:center; margin:0; padding:0;
}

  /* Page body, full width of container */
  #pagebody {
    position:relative; 
    width:100%; /* needed for flex mode */
    text-align:left; margin:100px 0 0 0; padding:0;
  }
    /* Full width container CLASS for full width backgrounds */
    div.contentbg {
      position:relative; width:100%;
      text-align:left; margin:10px 0 100px 0; padding:0; /* bottom padding needed for flex mode?? */
    }
      /* Inner content box for centered, fixed width content */
      div.contentbox {
        position:relative; max-width:1000px;
        text-align:left; margin:0 auto 0 auto; padding:0;
      }
      div.contentbox2 {
        display:flex; flex-flow:row wrap; justify-content:center;
      }

          /* Columns, Total width must be <= 750px */
          div.L_full {width:100%;}
          div.R_full {width:900px;}
          
          div.L_full2 {
            position:relative;
            width:100%; max-width:1000px; 
            margin:0 auto 60px auto; padding:0;
          }
           

/* Footer, extends to bottom edge of window */
#footer {
  position:fixed; width:100%; bottom:0px;
  background:#111; color:#ccc;
  text-align:center;
  border-top:1px solid #333;
  z-index:96;
}
  #footer p {
    padding:10px 0 10px 0; color:#929292;
  }

    
/* 
   Page specific styles
   -----------------------------------------------------------------------------
*/

div.ctitle,
div.ctitle2 {
  position:relative; text-align:center;
  margin:0 4px 0 4px; padding:0 0 20px 0; overflow:hidden;
}
  div.ctitle img {max-width:100%; height:auto;}
  
div.C_inline,
div.C_small2,
div.C_small3,
div.C_med { /* centered column that wraps @ min-width */
  position:relative; display:inline-block; vertical-align:top;
  text-align:left; max-width:620px; min-width:460px;
  margin:0 4px 0 4px; padding:0; overflow:hidden;
}
div.C_small {
  position:relative; flex:45%; align-self:flex-start;
  max-width:750px; margin:0 6px 4px 6px;
}
div.C_inline {
  max-width:440px; min-width:440px;
  margin:0;
}
div.C_small2 {
  max-width:400px; min-width:400px;
  min-height:520px;
  overflow:visible; 
}
div.C_small3 {
  max-width:300px; min-width:300px;
}
div.C_large {
  position:relative; text-align:left;
  width:100%; max-width:1520px; margin:0 6px 2px 6px;
}
div.C_flex {
  position:relative; flex:0 1 470px; align-self:flex-start;
}
div.C_flex2 {
  position:relative; flex:25%; align-self:flex-start;
  max-width:250px; margin:4px 6px 4px 6px;
}
div.C_flex3 {
  position:relative; flex:30%; align-self:flex-start;
  max-width:350px; margin:4px 6px 4px 6px;
}

#fullphoto {
  position:relative; width:100%;
  margin:0; padding:0; 
  text-align:center;
  background:#111;
  overflow:hidden;
}

body.about div.navlinks {
  display:block;
}
body.about #pagebody {
  margin-top:140px;
}
 
/* Content Backgrounds */

#pag_about,
#pag_blog,
#pag_notfound {
  background:#363636 url(images/drogon-v1-dfcalc.jpg) top center fixed;
}
#pag_blogpost {
  background:#202020 url(images/drogon-v1-dfcalc2.jpg) top center fixed;
}

.orange {
  color:#fff;
  background:#e4701e;
}
.orange p {color:#000;}

.green {
  background:#c3cd4e;
}
.green div p {color:#fff;}

.black {
  background:#111;
}
.about1 {
  background:#222;
}
.bg-cover { 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.fullpic img {
  width:100%; margin:0; padding:0; 
  vertical-align:top; /* gets rid of "mystery space" */
}


/* Design215 Guestbook/Comments v01.27.06 */
.xguest {  /* outside table */
  width:640px; margin:0;
}
table.xguest table {
  margin:0;
}
table.xtopics {
  width:90%; 
  margin:0 0 0 12px;
}
table.xtopics td {
  width:auto;
  margin:0 10px 0 0;
}
table.xtopics td p {
  margin:0 10px 0 0;
  border-bottom:1px dashed #888888;
} 

p.gb1 {
  font-family:verdana,helvetica,sans-serif; font-size:11px;  color:#ffdf4d;
  margin:2px 2px 0 12px; padding:0;
}

.gbox {  /* remaining characters field, guestbook */ 
  text-align:right; width:320px;
  border:0; color:#aaaaaa; background:transparent;
}
.cbox {  /* remaining characters field, comments */ 
  width:250px;
  border:0; color:#aaaaaa; background:transparent;
}
.guestErr {
  font-weight:bold; color:#ff8800; 
}
.gline { /* user entries separator */
  position:relative; display:block; line-height:4px;
  margin:0 20px 4px 20px; padding:0;
  border-bottom:1px dashed #888888;
}
.xquote1 {
  font-family:serif; font-size:12px; color:#274627;
  background:transparent url(/images/quote1.gif) no-repeat;
  padding:0 0 0 8px;
}
.xquote2 {
  font-family:serif; font-size:12px; color:#274627;
  background:transparent url(/images/quote2.gif) no-repeat;
  padding:0 0 0 8px; margin:0 0 0 2px;
}
p.gst1 {margin:4px 0 8px 12px; font-size:11px; color:#000000; line-height:120%;}
p.gst2 {margin:4px 60px 0 12px; font-size:11px; color:#000000; line-height:130%;}


/* Design215 Drop Menu, v11.22.2012 */
#xtooltip {
  position:absolute; left:-200px; top:5px; z-index:98;
  margin:0; padding:0 0 7px 0;
  background:transparent url(images/tooltip_pointer.png) 14px bottom no-repeat;
}
#xtooltip p.tt1,
#xtooltip p.tt2 {
  color:#fff; text-align:left; margin:0; padding:6px 8px 8px 8px;
  font-family:arial,helvetica,sans-serif; font-size:14px;
  background:transparent url(images/tooltip.png);
  border-radius:4px; border:2px solid #000;
}

#menu1 {  /* mobile menu */
  position:fixed; visibility:hidden; z-index:99;
  width:320px; left:-999em; /* removes the extra vertical space from the long menu */
  text-align:left; background:#000; color:#fff; padding:4px;
  border-radius:2px; border:1px solid #666;
  box-shadow:8px 8px 24px rgba(0,0,0,0.5);
}
  #menu1 p {
    font-size:18px;
    width:100%; /* necessary for IE7 or menu height bug */
    margin:0; padding:4px 4px 2px 4px; 
  }
  #menu1 p span {
    display:none;
  }
  #menu1 a {
    font-family:'PT Sans',arial,sans-serif; font-size:22px; 
    position:relative; display:block; height:22px;
    font-weight:bold; color:#fff; text-transform:uppercase;
    margin:0 16px 0 6px; padding:16px 3px 16px 12px;
    border-bottom:1px solid #333;
  }
  #menu1 a:link,
  #menu1 a:visited {text-decoration:none; color:#ccc;}
  #menu1 a:hover {text-decoration:none; color:#000; background:#ddd;}

#menu2 { /* mm to in convert menu */
  position:fixed; visibility:hidden; z-index:99;
  width:320px; left:-999em; /* removes the extra vertical space from the long menu */
  background:#000; color:#fff; padding:20px 4px 10px 4px;
  border-radius:2px; border:1px solid #666;
  box-shadow:8px 8px 24px rgba(0,0,0,0.5);
}
  #menu2 p {
    display:inline;
  }    
  #mmfield2,#infield2 {
    font-size:20px; width:80px;
  } 

a#dropmenu2b { /* inch fractions select box */
  display:inline-block; width:36px; font-size:16px;
  background:transparent url('images/select-arrow.png') right center no-repeat;
  color:#fff;
  padding:2px 24px 3px 2px; margin:1px 0 0 0; height:20px;
  cursor:pointer; 
}
a#dropmenu2b:hover {text-decoration:none;}

#menu2b,#menu100 {  /* inch fractions menu */
  width:320px; 
}
  #menu2b p,#menu100 p {
    width:100%; margin:0 0 30px 0; padding:0; 
    text-align:left; background:#000; color:#fff;
    border:1px solid #aaa; 
  }

a#dropmenu3 { /* usermode select box */
  width:216px;
}
#menu3 {  /* usermode menu */
  width:248px; 
}
  #menu3 p {
    width:100%; margin:0 0 30px 0; padding:0; 
    text-align:left; background:#000; color:#fff;
    border:1px solid #aaa; 
  }

a#dropmenu4 { /* unit select box */
  width:70px;
}
#menu4 {  /* unit menu */
  width:102px;
}
  #menu4 p {
    width:100%; margin:0 0 30px 0; padding:0; 
    text-align:left; background:#000; color:#fff;
    border:1px solid #aaa; 
  }

a#dropmenu5 { /* series select box */
  width:200px;
}
#menu5 {  /* series menu */
  width:232px;
}
  #menu5 p, 
  .msize6 p {
    width:100%; margin:0 0 30px 0; padding:0; 
    text-align:left; background:#000; color:#fff;
    border:1px solid #aaa; 
  }

a#dropmenu6 { /* model select box */
  width:340px;
}
a#dropmenu6 span {display:none;}
#menu6 {  /* model menu */
  position:absolute; visibility:hidden;
  width:372px; max-height:450px; overflow-y:auto; overflow-x:hidden;
  border:1px solid #aaa; 
  padding:0; margin:0;
}
  #menu6 p {
    width:100%; margin:0; padding:0; 
    text-align:left; background:#000; color:#fff;
  }

a#dropmenu7 { /* copy part select box */
  width:120px; margin:-2px 0 0 0;
}
#menu7 {  /* parts menu */
  position:absolute; visibility:hidden;
  width:120px; max-height:450px; overflow-y:auto; overflow-x:hidden;
  border:1px solid #aaa; 
  padding:0; margin:0;
}
  #menu7 p {
    width:100%; margin:0; padding:0; 
    text-align:left; background:#000; color:#fff;
  }
  
/* general classes for toolbox */
a.mlink3 { 
  width:50px !important;
}
.msize3 { 
  width:82px;
}
a.mlink4 { 
  width:70px !important;
}
.msize4 { 
  width:102px;
}
a.mlink5 {
  width:100px !important;
}
.msize5 {
  width:132px;
}
a.mlink6 {
  width:130px !important;
}
.msize6 {
  width:162px;
}
  .msize3 p,
  .msize4 p,
  .msize5 p,
  .msize6 p {
    width:100%; margin:0 0 30px 0; padding:0; 
    text-align:left; background:#000; color:#fff;
    border:1px solid #aaa; 
  }


/* select box replacement menu v1.5 */
a.selectx { 
  display:inline-block; width:200px; font-size:16px;
  background:#212121 url('images/select-arrow.png') right center no-repeat;
  color:#fff; border:1px solid #555;
  padding:4px 24px 1px 8px; margin:0; height:20px;
  cursor:pointer; 
}
a.selectx:hover {text-decoration:none;} 

/* general purpose drop menu link, arrow on right */
a.droplink { 
  display:inline-block; width:38px; font-size:16px;
  background:transparent url('images/select-arrow.png') right center no-repeat;
  color:#fff;
  padding:2px 24px 3px 4px; margin:1px 0 0 0; height:20px;
  cursor:pointer; 
}
a.droplink:hover {text-decoration:none;}

/* general purpose drop menu link, arrow on left */
a.droplink2 { 
  display:inline-block; width:38px; font-size:16px;
  background:transparent url('images/select-arrow.png') left center no-repeat;
  color:#fff;
  padding:2px 2px 3px 28px; margin:1px 0 0 0; height:20px;
  cursor:pointer; 
}
a.droplink2:hover {text-decoration:none;}

div.dropx {
  position:absolute; visibility:hidden; z-index:99;
  left:-999em; /* removes the extra vertical space from the long menu */
  padding:0; margin:0;
}
div.dropx2 {
  position:fixed; visibility:hidden; z-index:99;
  left:-999em; /* removes the extra vertical space from the long menu */
  padding:0; margin:0;
}
  /* Fix 2px whitespace under images, 04.14.2015 */
  div.dropx img,div.dropz img {
    vertical-align:top;
  }

  div.dropx a {
    position:relative; display:block; height:22px;
    font-family:'PT Sans',arial,sans-serif; font-size:18px; 
    font-weight:400; color:#fff;
    margin:0; padding:16px 3px 16px 12px;
    border-bottom:1px solid #333;
    cursor:pointer;
  }
  p.dropx2 a {
    position:relative; display:inline-block; height:16px; width:84px;
    font-family:'PT Sans',arial,sans-serif; font-size:18px; 
    font-weight:400; color:#fff;
    margin:0; padding:8px 3px 8px 12px;
    border-bottom:1px solid #333;
    cursor:pointer;
  }
  div.dropx a:link,
  div.dropx a:visited,
  p.dropx2 a:link,
  p.dropx2 a:visited {text-decoration:none; color:#ccc;}
  
  div.dropx a:hover,
  p.dropx2 a:hover {text-decoration:none; color:#000; background:#ddd;}
  
  a.mtrl,a.mtrl2 {
    font-family:'PT Sans',arial,sans-serif; font-size:18px; 
    position:relative; display:block; height:32px;
    font-weight:400; color:#fff;
    margin:0; padding:12px 3px 16px 12px;
    border-bottom:1px solid #333;
    white-space:nowrap; overflow:hidden;
    cursor:pointer;
  }
  a.mtrl2 {
    background:#133656; /* or green, 2b4000 */
  }
  a.mtrl span,a.mtrl2 span {
    font-size:14px; color:#aaa;
  }
  a.mtrl:link,
  a.mtrl2:link,
  a.mtrl:visited,
  a.mtrl2:visited {text-decoration:none; color:#ccc;}
  a.mtrl:hover,
  a.mtrl2:hover {text-decoration:none; color:#000; background:#ddd;}
  
  
  
div.xclearmenu { /* content under columns */
  position:relative; clear:both; width:400px; 
  margin:0; padding:0;
}

  
/* replace or resize images */

img.rp50 { /* small footer logo v12.29.2009 */
  position:relative; margin:-12px 0 0 0; top:12px;
}


/* PCart Shopping Cart Styles and Overrides */
p.pcart {
  position:relative; max-width:470px;
  line-height:normal;
  margin:2px 6px 2px 4px; padding:0;
}
  p.pcart b {
    font-weight:normal; color:#eee;
  }
div.pclear {
  position:relative; clear:both;
  margin:0; padding:0;
}

iframe#pcframe1 {
  border:1px solid #ddd;
  margin:0 0 0 12px;
  display:none;
}

iframe#pcframe2 {
  position:relative;
  margin:0; padding:0; border:0;
  display:none;
}

iframe#pcframe3 {
  position:relative;
  margin:0; padding:0; border:0;
  width:98%; min-width:450px; height:500px; 
}

/* iframe box for adding items to cart */
div#cartbox {
  position:fixed; left:50%; top:50%;
  width:460px; min-height:240px;
  background:#fff;
  border:1px solid #888;
  margin:-120px 0 0 -235px; padding:8px 2px 2px 2px;
  text-align:left;
  visibility:hidden;
  z-index:999;
  border-radius:4px;
  box-shadow:2px 2px 16px rgba(0,0,0,0.4);
}

#pcartItemCount {
  position:relative; 
  text-align:center;
  margin:0; 
}
#pcartItemCount a {
  font-family:verdana,helvetica,sans-serif; font-size:14px; color:#000;
  text-decoration:none; font-weight:bold;
  background-color:transparent;
  padding:0; margin:0 0 0 -4px;
  border-radius:0;
}
#pcartItemCount a:hover {
  text-decoration:none; font-weight:bold; color:#000;
}
img.pccarticon {
  vertical-align:middle;
}

.addBtnQuan {
  font-size:24px; font-weight:bold; width:30px; height:32px;
  border:1px solid #c9c9c9; color:#181818; background:#fcfcfb;
  padding:5px;
}
.addBtnQuan:focus {
  font-size:24px; font-weight:bold; width:30px; height:32px;
  border:1px solid #8fd700; color:#181818; background:#ffffdd;
  padding:5px;
}

p.pcitemprice {
  padding:0 0 8px 0;
  font-family:arial,helvetica,sans-serif; font-size:30px; 
  font-weight:bold; color:#e4701e;
}

div.pcartlogin {
  max-width:330px; padding:0; margin:0;
}
div.pcartlogin p, {
  padding:2px 0 2px 4px; margin:0 0 4px 4px;
}
div.pcartlogin p.rt {
  width:70%; max-width:300px;
  text-align:right;
  margin:8px 0 16px 0;
}

form#pcartForm {
  margin:0 0 0 4px;
}
form#pcartForm h2 {
  margin-left:-2px;
}
form#pcartForm p {
  font-size:14px;
}  
form#plogin p label {
  font-size:14px; font-weight:normal; color:#eee;
}
form#plogin input {
  font-size:14px; padding:8px;
}
input#pcart1,
input#pcart2 {width:200px;}

div#pcartLogin {
  position:relative;
  width:100%; max-width:420px; min-height:400px;
  padding:0 0 0 8px; margin:0;
}
div#pcartAccount {
  position:relative;
  width:100%; max-width:470px; min-height:400px;
  padding:0 0 0 8px; margin:0;
}
div#errmsg h2 {
  color:#ffcc00;
}
div#errmsg p {
  color:#ffaa00;
}

img.pcprodimg {
  margin:0; padding:4px 0 8px 0;
  width:120px; height:auto;
}  
img.pcplaceholder {
  margin:1px 3px 3px 1px; padding:0 20px 0 20px;
  border:solid 1px #dddddd;
}  
div#pcartDiv {
  position:relative;
  width:100%;
  padding:0; margin:0;
}
.pcbg1 {
  background:#eee;
}
.pcbg2 {
  background:#fff;
}
.pcdivline {
  border-bottom:1px solid #ccc;
}

table.pctotal {
  position:relative; float:right;
  width:300px; margin:0 4px 0 0; padding:0;
}
  table.pctotal td {
    font-size:14px;
  }
  
.pcNavBtns {
  position:relative;
  text-align:right;
}

div.topR {
  position:absolute; top:6px; right:8px;
  padding:0; margin:0; width:24px; height:24px;
}

  a.pcBtn {
    display:inline-block;
    letter-spacing:1px; color:#fff; font-weight:400;
    margin:4px 1px 0 4px; padding:10px 14px 10px 14px; background:#0088ed;
    border-radius:4px; border:0;
    cursor:pointer;
  }
  a.pcBtn:link,
  a.pcBtn:visited {text-decoration:none; font-weight:400; color:#fdfdfd;}
  a.pcBtn:hover   {
    text-decoration:none; font-weight:400; color:#fff; background:#00cc00;
  }

/* pcart field length defaults */
#pcacctemail {width:300px;}
#pczip {width:160px;}

/* PCart Styles End */


@media only screen and (max-width:900px) {
  /* Style adjustments for viewports that meet the condition */
  #pag_about #container {
    height:auto;
    background:#363636 url(images/drogon-v1-dfcalc.jpg) top center scroll;
  }

  h1 {font-size:24px;}
  p.p2 {font-size:14px;}
  
  #projTitle h2 {
    font-size:24px;
    max-width:80%; /* prevent project title from overlapping weight */
  }
  p#projweight {
    font-size:28px;
  }
  
  .boxBlur,
  .boxBlurDisable,
  .boxBlur:focus,.boxFocus,
  .boxBlurR,
  .boxBlurR:focus,.boxFocusR,
  .boxError,.boxErrorR,boxErrorR:focus,
  .boxRequired,.boxRequiredR,
  .boxRequired:focus,.boxRequiredR:focus,
  .boxClear {
    font-size:20px;
    font-family:'PT Sans',arial,helvetica,sans-serif !important;
  }

  input[type="number"],
  input[type="password"],
  input[type="search"],
  input[type="tel"],
  input[type="text"],
  select:focus,
  textarea {
    font-size:20px;
  }
    
  a.selectx {
    font-size:20px; height:24px; padding:8px 24px 3px 8px;
  }
  a.droplink { 
    font-size:20px; height:24px; padding:8px 28px 3px 4px;
  }
  a.droplink2 { 
    font-size:20px; height:24px; padding:8px 8px 3px 28px;
  }
  #mname {width:300px;}
  #mquantity {width:60px;}
  #mdim1,
  #mdim2,
  #mweight {width:80px;}
  #mshortdes {width:400px !important; height:132px;}
  
  a.m1,
  a.del,
  a.btn2,
  a.btnfade {
    font-size:16px;
    margin-right:10px;
  }
  textarea,
  .projDesc {
    width:98%;
    font-family:'PT Sans',arial,helvetica,sans-serif !important;
  }
  iframe.youtube {
    max-width:100%; margin:0; padding:0;
  }

  div.formfield {
    max-width:95%;
  }
  
  #pagehead {
    height:76px;
  }
  #headerbox {
    height:52px;
  }
  #pagehead div.navbar {
    position:relative; display:block; 
    width:150px; left:0; top:6px;
    margin:0 auto 0 auto; padding:0;
  }
    div.navbar img {
      width:150px;
    }
  div.mobilemenu,
  div.convertmenu {
    display:block; top:16px;
  }
  
  #pagebody {
    margin:80px 0 0 0;
    min-width:480px;
  }
  body.about #pagebody {
    margin-top:110px;
  }
  body.about div.navlinks {
    top:74px;
  }
  body.about div.navlinks div {
    top:4px; font-size:20px;
  }

  #container {  /* let content expand container down to height of page, not just the window */
    height:auto; 
  }
  #footer {  /* get rid of "sticker" footer on mobile */
    position:relative; height:60px;
  }

  div.contentbox {
    margin:0; text-align:left;
  }
  div.contentbox2 {
    /* flex-flow:column nowrap; justify-content:center; */
  }
  div.C_large {
    width:99%; max-width:770px; margin:0 0 2px 6px;
  }
  div.C_med {
    width:96%;
    min-width:96%; max-width:800px; 
    padding:0;
  }
  div.C_small,
  div.C_flex2,
  div.C_flex3 {
    width:80%;
    min-width:470px; max-width:760px;
  } 
  div.C_small2 {
    min-height:40px; max-width:none; width:420px;
    padding:0;
  }
  div.C_small3 {
    min-width:420px; max-width:460px;
  }
    #edit-projlist {
      display:none;
    }
  
  div#workbox { 
    min-width:460px; min-height:480px;
    margin:0; padding:6px 4px 4px 6px;
    border:0;
  }
  div.prodimgedit {
    width:160px; height:90px; vertical-align:top;
  }
    div.prodimgedit img {
      width:160px;
    }
  p.proddescedit {
    display:inline-block; width:260px; margin:0; padding:0;
  } 

  #convert {
    display:none;
  }
    
  div.pthumb {
    width:200px;
  }
    div.pthumb img {
      max-width:192px; height:auto; max-height:96px;
    }
  img.zthumb {
    width:138px;
  }
  div.art img {
    background:none; padding:0;
  }
  #mainphoto {
    height:100%;
  }
  
  br.nb {display:block;}
}
@media all and (orientation:landscape) and (max-width:640px) {
  #pagehead,#menu1 {
    position:absolute;
  }
}