.WidgetHolder { float: left; vertical-align: top; }

.WidgetHolder.FloatRight { float: right; }

.WidgetHolder.ClearLeft { clear: left; }

.WidgetHolderContent { position: relative; }

.WidgetColumnSpan1, .WidgetColumnSpan2, .WidgetColumnSpan3, .WidgetColumnSpan4, .WidgetColumnSpan5 { width: 100%; margin: 0 0 12px 0; }

.WidgetColumns2 .WidgetColumnSpan1 { width: 50%; }

.WidgetColumns2 .WidgetColumnSpan2 { width: 100%; }

.WidgetColumns3 .WidgetColumnSpan1 { width: 33.3%; }

.WidgetColumns3 .WidgetColumnSpan2 { width: 66.6%; }

.WidgetColumns3 .WidgetColumnSpan3 { width: 99.9%; }

.WidgetColumns4 .WidgetColumnSpan1 { width: 25%; }

.WidgetColumns4 .WidgetColumnSpan2 { width: 50%; }

.WidgetColumns4 .WidgetColumnSpan3 { width: 75%; }

.WidgetColumns4 .WidgetColumnSpan4 { width: 100%; }

.WidgetColumns5 .WidgetColumnSpan1 { width: 20%; }

.WidgetColumns5 .WidgetColumnSpan2 { width: 40%; }

.WidgetColumns5 .WidgetColumnSpan3 { width: 60%; }

.WidgetColumns5 .WidgetColumnSpan4 { width: 80%; }

.WidgetColumns5 .WidgetColumnSpan5 { width: 100%; }

.hasWidgetRowSpan { overflow-y: hidden; }

.hasWidgetRowSpan .WidgetHolderContent { height: 100%; }

/*$baseheight: 200px;*/
.WidgetRowSpan1 { height: 200px; /*$baseheight*/ }

.WidgetRowSpan2 { height: 400px; /*$baseheight*2*/ }

.WidgetRowSpan3 { height: 600px; /*$baseheight*3*/ }

.WidgetRowSpan4 { height: 800px; /*$baseheight*4*/ }

.WidgetRowSpan5 { height: 1000px; /*$baseheight*5*/ }

@media all and (max-width: 800px) { .WidgetColumns3 .WidgetColumnSpan1 { width: 50%; }
  .WidgetColumns3 .WidgetColumnSpan2 { width: 100%; }
  .WidgetColumns3 .WidgetColumnSpan3 { width: 100%; }
  .WidgetColumns4 .WidgetColumnSpan1 { width: 50%; }
  .WidgetColumns4 .WidgetColumnSpan2 { width: 100%; }
  .WidgetColumns4 .WidgetColumnSpan3 { width: 100%; }
  .WidgetColumns4 .WidgetColumnSpan4 { width: 100%; }
  .WidgetColumns5 .WidgetColumnSpan1 { width: 50%; }
  .WidgetColumns5 .WidgetColumnSpan2 { width: 100%; }
  .WidgetColumns5 .WidgetColumnSpan3 { width: 100%; }
  .WidgetColumns5 .WidgetColumnSpan4 { width: 100%; }
  .WidgetColumns5 .WidgetColumnSpan5 { width: 100%; } }
@media all and (max-width: 400px) { .WidgetColumns2 .WidgetColumnSpan1 { width: 100%; }
  .WidgetColumns2 .WidgetColumnSpan2 { width: 100%; }
  .WidgetColumns3 .WidgetColumnSpan1 { width: 100%; }
  .WidgetColumns3 .WidgetColumnSpan2 { width: 100%; }
  .WidgetColumns3 .WidgetColumnSpan3 { width: 100%; }
  .WidgetColumns4 .WidgetColumnSpan1 { width: 100%; }
  .WidgetColumns4 .WidgetColumnSpan2 { width: 100%; }
  .WidgetColumns4 .WidgetColumnSpan3 { width: 100%; }
  .WidgetColumns4 .WidgetColumnSpan4 { width: 100%; }
  .WidgetColumns5 .WidgetColumnSpan1 { width: 100%; }
  .WidgetColumns5 .WidgetColumnSpan2 { width: 100%; }
  .WidgetColumns5 .WidgetColumnSpan3 { width: 100%; }
  .WidgetColumns5 .WidgetColumnSpan4 { width: 100%; }
  .WidgetColumns5 .WidgetColumnSpan5 { width: 100%; }
  .WidgetRowSpan1, .WidgetRowSpan2, .WidgetRowSpan3, .WidgetRowSpan4, .WidgetRowSpan5 { height: initial; } }