.field{
	margin:1vw;
	font-weight:300;
        font-size:1.75vw;
        text-align:center;
        overflow:hidden;
        background:white;
        padding-bottom:0.5vw;
        border:1px solid black;
        outline:5px solid white;
}

.field .title{
        padding:0.5vw;
        color:#e6e6e6;
        margin:0.5vw;
        border:0.1vw solid #fff;
        outline:0.1vw solid rgba(141, 141, 141, 0.9);
        background:#777;
	position:relative;

        background: -webkit-linear-gradient(0deg, #4b4b4b, #929292);
        background:    -moz-linear-gradient(0deg, #4b4b4b, #929292);
        background:      -o-linear-gradient(0deg, #4b4b4b, #929292);
        background:         linear-gradient(0deg, #4b4b4b, #929292);
}

.field .title .row{
	margin-left :0;	
	margin-right:0;	
}

.field .title .row div{
	padding-left :0;	
	padding-right:0;
}

.field .title i{
        font-size:1vw;
        color:rgba(255,255,255,0.7);
        cursor:pointer;
        margin:0 0.1vw;

        -webkit-transition:0.5s color;
                transition:0.5s color;
}
.field .title i.fa-question-circle{
        font-size:1.25vw;
}

.field .title i:hover{
        color:white;
}

.field .title .sub-title{
        font-size:1vw;
        color:#ddd;
}

.field .disclaimer{
	font-size:16px;
	font-weight:400;
	font-style:italic;
	color:#515a6a;
}

.field .input{
        padding:0.25vw;
        margin:0.5vw;
        color:#a28a69;
        border:0px solid transparent;
}

.field input.input{
        text-align:center;
        padding:0;
        width:calc(100% - 1vw);
        margin:0.5vw auto;
}

.field .input.list{
        max-height:35vh;
        overflow:auto;
}

.field .input.dropdown{
        background:white;
}

.field select.input.list{
        text-align:center;
        text-align-last:center;
        margin-top:0;
        width:95%;
	padding:0.25vw 0;
	margin:0 0 0.5vw;
}

.field:hover .input.hover{
        border-left :1px solid #bfbfbf;
        border-right:1px solid #bfbfbf;
}

.field hr{
        border:0px solid transparent;
        border-top:1px solid #bfbfbf;
        font-size:0;
        width:50%;
}

.field:hover hr{
        width:80%;
}

.field .field-button{
        padding:0.5vw;
        padding-bottom:0px;
}

.field .field-button .button-container{
        background: -webkit-linear-gradient(0deg, #dbdbdb, #f6f6f6);
        background:    -moz-linear-gradient(0deg, #dbdbdb, #f6f6f6);
        background:      -o-linear-gradient(0deg, #dbdbdb, #f6f6f6);
        background:         linear-gradient(0deg, #dbdbdb, #f6f6f6);
        font-size:1.25vw;
        color:#7a7a7a;
        border:2px solid white;
        outline:1px solid silver;
        padding:0;
        white-space:nowrap;
        cursor:pointer;

        transition:0.5s filter, 0.5s -webkit-filter;
}

.field .field-button .button-container:hover{
        -webkit-filter:contrast(150%);
                filter:contrast(150%);
}

.field.note{
	color:#777;
	padding:0.75vw;
	font-size:1.5vw;
	background  :#f6f6f6;
	outline-color:#f6f6f6;
}

.field.note i{
	color:#666;
}

.field.note .time{
	padding-top:0.25vw;
}

.field.note .time .lbl{
	font-size:1.15vw;
	font-style:italic;
	color:#666;
	padding-right:1vw;
	border-right:1px solid #666;
}

.field.note .time .val{
	display:inline-block;
	margin-left:0.5vw;
	padding:0.2vw;
	font-size:1.15vw;
	font-weight:400;
}

.field.note .time .new{
	-webkit-animation:new-time 0.5s;
	   -moz-animation:new-time 0.5s;
	        animation:new-time 0.5s;
}

.field.note .time-element{
	display:inline-block;
	border:1px solid #ddd;
	background:#fcfcfc;
	padding:0 0.5vw;
	margin:0 0.2vw;
	border-radius:10px;
	font-weight:300;
}

.field.note .time-element.hhmmss{
	font-weight:400;
}

.field.note .bad .time-element{
	background:#833;
	color:#eee;
	border-color:#a55;
}

@-moz-keyframes new-time{
      0% {background:#AFD8FF;}
    100% {background:inherit;}
}

@-webkit-keyframes new-time{
      0% {background:#AFD8FF;}
    100% {background:inherit;}
}

.field.note .time .bad{
	background:#be5a5a;
	border-radius:10px;
}

.field.note .day-header{
	font-weight:400;
}

.field.note .button{
	cursor:pointer;
}

.field.note .button i{
        -webkit-transition:0.5s color;
                transition:0.5s color;
}

.field.note .button:hover i{
	color:#4987ff;
}

.field .date-label{
	font-size:1vw;
	color:#999;
	padding:0 0.5vw;
	margin:0.5vw;
	border:1px solid #ddd;
	border-radius:100px;
	background:#f0f0f0;

        -webkit-transition:0.5s background, 0.5s color;
                transition:0.5s background, 0.5s color;
}

.field.note .button:hover .date-label{
	background:#e7f3f7;
	color:#777;
}

.field .header{
	font-weight:300;
	color:#777;
}

.field .header hr{
	width:35%;
	border-color:#ddd;
	margin-top:0.5vw;
}

.field.home-header{
        background: -webkit-linear-gradient(0deg, #38455d, #6c7d9f);
        background:    -moz-linear-gradient(0deg, #38455d, #6c7d9f);
        background:      -o-linear-gradient(0deg, #38455d, #6c7d9f);
        background:         linear-gradient(0deg, #38455d, #6c7d9f);
	color:#e6e6e6;
	border-color:white;
	outline-color:#395184;
	outline-width:3px;
}

.field.satellites{
	padding:0.25vw;
}

.field.satellites .header div{
	background : #eee;
	color      : #888;
	font-size  : 1.25vw;
	border     : 0.1vw solid white;
	outline    : 0.1vw solid #bbb;
	padding    : 0.2vw;
	margin     : 0.1vw 0.2vw;
	cursor     : pointer;
}

.field.satellites .header div:hover{
	background : #fff;
}

.field.satellites .header div.inactive{
	background:transparent;
	opacity:0.5;
}

.field.satellites .header div.active{
	background    : #5D6D8C;
	color         : #eee;
	outline-color : #5D6D8C;
}

.field .home-title{
	width:32vw;
	display:inline-block;
}

.field .home-title img{
	height:1.5vw;
	margin:-0.5vw 1.5vw 0;
	filter:sepia(0.45) grayscale(0.25);
	opacity:0.8;
}

.field .home-title a{
	font-weight:300;
	color:#f6d7b4;
}

.field .home-title-hr{
	width:calc(50% - 16vw - 1px);
	display:inline-block;
}

.field .home-title-hr hr{
	width:100%;
	margin-bottom:0.5vw;

        -webkit-transition:none;
                transition:none;
}

.field .values{
	font-size:1vw;
	color:#696969;
	padding:0;
}

.field .values table{
	border-collapse:separate;
	border-spacing:0.3vw;
}

.field .values .val table{
	border-spacing:0vw;
	border-collapse:collapse;
	cursor:pointer;
	min-height:1.5vw;
}

.field .values .val table:hover td{
	-webkit-filter:brightness(0.75) contrast(2);
	        filter:brightness(0.75) contrast(2);
}

.field .values .header{
	font-weight:400;
	background:#545e71;
	color:#eee;
	padding:0.25vw 0;
	border:0.1vw solid white;
	outline:0.05vw solid #545e71;
}

.field .values .header.curr-day{
	background   :#5d6d8c;
	outline-color:#5d6d8c;
}

.field .values .header.prev-day{
	background:#f8f8f8;
	color:#5d6d8c;
}

.field .values .header.curr-hour{
	background:#75a7bc;
	// -webkit-animation:curr-hour 3s infinite;
	//    -moz-animation:curr-hour 3s infinite;
	//         animation:curr-hour 3s infinite;
}

@-moz-keyframes curr-hour{
      0% {background:#5d6d8c;}
     50% {background:#82c7e3;}
    100% {background:#5d6d8c;}
}

@-webkit-keyframes curr-hour{
      0% {background:#5d6d8c;}
     50% {background:#82c7e3;}
    100% {background:#5d6d8c;}
}

.field .values .header.future-hour{
	background:#b9c5de;
	outline-color:#b9c5de;
}

.field .values .source{
	font-weight:400;
	background:#eee;
	padding:0.1vw 0;
	border:0.1vw solid #ccc;
	white-space:nowrap;
	overflow:hidden;
}

.field .values .val{
	font-style:italic;
	background:#eee;
	padding:0;
}

.field .values .data-type{
	display:inline-block;
	width:50%;
	text-align:center;
	border:0.1vw solid #ddd;
	background:#eee;
	color:#888;
	cursor:pointer;

	-webkit-transition:0.3s background;
	        transition:0.3s background;
}

.field .values .data-type:nth-child(1){
	border-right:0;
}

.field .values .data-type:hover{
	background:#fff;
}

.field .values .data-type:nth-child(1).active{
	background:#559683;
	color:#eee;
}

.field .values .data-type:nth-child(2).active{
	background:#968055;
	color:#eee;
}

.field .values .date-cell{
	font-size:0.85vw;
	padding:0.1vw;
	background:#5d6d8c;
	outline-color:#5d6d8c;
	font-weight:300;
	font-style:italic;
}

.field .values .header-cell{
	width:16%;
}

.field .values .header-cell table{
	border-collapse:collapse;
	border-spacing:0;
}

.field .values .header-cell td.info{
	width:2vw;
}

.field .values .header-cell .sub-title{
	font-size:0.85vw;
	color:#999;
}

.field .values .header.header-cell .sub-title{
	color:#bbb;
}

.field .values .header-cell i{
	cursor:pointer;
	color:#777;
	opacity:0.75;
}

.field .values .header.header-cell i{
	color:#fff;
}

.field .values .header-cell i:hover{
	opacity:1;
}

.field .values .value-cell{
	width:3.5%;
}

.field .values .val td{
	width:0.5vw;
	height:0.5vh;
	border:0.1vw solid #ccc;
}

.field .description{
	font-size:1vw;
	padding:1vw 1vw 0.5vw;
}

.field .description.about-sds{
	padding:1vw 10vw 0.5vw;
	color:#696969;
}
