@import "../fonts/ubuntumono/ubuntumono.css";
@import "../fonts/firasans/firasans.css";

/*стили, начинающиеся с префикса app- созданы при разработке приложения,
 остальные стили являются модификациями foundation.css (https://get.foundation/)*/


/* Базовые стили на основе foundation.css */

*{
	font-family: 'Fira Sans';
	/*font-family: 'Ubuntu Mono';*/
}
   
body {
	font-size: 12px;
	background: #495d78;
	color: #333;
}

a:link {color: #84c4e2;}
a:visited {color:#84c4e2;}
a:hover {color: #cd82ad;}
a:active {color: #84c4e2;}

 /* Стили приложения (префикс app-).
 Стили производные от foundation.css в html разметке указываются парно:
 tabs app-circuit-load-tabs
- для простоты понимания, что было модифицировано в базовом стиле foundation.css*/

.app-tabs{
	background: #e2e9f8;
}

.app-tabs-title {
  background:#e2e9f8;
  float: both;
}
  
.app-tabs-title > a {
    display: block;
    padding: 0.5rem;
    font-size: 0.75rem;
    line-height: 1;
    color: #1779ba;
}
.app-tabs-title > a:hover {
    background: #ecfff6;
    color: #1468a0;
}
.app-tabs-title > a:focus, .app-tabs-title > a[aria-selected='true'] {
    background: #ffe3d7;
    color: #1779ba;
 }
	  
li.app-tabs-title{
	width: 11%;
}

.app-tabs-content{
	background: #e2e9f8;
	margin:0;
	padding:0;
	border: 0px solid #e6e6e6;
}

.app-tabs-panel {
	margin: 0;
	padding: 0;
  }
  
.app-thumbnail {
  display: inline-block;
  max-width: 80%;
  margin-bottom: 0;
  border: solid 2px #fefefe;
  border-radius: 0;
  box-shadow: 0 0 0 1px rgba(10, 10, 10, 0.2);
  line-height: 0;
 }	 

.app-slider{
	height: 0.3rem;
	margin-top: 0.5rem;
	margin-bottom: 0.75rem;
	padding:0;
	background-color: #bfc4d0;
}

.app-slider-handle {
	width: 0.8rem;
	height: 1.2rem;
	background-color:#2d4e92;
}
.app-slider-handle:hover {
    background-color: #14679e; }
	
.app-slider-fill {
  height: 0.3rem;
  background-color: #95a1b0;
}	  
 
 .app-title{
	margin-top:0.25rem;
	margin-bottom: 0;
	padding-top:0.125rem;
	text-align: center;
	font-size: 0.8rem;
	font-weight: bold;
	background: #e2e9f8;
	color:#2d4e92;
	border: solid 1px #697da1;
}
  
.app-container{
	margin-bottom: 0.25rem;
}

.app-panel{
	margin: 0;
	padding:0;
	border: 1px solid #ccc;
	background: #9cadc5;
	border: solid 1px #697da1;
}

.app-panel{
	margin: 0.125rem;
	padding:0.125rem;
	border: solid 2px #69768e;
	background: #e2e9f8;
}

.app-no-load-circuit-image{
	float:right;
	margin:0;
	padding:0;
	border:0;
	height: 100%;
}
.app-circuit-load-image{
	height: 100%;
}

.app-panel-title{
	margin: 0;
	padding:0;
	font-size: 0.7rem;
	font-weight: bold;
	text-align: center;
	color:#c0c6d5;
	background: #212b68;
}

.app-sliders-panel-title, .app-fixed-slider-title{
	margin-top: 0;
	margin-bottom: 0;
	padding:0;
	font-size: 0.75rem;
	font-weight: bold;
	color:#7d868f;
}

.app-fixed-slider-title{
	margin-top: 0.42rem;
	color:red;
	text-align: right;
}

@media screen and (min-width: 20em) and (max-width: 39.9375em) {
	.app-sliders-panel, .app-fixed-sliders-panel{
		margin: 0;
		padding:0;
	}

	.app-fixed-sliders-panel{
		padding-top: 0.35rem;
	}
}

@media screen and (min-width: 40em) {
	.app-sliders-panel, .app-fixed-sliders-panel{
		margin-top: -0.25rem;
		padding:0;
	}
	
	.app-fixed-sliders-panel{
		padding-top: 0.35rem;
	}	
}

.app-slider-input, .app-fixed-slider-input{
	margin: 0;
	padding:0;
	height: 100%;
	width: 100%;
	font-size: 1rem;
	color:#83ffc0;
	background: #514c7e;
	text-align: right;
	font-weight: bold;
}
.app-fixed-slider-input{
	text-align: center;
	color: red;
}

.app-slider-input:focus, .app-fixed-slider-input:focus{
	background: #514c7e;
}

.app-slider-units{
	margin: 0;
	padding:0;
	text-align: left;
	font-size: 1rem;
	color:#275fbc;
	
}
.app-slider-designation
{
	margin: 0;
	padding:0;
	text-align: right;
	font-size: 1rem;
	font-weight: bold;
	color:#275fbc;
}

.button{
	margin-top: -0.4rem;
	margin-bottom: 0;
	padding: 0 0.25rem;
	border: solid 4px #2d4e92;
}

.app-radio-slider{
	margin-top: 0.5rem;
	margin-bottom: -0.5rem;
}

.app-radio-input{
	margin-left: -0.25rem;
}

.app-radio-label{
	color: #2d4e92;
	font-weight: bold;
}

.app-radio-title{
	margin-top: 0.25rem;
}

#TimeBlock{
	background: #ecfff6;
	padding-top: 0.25rem;
	padding-bottom: 0.25rem;
}
#Oscillograph{
	margin:0;
	padding:0;
	background: #4f4a7c;
}