/* text/css  'eMail_form.css'  used for  3D CAD by william Halversen web_site   
    use with  fullsz+gradient.css , menutopnav.css , & SlideShow_onMouseover.css
    (+X^Nth 20131018+20131025) 
    basedon examples from 
    w3schools.com ; HowtocreateacontactforminHTML[TemplateMonster.com ; 
    CreatingaformwithlabelsinsidetextfieldsusingjQuery[blog_stannard_net_au[2011[01[01 */


/* removed to implement on page / Lightbox_me  (already in css)*/
/*    html, body {*/
/*    margin: 0;*/
/*    padding: 0;*/
/*    }*/

/* moved styles to  form.eMail to implement on page / Lightbox_me */
/*    #form_cntnr{*/
/*      width:86%;*/
/*      height:86%;*/
/*      margin: 0 auto;*/
/*      padding:2.27em;*/
/*      background-color: rgba(0,0,0,0.2);*/
/*      font-family : Helvetica, Arial, 'Liberation Sans', Sans, 'sans-serif';*/
/* WAS font-size:18px; {browser default is 14px -to- 16px} [18/14 = 1.286 ]*/
/*      font-size:1.3em; */
/*      color: #e7e7e7 ; *//* text  #e7e7e7 is off-white */
/*    }*/

/*  "reMOVED back here {when UNremoving "parent-div" from html}" [enables 'another' overlay]*/
/*  #contact_form {*/ /*  "reMOVED back here {when UNremoving "parent-div" from html}" */
/*    display: none; *//* the 'lightbox_me' JS will enable the display *//*  "reMOVED back here {when UNremoving "parent-div" from html}" */
/*  }*/  /*  "reMOVED back here {when UNremoving "parent-div" from html}" */
    form.eMail { 
      /* ToDo change to em unit */
/*Was      width:300px; Was_Originally */
      /* width:22em; was-a-bit-short _ Opera had  input s  "breaking-out" */
      /* should "go around"
         input @ 20.5em + fieldset padding 0.84em *2 (=1.68) + fieldset border (2 px *2 ~= 0.25em)  
         then * 1.3 em _ inputs em sizing   =   29.159 em  30em_way_too_big _neither 28em*/
      /* no_need -to-*_by_1.3 -the-local-font-for-the-form_IS_20.8px  gives_ 22.43em   
         had to add-in-its-own-padding (1em *2) =  24.43em use 25em _ still too big  __ 24em is Still_Too_Big*/
/*wasgood      width:23.5em; */ /* width:23em; -too small | too big_ 23.56  23.62em  24em  */
      /* added width of text div (17em + 0.31em margin*2 = 17.62 + 23.5 = 41.12) */
      /* width:41.12em;  wasok for new text div = 17em  */
      /*was width:39.12em; wasok   until increasing the padding on-text-div from 0.17_to_0.84em*/
      /* 39.12 + 1.34 = 40.36em  subtracted 0.84 padding on left_side-of-div*/
      width:43.24em; /* Changed for Helvetica Was 38.7875em [20210810];  width:39.3em;  is still-a-bit-too-wide   38.8em still-a-schoshe*/
/*Was      padding:10px 20px; Was_Originally */
      padding:0.62em 1em;
/*was      margin: 0 auto; was */
/*wasok      margin: 0.62em auto; wasok */
      margin: 2.72em auto; /*  made top&bottom larger when RE -enabling parent div [to 'push-out' the parent div]*/
/* was   margin: 11vw auto;   was-a-bit_tall    */
      margin: 11vh auto; /*  CSS3 units 'vh' (margin: 8vw auto; is-a-bit_short)*/
      position:relative;
/*      background-color : rgba(0,0,0,0.2); *//* add here & remove on div & fieldset   lookedgood_in_html_page*/
/*      background-color : rgba(192,192,192,0.2);   is_already_on-parent-div */
/*      background-color : rgba(0,0,0,0.27);  MOVED back here {when removing "parent-div" from html} */
/*      background-color : rgba(0,0,0,0.33); reMOVED back here {when UNremoving "parent-div" from html} */
      color: #e7e7e7 ; /* text  #e7e7e7 is off-white */
      /*[20150520]WasOK font-family : Helvetica, Arial, 'Liberation Sans', Sans, 'sans-serif'; added class="texgyreHeros" in file : at_font-face.css  by +X^N   */
      font-size:1.2em; /* changed to 1.2em for Helvetica font was 1.3em [20210810]  */
    }

/* was ok until adding div err
    form.eMail div{ 
    was ok
     added id="LOGO_eMailFm" */
    #LOGO_eMailFm {
/*      background-image : url('pics/Halversen3D_LOGO-silver.png');  wasok_in_html */
      background-image : url('../pics/Halversen3D_LOGO-silver.png');
      background-position : top left;
      /* background-position : 0.13em 0.16em; */
      /*background-size : cover ; want-to-SET_size */
      /* background-size : 45% ; looksok */
      background-size : 6.2em ;
      background-repeat : no-repeat;
      /*background-color : rgba(0,0,0,0.2);  put on form */
      float : left;
      /*    width:17em; is_maybe-a-bit-too-wide   as_is_15em */
      /*was width:14.62em; wasok   until increasing the padding from 0.17_to_0.84*/
      width:16.62em; /* changed to 16.62 for texgyreHeros font [20210810] ; WasOK14.62 + 1.34 = 15.96 */
      margin: 0 auto;
/*      font-size:1.17em; */
      /* padding:0.17em;   looksgood with  h1 = 0.17em & h3 0.27em   */
      /* padding:0.17em 0.84em 0 0;  looks good -the top-of 3D CAD text lines-up with top of fieldset 'line' */
      padding:0.17em 0.56em 0 0; /*  0.84em -subtract-off 0.27em for the <p> margin = 0.57em */
      text-align:right;
    }
/*    form.eMail div h1, h2, h3, p {*/
/*      margin:0.17em; */ /*  margin:0; is-a-bit-too-little */
/*    }*/
/*        form.eMail div h1, 
        form.eMail div h2 {
      margin:0.17em;*/ /*  margin:0; is-a-bit-too-little */
   /* }*/
    form.eMail div h1 {
      margin:0.17em; /*  margin:0; is-a-bit-too-little */
    }
    form.eMail div h2 {
      margin:0.17em; /*  margin:0; is-a-bit-too-little */
      letter-spacing : 0.036em; /* letter-spacing : 0.062em; is a-bit-too-close-to img   0.056em still*/
    }
/*      form.eMail div h3, 
      form.eMail div p {
    margin:0.27em;*/ /*  margin:0.17; is-a-bit-too-little   as_is_0.23em*/
    /*}*/
    form.eMail div h3 {
      margin:0.27em; /*  margin:0.17; is-a-bit-too-little   as_is_0.23em*/
      letter-spacing : 0.036em; /* letter-spacing : 0.056em; is a-bit-too-close-to img */
    }
    form.eMail div p {
      margin:0.27em; /*  margin:0.17; is-a-bit-too-little   as_is_0.23em*/
      padding-top : 0.1em ; /* added for 'Skills' +X^N 20140227 */
      line-height : 156%;
      letter-spacing : 0.06em; /* was 0.17em to-make-a-bit smaller +X^N 20140227 */
      font-size : 0.86em !important; /* Added !important for Helvetica font [20210810] ; to-make-a-bit smaller +X^N 20140227 */
    }
/*    form.eMail div img { put_as_div-bg-img */
/*    margin:0 0.31em; notneeded */
/*    width:6em;*/
/*    height:6em;*/
/*    float:left;*/
/*    }*/
    /* added span id="skil_list_itm-1"       +X^N  20141129 */
    #skil_list_itm-1{letter-spacing: 0.33ch;}

    form fieldset {
      /*background-color: rgba(0,0,0,0.2);  put on form */
      padding:0.21em 0.84em 0.84em;
      margin:0 auto;
      border-width : 0.125em;
/*      border-top-width : 0.125em;*/
/*      border-right-width : 0.132em;*/
/*      border-bottom-width : 0.143em;*/
/*      border-left-width : 0.132em;*/
/*      float : right; aded for extra text div _removed_due_to_"breaking"_the_containing-div */
    }
    form.eMail legend{
      /* WAS 24px {browser default is 14px -to- 16px} [24/14 = 1.714 ]*/
      /* font-size:1.7em; = TooBig em based unit s multiply */
      /* this font setting DOES inherit */
      /* = form.eMail * #form_cntnr * self */
      /* =1em=brwsr=16em *1.3= 20.8 &*1.7=35.36px */
      font-size:1.7em; 
/*      font-weight:bold; *//* maybe remove the bold when making everything bigger */
      padding-left: 0.62em;
      padding-right: 0.62em;
    }

/*    form.eMail {*/
/*      font-size:1em; removed when implementing on page / Lightbox_me  
  - incorporated 1.3em from #form_cntnr (see above form.eMail)*/
/*      }*/

/*    form.eMail input,   see .eMail_input [& form.eMail input { ] */
/*    form.eMail button,   see below */
/*    form.eMail textarea   { see .eMail_input */
/*      font-family : Helvetica, Arial, 'Liberation Sans', Sans, 'sans-serif';   see .eMail_input */
/* WAS font-size:18px; {browser default is 14px -to- 16px} [18/14 = 1.286 ]*/
/*was      font-size:1.2em;   font-size:1.3em; = TooBig em based unit s multiply */
/*      color: #e7e7e7 ;  text  #e7e7e7 is off-white used with a drk bg*/
/*    }   see .eMail_input */
    form.eMail ul {
    	list-style-type:none;
    	padding:0;
    	margin:0;
    }
/*was    form.eMail input {
    	width:280px;
    	padding:5px;
    	margin-bottom:10px;
    } was*/
    .eMail_input {
      /*was width:280px; */ 
      /* ToDo change to em unit */
      /* 280px /14 = 20em */
      width:23.5em; /* [20210814(20150602)]WAS 20.5em changed for texgyreHeros font    by  +X^N   */
/*was      padding:5px; */
      padding:0.351em 0.43em 0.351em 0.46em;
      /*was margin-bottom:10px; */
      margin-bottom:0.62em; /* 10px/14 = 0.7143em */
      background:rgb(250,250,250); /* rgb(250,250,250) is off-WHITE */
      color:#3A3D3E; /* text  #3A3D3E [rgb(58,61,62)] is off-BLACK */
      
      /*[20210813 (20150520)]WasOK font-family : Helvetica, Arial, 'Liberation Sans', Sans, 'sans-serif'; added class="texgyreHeros" in file : at_font-face.css    by +X^Nth   */
/* WAS font-size:18px; {browser default is 14px -to- 16px} [18/14 = 1.286 ]*/
/*was   font-size:1.2em; was font-size:1.3em; = TooBig em based unit s multiply */
      font-size: 1em; /* see_below "seeabove"so remove the 1em here & put onto  class .eMail_input"" */
/*      color: #e7e7e7 ;  text  #e7e7e7 is off-white used with a drk bg*/
      
    }
    
/*      nothing left here "seeabove"so remove the 1em here & put onto  class .eMail_input""*/
/*    form.eMail input {   */
      /* doesNOT inherit "normally" [font-size: 1.6em; =a_bit_too_big]*/
      /* seems like this has to have an em based spec. in order to have the "inheritance" */
      /* font-size: 1.4em; _=_gives_= 29.1167px  with the following: 
          form.eMail 1em * #form_cntnr 1.3em * form.eMail input  1.4em  
            so , should spec. here 1em   in order to have "normal" font-size cascade the css */
              /* font-size: 1em; made this = 20.8 _same_as_ <label> */
                /* but the textarea now is a different size [it does not have any'extra' spec on it]
                   so remove the 1em here & put onto  class .eMail_input */
/*      font-size: 1em;  seeabove"so remove the 1em here & put onto  class .eMail_input" */
/*    }   */
    
    form.eMail ul li { 
      /* begining-of_magic */
      position:relative;
/*    	background-color: rgba(0,0,0,0.2);  {looks a-bit-better on the "whole" fieldset} */
      text-align:left;
    }
    form.eMail label {
      /* ends-up_in-side-of form.login ul li */
      /* rest-of_magic */
      position:absolute;
      /* rest-of_magic */
      top:0.5em; /* [WAS  8px for form.eMail, {font-size:18px; } could_be-a-bit-more when changing to em]*/
      /* rest-of_magic */
      left:0.51em; /* [WAS  9px for form.eMail, {font-size:18px; } could_be-a-bit-more when changing to em]*/
      /* DOES inherit font = 20.8px WithoutExtraSpec = brwser (16px)* form.eMail(1em)=16px * #form_cntnr (1.3em)= 20.8px = isgood*/
      /* text color {slate-blue rgb(203,209,211) (189,194,196) (156,161,162) these are-a-bit-too-lght} */
      color:#626365; /* text  {color:#606162; = (96,97,98) a-bit-too-drk} */
    }
    form.eMail textarea {
      height:6.2em;
      width:25.62em; /*[20210814(20150520)]WAS 20.868em changed for texgyreHeros font   by  +X^N  */
      padding:0.351em 0.062em 0.351em 0.46em; /* similar to form.eMail_input - with less on right _to_ scroll bar */
      overflow-y: scroll;
      resize: none;
    }
    form.eMail button {
/*      padding: 0.22em 0.48em 0.23em 0.46em; *//* padding: 0.351em{was-a-bit-tall} 0.46em;  works with font-size:21px; */
      /*[20210814] WAS  font-family : Helvetica, Arial, 'Liberation Sans', Sans, 'sans-serif'; removed for 'texgyreHeros' in file : at_font-face.css  by   +X^N    */
      /* was font-size:21px; 21/14 = 1.5em */
      /* this font setting DOES inherit */
      /* = form.eMail * #form_cntnr * self */
      /* =1em=brwsr=16em *1.3= 20.8 &*1.5=31.2px =a-bit-too_big*/
      font-size:1.4em; 
      color:#3A3E3D; /* text  #3A3D3E [rgb(58,61,62)] is off-BLACK */
    }
    #eMail_reset {
/*      position:absolute;*/
/*      top:0;*/
/*      left:0;*/
      /* padding: 0.351em{was-a-bit-tall} 0.46em;  works with font-size:21px; */
      /* wasok padding: 0.22em 0.46em 0.23em; */
      padding: 0.17em 0.46em 0.2em; 
    }
    #eMail_submit {
      position:absolute;
      top:0;
      right:0;
      /* padding: 0.351em{was-a-bit-tall} 0.46em;  works with font-size:21px; */
      /* wasok padding: 0.22em 0.48em 0.23em 0.46em; */
      padding: 0.17em 0.486em 0.2em 0.46em; 
      font-style : oblique;
    }
    
    button,html input[type="button"], input[type="reset"], input[type="submit"] {
      -webkit-appearance:button;cursor:pointer
    }
    button, html input[type="button"], input[type="reset"], input[type="submit"]  {
      cursor:pointer;
    }
    
    a.close img {
      width:0.84em;
      position:absolute;
      top:0.62em;
      right:1em;
      padding:0;
      border:0 none;
      margin:0;
      /*background-color : rgba(192,192,192,0.2); */
    }
    /*   was     a.close:hover    nope*/
    /*  a.close img:hover  yup   wasok  removed when enable onmouseover  ,etc */
/*    a.close img:hover {   wasok  removed when enable onmouseover  ,etc */
/*      background-color : rgba(222,222,222,0.333);   wasok  removed when enable onmouseover  ,etc */
/*    }   wasok  removed when enable onmouseover  ,etc */
    
    .eMail_errr {
      display:none;
      position:absolute;
      top:0.47em; /* 0.5em was a-bit-too_low */
      right:0.56em; /* 0.51em was a-bit_too_far-to-the-right */
      color: rgb(168,28,14); /* text  rgb(213,35,17){#d52311} is med_red-org   rgb(168,28,14){#a81c0e}  looks like 'maroon'*/
    }
    #msg_eMailFmEr {
      right:1.62em; /* have to clear the scrollbar  1.33em was_a_little-bit_too-close , 1.23em*/
      }
    
/*  _fini_                                                                             by  +X^N   */