body{
	font-family: Calibri, Arial, sans-serif;
}

*, *:before, *:after {
      -webkit-user-select: default;
      -moz-user-select: default;
      -ms-user-select: default;
      user-select: default;
     }

.clearfix{
    display: block;
    clear: both;
}
/* Main Navigation */

nav{
    border: 1px;
    width: 80%;
    text-align: center;
    margin: auto;
    margin-bottom: 1%;
    font-family: 'Open Sans', sans-serif;
    text-transform: uppercase;
}

nav a:hover, nav .active{
    background: #9D9D9D;
    color: #314DA0;
    text-decoration: none;
}
nav ul{
    list-style-type: none; 
    padding: 0;
    overflow: hidden;
    background-color: #333;
}
nav li{
    text-align: center;
    float: left;
    font-size: 11px;
}
nav li a{
    display:block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 14px;
}


.gethomequote{
     width: 30%;
    border: none;
    color: white;
    float: right;
    margin:5% 5.5%;
}
.gethomequote:hover{
    border: none;
    color: #314DA0; 
}

.gethomequote a{
    border: none;
    background-color: #314DA0;
    color: white;
    margin-top: 3%;
    padding: 3.5% 6.5%;
}
.gethomequote a:hover{
    border: none;
    background-color:#9D9D9D;
    color: #314DA0; 
}

button[type=submit] {
    border: none;
    background-color: #314DA0;
    color: white;
    margin-top: 3%;
    padding: 1.5% 4.5%;
}
button[type=submit]:hover{
    border: none;
    background-color:#9D9D9D;
    color: #314DA0; 
}

    .form-group{
        padding: 1%;
    }

/* Sidebar Navigation */
/* Style the links inside the sidenav */
#smnav a {
    position: absolute; /* Position them relative to the browser window */
    left: -174px; /* Position them outside of the screen */
    transition: 0.3s; /* Add transition on hover */
    padding: 10px; /* 15px padding */
    width: 230px; /* Set a specific width */
    text-decoration: none; /* Remove underline */
    color: white; /* White text color */
    border-radius: 0 30px 30px 0; /* Rounded corners on the top right and bottom right side */
    z-index: 2;
    font-size: 1.154m;
}

#smnav a:hover {
    left: 0; /* On mouse-over, make the elements appear as they should */
}
#smnav img{
    height: 35px;
    padding-left: 25px;
    margin: 0;
}
#twtnav img{
    padding-left: 47px;
}
#fbnav {
    top: 308px;
    background-color:  #3B5998;
}

#ignav {
    top:362px;
    background-color:  #ce0074; 
}

#twtnav {
    top: 417px;
    background-color: #00ACED;
}

/*FOOTER SM List*/
a {
  color: rgba(0, 0, 0, 0.36);
  text-decoration: none;
}
.social {
  position: fixed;
  top: 20px;
}
.social ul {
  padding: 0px;
  -webkit-transform: translate(254px, 0);
  -moz-transform: translate(-254px, 0);
  -ms-transform: translate(-254px, 0);
  -o-transform: translate(-254px, 0);
  transform: translate(-384px, 0);
}
.social ul li {
  display: block;
    padding: 5px;
  background: rgba(0, 0, 0, 0.36);
  width: 270px;
  text-align:right;
  -webkit-border-radius: 0 2px 2px 0;
  -moz-border-radius: 0 2px 2px 0;
  border-radius: 0 2px 2px 0;
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
  -ms-transition: all 1s;
  -o-transition: all 1s;
  transition: all 1s;
}

.social ul .li-fb:hover{
  -webkit-transform: translate(193px, 0);
  -moz-transform: translate(193px, 0);
  -ms-transform: translate(193px, 0);
  -o-transform: translate(193px, 0);
  transform: translate(193px, 0);
  background: rgba(59, 89, 152, 75); 
    
}
.social ul .li-tw:hover{
  -webkit-transform: translate(171px, 0);
  -moz-transform: translate(171px, 0);
  -ms-transform: translate(171px, 0);
  -o-transform: translate(171px, 0);
  transform: translate(171px, 0);
  background: rgba(29, 161, 242, 75); 
    
}
.social ul .li-ig:hover{
  -webkit-transform: translate(194px, 0);
  -moz-transform: translate(194px, 0);
  -ms-transform: translate(194px, 0);
  -o-transform: translate(194px, 0);
  transform: translate(194px, 0);
  background: rgba(155, 105, 84, 75); 
    
}
.social ul li:hover a {
  color: #fff;
}
.social ul li:hover i {
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  -o-transform: rotate(360deg);
  transform: rotate(360deg);
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
  -ms-transition: all 1s;
  -o-transition: all 1s;
  transition: all 1s;
}
.social ul li i {
  margin-left: 10px;
  padding: 10px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  font-size: 20px;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}


/* Main Content */
.getquotebutton{
    float: right;
    padding: 2% 0 3% 0;
}

.container-fluid{
    max-width: 80%;
    margin: auto;
    padding: 0 !important;
}

.main{
    clear: both;
}
img.logo{
   width: 280px;
}
.main_image{
    float:left;
    padding-right: 4%;
    margin-top: 0;
}
.main p{
    font-family: 'Open Sans', sans-serif;
    font-size: 130%;
    padding-top: 2%;
}
.topimg{
    margin-top: 13%;
    
}
.solosets img{
    width: 100%;
}
.under img{
    width: 100%;
    padding: 5%;
    margin: auto;
    
}

.AboutUs-List li {
    display: block;
    font-size: 18px;
}

.AboutUs-List li:before {
    /*Using a Bootstrap glyphicon as the bullet point*/
    content: "\e013";
    font-family: 'Glyphicons Halflings';
    font-size: 11px;
    float: left;
    margin-top: 4px;
    margin-left: -17px;
    color: #CCCCCC;
}
.home-bullets ul{
    padding-left: 20px;
}
.under-slide li{
    font-size: 140%;
}
.under-slide a{
    color:#333;
    font-weight: 300;
}
.aboutusletter span{
    text-decoration: underline;
}
.aboutusletter h4, .aboutusletter p{
    font-style: italic;
}
#signature{
    font-size: 45px;
    font-family: 'Courgette';
    padding: 25px;
}

/* CONTACT */
iframe{
    border: none;
   /* height: 100%;*/
    width: 100%;
    overflow:hidden
}
.contact-main{
    width:100%; height:100%;
}
#contact-foot.footer{
    margin-top: 0;
}

/* Footer */

footer, #tab-footer {
    color: black;
}
.footer, #tab-footer{
    background-color: #333;
    height: 350px;
    margin-top: 4%;
}

footer .container{
    overflow: auto;
    margin-right: 0;
}
.footer-col{
    width: 33%;
    float: left; 
    padding-top: 0;
    padding-left: 3%;
    margin-bottom: 4%;
}

footer .row {
    margin-bottom: 60px;
}

footer ul {
    list-style-type: none;
    padding-left: 0;
    line-height: 1.7;
}

footer h4 {
    font-size: 18px;
    color: #9FA3A9;
    font-weight: bold;
    margin-top: 30px;
}
.footer-menu ul{
    margin-left: -9px;
}
.footer-contact ul{
    padding-top: 3.5%;
    margin-left: -8px;
}
.footer-contact img{
    padding-top: 6%;
    margin-left: -5%;
    width: 230px;
}
.social-icons h4 {
    margin-left: 4%;
}
.social-icons a{
    color:black;
    font-size: 28px;
    font-weight: bold;
    line-height: 68px;
    margin: 0;
    padding: 0;
    margin-left: 4%;
}

footer li{
    font-size: 140%;
     margin-left: 10px;
}

footer a {
    color: white;
    text-decoration: none
}

footer a:hover,
footer a:focus {
    color: white;
    text-decoration: none;
}
footer .social-icons{
    padding-bottom: 3.75%;
}

footer .social-icons a {
    font-size: 40px;
    padding-right: 20px;
    line-height: 68px;
}

footer .social-icons a:hover {
    text-decoration: none;
    width: 300px;
    height: 300px;
    transition: .2s;
}

footer .fa-facebook-square{
    color: #0077e2;
    transition: all .2s ease-in-out;
}
footer .fa-facebook-square:hover{
    color: #FFFFFF;
    transform: scale(1.2,1.2);
}


footer .fa-instagram {
    color: #bc2a8d;
    transition: all .2s ease-in-out;
}
footer .fa-instagram:hover{
    color: #FFFFFF;
    transform: scale(1.2,1.2);
}
footer .fa-twitter {
    color: #00aced;
    transition: all .2s ease-in-out;
}
footer .fa-twitter:hover{
    color: #FFFFFF;
    transform: scale(1.2,1.2);
}

.pin-icon:before {    
    font-family: 'FontAwesome';
    content: '\f041';
    margin:0 12px 0 0px;
    color: #9fa3a9;
}
.toronto, .postal-code{
    margin:0 5px 0 27px;
}
.mail-icon:before {    
    font-family: 'FontAwesome';
    content: '\f003';
    margin:0 12px 0 0px;
    color: #9fa3a9;
}
.tel-icon:before {    
    font-family: 'FontAwesome';
    content: '\f095 ';
    margin:0 14px 0 0px;
    color: #9fa3a9;
}
.web-icon:before {    
    font-family: 'FontAwesome';
    content: '\f0ac';
    margin:0 10px 0 0px;
    color: #9fa3a9;
}

.service-title{
    background: grey;
    color: white;
    text-align: center;
    padding: 2% 0;
    margin: 2.5% 0;
}

body {
  margin: 50px 0;
}

/* Slideshow */

#slider {

	/* You MUST specify the width and height */
	width:375px;
	height:510px;
    margin-top: 13%;
	position:relative;	
	overflow:hidden;
}

#gallery {
	
	/* Clear the list style */
	list-style:none;
	margin:0;
	padding:0;
	
	z-index:0;
	
	/* width = total items multiply with #mask gallery width */
	width:600px;
	overflow:hidden;
}

	#gallery li {

		
		/* float left, so that the items are arrangged horizontally */
		float:left;
	}


#mask-excerpt {
	
	/* Set the position */
	position:absolute;	
	top:0;
	left:0;
	z-index:500;
	
	/* width should be lesser than #slider width */
	width:600px;
	overflow:hidden;	
	

}
	
#excerpt {
	/* Clear the list style */
	list-style:none;
	margin:0;
	padding:0;
	
	/* Set the position */
	z-index:10;
	position:absolute;
	top:0;
	left:0;
	
	/* Set the style */
	width:600px;
	background-color:#000;
	overflow:hidden;
	font-family:arial;
	font-size:10px;
	color:#fff;	
}
.clear {
	clear:both;	
}

/* Contact Form */
form{
    margin: auto;
    width: 80%;
}
.btn{
    margin: auto;
    margin-left: 40%;
    margin-right: 40%;
    
}
div.modal-footer{
    padding-top: 1px;
    padding-bottom: 1px;
}
#ui-popup-container{
    left: 202px;
    top: 20px;
}
#myPopup{
    margin: auto;
    max-height: 95%;
}
#contact {
    width: 150px;
    background: white;
    
}

.customsidimg img{
   margin: auto;
    padding: 5%;
}

.aboutusletter{
    width: 100%;
    padding: 30px 0;
    margin: auto;
    background-image: url("../images/letter-paper.jpg");
    background-size: cover;
        
}
.AboutUs-List li{
    font-size: 15px;
    width: 75%;
    margin: auto;
}

#signature{
    font-size: 45px;
    font-family: 'Caveat', cursive;
    padding: 25px 35px;
    margin: 0;
}


* { box-sizing: border-box; }
body { 
  margin: 0; 
  padding: 0; 
  background: #FFFFFF;

 
}
h1{ margin: 0; }


#contact {  
    margin: 4em auto;
    width: 150px; 
    height: 30px; 
    line-height: 30px;
    color: white;
    text-align: center;
    cursor: pointer;
    border-radius: 35px;
}

#contact:hover { 
    background: #666; 
}
#contact:active { 
    background: #444;
}
.btn:hover{
    color: aquamarine;
}
#contactForm { 
  display: none;
  border-radius: 30px;
  padding: 2%;
  height: 90%;
  width: 55%;
  text-align: center;
  background: #fff;
  position: fixed;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%); 
  z-index: 1;
}

input, textarea { 
  margin: .8em auto;
  font-family: inherit; 
  text-transform: inherit; 
  font-size: inherit;
  
  display: block; 
  width: 280px; 
  padding: .4em;
}
textarea { 
    height: 80px; 
    resize: none; }

.formBtn { 
  width: 140px;
  display: inline-block;
  background: teal;
  color: #fff;
  font-weight: 100;
  font-size: 1.2em;
  border: none;
  height: 30px;
}


.scrollbar
{
	margin:auto;
	height: 85%;
	width: 90%;
	overflow-y: scroll;
}

.force-overflow
{
	min-height: 90%;
}

/*SERVICE & REPAIR*/
.banner{
    background-color: #333;
    width: 80%;
    margin: auto;
    margin-top: 1%;
    margin-bottom: 1%;
    
}
.banner img{
    max-width: 380px;
    padding: 3.7%;
}

/* CUSTOM */
.row{
    margin: 0px !important;
}

/*MOVING*/
.movereconlist li{
    font-size: 16px;
    margin-left: -5%;
}
/*CONTACT PAGE*/
.contact-page-form{
    width: 50%;
    margin: auto;
}



/* MOBILE SCREENS */
@media screen and (max-width: 720px) {
    .moving-bullets{
        margin-left: 6%;
        font-size: 110%;
    }
    
    .contact-main input, .contact-main select, .contact-main textarea{
  -webkit-user-select: default;
  -khtml-user-select: default;
  -moz-user-select: default;
  -ms-user-select: default;
  user-select: default;
}
   
    footer {
        width: 100%;
        text-align: center;
    }

    footer .info{
        text-align: center;
    }
}

/* MOBILE SCREENS */
@media only screen and (min-width: 320px) and (max-width: 720px) {
    body {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-template-rows: 85px auto auto auto auto auto;
        grid-template-areas:
            "b b"
            "m m"
            "c c"
            "a a"
            "g g"
            "f f";
    }

/*HOME PAGE*/
    
     nav{
        grid-area: b;
        margin: 0;
        width: 100%;
        z-index: 100;
         
          /* Thia is special hamburger stuff */
        height: 85px;
        overflow: hidden;
        transition: .5s;
    }
    .navexpanded {
    height: 605px;
    z-index: 1000;
        position: relative;
    }
     .mob-nav-div{
        margin: 0;
    }
    .mob-nav-div ul{
        display: flex;
        text-align: center;
        align-items: center;
        flex-wrap: wrap;
    }
    .mob-nav-div ul > li{
        margin-top: 14px;
        flex-basis: 100%;
    }
    
    header, .banner, .banner img, .web-nav-div li{
        display: none;
    }
   
    #nav-toggle{
        margin: 0;
        width: 10px;
        flex-basis: 40%;
        text-align: right;
    }
    #mob-logo{
        flex-basis: 50%;
        margin: 0;
        text-align: left;
    }
    
    #mob-logo img{
        height: 50px;
        text-align: left;
    }
    
    #nav-toggle a{
       color: white;
       font-size: 35px;
        text-align: right;
        text-decoration: none;
       vertical-align: sub;
    }
    #nav-toggle a:hover, #mob-logo a:hover{
        background: #333;
        text-decoration: none;
    }
    
    .sidenav, hr{
        display: none;
    }
    
    /* Service Pages */
    .container-fluid, .refurbishing{
        grid-area: c;
        max-width: 100%;
        margin: 0;
    }
    
    .under-slide h2{
        font-size: 180%;
    }
    .under-slide{
        width: 80%;
        margin: 5% auto;
    }
    .home-bullets{
        font-size: 100%
    }
    
    .gethomequote a{
        display: none;
    }
    .mob-gethomequote {
        text-align: center;
        margin: 5% 0;
    }
    .mob-gethomequote a{
        width: 90%;
        margin: auto;
        text-align: center;
        font-size: 120%;
    }
    
/*SERVICE PAGE MOBILE SITE*/
    .web-row{
        display: none;
    }
    .mob-row{
        z-index: -3;
    }
    .main h3{
        width: 87%;
        margin: auto;
        font-size: 130%;
        padding: 2% 0;
    }
    .main p{
        width: 87%;
        margin: auto;
        font-size: 115%;
        padding: 2% 0;
    }
    .main h2{
        font-size: 167%;
        margin-top: 0;
        position: relative;
        z-index: -10;
    }
    .mob-solosets img{
        margin-top: auto;
        width: 100%;
    }
    .under{
        margin: auto;
    }
    /*ABOUT & CONTACT PAGE MOBILE*/
    .aboutusletter, form{
        position: relative;
        
    }
    .aboutusletter{
        z-index: -5;
    }
    
    button[type=submit] a{
        display: none;
    }
    button[type=submit] {
        width: 303px;
        margin: 5% 0;
        text-align: center;
        font-size: 120%;
    }
    
    /*FOOTER mobile SITE*/
    .footer{
        display: none;
    }
    #tab-footer{
        grid-area: f;
        height: 400px;
        margin-top: 7%;
    }
    #tab-footer img{
        padding: 11% 0 0 8%;
        width: 46%;
    }
    #tab-footer a{
        color: white;
        font-size: 14px;
    }
     #tab-footer a, #tab-footer li{
        color: white;
        font-size: 14px;
    }
    #tab-footer ul {
        list-style-type: none;
        line-height: 1.7;
        padding-left: 0;
}
    .tab-sm-icons{
        text-align: left;
        padding-left: 9%;
    }
    .tab-sm-icons i{
        font-size: 27px;
        padding: 6% 3% 2%;
        color: white;
    }
    .tab-footer-contact{
        width: 95%;
        padding-left: 6%;
        text-align: left;
        font-size: 70%;
    }
    .tab-footer-contact img{
       display: none;
    }
}

@media only screen and (min-width:  720px) and (max-width: 1023px) and  (orientation : portrait){
/* Styles */
      body {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-template-rows: auto ;
        grid-template-areas:
            "b "
            "m "
            "c "
            "f ";
    }
     .mob-nav-div, .web-row, .mob-gethomequote, .footer, .mob-sm-icons, #tab-footer{
         display: none;
    }
    .footer-contact img{
        display: none;
    }
    
    /* TOP */
    .banner{
        margin: 0;
        width: 100%;
        flex-basis: 80%;
        grid-area: b;
    }
     .banner img{
        padding: 1% 2%;
        height: 75px;
    }
    .gethomequote{
        margin: 2%;
        text-align: center;
    }
    .gethomequote a{
        font-size: 16px;
        margin: 0;
    }
    header{
        flex-basis: 100%;
        grid-area: m; 
    }
    nav{
        margin: 0;
        width: 100%;
    }
    .web-nav-div li{
        padding: .5% 0;
        margin: 0;
    }
    .web-nav-div a{
        padding: 10px 10px;
        margin: 0;
        font-size: 94%;
    }
    .web-nav-div a:hover{
        background: #333;
    }
    /* ALL MAIN */
    .container-fluid{
        width: 100%;
        grid-area: c;
    }
    .col-sm-4{
        margin: 0;
    }
    .under-slide h2{
        font-size: 17px;
    }
    .under-slide ul{
        font-size: 10px;
    }
    .mob-solosets img{
        width: 100%;
    }
    
 
    /* ABOUT SITE */
    .aboutusletter{
    width: 100%;
    padding: 30px;
    margin: auto;
    background-image: url("../images/letter-paper.jpg");
    background-size: cover;
        
    }
    .AboutUs-List {
    width: 75%;
    margin: auto;
    }

    #signature{
    font-size: 45px;
    font-family: 'Caveat', cursive;
    padding: 25px 35px;
    margin: 0;
    }
    
     /* MOVING */
     .moving-bullets{
        font-size: 110%;
    }
     /*WEB footer*/
    footer{
        background: #333;
        font-size: 70%;
    }
    .footer{
        display: block;
    }
    .footer-contact img{
        display: inline;
        width: 175px;
    }
     #contact-foot{
        width: 80%;
        margin: auto;
        grid-area: f;
    }
    footer .social-icons a{
        font-size: 30px;
    }
}
@media only screen and (min-width : 720px) and (max-width : 1023px) and (orientation : landscape) {
/* Styles */
    html {
        font-size: 16px;
    }
        body {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-template-rows: auto auto ;
        grid-template-areas:
            "b b"
            "m m"
            "c c"
            "a a"
            "g g"
            "f f";
    }
     .mob-nav-div, .mob-sm-icons, nav, .mob-gethomequote, .mob-row, .mob-solosets, #tab-footer{
        display: none;
    }
    .banner{
        margin: 0 auto 0 auto ;
        width: 80%;
        grid-area: b;
    }
    .banner img{
        height: 100px;
        padding: 2% 4%;
    }
    
    
    nav{
        text-align: center;
        margin: 0 auto;
        width: 80%;
        grid-area: m;
    }
    nav li{
        font-size: .79em;
    }
     .web-nav-div a{
        padding: 10px 10px;
        font-size: 70%;
    }
     .container-fluid{
        grid-area: c;
    }
    
    .contact-container{
         width: 75%;
    }
    /* ABOUT SITE */
    .aboutusletter{
    width: 70%;
    padding: 30px;
    margin: auto;
    background-image: url("../images/letter-paper.jpg");
    background-size: cover;
        
    }
    .AboutUs-List {
    width: 75%;
    margin: auto;
    }

    #signature{
    font-size: 45px;
    font-family: 'Caveat', cursive;
    padding: 25px 35px;
    margin: 0;
    }
    
    /*WEB footer*/
    footer{
        padding-bottom: 20%;
        background: #333;
        font-size: 80%;
    }
    .footer{
        display: block;
    }
    .footer-contact img{
        display: inline;
        width: 175px;
    }
     #contact-foot{
        width: 80%;
        margin: auto;
        grid-area: f;
    }
    
}

@media only screen and (min-width : 870px) and (max-width : 1023px) {
    nav div li{
        font-size: 1em;
    }
}

/* Desktops and laptops ----------- */
@media only screen and (min-width : 1024px) and (max-width : 1440px) {
    /* Styles */
        body {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-template-rows: auto ;
        grid-template-areas:
            "b "
            "m "
            "c "
            "f ";
    }
     .mob-nav-div, .mob-sm-icons, nav, .mob-gethomequote, .mob-row, .mob-solosets, #tab-footer{
        display: none;
    }
    .banner{
        margin: auto;
        width: 80%;
        grid-area: b;
    }
    
    
    nav{
        text-align: center;
        margin: auto;
        width: 80%;
        grid-area: m;
    }
    nav li a{
        font-size: 100%;
        padding: 12px 14px;
    }
    
    /*MAIN*/
    .web-row{
        display: block;
        width: 100%;
        grid-area: c;
    }
    .contact-container{
        width: 80%;
        
    }
    .contact-main h2{
        width: 100%;
    }
    
     /* MOVING */
     .moving-bullets{
        font-size: 120%;
    }
    
    /* ABOUT SITE */
    .aboutusletter{
    width: 70%;
    padding: 30px;
    margin: auto;
    margin-top: 50px;
    background-image: url("../images/letter-paper.jpg");
    background-size: cover;
        
    }
    .AboutUs-List {
    width: 90%;
    margin: auto;
    }

    #signature{
    font-size: 45px;
    font-family: 'Caveat', cursive;
    padding: 25px 35px;
    margin: 0;
    }
    
     /* CUSTOM */
    .row{
    margin: 0px !important;
    }
    .under img{
    padding: 0;
    padding-top: 5%;
    text-align: center;
    margin: auto;
    }
    
    
    /*WEB footer*/
    .footer{
        display: block;
    }
    .footer-contact img{
        display: inline;
    }
     #contact-foot{
        width: 80%;
        margin: auto;
    }
}
/* Large screens ----------- */
@media only screen and (min-width : 1440px) {
 /* Styles */
        body {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-template-rows: auto ;
        grid-template-areas:
            "b "
            "m "
            "c "
            "f ";
    }
     .mob-nav-div, .mob-sm-icons, nav, .mob-gethomequote, .mob-row, .mob-solosets, #tab-footer{
        display: none;
    }
    .banner{
        margin: auto;
        width: 80%;
        grid-area: b;
    }
    
    
    nav{
        text-align: center;
        margin: auto;
        width: 80%;
        grid-area: m;
    }
    
    nav li a{
        font-size: 150%;
    }
    
    /*MAIN*/
    .web-row{
        display: block;
        width: 100%;
        grid-area: c;
    }
    .contact-container{
        width: 80%;
        
    }
    .contact-main h2{
        width: 100%;
    }
    
     /* MOVING  */
     .moving-bullets{
        font-size: 120%;
    }
    
    /* ABOUT SITE */
    .aboutusletter{
    width: 70%;
    padding: 30px;
    margin: auto;
    margin-top: 50px;
    background-image: url("../images/letter-paper.jpg");
    background-size: cover;
        
    }
    .AboutUs-List {
    width: 90%;
    margin: auto;
    }

    #signature{
    font-size: 45px;
    font-family: 'Caveat', cursive;
    padding: 25px 35px;
    margin: 0;
    }
    
     /* CUSTOM */
    .row{
    margin: 0px !important;
    }
    .under img{
    padding: 0;
    padding-top: 5%;
    text-align: center;
    margin: auto;
    }
    
    
    /*WEB footer*/
    .footer{
        display: block;
    }
    .footer-contact img{
        display: inline;
    }
     #contact-foot{
        width: 80%;
        margin: auto;
    }
}