@media (min-width:1em){
header{display:none;}

#mainsection{disdplay:flex;fdlex-direction:row-reverse;}
/*
nav{background:rgb(150,150,150);fledx:1;padding:.3em;text-align:left;}
nav li{display:block;margin-bottom:.4em;}
nav ul li:after{content: "";}
nav ul li:last-child:after{content:"";}
nav li a{display:block;hfeight:75px;wfidth:48px;color:rgba(0,0,0,255);margin:0 auto 0 auto;padding:.2em;border:1px solid rgba(0,0,100,255);}
nav li input{display:block;height:2.4em;width:min-width:50em;color:rgba(0,0,0,255);marfgin:0 auto 0 auto;paddfing:.2em;border:1px solid rgba(0,0,100,255);}
//nav li input{width:100%;}

nav li a:link{color:rgb(255,255,255);border:1px solid rgba(100,100,100,15);background-color:rgba(100,100,100,15);}
nav li a:visited{color:rgb(205,205,205);border:1px solid rgba(100,100,100,15);}
nav li a:hover{color:rgb(200,200,255);border:1px solid red;}
*/
.topnav {overflow: hidden;background-color: #333;position: relative;hpadding: 3em 0 0 0;}

/* Hide the links inside the navigation menu (except for logo/home) */
.topnav #myLinks {display: none;}

/* Style navigation menu links */
.topnav a {color: white;padding: 1em;text-decoration: none;font-size: 1em;display: block;}
.topnav a.active span{display:none;}

/* Style the hamburger menu */
.topnav a.icon {background: black;display: block;position: absolute;right: 0;top: 0;}

/* Add a grey background color on mouse-over */
.topnav a:hover {background-color: #ddd;color: black;}

/* Style the active link (or home/logo) */
.active {background-color: rgb(150,150,150);color: white;height:3.25em;}

.active:before{font-weight:bold;content:"Nash Design & Development LLC";}




.content{fldex:3;padding:.1em;}
.side{}
.imgsize{width:15em;}




//it is showing smallest style

#mainfooter{}





}




@media (min-width:40em){
header{display:block;background:rgba(100,100,100,15);margin:0;padding:1em;background-image:url(slice1.png);background-repeat:no-repeat;background-position:right 1em bottom 0em;background-size:10em 3em;color:white;}
#mainsection{}

.topnav #myLinks{display:block;margin-right:3em;}
nav.topnav{background:rgb(150,150,150);padding:.3em;text-align:right;position:static;overflow:visible;display:block;}
nav.topnav a{display:inline-block;padding:.2em;margin:0;font-size:auto;position:static;border:1px solid rgba(100,100,100,15);}
nav.topnav a:after{condtent: " | ";}
nav.topnav a:last-child:after{content:"";}
nav.topnav a.icon{background:inherit;display:none;}
nav.topnav input{}
nav.topnav a:link{color:rgb(255,255,255);background-color:rgba(100,100,100,15);}
nav.topnav a:visited{color:rgb(205,205,205);}
nav.topnav a:hover{color:rgba(100,100,100,15);border:1px solid rgb(150,150,150);}
nav.topnav a:active span{}
nav.topnav a.active{background-color:transparent;height:2.5em;width:33em;display:block;position:absolute;left:0;top:.8em;border:none;}
.active:before{font-weight:normal;content:"";}
.content{flex:3;padding:.1em;}
.side{}
.imgsize{width:30em;}

#mainfooter{}
}



@media (min-width:100em){
header{display:block;background:rgba(100,100,100,15);margin:0;padding:3em;background-image:url(slice1.png);background-repeat:no-repeat;background-position:right 1em bottom 0em;background-size:17em 6em;color:white;}
#mainsection{}

.topnav #myLinks{display:block;margin-right:3em;}
nav.topnav{background:rgb(150,150,150);padding:.3em;text-align:right;position:static;overflow:visible;display:block;}
nav.topnav a{display:inline-block;padding:.2em;margin:0;font-size:auto;position:static;border:1px solid rgba(100,100,100,15);}
nav.topnav a:after{condtent: " | ";}
nav.topnav a:last-child:after{content:"";}
nav.topnav a.icon{background:inherit;display:none;}
nav.topnav input{}
nav.topnav a:link{color:rgb(255,255,255);background-color:rgba(100,100,100,15);}
nav.topnav a:visited{color:rgb(205,205,205);}
nav.topnav a:hover{color:rgba(100,100,100,15);border:1px solid rgb(150,150,150);}
nav.topnav a:active span{}
nav.topnav a.active{background-color:transparent;height:5em;width:35em;display:block;position:absolute;left:0;top:1em;border:none;}
.active:before{font-weight:normal;content:"";}
.content{flex:3;padding:.1em;}
.side{}
.imgsize{width:30em;}

#mainfooter{}


}

*{box-sizing:border-box;}
html, head, img, form, input{margin:0;padding:0;mahx-width:100%;}
form{display:inline;}
body{position:absolute;margin:0;padding:0;background-color:rgb(255,255,255);bodrder:15px solid yellow;min-height:100vh;width:100%;}
header{}
section{margin:0;padding:0;}
#mainsection{min-hejight:20em;margifn-bottom:2em;padding-bottom: 3em;bdorder:15px solid yellow}
section p{}
h1{margin:0;padding:0;}
h2{margin:0;padding:0;}
h3{margin:0;padding:0;}
h4{margin:0;padding:0;}
ul, li, ol{margin:0;padding:0;}
a{text-decoration:none;color:rgba(0,0,0,255);}

nav{}


article{margin:0 0 1em 0;padding:.5em;border:1px solid black;}
article header{margin:0;padding:0;}
article h2{}
article h3{}
article ol, article ul{margin:1em;padding;0;}
article li{margin:0 0 0 1em;padding:0 1em 0 0;}
article p{padding:.1em;margin:.3em;}
article blockquote{display:block;padding:.5em;margin:.5em .5em .5em 1.3em;}
article footer{margin:0;padding:0;}


.content div{float:left;margin:1em;}
.gcontent div a{display:block;height:3em;width:6em;text-align:center;vertical-align:middle;color:blue;border:1px solid blue;}



#mainfooter{margin:0 0 0 0;paddding:.5em;heigght:2em;makx-width:100%;position:absolute;gborder:5px solid yellow;bottom:0px;width:100%;tclear:both;text-align:center;}
#mainfooter p{height:2em;margin:0;padding:0;vertical-align:middle;}
.big{font-size:5em;color:red;}
.clear{clear:both;}