/* Font */

@font-face{font-family:'Open Sans';src:url(fonts/Light/OpenSans-Light.woff2?v=1.101) format("woff2"),url(fonts/Light/OpenSans-Light.woff?v=1.101) format("woff");font-weight:300;font-style:normal}@font-face{font-family:'Open Sans';src:url(fonts/LightItalic/OpenSans-LightItalic.woff2?v=1.101) format("woff2"),url(fonts/LightItalic/OpenSans-LightItalic.woff?v=1.101) format("woff");font-weight:300;font-style:italic}@font-face{font-family:'Open Sans';src:url(fonts/Regular/OpenSans-Regular.woff2?v=1.101) format("woff2"),url(fonts/Regular/OpenSans-Regular.woff?v=1.101) format("woff");font-weight:400;font-style:normal}@font-face{font-family:'Open Sans';src:url(fonts/Italic/OpenSans-Italic.woff2?v=1.101) format("woff2"),url(fonts/Italic/OpenSans-Italic.woff?v=1.101) format("woff");font-weight:400;font-style:italic}@font-face{font-family:'Open Sans';src:url(fonts/Semibold/OpenSans-Semibold.woff2?v=1.101) format("woff2"),url(fonts/Semibold/OpenSans-Semibold.woff?v=1.101) format("woff");font-weight:600;font-style:normal}@font-face{font-family:'Open Sans';src:url(fonts/SemiboldItalic/OpenSans-SemiboldItalic.woff2?v=1.101) format("woff2"),url(fonts/SemiboldItalic/OpenSans-SemiboldItalic.woff?v=1.101) format("woff");font-weight:600;font-style:italic}@font-face{font-family:'Open Sans';src:url(fonts/Bold/OpenSans-Bold.woff2?v=1.101) format("woff2"),url(fonts/Bold/OpenSans-Bold.woff?v=1.101) format("woff");font-weight:700;font-style:normal}@font-face{font-family:'Open Sans';src:url(fonts/BoldItalic/OpenSans-BoldItalic.woff2?v=1.101) format("woff2"),url(fonts/BoldItalic/OpenSans-BoldItalic.woff?v=1.101) format("woff");font-weight:700;font-style:italic}@font-face{font-family:'Open Sans';src:url(fonts/ExtraBold/OpenSans-ExtraBold.woff2?v=1.101) format("woff2"),url(fonts/ExtraBold/OpenSans-ExtraBold.woff?v=1.101) format("woff");font-weight:800;font-style:normal}@font-face{font-family:'Open Sans';src:url(fonts/ExtraBoldItalic/OpenSans-ExtraBoldItalic.woff2?v=1.101) format("woff2"),url(fonts/ExtraBoldItalic/OpenSans-ExtraBoldItalic.woff?v=1.101) format("woff");font-weight:800;font-style:italic}

/* Icon font */						

@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(MaterialIcons-Regular.eot); /* For IE6-8 */
  src: local('Material Icons'),
       local('MaterialIcons-Regular'),
       url(MaterialIcons-Regular.woff2) format('woff2'),
       url(MaterialIcons-Regular.woff) format('woff'),
       url(MaterialIcons-Regular.ttf) format('truetype');
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;

  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;

  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;

  /* Support for IE. */
  font-feature-settings: 'liga';
}


html,
body 				{	height: 100%;
					    width: 100%;
					    -webkit-font-smoothing: antialiased;
					    -moz-osx-font-smoothing: grayscale;
					    font-smoothing: antialiased;
					    text-rendering: optimizeLegibility;
					    font-weight: normal;
					    font-style: normal;
					    font-variant: normal;
					    font-smooth: always;
					    font-family: 'Open Sans', sans-serif;
					    color: #000;
					    
					    min-height: 100%;
						display: flex;
						flex-direction: column;
					    }
					    
					    body {
						    min-height: 100%;
							background-color: #F9F9F9 !important;
							background: url('');
						    background-repeat: no-repeat;
						    background-size: cover;
						    background-position: top center;
							margin: 0;
							padding: 0;
					    }
					    
					    @media (min-height: 800px) { 
	
							body { background-size: contain !important; } 
							
						}
					    
					    @media (min-width: 767px) {
						    body {
							    background-attachment: fixed;
						    }
					    }
					    
					    iframe { border: 0; }
					    
/* 1) Help classes	---------------------------------------------------------*/	

.inline 			{	display: inline-block;}				    
					    
/* Text */

.text-left 			{ 	text-align: left !important }

.text-right 		{ 	text-align: right !important }

.text-center 		{ 	text-align: center !important }

@media (max-width: 767px) {
 
    .text-left-xs 	{ 	text-align: left !important }
    
    .text-right-xs 	{ 	text-align: right !important }
    
    .text-center-xs { 	text-align: center !important }
    
}

.pointer			{	cursor: pointer; }
    					
    					
/* Visibility */    					
    					
.hide 				{ 	display: none !important }

.show 				{ 	display: block !important }

.invisible 			{ 	opacity: 0 !important}

/* Media */
					    
img 				{ 	max-width: 100% }

img + *:not(img)	{	margin-top: 30px !important }

.img--original		{	width: auto !important; max-width: none !important; }

@media (max-width: 767px) {	.img--original { max-width: 100% !important; } }				

.img--full-width 	{ 	width: 100% }

.bg 				{ 	background-size: cover !important;
					    background-position: 50% 50% !important;
					    height: 100%;
					    }	
					    
					    .bg--outside-left {
						    
						    position: fixed;
						    top: 0;
						    left: 0;
						    -webkit-box-shadow: inset -27px 0px 53px -17px rgba(0,0,0,0.75);
							-moz-box-shadow: inset -27px 0px 53px -17px rgba(0,0,0,0.75);
							box-shadow: inset -27px 0px 53px -17px rgba(0,0,0,0.75);
					    }
					    
					    @media (max-width: 767px) {	
						    .bg--outside-left { 
							    position: static; 
							    height: 170px;
							    width: 100%;
							    -webkit-box-shadow: inset 0px -27px 53px -17px rgba(0,0,0,0.75);
								-moz-box-shadow: inset 0px -27px 53px -17px rgba(0,0,0,0.75);
								box-shadow: inset 0px -27px 53px -17px rgba(0,0,0,0.75);
							    } 
						}		
					    
/* Margins */			

.marg-t-30			{	margin-top: 30px;
								
						}		    
		
.marg-b-30			{	margin-bottom: 30px;
								
						}
						
.marg-l-30			{	margin-left: 30px;
								
						}		
						
.marg-l-20			{	margin-left: 20px;
								
						}									
						
						
			    								    											    
					    
/* Position */

.left 				{ 	float: left !important }

.right 				{	float: right !important }

.absolute-center	{	position: absolute;
						top: 50%;
						transform: translateY(-50%);
						}	
						
.flex {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.flex.row:before,
.flex.row:after {
   content: normal; 
}

.flex-wrap {
	-ms-flex-wrap: wrap;
		   flex-wrap: wrap;
}
	@media (max-width: 767px) {
		.flex-wrap-xs {
			-ms-flex-wrap: wrap;
				   flex-wrap: wrap;
		}
	}

.flex-baseline {
	-webkit-box-align: baseline;
	    -ms-flex-align: baseline;
	        align-items: baseline;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
}

.flex-inline {
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.flex-top			{	flex: 1 0 auto;
								
						}						
						
/* Colors */						

.bg-color--white	{	background-color: #fff;
								
						}
					
/* Typography 	---------------------------------------------------------*/	
						
h1,
.title				{	font-size: 22px;
						letter-spacing: 0;
						width: 100%;
						font-weight: 700;
						display: block;
						margin-bottom: 20px;
								
						}
						
						.title img {
							margin-right: 30px;
						}		
						
b					{	font-size: 14px;
						letter-spacing: 0.6px;
						font-weight: 600;		
						}	
						
						b > i {	
							vertical-align: text-bottom;
							margin-left: 10px;
							cursor: pointer;
						}						
						
p 					{	font-size: 14px;
						color: #737373;
						letter-spacing: 0;
						line-height: 21px;
								
						}
						
.table-row p 		{  	font-size: 14px;
						letter-spacing: 0.6px;
						font-weight: 600;
						color: #000;		
						margin: 0;
						}							
						
a					{	font-size: 14px;
						color: #2962FF;
						letter-spacing: 0.6px;
						font-weight: 600;
						text-decoration: none;
								
						}	
						
						a:hover,
						a:focus {
							text-decoration: none;
							color: #5481fb;
						}	
						
						a b,
						a:hover b,
						a:focus b {
							color: #000 !important;
						}
						
						a + br + a {
							line-height: 26px;
						}
						
						.row--footer a,
						.row--footer a:hover,
						.row--footer a:focus {
							font-size: 14px;
							color: #737373;
							letter-spacing: 0;
							line-height: 21px;
							font-weight: 500;
							text-decoration: none;
							padding-left: 20px;
						}	
						
						.row--footer {
							padding-bottom: 30px;
						}			
						
.text--opacity-50	{	opacity: .5;
								
						}		
						
.text--opacity-30	{	opacity: .3;
								
						}	
						
.text--underline	{	text-decoration: underline;
								
						}	
						
						
.text--overflow		{	width: 100%; 
						overflow: hidden;
						white-space: nowrap; 
						-o-text-overflow: ellipsis; 
						text-overflow: ellipsis;
						}																											
						
						
.box 				{	background: #FFFFFF;
						box-shadow: 0 2px 4px 0 rgba(0,0,0,0.08);
						padding: 30px;	
						}	
						
						.flex .box {
							height: 100%;
						}
						
						.box--lg {
							padding: 50px;
						}
						
						.input--error {
							border-color: red;
						}
						
							.input--error + p {
								margin-top: -15px;
								color: red;
							}
						
/* Forms 	---------------------------------------------------------*/	
						
input, select		{	border: none;
						border-bottom: .5px solid #EBEBEB;
						margin: 10px 0 20px 0;
								
						}	
						
						input[type="text"],
						input[type="password"] {
							height: 30px;
							width: 100%;
						}
						
.fileUpload			{	position: relative;
					    overflow: hidden;
						}
					
.fileUpload input.upload {
					    position: absolute;
					    top: 0;
					    right: 0;
					    margin: 0;
					    padding: 0;
					    font-size: 20px;
					    cursor: pointer;
					    opacity: 0;
					    filter: alpha(opacity=0);
					    height: 100%;
						}						
						
.checkbox, .radio {
	display: none;
}
	.checkbox-custom, .radio-custom, .checkbox-disabled {
		width: 20px;
		height: 20px;
		border: 2px solid rgba(0,0,0,.2);
		border-radius: 2px;
		position: relative;
		opacity: 1 !important;
	}
	
	.checkbox-custom, .radio-custom, .checkbox-disabled, .label {
		display: inline-block;
		vertical-align: middle !important;
		cursor: pointer;
	}
	.label {
		color: rgba(0, 0, 0, .5);
		font-size: 14px;
		line-height: 20px;
		padding: 5px ;
	}
	
	.radio:checked+.radio-custom {
		border-color: #2962FF;
	}
	.radio:checked+.radio-custom::before {
		content: " ";
		display: block;
		position: absolute;
		top: 3px;
		right: 3px;
		bottom: 3px;
		left: 3px;
		background: #2962FF;
		border-radius: 2px;
	}
	.radio-custom, .radio:checked+.radio-custom::before {
		border-radius: 50%;
	}
	.checkbox-custom i {
		opacity: 0 !important;
	}
	.checkbox:checked+.checkbox-custom {
		background: #2962FF;
		border-color: #2962FF;
	}
	.checkbox:checked+.checkbox-custom i {
		content: "";
		display: block;
		position: absolute;
		opacity: 1 !important;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		color: #fff;
		font-size: 16px;
		font-weight: 600;
		line-height: normal;
	}
	.checkbox-disabled i {
		opacity: 0 !important;
	}
	.checkbox:checked+.checkbox-disabled {
		background-color: #E1E1E1;
		color: #989898;
	}
	.checkbox:checked+.checkbox-disabled i {
		content: "";
		display: block;
		position: absolute;
		opacity: 1 !important;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		color: #fff;
		font-size: 16px;
		font-weight: 600;
		line-height: normal;
	}

/*
	<label>
		<input class="checkbox" type="checkbox" checked name="checkbox-test">
		<span class="checkbox-custom"><i class="material-icons">check</i></span>
		<span class="label">Checkbox checked</span>
	</label>
	
	<label>
		<input class="radio" type="radio" checked name="radio-test">
		<span class="radio-custom"></span>
		<span class="label">Radio select</span>
	</label>
*/


/* Controls ---------------------------------------------------------*/	

.btn				{	font-size: 14px;
						letter-spacing: 0.6px;
						line-height: 14px;
						padding: 19px 23px;
						outline: none;
						border: none;
						display: inline-block;
						white-space: nowrap;
						vertical-align: middle;
						font-style: normal;
						font-variant: normal;
						text-align: center;
						text-decoration: none;
						-moz-user-select: -moz-none;
						-ms-user-select: none;
						-webkit-user-select: none;
						user-select: none;
						cursor: pointer;
						transition: all 0.3s ease;
						-webkit-transition: all 0.3s ease;
						-moz-transition: all 0.3s ease;
						font-weight: 600;
						}
						
						.btn--main,
						.btn--main:hover,
						.btn--main:focus {
							background-color: #2962FF;
							color: #fff;
						}
						
						.btn--disabled {
							background-color: #E1E1E1;
							color: #989898;
						}
						
						.btn--disabled:hover,
						.btn--disabled:focus {
							cursor: default !important;
							color: #989898;
						}
						
/* Table */	

.table-header,	
.table-row			{	padding: 0 20px;
						width: 100%;	
						/*min-width: 780px;*/
						}				
						
.table-header		{	margin-bottom: 15px;
								
						}						

.table-row			{	margin-bottom: 10px;
						background: #FFFFFF;
						box-shadow: 0 2px 4px 0 rgba(0,0,0,0.08);	
						padding: 0 14px;	
						}
						
						.table-row .row {
							border-bottom: 1px solid #ebebeb;
							    display: flex;
						}
						
						
						.table-row .row,
						.table-row .row p {
							height: 50px;
							line-height: 50px;
						}
						
						.table-row .row a {
							vertical-align: middle;
						}
						
.marker--green,
.marker--red		{	width: 4px;
						height: 49px;
						position: absolute;
						left: 0;
						top: 0;
								
						}	
						
						.marker--green { background-color: #43A047;}
						.marker--red { background-color: #FF5252;}				
						
/* Settings */							
						
.row--shift			{	padding-left: 15px;
								
						}
						
						@media (max-width: 767px) {
							.row--shift {	
								padding-left: 0;
							}
						}
						
.scroll				{	overflow-y: scroll;
								
						}		
/*						
.container-fluid [class*='col-']
					{	max-width: 990px;
													
						}
*/			

/* Pagination ---------------------------------------------------------*/	
	ul.pagination {
		display: inline-flex;
		padding-left: 0;
	}
	
	ul.pagination li {
	    list-style: none;
	}
	
	ul.pagination li span,
	ul.pagination li a {
		font-size: 14px;
	}
	ul.pagination li .material-icons {
		font-size: 24px;
	}

	ul.pagination li:not(:last-child) {
		padding-right: 20px;
	}
	
	ul.pagination li:not(.pagination__page--active) {
		opacity: .3;
	}
	
	.pagination__controls b,
	.pagination__controls i,
	.pagination__controls a,
	ul.pagination li a {
		vertical-align: middle;
		display: inline-block;
		color: #000;
	}
	
	.pagination__controls--disabled {
		opacity: .3
	}			
						
/* Biz layouts ---------------------------------------------------------*/		
					
.row--topbar .row--topbar__mod 		
					{	height: 97px;
						line-height: 97px;
						}	
						
						.row--topbar__mod h1 {
							margin: 0;
						}	
						
						.row--topbar__mod .logo img {
							margin: 0 20px 20px 0;
						}
						
						
.area-left, 
.area-right			{	height: calc(100% - 127px);
						position: absolute;
						overflow: hidden;
						
						}
						
						.area-left {
							width: 285px;
							margin-left: 15px;
						}
						
							.area-left__toggle {
								content: '';
								position: absolute;
								left: 0;
								top: 0;
								border: 20px solid transparent;	
								border-left: 20px solid #EFEFEF; 
								border-top: 20px solid #EFEFEF;
							}
							
								.area-left__toggle > i {
									position: absolute;
									margin: -15px;
									font-size: 16px;
									cursor: pointer;
								}
								
							.area-left--toggle {
								width: 30px;
								padding: 0;
								background: #EFEFEF;
							}
							
							.area-left--toggle i {
								-moz-transform: scale(-1, 1);
								-webkit-transform: scale(-1, 1);
								-o-transform: scale(-1, 1);
								transform: scale(-1, 1);
								filter: FlipH;
								-ms-filter: "FlipH"; 
							} 
						
						.area-right {
							width: calc(100% - 345px);
							margin-left: 330px;
						}
						
							.area-right--toggle {
								margin-left: 45px;
								width: calc(100% - 60px);
							}
						
						.area-left iframe, 
						.area-right iframe {
							width: 100%;
							height: 100%;
							border: none;
						}