/* CSS Document */

body {
	background-color: #ffffff;
}


nav {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
		
	width: 100%;
	background: #16191b;
	margin-bottom: 20px;
	
}

footer {
	width: 100%;
	background: #16191b;
	margin-top: 20px;
	text-align: center;
	position: fixed;
	bottom: 0;
	
}

*, ::after, ::before {
    box-sizing: border-box;
}

.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;    
	padding: 6rem 1.5rem 3rem;
}
.starter-template {

    text-align: center;
}

.wrapper {
	display: grid;
	grid-template-columns: 100%; 

	
}

div[class^="col"] {
	width: 100%;
}

	.img-fluid {
	  max-width: 100%;
	  height: auto;
	}


.box {
	font-family: sans-serif;
	background-color: #fff;
	color: #252525;
	padding: 1em;	
}

.box img {
	padding: none ;
}

nav .box, footer .box {
	background-color: #16191b;
	color: #fff;
	
}

* {
	box-sizing: border-box;
}

@media only screen and (max-width: 768px) {
  /* For mobile phones: */
	.wrapper {
		display: block;
		/*grid-template-columns: 100%; */


	}	
	
	
   [class*="col"] {
	   width: 100%;
	   margin-bottom: 10px;
	  }
}
@media only screen and (min-width: 600px) {

	.wrapper {

    display: grid;
    grid-template-columns: repeat(12, 90px);
    grid-template-rows: 1fr;
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    justify-items: stretch;
    align-items: stretch;	
	width: 1200px;
	margin: auto;		

	
}
	/* For desktop: */
	.col1 {
		grid-column: auto / span 1;
	}

	.col2 {
		grid-column: auto / span 2;	
	}

	.col3 {
		grid-column: auto / span 3;
	}

	.col4 {
		grid-column: auto / span 4;
	}

	.col5 {
		grid-column: auto / span 5;
	}

	.col6 {
		grid-column: auto / span 6;
	}

	.col7 {
		grid-column: auto / span 7;
	}

	.col8 {
		grid-column: auto / span 8;
	}

	.col9 {
		grid-column: auto / span 9;
	}

	.col10 {
		grid-column: auto / span 10;
	}

	.col11 {
		grid-column: auto / span 11;
	}

	.col12 {
		grid-column: auto / span 12;
	}	

	

}
