#content-wrapper { overflow: hidden; } /* Avoid double scroll bars */
  
  /* General element settings */
  #content h2 {
  	font-weight: bold;
  	clear: both;
  }
  #content li { cursor: default; }

  #contactsHeader input[type=checkbox] {
  	position: absolute;
  	top: 18px;
  	left: 18px;

  }
  #content input[type=radio] { 
  	width: 12px; height: 12px; 
  	-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; 
  }

  
  #contact ::-moz-placeholder, #contact input:-moz-placeholder, #contact input[placeholder], #contact input:placeholder, #contact input:-ms-input-placeholder, #contact input::-webkit-input-placeholder, #contact input:-moz-placeholder {
  	color: #bbb; 
  	text-overflow: ellipsis;
  }

  #contact input:not([type=checkbox]), #contact select:not(.button), #contact textarea {

  	float: left;

  }
  #contact .label {
  	float: right !important;
  }
  #contact .parameter {
  	float: right !important;

  }
  #contact input[type="button"]:hover, #contact select:hover, #contact select:focus, #contact select:active, #contact input[type="button"]:focus, #contact .button:hover, button:hover { background-color:#fff; color:#333; }
  
  #contact fieldset, #contact div, #contact span, #contact section {
  	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; 
  }
  #contact fieldset.editor {

  	padding: 0;
  	margin-left: 110px;

  }

  #contact fieldset.adr {
  	margin-left: 0;
  }
  #contact input:invalid, #contact input:hover:not([type=checkbox]), #contact input:active:not([type=checkbox]), #contact input:focus:not([type=checkbox]), #contact input.active, #contact textarea:focus, #contact textarea {
  	float: left;

  }
  
  /* Left content */
  
  #shareWithList .cruds {
  	display: inline;
  }
  
  #shareWithList li {
  	border-bottom: 1px solid silver;
  }

  #app-navigation a.unshare {
  	float: right;
  }
  
  /*#app-navigation img.shared { float: right; opacity: 0.4; margin: 0 .5em; }
  #app-navigation img.shared:hover { opacity: 1; }*/
  #app-navigation input[type="text"] {

  	width: 180px;

  }
  
  #app-navigation .utils {
      bottom: 0; right: 0;
      top: 0;
  	position: absolute;
  	padding: 0; margin: 0;
  }

  #app-navigation .active {
  	font-weight: bold;
  }
  #app-navigation li > .utils > *:not(.numcontacts):not(.starred) {

  	display: none;
  }
  #app-navigation li > .utils > * {
  	line-height: 44px;
  	width: 44px; height: 44px;
  	background-size: auto;

  	float: left;

  }
  #app-navigation li.active[data-type="category"] > .utils > * {
  	display: inline-block;
  	float: left;

  	background-color: rgba(0,0,0,0);

  }
  #app-navigation li > .utils > .numcontacts {
  	padding-right: 5px;
  	text-align: right;
  }

  #grouplist {
  	/*z-index: 100;*/
  }

  #grouplist .oc-addnew-init {

  	padding: 0 31px;

  }
  #grouplist .add-contact:before {

  	position: absolute;

  	content: '+';
  	font-weight: bold;

  	font-size: 150%;
  	left: 12px;
  }
  #grouplist .add-contact {
  	padding: 0 31px;

  }
  #grouplist > li {
  	height: 44px;
  }

  .hidden-on-load {
  	display: none;
  }

  /* First run */
  
  #firstrun {
  	 height: 100%;
  }
  #firstrun > div {
  	position:relative;
  	left:50%; top:40%;
  	width: 80%;
  	transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%);
  	color:white; font-weight:bold; text-align: center; color: #777;
  }
  #firstrun li { font-size:1.5em; text-align: center; margin-bottom: 1em; }
  #firstrun p { font-size:1.2em; text-align:center; }
  #firstrun #selections { font-size:0.8em; margin: 2em auto auto auto; clear: both; }
  
  #contact textarea {

  	margin-left: 110px;
  	min-height: 5em;
  	min-width: 300px;
  	font-family: inherit;
  }
  #contact header {
  	margin-top: 8px;

  }
  #contact footer {

  	float: left;

  	width: 100%;

  	margin-bottom: 8px;
  	padding-left: 110px;

  }

  #contact footer .action {
  	height: 30px;
  }
  #contact footer .add {
  	width: 300px;
  }
  #contact footer .cancel, #contact footer .close, #contact footer .export, #contact header .delete {
  	float: right;
  	background-image: none;
  }
  #contact footer a, #contact header a {
  	float: right;
  	opacity: .5;
  	font-weight: bold;
  }
  #contact footer a {
  	padding: 8px 17px 8px 0;
  }
  #contact header a {
  	padding: 8px 17px 0 0;
  }
  #contact footer a:hover, #contact header a:hover {

  	opacity: 1;
  }

  #contact footer .close img, #contact footer .export img, #contact header .delete img, #contact footer .cancel img {
  	vertical-align: middle;
  	margin-bottom: 2px;
  	margin-bottom: 2px;
  }
  #contact footer > *, #contact header > * {

  	display: inline-block;

  	float: left;
  	opacity: 1;

  }

  #contact input[type=checkbox] { margin-top: 11px; margin-right: 4px; vertical-align: bottom; float: left; }

  /*dl.form { display: block; width: auto; margin: 0; padding: 0; cursor: normal; }*/
  .form dt { display: inline-block; clear: left; float: left; width: 7em; margin: 0; padding: 0.8em 0.5em 0 0; text-align:right; text-overflow:ellipsis; o-text-overflow: ellipsis; vertical-align: text-bottom; color: #bbb;/* white-space: pre-wrap; white-space: -moz-pre-wrap !important; white-space: -pre-wrap; white-space: -o-pre-wrap;*/ }
  .form dd { display: inline-block; clear: right; float: left; margin: 0; padding: 0; white-space: nowrap; vertical-align: text-bottom; }
  
  /* override the default margin on share dropdown */
  #dropdown {
  	margin: 0; padding: 0;
  	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  	width: 100%;
  }
  #shareWithList {
  	width: 100%;
  }
  #shareWithList .cruds > label {
  	display: list-item;
  }
  /* reset box-sizing for multiSelect */
  #content div.multiselect, #content div.multiselect > * { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; }
  
  /* Reset values for jquery.multiselect */
  .ui-multiselect-checkboxes {
      overflow-y: auto;
  	height: auto !important;
  	max-height: 200px;
  }
  .ui-multiselect-checkboxes label {
  	width: 100%; color: #333 !important; font-size: 100% !important;
  	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  }
  .ui-multiselect-checkboxes label > span {color: #333 !important; font-size: 100% !important; }

  .ui-multiselect-checkboxes input[type=checkbox] { margin: 3px !important; }
  button.ui-multiselect { width: 300px !important; padding: 6px 0 0 6px; height: 30px; font-weight: normal; } /* No idea why this is needed? */
  span.ui-icon { margin: 1px 3px 10px 0px; }
  
  /* Use jquery-ui.datepickers own styling */
  .ui-datepicker-title > select {
  	background-color: inherit;
  	color: inherit;
  	border: none;
  }

  
  #content .multiselectoptions > li > * { 
  	-webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; 
  	color: #888888; 
  	display: block;
  	margin: 0; padding: .2em;
  }

  [class^="icon-"], [class*=" icon-"], .action, .icon {

  	cursor: pointer;
  	background-repeat: no-repeat;
  }

  .action:not(.text), .icon:not(.text), [class^="icon-"]:not(.text), [class*=" icon-"]:not(.text) {
  	width: 16px; height: 16px;
  	padding: 0; margin: 0;
  	display: inline-block;

  }

  .action:not(.add):not(.sort).text, .icon:not(.add):not(.sort).text, [class^="icon-"]:not(.add):not(.sort).text, [class*=" icon-"]:not(.add):not(.sort).text {

  	background-position: left; 
  	text-indent: 18px;
  }

  .svg .action.text, .svg .icon.text, .svg .svg.text {
  	background-size: 16px 16px;
  	background-origin: content-box;
  	background-repeat: no-repeat;
  	width: auto; height: auto;
  }

  
  .transparent{ opacity: 0.6; }
  .float { float: left; display: inline-block; width: auto; }
  .float.right { float: right; }
  .break { clear: both; }

  .control {
      border: 1px solid #DDDDDD;
      border-radius: 0.3em;
      color: #555;
      cursor: pointer;
      font-weight: bold;
  	font-size: 1em;
  	width: auto;
  }
  .control > * { background: none repeat scroll 0 0 #F8F8F8; color: #555 !important; font-size: 100%; margin: 0px; }
  
  .dim {
  	opacity: .50;filter:Alpha(Opacity=50);
  	z-index: 0;
  }
  
  .ui-draggable { height: 3em; z-index: 1; }
  .ui-dialog { z-index: 102; }
  .dragContact {
  	cursor: move;
  	background-repeat: no-repeat !important;
  	background-position: .3em .3em !important;
  	background-color: #fff;
  	width: 200px; height: 30px;
  	text-indent: 30px;
  	font-weight: bold;
  	border: thin solid silver; border-radius: 3px;
  	padding: 3px;
  	z-index: 1000;
  	transition: background-image 500ms ease 0s;
  }
  .ui-state-hover { border: 1px solid dashed; z-index: 1; }
  
  /* Properties */

  .propertyname {
  	width: 110px;
  	padding-right: 7px;
  	margin-top: 1px;
  	font-weight: bold;
  	text-align: right;
  }
  .singleproperties { float: left; width: 100%; }
  .singleproperties .fullname { float: none !important; width: 300px; font-size: 20px; }
  .singleproperties input { width: 300px; }
  .singleproperties dd { float:left; }
  .singleproperties dd .listactions a { margin-top: 10px; }

  .singleproperties .n.editor { width: 270px; padding: 3px; }

  .singleproperties .n.editor input { width: 292px; margin-left: 12px; }

  .singleproperties .propertycontainer input.value.new { border: 3px solid #1d2d44;}
  .singleproperties .propertycontainer input.value.error { border: 3px solid red;}

  .singleproperties .propertycontainer .action {

  	opacity: 0;
  }

  .singleproperties .groupscontainer { float:left; display: inline; }

  .singleproperties .propertycontainer:hover .action { opacity: 1; }
  .singleproperties dl { width: 280px;}

  .singleproperties > a { margin-top: 10px !important; }

  .parameters {
  	width: 110px;

  	float: left; 
  	text-align: right; 
  	box-sizing: border-box;
  	display: inline-block;
  }

  .parameters select {
  	-webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      padding: 0;
      border: none;
  	background-color: white;
  }
  .parameters input[type=text] {
  	padding-left: 0;
  }

  
  div.email li .parameters .label, div.url li .parameters .label { margin-top: 7px !important; }
  div.tel li .parameters .label { margin-top: 6px !important; margin-bottom: 4px; }
  div.url li .parameters .label, div.impp li .parameters .label { margin-top: 6px !important; }
  div.tel li input, div.url li input { margin-left: 3px; font-size: 1em; }
  div.impp li .select_wrapper select { margin-top: 6px; }

  ul.propertylist { width: 100%; line-height: 34px; }

  .propertylist li.propertycontainer { white-space: nowrap; min-width: 38em; display: block; clear: both; }
  .propertylist li.propertycontainer > .listactions { 
  	display: inline-block; 
  	clear: none; opacity: 0; 
  }
  .propertylist li.propertycontainer:hover > .listactions { opacity: 1; }

  .singleproperties .propertycontainer .listactions a, .propertylist li.propertycontainer .listactions a {

  	display: inline-block; 
  	clear: none; 
  	width: 16px; height: 16px; 

  	vertical-align: middle;

  }
  
  .propertylist { float: left; }
  /*.propertylist li > a { display: block; }}*/

  .propertylist li > input[type=checkbox],input[type="radio"] { display: inline-block; }
  .propertylist input.value:not([type=checkbox]) { width: 300px; display: inline-block; }
  .propertylist input.value:not([type=checkbox]).error { border: 2px solid red;}

  .propertylist li > select { float: left; max-width: 8em; }
  .select_wrapper { float: left; overflow: hidden; color: #bbb; font-size: 0.8em; }
  .select_wrapper select { float: left; overflow: hidden; text-overflow: ellipsis; color: #bbb; width: 8em; }

  .select_wrapper select option { color: #777; }
  .select_wrapper select:hover,.propertylist li > select:focus,.propertylist li > select:active { color: #777; }
  .select_wrapper select.rtl { margin-left: -24px; text-align: right; }
  .select_wrapper select.ltr { margin-right: -23px; }

  .propertylist li > input[type=checkbox].impp { clear: none; }

  .propertylist li > label.xab { display: block; color: #bbb; float:left; clear: both; padding: 0.5em 0 0 2.5em; }
  .propertylist li > label.xab:hover { color: #777; }
  #contact label, #contact dt, #contact th, #contact .label {
  	float: left; 

  	font-size: 100%; font-weight: bold; 

  	color: #bbb !important; 
  	border: 0; 
  	display: inline-block;
  	box-sizing: border-box;
  	-moz-box-sizing: border-box;
  }
  #contact label:hover, #contact dt:hover, #contact input.label:hover { color: #777 !important; }

  #contact input.label:hover, #contact input.label:active { border: 0 none !important; border-radius: 0; cursor: pointer; }
  dt[data-element="nickname"], dt[data-element="bday"], dt[data-element="title"] { margin-top: 5px; }
  dt[data-element="org"] { margin-top: 4px; }
  
  .typelist[type="button"] { float: left; max-width: 8em; border: 0; background-color: #fff; color: #bbb; box-shadow: none; } /* for multiselect */
  .typelist[type="button"]:hover { color: #777; } /* for multiselect */
  .addresslist { clear: both; font-weight: bold; }

  /* Overrule default jQuery multiselect style */
  .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
  	background: 0;
  	border-radius: 3px;
  }

  /* Help section */
  
  #ninjahelp { position: relative; bottom: 0; left: 0; right: 0; padding: 1em; margin: 1em; opacity: 0.9; }
  #ninjahelp .close { position: absolute; top: 5px; right: 5px; height: 20px; width: 20px; }
  #ninjahelp h2, .help-section h3 { width: 100%; font-weight: bold; text-align: center; }
  #ninjahelp h2 { font-size: 1.4em; }
  .help-section { width: 45%; min-width: 35em; float: left; }
  .help-section h3 { font-size: 1.2em; }
  .help-section dl { width: 100%; float: left; clear: right; margin: 0; padding: 0; cursor: normal; }
  .help-section dt { display: table-cell; clear: left; float: left; width: 35%; margin: 0; padding: 0.2em; text-align: right; text-overflow: ellipsis; vertical-align: text-bottom; font-weight: bold; }
  .help-section dd { display: table-cell; clear: right; float: left; margin: 0; padding: 0.2em; white-space: nowrap; vertical-align: text-bottom; }
  
  /* Settings */
  
  .contacts-settings dl { width: 100%; }
  .addressbooks-settings table { width: 100%; }
  .addressbooks-settings .actions { width: 100%; white-space: nowrap; }
  .addressbooks-settings .actions * { float: left; }
  .addressbooks-settings .actions input.name { width: 5em; }
  .addressbooks-settings .actions input.name { width: 7em; }
  .addressbooks-settings a.action { opacity: 0.5; }
  .addressbooks-settings a.action:hover { opacity: 1; }
  .addressbooks-settings td.active, .addressbooks-settings td.action { width: 20px; }

  .addressbooklist .actions {
  	position: absolute; right: 0px;
  	display: inline-flex;

  }

  .addressbooklist .actions > a { width: 20px; height: 20px; }
  .addressbooklist > li > div {
  	display: inline-block;
  	clear: both;
  }
  
  #app-settings-content {
  	overflow-x: hidden;
  	overflow-y: auto;
  }
  
  /* Single elements */
  #file_upload_form, #file_upload_target, #import_upload_target, #crop_target { display:none; }
  #import_upload_start, .import-upload-button {

      width: 30px !important; height: 30px !important;

  	display:block;
  	position: absolute;
  	right: 0; top: 0;

  	margin: 5px !important;

  	cursor: pointer;
  }
  #import_upload_start {
  	cursor: pointer;
  	z-index: 1001;
  }
  .import-upload-button {

      background-position: center center;
      background-repeat: no-repeat;

  	border: none;

      cursor: pointer;
      z-index: 100;
  }
  
  .import-upload, .import-status {

  	height: 40px;

  }
  .import-upload select {
  	width: 80%; height: 30px;
  	margin: 5px;
  }
  .import-status {
  	display: none;
  }
  #import-status-text {
  	white-space: nowrap;
  	overflow: hidden;
  }

  input:not([type=checkbox]).propertytype { 
  	float: right;
  	font-size: .8em; 
  	max-width: 80px; 

  	text-align: right; 
  	margin: 0;

  	padding-top: 8px;

  }

  input[type=checkbox].propertytype { width: 10px; }

  .contactphoto { 

  	border: 1px solid #bbb; border-radius: 3px;
  	-moz-box-shadow: 0 1px 2px #777; -webkit-box-shadow: 0 1px 2px #777; box-shadow: 0 1px 2px #777;

  }
  .contactphoto:hover { background: #fff; cursor: default; }
  #photowrapper { 

  	position: absolute;

  	float: left; 

  	width: 180px; height: 180px;
  	margin-top: 10px;
  	margin-left: -145px;

  }
  
  #photowrapper .favorite {
  	display: inline-block;
  	float: right;
  	position: absolute;
  	right: -6px; top: -6px;
  	width: 25px; height: 25px;
  }

  #photowrapper.wait { opacity: 0.6; filter:alpha(opacity=0.6); z-index:1000; cursor: wait; }
  #phototools {
  	position:absolute;
  	bottom: 10px;
  	margin: 0;
  	width:auto; height: auto;
  	background-color:#fff;
  	list-style-type:none; border-radius: 3px;
  	border: 1px solid #DDDDDD;
  	/*-moz-box-shadow: 0 1px 2px #777; -webkit-box-shadow: 0 1px 2px #777; box-shadow: 0 1px 2px #777;*/
  }
  #phototools li { display: inline-block; }
  #phototools li a {
  	float:left;
  	opacity: 0.6;
  	width: 40px; height: 40px;
  	background-position: center;
  	background-size: 80%;
  }

  #phototools li a:hover { opacity: 0.8; }
  #contactphoto_fileupload, #import_upload_start { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter:alpha(opacity=0); opacity:0; z-index:1001; }
  
  #dialog-merge-contacts .mergelist {
  	margin: 10px;
  }
  #dialog-merge-contacts .mergelist > li {
  	height: 30px;
  	-webkit-transition:background-image 500ms; -moz-transition:background-image 500ms; -o-transition:background-image 500ms;  transition:background-image 500ms;
  	position:relative;
  	background-position: 0 .2em !important; background-repeat:no-repeat !important;
  }
  #dialog-merge-contacts .mergelist > li > input {
  	opacity: 0;
  }
  #dialog-merge-contacts .mergelist > li > input:hover, #dialog-merge-contacts .mergelist > li > input:checked {
  	opacity: 1;
  }
  #dialog-merge-contacts .mergelist > li > label {
  	padding-left: 20px;
  	font-weight: normal;
  }

  .no-svg .favorite { display: inline-block; float: left; height: 20px; width: 20px;  }

  .svg .favorite { display: inline-block; float: left; height: 20px; width: 20px; background-size:contain; }

  
  /* Contact layout */

  #contact > ul > li { white-space: nowrap; margin-right: 110px; }

  #contact > ul.propertylist {
  	font-size: 10px;
  	/*display: table;
  	border-spacing: 1em;
  	border: thin solid black;*/
  }
  #contact > ul.propertylist > li {
  	display: inline-block;
  	padding: 1em;
  	/*display: table-cell;*/
  }
  
  .display .meta { text-align: right; margin-left: -30px; }

  .display .adr {
  	padding-left: 5px;
  	padding-right: 5px;
  	cursor: pointer;
  	border: 1px solid rgb(221, 221, 221);
  	border-radius: 3px;
  	line-height: 28px;
  }

  .adr.editor {
  	width: 20em;
  	margin-left: 120px;
  }
  .adr.editor ul {
  	-moz-column-count: 1;
  	-webkit-columns: 1;
  	-o-columns: 1;
  	columns: 1;
  }
  fieldset.adr ul li input.label { margin-top: -4px !important; }

  .adr.editor input.value.street, ul.adr.edit input.value.country, ul.adr.edit input.value.region { width: 19em;}

  .adr.editor input.value.zip { width: 100px; }
  .adr.editor input.value.city { width: 192px; margin:4px; }

  
  /* contact list */
  
  #contactsHeader {

  	height: 51px;

  	color: #999;
  	z-index: 2;
  	width: 100%;

  	line-height: 50px;
  }
  .multiselect #contactsHeader {
      -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
      left: 0;
      top: 44px;
      margin-left: 330px; padding-right: 330px;
      position: fixed;
      z-index: 10;

  }
  #contactsHeader > tr {
  }
  #contactsHeader > td {
  	z-index: 300;

  	border-bottom: 1px solid rgb(221, 221, 221);	

  }

  #contactsHeader > td.name {
  	padding-right: 9px;

  }

  .multiselect #contactsHeader > td.name {
  	width: 100%;

  	display: inline-block;

  	color: #000;
  	background-color: rgba(220, 220, 220, 0.8);
  	opacity: 0.9;

  }

  #contactsHeader .delete {
  	background-image: none;
  }
  #contactsHeader .delete img {
  	vertical-align: middle;
  	margin-bottom: 2px;

  }
  #contactsHeader select {
  	width: auto;

  	max-width: 120px;
  	height: 22px;
  	font-weight: normal;
  	color: black;
  	border: 0;
  	background-color: rgba(255,255,255,0);
  	-webkit-appearance: none;
  	-moz-appearance: none;
      text-indent: 0.01px;
      text-overflow: '';
  }
  #contactsHeader select.sort {
  	margin-left: 50px;
  	opacity: 1;
  	color: rgb(153, 153, 153);

  }
  #contactsHeader .actions > * {

  	padding-left: 8px;
  	padding-right: 8px;
  	font-weight: bold;

  	float: right;
  }

  #contactsHeader .action.a {

  	margin: 0;

  	padding: 0;

  }
  #contactsHeader .actions > .toggle {
  	float: left;
  }

  #contactsHeader .actions > select {
  	float: right;
  	width: auto;
  	height: 19px;
  	padding-left: 18px;
  	padding-right: 8px;
  	padding-top: 2px;
  	padding-bottom: 0px;
  	margin-top: 14px;
  	margin-bottom: 14px;
  	font-weight: bold;
  	background-position: -13px;
  }
  #contactsHeader .actions_left {
  	float: left;
  }

  #contactlist > tbody {
  	position: relative;
   	padding-bottom: 300px;
  	width: 100%;
  	z-index: 1;
  }

  #contactlist.multiselect {
  	top: 51px;
  }
  #contactlist {
  	position: relative;
  	width: 100%;
  	min-width: 502px;
  }

  #contactlist td {
  	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
  }

  #contactlist .nametext {
  	margin-left: 55px;
  }
  #contactlist .avatar {
  	position: absolute;
  	margin-top: 10px;
  	height: 32px;
  	width: 32px;
   	margin-left: 10px;
  }
  /* Override default style for an open contact */

  tbody tr, tbody tr.hover {
  	background-color: #fff !important;
  }
  tbody tr.contact.active, tbody tr.contact:hover {
  	background-color: #f8f8f8 !important;
  }

  #contactlist > tbody > tr { height: 51px; display: none; }

  #contactlist > tbody > tr.contact.active, #contactlist  > tbody > tr.contact:hover { background-color: #eee; }
  #contactlist > tbody > tr > td {
  	border-bottom: 1px solid #DDDDDD;
  	font-weight: normal;
  	text-align: left;
  	overflow: hidden;
  	text-overflow: ellipsis;

  	vertical-align: top;

  	white-space: nowrap;
  }

  #contactlist tbody > tr > td {
  	min-width: 80px;
  	max-width: 250px;
  	line-height: 50px;

  }

  #contactlist tbody > tr > td.name > input[type=checkbox]:first-child:not(.toggle) {
  	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter:alpha(opacity=0); opacity:0;

  	float:left;

  	margin: 32px 0 4px 32px;
  	position: absolute;
  	z-index: 1;

  }

  #contactlist tbody > tr > td.name > input[type=checkbox] + label, #select_all + label {
  	height: 50px;
  	position: absolute;
  	width: 50px;
  	z-index: 5;

  }

  #contactlist tbody > tr:hover > td.name > input[type=checkbox]:first-child {
  	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); opacity:1;
  }
  #contactlist tbody > tr > td.name > input[type=checkbox]:checked:first-child {

  	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); opacity:1;
  }
  #contactlist tbody > tr > td.name {

  	font-weight: bold;

  	background-repeat:no-repeat !important;
  	background-position: 10px center !important;
  }
  #contactlist tbody > tr > td a.mailto {
  	position: absolute; float: right;  clear: none;
  	cursor:pointer;
  	width:16px; height:16px;

  	margin: 18px 0 2px 5px; z-index: 200;
  	display: none; opacity: 0.8;

  }

  
  #contactlist tbody > tr > td > a.delete {
  	position: absolute;

  	padding: 25px;
  	right: 0px;

  	cursor:pointer;

  	z-index: 200;
  }
  #contact {

  	padding-left: 155px;
  	background-color: white;
  	color: #333333;
  	line-height: normal;
  }
  #contact > ul {
  	min-height: 146px;
  	min-width: 530px;
  	max-width: 700px;
  }
  #contact h3 {
  	margin-left: 110px;
  	margin-top: 7px;
  	margin-bottom: 0px;
  	font-size: 12px;
  	line-height: 14px;

  }
  #contact .arrow {
  	border-bottom: 20px solid white; 
  	border-left: 20px solid transparent; 
  	border-right: 20px solid transparent; 
  	display: block; 
  	height: 0;
  	position: absolute; 
  	left: -28px; top: 2em;
  	width: 0;
  	z-index: 201;
  	-webkit-transform: rotate(270deg); -moz-transform: rotate(270deg); -o-transform: rotate(270deg); 
  	-ms-transform: rotate(270deg); transform: rotate(270deg);
  }

  #contact span.adr {

  	float: left; 

  	width: 300px;
  	height: 30px;
  	margin: 3px;
  	margin-left: 0px;

  	overflow: hidden; text-overflow: ellipsis; text-align: bottom; white-space: nowrap; 
  }
  #contact span.adr:hover { /*overflow: inherit;*/ /*white-space: pre-wrap;*/ }
  
  #contact > ul.propertylist {
  	-webkit-transition: all 0.5s ease-in-out;
  	-moz-transition: all 0.5s ease-in-out;
  	-o-transition: all 0.5s ease-in-out;
  	-ms-transition: all 0.5s ease-out;
  	transition: all 0.5s ease-in-out;
  }

  #addressbooks-ui-div > p > select {
  	width:200px;
  	display: inline-block;
  }
  
  #addressbooks-ui-div > p > input:not([type="checkbox"]) {
  	width:200px;
  	display: inline-block;
  }
  
  #addressbooks-ui-div > p > textarea {
  	width:200px;
  	display: inline-block;
  }
  
  #addressbooks-ui-div > p > label {
  	vertical-align:top;
  	width:200px;
  	display: inline-block;
  }

  @media screen and (min-width: 1400px) {
  	#contact > ul.propertylist {
  		-moz-column-count: 3;
  		-webkit-columns: 3;
  		-o-columns: 3;
  		columns: 3;
  	}
  }
  @media screen and (min-width: 800px) and (max-width: 1400px) {
  	#singlevalues { max-width: 50%; }
  	#contact > ul.propertylist {
  		-moz-column-count: 2;
  		-webkit-columns: 2;
  		-o-columns: 2;
  		columns: 2;
  	}
  }
  @media screen and (max-width: 400px) {
  	#contact > ul.propertylist {
  		-moz-column-count: 1;
  		-webkit-columns: 1;
  		-o-columns: 1;
  		columns: 1;
  	}
  }

  @media screen and (min-width: 1201px) {

  	#contactlist tr td.categories { display: none; }

  	#contactsHeader tr td.categories { display: none; }

  }

  @media screen and (max-width: 1200px) {

  	#contactlist tr td.adr { display: none; }

  	#contactsHeader tr td.adr { display: none; }
  	.multiselect #contactsHeader { margin-left: 300px; padding-right: 300px; }

  }

  @media screen and (max-width: 1000px) {

  	#contactlist tr td.tel { display: none; }

  	#contactsHeader tr td.tel { display: none; }
  	.multiselect #contactsHeader { margin-left: 280px; padding-right: 280px; }

  }
  @media screen and (max-width: 900px) {

  	#contactsHeader .delete { display: none; }
  }
  @media screen and (max-width: 800px) {

  	#contactlist tr td.email { display: none; }

  	#contactlist tr { width: 100%; }
  	#contactsHeader tr td.email { display: none; }
  	.multiselect #contactsHeader { margin-left: 250px; padding-right: 250px; }

  }