#order {
        position: relative;
        width: 400px;
        height: auto;
}
#order fieldset {
        width: 370px;
        height: auto;
        border: 1px solid grey;
        border-radius: 10px;
}
#halforder {
        display: block;
        border-radius: 5px;
        width: 175px;
	height: 30px;
        float: left;
        margin: 2px;
}
#fullorder {
        display: block;
        border-radius: 5px;
        width: 360px;
	height: 30px;
        float: left;
        margin: 2px;
}
/*
#street {
        display: block;
        border-radius: 5px;
        width: 300px;
        height: 30px;
        float: left;
        margin: 2px;
}
#street-nmb {
        display: block;
        border-radius: 5px;
        width: 50px;
        height: 30px;
        float: left;
        margin: 2px;
}
*/
#order #button {
        display: block;
        border-radius: 5px;
        width: 175px;
	height: 30px;
        float: left;
        margin: 2px;
        box-shadow: none;
}
#order #extra {
        box-shadow:inset 0px 0px 4px #00006a;
        display: block;
        border-radius: 5px;
        width: 360px;
	height: 30px;
        float: left;
        margin: 2px;
}
#order #extraarea {
        box-shadow:inset 0px 0px 4px #00006a;
        display: block;
        border-radius: 5px;
        width: 360px;
        height: 60px;
        float: left;
        margin: 2px;
}
@media only screen and ( max-width: 1130px )
{
        #order {
                width: 240px;
                height: auto;
        }
        #order fieldset {
                width: 230px;
                height: auto;
        }
        #halforder {
                width: 220px;
                height: 30px;
        }
        #fullorder {
                width: 220px;
                height: 30px;
        }
        #street {
                width: 160px;
                height: 30px;
        }
        #street-nmb {
                width: 50px;
                height: 30px;
        }
        #order #button {
                width: 200px;
                height: 30px;
        }
        #order #extra {
                width: 220px;
                height: 30px;
        }
	#order #extraarea {
		width: 220px;
	}
}
@media only screen and ( max-width: 640px )
{
	#order {
	        width: 240px;
	        height: auto;
	}
	#order fieldset {
	        width: 230px;
	        height: auto;
	}
	#halforder {
	        width: 220px;
	        height: 30px;
	}
	#fullorder {
	        width: 220px;
	        height: 30px;
	}
	#street {
	        width: 160px;
	        height: 30px;
	}
	#street-nmb {
	        width: 50px;
	        height: 30px;
	}
	#order #button {
	        width: 200px;
	        height: 30px;
	}
	#order #extra {
		width: 220px;
		height: 30px;
	}
        #order #extraarea {
                width: 220px;
        }

}

#order #button:valid {
        box-shadow: none;
}
#order input[type=checkbox] {
        visibility: hidden;
}
.checkme2 {
        width: 20px !important;
        height: 20px !important;
        background: #d5d5d5;
        border-radius: 25%;
        margin: 2px;
        position: relative;
        float: left;
        box-shadow: 0px 0px 3px black;
}
.checkme2 label {
        display: block;
        width: 16px;
        height: 16px;
        border-radius: 25%;
        transition: all .5s ease;
        cursor: pointer;
        position: absolute;
        top: 2px;
        left: 2px;
        z-index: 1;
        background: #2e2e2e;
        box-shadow:inset 0px 0px 4px #156116;
}

.checkme2 input[type=checkbox]:hover + label {
        background: #156116;
        box-shadow:inset 0px 0px 4px black;
}
.checkme2 input[type=checkbox]:checked + label {
        background: #26ca28;
        box-shadow:inset 0px 0px 4px black;
}

.checkme {
        width: 20px !important;
        height: 20px !important;
        background: #d5d5d5;
        border-radius: 25%;
        margin: 2px;
        position: relative;
        float: left;
        box-shadow: 0px 0px 3px black;
}
.checkme label {
        display: block;
        width: 16px;
        height: 16px;
        border-radius: 25%;
        transition: all .5s ease;
        cursor: pointer;
        position: absolute;
        top: 2px;
        left: 2px;
        z-index: 1;
        background: #2e2e2e;
        box-shadow:inset 0px 0px 4px #156116;
}

.checkme input[type=checkbox]:hover + label {
        background: #156116;
        box-shadow:inset 0px 0px 4px black;
}
.checkme input[type=checkbox]:checked + label {
        background: #26ca28;
        box-shadow:inset 0px 0px 4px black;
}
#order input {
        transition: all 0.5s;
        background: #d5d5d5;
}
#order input:focus {
        background: white;
        height: 35px;
}
#order input:required {
        box-shadow:inset 0px 0px 4px #6c0000;
}
#order input:valid {
        box-shadow:inset 0px 0px 4px #156116;
}
#order select {
        display: block;
        border-radius: 5px;
        width: 50px;
	float: right;
        height: 30px;
        margin: 2px;
}
#order p {
        margin: 0px 0px -1px 30px;
        font-style: left;
        line-height: 25px;
}
#shop {
        max-width: 660px;
        height: auto;
        margin: auto;
}
@media only screen and ( max-width: 1140px )
{
        #shop {
                max-width: 440px;
                height: auto;
                margin: auto;
        }
}
@media only screen and ( max-width: 780px )
{
        #shop {
                max-width: 220px;
                height: auto;
                margin: auto;
        }
}
#shopgrid {
        float: left;
        position: relative;
        width: 200px;
        height: 325px;
        margin: 10px;
        box-shadow: 0px 0px 15px black;
}
.imgholder1 {
        background: url(../shop/shop1.jpg) no-repeat;
        background-size: 100%;
	border: inset 3px;
        width: 180px;
        height: 144px;
        margin: 10px auto;
}
.imgholder2 {
        background: url(../shop/shop2.jpg) no-repeat;
        background-size: 100%;
        border: inset 3px;
        width: 180px;
        height: 144px;
        margin: 10px auto;
}
.imgholder3 {
        background: url(../shop/shop3.jpg) no-repeat;
        background-size: 100%;
        border: inset 3px;
        width: 180px;
        height: 144px;
        margin: 10px auto;
}
.imgholder4 {
        background: url(../shop/shop4.jpg) no-repeat;
        background-size: 100%;
        border: inset 3px;
        width: 180px;
        height: 144px;
        margin: 10px auto;
}
.imgholder5 {
        background: url(../shop/shop5.jpg) no-repeat;
        background-size: 100%;
        border: inset 3px;
        width: 180px;
        height: 144px;
        margin: 10px auto;
}
.imgholder6 {
        background: url(../shop/shop6.jpg) no-repeat;
        background-size: 100%;
        border: inset 3px;
        width: 180px;
        height: 144px;
        margin: 10px auto;
}
.imgholder7 {
        background: url(../shop/shop7.jpg) no-repeat;
        background-size: 100%;
        border: inset 3px;
        width: 180px;
        height: 144px;
        margin: 10px auto;
}
.imgholder8 {
        background: url(../shop/shop8.jpg) no-repeat;
        background-size: 100%;
        border: inset 3px;
        width: 180px;
        height: 144px;
        margin: 10px auto;
}
.imgholder9 {
        background: #808080 url(../shop/shop9.png) no-repeat;
        background-size: 100%;
        border: inset 3px;
        width: 180px;
        height: 144px;
        margin: 10px auto;
}
#shopgrid .addbasket {
	display: block;
        position: absolute;
        bottom: 26px;
        right: 3px;
	background: #d5d5d5;
	border: 2px outset;
	text-align: center;
	line-height: 20px;
        border-radius: 5px;
        width: 18px;
        height: 18px;
}
#shopgrid .addbasket:active {
        display: block;
        position: absolute;
        bottom: 26px;
        right: 3px;
        background: #d5d5d5;
        border: 2px inset;
        text-align: center;
        line-height: 20px;
        border-radius: 5px;
        width: 18x;
        height: 18px;
}
#shopgrid h3 {
        position: absolute;
        bottom: 16px;
        right: 30px;
        font-size: 16px;
        color: black;
}
.cloak {
        position: absolute;
        width: 200px;
        height: 325px;
        top: 0px;
        left: 0px;
        opacity: 0.5;
        background: black;
}
#cartbtn {
        display: block;
        border-radius: 5px;
        width: 175px;
        height: 30px;
        float: left;
        margin: 2px;
        box-shadow: none;
}
#shopgrid .minusbasket {
        display: block;
        position: absolute;
        bottom: 3px;
        right: 3px;
        background: #d5d5d5;
        border: 2px outset;
        text-align: center;
        line-height: 20px;
        border-radius: 5px;
        width: 18px;
        height: 18px;
}
#shopgrid .minusbasket:active {
        display: block;
        position: absolute;
        bottom: 3px;
        right: 3px;
        background: #d5d5d5;
        border: 2px inset;
        text-align: center;
        line-height: 20px;
        border-radius: 5px;
        width: 18px;
        height: 18px;
}