#imgback{
  position: absolute;
  top: 280px;
  width: 500px;
  height: 500px;
  left: 100px;
  opacity: 0.045;
} 

.main{
  background: #FFF;
  max-width: 800px;
}
 
 .rrtable{
  vertical-align: middle;
  padding: 0px;
 }

  .subject{
    font-size: 10px;
    vertical-align: middle;
  }
  .marksheet{
    font-size: 10px;
  }

  h3{
    color: #FF0000;
    font-size: 12px;
    vertical-align: middle;
  }

@media screen and (max-width: 480px) {
body {
    font-family: "Lucida Sans", Verdana, sans-serif;
    font-size: 2.6vmin;
     background: #F1ECC1;
}
.row{
  width: auto;
}
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6{
 font-size: 2vmin;
font-size: 2vmax; 
}
 
 .rtable { 
  table-layout:auto;
  overflow-x: scroll;
  overflow-y: scroll;
  float: none;
}
.rrtable { 
font-size: 2.9vmin;
vertical-align: middle;
}
.rrrtable {
font-size: 2.2vmin;
vertical-align: middle;
padding: 0px;
}
h2 {
  font-size:  3vmin;
  color: brown;
  font-weight: bolder;
}
h3 {
  font-size:  3.0vmax;
  font-size:  3.7vmin;
  color: white;
  font-weight: bolder;
  color: brown;
}

footer,.footer,.glyphicon-chevron-up{
font-size:  3.1vmin;
margin-bottom: 0px;
}



.paginator,.page{
   padding: 0px;
 font-size:  2.5vmin;
}

.add-photo-student-list{
  margin-top: -75px;
 float: left;
 margin-left:-20px;
}

 
}




/* For Landscape iphone */
@media screen and (min-width: 481px)  and (max-width: 600px) {
body {
    font-family: "Lucida Sans", Verdana, sans-serif;
    font-size: 2.8vmin;
    background: #F1ECC1;
}

.row,
.container{
  width: auto;
}
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6{
 font-size: 2.7vmin;
font-size: 2.7vmax; 
}
 

 .rtable { 
  table-layout:auto;
  overflow-x: scroll;
  overflow-y: scroll;
  float: none;
}
.rrtable { 
font-size: 3.3vmin;
padding: 0.125em;
font-size: 2.8vmin;
}
h2 {
  font-size:  6vmin;
  font-size:  5vmin;
  color: brown;
  font-weight: bolder;
}
h3 {
   font-size:  2.9vmin;
  color: white;
  font-weight: bolder;
  color: brown;
}

footer,.footer,.glyphicon-chevron-up{
font-size:  2.9vmin;
margin-bottom: 0px;
}


.paginator,.page{
   padding: 0px;
 font-size:  2.5vmin;
font-size:  3.3vmin;
}

.add-photo-student-list{
  margin-top: -75px;
   margin-left: 15px;
}
  }

/* For laptops and desktops */
@media screen   and (min-width: 601px) and (max-width: 1280px) {
body {
    font-family: "Lucida Sans", Verdana, sans-serif;
    font-size: 2.6vmin;
    background: #F1ECC1;
}
.row,
.container{
  width: auto;
}
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6{
 font-size: 2.5vh;
}
 .rtable { 
  table-layout:auto;
  overflow-x: scroll;
  overflow-y: scroll;
  float: none;
}
.rrtable { 
padding: 0.125em;
font-size: 2.3vmin;
}
h2 {
  font-size:  3.5vmin;
  color: brown;
  font-weight: bolder;
}
h3 {
  font-size:  3.2vmin;
  color: white;
  font-weight: bolder;
  color: brown;
}

footer,.footer,.glyphicon-chevron-up{
font-size:  3.3vmin;
margin-bottom: 0px;
}


.paginator,.page{
   padding: 0px;
 font-size:  2.5vmin;
font-size:  3.3vmin;
}

.add-photo-student-list{
  margin-top: 25px;
   margin-left: 15px;
}
}





/* For wider screens */
@media screen    and (min-width: 1281px){
body {
    font-family: "Lucida Sans", Verdana, sans-serif;
    font-size: 2.0vmin;
    font-size: 2.3vmin;
    background: #F1ECC1;
}
.row,
.container{
  width: auto;
}
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6{
 font-size: 3.0vh;
}

 .rtable { 
  table-layout:auto;
  overflow-x: scroll;
  overflow-y: scroll;
  float: none;
}
.rrtable { 
padding: 0.125em;
font-size: 2.5vmin;
}
h2 {
  font-size:  3vmin;
   color: brown;
  font-weight: bolder;
}
h3 {
  font-size:  2.9vmin;
  color: white;
  font-weight: bolder;
  color: brown;
}

footer,.footer,.glyphicon-chevron-up{
font-size:  3.3vmin;
margin-bottom: 0px;
}


.paginator,.page{
   padding: 0px;
 font-size:  3.0vmin;

}

.add-photo-student-list{
  margin-top: 25px;
  margin-left: 15px;
}
}



@media print {

  h3{
    color: #FF0000;
    font-size: 2.1vmin;
    vertical-align: middle;
  }
 
 .marksheet{
  position: relative;
  margin:auto;
  font-size: 8px;
}
.container{
  padding: 0px;
}

.myhide{
  display: none;
}

.overdue-student{
  width: 25%;
}
.overdue-program{
  width: 7%;
}
.overdue-billed{
  width: 16%;
}
.overdue-paid{
  width: 16%;
}
.overdue-balance{
  width: 16%;
}
.overdue-discount{
  width: 16%;
}
}