@import url('https://fonts.googleapis.com/css?family=Work+Sans:300,500,600,700');

:root {
	--dw-white: #fff;
	--dw-red: #c60104;                /* Theme: Links, buttons */
	--dw-red-dark: #900002;
	--dw-red-faint: #e6bebe;          /* Faint red hue */
	--dw-gray-light2: #f7f7f7;		  /* Front page gray bg */
	--dw-gray-light: #e2e2e2;
	--dw-gray-mid1: #393939;          /* Placeholder text */
	--dw-gray-mid2: #b2b2b2;          /* Glyphs and icons */
	--dw-gray-dark1: #111;            /* Body and title */
	--dw-gray-dark2: #212121;         /* Footer */
	--dw-yellow: #f7d43f;             /* Rating stars */

	/*--dw-btn-red-nor-hover:#900002;*/
	--dw-btn-red-inv-hover: #ffebec;
	--dw-btn-white-nor-hover:#b2b2b2;
	--dw-btn-white-inv-hover:#b2b2b2;
	--dw-link-red: #900002;


	--dw-color-theme: #c60104;
	--dw-color-open: #9fc102;
	--dw-color-accepted: #edc82b;
	--dw-color-declined: #8e0002;
	--dw-color-completed: #939393;
	--dw-color-border: #dcdcdc;
	--dw-client-theme: #2b4644;
	--dw-pilot-theme: #32486c;

	--dw-font-light: 300;                  /* Body txt */
	--dw-font-regular: 400;
	--dw-font-medium: 500;                 /* Button txt */
	--dw-font-semibold: 600;               /* Sub header, bold in body and text links */
	--dw-font-bold: 700;                   /* Main title and slogan */
	--dw-font-superbold: 900;              /* Quote icon */

	--dw-font-xs: calc(10px + (13 - 10) * ((100vw - 300px) / (3200 - 300))); /*gallery avatar instructions 9.35172L, 10.2345P */
	--dw-font-sm: calc(13.2px + (16 - 13.2) * ((100vw - 300px) / (3200 - 300))); /* ok */ /* side menu sub 14.1462L, 14.7641P */
	--dw-font-base: calc(14.5px + (17 - 14.5) * ((100vw - 300px) / (3200 - 300)));  /* description text 15.3448L, 15.89668P */
	--dw-font-md: calc(16px + (19 - 16) * ((100vw - 300px) / (3200 - 300))); /* ok */ /* side menu main  17.0138L, 17.6759P*/
	--dw-font-lg: calc(25px + (31 - 25) * ((100vw - 300px) / (3200 - 300))); /* portfolio side name 27.0276L, 28.3517P*/
	--dw-font-xl: calc(32px + (42 - 32) * ((100vw - 300px) / (3200 - 300))); /*flight time number  35L, 37.5862P */
	--dw-font-xxl: calc(44px + (54 - 44) * ((100vw - 300px) / (3200 - 300)));  /* unused */
	--dw-font-xxxl: calc(54px + (66 - 54) * ((100vw - 300px) / (3200 - 300))); /*portfolio banner name 58.0552L, 60.7034P */

	/*gallery avatar instructions */
	--dw-font-xs: calc(9px + (26 - 9) * ((100vw - 300px) / (3200 - 300)));            /* 9.35172L, 10.2345P */ 
	/* side menu sub */
	/*--dw-font-sm: calc(11.2px + (19.2 - 11.2) * ((100vw - 300px) / (3200 - 300)));    /* 13.9034L, 15.669P */
	--dw-font-sm: calc(12px + (23 - 12) * ((100vw - 300px) / (3200 - 300)));    /* 13.9034L, 15.669P */
	
	/* description text, side menu main */
	--dw-font-base: calc(15px + (30.5 - 15) * ((100vw - 300px) / (3200 - 300)));  /* 15.3448L, 18.969P */
	/* portfolio header */
	--dw-font-md: calc(17.1px + (40.5 - 17.1) * ((100vw - 300px) / (3200 - 300)));    /* 19.9386L, 22.1014P*/ 
	/* portfolio side name */
	--dw-font-lg: calc(22px + (35 - 22) * ((100vw - 300px) / (3200 - 300)));          /* 27.0276L, 30.5862P*/
	/*flight time number */
	--dw-font-xl: calc(32px + (42 - 32) * ((100vw - 300px) / (3200 - 300)));          /* 35L, 37.5862P */
	/* unused */
	--dw-font-xxl: calc(44px + (54 - 44) * ((100vw - 300px) / (3200 - 300))); 		  /* 43~45L, 46~48P */
	/*portfolio banner name */
	--dw-font-xxxl: calc(54px + (66 - 54) * ((100vw - 300px) / (3200 - 300)));        /* 58.0552L, 60.7034P */


	/*--dw-font-xs: 18px;
	--dw-font-sm: 20px;
	--dw-font-base: 24px;
	--dw-font-md: 26px;
	--dw-font-lg: 30px;
	--dw-font-xl: 40px;
	--dw-font-xxl: 50px;
	--dw-font-xxxl: 70px;

	--dw-font-xs: 12px;
	--dw-font-sm: 14px;
	--dw-font-base: 18px;
	--dw-font-md: 20px;
	--dw-font-lg: 24px;
	--dw-font-xl: 30px;
	--dw-font-xxl: 40px;
	--dw-font-xxxl: 50px;*/

	/*--dw-font-xs: calc(9px + (26 - 9) * ((100vw - 300px) / (3200 - 300)));   */

	
	--dw-font-xs: calc(10px + (15 - 10) * ((100vw - 400px) / (1920 - 400)));
	--dw-font-sm: calc(13px + (18 - 13) * ((100vw - 400px) / (1920 - 400)));
	--dw-font-base: calc(16px + (22 - 16) * ((100vw - 400px) / (1920 - 400)));
	--dw-font-md: calc(19px + (25 - 19) * ((100vw - 400px) / (1920 - 400)));
	--dw-font-lg: calc(23px + (29 - 23) * ((100vw - 400px) / (1920 - 400)));
	--dw-font-xl: calc(29px + (39 - 29) * ((100vw - 400px) / (1920 - 400)));
	--dw-font-xxl: calc(39px + (49 - 39) * ((100vw - 400px) / (1920 - 400)));
	--dw-font-xxxl: calc(50px + (70 - 50) * ((100vw - 400px) / (1920 - 400)));
	/*--dw-font-xs: calc(100vw / (1920 - 400));*/
	/*--dw-font-xs: calc(100vw * (( 18 - 12) / (1920 - 400)));*/
	/*--dw-font-sm: calc(100vw * (( 20 - 14) / (1920 - 400)));*/
	/*--dw-font-base: calc(100vw * (( 24 - 18) / (1920 - 400)));*/
	/*--dw-font-md: calc(100vw * (( 26 - 20) / (1920 - 400)));*/
	/*--dw-font-lg: calc(100vw * (( 30 - 24) / (1920 - 400)));*/
	/*--dw-font-xl: calc(100vw * (( 40 - 30) / (1920 - 400)));*/
	/*--dw-font-xxl: calc(100vw * (( 50 - 40) / (1920 - 400)));*/
	/*--dw-font-xxxl: calc(100vw * (( 70 - 50) / (1920 - 400)));*/


	/*--dw-radius: 7px;*/
	/*--dw-padding: 15px;*/
	/*--dw-grid-gutter: 5px;*/
	/*--dw-header-height: 60px;*/
}

@media (min-width: 576px){ /* sm */

	/*h1{
		color: red;
	}*/
}
@media (min-width: 768px){ /* md */
	/*:root {
		--dw-font-xs: calc(8px + (10 - 8) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-sm: calc(11px + (13 - 11) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-base: calc(13px + (15 - 13) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-md: calc(15px + (18 - 15) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-lg: calc(18px + (22 - 18) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-xl: calc(24px + (34 - 24) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-xxl: calc(39px + (45 - 39) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-xxxl: calc(44px + (59 - 44) * ((100vw - 400px) / (1920 - 400)));
	}*/
	/*h1{
		color: green;
	}*/
}
@media (min-width: 992px){ /* lg 100%*/
	:root {
		--dw-font-xs: calc(8px + (10 - 8) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-sm: calc(10.5px + (13.5 - 10.5) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-base: calc(14.5px + (17.5 - 14.5) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-md: calc(17px + (20 - 17) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-lg: calc(21px + (25 - 21) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-xl: calc(24px + (34 - 24) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-xxl: calc(39px + (45 - 39) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-xxxl: calc(44px + (59 - 44) * ((100vw - 400px) / (1920 - 400)));
	}
	/*h1{
		color: orange;
	}*/
}
@media (min-width: 1200px){ /* xl 67% */
	:root{
		--dw-font-xs: calc(9px + (14 - 9) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-sm: calc(11px + (15 - 11) * ((100vw - 400px) / (1920 - 400))); /** ok  **/
		--dw-font-base: calc(13px + (20 - 13) * ((100vw - 400px) / (1920 - 400))); /** ok  **/
		--dw-font-md: calc(15px + (22 - 15) * ((100vw - 400px) / (1920 - 400)));; /** ok  **/
		--dw-font-lg: calc(16px + (25 - 16) * ((100vw - 400px) / (1920 - 400))); /** ok  **/
		--dw-font-xl: calc(28px + (38 - 28) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-xxl: calc(38px + (48 - 38) * ((100vw - 400px) / (1920 - 400)));
		--dw-font-xxxl: calc(49px + (69 - 49) * ((100vw - 400px) / (1920 - 400)));
	}
	/*h1{
		color: blue;
	}*/
}

html{
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}

html, body {
	/*overflow: hidden;*/
	margin: 0px;
	padding: 0px;
	height: 100%; /* need to have this to align vertically on big screens*/
	/*font-size: 62.5%;*/
	font-size: 13px;
}

body {
	font-family: 'Work Sans', sans-serif;
	font-size: var(--dw-font-base);
	font-weight: var(--dw-font-light);
	color: #111;
	background-color: #f7f7f7;
}
textarea{
	font-family: 'Work Sans', sans-serif;
	font-size: var(--dw-font-sm);
	font-weight: var(--dw-font-light);
}
/* Typorgraphy -------------------------------------------------------------- */
h1,
h2,
h3,
h4,
h5,
h6,
strong {
 	font-weight: var(--dw-font-semibold);
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a { 
 	color: inherit;
}
h1 {
   font-size: var(--dw-font-xxxl);
   line-height: var(--dw-font-xxxl);
}
h2 {
   font-size: var(--dw-font-xl);
   line-height: var(--dw-font-xl);
}
h3 {
   font-size: var(--dw-font-lg);
}
h4 {
   font-size: var(--dw-font-md);
}
h5 {
   font-size: var(--dw-font-base);
}
h6 {
 	font-size: inherit;
 	color: #b2b2b2;
  	margin-bottom: 0;
}
h1,h2,h3, h4, h5, h6{
	padding: 0;
   	margin: 0;
}

.dw-font-xs{
	font-size: var(--dw-font-xs);
}
.dw-font-sm{
	font-size: var(--dw-font-sm);
}
.dw-font-base{
	font-size: var(--dw-font-base);
}
.dw-font-md{
	font-size: var(--dw-font-md);
}
.dw-font-lg{
	font-size: var(--dw-font-lg);
}
.dw-font-xl{
	font-size: var(--dw-font-xl);
}
.dw-font-xxl{
	font-size: var(--dw-font-xxl);
}
.dw-font-xxxl{
	font-size: var(--dw-font-xxxl);
}

.dw-font-light{
	font-weight: var(--dw-font-light);
}
.dw-font-strong{
	font-weight: var(--dw-font-medium);
}
.dw-font-semibold{
	font-weight: var(--dw-font-semibold);
}
.dw-font-bold{
	font-weight: var(--dw-font-bold);
}
.dw-font-superbold{
	font-weight: var(--dw-font-superbold);
}

/* Font colors -------------------------------------------------------------- */
.font-gray{
	color: var(--dw-gray-mid2);
}
.font-red{
	color: var(--dw-color-theme);
}
.font-faint-red{
	color: var(--dw-red-faint);
}
/* Backgrounds -------------------------------------------------------------- */
.bg-white{
	background-color: white;
}
.bg-light {
  background-color: #ededed;
}
/* Avatars ------------------------------------------------------------------- */
.avatar{
	border-radius: 50%;
	object-fit:cover;
}
.avatar-xs {
	/*width: 48px;
	height: 48px;*/
	width: calc(48px + (50 - 48) * ((100vw - 300px) / (2880 - 300))); 
  	height: calc(48px + (50 - 48) * ((100vw - 300px) / (2880 - 300))); 
}
.avatar-sm{
	/*width: 64px;
	height: 64px;*/
	width: calc(64px + (70 - 64) * ((100vw - 300px) / (2880 - 300))); 
  	height: calc(64px + (70 - 64) * ((100vw - 300px) / (2880 - 300))); 
}
.avatar-md {
  /*width: 72px;
  height: 72px;*/
  width: calc(72px + (80 - 72) * ((100vw - 300px) / (2880 - 300))); 
  height: calc(72px + (80 - 72) * ((100vw - 300px) / (2880 - 300))); 
}
.avatar-lg {
  width: calc(128px + (150 - 128) * ((100vw - 300px) / (2880 - 300))); 
  height: calc(128px + (150 - 128) * ((100vw - 300px) / (2880 - 300))); 

  /*width: 128px;
  height: 128px;*/
}
.avatar-clickable{
	cursor: pointer;
}

.shadow{
	-webkit-box-shadow: 0px 7px 8px -3px rgba(57,73,76,.35);
	-moz-box-shadow: 0px 7px 8px -3px rgba(57,73,76,.35);
	box-shadow: 0px 7px 8px -3px rgba(57,73,76,.35);
}

.align-center{
	text-align: center;
}
.align-left{
	text-align: left;
}
.align-right{
	text-align: right;
}

/* Links -------------------------------------------------------------------- */
a,
.link {
    font-weight: var(--dw-font-semibold);
    color: #c60104;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    text-decoration: none;
}
a:hover,
a:focus,
.link:hover,
.link:focus {
    color: #900002;
    text-decoration: none;
}
.link {
    cursor: pointer;
}
/* .link-sm {
    font-size: .875rem;
    white-space: nowrap;
}*/

/* Buttons ------------------------------------------------------------------ */
.btn {
    font-weight: var(--dw-font-medium);
    padding: .85rem 1.25rem;
    border-radius: .5rem;
    font-size: var(--dw-font-sm);
    /*font-size: inherit;*/
    cursor: pointer;
}
.btn-sm{
	font-weight: var(--dw-font-regular);
    padding: .45rem .6rem;
    border-radius: .5rem;
	font-size: var(--dw-font-sm);
	cursor: pointer;
}
.btn-block{
    width: 100%;
    display: block;
}
.btn-default {
    min-width: 90px;
    color: #fff;
    background-color: #c60104;
    transition: color .2s,background .2s;
}
.btn-default:hover,
.btn-default:focus,
.btn-default.active {
    color: #fff;
    background-color: #900002;
}

.btn-outline-red {
  color: #c60104;
  background-color: #fff;
  border: 1px solid #c60104;
}
.btn-outline-red:hover,
.btn-outline-red:focus,
.btn-outline-red.active {
  background-color: #ffebec;
}

.btn.disabled, .btn-sm.disabled{
    background-color: var(--dw-gray-light2);
    color: var(--dw-gray-mid2);
    cursor: not-allowed;
    border: solid 1px var(--dw-gray-mid2);
}

/* used by name on nav bar */
.dw-link:hover {
  color: var(--dw-color-theme);
}


/*override defaults */
.vform-label{
    font-weight: var(--dw-font-semibold);
    font-size: var(--dw-font-base);
    margin-bottom: .5rem;
    display: inline-block;
    padding: 0px calc(.75rem + 1px);
}
input.vform-control{
    padding: 1rem 3.5rem 1rem 1rem;
    font-size: var(--dw-font-sm);
    margin-bottom: .8rem;
}
.vform-icon-feedback{
    top: 14px !important; 
}
.vform-feedbackdiv{
    margin-bottom: .8rem !important;
    font-size: var(--dw-font-sm);
}
.vform-control.disabled,
.vform-control[readonly]{
    background-color: #e9ecef;
    opacity: 1;
}

/* minified loader in merx-set to standardize with js */
/* Preloader ---------------------------------------------------------------- */
/*.preloader {
	position: fixed;
	display: flex;
	justify-content: center;
	align-items: center;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-color: rgba(255,255,255,.6);
	z-index: 99999;
}
.loader {
	display: inline-block;
	width: 64px;
	height: 64px;
}
.loader:after {
	content: " ";
	display: block;
	width: 64px;
	height: 64px;
	margin: 1px;
	border-radius: 50%;
	border: 7px solid #fff;
	border-color: #c60104 transparent #212121 transparent;
	opacity: .9;
	animation: dual-ring 1.2s linear infinite;
}
@keyframes dual-ring {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}*/


.dw-maincontainer{
	width: 100%;
	margin-left: 0;
	height: 100%;
	padding: 5rem 3rem;
	position: relative;
	top: 60px;
}

/** fade **/
@-webkit-keyframes fade-in {
	0% {opacity: 0;}
    100% { opacity: 1; }
}

@keyframes fade-in {
	0% {opacity: 0;}
    100% { opacity: 1; }
}

@-webkit-keyframes fade-out {
	0% {opacity: 1;}
    100% { opacity: 0; }
}

@keyframes fade-out {
	0% {opacity: 1;}
    100% { opacity: 0; }
}

.portal-logo{
	width:100px;
}

@media (min-width: 576px){ /* sm */
}
@media (min-width: 768px){ /* md */
	
}
@media (min-width: 992px){ /* lg */
	.dw-maincontainer{
		width: calc(100% - 18rem);
		margin-left: 18rem;
	}
	.portal-logo{
		width: calc(100px + (110 - 100) * ((100vw - 300px) / (2880 - 300))); 
	}
}
@media (min-width: 1200px){ /* xl */
	.portal-logo{
		width: calc(110px + (130 - 110) * ((100vw - 300px) / (2880 - 300))); 
	}
}

/** fontawesome stacks */
.fa-stack{
	height: inherit;
	width: inherit;
}
.fa-2x{
	font-size: inherit;
}

/** menu btn **/
.menu-home{
	cursor: pointer;
}