a[href^=tel] { color: inherit; text-decoration: none; }

@font-face {
    font-family: 'FjallaOne-Regular';
    src: url('../fonts/FjallaOne-Regular.ttf');
    src: url('../fonts/FjallaOne-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;

}



/* headings */


.content-light-bg h1, .content-light-bg h2, .content-light-bg h3, .content-light-bg h4, .content-light-bg h5, .content-light-bg h6, .content-light-bg  .heading{
	color:#9d2119;
}

.heading{

font-size: 1.5rem;

}



.heading2{

font-size: 1.3rem;

}



.header-phone {

    color: #ffde00;

    font-size: 1.4em;

}

.header-phone-mobile {

    display: block;

    font-size: 1.4em;

}

.navbar-dark .navbar-brand{
	font-family:'FjallaOne-Regular', Arial, Helvetica, sans-serif;

}


.ccard-header{

	padding: 0px 10px 4px 10px;

    text-align: center;

    color: white;

}

.header-row2 {
    background-color: #004aad !important;
    background: linear-gradient(to left, #820700, #9d2119);
    margin-top: 36px;
    color: #ffde00;
    text-align: center;
    vertical-align: middle;
    font-size: 1.3em;
    padding: 5px !important;
    min-height: 60px;
}

.header-txt {
    float: left;
	padding-left:10px;
}
.header-icons {
    float: right;
}




.logo {
    /* float: left; */
	margin-right: 10px;
	vertical-align: bottom;
}




/* content */



main {

    overflow: hidden;

}



.content {

    padding: 50px;

}



.content-light-bg {

    background-color: #ffffff;

}



.content-dark-bg {

    background-color: #2c2c2c;

	color:#FFFFFF;

}



.content-dark-bg a {

	color:#ffde00;

}


.content-dark-bg h1, .content-dark-bg h2, .content-dark-bg h3, .content-dark-bg h4, .content-dark-bg h5, .content-dark-bg h6, .content-dark-bg .heading {
    color: #ffffff;
}


.parallax{

	min-height: 100%;

    background-attachment: fixed;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

}



.bg1{

	background-image:url(../images/bg-Maple-Grove-garage-door-1.jpg);

	overflow:hidden;

}



.bg2{

	background-image:url(../images/bg-Maple-Grove-garage-door-2.jpg);

	overflow:hidden;

}



.bg3{

	background-image:url(../images/bg-Maple-Grove-garage-door-3.jpg);

	overflow:hidden;

}

.bg4{

	background-image:url(../images/bg-Maple-Grove-garage-door-4.jpg);

	overflow:hidden;

}

.bg5{

	background-image:url(../images/bg-Maple-Grove-garage-door-5.jpg);

	overflow:hidden;

}

.bg6{

	background-image:url(../images/bg-Maple-Grove-garage-door-6.jpg);

	overflow:hidden;

}



.imagecontent-right{

    float: right;

    padding: 5px;

    margin: 10px 50px 20px 40px;

    max-width: 50%;

	box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px;

	
	background: rgb(0,0,0);
	background: linear-gradient(90deg, #9d2119 0%, #540500 50%, #9d2119 100%);

}



.imagecontent-left {

    float: left;

    padding: 5px;

    box-shadow: 0px 0px 5px 0px #7b7b7b;

    margin: 10px 40px 20px 15px;

    max-width: 50%;

    border: 3px solid #0c2f63;

	box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px;

	background: rgb(0,0,0);
    background: linear-gradient(90deg, rgb(255 133 0) 0%, rgb(0 0 0) 50%, rgba(255,182,18,1) 100%);

}



.content-dark-bg .imagecontent-left, .content-dark-bg .imagecontent-right  {

	/* box-shadow: rgb(255 255 255) 0px 20px 30px -10px; */

}



.styled-image{

	box-shadow: rgb(38 57 77) 0px 20px 30px -10px;

    padding: 5px;

	background: rgb(0,0,0);
    background: linear-gradient(90deg, #9d2119 0%, #540500 50%, #9d2119 100%);

}



.floatright{

	float: right;

    display: contents;

}



.floatleft{

	float: left;

	display: contents;

}





/* button */

.button {

    border-radius: 4px;

    background-color: #9d2119;

    border: none;

    color: #FFFFFF;

    text-align: center;

    font-size: 1.2em;

    padding: 10px 10px 10px 10px;

    width: max-content;

    transition: all 0.5s;

    cursor: pointer;

    margin: 5px 0px 10px 0px;

	max-width:100%

}



.button a{

	color:#FFFFFF !important;

}

.button span {

  cursor: pointer;

  display: inline-block;

  position: relative;

  transition: 0.5s;

}



.button span:after {

  content: '\00bb';

  position: absolute;

  opacity: 0;

  top: 0;

  right: -20px;

  transition: 0.5s;

}



.button:hover span {

  padding-right: 25px;

}



.button:hover span:after {

  opacity: 1;

  right: 0;

}



.button-dark{

    background-color: #9d2119 !important;

}





/* social media */

.icons {

    

}



.icons > div {

    display: inline-block;

    vertical-align: middle;

}



.icons > img {

    display: inline-block;

}





/* schema */

.schema_add_map div {

display: inline;

}





/* footer */

.row.bottomlinks {

    background-color: #f1f1f1;

    padding: 10px 20px;

    font-size: 11pt;

    height: auto;

    width: 100%;

    margin: 0 auto;

    color: #ffffff;

}



.row.bottomlinks a{

	color:#000000;

	text-decoration:none;

}



.copyright {

    background-color: #004aad !important;
    background: linear-gradient(to left, #820700, #9d2119);

    color: #ffffff;

    padding: 20px 0 25px 0;

    margin-bottom: -50px;

}



.back-to-top {

    position: relative;

    top: 15px;

    right: 15px;

    background: #ffde00;

    padding: 4px 10px;

    border-top-left-radius: 10px;

    border-top-right-radius: 10px;

}



.back-to-top a{

	color:#000000;

	text-decoration:none;

}





/* form */

.form-group {

    width: 90%;

    margin: 0 auto;

    padding: 10px;

}



.form-holder button {

    float: right;

}





/*news*/



.news > div {

    background-image: url(../images/bullet.png);

    background-repeat: no-repeat;

    padding: 10px 10px 10px 40px;

    background-position: 10px 10px;

    font-size: 1em;

	line-height: 1rem;

}



.news > div a{

	display:block;

}



.news > div:nth-child(even){

	background-color:rgba(226, 226, 226, 0.4);

}





/* embeded youtube video */

.video-holder {

    float: right;

    margin: 10px 10px 10px 15px;

    max-width: 50%;

    width: -webkit-fill-available;

}



.responsive-video {

    position: relative;

    padding-bottom: 56.25%;

    padding-top: 60px; overflow: hidden;

	margin:10px 0 10px 0;

}



.responsive-video iframe,

.responsive-video object,

.responsive-video embed {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

}





.imagecontent-size2{

	width:200px;

	height:200px;

}


p.logo-footer {
    width: fit-content;
    margin: 0 auto;
    font-size: 1.5em;
    padding: 20px 10px;
}



/* screen size */



@media (max-width: 319px) {

	.icons {

   		float: none;

	}

	.cards {

   		height: 24px;

	}

	.icons  div img {

   		height: 24px;

	}

	.video-holder {

		width: 100% !important;

	}

	.btn-group-lg>.btn, .btn-lg{

	    font-size: .8rem !important;

	}

	.carousel-caption{

		font-size: .7rem;

	}

	.carousel-caption h2{

		font-size: 1rem;

	}

	.navbar-brand{

		font-size: 1.1rem;

	}

	.imagecontent-size{

		width:200px;

		height:133px;

	}

	.imagecontent-size1{

		width:300px;

		height:300px;

	}

	.header-phone {

		color: #ffffff;

		font-size: 1em;

		margin-top: 10px;

	}

	.header-txt, .header-icons{
		float:none;
	}



}



@media (min-width: 320px) and (max-width: 399px) {

	.icons {

   		float: none;

	}

	.cards {

   		height: 24px;

	}

	.icons  div img {

   		height: 24px;

	}

	.video-holder {

		width: 100% !important;

	}

	.btn-group-lg>.btn, .btn-lg{

	    font-size: .8rem !important;

	}

	.carousel-caption{

		font-size: .7rem;

	}

	.carousel-caption h2{

		font-size: 1rem;

	}

	.navbar-brand{

		font-size: 1.1rem;

	}

	.imagecontent-size{

		width:200px;

		height:133px;

	}

	.imagecontent-size1{

		width:300px;

		height:300px;

	}

	.header-phone {

		color: #ffffff;

		font-size: 1em;

		margin-top: 10px;

	}

	.header-txt, .header-icons{
		float:none;
	}



}



@media (min-width: 400px) and (max-width: 767px) {

	.icons {

   		float: none;

	}

	.cards {

   		height: 28px;

	}

	.imagecontent-size{

		width:150px;

		height:100px;

	}

	.imagecontent-size1{

		width:400px;

		height:400px;

	}

	.header-phone {

		color: #ffffff;

		font-size: 1em;

		margin-top: 10px;

	}

	.header-txt, .header-icons{
		float:none;
	}



}



@media (min-width: 768px) and (max-width: 991px) {

	.icons {

   		float: none;

	}

	.cards {

   		height: 28px;

	}

	.imagecontent-size{

		width:300px;

		height:200px;

	}

	.imagecontent-size1{

		width:400px;

		height:400px;

	}

	.header-phone {

		color: #ffffff;

		font-size: 1em;

		margin-top: 10px;

	}

	.header-txt, .header-icons{
		float:none;
	}



}



@media (min-width: 992px) and (max-width: 1199px) {

	.nav-link {

		font-size: .9rem;

	}

	.icons > img {

    	height: 20px !important;

	}

	.imagecontent-size{

		width:300px;

		height:200px;

	}

	.imagecontent-size1{

		width:500px;

		height:500px;

	}

	.header-phone-mobile{

		display:none

	}

	.header-phone {

		color: #ffffff;

		font-size: 1em;

	}

	.header-txt, .header-icons{
		float:none;
	}

}



@media (min-width: 1200px) {

	.video-holder {

		max-width: 30%;

	}

	.imagecontent-size{

		width:400px;

		height:267px;

	}

	.imagecontent-size1{

		width:500px;

		height:500px;

	}

	.header-phone-mobile{

		display:none

	}



}





/* animation */



[data-inviewport] { /* animation */

	padding:10px 0;

}



/* inViewport */



[data-inviewport="scale-in"] { 

  	transition: 2s;

  	transform: scale(0.1);

}

[data-inviewport="scale-in"].is-inViewport { 

  	transform: scale(1);

}





[data-inviewport="fade-rotate"] { 

  	transition: 2s;

  	opacity: 0;

}

[data-inviewport="fade-rotate"].is-inViewport { 

  	transform: rotate(360deg);

  	opacity: 1;

}





[data-inviewport="fade-in"] { 

  	transition: 2s;

  	opacity: 0;

}

[data-inviewport="fade-in"].is-inViewport { 

  	opacity: 1;

}





[data-inviewport="move-up"] { 

  	transition: 1s;

  	opacity: 0;

  	-webkit-transform: translateY(200px);

	transform: translateY(200px);

}

[data-inviewport="move-up"].is-inViewport { 

  	opacity: 1;

  	-webkit-transform: translateY(0px);

	transform: translateY(0px);

	-webkit-animation: moveUp 0.65s ease forwards;

	animation: moveUp 0.65s ease forwards;

}





[data-inviewport="slide-left"] { 

  	transition: 1s;

  	opacity: 0;

	transform: translateX(300px);

}

[data-inviewport="slide-left"].is-inViewport { 

	opacity: 1;

	transform: translateX(0px);

}





[data-inviewport="slide-right"] { 

  	transition: 1s;

  	opacity: 0;

	transform: translateX(-300px);

}

[data-inviewport="slide-right"].is-inViewport { 

	opacity: 1;

	transform: translateX(0px);

}





[data-inviewport="flip"] { 

  	transition: 3s;

  	opacity: 0;

	-webkit-transform: rotateY(-80deg);

	transform: rotateY(-80deg);

}

[data-inviewport="flip"].is-inViewport { 

	opacity: 1;

	

	-webkit-transform: rotateY(0deg);

	transform: rotateY(0deg);

}



[data-inviewport="flip-up"] { 

  	transition: 1s;

  	opacity: 0;

	-webkit-transform-style: preserve-3d;

	transform-style: preserve-3d;

	-webkit-transform: rotateX(-80deg);

	transform: rotateX(-80deg);

	-webkit-animation: flip .8s ease-in-out forwards;

	animation: flip .8s ease-in-out forwards;

}

[data-inviewport="flip-up"].is-inViewport { 

	opacity: 1;

	

	-webkit-transform-style: preserve-3d;

	transform-style: preserve-3d;

	-webkit-transform: rotateX(0deg);

	transform: rotateX(0deg);

	-webkit-animation: flip .8s ease-in-out forwards;

	animation: flip .8s ease-in-out forwards;

	

}