﻿body {
    font-family: HelveticaNeue-Light,"Helvetica Neue Light","Helvetica Neue","Segoe UI",Segoe,Helvetica,Arial,"Lucida Grande",sans-serif;
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: baseline;
    text-decoration: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    list-style-type: none;
}

.nav {display:none}

.multi .results {width:800px}
.multi .result {float:left; position:relative; display:block; padding: 2px 0px; border:1px solid blue; border-top:0px; width:800px}
.multi .result:first-child {border-top:1px solid blue; padding-top:0px}
.multi .result:hover {background-color:#eee}

.single .result {border:1px solid #bbb; border-radius:10px; padding:5px; background-color:#eee }

/* First make all fields invisible in case additional fields are added in the future */
.multi .field {display:none; width:140px; vertical-align:top}

/* Selectively enable the fields we want to display */
.multi .applicationDate           {display:inline-block; width:80px}
.multi .applicationNumber         {display:inline-block; width:100px}
.multi .applicationNumber .link:before {content: "View "; text-decoration:none}
.multi .applicationNumber .link   {text-decoration:none; font-weight:bold}
.multi .applicationNumber         {text-decoration:none; vertical-align:middle; text-align:center}
.multi .owner                     {display:inline-block; }
.multi .trademark                 {display:inline-block; }
.multi .statusDetail              {display:inline-block; }
.multi .text                      {text-transform: lowercase; display:inline}
.multi .specification             {display:inline; width:140px;float:right}
.multi .specification .item       {display:inline}
.multi .specification .classCode  {display:inline; margin-right:4px}
.multi .specification .text       {display:none}
.multi .specification .item .classCode .label {display:none}
.multi .specification .item:first-child .classCode .label {display:block}

/* Set label text */
.multi .label {display:none}
.multi .result:first-child .label {display:block; position:relative; font-weight:bold; padding-left:2px; margin-bottom:2px; color:#fff; text-align:left}
.multi .result:first-child .applicationNumber .label {width:800px; background-color:#00f; padding:0px}

.multi .applicationDate .label:before {content:"app date"}
.multi .applicationNumber .label:before {content:"serial number"}
.multi .trademark .text .label:before {content:"trademark"}
.multi .owner .text .label:before {content:"owner"}
.multi .statusDetail .text .label:before {content:"status"}

.multi .result:first-child .specification .item:first-child .classCode .label:before {content:"classes"}

/*.multi .applicationNumber .link {border-radius:5px; border:1px solid #aaa; padding:0px 2px; background-color:#eee}
.multi .applicationNumber .link:hover {background-color:#fff; border-color:black; border-width:2px}*/

.single .classDescription {font-weight:bold}
.single .pager {display:none}
.single .field {padding-bottom:4px; display:block}

/* Set label text */
.single .label {display:inline-block; width:130px; font-weight:bold; text-align:right; padding-right:10px}
.single .applicationDate .label:before {content:"Application Date: "}
.single .applicationNumber .label:before {content:"Serial Number: "}
.single .countryCode .label:before {content:"Trademark Country: "}
.single .owner .text .label:before {content:"Trademark Owner: "}
.single .trademark .text .label:before {content:"Trademark: "}
.single .trademark .imageURL .label:before {content:"Trademark Image: "}
.single .trademark .description .label:before {content:"Image Description: "}
.single .registrationDate .label:before {content:"Registration Date: "}
.single .registrationNumber .label:before {content:"Registration Number: "}
.single .classCode .label:before {content:"International Class: "}
.single .relatedTags .label:before {content:"Related Tags: "}
.single .item .classDescription .label:before {content:"Class Description: "}
.single .item .text .label:before {content:"Goods and Services: "}
.single .updateDate .label:before {content:"Update Date: "}
.single .statusDetail .code .label:before {content:"Status Code: "}
.single .statusDetail .text .label:before {content:"Status Description: "}
.single .statusDetail .date .label:before {content:"Status Date: "}

.specification {margin:0px; padding:0px}
.single .specification:before {content:"Goods and Services"; display:block; width:130px; text-align:right; text-decoration:underline; font-weight:bold}


.pager {float:left; padding-top:10px; clear:both}
.pager .count:before {content:" (showing page "}
.pager .count:after {content:")"}
.nav a {display:inline-block; width:15px; text-align:center; color:blue; text-decoration:none}

/*Example color based on trademark status */
.statusDetailCode624 .statusDetail,.statusDetailCode626 .statusDetail,.statusDetailCode700 .statusDetail,.statusDetailCode702 .statusDetail,.statusDetailCode705 .statusDetail,.statusDetailCode701 .statusDetail,.statusDetailCode703 .statusDetail,.statusDetailCode705 .statusDetail,.statusDetailCode717 .statusDetail,.statusDetailCode800 .statusDetail {color:#0a0}
.statusDetailCode400 .statusDetail,.statusDetailCode401 .statusDetail,.statusDetailCode402 .statusDetail,.statusDetailCode403 .statusDetail,.statusDetailCode600 .statusDetail,.statusDetailCode601 .statusDetail,.statusDetailCode602 .statusDetail,.statusDetailCode603 .statusDetail,.statusDetailCode604 .statusDetail,.statusDetailCode605 .statusDetail,.statusDetailCode606 .statusDetail,.statusDetailCode607 .statusDetail,.statusDetailCode608 .statusDetail,.statusDetailCode609 .statusDetail,.statusDetailCode614 .statusDetail,.statusDetailCode618 .statusDetail,.statusDetailCode690 .statusDetail,.statusDetailCode710 .statusDetail,.statusDetailCode711 .statusDetail,.statusDetailCode712 .statusDetail,.statusDetailCode713 .statusDetail,.statusDetailCode714 .statusDetail,.statusDetailCode715 .statusDetail ,.statusDetailCode716 .statusDetail,.statusDetailCode900 .statusDetail {color:#c00}

/* Hide summary which may be used in the future to display an auto-generated page summary for SEO */
.summary {display:none}
