@media only screen and (max-width:1922px) {.mygrid{grid-template-columns: auto auto auto auto auto auto auto ; }}
@media only screen and (max-width:1690px) {.mygrid{grid-template-columns: auto auto auto auto auto auto ; }}
@media only screen and (max-width:1470px) {.mygrid{grid-template-columns: auto auto auto auto auto;} .gridcontainer {margin:auto;width: 80%;}}
@media only screen and (max-width:1250px) {.mygrid{grid-template-columns: auto auto auto auto; }
}
@media only screen and (max-width:1007px) {.mygrid{grid-template-columns: auto auto auto;}
    .toggle-button {display: flex;}
    .navbar-links {display: none;width: 100%;}
    .navbar {flex-direction: column;align-items: flex-start;}
    .navbar-links ul {width: 100%;flex-direction: column;}
    .navbar-links li {text-align: center;}
    .navbar-links li a {padding: .5rem 1rem;}
    .navbar-links.active {display: flex;}
	.topright h1{display:none;}
	.form-popup {display: none; position: fixed; border: 3px solid #f1f1f1; z-index: 2; background-color: Gainsboro; position: fixed; top: 28%; left: 5%; transform: translate(-5%, -5%); width: 100%;}
	.modal-content {width: 90%; margin:auto;}
	.gridcontainer {margin:auto;width: 90%;grid-template-columns: auto auto auto ;}
	.gridcontainer button{font-size: 15px;}
	.gridcontainer button:hover {font-size: 15px;}
}

@media only screen and (max-width: 790px) {#menuToggle{display:block;} #menufull{display: none;}
	.gridcontainer {margin:auto;width: 96%;}
	.gridcontainer button{font-size: 15px;}
	.gridcontainer button:hover {font-size: 15px;}
	.form-container { max-width: 98%;}

}
@media only screen and (max-width:774px) {
	#menuToggle{display:block;}
    #menufull{display: none;}
	.topright h1{display:block;}
    .mygrid{
        grid-template-columns: auto auto;
        justify-items: center;
    }
}

@media only screen and (max-width:550px) {
	#menuToggle{display:block;}
    #menufull{display: none;}
	.name{display:none;}
	.gridcontainer {margin:auto;width: 96%;grid-template-columns: auto auto ;}
	.button-controls-parent{ display: block; }
    .mygrid{ grid-template-columns: auto; width: 96%;  justify-items: left;}
	.field-holder{
	  width: 90%;
	  height: 30px;
	  margin: 15px;

	}
	
	.field-holder-select {width:100%;}
	.field-holder-select select{width:85%;} 
#btn{
    width: 100%;
    height: 34px;
    border: none;
    outline: none;
    background-color: var(--bacbue);
    color: var(--bacwhite);
    padding: 6px;
}
#btn:hover {
  width: 100%;
  height: 34px;
  border: none;
  outline: none;
  background-color: var(--bacred);
  color: var(--bacwhite);
  padding: 6px;
}	
	
/* .button-controls-childright{}
.button-controls-childright input[type=text]{ border-radius: 3px; padding: 5px; height: max-content; margin:0;}
.button-controls-childright input[type=text]::placeholder{font-style:italic;} */

	
}


    

/* @media only screen and (max-width: 1000px) {
    .gridcontainer {
      display: grid;
      width:100%;
      margin: auto;
      grid-template-columns: auto auto auto ;
      padding: 1px;
    }
    }
    @media only screen and (max-width: 550px) {
    .gridcontainer {
      display: grid;
      width:100%;
      margin: auto;
      grid-template-columns: auto ;
      padding: 1px;
    }
    } */