.grid-container{
    display:grid;
    grid-template-columns:200px 200px;
    column-gap: 1vw;
    row-gap: 1vw;
    grid-template-areas:
    "header header"
    "sidebar content";
}

.grid-container-1{
    display:none;
}

.space{
    margin-top:5%;
    margin-bottom:5%;
}
.Form{
	margin-left:10%;
    margin-top:1%;
	display:flex;
	position:relative;
    justify-content: space-evenly;
	border-radius: 8px;
	width: 80%;
	max-width:100vw;
	height:auto;
	/*box-shadow: inset 0 0.5px 0 #fff3, 0 0 1px #000;*/
	z-index:1;
}

.grid-item{
    font-size:0.9vw;
    color:black;
    justify-content: center;
    display:flex;
    align-items:center;
    font-weight: bold;
    text-align:center;
}

input{
 width:100%;
 padding-left:5%;
 height:35px;
 border-radius: 2rem;
 background-color:#F1F1F1 ;
 border:none;
}

.big{
    font-weight:bold;
    font-size:1.5vw;
}




.quantity{
    text-align: center;
    width:50%;
    
}

.quantity1{
    text-align: center;
    width:50%;
    margin-top: 1vh;
}

.checkbox-input{
    width:15%;
    height:70%;
}

.grid-item-text{
    font-size:1vw;
    color:black;
    background-color:#F1F1F1 ;
    border-radius: 2rem;
    justify-content: center;
    display:flex;
    align-items:center;
}

.grid-item-checkbox{
    font-size:1vw;
    color:black;
    border-radius: 2rem;
    justify-content: center;
    display:flex;
    align-items:center;  
}

.grid-item-1{
    grid-area:header;
}

.grid-item-2 .grid-item-4 .grid-item-6{
    grid-area:sidebar;
}

.grid-item-10{
    justify-content: right;
    grid-column: 1/-1;
    grid-row:2/6;
}
.button{
    display:flex;
    justify-content: center;
    height: 100%;
}



.border{
    width: 10vw;
    height: 5vh;
    font-size: 15px;
    border-radius: 20px;
    color: #4AAD52;
    border: 1px solid #4AAD52;
    background-color: transparent;
}




.kosik{
    display:flex;
    width:20%;
    margin-right:10%;
}

.kosik2{
    display:flex;
    width:20%;
    margin-right:10%;
}

.kosik3{
    display:flex;
    width:20%;
}


.submit:active {
    background-color: rgb(0, 0, 0);
  }


  .btn-purchase,.btn-primary,button{
    display:flex;
    width: 75%;
    height: 75%;
    color: white;
    align-items: center;
    font-size: 15px;
    border-radius: 20px;
    font-weight: 600;
    border: none;
    background-color: #4AAD52;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
    cursor: pointer;
}





  a{
    pointer-events:all;
  }

  a.disabled {
    pointer-events: none;
}

.btn-primary:hover {
    transform: scale(1.05);
    transition: ease-in-out 100ms;
    background-color: #F6F930;
    color: black;
}




.fill{
    display:flex;
    width: 75%;
    height: 100%;
    color: white;
    align-items: center;
    font-size: 15px;
    border-radius: 20px;
    font-weight: 600;
    border: none;
    background-color: #4AAD52;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}

.fill:hover{
    transform: scale(1.05);
    transition: ease-in-out 100ms;
    background-color: #F6F930;
    color: black;
}


@media screen and (max-width: 990px) {
.Form{
	display:block;
    margin-left:0;
    height:auto;
    margin-top:10%;
    margin-left:10%;
}

.grid-container{
    display:none;
   
}

.grid-container-1{
    display:grid;
    grid-template-columns:200px 200px;
    column-gap: 1vw;
    row-gap: 1vw;
    grid-template-areas:
    "header header"
    "sidebar content";
}

.quantity{
    text-align: center;
    width:100%;
}

.grid-container{
    display:grid;
    grid-template-columns:auto;
    column-gap: 1vw;
    row-gap: 1vw;
    grid-template-areas:
    "header"
    "sidebar"
    "content";
}

.checkbox-input{
    width:15%;
    height:100%;
}

.grid-item-text{
    font-size:4vw;
    color:black;
    background-color:#F1F1F1 ;
    border-radius: 2rem;
    justify-content: center;
    display:flex;
    align-items:center;
}

.grid-item-checkbox{
    font-size:6vw;
    margin-top:5%;
    color:black;
    border-radius: 2rem;
    justify-content: left;
    display:flex;
    align-items:center;  
}

.grid-item-1{
    grid-area:header;
    margin-bottom:5%;
    margin-top:5%;
}

.grid-item-2 .grid-item-4 .grid-item-6{
    grid-area:sidebar;
}

.grid-item-10{
    grid-column: 1/-1;
    grid-row:2/6;
}



.grid-item{
    font-size:4vw;
    color:black;
    justify-content: center;
    display:flex;
    align-items:center;
    font-weight: bold;
}

input{
 width:100%;
 padding-left:5%;
 height:50px;
 font-size:4vw;
 border-radius: 2rem;
 background-color:#F1F1F1 ;
 border:none;
}

button[disabled]{
    width: 100%;

  }

  .btn-purchase,button[enabled]{
    width: 100%;
   
}


.big{
    font-weight:bold;
    font-size:5vw;
}
}


