@import url(https://fonts.googleapis.com/css?family=Rubik:300,300i,400,400i,500,500i,700,700i,900,900i);
/* @import url(https://fonts.googleapis.com/css?family=Roboto+Condensed:300,300i,400,400i,700,700i); */

:root {
    --danger: #dc3545;
    --green: #55B150;
    --light: #1964a5;
    --dark: #283d78;
    --grey: #869aa7;
    --light-light: #9ad6fc;
  }


body, html {
    height: 100%;
    width: 100%;
    font-size: 12pt;
    background-color: #1964a5 !important;
 /*   min-width: 1280px;*/
    
}

/* шрифты */

.font-title {
    font-family: "Rubik", sans-serif;
    font-size: 2rem;
    font-weight: normal;
    font-style: normal;
    line-height: 1.05;
}

.font-subtitle {
    font-family: "Rubik", sans-serif;
    font-size: 1.5rem;
    font-weight: normal;
    font-style: normal;
    line-height: 1.5;
}
.font-text {
    font-family: "Rubik", sans-serif;
    font-size: 1.0rem;
    font-weight: normal;
    font-style: normal;
    line-height: 1.7;
}

.font-light{
	color: #1964a5;
}
.font-dark{
	color: #283d78;
}
.font-white{
	color: #ffffff;
}
.font-grey{
	color: #869aa7;
}
.font-light-light{
	color: #9ad6fc;
}
.center {
    text-align: center;
}
.sync-alt {
	overflow: visible;
	width: 1em;
	display: inline-block;
    font-size: inherit;
    height: 1em;
    overflow: visible;
    vertical-align: -.125em;
	background-image: url('svgs/sync-alt.svg') ;
	/* или задать как маску 
	background-color: #1964a5;
    -webkit-mask: url('svgs/sync-alt.svg') no-repeat center;
    mask: url('svgs/sync-alt.svg') no-repeat center;
     или задать как маску */
	
}
.file-import{
	overflow: visible;
	width: 1em;
	display: inline-block;
    font-size: inherit;
    height: 1em;
    overflow: visible;
    vertical-align: -.125em;
	background-image: url('svgs/file-import.svg') ;
	/* или задать как маску 
	background-color: #1964a5;
    -webkit-mask: url('svgs/file-import.svg') no-repeat center;
    mask: url('svgs/file-import.svg') no-repeat center;
     или задать как маску */
}

.file{
    background-repeat:no-repeat;
    padding:3px 10px 0px 0px;
    /*background-size: 22px;*/
}
.file::before{
display: inline-block;
width:1em;
content: url('svgs/file-import-white.svg');
}
.file:hover::before{
content: url('svgs/file-import.svg');
}

.form-file-input[loaded="true"] {
    color: cadetblue;
}

.thumb  {
    padding-right: 0.5em;
}
.check {
	overflow: visible;
	width: 1em;
	display: inline-block;
    font-size: inherit;
    height: 1em;
    overflow: visible;
    vertical-align: -.125em;
	/* background-image: url('svgs/check.svg') ; */
    background-color: var(--green);
    -webkit-mask: url('svgs/check.svg') no-repeat center;
    mask: url('svgs/check.svg') no-repeat center;
}

/* btn-close */


.btn-delete{
    text-align: center;
box-sizing: content-box;
/* width: 1em; */
height: 1em;
/* background-image: url('svgs/window-close.svg'); */
background-color: white;
border: 0;
/* border-radius: .25rem; */
opacity: .5;
/* или задать как маску  */
	background-color: var(--danger);
    -webkit-mask: url('svgs/times.svg') no-repeat center;
    mask: url('svgs/times.svg') no-repeat center;
/* или задать как маску */
}
.pading0{
    padding: 0;
}


.btn-delete:hover {
  text-decoration: none;
  opacity: 0.75;
}

.btn-delete:focus {
  outline: 0;
  box-shadow:#283d77;
  opacity: 1;
}

.btn-delete:disabled,
.btn-delete.disabled {
  pointer-events: none;
  user-select: none;
  opacity: 0.2;
}


.btn-delete-white {
filter:blur(2px); 
}

a {
    text-decoration: none;
}
a:hover {
  color: var(--osn);
  opacity: 0.6;
}