* { box-sizing: border-box; -moz-box-sizing: border-box;}

html, body, input, select, button { font-family: 'Montserrat', sans-serif; }
body {margin: 0; padding: 0; font-size: 16px;}

button, input[type="submit"] { padding: 0.6em 1em; border: 0; background: #392a70; color: #fff; font-size: 1em; font-weight: bold; transition: all 0.2s ease 0s; cursor: pointer; }
    button:hover, input[type="submit"]:hover { background: #2E2261; }

hr { display: inline-block; width: 100%; height: 1px; margin: 2em 0; border: 0; background: #d2d8d5; }

.leftMenu {width: 250px; background:#f5f4f8; padding: 30px; position: absolute; top: 0; left: 0; bottom: 0;}
.logo { text-align:center; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid #ccc;}

.countyClerkContainer { text-align:center; font-size: 12px; margin-bottom: 30px; border-bottom: 1px solid #ccc; padding-bottom: 30px;}
.countyClerkContainer img { border-radius: 100px; -moz-border-radius: 100px; width: 75px; height: auto; margin: 0 auto 10px auto; display:block;}

.myVoteCenter { text-align:center; font-size: 12px;}
.myVoteCenter img {display:block;}

.resultsHeader { background:#2e2261; position:absolute; top: 0; left: 250px; right: 0; padding: 30px;}
.electionTitle { color:#fff; font-weight: 700; font-size: 40px;}

.electionMetaData { padding-top: 10px;}
.electionMetaData ul { margin: 0; padding: 0; list-style:none;}
    .electionMetaData ul li { display: inline-block; margin-right: 15px; padding-right: 20px; color:#fff; border-right: 1px solid #ccc;}
        .electionMetaData ul li:last-child { border-right: 0;margin-right: 0; padding-right: 0;}

.electionFilters { background:#d0ccdd; margin: 0; position: absolute; top: 108px; left: 250px; right: 250px;}
    .electionFilters ul { margin: 0; padding: 0; list-style:none;}
        .electionFilters ul li { display: inline-block;}
            .electionFilters ul li a { display:block; padding: 15px; font-weight: 700; color:#746f83; text-decoration:none; border-bottom: 5px solid #d0ccdd;}
                .electionFilters ul li a:hover { border-bottom: 5px solid rgba(116, 111, 131, 0.5);}
            .electionFilters ul li a.active { color:#2e2261; border-bottom: 5px solid #06854a;}

.electionResults { position:absolute; top: 162px; right: 250px; left: 250px; bottom: 0; overflow: auto; padding: 30px;}
.electionResultsSection { margin-bottom: 30px;}

.candidateAdmin { position:absolute; top: 162px; right: 0px; left: 250px; bottom: 0; overflow: auto; padding: 30px;}

.electionResultsSectionTitle { font-size: 1.3em; font-weight: 700; color:#2e2261; margin-bottom: 15px; }
    .electionResultsTable { width: 100%; margin-top: 1.4em; border: 0; }
    .electionResultsTable.no-space { margin-top: 0; }
        .electionResultsTable th { font-size: 12px; text-align: center; color:#06854a; text-transform:uppercase; border-bottom: 1px solid #ccc; padding: 10px 0; white-space:nowrap;}
        .electionResultsTable tr td { border-bottom: 1px solid #ccc; padding: 10px; white-space:nowrap; width: 100px; text-align:Center;}
        .electionResultsTable tr td:nth-child(1), .electionResultsTable tr th:nth-child(1) {width: auto; text-align:left;}
	
        .electionResultsTable tr:nth-child(odd) td { background: #f5f4f8 }
        .electionResultsTable tr:nth-child(even) td { background: #fff }


        .messagingTable { width: 100%; margin-top: 1.4em; border: 0; }
        .messagingTable.no-space { margin-top: 0; }
            .messagingTable th { font-size: 12px; text-align: center; color:#06854a; text-transform:uppercase; border-bottom: 1px solid #ccc; padding: 10px 0; white-space:nowrap;}
            .messagingTable tr td { border-bottom: 1px solid #ccc; padding: 10px; white-space:nowrap; width: 100px; text-align:Center;}
            .messagingTable tr td:nth-child(1), .messagingTable tr th:nth-child(1) {width: auto; text-align:left;}
        
            .messagingTable tr:nth-child(odd) td { background: #f5f4f8 }
            .messagingTable tr:nth-child(even) td { background: #fff }

.rightMenu {width: 250px; background:#392a70; padding: 30px; position: absolute; top: 108px; bottom: 0; right: 0; }

.resourceTitle { text-align:center; font-size: 12px; text-transform:uppercase; color:#d3c8fa; margin-bottom: 10px; }
    .rightMenu ul { margin:0; padding:0; list-style:none;}
        .rightMenu ul li a { display:block; text-decoration:none; color:#d3c8fa; font-size: 14px; padding: 15px 0; font-weight: 700;}
            .rightMenu ul li a:hover { color:#fff;}

.txtLeft { text-align:left;}

.scrollIconContainer {display:none;}

.election-notification-desktop-container a {display: block; text-decoration: none; padding: 10px 20px; border-radius: 4px; width: 100%; background: #ff6a00; color: #fff; font-weight: 700; text-align: center; font-size: 14px; margin-bottom: 20px; }
.election-notification-mobile-container {display:none;}
    .election-notification-mobile-container a {display: block; text-decoration: none; padding: 10px; width: 100%; background: #ff6a00; color: #fff; font-weight: 700; text-align: center; font-size: 14px; }

/* Table Editing */

/* Inputs */
table input, table input[disabled], table select, table select[disabled] { margin: -4px; padding: 4px 8px; border: 1px solid rgba(57, 42, 112, 0); background: none; appearance: none; color: #000; font-size: 1em; text-align: center; transition: all 0.3s ease 0s; }
table td:first-child input, table td:first-child input[disabled], table td:first-child select, table td:first-child select[disabled] { text-align: left; }
    table tr.editing input, table tr.editing select { border: 1px solid rgba(57, 42, 112, 0.3); background: #fff; appearance: auto; }
/* Controls */
table button { width: 100%; padding: 0.4em 0.6em; font-size: 0.9em; }
table button.save-item { display: none; }
table button.remove-item, table button.remove-item:hover { background: #DC2F31; }
    table tr.editing button.save-item { display: inline-block; width: 100%; background: #06854a; }
    table tr.editing button.edit-item { display: none; }

/* Confirmation */

.confirmation { margin: 2.4em 0 0; }
    .confirmation h2 { color: #2e2261; font-size: 1.2em; text-transform: uppercase; }
.steps { display: flex; flex-flow: row wrap; gap: 1.4em 2%; }
    .step { display: flex; flex-flow: row wrap; align-items: flex-end; width: 48%; min-width: 340px; padding: 1.4em 1.6em 1.6em; border: 1px solid #D0CCDD; }
        .step h3, .step p { width: 100%; }
        .step h3 { margin: 0; }

.input-block label { display: block; margin: 0 0 0.4em; font-size: 0.9em; font-weight: bold; }
.input-block input { padding: 0.6em 1em; }
button, input[type="submit"] { margin: 1em 0 0 1em; font-size: 0.9em; }

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

    body {font-size: 14px;}

}

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

    .rightMenu {display:none;}
    .electionFilters {right:0;}
    .electionResults {right:0;}

}

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

    body {font-size: 12px;}

    /*.election-notification-mobile-container {display:block;}*/

    .resultsHeader {background: url(/images/logo.png) no-repeat 30px 50% #2e2261;  background-size: 75px auto; padding-left: 130px;}

    .leftMenu {display:none;}
    .resultsHeader {left:0;}
    .electionFilters {left:0; top: 122px;}
    .electionResults {left:0; top: 172px;}

    .electionTitle {font-size: 30px;}

}


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

    body {font-size: 12px;}

    .resultsHeader {background: url(/images/logo.png) no-repeat 10px 20px #2e2261; background-size: 50px auto; padding: 15px 15px 15px 75px; position:static; text-align: left;}

    .electionTitle {font-size: 20px;}

    .electionFilters {position:static; overflow-x: auto; white-space: nowrap;}
    .electionMetaData ul li {display:block; margin: 0; padding: 0; border: 0;}

    .electionResults {position:static; padding: 15px;}
    .electionResultsSection {overflow-x: auto;}
    .electionResultsSection table {min-width: 538px;}

    .electionResultsTable tr td { white-space:normal; width: 160px; }

    /*.electionResultsSectionTitle {position:absolute;}*/
    .electionResultsTable {margin-top: 30px;}
    .electionResultsTable tr td:first-child, .electionResultsTable tr th:first-child {position:absolute; width: 625px; overflow: hidden; white-space:nowrap; text-overflow: ellipsis;}
    .electionResultsTable tr th:first-child {background:#fff;}

    .leftMenu {display:none;}
    .resultsHeader {left:0;}



    .electionTitle {font-size: 30px;}

}

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

    .scrollIconContainer {display:block; padding: 10px 10px 10px 50px;background:#d5a56d; position: relative; color:#fff; font-weight: 700;}	
    .scrollIconContainer img {width: 30px; height: auto; position:absolute; left: 10px;}

    .electionResultsTable tr td:first-child, .electionResultsTable tr th:first-child {position:absolute; width: 225px; overflow: hidden; white-space:nowrap; text-overflow: ellipsis;}
	
}