Using gkColumnRight at the left side - Didn't you know?! mod

Hi,

Using the html code at "Didn't you know?!" module, how could we show the div class="gkColumnRight" at the left side of the module?, The div class="gkColumnLeft" is using just one column and we need to show two at the left side. If is not a class in this template to do it, please could you help me with an override CSS to create a new class to use two columns at the left side?

Thank you!

Moreover, using the html code at "Didn't you know?!" module, how could we switch the div class="gkColumnRight" to be showed at the left side of the module and the div class="gkColumnLeft" to be showed at the right side?, The div class="gkColumnLeft" is using just one column and we need to show two columns at the left side, and the div class="gkColumnRight" is using two columns and we need to show just one at the left side. If is not a class in this template to do it, please could you help me with an CSS code to override the existing one, creating two new classes to be used in such a way to achieve this scenario?

Thank you!

To answer my own question. I found the css at gk.stuff.css and already create two new classes .gkColumnLeft2Col, .gkColumnRight1Col:

Code: Select all

.gkColumnLeft2Col,
.gkColumnRight1Col { padding: 70px 0; }

.gkColumnRight1Col {
   float: right;
   width: 40%;
}

.gkColumnRight1Col p {
   color: #636363;
   font-size: 18px;
   line-height: 1.6;
   margin-top: 48px;
}

.gkColumnLeft2Col {
   float: Left;
   width: 55%;
}

.gkColumnLeft2Col figure {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   -ms-box-sizing: border-box;
   box-sizing: border-box;
   float: left;
   padding: 2%;
   text-align: center;
   width: 46%;
}

.gkColumnLeft2Col figure h4 {
   color: #c9c9c9;
   font-size: 18px;
   margin: 32px 0 10px 0;
   text-transform: uppercase;
}

.gkColumnLeft2Col figure p {
   color: #c9c9c9;
   font-size: 13px;
   margin: 20px 0;
}

I hope it will be useful for somebody else.

Cheers!