@media only screen and (min-width: 790px) and (max-width: 1024px) {
    .main {
        float: left;
        width: 100%
        }
    /* Top CSS */
    .top {
        float: left;
        width: 100%
        }
    .top_center {
        width: 96%;
        padding: 0 2%
        }
    .top_center_bg {
        float: left;
        width: 100%
        }
    .top_logo {
        float: left;
        width: 60%;
        padding: 2% 0%
        }
    .top-icon {
        float: right
        }
    .top_menu {
        float: left;
        width: 96%;
        padding: 0 2%;
        margin: 10px 0 20px;
        background: url(../images/responsive-menu-icon.png) no-repeat scroll 10px 10px #e5f3ff;
        border-radius: 10px;
        height: 50px;
        cursor: pointer;
        display: none
        }
    .mobile-menu {
        display: block;
        float: left;
        width: 100%
        }
    #menu-header-menu {
        width: 100%;
        float: left;
        padding: 6px;
        margin-bottom: 10px;
        border: solid 1px #666
        }
    ul#navmenu {
        display: none
        }
    .top_menu:hover ul#navmenu {
        display: block;
        float: left;
        width: 100%;
        background: #dcdcdc;
        margin-bottom: 1px;
        border-radius: 10px
        }
    /*.top_menu:before { color: #000;content: "Menus";font-size: 24px;line-height: 50px; margin: 0 0 0 50px; float:left; } */
    ul#navmenu li:first-child {
        margin-top: 1px
        }
    ul#navmenu li {
        width: 100%;
        background: #e5f3ff;
        margin-bottom: 1px;
        border-radius: 10px
        }
    ul#navmenu ul {
        position: relative;
        width: 48%;
        background: none;
        margin-left: 2px
        }
    ul#navmenu ul li {
        padding: 0;
        width: 99%;
        background: #f5f3f4;
        border-radius: 10px
        }
    ul#navmenu ul li ul {
        left: 100%;
        width: 100%
        }
    ul#navmenu ul li ul li {
        background: #fbfbfb
        }
    ul#navmenu li.current-menu-item a {
        border-radius: 10px
        }
    /* Top End CSS*/
    /* Middle CSS */
    .middle {
        float: left;
        width: 100%
        }
    .middle_home_gallery {
        width: 98%;
        padding: 0 1%
        }
    .middle_bottom {
        float: left;
        width: 100%
        }
    .middle_bottom_center {
        width: 98%
        }
    .img-box-main {
        float: left;
        width: 100%
        }
    .img-box-1 {
        float: left;
        width: 30%
        }
    .img-box-2 {
        float: left;
        width: 50%
        }
    .img-box-3 {
        float: left;
        width: 20%
        }
    .img-box-4 {
        float: left;
        width: 18%
        }
    .img-box-5 {
        float: left;
        width: 20%
        }
    .img-box-6 {
        float: left;
        width: 32%
        }
    .img-box-main a img {
        width: 100%
        }
    .inner_gallery {
        width: 96%;
        padding: 14px 2%
        }
    .inner_gallery img {
        width: 97%
        }
    .inner_middle_center {
        padding: 0 1%;
        width: 98%
        }
    .event-calender td {
        margin: 0 1.8%
        }
    .video-right > iframe {
        height: 200px;
        width: 100%
        }
    .map-right {
        float: left;
        width: 100%
        }
    .map-right > iframe {
        height: 200px;
        width: 100%
        }
    .canoe-fentals-img-left img {
        width: 100%
        }
    .video-left {
        float: left;
        width: 100%
        }
    .video-left embed {
        height: 350px;
        width: 100%
        }
    }
@media only screen and (min-width: 580px) and (max-width: 790px) {
    .main {
        float: left;
        width: 100%
        }
    /* Top CSS */
    .top {
        float: left;
        width: 100%
        }
    .top_center {
        width: 96%;
        padding: 0 2%
        }
    .top_center_bg {
        float: left;
        width: 100%
        }
    .top_logo {
        float: left;
        width: 96%;
        padding: 2%;
        text-align: center
        }
    .top-icon {
        margin: 5% 5% 6% 5%;
        width: 90%;
        text-align: center;
        float: left
        }
    .icon {
        display: inline-block;
        float: none;
        text-align: center;
        width: auto
        }
    .top_menu {
        float: left;
        width: 96%;
        padding: 0 2%;
        margin: 10px 0 20px;
        background: url(../images/responsive-menu-icon.png) no-repeat scroll 10px 10px #e5f3ff;
        border-radius: 10px;
        height: 50px;
        cursor: pointer
        }
    ul#navmenu {
        display: none
        }
    .top_menu:hover ul#navmenu {
        display: block;
        float: left;
        width: 100%;
        background: #dcdcdc;
        margin-bottom: 1px;
        border-radius: 10px
        }
    /*.top_menu:before { color: #000;content: "Menus";font-size: 24px;line-height: 50px; margin: 0 0 0 50px; float:left; } */
    ul#navmenu li:first-child {
        margin-top: 1px
        }
    ul#navmenu li {
        width: 100%;
        background: #e5f3ff;
        margin-bottom: 1px;
        border-radius: 10px
        }
    ul#navmenu ul {
        position: relative;
        width: 48%;
        background: none;
        margin-left: 2px
        }
    ul#navmenu ul li {
        padding: 0;
        width: 99%;
        background: #f5f3f4;
        border-radius: 10px
        }
    ul#navmenu ul li ul {
        left: 100%;
        width: 100%
        }
    ul#navmenu ul li ul li {
        background: #fbfbfb
        }
    ul#navmenu li.current-menu-item a {
        border-radius: 10px
        }
    /* Top End CSS*/
    .top_menu {
        display: none
        }
    .mobile-menu {
        display: block;
        float: left;
        width: 100%
        }
    #menu-header-menu {
        width: 100%;
        float: left;
        padding: 6px;
        margin-bottom: 10px;
        border: solid 1px #666
        }
    /* Middle CSS */
    .middle {
        float: left;
        width: 100%
        }
    .middle_home_gallery {
        width: 98%;
        padding: 0 1%
        }
    .middle_bottom {
        float: left;
        width: 100%
        }
    .middle_bottom_center {
        width: 98%
        }
    .img-box-main {
        float: left;
        width: 100%
        }
    .img-box-1 {
        float: left;
        width: 30%
        }
    .img-box-2 {
        float: left;
        width: 50%
        }
    .img-box-3 {
        float: left;
        width: 20%
        }
    .img-box-4 {
        float: left;
        width: 18%
        }
    .img-box-5 {
        float: left;
        width: 20%
        }
    .img-box-6 {
        float: left;
        width: 32%
        }
    .img-box-main a img {
        width: 100%
        }
    .inner_gallery {
        width: 96%;
        padding: 0 2%
        }
    .inner_gallery img {
        width: 97%
        }
    .inner_middle_center {
        padding: 0 1%;
        width: 98%
        }
    .event-calender td {
        margin: 0 1.8%;
        width: 43%
        }
    .video-right > iframe {
        height: 300px;
        width: 100%
        }
    .map-right {
        float: left;
        width: 100%
        }
    .map-right > iframe {
        height: 300px;
        width: 100%
        }
    .canoe-fentals-img-left img {
        width: 100%
        }
    .video-left {
        float: left;
        width: 100%
        }
    .video-left embed {
        height: 300px;
        width: 100%
        }
    .grid1-col2 {
        padding: 2% 2%;
        width: 96%
        }
    .grid2-col3 {
        padding: 2% 2%;
        width: 96%
        }
    .grid1-col4 {
        padding: 2% 2%;
        width: 96%
        }
    .grid1-col3 {
        padding: 2% 2%;
        width: 96%
        }
    .dining-table td {
        width: 50%
        }
    .logo-links .grid1-col3 {
        width: 31%;
        padding: 20px 1%
        }
    .logo-links .grid1-col3 img {
        width: 100%
        }
    .img-box-main a img {
        height: 250px
        }
    .text-align-center {
        width: 100%
        }
    /* Middle End CSS */
    /*Footer CSS */
    /*Footer End CSS */
    }
@media only screen and (min-width: 320px) and (max-width: 580px) {
    .main {
        float: left;
        width: 100%
        }
    /* Top CSS */
    .top {
        float: left;
        width: 100%
        }
    .top_center {
        width: 96%;
        padding: 0 2%
        }
    .top_center_bg {
        float: left;
        width: 100%
        }
    .top_logo {
        float: left;
        width: 96%;
        padding: 2%;
        text-align: center
        }
    .top-icon {
        margin: 5% 5% 6% 5%;
        width: 90%;
        text-align: center;
        float: left
        }
    .icon {
        display: inline-block;
        float: none;
        text-align: center;
        width: auto
        }
    .top_menu {
        float: left;
        width: 96%;
        padding: 0 2%;
        margin: 10px 0 20px;
        background: url(../images/responsive-menu-icon.png) no-repeat scroll 10px 10px #e5f3ff;
        border-radius: 10px;
        height: 50px;
        cursor: pointer
        }
    ul#navmenu {
        display: none
        }
    .top_menu:hover ul#navmenu {
        display: block;
        float: left;
        width: 100%;
        background: #dcdcdc;
        margin-bottom: 1px;
        border-radius: 10px
        }
    /*.top_menu:before { color: #000;content: "Menus";font-size: 24px;line-height: 50px; margin: 0 0 0 50px; float:left; } */
    ul#navmenu li:first-child {
        margin-top: 1px
        }
    ul#navmenu li {
        width: 100%;
        background: #e5f3ff;
        margin-bottom: 1px;
        border-radius: 10px
        }
    ul#navmenu ul {
        position: relative;
        width: 48%;
        background: none;
        margin-left: 2px
        }
    ul#navmenu ul li {
        padding: 0;
        width: 99%;
        background: #f5f3f4;
        border-radius: 10px
        }
    ul#navmenu ul li ul {
        left: 100%;
        width: 100%
        }
    ul#navmenu ul li ul li {
        background: #fbfbfb
        }
    ul#navmenu li.current-menu-item a {
        border-radius: 10px
        }
    /* Top End CSS*/
    .top_menu {
        display: none
        }
    .mobile-menu {
        display: block;
        float: left;
        width: 100%
        }
    #menu-header-menu {
        width: 100%;
        float: left;
        padding: 6px;
        margin-bottom: 10px;
        border: solid 1px #666
        }
    /* Middle CSS */
    .middle {
        float: left;
        width: 100%
        }
    .middle_home_gallery {
        width: 98%;
        padding: 0 1%
        }
    .middle_bottom {
        float: left;
        width: 100%
        }
    .middle_bottom_center {
        width: 98%
        }
    .img-box-main {
        float: left;
        width: 100%
        }
    .img-box-1 {
        float: left;
        width: 30%
        }
    .img-box-2 {
        float: left;
        width: 50%
        }
    .img-box-3 {
        float: left;
        width: 20%
        }
    .img-box-4 {
        float: left;
        width: 18%
        }
    .img-box-5 {
        float: left;
        width: 20%
        }
    .img-box-6 {
        float: left;
        width: 32%
        }
    .img-box-main a img {
        width: 100%
        }
    .inner_gallery {
        width: 96%;
        padding: 14px 2%
        }
    .inner_gallery img {
        width: 94%
        }
    .inner_middle_center {
        padding: 0 2%;
        width: 96%
        }
    .event-calender td {
        margin: 0 1.8%;
        width: 46%;
        padding: 0
        }
    .video-right > iframe {
        height: 250px;
        width: 100%
        }
    .map-right {
        float: left;
        width: 100%
        }
    .canoe-fentals-img-left img {
        width: 100%
        }
    .video-left {
        float: left;
        width: 100%
        }
    .grid1-col2 {
        padding: 2% 2%;
        width: 96%
        }
    .grid2-col3 {
        padding: 2% 2%;
        width: 96%
        }
    .grid1-col4 {
        padding: 2% 2%;
        width: 96%
        }
    .grid1-col3 {
        padding: 2% 2%;
        width: 96%
        }
    .dining-table td {
        width: 50%
        }
    .logo-links .grid1-col3 {
        width: 31%;
        padding: 20px 1%
        }
    .logo-links .grid1-col3 img {
        width: 100%
        }
    .img-box-main a img {
        height: 250px
        }
    .video-left embed {
        height: 250px;
        width: 100%
        }
    .map-right > iframe {
        height: 250px;
        width: 100%
        }
    /* Middle End CSS */
    /*Footer CSS */
    /*Footer End CSS */
    }
@media only screen and (min-width: 320px) and (max-width: 520px) {
    .top_logo img {
        width: 100%
        }
    .top_menu {
        display: none
        }
    .mobile-menu {
        display: block;
        float: left;
        width: 100%
        }
    #menu-header-menu {
        width: 100%;
        float: left;
        padding: 6px;
        margin-bottom: 10px;
        border: solid 1px #666
        }
    }
@media only screen and (min-width: 380px) and (max-width: 480px) {
    .img-box-main a img {
        height: 150px
        }
    .logo-links .grid1-col3 {
        width: 98%;
        padding: 20px 1%
        }
    .logo-links .grid1-col3 img {
        width: auto
        }
    .event-calender td {
        font-size: 13px
        }
    .top_menu {
        display: none
        }
    .mobile-menu {
        display: block;
        float: left;
        width: 100%
        }
    #menu-header-menu {
        width: 100%;
        float: left;
        padding: 6px;
        margin-bottom: 10px;
        border: solid 1px #666
        }
    }
@media only screen and (min-width: 320px) and (max-width: 380px) {
    .img-box-main a img {
        height: 120px
        }
    .logo-links .grid1-col3 {
        width: 98%;
        padding: 20px 1%
        }
    .logo-links .grid1-col3 img {
        width: auto
        }
    .event-calender td {
        font-size: 13px
        }
    .middle-left-img {
        float: left;
        width: 100%
        }
    .top_menu {
        display: none
        }
    .mobile-menu {
        display: block;
        float: left;
        width: 100%
        }
    #menu-header-menu {
        width: 100%;
        float: left;
        padding: 6px;
        margin-bottom: 10px;
        border: solid 1px #666
        }
    }