@charset "utf-8";
/* CSS Document */
:root {
	--anchor: #ccc;
	--anchorH: #fff;
	--sectionVPadding: 80px;
	--primaryColor: #0345bf;
	--primaryHover: #044cd0;
	--secondaryColor: #3366cc;
	--secondaryHover: #6699cc;

  	--hlogo-minHeight: 50px; /*60*/
	--hlogo-maxHeight: 80px; /* 100 */
	--header-minPadding: 10px;
	--header-maxPadding: 15px;
	--header-minHeight: calc(var(--hlogo-minHeight) + (var(--header-minPadding) * 2));
	--header-maxHeight: calc(var(--hlogo-maxHeight) + (var(--header-maxPadding) * 2));

	--blue: #0345BF;
	--dkBlue: #0066cc;
	--Green: #007700;
	--dkGreen: #005100;
}


/* top bar */
	#sp-top-bar .fab, #sp-top-bar .fas, #sp-top-bar .far, #sp-top-bar a {
		font-size: 24px;
		color: var(--secondaryColor);
		margin-top: 2px;
		padding: 7px 0;
	}
	#sp-top-bar ul.sp-contact-info li span.fas,
	#sp-top-bar ul.sp-contact-info li span.far {
		color:var(--anchor); margin-left:0;}
	#sp-top-bar ul.sp-contact-info li span.fas:hover {color:var(--anchorH);}
	#sp-top-bar ul.sp-contact-info li a {font-family: "Arial Narrow", sans-serif, "Helvetica Neue", "Lucida Grande", Arial;}
/* header */
	#sp-header {
		background-color: white;
		border-bottom: 2px solid red;
		box-shadow: 0 0 15px rgba(0,0,0,.7);
	}

	.social-icons li a span {
		color: var(--secondaryColor) !important;
		font-size: 1.4em;
	}
	.social-icons li a span:hover, #sp-top-bar a:hover {
		color: white !important;
	}

	/* header animation */
		#sp-header, #sp-header .logo, #sp-header .logo-image, .sp-megamenu-parent > li > a {transition:all .75s ease-out;}
	  /*container */
		#sp-header, #sp-header .logo {height: var( --header-maxHeight );}
		#sp-header.header-sticky, #sp-header.header-sticky .logo {height: var( --header-minHeight );} 
		#offcanvas-toggler {transition:all .75s ease-out;}
	  /* logo */
		#sp-header .logo-image {height: var(--hlogo-maxHeight) !important;}
		.logo-image-phone {height: 60px !important;}
		#sp-header.header-sticky .logo-image-phone {height: var(--hlogo-minHeight) !important;}
		#sp-header.header-sticky .logo-image {height: var(--hlogo-minHeight) !important;}
	  /* offcanvas toggler */
		.header-sticky  #offcanvas-toggler {height: var(--header-minHeight); line-height: var(--header-minHeight);}
	  /* menu items */
		.sp-megamenu-parent > li > a {line-height: var(--header-maxHeight);}
		.header-sticky .sp-megamenu-parent > li > a {line-height:var(--header-minHeight);}
		#sp-header.header-sticky.hide {
			top: -100px;
		}	  
	  
/* menu */
	#sp-header .sp-megamenu-parent > li > a, #sp-header .sp-megamenu-parent > li > span, .offcanvas-menu .offcanvas-inner ul.menu > li a, .offcanvas-menu .offcanvas-inner ul.menu > li span {
		font-size: 1.4em;
		font-weight: 600;
		color: #333;
	}
	#sp-header .sp-megamenu-parent > li > a:hover,
	#sp-header .sp-megamenu-parent > li > span:hover,
	.offcanvas-menu .offcanvas-inner ul.menu > li a:hover,
	.offcanvas-menu .offcanvas-inner ul.menu > li span:hover {
		color: var(--secondaryColor);
	}
	#sp-header .sp-megamenu-parent > li.active > a,
	.offcanvas-menu .offcanvas-inner ul.menu > li.active a,
	.offcanvas-menu .offcanvas-inner ul.menu > li.active a:hover {
		/*color: var(--primaryColor) !important;
		text-decoration: none !important;
		text-decoration-thickness: 3px;
		text-underline-offset: 5px;
		text-decoration-color: var(--primaryColor) !important;
		cursor:default;*/
		background-color:red;
		color: white !important;
		text-decoration-thickness: 3px;
		text-underline-offset: 5px;
		text-decoration-color: white;
		cursor:default;
	}
	#sp-slider {background: #eee url(../../../images/calgarysbestmoving/calgary-bg.jpg) no-repeat top center;
		background-size:cover;
		padding:40px 0 60px;}
/* off canvas */
	.sp-contact-info li[class^="sp-contact-"] {
		font-family:"Arial Narrow", Arial, Helvetica, sans-serif;
		font-size: 1.3em;
		color: #333;
		font-weight: 600;
		margin-left:10px;
	}
	.offcanvas-menu .offcanvas-inner ul.menu > li a {
		padding: 15px 0;
	}

	.offcanvas-menu .social-icons li a span:hover {
		color: black !important;}
	.offcanvas-menu a img {height:60px !important; width:auto;}
	.offcanvas-menu .social-icons li a span {font-size: 2em;}

/* content */
	#sp-main-body {
		background: #eee url(../images/textureBG.png) repeat;
		padding:40px 5px 60px;}

	#sp-user1, #sp-user2, #sp-contact {padding: var(--sectionVPadding) 0 !important;}
	#sp-notification {padding:20px 0 !important; background-color:black;}
	#sp-notification p {margin-bottom:0; color:#aaa; text-align:justify; font-size:.9em;}
  /* social */
	  .article-social-share .social-share-icon ul li a {
		  background-color: var(--primaryColor);
		  color: white;
		  border:2px solid black;
	  }
	  .article-social-share .social-share-icon ul li a:hover {
		  background-color: white;
		  color: var(--primaryColor);
		  border:2px solid var(--primaryColor);
	  }
  /* home content */	
#system-message-container {
  position: fixed;
  bottom: 0px;
  right: 15px;
  max-width: 350px;
  z-index: 9999;
  font-size: 3em;
  padding: 20px;
}
h1, h2, h3, h4, h5, h6 {
	font-family: 'Nunito Sans', sans-serif;
	text-decoration: none;
	font-weight:600;	
}

h1 {
	margin: 0 auto 40px !important;
	font-size: 1.2em;
	font-weight: 500;
	line-height: 2.7em;
	text-align: center;
	padding-bottom: 0;
	color: #999;
}
h1 span.larger {
	display: block;
	font-size: 2.8em;
	font-weight: bold;
	color: black;	
}
h2 {font-size:2.2em;}
h3 {font-size:2.0em;}
h4 {font-size:1.8em;}
h5 {font-size:1.6em;}
h6 {font-size:1.4em;}
p {font-size:1.2em;}
p.lead {
	font-size: 115%;
	font-weight: bold;
	color: #333;
}

p.title {font-size:160%; line-height:1.4em; font-weight:bold;}
a {color: var(--primaryColor); text-decoration:underline; font-weight:600;}
a:hover {color: var(--secondaryHover); text-decoration:underline;}
img.logo, #sp-main-body img {display:block; margin:auto auto 20px;}
.img-thumbnail {border:2px solid grey; margin-bottom:5px;}
#sp-right .sp-module {padding:0 30px; margin:0 0 20px;}
.ad {
	display:block;
	-webkit-border-radius: 10px;
	-moz-border-radius:10px;
	border-radius:10px;
	background-color:white;
	text-align:center;
	padding:10px !important;
	margin:0 auto;
	border:2px solid grey;}
	
.well {padding:20px 10px; margin-bottom:40px;}
.btn-warning {background-color:#ffc107; font-weight:700; color:#333; font-weight:600; text-decoration:none; text-transform:uppercase;}
.btn-warning:hover {background-color: orange; color:#000; text-decoration:none;}

/* reviews */
	.review {
		background-color:#eeeeee;
		background: rgb(187,187,187);
		background: linear-gradient(45deg, rgba(187,187,187,1) 0%, rgba(238,238,238,1) 20%, rgba(204,204,204,1) 40%, rgba(255,255,255,1) 60%, rgba(204,204,204,1) 80%, rgba(238,238,238,1) 100%); 
		border: 2px solid #555;
		-webkit-border-radius:10px;
		-moz-border-radius:10px;
		border-radius:10px;
		padding:20px 10px;
		box-shadow:0 3px 15px rgba(0,0,0,.5);}
	.review .title {font-size:1.5em; font-weight:bold; color:blue;}
	.review .rating, .review .date {font-weight:bold; font-size:1.2em; line-height:1.2em; height:1.2em; vertical-align:middle; text-transform:uppercase; margin:15px 0;}
	
	.rating img.reviewStar {display:inline-block !important;  line-height:1.2em; height:1.2em; width:auto;  margin:1px 0 0 !important;vertical-align:text-top;}
	.review .description {font-weight:500; font-size:.9em; text-align:justify; margin:15px 0;}
	.review .customer {font-weight:bold; font-size:1.1em;}
	.review .customer, .review .fromTo, .review .moveDate {font-style:italic;}
	.review .small {font-size:.7em;}
.carousel-dark .carousel-indicators [data-bs-target] {
  background-color: #666; opacity:.6; padding:3px;
}
.carousel-dark .carousel-indicators [data-bs-target].active {
  background-color: #f00; opacity:1;
}
#sp-slider .slide-title {display:block; background-color:#009; color:white; font-size:2em; padding:5px; margin-bottom:20px;}
#sp-slider .vLogo.img-responsive {display:block; width:90%; margin:auto;}

/* sp-section2 */
	section#sp-section2 {background-color:#111 !important;}
	#benefits h3 {color:white; font-weight:600;}
	#benefits h4 {color:white; font-weight:600; padding:20px 0 10px;}
	#benefits .well {background-color:white;}
	#benefits h4.bg-primary {
		font-family: "Arial Narrow", sans-serif, "Helvetica Neue", "Lucida Grande", Arial !important;
		padding:5px 15px;
		color:white;
		font-weight:600;}
	#benefits img {border:2px solid grey; box-shadow:3px 3px 15px rgba(0,0,0,.5);}
	#benefits p.lead {font-weight:bold; font-size:130% !important; color:black;}
	#benefits p {color:#666; font-weight:600;}

/* Contact section */
	#sp-contact {
	  /* background: url("../../../images/Glenard-Roos-Water-Drop-BG.jpg") center bottom no-repeat, linear-gradient( #000000 0%, #004d87 50% ); */
	  background: linear-gradient( #000000 0%, #004d87 50% );
		background-size: auto, auto;
	  background-size: 100% auto;
	  color: white !important;
	  text-align: center;
	}
	
	#sp-contact h2, #sp-contact p {
		color: white;
		text-shadow: 3px 3px 3px rgba(0,0,0,.7);
	}
	#sp-contact .btn {
		width: 100%;
		text-shadow: none !important;
		box-shadow: 3px 3px 3px rgba(0,0,0,.7);
	}
/* Bottom Section */
	#sp-bottom .sp-module {
		margin-bottom: 40px;
	}
	#sp-bottom .sp-module .sp-module-title {
		font-family: "Arial Narrow", sans-serif, "Helvetica Neue", "Lucida Grande", Arial;
		font-weight: 700;
		font-size: 2em;
		margin: 0 0 30px;
		color: #fff;
		border-bottom:3px solid #fff;
		text-align:center;
	}
	#sp-bottom .menu > li a, #sp-bottom p, #sp-bottom2 li {
		display: block;
		font-size: 1.3em !important;
		padding: 0;
		color: #eee;
	}
	#sp-bottom .menu > li a {color: var(--secondaryColor);}
	#sp-bottom .menu > li a:hover {color: var(--secondaryHover);}
	#sp-bottom .menu > li.active a {
		color: white;
		text-decoration: underline var(--secondaryColor);
		text-decoration-thickness: 2px;
		text-underline-offset: 6px;
		cursor:default;}
	#sp-bottom .sp-module ul.menu > li{
		display: block;
		margin-bottom: 4px;
		width: 33%;
		text-align: center;
	}
	#sp-bottom .caption {font-size: 1em;}

	#logo-bottom .phone {font-weight:600;}
	#logo-bottom {display:block; text-align:center; margin:auto;}
	#logo-bottom img {max-width:100%; margin:0 auto;}
	
	
/* Footer Section */
	#sp-footer .container-inner {padding: 15px 0; border-color: rgba(255, 255, 255, 0.3)}
	.sp-copyright, .sp-webdesign {
		display:block;
		font-family: "Arial Narrow", sans-serif, "Helvetica Neue", "Lucida Grande", Arial;
		font-size:1.2em;
		text-align:center;}

/* contact us page */
  /* address icons */
	.fa, .fab, .fad, .fal, .far, .fas, .icon-joomla, [class*=" icon-"], [class^="icon-"] {
		-moz-osx-font-smoothing: grayscale;
		-webkit-font-smoothing: antialiased;
		display: inline-block;
		font-style: normal;
		font-variant: normal;
		line-height: 1;
	}
	#address i.fa, #hours i.far, .media i.fas {
		font-size: 1.5rem !important;
		margin: 2px 7px 0 0 !important;
		vertical-align: top;
	}
	.media-body {
		-ms-flex: 1;
		flex: 1;
		display: inline-block;
	}
	#address h5 {
		font-family: "Arial Narrow", sans-serif, "Helvetica Neue", "Lucida Grande", Arial;
		font-stretch: extra-condensed;
		text-transform: none;
		font-size: 1.5rem;
	}
  /* contact form */
	.contact-form {
	  background-color: rgba(0,0,0,.2);
	  padding: 20px 15px;
	  border: 1px solid rgba(0,0,0,.2);
	}
	#contact-form legend {
		text-transform: uppercase;
		font-weight: bold;
		font-size: 2em;
	}
	.form-horizontal .controls {
	  margin-left: 0;
	}

  /* terms */
	.legal .wrapper {margin-left:30px;}
	.legal h2 {text-decoration:underline;}
	
/* classes */
	.red, .star {font-weight:bold; color:red;}
	.img-responsive {
		width: 100%;
		height: auto;
	}
	.btn-primary {
		background-color: var(--primaryColor);
		text-decoration:none;
		font-weight:600;
		border: 1px solid #ddd;
		color: #ddd !important;
	}
	.btn-primary:hover {
		background-color: var(--primaryHover);
		text-decoration:none;
		border: 1px solid white;
		color: white !important;
	}
	.extend {width:100%;}


@media screen and (min-width: 576px) {
	/*:root {	--hlogo-maxHeight: 60px; /* 100 */
	h1 {line-height:2.2em;}
	h2 {font-size:2.4em;}
	#sp-contact .btn {width: 70%;}
	#sp-bottom .caption {font-size: 1.5em;}
	#logo-bottom img {max-width:70%;}
	.contact-form {padding: 20px 40px;}
	.review {padding:20px 30px;}
}
@media screen and (min-width: 768px) {
	#sp-top-bar ul.sp-contact-info li span.fas::last-child,
	#sp-top-bar ul.sp-contact-info li span.far::last-child {
		margin-left:10px;
	}
	#sp-slider .vLogo.img-responsive {width:80%;}
	#sp-contact .btn {width: 95%;}
	.sp-copyright {text-align:left;}
	.sp-webdesign {text-align:right;}
	#sp-bottom .sp-module ul.menu > li{width: 50%;}
	#sp-bottom .caption {font-size: 1.7em;}
	.review {padding:20px 30px;}
	.review .description {font-size:1.1em;}
	.review .rating {float:left !important;}
	.review .date {float:right !important;}
}
@media screen and (min-width: 992px) {
	img.logo {display:block; margin:auto auto;}
	#sp-contact .btn {width: 70%;}
	#sp-bottom .caption {font-size: 1em;}
	#logo-bottom img {max-width:80%;}
}
@media screen and (min-width: 1200px) {
	#sp-slider .vLogo.img-responsive {width:70%;}
	#sp-contact .btn {width: 70%;}
	#logo-bottom img {max-width:100%;}
}