body	{
	margin-left: auto;
	margin-right: auto;
	width: auto;
	background-color: #18191A;
	font-size: 100%;
	}
header {
	width: 100%;
	height: auto;
	background: linear-gradient(#3A3B3C,#242526);
	}
nav	{	
	text-decoration: none;
	padding: 10px 0px 10px 0px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	}
p#navleft {
	display: inline-block;
	color: white; font-size:
	28px; margin-bottom: 0px;
}
p#navmid {
	display: inline-block;
	color: white;
	font-size: 24px;
	margin-bottom: 0px;
}
p#navright {
	color: grey;
	font-size: 18px;
	margin-bottom: 0px;
}
.mobile{
	display: none;
}
.box {
	text-align: center;
	width: 478px;
	height: 480px;
	display: inline-block;
}
.box-mp {
	text-align: center;
	width: 956px;
	height: 480px;
	display: inline-block;
}
/* parat */
.box-p {
	background: #18191A;
	color: white;
	font-size: 38px;
	width: 180px;
}
.box-mp-p {
	background: #18191A;
	color: white;
	font-size: 38px;
	width: 350px;
}
/* paran alempi desc */
.box-mp-pa{
	margin-top: 300px; 
	color: white; 
	background: #18191A; 
	width: fit-content; 
	margin-left: auto; 
	margin-right: auto;
}
.box-av {
	background: #18191A;
	color: white;
	font-size: 38px;
	width: auto;	
}
#it {
	background-image: url('/kuvat/palvelut/lopendata_it_tuki.png');
	opacity: 0.4;
}
#it:hover {
	background-image: url('/kuvat/palvelut/lopendata_it_tuki.png');
	opacity: 0.7;
}
#huolto {
	background-image: url('/kuvat/palvelut/lopendata_huolto.png');
	opacity: 0.4;
}
#huolto:hover {
	background-image: url('/kuvat/palvelut/lopendata_huolto.png');
	opacity: 0.7;
}
#asennukset {
	background-image: url('/kuvat/palvelut/lopendata_asennukset.png');
	opacity: 0.4;
	margin-top: 4px;
}
#asennukset:hover {
	background-image: url('/kuvat/palvelut/lopendata_asennukset.png');
	opacity: 0.7;
}
#kotisivut {
	background-image: url('/kuvat/palvelut/lopendata_kotisivut.png');
	opacity: 0.4;
	margin-top: 4px;
}
#kotisivut:hover {
	background-image: url('/kuvat/palvelut/lopendata_kotisivut.png');
	opacity: 0.7;
}
#simulaattori {
	background-image: url('/kuvat/palvelut/lopendata_simulaattori.png');
	opacity: 0.4;
}
#simulaattori:hover {
	background-image: url('/kuvat/palvelut/lopendata_simulaattori.png');
	opacity: 0.7;
}
#virtuaalitodellisuus {
	background-image: url('/kuvat/palvelut/lopendata_virtuaalitodellisuus.png');
	opacity: 0.4;
}
#virtuaalitodellisuus:hover {
	background-image: url('/kuvat/palvelut/lopendata_virtuaalitodellisuus.png');
	opacity: 0.7;
}
#kolmedtulostus {
	background-image: url('/kuvat/palvelut/lopendata_3dtulostus.png');
	opacity: 0.4;
}
#kolmedtulostus:hover {
	background-image: url('/kuvat/palvelut/lopendata_3dtulostus.png');
	opacity: 0.7;
}
#kayttoonotto {
	background-image: url('/kuvat/palvelut/lopendata_kayttoonotto.png');
	opacity: 0.4;
}
#kayttoonotto:hover {
	background-image: url('/kuvat/palvelut/lopendata_kayttoonotto.png');
	opacity: 0.7;
}
.content	{
	width: 960px;
	margin-left: auto;
	margin-right: auto;
	display: block;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 50px 0px 50px 0px;
	background-color: #242526;
	text-decoration: none;
	overflow: auto;
	}
#nopadding {
	padding: none;
}
a	{
	text-decoration: none;
	color: #E4E6DE;
	}
h1	{
	font-size: 60px;
	border-radius: 15px 0px 15px 0px;
	background: linear-gradient(#3A3B3C, #242526);
	width: 320px;
	color: #CDCFC7;
	font-family: Trebuchet MS;
	}
h1:hover{
	font-size: 60px;
	border-radius: 15px 0px 15px 0px;
	background: linear-gradient(#242526, #3A3B3C);
	width: 320px;
	color: #E4E6DE;
	font-family: Trebuchet MS;
	}
h2	{
	font-size: 40px;
	font-family: Verdana;
	color: #E4E6DE;
	}
h3	{
	font-size: 30px;
	font-family: Verdana;
	padding-top: 0px;
	color: #E4E6DE;
	padding: 0px 20px 0px 20px;
	}
h3.line{
	font-size: 30px;
	font-family: Verdana;
	padding-top: 0px;
	color: #E4E6DE;
	border-top: 1px solid white;
	padding-top: 20px;
	margin-top: 0px;
	}
p	{
	font-size: 20px;
	font-family: Trebuchet MS;
	color: #7FA5B8;
	padding: 0px 20px 0px 20px;
	}
p.footer
    {
    padding: 20px 0px 20px 0px;
    }
.center	{
	text-align: center;
	}
a[href^="tel:"] {
	text-decoration: none;
	}
footer {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	background: linear-gradient(#3A3B3C, #242526);
	margin-top: 0px;
	}
.ul-footer {
	display: inline-block;
	font-size: 24px;
	font-family: Trebuchet MS;
	color: white;
	padding: 10px 10px 10px 10px;
	list-style-type: none;
	width: 30%;
}
.ul-footer-right {
	display: inline-block;
	font-size: 24px;
	font-family: Trebuchet MS;
	color: white;
	padding: 10px 10px 10px 10px;
	list-style-type: none;
	width: 30%;
	text-align: right;
}
li:hover {
	text-decoration: underline;
}
.img-footer {
	display: inline-block;
	width: auto;
	height: auto;
	max-height: 180px;
}
#right {
	text-align: right;
}
.content-container-grid-3 {
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
	width: 100%;
	height: auto;
	display: grid;
	background: linear-gradient(#3A3B3C, #242526);
	margin-left: auto;
	margin-right: auto;
}
.content-container-grid-item {
	width: auto;
	height: auto;
	padding: 5px 0px 5px 5px;
	text-align: left;
}
.content-container-grid-item-r {
	width: auto;
	height: auto;
	padding: 5px 5px 5px 0px;
	text-align: right;
}
li {
	color: white;
	list-style-type: none;
	font-size: 24px;
	font-family: Trebuchet MS;
	padding: 10px 0px 10px 0px;
}
@media only screen and (max-width: 1200px) {
.mobile {
	display: inline-block;
}
#it {
	background-image: url('/kuvat/palvelut/lopendata_it_tuki_koko.png');
	opacity: 0.4;
	width: 100%;
}
#it:hover {
	background-image: url('/kuvat/palvelut/lopendata_it_tuki_koko.png');
	opacity: 0.7;
}
#huolto {
	background-image: url('/kuvat/palvelut/lopendata_huolto_koko.png');
	opacity: 0.4;
	width: 100%;
}
#huolto:hover {
	background-image: url('/kuvat/palvelut/lopendata_huolto_koko.png');
	opacity: 0.7;
}
#asennukset {
	background-image: url('/kuvat/palvelut/lopendata_asennukset_koko.png');
	opacity: 0.4;
	width: 100%;
}
#asennukset:hover {
	background-image: url('/kuvat/palvelut/lopendata_asennukset_koko.png');
	opacity: 0.7;
}
#kotisivut {
	background-image: url('/kuvat/palvelut/lopendata_kotisivut_koko.png');
	opacity: 0.4;
	width: 100%;
}
#kotisivut:hover {
	background-image: url('/kuvat/palvelut/lopendata_kotisivut_koko.png');
	opacity: 0.7;
}
.content-container-grid-3 {
	grid-template-columns: 1fr;
}
body {
	margin: 0;
}
.navleft {
	display: block;
}
.navmid {
	display: block;
}
.navright {
	display: block;
}
.content {
	width: 100%;
}
.box {
	width: 100%;
	height: auto;
	min-height: 480px;
	background-repeat: no-repeat;
}
.box-av {
	width: 100%;
}
.content-container-grid-3 {
	width: 100%;
}
.box-mp {
	width: 100%;
	background-repeat: no-repeat;
}
.box-mp-pa {
	width: auto;
	margin-left: unset;
	margin-right: unset;
	overflow: unset;
}
.content-container-grid-item {
	text-align: center;
}
.content-container-grid-item-r {
	text-align: center;
}
}
@media only screen and (max-width: 600px) {
.box-av {
    width: 100%;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}
.content-container-grid-item {
	margin-left: auto;
    margin-right: auto;
    min-width: 325px;
    text-align: center;
}
.content-container-grid-item-r {
	margin-left: auto;
    margin-right: auto;
    min-width: 325px;
    text-align: center;
}
}