body 
{
    margin: 0;
    font-family:Ubuntu,sans-serif,sans;
}

#projs
{
    padding-top:50px;
    padding-bottom:50px;
    padding-left:20px;
}

#intro
{
    margin:50px;
}

.proj
{
    margin:20px;
    max-width:1320px;
}

.ptitle
{
    font-size:18px;
    font-weight:bold;
    margin-bottom:20px;
}

.proj .pic
{
    width:600px;
    height:400px;
    margin-right:50px;
    margin-bottom:50px;
}

.proj .can3D 
{
    width:600px;
    height:400px;
    margin-right:50px;
    margin-bottom:50px;

    cursor:pointer;
}

.txt
{
    max-width:800px;
}

.tags
{
    color:darkblue;
}

a:link      { text-decoration: none; color:gray; }
a:visited   { text-decoration: none; color:gray; }
a:hover     { text-decoration: none; color:gray; }
a:active    { text-decoration: none; color:gray; }

#headr 
{
    position:fixed;
    top:0px;
    min-height:44px;
    width:100%;
    opacity:0.7;
    z-index:500;
    background-color:black;
}

#hd_title 
{
    position:absolute;
    top:4px;
    color:white;
    font-size:22px;
    text-align:center;
    left:calc(10%);
    width:80%;
    margin:6px;
}

#hd_logo 
{
    position:absolute;
    color:white;
    font-size:22px;
    top:4px;
    text-align:left;
    margin:6px;
}

#hd_menu 
{
    position:absolute;
    color:white;
    font-size:22px;
    right:4px;
    margin:6px;
    cursor:pointer;
}



#proj_list
{
    position:fixed;
    min-width:600px;
    z-index:500;
    left:calc(50% - 300px);
    top:20%;
    padding:4px;
}

#x_close
{
    position:absolute;
    top:8px;
    right:6px;
    font-family:arial;
    font-size:26px;
    font-weight:bold;
    cursor:pointer;
}

.prj
{
    position:absolute;
    width:100%;
    background-color:#dddddd;
    min-height:240px;
    font-size:18px;
}

.prj_nav
{               
    position:absolute;
    width:100%;
    background-color:#dddddd;   
    min-height:240px;
    font-size:18px;

    top:240px;
}

.prj_secn
{               
    position:absolute;
    width:100%;
    background-color:#dddddd;   
    min-height:240px;
    font-size:18px;

    top:480px;
}

.prj_contact
{               
    position:absolute;
    width:100%; 
    background-color:#dddddd;
    min-height:160px;
    font-size:18px;
  
    top:720px;  
}


.prj_hdr
{
}

.prj_title
{
    text-align:center;
    padding-top:8px;
    padding-bottom:8px;

    margin-bottom:8px;

    font-size:22px;
    color:darkblue;
    background-color:#eeeeee;
}

.prj_lhs
{
    position:absolute;
    left:8px;
    width:30%;
}

.proj_img
{
    width:100%;
}

.prj_rhs
{
    display:table;
    position:absolute;
    right:8px;
    width:65%;
}
.prj_row
{
    display:table-row;
    width:100%;
}

.prj_row_spacer
{
    width:100%;
    height:12px;
}

.prj_att
{
    float:left;
    display:table-cell;
    color:#444444;
}

.prj_val
{
    float:right;
    display:table-cell;
}

.prj_compr
{
    position:absolute;
    right:8px;
    bottom:8px;
}

.prj_compr_att
{
    font-size:16px;
    text-align:right;
    color:#444444;
}
.prj_compr_val
{
    font-size:50px;
    font-weight:500;
    text-align:right;
    color:darkblue;
    position:relative;
    top:4px;
}