@import url("https://fast.fonts.net/lt/1.css?apiType=css&c=a490125a-f0ce-487d-ba95-f28422bea247&fontids=883327");
@font-face{
	font-family:"Papyrus W01";
	src:url("Fonts/883327/01fb9a9b-55ce-4693-b692-bd99b3c70400.woff2") format("woff2"),url("Fonts/883327/2fe0bd0f-bd5a-4ed4-8c63-1876362fdf8c.woff") format("woff");
}

html, body {
	height: 100%;
}
body {
	font-family: Papyrus;
	font-weight: bold;          
	overflow-x: hidden;        
}

	/* a,
	a:link,
	a:visited,
	a:hover, /* OPTIONAL*/
	/*a:active{ 
		text-decoration-none;	
	} */

input.invalid {
	border: 1px solid red; 
}
.eror-hint {
	color: red;
}

/*--- Bootstrap Padding Fix --*/
[class*="col-"] {
    padding: 1rem;
}


/*--- Media Queries ---
@media screen and (min-width: 1201px) and (max-width: 1800px{*/
/* 
@include media-breakpoint-only(xs) { 
	.carousel-caption h1 {
		margin-bottom: 0.5rem;
		font-size: medium;
		font-weight: bold;
		color: yellow!important;
		line-height: 0.1;
		padding-top: 4rem;
	  }
	  .carousel-indicators {
		display: none;
	  }
	  .carousel-control-prev-icon {
		display: none;
	  }
	  .carousel-control-next-icon {
		display: none;
	  }
	  .carousel-caption, text {
		padding-top: 4rem; 
		bottom: 0.5rem!important;
		padding-bottom: 0.2rem!important; 
	  }
	  .text-end {
		text-align: right!important;
		right: 3%!important;
	}
	  .btn-group-lg>.btn, .btn-lg {
		  padding-top: 0.5rem;
	  }
	  .navbar-brand {
		font-size: medium;
	  }
	  .featurette-heading {
		margin-top: 2rem;
	  }
	  .btn-group-lg>.btn, .btn-lg {
		font-size: 0.75rem;
		margin-top: 0.3rem;
	  }
	  .navbar-toggler {
		font-size: small;
		margin-right: 1rem;
	  }
	  .nav-item {
		  margin-left: 0.75rem;
	  }
	  .h1 {
		font-size: medium;
	  }
	  .mt1 {
		margin-top: 1rem;
		}
		.mt4 {
		margin-top: 4rem;
		}
		.mt8 {
		margin-top: 4rem;
		}
		.mt10 {
			margin-top: 10rem;
		}
		.mt12 {
			margin-top: 12rem;
		}
		.pt10 {
			padding-top: 10rem;
		}
	  .float-end {
		font-size: small;
		padding-top: 3rem;
	  }
 } */

 
	@media only screen 
		and (min-width: 0px) 
		and (max-width: 320px) 
		and (-webkit-min-device-pixel-ratio: 1){	
		.carousel-caption h1 {
			margin-bottom: 0.5rem;
			font-size: medium;
			font-weight: bold;
			color: yellow!important;
			text-shadow: 2px 3px 5px #000 !important;
			line-height: 0.1;
			padding-top: 4rem;
		  }
		  .carousel-indicators {
			display: none;
		  }
		  .carousel-control-prev-icon {
			display: none;
		  }
		  .carousel-control-next-icon {
			display: none;
		  }
		  .carousel-caption, text {
			padding-top: 4rem; 
			bottom: 0.5rem!important;
			padding-bottom: 0.2rem!important; 
		  }
		  .text-end {
			text-align: right!important;
			right: 3%!important;
		}
		  .btn-group-lg>.btn, .btn-lg {
			  padding-top: 0.5rem;
		  }
		  .navbar-brand {
			font-size: medium;
		  }
		  .featurette-heading {
			margin-top: 2rem;
		  }
		  .btn-group-lg>.btn, .btn-lg {
			font-size: 0.75rem;
			margin-top: 0.3rem;
		  }
		  .navbar-toggler {
			font-size: small;
			margin-right: 1rem;
		  }
		  .nav-item {
			  margin-left: 0.75rem;
		  }
		  .h1 {
			font-size: medium;
		  }
		  .mt1 {
			margin-top: 1rem;
			}
			.mt4 {
			margin-top: 4rem;
			}
			.mt6 {
				margin-top: 6rem;
			}
			.mt8 {
			margin-top: 4rem;
			}
			.mt10 {
				margin-top: 10rem;
			}
			.mt12 {
				margin-top: 12rem;
			}
			.pt10 {
				padding-top: 10rem;
			}
		  .float-end {
			font-size: small;
			padding-top: 3rem;
		  }
		}
	

@media only screen 
	and (min-width: 321px) 
	and (max-width: 400px)
	and (-webkit-min-device-pixel-ratio: 1){	
	.carousel-caption h1 {
		margin-bottom: 0.5rem;
		font-size: medium;
		font-weight: bold;
		color: yellow!important;
		text-shadow: 2px 3px 5px #000 !important;
		line-height: 0.1;
		padding-top: 4rem;
	  }
	  .carousel-indicators {
		display: none;
	  }
	  .carousel-control-prev-icon {
		display: none;
	  }
	  .carousel-control-next-icon {
		display: none;
	  }
	  .carousel-caption, text {
		padding-top: 4rem; 
		bottom: 1.7rem!important;
		padding-bottom: 2rem!important; 
	  }
	  .text-end {
		text-align: right!important;
		right: 3%!important;
	}
	  .btn-group-lg>.btn, .btn-lg {
		  padding-top: 0.5rem;
	  }
	  .navbar-brand {
		font-size: medium;
	  }
	  .featurette-heading {
		margin-top: 2rem;
	  }
	  .btn-group-lg>.btn, .btn-lg {
		font-size: 0.75rem;
		margin-top: 0.3rem;
	  }
	  .navbar-toggler {
		font-size: small;
		margin-right: 1rem;
	  }
	  .nav-item {
		  margin-left: 0.75rem;
	  }
	  .h1 {
		font-size: medium;
	  }
	  .mt1 {
		margin-top: 1rem;
		}
		.mt4 {
		margin-top: 4rem;
		}
		.mt6 {
			margin-top: 6rem;
		}
		.mt8 {
		margin-top: 4rem;
		}
		.mt10 {
			margin-top: 10rem;
		}
		.mt12 {
			margin-top: 12rem;
		}
		.pt10 {
			padding-top: 10rem;
		}
	  .float-end {
		font-size: small;
		padding-top: 3rem;
	  }
	}


@media only screen 
	and (min-width: 401px) 
	and (max-width: 600px)
	and (-webkit-min-device-pixel-ratio: 1){
	.carousel-caption h1 {
		margin-bottom: 0.5rem;
		font-size: 1.3rem;
		font-weight: bold;
		color: yellow!important;
		text-shadow: 2px 3px 5px #000 !important;
		line-height: 0.1;
		padding-top: 4rem;
	  }
  
	  /* .carousel-indicators {
		  display: none;
		} */
	
	  .carousel-caption, text {
		padding-top: 3rem;
		bottom: 1rem!important;
		padding-bottom: 4rem!important;  
	  }
  
	  .text-end {
		  text-align: right!important;
		  right: 3%!important;
	  }
	
	  .btn-group-lg>.btn, .btn-lg {
		  border-radius: 0.3rem;
	  }
  
	  .navbar-brand {
		font-size: medium;
	  }
	  .featurette-heading {
		margin-top: 2rem;
	  }
	  .btn-group-lg>.btn, .btn-lg {
		font-size: small;
	  }
	  .navbar-toggler {
		font-size: small;
		margin-right: 1rem;
	  }
	  .nav-item {
		  margin-left: 0.75rem;
	  }
	  .h1 {
		font-size: medium;
	  }
	  .mt1 {
		margin-top: 1rem;
		}
		.mt4 {
		margin-top: 4rem;
		}
		.mt6 {
			margin-top: 6rem;
		}
		.mt8 {
		margin-top: 8rem;
		}
		.mt10 {
			margin-top: 10rem;
		}
		.mt12 {
		  margin-top: 12rem;
		  }
		.pt10 {
			padding-top: 10rem;
		}
	  .float-end {
		font-size: small;
		padding-top: 3rem;
	  }
	}

@media only screen 
	and (min-width: 601px) 
	and (max-width: 992px)
	and (-webkit-min-device-pixel-ratio: 1){
	.carousel-caption h1 {
		margin-bottom: 1rem;
		font-size: 1.5rem;
		font-weight: bold;
		color: yellow!important;
		text-shadow: 2px 3px 5px #000 !important;
		line-height: 0.1;
		padding-top: 4rem;
	  }
	  .carousel-indicators {
		  display: none;
	  }  
	  .carousel-caption, text {
		padding-top: 3rem;  
		bottom: 5rem!important;
		padding-bottom: 7rem!important;
	  }
	  .text-end {
		  text-align: right!important;
		  right: 3%!important;
		  margin-top: 2rem;
	  }
	  .btn-group-lg>.btn, .btn-lg {	
		  border-radius: 0.3rem;
		  font-size: 1rem;
	  }
  
	  .navbar-brand {
		font-size: medium;
	  }
	  .featurette-heading {
		margin-top: 2rem;
	  }
	  .navbar-toggler {
		font-size: small;
		margin-right: 1rem;
	  }
	  .nav-item {
		  margin-left: 0.75rem;
	  }
	  .h1 {
		font-size: medium;
	  }
	  .mt1 {
		margin-top: 1rem;
		}
		.mt4 {
		margin-top: 4rem;
		}
		.mt6 {
			margin-top: 6rem;
		}
		.mt8 {
		margin-top: 4rem;
		}
		.mt10 {
			margin-top: 10rem;
		}
		.mt12 {
		  margin-top: 12rem;
		  }
		.pt10 {
			padding-top: 10rem;
		}
	  .float-end {
		font-size: small;
		padding-top: 3rem;
	  }
}

/* iPad 3, 4 and Pro 9.7" */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2) {
	.carousel-caption h1 {
		margin-bottom: 1rem;
		font-size: 1.5rem;
		font-weight: bold;
		color: yellow!important;
		text-shadow: 2px 3px 5px #000 !important;
		line-height: 0.1;
		padding-top: 4rem;
	  }
	  .carousel-indicators {
		  display: none;
	  }  
	  .carousel-caption, text {
		padding-top: 3rem;  
		bottom: 5rem!important;
		padding-bottom: 7rem!important;
	  }
	  .text-end {
		  text-align: right!important;
		  right: 3%!important;
		  margin-top: 2rem;
	  }
	  .btn-group-lg>.btn, .btn-lg {	
		  border-radius: 0.3rem;
		  font-size: 1rem;
	  }
  
	  .navbar-brand {
		font-size: medium;
	  }
	  .featurette-heading {
		margin-top: 2rem;
	  }
	  .navbar-toggler {
		font-size: small;
		margin-right: 1rem;
	  }
	  .nav-item {
		  margin-left: 0.75rem;
	  }
	  .h1 {
		font-size: medium;
	  }
	  .mt1 {
		margin-top: 1rem;
		}
		.mt4 {
		margin-top: 4rem;
		}
		.mt6 {
			margin-top: 6rem;
		}
		.mt8 {
		margin-top: 4rem;
		}
		.mt10 {
			margin-top: 10rem;
		}
		.mt12 {
		  margin-top: 6rem;
		  }
		.pt10 {
			padding-top: 10rem;
		}
	  .float-end {
		font-size: small;
		padding-top: 3rem;
	  }
}


@media only screen 
	and (min-width: 993px) 
	and (max-width: 1200px){
	.carousel-caption h1 {
		font-size: 2rem;
		font-weight: bold;
		color: yellow!important;
		line-height: 1.4;
		text-shadow: 2px 3px 5px #000!important; 
	}

	.carousel-caption, text {
		padding-top: 2rem;
		bottom: 10rem!important;
		padding-bottom: 11rem!important;  
	  }
	.text-end {
		text-align: right!important;
		right: 3%!important;
	}

   .featurette-heading {
	margin-top: 4rem;
   }
   .mt1 {
	   margin-top: 1rem;
   }
  .mt4 {
	margin-top: 4rem;
	}
  .mt6 {
		margin-top: 6rem;
	}
  .mt8 {
	margin-top: 8rem;
	}
	.mt10 {
		margin-top: 10rem;
	}
	.mt12 {
		margin-top: 12rem;
	}
	.pt10 {
		padding-top: 10rem;
	}
  .float-end {
	font-size: small;
	padding-top: 1rem;
  } 
}

@media only screen 
	and (min-width: 1201px) 
	and (max-width: 1600px){
		.carousel-caption h1 {
			font-size: 2rem;
			font-weight: bold;
			color: yellow!important;
			line-height: 1.4;
			text-shadow: 2px 3px 5px #000 !important;
		}
	
		.carousel-caption, text {
			padding-top: 2rem;
			bottom: 10rem!important;
			padding-bottom: 16rem!important;  
		  }
		.text-end {
			text-align: right!important;
			right: 3%!important;
		}
	
	   .featurette-heading {
		margin-top: 4rem;
	   }
	   .mt1 {
		   margin-top: 1rem;
	   }
	  .mt4 {
		margin-top: 4rem;
		}
	  .mt6 {
		margin-top: 6rem;
		}
	  .mt8 {
		margin-top: 8rem;
		}
		.mt10 {
			margin-top: 10rem;
		}
		.mt12 {
			margin-top: 12rem;
		}
		.pt10 {
			padding-top: 10rem;
		}
	  .float-end {
		font-size: small;
		padding-top: 1rem;
	  } 
	}

@media (min-width: 1601px) {
		
	.carousel-caption h1 {
		font-size: 2.5rem;
		font-weight: bold;
		color: yellow!important;
		line-height: 1.4;
		text-shadow: 2px 3px 5px #000 !important;
	}
		
	.carousel-caption, text {
		padding-top: 2rem;
		bottom: 15rem!important;
		padding-bottom: 18rem!important;  
	}
	.text-end {
		text-align: right!important;
		right: 3%!important;
	}
		
	.featurette-heading {
		margin-top: 4rem;
	}
	.mt1 {
		margin-top: 1rem;
	}
	.mt3 {
		margin-top: 3rem;
	}
	.mt4 {
		margin-top: 4rem;
	}
	.mt6 {
		margin-top: 6rem;
	}
	.mt7 {
		margin-top: 7rem;
	}
	.mt8 {
		margin-top: 8rem;
	}
	
	.mt10 {
		margin-top: 10rem;
	}
	.mt12 {
		margin-top: 12rem;
	}
	.pt10 {
		padding-top: 10rem;
	}
	.float-end {
		font-size: small;
		padding-top: 1rem;
	} 
}







/*---Media Queries --

@media screen and (min-width: 0px) and (max-width: 399px{
    #companyName{
        font-size: 0.8rem;
    }
}

@media screen and (min-width: 400px) and (max-width: 699px{
    #companyName{
        font-size: 0.9rem;
    }
}

@media screen and (min-width: 700px){
    #companyName{
        font-size: 1rem;
    }
}







@media (max-width: 1400px) {	
	.carousel.caption {
	position: absolute;
	top: 45%;
	}
	.carousel-caption h1 {
		font-size: 250%;
	}
	.carousel-caption h3 {
		font-size: 150%;
		font-weight: 200;
		padding-bottom: 1.2rem;
	}
	.carousel-caption .btn {
		font-size: 95%;
		padding: 8px 14px;		
	}
	.social a {
		font-size: 4em;
		padding: 2rem;
	}
	.pt8 {
		padding-top: 8rem;
	}
  }

@media (max-width: 992px) {	
	.carousel.caption {
	position: absolute;
	top: 45%;
	}
	.carousel-caption h1 {
		font-size: 250%;
	}
	.carousel-caption h3 {
		font-size: 150%;
		font-weight: 200;
		padding-bottom: 1.2rem;
	}
	.carousel-caption .btn {
		font-size: 95%;
		padding: 8px 14px;		
	}
	.social a {
		font-size: 4em;
		padding: 2rem;
	}
	.pt8 {
		padding-top: 8rem;
	}
  }  

@media (max-width: 768px) {
	.carousel.caption {
	position: absolute;
	top: 45%;
	}
	.carousel-caption h1 {
		font-size: 175%;
	}
	.carousel-caption h3 {
		font-size: 100%;
		font-weight: 250;
		padding-bottom: .2rem;
	}
	.carousel-caption .btn {
		font-size: 95%;
		padding: 8px 14px;		
	}
	.dispaly-4 {
		font-size: 200%;		
	}
	.social a {
		font-size: 2.5em;
		padding: 1.2rem;
	}
	.pt8 {
		padding-top: 8rem;
	}
}

@media (max-width: 576px) {
	.carousel.caption {
	position: absolute;
	top: 40%;
	}
	.carousel-caption h1 {
		font-size: 250%;
	}
	.carousel-caption h3 {
		font-size: 110%;
	}
	.carousel-caption .btn {
		font-size: 90%;
		padding: 4px 8px;		
	}
	.carousel-indicators {
		display: none;
	}
	.dispaly-4 {
		font-size: 160%;		
	}
	.social a {
		font-size: 2em;
		padding: .7rem;
	}
	.pt8 {
		padding-top: 8rem;
	}
}

@media (max-width: 375px) {

	.navbar-brand {
		font-size: 60%;
	}
	.carousel.caption {
	position: absolute;
	top: 150%;
	}
	.carousel-caption h1 {
		font-size: 90%;
	}
	.carousel-caption h3 {
		font-size: 60%;
	}
	.carousel-caption .btn {
		font-size: 70%;
		padding: 4px 8px;		
	}
	.carousel-indicators {
		display: none;
	}
	h1.display-4 {
		font-size: 200%;
	}
	h2 {
		font-size: 170%;
	}
	.dispaly-4 {
		font-size: 80%;		
	}
	.social a {
		font-size: 2em;
		padding: .7rem;
	}
	.pt8 {
		padding-top: 8rem;
	}
}

/*---Firefox Bug Fix --
.carousel-item {
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
}*/
/*--- Fixed Background Image --
figure {
  position: relative;
  width: 100%;
  height: 60%;
  margin: 0!important;
}*/
/* .fixed-wrap {
  clip: rect(0, auto, auto, 0);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#fixed {
  background-image: url('img/mac.png');
  position: fixed;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center center;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  will-change: transform; 
}





/*============= BOOTSTRAP V-5 BREAKPOINTS===============================

Single breakpoint
There are also media queries and mixins for targeting a single segment 
of screen sizes using the minimum and maximum breakpoint widths.

@include media-breakpoint-only(xs) { ... }
@include media-breakpoint-only(sm) { ... }
@include media-breakpoint-only(md) { ... }
@include media-breakpoint-only(lg) { ... }
@include media-breakpoint-only(xl) { ... }
@include media-breakpoint-only(xxl) { ... }


Between breakpoints
Similarly, media queries may span multiple breakpoint widths:

Copy
@include media-breakpoint-between(md, xl) { ... }

======================================================================*/





/*===================== BREAKPOINTS: ====================

@media screen and (min-width: 0px) and (max-width: 399px{
    #companyName{
        font-size: 0.8rem;
    }
}

@media screen and (min-width: 400px) and (max-width: 699px{
    #companyName{
        font-size: 0.9rem;
    }
}

@media screen and (min-width: 700px){
    #companyName{
        font-size: 1rem;
    }
}

=======================================================*/





/*============ BOOTSTRAP BREAK POINTS:
Extra small (xs) devices (portrait phones, less than 576px)
No media query since this is the default in Bootstrap

Small (sm) devices (landscape phones, 576px and up)
@media (min-width: 576px) { ... }

Medium (md) devices (tablets, 768px and up)
@media (min-width: 768px) { ... }

Large (lg) devices (desktops, 992px and up)
@media (min-width: 992px) { ... }

Extra (xl) large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }
=============*/


/*=================
/* Extra small devices (phones, 600px and down) */
/* @media only screen and (max-width: 600px) {
	  } */
  
  /* Small devices (portrait tablets and large phones, 600px and up) */
  /* @media only screen and (min-width: 600px) {
  }*/
  
  /* Medium devices (landscape tablets, 768px and up) */
  /* @media only screen and (min-width: 768px) {
  } */
  
  /* Large devices (laptops/desktops, 992px and up) */
  /* @media only screen and (min-width: 992px) {
  } */
  
  /* Extra large devices (large laptops and desktops, 1200px and up) */
  /* @media only screen and (min-width: 1200px) {
  } 
===================*/