/* STYLE */

body {
    text-align: center;
    font-size: 14px;
    font-family: Arial,Helvetica,sans-serif;
    color: white;
    line-height: 115%;
    background-color:#3b3b3b;
}
img { border: none; }

a {
    color: #b0b0b0;
    text-decoration: none;
    font-weight: bold;
}
a:hover {
    color: #ffffff;
}

a[href ^="mailto:"] {
   padding-right: 14px;
   background: transparent url(../img/mail_back.gif) no-repeat center right;
}

.more {
    text-align: left;
    color: white;
    font-size: 16px;
    position: absolute;
    bottom: 2px;
}
#dialog-contact .more {
    color: black;
}

a[class ="more"] {
   padding-right: 14px;
   background: transparent url(../img/arrow_dash_right.gif) no-repeat center right;
}
a[class ="more"]:hover {
   color: black;
   background: transparent url(../img/arrow_right_bk.gif) no-repeat center right;
}
#dialog-contact a[class ="more"] {
   padding-right: 14px;
   background: transparent url(../img/arrow_dash_right_bk.gif) no-repeat center right;
}
#dialog-contact a[class ="more"]:hover {
   color: white;
   background: transparent url(../img/arrow_right.gif) no-repeat center right;
}
.mobile {
   padding-right: 14px;
   background: transparent url(../img/mobile.gif) no-repeat center right;
}

.wrapper {
    position: relative;
    width: 882px;
    font-size: 0.9em;
    margin: 0 auto -258px;
    text-align: center;
    background: transparent url(../img/tabletmid.png) repeat-y top left;
    overflow: visible;
}

.header {
    height: 258px;
    background: transparent url(../img/tablettop.png) no-repeat top left;
}

.footer {
    position: relative;
    width: 882px;
    margin: 0 auto;
    background: transparent url(../img/tabletbotc.png) no-repeat bottom left;
    text-align: center;
}

#bumps {
    z-index: 1;
    position: absolute;
    width: 800px;
    height: 92%;
    top: 26px;
    left: 39px;
    background: transparent url(../img/tabletbumps.png) repeat top left;
}

#panel {
    z-index: 2;
    position: relative;
    width: 698px;
    height: 149px;
    margin: auto;
    background: transparent url(../img/footer.png) no-repeat top center;
    /* cursor: pointer; */
}

#panel ul {
    list-style-type: none;
    padding: 26px 40px 10px 10px;
    line-height: 150%;
    font-size: 14px;
    font-weight: bold;
    text-align: right;
    color: #b0b0b0;
}

#glyph {
    position: absolute;
    width: 292px;
    height: 303px;
    z-index: 3;
    top: 50px;
    left: 60px;
    background: transparent url(../img/glyphbase.png) no-repeat top left;
}

#segpur, #segpurh, #segpin, #segpinh, #seggre, #seggreh, #segyel, #segyelh {
    position: absolute;
    width: 292px;
    height: 303px;
    top: 0;
    left: 0;
    display:none;
}

#segpurh {
    z-index: 5;
    background: transparent url(../img/glyphpurh.png) no-repeat top left;
}
#segpinh {
    z-index: 5;
    background: transparent url(../img/glyphpinh.png) no-repeat top left;
}
#seggreh {
    z-index: 5;
    background: transparent url(../img/glyphgreh.png) no-repeat top left;
}
#segyelh {
    z-index: 5;
    background: transparent url(../img/glyphyelh.png) no-repeat top left;
}

#segpur, #segpin, #seggre, #segyel {
    z-index: 4;
}

.ui-effects-transfer {
    z-index: 10;
    border: 2px dotted gray;
}

#anim-work, #anim-about, #anim-contact {
    position: absolute;
}
#anim-about {
    width: 57px;
    height: 15px;
    left: 118px;
    top: 42px;
}
#anim-work {
    width: 32px;
    height: 18px;
    left: 170px;
    top: 117px;
}
#anim-contact {
    width: 77px;
    height: 16px;
    left: 111px;
    top: 242px;
}

#dialog-work, #dialog-about, #dialog-contact {
    z-index: 3;
    position: absolute;
    width: 440px;
    height: 277px;
    top: 60px;
    left: 365px;
    text-align: left;
    visibility: hidden;
}

p {
    width:250px;
    text-align: left;
    margin: 0px 0px 14px 20px;
    padding: 0;
}
#dialog-contact p {
    color: #101010;
}
#dialog-about p {
    color: #fceeff;
}
#dialog-work p {
    color: #ffedfa;
}
p[class ="full"] {
    width:450px;
}

h1 {
    text-align: center;
    margin: 12px 0px 14px 0px;
    font-size: 2em;
}
#dialog-contact h1 {
    color: #a06f1f;
}
#dialog-about h1 {
    color: #610139;
}
#dialog-work h1 {
    color: #2b133d;
}

table[class ="contact"] {
    width: 250px;
    margin-left: 18px;
}
td[class ="label"] {
    padding: 0 .5em .5em 0;
    text-align: right;
    vertical-align: text-top;
    color: black;
    font-weight: bold;
}
td[class ="data"] {
    text-align: left;
    color: black;
    font-size: 110%;
    padding: 0 .5em .5em 0;
}
td a {
    color: black;
    text-decoration: none;
    font-weight: normal;
}
td a:hover {
    color: #ffffff;
}

ul {
    padding: 0 150px 5px 32px;
    font-size: 12px;
    line-height: 110%;
}
li {
    margin: 0 0 8px 0;
}

#dialog-contact {
    background: transparent url(../img/frameyel.png) no-repeat top left;
}
#dialog-about {
    background: transparent url(../img/framepin.png) no-repeat top left;
}
#dialog-work {
    background: transparent url(../img/framepur.png) no-repeat top left;
}

#framepin {
    position: absolute;
    z-index: 6;
    top: 50px;
    left: 110px;
    width: 640px;
    height: 300px;
    margin: 2em auto;
    padding: 10px;
    overflow: visible;
    background-color: #af126f;
}
#framegr {
    position: absolute;
    z-index: 6;
    top: 40px;
    left: 70px;
    width: 710px;
    height: 556px;
    margin: 0;
    padding: 10px;
    background-color: #2b2b2b;
    text-align:left;
}

.tl, .tr, .bl, .br, .lf, .rg, .to, .bo {
    position: absolute;
}
.tl, .tr, .to {top: -7px; }
.bl, .br, .bo {bottom: -72px; }
.tl, .bl, .lf {left: -38px; }
.tr, .br, .rg {right: -42px; }

.to {
    background: #2b2b2b url(../img/framgrt.png) repeat-x top left;
    width: 100%;
    height: 72px;
    left: 0;
}
.bo {
    background: #2b2b2b url(../img/framgrb.png) repeat-x bottom left;
    width: 100%;
    height: 72px;
    left: 0;
}
.lf {
    background: #2b2b2b url(../img/framgrl.png) repeat-y top left;
    height: 573px;;
    width: 40px;
    top: 33px;
}
.rg {
    background: #2b2b2b url(../img/framgrr.png) repeat-y top right;
    height: 573px;
    width: 42px;
    top: 33px;
}

.fcol1-about {
    position: relative;
    width: 442px;
    height: 634px;
    top: -21px;;
    left: -30px;
    background-color: transparent;
    margin: 10px 0 0 0;
}
.fcol1-about h1 {
    padding-top:10px;
    color: #e19b29;
}
.fcol2 {
    position:absolute;
    width: 334px;
    height: 634px;;
    top: 0px;;
    right: -30px;
    background: transparent url(../img/framgcontact.png) no-repeat top right;
}
.fcol1-about p {
    color: #ffedfa;
    width: auto;
    line-height: 150%;
    margin: 0 0 10px 0;
}

table[class ="contactfull"] {
    margin: 1em 0 0 0;
    font-size: 125%;
}
table[class ="contactfull"] td[class ="label"] {
    padding: 0 .5em .5em 0;
    text-align: right;
    vertical-align: text-top;
    color: #e19b29;
    font-weight: bold;
    white-space: nowrap;
    line-height: 150%;
}
table[class ="contactfull"] td[class ="data"] {
    text-align: left;
    color: #eee;
    font-size: 110%;
    line-height: 150%;
    padding: 0 .5em .5em 0;
}
table[class ="contactfull"] td[class ="datacap"] {
    text-align: left;
    color: #daeefe;
    font-size: 75%;
    padding: 0 .5em .5em 0;
    line-height: 150%;
}
table[class ="contactfull"] td[class ="data"] a {
    color: white;
    text-decoration: none;
    font-weight: normal;
}
table[class ="contactfull"] td a:hover {
    color: #fecd7e;
}