@media only screen and (max-width: 932px){
    .navbarHead {
      display: none ;
    }
 }
 @media only screen and (max-width: 747px){
  #col-ad1{display: none;}
  #col-ad2{display: none;}
  #topHolder{overflow-y: scroll;
  height: 200%;
  
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  }
#leftContainer{
  left:0;
  top: 0 !important;
width:100% !important;
position:absolute;
display: block;
height: 50% !important;
}
#rightContainer{
  left:0;
background-color:black !important;
width:100% !important;
top: 50% !important;
bottom:0px !important;
display: block;
position:absolute;
height: 50% !important;
}
#left1{display:none !important}
#left2,#left3{height:40% !important;}#left4{height:20%!important;}

}

 @media only screen and (min-width: 933px){
   .respInput::placeholder {
     visibility: hidden;
   }
}
.shadowed:focus-within{
  box-shadow: 12px 12px 0px -8px black !important;
}
@media only screen and (max-height: 750px) and (max-width: 400px){
  #topHolder{
    height: 100% !important;
    }
    #bottomHolder{
         height:0% !important;
        }
}
body{
background-color: #333533;
}

#keyboardDiv {
  min-width: 270px;
}

 #topHolder{
display: none;
 overflow-y:scroll;
 position:fixed;
width:100%;
height: 63%;
/* background-color: #9DB089; ########################################################################*/
/* background-color:rgba(0,0,0,1); */
}

#topHolder, #bottomHolder,#col-ad1 ,
#col-ad2{
  background-color:#BDBDD7 !important;
}
 #bottomHolder{
display: none;
/* background-color: #9DB089; ########################################################################*/
/* background-color:rgb(0,0,0); */
   position:fixed;
   bottom:0px;
   width:100%;
   height:37%;
  }
  #col-ad1 ,
  #col-ad2{
  text-align: right;
/* background-color: #9DB089; ######################################################################*/
background-color:rgb(0,0,0);
color: #333533;
  }

.alert{

background-color: rgb(77,77,77);
/* background-color: #3A4F41;  ÜSTTEKİ ZAMAZİNGOLARs*/
color: black;
}
h1, h2, h3, h4, h5, h6 {
  text-align: center;
}
.navbarHead{
width: 150px !important;
}
/*Modallar INFO GITTI*/

#leftContainer{left:0;}
#rightContainer{right:0;background-color:black !important;}
#leftContainer, #rightContainer{
  display: block;
  position: absolute;
  margin-left: 0;
  margin-right: 0;
  top: 0;
  width:50%;
  height:100%;
  margin-top: 9px;
}
.leftRow{
  display: flex;
  bottom: 0;
  height:25%;
  width:100%;
  padding:1px;
  background-color: inherit;
  /* justify-content: center;
  justify-items: center; */
  align-items: center;
  align-content: center;
  text-align: center;
  padding-left: 50px;
}
#left1{height: 15% !important;}
.leftRow >div{
  position: sticky;
  height: 100%;
  display:block;
  /* position:relative ; */
  /* height: 100%; */
  align-items: center;
  justify-content: center;
  text-align: center;
  justify-items: center;
  width: min-content;
  top:0!important;
}
.sigmaHolder{
  display: block;
  flex-wrap: wrap;
  flex-direction: column;
  /* justify-content: center; */
  /* align-items: center; */
  height:100%;
  width:20%;
  /* align-items: right; */
}.sigmaHolder>div{
  display:block !important; 
  right: 0;
  justify-content: center;
}
.textCenter{
  display: flex;
  align-items: center;  
  width: 100%;
  height:100%;
}
#sigma{font-size: 228%;margin-left: 20px;}
.limit{width: 50px !important;}
.limit>input{border:none;width: 100%;}
#limits{font-size: 228%;margin-right: 12px;margin-left: 2px;


}#line{
  content: '';
  width: 0.01px;
  border: 1px solid black;
background-color: black;
}

#upperLimit,#lowerLimit{margin-right: 20px;}
#antiderivativeDiv{min-width:100px;}

span{color: black;}

.output{
  background-color: white;
  min-width: 100px;
  /* margin-right: 10px; */
}

/*No arrow input number*/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none; margin: 0;} input[type=number] {-moz-appearance: textfield;}


.label{
    color: rgb(0,0,55);
  }
/* #left2>div>div>.label{
  shape-outside: polygon(3,1,2);
} */
#left2,#left3,#left4{
  margin-left:10px;  }
#left3,#left4{
background-color:rgb(240,240,240);
}
#left2{
  background-image: linear-gradient(rgb(77,77,77),#BDBDD7, rgb(77,77,77));}
  #calculationInput{
    background-color: white;
    min-width: 40px;
  }
  #plot{
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: white !important;
    /* width: 77%; height: 99%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) !important;
    -ms-transform: translate(-50%, -50%) !important; 
    -webkit-transform: translate(-50%, -50%) !important; 
     background-color:white !important; */
  }