Tatami – Keep Right Sidebar Visible below 1280px Screen Width

Sorry if this is perhaps a customisation question, I am trying to adjust the Tatami theme.

By default you are hiding the right sidebar below 1260px screen width and keep the left sidebar visible.

I would like to reverse this, keep right sidebar visible and left one collapsed.

I looked at the CSS, the rules controlling this seem to start from “@media screen and (min-width: 1024px)” but it`s quite complicated.

I noticed you have page templates to easily hide the right sidebar. I was wondering if there is an easy way to collapse the left one and keep the right one visible?

Many thanks!

p.s. I pasted the rules below:

/* Minimum width of 1024 pixels (tablet landscape)
 ------------------------------------------------------------------------------------ */
 @media screen and (min-width: 1024px) {
/* Basic Structure */
 [role="banner"] {
 width:88.28125%;
 left:5.859375%;
 }
 .container [role="navigation"],
 .js .container [role="navigation"] {
 position:relative;
 height:auto;
 left:0;
 margin-left:1.953125%; /* 20px */
 margin-top:80px;
 margin-bottom:20px;
 width:25.390625%; /* 260px */
 }
 .no-js .container [role="navigation"] {
 float:left;
 display:inline;
 }
 [role="main"],
 .js [role="main"] {
 width:72.65625%; /* 744px, incl. the 20px right and left margins */
 margin-top:60px;
 }
 .no-js .sidebar-right {
 width:68.75%; /* 704px */
 margin:0 20px 20px 20px;
 float:right;
 }
/* Active Left Sidebar */
 .active-nav .container [role="navigation"] {
 width:25.390625%; /* 260px */
 }
 .active-nav [role="main"] {
 position:relative;
 overflow:hidden;
 left: 0;
 margin-top: 0;
 margin-left: 0;
 padding-bottom:60px;
 }
 .js .active-nav .off-canvas-nav {
 position: absolute;
 top: 0;
 right: 0;
 left: 0;
 }
 .active-nav .mask-left {
 display:none;
 }
 .js .active-nav [role="banner"] {
 left:5.859375%;
 width:88.28125%;
 position: absolute;
 top: 0;
 }
/* Active Right Sidebar */
 .active-sidebar .container [role="navigation"] {
 left:-37.109375%; /* 380px */
 position:fixed;
 }
 .active-sidebar [role="main"] {
 margin-top:0;
 right:37.109375%; /* 380px */
 }
 .active-sidebar .sidebar-right {
 margin-left: 62.890625%;
 width: 37.109375%; /* 380px */
 }
 .js .active-sidebar .off-canvas-nav {
 left:-37.109375%; /* 380px */
 -webkit-transition: .2s left ease-out;
 -moz-transition: .2s left ease-out;
 -o-transition: .2s left ease-out;
 -ms-transition: .2s left ease-out;
 transition: .2s left ease-out;
 }
 .active-sidebar .mask-right {
 right:37.109375%; /* 380px */
 }
 .js .active-sidebar [role="banner"] {
 left:-31.25%; /* 320px */
 width: 88.28125%;
 }