﻿@media only screen and (max-width:700px) {
    .mobile_show {
        display: block;
    }

    .mobile_hide {
        display: none;
    }

    #main-content {
        width: 100%;
    }

    header {
        background-color:rgb(158, 173, 99);
        font-size: 2em;
        font-family: Calibri, Helvetica, sans-serif;
        font-weight: bold;
        padding: 10px;
        text-align: center;
    }
    
    header a {
        color: #fff;
        text-decoration: none;
    }

    header a:hover {
        color: rgb(84, 115, 110);
    }

    #bdySummary #Table_Ana {
        width: 100%;
    }

    .expanded-content {
        box-sizing: border-box;
        width: 100%;
    }

    .prepaid-header a {
        display: block;
        margin: 0;
    }

    .search-results-table .actions {
        padding: 10px 0 20px 0;
        text-align: center;
    }

    /*
    h1, legend {
        padding-left: 10px;
    }
    */

    form .field_error {
        margin-left: 0;
    }

    /****** Login ******/
    #loginform .textbox_input {
        width: 95%;
    }

    #loginform #login-table-container, #loginform #login-table {
        width: 100%;
    }

    #loginform #login-table td:nth-child(1) { 
        display:none; width: 0;
    }

    #loginform #login-table td:nth-child(2) {
        width: 100%;
    }

    #loginform #login-table label {
        font-family: tahoma;
        font-size: 11px;
        margin-bottom: 2px;
    }

    .login-text {max-width:100%;}

    /****** Coggins ******/
    #page-coggins {
        padding: 0 5px;
    }
    
    #page-coggins #addresses > div, #page-coggins .three-columns li {
        float: none;
        width: 100%;
        margin: 0;
    }

    #coggins-form .info-line > div, #coggins-form .horse-details > div, #coggins-form .horse-images > div {
	    border-right: 1px solid black;
        display: block;
        width: 100%;
    }

    #coggins-form .form-cell {
      display: block;
    }

    #coggins-form .address-line .block-1, #coggins-form .address-line-2 .block-1 {
      width: 100%;
      border-right: 0;
    }

    #coggins-form .address-line .block-2, #coggins-form .address-line-2 .block-2 {
      width: 100%;
    }

    #coggins-form .two-one > div {
      width: 100%;
      border-right: 0;
    }

    #coggins-form .two-one > div:last-child {
      width: 100%;
    }

    #coggins-form .horse-details {
        border-bottom: 1px solid black;
    }

    #coggins-form .signatures, #coggins-form .certification {
        border-bottom: 1px solid black;
    }

    #coggins-form .horse-images > div:not(:first-child) {
      border-left: 1px solid black;
    }

    #coggins-form .form-actions input {
      width: 100%;
    }

    #coggins-form .button.secondary {
        margin: 10px 0;
    }

    #coggins-form .form-actions {
        text-align: center;
    }

    #coggins-form a.cancel {
        margin: 0;
    }

    #coggins-form .state, #coggins-form .zip-code {
      width: 100%;
    }

    #coggins-form .address-line .block-1 .other-info .geographic-info {
      display: block;
      width: 100%;
    }

    #coggins-form .address-line .block-1 .other-info .veterinary-license {
      display: block;
      margin-bottom: 5px;
      width: 100%;
    }

    #coggins-form .address-line .block-1 .other-info .test-type {
      display: block;
      width: 100%;
    }

    #coggins-form .address-line .block-1 .other-info .geographic-info input {
      width: 100%;
    }

    #coggins-form .fifty-fifty, #coggins-form .two-thirds {
        box-sizing: border-box;
    }

    #coggins-form .fifty-fifty > div, #coggins-form .two-thirds > div, #coggins-form .two-thirds > div:first-child {
        display: block;
        width: 100%;
    }

    #coggins-form .textbox_input {
        width: 100%;
    }

    #coggins-form .city {
      width: 100%;
    }

    #coggins-form .city-state-zip > div {
        padding: 0;
    }

    #coggins-form .children-cell > div {
        box-sizing: border-box;
        border-right: 1px solid black;
    }

    #coggins-form .testing-reason li {
        width: 48%;
    }

    #coggins-form .lab .padding-children > div {
        padding: 0;
    }

    #coggins-form .test-results {
        padding: 0;
    }

    #coggins-form .lab .fifty-fifty div {
        margin-bottom: 10px
    }

    /****** Signup ******/
    #signupform label {
        display: block;
        float: none;
    }

    #signupform li.input-note-container div {
        width: 100%;
    }

    /****** Forms ******/
    .submit-message span {
        margin: 10px 0;
    }

    /****** CVI ******/
    #cvi-form {
        padding: 5px;
    }
    
    #cvi-form .form-cell {
        display: block;
    }
    
    #cvi-form .state-logo {
        /*
        display: block;
        width: 100%;
        */
        max-width: 100%;
        text-align: center;
    }

    #cvi-form .form-title {
        width: 100%;
    }

    #cvi-form .general-info-line > div {
        border-left: 1px solid #000;
        display: block;
    }

    #cvi-form .info-line .internationalContainer {
        text-align: center;
    }

    #cvi-form .addresses-container > div {
        display: block;
        width: 100%;
    }

    #cvi-form .address-container.consignee .address-city-state-zip, #cvi-form .address-container.consignee .address-county, #cvi-form .address-container.consignor .address-city-state-zip, #cvi-form .address-container.consignor .address-county {
        border-bottom: 1px solid #000;
    }

    #cvi-form .checkboxes-container {
        /* border-right: 1px solid #000; */
    }

    #cvi-form .checkboxes-container > div {
        border-top: 1px solid #000;
        border-bottom: none;
    }

    #cvi-form .checkboxes-container > div:first-child {
        border-top: none;
    }

    #cvi-form .checkboxes-container li {
        width: 49%;
    }
    #cvi-form .checkboxes-container li.one-third {
        width: 49%;
    }

    #cvi-form .owner-agent-container {
        width: 100%;
    }

    #cvi-form .owner-agent-statement {
        border-right: none;
        width: 100%;
    }

    #cvi-form .brand-symbol-container {
        border-top: 1px solid #000;
        width: 100%;
    }

    #cvi-form .veterinary-certification {
        border-bottom: 1px solid #000;
    }

    #cvi-form .vet-info {
        border: none;
        width: 100%;
    }

    #cvi-form .vet-info .form-table > div {
        border-right: none;
        width: 100%;
    }

    #cvi-form .vet-signature-container label {
        display: block;
    }

    #cvi-form .vet-signature-container input {
        width: 100%;
    }

    #cvi-form .vet-name-info label {
        display: block;
        width: 100%;
    }

    #cvi-form .offical-office-use {
        border-top: 1px solid #000;
        text-align: center;
        width: 100%;
    }

    #cvi-form .vet-info .form-table > div:last-child {
        border-left: none;
        width: 100%;
    }

    #cvi-form .address-container.consignor .address-name label, #cvi-form .address-container.consignee .address-name label {
        float: none;
    }

    #cvi-form .address-container.consignor .address-name div, #cvi-form .address-container.consignee .address-name div {
        float: none;
    }

    #cvi-form .address-container > div {
        width: 100%;
    }

    #cvi-form .herd-flock {
        border-right: none;
    }

    #cvi-form .livestock-container input[type=text], #cvi-form .livestock-container select {
        float: right;
        width: 50%;
    }

    /*# Responsive Tables */
    .table-responsive table, .table-responsive thead, .table-responsive tbody, .table-responsive th, .table-responsive td, .table-responsive tr { 
        display: block; 
    }
  
    /* Hide table headers (but not display: none;, for accessibility) */
    .table-responsive thead tr { 
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
  
    .table-responsive tr { border: 1px solid #ccc; }
  
    .table-responsive td { 
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee; 
        position: relative;
        padding-left: 50%;
        text-align: left;
    }
  
    .table-responsive td:before { 
        /* Now like a table header */
        /* position: absolute; jsteil */
        /* Top/left values mimic padding */
        float: left;
        top: 10px;
        left: 6px;
        width: 45%; 
        padding-right: 10px; 
        /* white-space: nowrap; */
    }

    #cvi-form .livestock-container table {
        width: 100%;
    }

    #cvi-form .livestock-container table td {
        border: none;
        overflow: hidden;
        padding: 10px 5px;
    }

    #cvi-form .livestock-container table tr:nth-child(even) {
        background-color: #f4f4f4;
    }

    #cvi-form .livestock-container td:nth-of-type(2):before { content: "Qty in Lot or Group"; }
    #cvi-form .livestock-container td:nth-of-type(3):before { content: "Species"; }
    #cvi-form .livestock-container td:nth-of-type(4):before { content: "Official/Federal Ear Tag # Registration Tattoo or Other Permanent Identification"; }
    #cvi-form .livestock-container td:nth-of-type(5):before { content: "Age"; }
    #cvi-form .livestock-container td:nth-of-type(6):before { content: "Breed"; }
    #cvi-form .livestock-container td:nth-of-type(7):before { content: "Sex"; }
    #cvi-form .livestock-container td:nth-of-type(8):before { content: "Bruc Vacc Tattoo"; }
    #cvi-form .livestock-container td:nth-of-type(9):before { content: "Test Date"; }
    #cvi-form .livestock-container td:nth-of-type(10):before { content: "Test"; }
    #cvi-form .livestock-container td:nth-of-type(11):before { content: "Accession #"; }
    #cvi-form .livestock-container td:nth-of-type(12):before { content: "Test Results +/-"; }
    #cvi-form .livestock-container td:nth-of-type(13):before { content: "Test Lab"; }
    #cvi-form .livestock-container td:nth-of-type(14):before { content: "Other"; }

    #cvi-form .form-actions {
        text-align: center;
    }

    #cvi-form .form-actions input {
        width: 100%;
    }

    #cvi-form .button.secondary {
        margin: 10px 0;
    }

    #cvi-form a.cancel {
        display: block;
        margin: 0;
    }

    #cvi-form .gps label, #cvi-form .gps label.longitude {
        display: block;
        margin: 10px 0 0 0;
    }

    #cvi-form .gps input {
        width: 100%;
    }

    #cvi-form .state-container {
        text-align: left;
    }

    #cvi-form .state-container input {
        width: auto;
    }

    #cvi-form .checkboxes-container .current-state li {
        width: 100px;
    }

    #page-templates input, #page-templates .textbox_input {
      width: 100%;
    }

    #page-templates label {
        display: block;
        float: none;
        width: auto;
    }

    #page-templates li {
        padding-left: 0;
        padding-right: 0;
    }

    #page-templates .button.secondary {
        margin: 10px 0;
    }

    #page-templates h2 input {
        box-sizing: border-box;
        margin-left: 0;
    }

    div.responsive {
        padding: 0 5px;
        box-sizing: border-box;
    }

    div.responsive input:not([type="radio"]):not([type="checkbox"]), div.responsive select, div.responsive textarea {
        box-sizing: border-box;
        width: 100%;
    }

    div.responsive fieldset {
        margin: 0;
        padding: 0;
    }

    div.responsive li {
        padding: 10px 0;
    }

    div.responsive .button {
        margin-top: 20px;
    }

    div.responsive a.cancel {
        display: block;
        margin: 0;
        margin-top: 20px;
        text-align: center;
    }

    table.tablesaw-sortable td span.tablesaw-cell-content {
        padding-left: 0;
    }

    /****** Summary Page ******/
    #pnlCertificates .row-limit {
        display: block;
        margin-left: 0;
    }

    #inviteForm li label {
        display: block;
        float: none;
        width: 100%;
    }

    #signupform li.input-note-container div, #inviteForm li.input-note-container div {
        float: none;
        width: 100%;
    }
}
