:root {
	--mdc-theme-primary:#1b4183;
	--mdc-theme-secondary:#333;
	--mdc-theme-background: #eee;
	--mdc-theme-error: #b00020;
}
/* Custom CSS */
@font-face
{
	font-family:roboto;
	src: url('https://warrior.media/includes/fonts/roboto/roboto.ttf') format('truetype');
}
@font-face
{
	font-family:roboto-light;
	src: url('https://warrior.media/includes/fonts/roboto/roboto-light.ttf') format('truetype');
}
@font-face
{
	font-family:montserrat;
	src: url('https://warrior.media/includes/fonts/montserrat/montserrat.otf');
}
@font-face
{
	font-family:montserrat-light;
	src: url('https://warrior.media/includes/fonts/montserrat/montserrat-light.otf');
}
@font-face
{
	font-family:stringsfree;
	src: url('https://warrior.media/includes/fonts/stringsfree/stringsfree.otf');
}
@font-face
{
	font-family:creattion;
	src: url('https://warrior.media/includes/fonts/creattion/creattion.otf');
}
html {margin:0px;padding:0px;}
body {margin:0px;padding:0px;display:flex;flex-direction:row;box-sizing:border-box;color:#333;font-family:'roboto', sans-serif;background-color:#333}
main {padding-bottom:16px;background:#eee;padding-left:15px;padding-right:15px;}
.main {margin-left:auto;margin-right:auto;max-width:1000px}
.main-content{width:100%}
.mdc-top-app-bar{background:linear-gradient(to bottom right, #1b4183, #262262)}
.bg-indigo{background:linear-gradient(to bottom right, #1b4183, #262262);color:white}
.bg-red{background-color:#ffdddd}
.mdc-toolbar__title {padding:0;}
@media (max-width: 959px) and (orientation: landscape) {.mdc-toolbar__row {min-height:64px;}} /*May become obsolete on future fix - Tablet toolbar row too low*/
.copyright{font-size:10px;color:white;margin-left:auto;margin-right:auto;text-align:center;padding-top:10px;padding-bottom:10px;background-color:#333}
.content {display:inline-flex;flex-direction:column;flex-grow:1;box-sizing:border-box;}
.cushion {margin-top:50px;margin-bottom:20px}
.mdc-typography--headline1{margin-left:auto;margin-right:auto;text-align:center;font-family:'roboto',sans-serif}
.mdc-typography--headline2{font-family:'roboto-light',sans-serif}
.mdc-card{margin-left:auto;margin-right:auto;margin-bottom:15px;border-radius:10px;overflow:hidden}
.white {color:white;}
.red {color:var(--mdc-theme-error)}
.justify{text-align:justify}
.full-width{width:100%;max-width:100%}
.price{margin-bottom:-10px;font-weight:bold;font-size:22px;text-align:right;right:0}
.mdc-layout-grid{padding:0}
.mdc-card__primary{padding-left:10px;padding-right:10px}
.mdc-card__supporting-text{padding-left:10px;padding-right:10px}
.mdc-text-field--textarea .mdc-floating-label {background-color:transparent;}
.mdc-text-field--textarea {margin-right:10px}
.mdc-text-field {margin-top:10px;margin-bottom:10px;width:100%}
.mdc-typography--headline1 {font-size:3rem;line-height:3rem;padding-top:40px;}
.mdc-card__actions{margin-top:15px}
.btn-bottom-right{margin-top:20px;position:fixed;right:0;bottom:0;margin-right:10px;margin-bottom:10px;z-index:2;}
.btn-outline-red{border-color:var(--mdc-theme-error) !important; color:var(--mdc-theme-error) !important;}
.btn-bg-red{background-color:var(--mdc-theme-error) !important; color:#fff}
a.hyper{color:#3B75D9;text-decoration:none;}
a.hyper:visited{color:#1b4183;text-decoration:none;}
a.hyper:hover{color:#6C65C9;text-decoration:none;}
a.no-dec{text-decoration:none;}
.bottom-right{position:absolute;right:0px;}
.mdc-button--outlined:not(:disabled){border-color:#1b4183; color:#1b4183}
.material-icons .mdc-top-app-bar__navigation-icon{z-index:999999}
.mdc-drawer{background-color:#222;color:white}
.mdc-drawer .mdc-drawer__title{color:white}
.mdc-drawer .mdc-drawer__subtitle{color:white}
.mdc-drawer .mdc-list-item, .mdc-drawer .mdc-list-item__graphic, .mdc-drawer .mdc-list-item--activated .mdc-list-item__graphic{color:#3B75D9}
.video-aspect1{width:100%;padding-bottom:56.25%;position:relative;background:#6C65C9;margin-bottom:15px;}
.video-aspect2{width:100%;position:absolute;top:0;bottom:0;left:0;right:0;}
.center-text{text-align:center}
.center{max-width:500px;margin-left:auto;margin-right:auto;overflow:none}
.centered{margin-left:auto;margin-right:auto;}
.round-border{border-radius:10px}
.form-contact_us{max-width:500px;background: rgba(255,255,255,.5);}
.hidden{display:none}
.quote-list{border-top:1px solid #888;max-width:100%;padding:15px}
.quote-total{border-top:2px solid #000;max-width:100%;text-align:right;padding:15px}
.mdc-layout-grid__inner{width:100%}
.mdc-linear-progress__buffer-bar{background-color:transparent !important;}
.mdc-card__action--button{width:100%}
.mdc-text-field-helper-text
{
	margin-top:-25px;
	opacity:opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
	transition: margin-top .2s ease-in-out, opacity .2s ease-in-out;
	-moz-transition: margin-top .2s ease-in-out, opacity .2s ease-in-out;
	-webkit-transition: margin-top .2s ease-in-out, opacity .2s ease-in-out;
	visibility:none;
}
.mdc-text-field--invalid:not(.mdc-text-field--disabled).mdc-text-field--invalid + .mdc-text-field-helper-text--validation-msg
{
	margin-top:-10px;
	opacity:opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
	transition: margin-top .2s ease-in-out, opacity .2s ease-in-out;
	-moz-transition: margin-top .2s ease-in-out, opacity .2s ease-in-out;
	-webkit-transition: margin-top .2s ease-in-out, opacity .2s ease-in-out;
	visibility:visible;
}

/* Remodal */
.remodal{background:transparent !important}

/* Form Field Error Messages */
.messages-error{color:var(--mdc-theme-error, #b00020);transition:0.25s linear all;position:relative;text-align:left}
.messages-error.ng-active {opacity:1;}
.messages-error.ng-inactive {opacity:0;}
.message-error.ng-enter {
	transition:0.25s linear all;
	opacity:0;
	margin-top:-15px;
}
.message-error.ng-enter.ng-enter-active {
	opacity:1;
	margin-top:0;
}
.message-error.ng-leave {
	transition:0.25s linear all;
	opacity:1;
	margin-top:0;
}
.message-error.ng-leave.ng-leave-active {
	opacity:0;
	margin-top:-15px;
}


/* Tinted background */
/* Mobile */
@media (max-width: 959px) and (orientation: portrait) {
	.home-bg {
	  background:
		url("/images/home/bg-home-mobile.jpg") no-repeat center center fixed; ;
		background-size:cover;
	}
}
@media (min-width: 960px) {
.home-bg {
  background: 
    url("/images/home/bg-home.jpg") no-repeat center center fixed; ;
	background-size:cover;
	}}

/* Gradient BG */
/* Mobile */
@media (max-width: 959px) and (orientation: portrait) {
	.bg-gradient1 {
	  background:
		url("/images/bg/bg-gradient1.svg") no-repeat center center fixed; ;
		background-size:cover;
	}
}
@media (min-width: 960px) {
.bg-gradient1 {
  background: 
    url("/images/bg/bg-gradient1.svg") no-repeat center center fixed; ;
	background-size:cover;
	}}

/* Fancy headers */
.fancy{
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.fancy:before,
.fancy:after {
    content: '';
    border-top: 2px solid;
    margin: 0 15px 0 0;
    flex: 1 0 15px;
}

.fancy:after {
    margin: 0 0 0 20px;
}

@media (min-width: 840px) {
	.fancybox-container{top:64px;height:calc(100% - 64px)}
}

@media (min-width: 480px) and (max-width: 839px) {
	.fancybox-container{top:56px;height:calc(100% - 56px)}
}

@media (max-width: 479px) {
	.fancybox-container{top:56px;height:calc(100% - 56px)}
}

/* Grid Image Fade-in */
/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.fade-in {
	opacity:0;  /* make things invisible upon start */
	-webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
	-moz-animation:fadeIn ease-in 1;
	animation:fadeIn ease-in 1;

	-webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	-moz-animation-fill-mode:forwards;
	animation-fill-mode:forwards;

	-webkit-animation-duration:1s;
	-moz-animation-duration:1s;
	animation-duration:1s;
}


.demo-width-class {
  width: 200px;
}