

/* If the viewport width > 4096 pixels ... */
 
@media screen and (max-width: 4096px) {

  /* Make the main content a bit wider */
 
  #content {
  width: 66%; 

  }
 
  #sidebar .inner {
    float: right;
    clear: right;
    margin-right: 0;
  }
      
  
}

/* If the viewport width > 2048 pixels ... */
 
@media screen and (max-width: 2048px) {

  /* Make the main content a bit wider */
 
  #content {
  width: 64%; 

  }
 
  #sidebar .inner {
    float: right;
    clear: right;
    margin-right: 0;
  }
      
  
}


/* If the viewport width > 1280 pixels ... */
 
@media screen and (max-width: 1280px) {

  /* Make the main content a bit wider */
 
  #content {
  width: 61%; 

  }
 
  #sidebar .inner {
    float: right;
    clear: right;
    margin-right: 0;
  }
      
  
}





/* If the viewport width > 1024 pixels ... */
 
@media screen and (max-width: 1024px) {

  /* Make the main content a bit wider */
 
  #content {
  width: 52%; 

  }
 
  #sidebar .inner {
    float: right;
    clear: both;

    margin-top: 0px;
    margin-bottom: 0px;
    margin-right: 0px;
    margin-left: 0px;
    padding: 0;
  }
      
  
}

                                                         /* If the viewport width <= 800 pixels ... */
 
@media screen and (max-width: 800px) {

  #content {
    min-width: 360px;
    width: 99%;
    max-width: 99%;
  }

  #sidebar {
    float: left;
    clear: both;
    min-width: 360px;
    width: 99%;
    max-width: 99%;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-right: 0px;
    margin-left: 0px;
    padding: 0;
  }
  
}



                                                         /* If the viewport width <= 480 pixels ... */
 
@media screen and (max-width: 480px) {

  #content {
    min-width: 360px;
    width: 99%;
    max-width: 99%;
  }

  #sidebar {
    float: left;
    clear: both;
    min-width: 360px;
    width: 99%;
    max-width: 99%;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-right: 0px;
    margin-left: 0px;
    padding: 0;
  }
  
}



                                                         /* If the viewport width <= 360 pixels ... */
 
@media screen and (max-width: 360px) {

  #content {
    min-width: 360px;
    width: 99%;
    max-width: 99%;
  }

  #sidebar {
    float: left;
    clear: both;
    min-width: 360px;
    width: 99%;
    max-width: 99%;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-right: 0px;
    margin-left: 0px;
    padding: 0;
  }
  
}
