#logo a{background-position: 20px 0; }
#nav-primary {width: 100%}
.main {margin-top: 20px}
.flex {display: flex;}
.flex-1 {flex: 1;}
.flex-2 {flex: 2;}
.pt-1 {padding-top: 2px}
.pr-2 {padding-right: 15px}
.mb-1 {margin-bottom: 8px}
.mr-1 {margin-right: 10px}
.mr-2 {margin-right: 20px}
.w-100 {width: 100%}
@media handheld, only screen and (min-width: 0px) and (max-width: 579px) {
    .col-4, .col-6, .col-8, .col-12 { width: 100% }
    
	.container, #main {width:100%;}
    #logo span{background-position: -70px 0; margin-left: 0px !important;}
    #header #menutoggle {display: block}
   	#content {width: auto; float: none; padding: 0 20px 20px}
	#sidebar {width: auto; float: none; padding: 20px;}
    #nav-primary .menu {display: none}
    #nav-primary .menu ul li {display: block; float: none; border: none; padding: 0; margin: 0; border-top: #ccc dotted 1px; border-left: none; border-right: none; }
    #nav-primary .menu ul li a {color: black; display: block; margin: 0; padding: 10px 0;}
    #nav-primary .menu ul li ul {display: block; position: static; box-shadow: none; padding:0; text-indent: 23px;}
    #footer {padding: 37px 35px 45px 56px}
    #footer-menu > li {width: 177px;}    
}

@media handheld, only screen and (min-width: 580px) and (max-width: 811px) {
    .col-4, .col-6, .col-8, .col-12 { width: 100% }
	.container, #main {width:100%;}
   #content {width:60%; float: left; padding: 0 3% 3%}
	#sidebar {width: 27%; float: right; padding: 3%; border-left: #ccc dotted 2px}
	.menu li { padding: 5px 8px !important;}
    #footer {padding: 37px 35px 45px 56px}
    #footer-menu > li {width: 177px;}
}

@media handheld, only screen and (min-width: 812px) and (max-width: 1023px) {
    .col-4 {width: 25%; float: left }
    .col-6 {width: 50%; float: left }
    .col-8 {width: 75%; float: left }
    .col-12 {width: 100%; float: left }
	.container, #main {width:812px;	padding:0 auto;	}
	#content {width:500px; float: left; padding: 0 20px 20px; border-right: #F9A352 solid 1px;}
	#sidebar {width: 230px; float: right; padding: 20px;}
    #footer {padding: 37px 35px 45px 56px}
    #footer-menu > li {width: 177px;}
}

@media handheld, only screen and (min-width: 1024px) {
    .col-4 {width: 25%; float: left }
    .col-6 {width: 50%; float: left }
    .col-8 {width: 75%; float: left }
    .col-12 {width: 100%; float: left }
	.container, #main {width:980px;	padding:0 auto;	}
	#content {width: 613px; float: left; padding: 0 20px 20px 0px; margin-left: 56px; border-right: #F9A352 solid 1px;}
	#sidebar {width: 220px; float: right; padding: 20px 35px 20px 20px;}
    #footer {padding: 37px 35px 45px 56px}
    #footer-menu > li {width: 177px;}
    .over {margin-right: -50px}
}