@media only screen and (min-width:768px) and (max-width:1024px)
{
#main {width:100%;}
.bannerImg{width:100%;}
.menu_item{padding-left:2%;width:98%;}
.bannerImg a{padding: 20px 21px;}
.bannerImg > img {height: auto;width: 100%;}
.lesson{width:auto!important;}
#footer {padding: 15px;}
#footer .btmMenu {display: block;float: left;margin: 0 auto;text-align: center;width: 100%;}
#TextBox5, #TextBox6, #TextBox7, #TextBox8, #TextBox9, #TextBox10 {width: 31% !important;}
.canny{margin-right:0px;}
#footer .btmMenu a,#footer .btmMenu a:hover {display: inline-block;float: none;padding: 5px 20px;width: auto;}
#page4 #content .col-1, #page5 #content .col-1 {margin-right: 0;width: 70%;}
#content .indent {padding: 18px;}
#page4 #content .col-3 {margin-left: 12px;}
#page5 #content .col-2 {width: 26%;}
#page5 #content .col-4 {width: 70%;}
}
@media only screen and (min-width:641px) and (max-width:767px)
{
#main {width:100%;}
.bannerImg{width:100%;}
.menu_item{padding-left:2%;width:98%;}
.bannerImg a {padding: 18px 10px;}
.bannerImg > img {height: auto;width: 100%;}
.lesson{width:auto!important;}
#footer {padding: 15px;}
#footer .btmMenu {display: block;float: left;margin: 0 auto;text-align: center;width: 100%;}
#TextBox5, #TextBox6, #TextBox7, #TextBox8, #TextBox9, #TextBox10 {width: 31% !important;}
.canny{margin-right:0px;}
#footer .btmMenu a,#footer .btmMenu a:hover {display: inline-block;float: none;padding: 5px 15px;width: auto;}
#page4 #content .col-1, #page5 #content .col-1, #page1 #content .col-1 {margin-right: 0;width: auto;}
#page1 #content .col-4{width:100%;}
#content .indent {padding: 18px;}
#page4 #content .col-3 {margin-left: 12px;}
#page5 #content .col-2 {width: 26%;}
#page5 #content .col-4 {width: 70%;}
#page1 #content .col-2 {float: left;width: auto;}
#page1 #content .col-3 {width: auto;}
#page2 #content .col-1 {width: 100%;}
#page2 #content .col-4 {width: 100%;}
#page2 #content .col-2 {width: 100%;}
#page2 .col-2 .boxdown .inner br {display: none;}
#page2 .col-2 .boxdown .inner p {float: left;margin-right: 3%;width: 47%;}
#page2 #content .col-3 {width: 100%;}
#page2 .col-2 .boxdown .inner p img{width:100%;}
#page3 #content .col-1 {width: 100%;}
#page3 #content .col-4 {width: 100%;}
#page3 #content .col-2 {width: 100%;}
#page3 #content .col-4 img {width: 100%;}
#page3 #content .col-2 img {width: 100%;}
#page3 #content .col-3 {width: 100%;}
#page4 #content .col-3 {width: 100%;}
#page5 #content .col-3 {width: 100%;}
#page6 #content .col-1 {width: 100%;margin:0;}
iframe {width: 100%;}
#page6 #content .col-2 {width: 100%;margin:0;}
#page6 #content .col-3 {width: 100%;margin:0;}
#contacts {width: 100%;}
#contacts input {height: 30px;width: 98%;}
#contacts textarea {height: 200px;width: 98%;}
#contacts label {height:auto;}
#page5 .col-1 .col-2 .boxdownimg .inner img {height: auto;width: 75%;}
}
@media only screen and (min-width:481px) and (max-width:640px)
{
#main {width:100%;}
.bannerImg{width:100%;}
.menu_item{padding-left:2%;width:98%;}
.bannerImg a {border-radius: 10px;display: block;float: left;box-shadow: 1px 5px 5px blanchedalmond;margin: 4px 0;
              padding: 10px 10px;text-decoration: none;width: 92%; 
              background: linear-gradient(to bottom, black 5%, #e09a00 100%) repeat scroll 0 0 #e09a00;}
.bannerImg > img {height: auto;width: 100%;}
.lesson{width:auto!important;}
#footer {padding: 15px;}
#footer .btmMenu {display: block;float: left;margin: 0 auto;text-align: center;width: 100%;}
#TextBox5, #TextBox6, #TextBox7, #TextBox8, #TextBox9, #TextBox10 {width: 31% !important;}
.canny{margin-right:0px;}
#footer .btmMenu a,#footer .btmMenu a:hover {display: inline-block;float: none;padding: 5px 15px;width: auto;margin-bottom: 4px;}
#page4 #content .col-1, #page5 #content .col-1, #page1 #content .col-1 {margin-right: 0;width: auto;}
#page1 #content .col-4{width:100%;}
#content .indent {padding: 18px;}
#page4 #content .col-3 {margin-left: 12px;}
#page5 #content .col-2 {width: 160px;}
#page5 #content .col-4 {width: 60%;}
#page1 #content .col-2 {float: left;width: auto;}
#page1 #content .col-3 {width: auto;}
#page2 #content .col-1 {width: 100%;}
#page2 #content .col-4 {width: 100%;}
#page2 #content .col-2 {width: 100%;}
#page2 .col-2 .boxdown .inner br {display: none;}
#page2 .col-2 .boxdown .inner p {float: left;margin-right: 3%;width: 47%;}
#page2 #content .col-3 {width: 100%;}
#page2 .col-2 .boxdown .inner p img{width:100%;}
#page3 #content .col-1 {width: 100%;}
#page3 #content .col-4 {width: 100%;}
#page3 #content .col-2 {width: 100%;}
#page3 #content .col-4 img {width: 100%;}
#page3 #content .col-2 img {width: 100%;}
#page3 #content .col-3 {width: 100%;}
#page4 #content .col-3 {width: 100%;}
#page5 #content .col-3 {width: 100%;}
#page6 #content .col-1 {width: 100%;margin:0;}
iframe {width: 100%;}
#page6 #content .col-2 {width: 100%;margin:0;}
#page6 #content .col-3 {width: 100%;margin:0;}
#contacts {width: 100%;}
#contacts input {height: 30px;width: 98%;}
#contacts textarea {height: 200px;width: 98%;}
#contacts label {height:auto;}
#page5 .col-1 .col-2 .boxdownimg .inner img {height: auto;width: 100%;}
.bannerImg span{display:none;}
#header .menuHL {background-color: #777575;box-shadow: 1px 5px 2px #0D9ED3;color: background;}
.bannerImg a.h-ph {
  padding: 10px;
}
#footer .btmMenu a
{
 margin: 0 10px;
}
}
@media only screen and (min-width:320px) and (max-width:480px)
{
#main {width:100%;}
.bannerImg{width:100%;}
.menu_item{padding-left:2%;width:98%;}
.bannerImg a {border-radius: 10px;display: block;float: left;box-shadow: 1px 5px 5px blanchedalmond;margin: 4px 0;
              padding: 10px 10px;text-decoration: none;width: 92%; 
              background: linear-gradient(to bottom, black 5%, #e09a00 100%) repeat scroll 0 0 #e09a00;}
.bannerImg > img {height: auto;width: 100%;}
#footer {padding: 15px;}
#footer .btmMenu {display: block;float: left;margin: 0 auto;text-align: center;width: 100%;}
#TextBox5, #TextBox6, #TextBox7, #TextBox8, #TextBox9, #TextBox10 {width: 30% !important;}
.canny{margin-right:0px;}
#footer .btmMenu a,#footer .btmMenu a:hover {display: inline-block;float: none;padding: 5px;width: auto;}
#page4 #content .col-1, #page5 #content .col-1, #page1 #content .col-1 {margin-right: 0;width: 100%;}
#page1 #content .col-4{width:100%;}
#content .indent {padding: 18px;}
#page4 #content .col-3 {margin-left: 12px;}
#page5 #content .col-2 {float: none;margin: 0 auto;width: 70%;clear: both;}
#page5 #content .col-4 {width: 100%;}
#page1 #content .col-2 {float: left;width: auto;}
#page1 #content .col-3 {width: auto;}
#page2 #content .col-1 {width: 100%;}
#page2 #content .col-4 {width: 100%;}
#page2 #content .col-2 {width: 100%;}
#page2 .col-2 .boxdown .inner br {display: none;}
#page2 .col-2 .boxdown .inner p {float: left;margin-right: 3%;width: 98%;}
#page2 #content .col-3 {width: 100%;}
#page2 .col-2 .boxdown .inner p img{width:100%;}
#page3 #content .col-1 {width: 100%;}
#page3 #content .col-4 {width: 100%;}
#page3 #content .col-2 {width: 100%;}
#page3 #content .col-4 img {width: 100%;}
#page3 #content .col-2 img {width: 100%;}
#page3 #content .col-3 {width: 100%;}
#page4 #content .col-3 {width: 100%;}
#page5 #content .col-3 {width: 100%;}
#page6 #content .col-1 {width: 100%;margin:0;}
iframe {width: 100%;}
#page6 #content .col-2 {width: 100%;margin:0;}
#page6 #content .col-3 {width: 100%;margin:0;}
#contacts {width: 100%;}
#contacts input {height: 30px;width: 98%;}
#contacts textarea {height: 200px;width: 98%;}
#contacts label {height:auto;}
#page5 .col-1 .col-2 .boxdownimg .inner img {height: auto;width: 100%;}
.bannerImg span{display:none;}
#header .menuHL {background-color: #777575;box-shadow: 1px 5px 2px #0D9ED3;color: background;}
h2 {background-size: 100% 100%;height: auto;}
.boxdown .inner .inner {padding: 0;width: 100%;}
.inner img {height: auto;width: 88%;}
.lesson{width: 100%!important;}
#UpdatePanel1{width: 100%!important;}
#UpdatePanel1 input{width: 100%;}
textarea {width: 100%;}
#UpdatePanel1 table {width: 100%;}
table tbody tr td:nth-child(1) {width: 30%;}
table tbody tr td:nth-child(2) {width: 5px !important;}
#RadioButton1, #RadioButton2 {width: 5px !important;}
#page4 #UpdatePanel1 input{width: 100%;}
#Button1, #Button2 {width: 66px !important;}
#page4 .box .inner .inner {padding: 0;}
.inner img.h-img1 {
    height: 130px !important;
    width: 280px !important;
  }
.inner img.h-img2 {
    height: 111px !important;
    width: 132px !important;
  }
.inner img.abt-img {
    height: 195px !important;
    width: 260px !important;
  }
iframe {
  height: 320px;
  width: 100%;
}
.bannerImg a.h-ph {
  padding: 10px;
}
#footer .btmMenu a
{
 margin: 0 10px;
 font-size: 12px;
}





}