/* ZNeK's homepage
 * http://www.mulle-kybernetik.com/~znek/
 */

/* @group common */

body {
  font-family:      "HelveticaNeue-Light", Helvetica, Arial, sans-serif;
  background-color: #ffffff;
  margin:           0px;
  padding:          0px;
  color:            #404040;
}

a {
  font-weight:      bold;
  color:            #000000;
  text-decoration:  underline;
}

p {
  margin-left:      10px;
  margin-right:     10px;
  font-size:        13px;
  line-height:      18px;
}

ul {
  margin-left:      0px;
  margin-right:     10px;
  font-size:        12px;
  line-height:      18px;
}

tr {
  vertical-align:   top;
}

div.body {
  font-size:        12px;
  line-height:      20px;
  padding-left:     6px;
  margin:           0px;
}

div.bodyb {
  font-size:        12px;
  line-height:      20px;
  padding-left:     6px;
  margin:           0px;
  font-weight:      bold;
}

div.bodyf {
  font-size:        9px;
  line-height:      12px;
  padding-left:     6px;
  margin:           0px;
}

div.body2 {
  font-size:        9px;
  line-height:      14px;
  padding-left:     6px;
}

.float-left {
  float:            left;
  margin-right:     5px;
}

.float-right {
  float:            right;
  margin-left:      5px;
}

.centered {
  text-align:       center;
}

.subtext {
	font-size:      9px;
	line-height:    11px;
  margin-bottom:    10px;
}

.photo {
  border-width:     1px;
  border-color:     #000000;
  border-style:     solid;
  margin-bottom:    2px;
}

.polaroid {
  -webkit-transition: -webkit-transform .15s linear;
  -moz-transition: -moz-transform .15s linear;
  transition: transform .15s linear;

  -webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25);
  -moz-box-shadow: 0 3px 6px rgba(0,0,0,.25);
  box-shadow: 0 3px 6px rgba(0,0,0,.25);
  font-size: 12px;
  vertical-align: middle;
  text-align:     center;
}

.polaroid1 {
	-webkit-transform: rotate(-2deg);
	-moz-transform: rotate(-2deg);
	transform: rotate(-2deg);
}

.polaroid2 {
	position: relative;
	top: 3px;
	left: -5px;
	-webkit-transform: rotate(5deg);
	-moz-transform: rotate(5deg);
	transform: rotate(5deg);
}

.polaroid img {
	display: block;
	border: 8px solid white;
}

div.content {
  margin:           0px;
  padding:          0px;
  background-color: #ffffff;
}

div.block {
  margin:           10px;
}


p.smallprint {
  font-size:        10px;
  line-height:      13px;
  white-space:      pre;
  font-family:      monaco,'Courier New',courier,monospace;
}

h1 {
  margin:           0px;

  padding-top:      6px;
  padding-bottom:   6px;
  padding-left:     16px;
  padding-right:    16px;

  font-weight:      bold;
  font-size:        18px;
  line-height:      20px;

  color:            #ffffff;
  background-color: #8a8a8a;
  border-top:       1px solid #666666;
  border-bottom:    1px solid #666666;
  text-shadow:      #383838 1px 1px 6px;
}

h2 {
  margin-left:      10px;
  margin-right:     10px;
  margin-top:       16px;
  margin-bottom:    14px;

  padding-top:      6px;
  padding-bottom:   6px;
  padding-left:     6px;
  padding-right:    6px;

  font-weight:      bold;
  font-size:        15px;
  line-height:      15px;

  color:            #ffffff;
  background-color: #8a8a8a;
  border-top:       1px solid #666666;
  border-bottom:    1px solid #666666;
  text-shadow:      #383838 1px 1px 4px;
  clear:            both;
}

h3 {
  margin-left:      12px;
  margin-right:     12px;
  margin-top:       16px;
  margin-bottom:    14px;

  padding-top:      6px;
  padding-bottom:   6px;
  padding-left:     6px;
  padding-right:    6px;

  font-weight:      bold;
  font-size:        13px;
  line-height:      15px;

  color:            #4a4a4a;
  background-color: #ffffff;
  border-top:       1px solid #666666;
  border-bottom:    1px solid #666666;
  text-shadow:      #cccccc 1px 1px 4px;
  clear:            both;
}

/*  real neato eye candy
 *  see: http://www.ploughdeep.com/onionskin/
 */

.wrap1, .wrap2, .wrap3 {
  display:inline-table;
  /* \*/display:block;/**/
  }
.wrap1 {
  float:left;
  background:url(v3/shadow.gif) right bottom no-repeat;
}
.wrap2 {
  background:url(v3/corner_bl.gif) -12px 100% no-repeat;
}
.wrap3 {
  padding:0 9px 9px 0;
  background:url(v3/corner_tr.gif) 100% -12px no-repeat;
}

.wrap3 img {
  display:block;
  border:1px solid #cccccc;
  border-color:#efefef #ccc #ccc #efefef;
/*	border-color:#000000;*/
}

@font-face {
  font-family: "Press Start 2P";
  font-style: normal;
  font-weight: 400;
  src: local('Press Start 2P'), local('PressStart2P-Regular'), url(/znek/ofs/pressstart2p.ttf) format('truetype');
}

.term {
  /* font-family: "Press Start 2P", monaco, "Courier New", courier, monospace; */
  font-family: monaco, "Courier New", courier, monospace;
  background: #111111;
  color: #00cc00;
  margin: 10px;
  padding: 10px;
  border-radius: 4px 4px 4px 4px;
  -webkit-border-radius: 4px 4px 4px 4px;
  -moz-border-radius: 4px 4px 4px 4px;
  white-space: pre-wrap;
}

/* @end */

/* @group jabber */

table.jabberstatus {
  background-color:#000000;
  background: url(JabberStatusViewDark71.png) repeat-x;
  color:#f8f8f8;
  width: 100%;
}

a.jabberstatus {
  font-weight:      bold;
  color:            #f8f8f8;
  text-decoration:  none;
  text-shadow:      #999 0 0 6px;
}

a:hover.jabberstatus {
  text-decoration:  underline;
}

.jid {
	font-weight:    bold;
	font-size:      20px;
}

.status {
	font-size:      14px;
	text-shadow:    #999 0 0 6px;
}

.userimage {
	display: block;
	border: 4px solid white;
        width:  64px;
        height: 64px;
	-webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25);
	-moz-box-shadow: 0 3px 6px rgba(0,0,0,.25);
	box-shadow: 0 3px 6px rgba(0,0,0,.25);
}

.statusimagecell {
  vertical-align: middle;
  text-align:     center;
  width:          16px;
}

.statuscell {
  vertical-align: middle;
  text-align:     left;
  width:          100%;
}

.capabilitiescell {
  vertical-align: middle;
  text-align:     right;
  width:          26px;
}

.userimagecell {
	background: white;
	vertical-align: top;
	text-align:     center;
	-webkit-transform: rotate(2deg);
	-moz-transform: rotate(2deg);
	transform: rotate(2deg);

	-webkit-transition: -webkit-transform .15s linear;
	-moz-transition: -moz-transform .15s linear;
	transition: transform .15s linear;
}

tr.odd {
  background-color: #ffffff;
}
tr.even {
  background-color: #edf3fe;
}

/* @end */

/* @group navigation */

div.navbar {
  padding-top:       10px;
  padding-bottom:    10px;
  border-top:        1px solid #ffffff;
  border-bottom:     1px solid #c8c8c8;

  background-color: #ffffff;

  text-align:       center;
  font-weight: normal;
  color:       #c8c8c8;
  text-shadow: #aaaaaa 0 0 3px;
}

div.navbar span {
  margin-left: 10px;
}

span.selected {
  font-weight:      bold;
  color:            #000000;
  margin-left: 0px;
}

div.navbar a {
  color:           #000000;
  font-weight:     normal;
  text-decoration: none;
}

div.navbar a:hover {
  font-weight: normal;
}

/* @end */

/* @group blog */

/*div.blog {
  display: block;
}*/

#blog img {
  border: none;
}

.chatTimestamp {
	font-family: Myriad, 'Lucida Grande', Arial;
	font-size: 10px;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	line-height: normal;
	color: #6d6d6d;
	padding-top: 10px;
}
.chatBubble {
	padding: 10px;
	margin: 0px;
	margin-left: 20px;
	margin-right: 20px;
	border-radius: 10px 10px 10px 10px;
	box-shadow: 2px 2px 4px #cccccc;

	-webkit-border-top-left-radius:     10px 10px;
	-webkit-border-top-right-radius:    10px 10px;
	-webkit-border-bottom-left-radius:  10px 10px;
	-webkit-border-bottom-right-radius: 10px 10px;
	-webkit-box-shadow: 2px 2px 4px #cccccc;

	-moz-border-radius: 10px 10px 10px 10px;
	-moz-box-shadow: 2px 2px 4px #cccccc;

	font-family: Myriad, 'Lucida Grande', Arial;
	font-size: 12px;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	line-height: normal;
	position:relative;
}

.greenChatBubble {
	border: 2px solid #bfdc83;
	background-color: #f5fbe8;

}
.greenChatBubbleLeftArrowBorder {
	border-color: transparent #bfdc83 transparent transparent !important;
}
.greenChatBubbleLeftArrow {
	border-color: transparent #f5fbe8 transparent transparent !important;
}
.greenChatBubbleRightArrowBorder {
	border-color: transparent transparent transparent #bfdc83 !important;
}
.greenChatBubbleRightArrow {
	border-color: transparent transparent transparent #f5fbe8 !important;
}
.blueChatBubble {
	border: 2px solid #83a7dc;
	background-color: #e8fafb;
}
.blueChatBubbleLeftArrowBorder {
  	border-color: transparent #83a7dc transparent transparent !important;
}
.blueChatBubbleLeftArrow {
  	border-color: transparent #e8fafb transparent transparent !important;
}
.blueChatBubbleRightArrowBorder {
  	border-color: transparent transparent transparent #83a7dc !important;
}
.blueChatBubbleRightArrow {
  	border-color: transparent transparent transparent #e8fafb !important;
}
.yellowChatBubble {
	border: 2px solid #dcda52;
	background-color: #f8fbc1;
}
.yellowChatBubbleLeftArrowBorder {
  	border-color: transparent #dcda52 transparent transparent !important;
}
.yellowChatBubbleLeftArrow {
  	border-color: transparent #f8fbc1 transparent transparent !important;
}
.yellowChatBubbleRightArrowBorder {
  	border-color: transparent transparent transparent #dcda52 !important;
}
.yellowChatBubbleRightArrow {
  	border-color: transparent transparent transparent #f8fbc1 !important;
}
.redChatBubble {
	border: 2px solid #e98a2c;
	background-color: #f7d6a9;
}
.redChatBubbleLeftArrowBorder {
  	border-color: transparent #e98a2c transparent transparent !important;
}
.redChatBubbleLeftArrow {
  	border-color: transparent #f7d6a9 transparent transparent !important;
}
.redChatBubbleRightArrowBorder {
  	border-color: transparent transparent transparent #e98a2c !important;
}
.redChatBubbleRightArrow {
  	border-color: transparent transparent transparent #f7d6a9 !important;
}

.chatBubbleLeftArrowBorder {
  	border-color: transparent #eeeeee transparent transparent;
	border-style: solid;
	border-width: 8px;
	height:       0px;
	width:        0px;
	position:     absolute;
	top:          10px;
	left:        -16px;
}

.chatBubbleLeftArrow {
  	border-color: transparent #ffffff transparent transparent;
	border-style: solid;
	border-width: 8px;
	height:       0px;
	width:        0px;
	position:     absolute;
	top:          10px;
	left:        -13px;
}

.chatBubbleRightArrowBorder {
  	border-color: transparent transparent transparent #000000 ;
	border-style: solid;
	border-width: 8px;
	height:       0px;
	width:        0px;
	position:     absolute;
	top:          10px;
	right:        -18px;
}

.chatBubbleRightArrow {
  	border-color: transparent transparent transparent #ffffff;
	border-style: solid;
	border-width: 8px;
	height:       0px;
	width:        0px;
	position:     absolute;
	top:          10px;
	right:        -15px;
}

/* @end */

/* @group jargon */

div.autocomplete {
  position:absolute;
  width:250px;
  background-color:white;
  border:1px solid #888;
  margin:0px;
  padding:0px;
}
div.autocomplete ul {
  list-style-type:none;
  margin:0px;
  padding:0px;
}
div.autocomplete ul li.selected {
  background-color: #ffb;
}
div.autocomplete ul li {
  list-style-type:none;
  display:block;
  margin:0;
  padding:2px;
  height:32px;
  cursor:pointer;
}

/* @end */

/* @group specs */

.specs {
  margin: 0px 6px 6px 6px;
  padding:          6px;

  color: #bcbcbc;
  background-color: #222;
  border-width:     1px;
  border-color:     #666666;
  border-style:     solid;
  display: inline-block;
}

.specs td {
	color: #bcbcbc;
	font-size: 13px;
}

div.specs a {
  color: #eeeeee;
}

/* @end */

.postit {
  background-color: yellow;
}

.postit h1 {
  color: black;
  background-color: yellow;
}

div.postit {
  border: 1px solid black;
/*
  -webkit-transform: rotate(1deg);
  -moz-transform: rotate(1deg);
  transform: rotate(1deg);
*/
}

/* @group events */

table.events {
  margin-left:  10px;
  clear:        both;
}

table.events p {
  padding: 0px;
  margin:  0px;
}

table.events tr {
  vertical-align: top;
}

table.events td {
  text-align: left;
  font-size:  12px;
  padding-left:   4px;
  padding-right:  4px;
  padding-top:    4px;
  padding-bottom: 4px;
  border-bottom: 1px dashed #c8c8c8;
}

/* @end */

/* @group fortune */

.fortune {
}

div.fortune {
  font-size:  10px;
  white-space: pre;
}

td.fortune {
  font-size:  10px;
  white-space: pre;
}

a.fortune {
  font-size:  10px;
}

/* @end */

/* @group contacts */

#contact div {
  text-align: center;
  vertical-align: middle;
}

.contact {
  font-size: 12px;
}

a.card {
  text-decoration: none;
  font-weight: normal;
}

img.contact {
  width:  64px;
  height: 64px;
}

.title {
  font-size:   16px;
  font-weight: bold;
}

.nickname {
  font-weight: bold;
}

table.contact {
  padding: 0px;
  margin:  0px;
/*  border: 1px solid #c8c8c8; */
}

table.contact tr {
  padding: 0px;
  padding-bottom: 5px;
  vertical-align: top;
}

table.contact th {
  padding: 0px;
  margin: 0px;
  background-image: url("TableHeaderBackgroundInactive16.png");
  background-repeat: repeat-x;
  color: #000000;
  text-align: center;
  vertical-align: middle;
  font-size: 11px;
  font-weight: normal;
  height: 16px;
  border-top:    1px solid #a0a0a0;
  border-left:   1px solid #c8c8c8;
  border-right:  1px solid #c8c8c8;
  border-bottom: 1px solid #c8c8c8;
}

table.contact td.labelColumn {
  color: gray;
  text-align: right;
  text-transform: lowercase;
  font-weight: bold;
}

table.contact td.dataColumn {
  text-align: left;
}

table.contact tr.delimiter {
  border-top: 1px solid #000000;
}

/* @end */

/* @group footer */

div.footer {
  font-family:      Lucida Grande, Arial, Geneva, sans-serif;
  font-weight:      bold;
  font-size:        9px;
  line-height:      4px;
  margin-bottom:    4px;
  padding:          6px;
  background-color: #000000;
  color:            #f8f8f8;
}

div.footer a {
  color: #f8f8f8;
}

/* @end */