﻿/******************************************************************************
* Fonts                                                                       *
******************************************************************************/
@font-face {font-family: 'Geogrotesque-Light';src: url('/fonts/Geogrotesque-Light.eot') format('embedded-opentype');}
@font-face {font-family: 'Geogrotesque-Light'; src: url("/fonts/Geogrotesque-Light.otf") format("opentype");}
@font-face {font-family: 'Geogrotesque-Light'; src: url("/fonts/Geogrotesque-Light.woff") format("woff");}
@font-face {font-family: 'Geogrotesque-LightItalic'; src: url('/fonts/Geogrotesque-LightItalic.eot') format('embedded-opentype');}
@font-face {font-family: 'Geogrotesque-LightItalic'; src: url("/fonts/Geogrotesque-LightItalic.otf") format("opentype");}
@font-face {font-family: 'Geogrotesque-LightItalic'; src: url("/fonts/Geogrotesque-LightItalic.woff") format("woff");}
@font-face {font-family: 'Geogrotesque-Medium'; src: url('/fonts/Geogrotesque-Medium.eot') format('embedded-opentype');}
@font-face {font-family: 'Geogrotesque-Medium'; src: url("/fonts/Geogrotesque-Medium.otf") format("opentype");}
@font-face {font-family: 'Geogrotesque-Medium'; src: url("/fonts/Geogrotesque-Medium.woff") format("woff");}
@font-face {font-family: 'Geogrotesque-Regular'; src: url('/fonts/Geogrotesque-Regular.eot') format('embedded-opentype');}
@font-face {font-family: 'Geogrotesque-Regular'; src: url("/fonts/Geogrotesque-Regular.otf") format("opentype");}
@font-face {font-family: 'Geogrotesque-Regular'; src: url("/fonts/Geogrotesque-Regular.woff") format("woff");}



/******************************************************************************
* Body                                                                        *
******************************************************************************/
* {
    box-sizing: border-box;
}

body {
    background: white;
    color: #024066;
    font-size: 0.9vw;
    font-family: Geogrotesque-Regular, Tahoma, Arial;
    font-weight: lighter;
    line-height: 1.4vw;
    margin: 0 auto;
    overflow: auto;
}


/******************************************************************************
* Colours                                                                     *
******************************************************************************/
.darkblue {color: #024066;}
.lightblue {color: #67A2C0;}
.lightgrey {color: #C6C7C8;}
.orange {background-color: #F39100;}

.red {background-color:#B9003F !important; color:white !important;}
.yellow {background-color: #DAA520 !important; color:white !important;}
.green {background-color: #2A794A !important; color:white !important;}


/******************************************************************************
* Classes                                                                     *
******************************************************************************/
.field-validation-error {
    color: red;
    display: block;
    font-weight: bold;
}

.validation-summary-errors {
    color: red;
    display: block;
    font-weight: bold;
}


/******************************************************************************
* Elements                                                                    *
******************************************************************************/
a {color: #51657E; text-decoration: none;}
a:hover {color: #67A2C0;}
a:not([href]) {color:#51657E; text-decoration:line-through;}
a:not([href]):hover {color:#51657E;}

article {width:100vw;}

aside {display:none;}

div.action {margin:0 1vw 2vh 6vw; }


div.comments {border-top:1px solid #D3D3D3; margin-top:3vh; padding-top:2vh; text-align:left;}
div.comments div.comment span:first-child {font-style:italic; text-align:right;}
div.comments div.comment span:first-child::after {content: " - ";}
div.comments div.comment span:last-child {display:block; font-weight:bold; margin-bottom:2vh;}

div.checkboxes {align-items:stretch; display:flex; flex-direction:row; flex-wrap:wrap; justify-content:flex-start; margin-bottom: 4vh;
                display:-ms-flexbox;

                 -ms-flex-align:stretch;
                 -ms-flex-wrap:wrap;
                 -ms-flex-direction:row;
}
div.checkboxes label {float:right; width:14vw;}
div.checkboxes p {width:16vw;}

div.form {width:65%;}
div.form table.estimates{min-width:100%; max-width:100%; width:100%;}

div.note {margin:0 1vw 2vh 6vw; }

fieldset {background-color:white; border:1px solid #D3D3D3; border-radius:5px; margin-bottom:2vh; min-width:80%; max-width:80%; padding:3vw 0 1vw 0;} 
fieldset p {margin:0 1vw 2vh 1vw;}
fieldset.large {min-width:65%; max-width:100%; }
fieldset.large p {margin:0 0 1vh 1vw;}

figure {background-color:#024066; color:white; margin:2vh; padding:1vw; text-align:center; vertical-align:bottom; width:20vw;}
figure figcaption {font-size:2vw; padding:20px 5px 20px 5px; text-transform:uppercase;}
figure img {filter:grayscale(100%) invert(100%) brightness(100%); -webkit-filter:grayscale(100%) invert(100%) brightness(100%); height:13vh;}
figure:hover {opacity:0.8;}

footer {display:none;}

form {}

h1 {
    color: #F39100;
    font-family: Geogrotesque-Regular, Tahoma, Arial;
    font-size: 2.4vw;
    line-height: 3vw;
    margin-top:2vh;
    padding-bottom: 1vh;
    /*border-bottom: 1px solid #D3D3D3;*/
    text-align: center;
    width:100%;
}

h2 {background-color:#F8F8F8; border-bottom:1px solid #D3D3D3; border-top-left-radius:5px; border-top-right-radius:5px; color:black; font-family: Geogrotesque-Regular, Tahoma, Arial; font-size:0.9vw; font-weight:normal; line-height:1.4vw; padding:1vh 1vw 1vh 1vw; text-align:left; top:0; width:100%;}
h2 span::after {content: " - ";}
h2 span:last-child::after {content: "";}

h3 {font-family: Geogrotesque-Regular, Tahoma, Arial; font-size:0.9vw; font-weight:normal; margin:0 1vw 2vh 1vw;}
h3 span::after {content: " - ";}
h3 span:nth-child(3) {font-weight:bold;}
h3 span:last-child::after {content: "";}

header {}

header a.logo {display:none;}
header a.title {display:none;}

header nav {display:none}

hr {
    clear: both;
    color: #D3D3D3;
    background-color: #FFFFFF;
    border: 1px solid #D3D3D3;
    border-style: none none solid;
    height: 0;
    width: 100%;
}

input {
    border-style: none;
    border: 1px solid #C6C7C8;
    border-radius: 5px;
    color: #111111;
    font-family: Geogrotesque-Light, Tahoma, Arial;
    font-size: 1vw;
    width: 100%;
}
input:focus {border-color: #024066; outline:none; box-shadow: 0 0 5px #024066;}
input:disabled {background-color:#EEEEEE; color:#333333;}
input:-moz-read-only {background-color: #EEEEEE;color: #333333;}
input:read-only {background-color: #EEEEEE;color: #333333;}

input[type="button"], input[type="submit"] {color: #111111; padding:0.5vh 0.5vw 0.5vh 0.5vw; width:auto;}
input[type="button"].button, input[type="submit"].button {display:none;}
input[type="button"].popup {background-color:white; background-image:url(/Images/icons/popup.png); background-position:center center; background-repeat:no-repeat; background-size:1vw; border-bottom-left-radius:0; border-top-left-radius:0; display:block; float:left; font-size:0; height:3.99vh;  min-width:0; margin-bottom:1vh; width:10%;}
input[type="submit"]:disabled {opacity:0.3;}


input[type="checkbox"] {height:4vh; width:auto;}
input[type="file"] {box-sizing:padding-box; width:auto;}
input[type="image"] {border: none;}
input[type="email"], input[type="number"], input[type="date"], input[type="datetime"], input[type="password"], input[type="tel"], input[type="text"] {height:4vh; padding:5px;}
input[type="text"].popup {background-color:white; border-bottom-right-radius:0; border-top-right-radius:0; border-right:none; display:block; float:left; margin-bottom:1vh; width:90%}
input[type="text"].small {width:70%}
input[type="text"].percentage {width:70%}
input[type="radio"] {margin-right:0.5vw; width:auto;}

label.percentage:after {content:"%"; }

main {
    align-items:flex-start;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content:space-between;
    width:100%;

    display:-ms-flexbox;
     -ms-flex-align:start;
     -ms-flex-wrap:wrap;
     -ms-flex-pack:justify;
}

p {margin-bottom:1vh;}

p label {display:inline-block; height:2vh; margin-bottom:5px; padding-bottom:0.5vh; width:100%;}
p label::after{content:":";}
p.center {text-align:center;}
p.center input[type=image] {margin-right:1vw;}

.required:after {content:"*"; font-weight:bold; color:red;}

section {margin-bottom: 3vh; padding: 2vh 5vw 2vh 5vw; align-items:stretch; display:flex; flex-direction:row; flex-wrap:wrap; justify-content:center;}

select {
    border-style: none;
    border: 1px solid #C6C7C8;
    border-radius: 5px;
    color: #111111;
    font-family: Geogrotesque-Light, Tahoma, Arial;
    font-size: 1vw;
    height: 4vh;
    padding: 5px;
    width: 100%;
}
select:-moz-read-only {background-color: #EEEEEE;color: #333333;}
select:read-only {background-color: #EEEEEE;color: #333333;}

select.small {width:20%;}

span {}
span.error{color:red; font-weight:bold;}
span.warning{color:#CCCC00; font-weight:bold;}
span.information{color:#197319; font-weight:bold;}
span.milestone {background-repeat: no-repeat; background-position: right 10px center; background-size:2vw; display:inline-block; font-size:0.8vw; font-weight:bold; padding:0 1vw 0 0.2vw; text-align:center; width:100%;}

strong {font-family:Geogrotesque-Medium;}

table {border-collapse: separate !important; border:1px solid #D3D3D3; border-radius:5px; max-width:100%;}
table img {max-width: 2vw;}
table input[type=image] {max-width: 2vw;}
table thead {background-color:#F8F8F8; text-align:left;}
table thead th {border-bottom:1px solid #D3D3D3; color:black; font-weight:normal; padding:1vh 1vw 1vh 1vw; }
table tbody td {padding:1vh 1vw 1vh 1vw; vertical-align:top; }
table tbody tr:nth-child(n) {background-color:white;}
table tbody tr:nth-child(2n) {background-color:#F8F8F8;}


table.kendo ul {margin:0; padding:0; max-width:40vw;}
table.kendo ul li {float:left; list-style:none; margin-right:10px;}
table.kendo ul li::after {content: ",";}
table.kendo ul li:last-child::after {content: "";}

table.estimates {min-width:65%; max-width:65%; width:65%;}
table.estimates th:nth-child(1) {width:10vw;}
table.estimates td:nth-child(1) {width:10vw;}

table.responses {width:100%;}
table.responses th:nth-child(5) {padding-left:1vw; text-align:left;}
table.responses th:nth-child(5) input {margin-bottom:1vh;}
table.responses th:nth-child(6) {padding-left:1vw; text-align:left;}
table.responses td {max-width:16vw;}


textarea {
    border-style: none;
    border: 1px solid #C6C7C8;
    border-radius: 5px;
    color: #111111;
    font-family: Geogrotesque-Light, Tahoma, Arial;
    height: 13vh;
    padding: 2px 5px 2px 5px;
    width:100%;
}
textarea:disabled {background-color: #EEEEEE;color: #333333;}
textarea:-moz-read-only {background-color: #EEEEEE;color: #333333;}
textarea:read-only {background-color: #EEEEEE;color: #333333;}

ul {list-style: none;}

ul.tabs {display:none;}


