body{
	font-weight:300;
}


[v-cloak]{
	display: none;
}



.cssldr1{
	height: 100vh;
	display: flex;
	background-color: #d5d8ff; 
	/* #ff8d008c; */
	position: absolute;
	width: 100%;
	z-index: 5000;
}


.cssldr2{
			display: flex;
			position: relative;
			width: 100%;
			z-index: 5000;
			margin-top: 250px;
}


.admin-logo{
	width: 463px;
	height: 73px;
	background-image: url(/SpecDev/MtcUsa/MtcUsa_CCode/dist/logo.jpg);
	background-blend-mode: multiply;
	margin-top: -43px;
	background-color: #06579f;
	position: absolute;
	clip-path: rect(10px, 20px, 30px, 40px);
	margin-left: -13px;
}


/* LOADER ANIMATION */
.app-loader {
  height: 4px;
  width: 100%;
  position: relative;
  overflow: hidden;
  background-color: #ddd;
}
.app-loader:before{
  display: block;
  position: absolute;
  content: "";
  left: -200px;
  width: 200px;
  height: 4px;
  background-color: #2980b9;
  animation: loading 2s linear infinite;
}

@keyframes loading {
    from {left: -200px; width: 30%;}
    50% {width: 30%;}
    70% {width: 70%;}
    80% { left: 50%;}
    95% {left: 120%;}
    to {left: 100%;}
}





.spinner {
  width: 40px;
  height: 40px;

  position: relative;
  margin: 100px auto;
}

.double-bounce1, .double-bounce2 {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #333;
  opacity: 0.6;
  position: absolute;
  top: 0;
  left: 0;
  
  -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
  animation: sk-bounce 2.0s infinite ease-in-out;
}

.double-bounce2 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

@-webkit-keyframes sk-bounce {
  0%, 100% { -webkit-transform: scale(0.0) }
  50% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bounce {
  0%, 100% { 
    transform: scale(0.0);
    -webkit-transform: scale(0.0);
  } 50% { 
    transform: scale(1.0);
    -webkit-transform: scale(1.0);
  }
}










[v-cloak]{
	display: none;
}





/* Enter and leave animations can use different */
/* durations and timing functions.              */
.slide-fade-enter-active {
	transition: all .3s ease;
}
/* .slide-fade-leave-active {
	transition: all .3s cubic-bezier(1.0, 0.5, 0.8, 1.0);
} */
.slide-fade-enter, .slide-fade-leave-to
/* .slide-fade-leave-active below version 2.1.8 */ {
	transform: translateX(10px);
	opacity: 0;
}



/* SLIDE FADE IN-OUT ANIMATES NOT JUST DURING THE IN BUT ALSO DURING THE OUT.
WHICH CAN WORK OK ON SOME CASES AND BAD ON OTHER CASES, NEED TO EVAL THE RESULTS 
VISUALLY EVERY TIME.
*/
.slide-fade-inout-enter-active {
	transition: all .3s ease;
}
.slide-fade-inout-leave-active {
	transition: all .3s cubic-bezier(1.0, 0.5, 0.8, 1.0);
} 
.slide-fade-inout-enter, .slide-fade-inout-leave-to
/* .slide-fade-leave-active below version 2.1.8 */ {
	transform: translateX(10px);
	opacity: 0;
}







/* Enter and leave animations can use different */
/* durations and timing functions.              */
.slidedown-fade-enter-active {
	transition: all 0.3s ease;
}
/* .slide-fade-leave-active {
	transition: all .3s cubic-bezier(1.0, 0.5, 0.8, 1.0);
} */
.slidedown-fade-enter, .slidedown-fade-leave-to
/* .slide-fade-leave-active below version 2.1.8 */ {
	transform: translateY(-10px);
	opacity: 0;
}




/* Enter and leave animations can use different */
/* durations and timing functions.              */
.slideup-fade-enter-active {
	transition: all 0.3s ease;
}
/* .slide-fade-leave-active {
	transition: all .3s cubic-bezier(1.0, 0.5, 0.8, 1.0);
} */
.slideup-fade-enter, .slideup-fade-leave-to
/* .slide-fade-leave-active below version 2.1.8 */ {
	transform: translateY(10px);
	opacity: 0;
}





.deleted{
	opacity:0.5;
	transition:200ms;
}

	.deleted *{
		text-decoration:line-through;
	}



/* FIXING A MARGIN-ISSUE:
	THE FIRST-TAB INSIDE A V-TABS GROUP, GETS A LEFT MARGIN OF 52PX.
	I DON'T KNOW WHY THAT'S HAPPENING OR THE REASON BEING, 
	IT'S INSIDE VUETIFY.MIN.CSS
	I'M OVERRIDING THAT BEHAVIOR HERE.
	!! THERE MIGHT BE SIDE-EFFECTS !!  
*/
/* .v-application--is-ltr .v-tabs-bar.v-tabs-bar--is-mobile:not(.v-tabs-bar--show-arrows)>.v-slide-group__wrapper>.v-tabs-bar__content>.v-tab:first-child,.v-application--is-ltr .v-tabs-bar.v-tabs-bar--is-mobile:not(.v-tabs-bar--show-arrows)>.v-slide-group__wrapper>.v-tabs-bar__content>.v-tabs-slider-wrapper+.v-tab {
	margin-left: 0px !important;
}

.v-application--is-rtl .v-tabs-bar.v-tabs-bar--is-mobile:not(.v-tabs-bar--show-arrows)>.v-slide-group__wrapper>.v-tabs-bar__content>.v-tab:first-child,.v-application--is-rtl .v-tabs-bar.v-tabs-bar--is-mobile:not(.v-tabs-bar--show-arrows)>.v-slide-group__wrapper>.v-tabs-bar__content>.v-tabs-slider-wrapper+.v-tab {
	margin-right: 0px !important;
}
 */


.str{
	font-weight: bold;
}



.tiptap-legend{
    font-size: 13px;
    position: absolute;
    margin-left: 10px;
    margin-top: -13px;
    background-color: white;
    padding: 5px;
    color: rgb(173, 173, 173);
}

/* 
Removing the bottom margin on P tags on the Tip-Tap editor.
We can review this later if it looks too cluttered.
 */
.ProseMirror p{
	margin-bottom:0px;
}




/*
The title on our dialogs are word-breaking. 
We want to prevent that by overriding the default vuetify style. 
*/
.v-dialog .v-card__title{
	word-break: initial !important;
}


.auth_code{
		max-width: 95%;
    overflow: hidden;
    text-overflow: ellipsis;
		white-space: nowrap !important;
		letter-spacing: 3.5px;
		width:100%;
}
.auth_code_inline{
	letter-spacing: 3.5px;
		width:100%;
}

.auth_code_thru{
	text-decoration: line-through;
	opacity: 0.5;
}

.order-notes{
background-color: #73737340;
    margin-left: -20px;
    margin-right: -20px;
    padding-left: 20px;
    padding-top: 10px;
    color: black;
	}




	
	.was-validated .form-control.dont-validate:valid {
    border:1px solid #ced4da !important;
    padding-right: inherit !important;
		background-image: inherit !important;
	}

	.was-validated .form-control.dont-validate:valid:focus {
    color: #495057 !important;
    background-color: #fff !important;
    border-color: #80bdff !important;
    outline: 0 !important;
		box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25) !important;
	}


	.form-control.is-invalid, .was-validated .form-control:invalid {
    border-color: #dc3545;
    padding-right: calc(1.5em + .75rem);
    background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23dc354…%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E);
    background-repeat: no-repeat;
    background-position: center right calc(.375em + .1875rem);
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}

.form-control.is-valid, .was-validated .form-control:valid {
	border-color: #28a745;
	padding-right: calc(1.5em + .75rem);
	background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8… 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e);
	background-repeat: no-repeat;
	background-position: center right calc(.375em + .1875rem);
	background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}



.cart-thin-line{
	border: 1px solid black;
	padding: 10px;
	margin-left:-10px;
	display: inline-block;
}


.cart-thin-line h1{
	display: inline;
}

.cart-label{
	display: block;
	font-weight: bold;
	margin-bottom:0px;
}

.cart-catalog{
	font-weight: bold;
	font-size: 18px;
}


.cart-strong{
	font-weight: bold !important;
}


.cart-total-warn{
	padding: 5px;
	margin-left: -10px;
	background-color: yellow;
	margin-right: -10px;
	margin-bottom: -10px;
}


.cart-button-equal{
	min-width: 120px !important;
}

.export-alerts .v-alert
{
	margin-bottom: 1px;
}



.mycode{
	word-break: break-all;
	max-height: 25px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.mycode:hover{
	max-height: 500px;
	transition: 500ms;
}

.mycode:after, .mycode:before, .mycode:after, .mycode:before {
	content: "" !important;
}


.order-is-deleted{
	text-decoration: line-through;
  opacity: 0.5;
}


.cart-price-not{
	text-decoration: line-through;
 }
 
 .cart-price-sched{
	 color: green;
 }
 
 .cart-price-quote{
	 color: red;
 }
 
 .cart-quote-group{
	 font-size: 11px;
 }
 .cart-quote-num{
	 background-color: #e2e2e2;
	 border-radius: 2px;
	 padding: 2px 5px;
 }
 

 


 
.admin-price-not{
	text-decoration: line-through;
 }
 
 .admin-price-sched{
	 color: green;
 }
 
 .admin-price-quote{
	 color: red;
 }
 
 .admin-quote-group{
	 font-size: 11px;
 }
 .admin-quote-num{
	 background-color: #e2e2e2;
	 border-radius: 2px;
	 padding: 2px 5px;
 }