
.container {
    margin: 0 auto;
    padding: 0;
    position: relative;
    width: 1200px;
}
.container .column, .container .columns {
    display: inline;
    float: left;
    margin-left: 10px;
    margin-right: 10px;
}
.row {
    margin-bottom: 20px;
}
.column.alpha, .columns.alpha {
    margin-left: 0;
}
.column.omega, .columns.omega {
    margin-right: 0;
}
.container .one.column, .container .one.columns {
    width: 55px;
}
.container .two.columns {
    width: 130px;
}
.container .three.columns {
    width: 205px;
}
.container .four.columns {
    /*width: 280px;*/
}
.container .five.columns {
    width: 355px;
}
.container .six.columns {
    width: 430px;
}
.container .seven.columns {
    width: 505px;
}
.container .eight.columns {
    width: 580px;
}
.container .nine.columns {
    width: 655px;
}
.container .ten.columns {
    width: 730px;
}
.container .eleven.columns {
    width: 805px;
}
.container .twelve.columns {
    width: 880px;
}
.container .thirteen.columns {
    width: 955px;
}
.container .fourteen.columns {
    width: 1030px;
}
.container .fifteen.columns {
    width: 1105px;
}
.container .sixteen.columns {
    width: 1180px;
}
.container .one-third.columns, .container .one-third.column {
    width: 380px;
}
.container .two-thirds.column, .container .two-thirds.column {
    width: 780px;
}
.container .twelve.alt.columns {
    margin-right: 30px;
    width: 860px;
}
.container .twelve.alt2.columns {
    margin-left: 30px;
    width: 860px;
}
.container .eleven.alt.columns {
    margin-right: 30px;
    width: 775px;
}
.container .five.alt.columns {
    margin-right: 15px;
    width: 320px;
}
.page-left.container .twelve.alt3.columns, .page-left.container .twelve.alt2.columns {
    float: right;
}
body.boxed, body.boxed #header {
    width: 1280px;
}
@media only screen and (min-width: 1200px) and (max-width: 1300px) {
body.boxed, body.boxed #header {
    width: 100%;
}
}
.container .products .three.columns {
    width: 200px;
}
.container .products .four.columns {
    width: 273px;
}
@media only screen and (min-width: 960px) and (max-width: 1199px) {
.container {
    margin: 0 auto;
    padding: 0;
    position: relative;
    width: 960px;
}
.container .column, .container .columns {
    display: inline;
    float: left;
    margin-left: 10px;
    margin-right: 10px;
}
.row {
    margin-bottom: 20px;
}
.column.alpha, .columns.alpha {
    margin-left: 0;
}
.column.omega, .columns.omega {
    margin-right: 0;
}
.container .one.column, .container .one.columns {
    width: 40px;
}
.container .two.columns {
    width: 100px;
}
.container .three.columns {
    width: 160px;
}
.container .four.columns {
    width: 220px;
}
.container .five.columns {
    width: 280px;
}
.container .six.columns {
    width: 340px;
}
.container .seven.columns {
    width: 400px;
}
.container .eight.columns {
    width: 460px;
}
.container .nine.columns {
    width: 520px;
}
.container .ten.columns {
    width: 580px;
}
.container .eleven.columns {
    width: 640px;
}
.container .twelve.columns {
    width: 700px;
}
.container .thirteen.columns {
    width: 760px;
}
.container .fourteen.columns {
    width: 820px;
}
.container .fifteen.columns {
    width: 880px;
}
.container .sixteen.columns {
    width: 940px;
}
.container .one-third.columns, .container .one-third.column {
    width: 300px;
}
.container .two-thirds.column, .container .two-thirds.column {
    width: 620px;
}
.container .twelve.alt.columns {
    margin-right: 30px;
    width: 680px;
}
.container .twelve.alt2.columns {
    margin-left: 30px;
    width: 680px;
}
.container .eleven.alt.columns {
    margin-right: 30px;
    width: 610px;
}
.container .five.alt.columns {
    margin-right: 15px;
    width: 245px;
}
body.boxed, body.boxed #header {
    width: 1020px;
}
.container .products .three.columns {
    width: 155px;
}
.container .products .four.columns {
    width: 213px;
}
}
@media only screen and (min-width: 769px) and (max-width: 1040px) {
body.boxed, body.boxed #header {
    width: 100%;
}
}
@media only screen and (min-width: 768px) and (max-width: 959px) {
.container {
    width: 768px;
}
.container .column, .container .columns {
    margin-left: 10px;
    margin-right: 10px;
}
.column.alpha, .columns.alpha {
    margin-left: 0;
    margin-right: 10px;
}
.column.omega, .columns.omega {
    margin-left: 10px;
    margin-right: 0;
}
.alpha.omega {
    margin-left: 0;
    margin-right: 0;
}
.container .one.column, .container .one.columns {
    width: 28px;
}
.container .two.columns {
    width: 76px;
}
.container .three.columns {
    width: 124px;
}
.container .four.columns {
    width: 172px;
}
.container .five.columns {
    width: 220px;
}
.container .six.columns {
    width: 268px;
}
.container .seven.columns {
    width: 316px;
}
.container .eight.columns {
    width: 364px;
}
.container .nine.columns {
    width: 412px;
}
.container .ten.columns {
    width: 460px;
}
.container .eleven.columns {
    width: 508px;
}
.container .twelve.columns {
    width: 556px;
}
.container .thirteen.columns {
    width: 604px;
}
.container .fourteen.columns {
    width: 652px;
}
.container .fifteen.columns {
    width: 700px;
}
.container .sixteen.columns {
    width: 748px;
}
.container .one-third.columns, .container .one-third.column {
    width: 236px;
}
.container .one-third.columns, .container .two-thirds.column, .container .two-thirds.column, .container .two-thirds.column {
    width: 492px;
}
.container .twelve.alt.columns {
    margin-right: 20px;
    width: 546px;
}
.container .twelve.alt2.columns {
    margin-left: 20px;
    width: 546px;
}
.container .eleven.alt.columns {
    margin-right: 20px;
    width: 488px;
}
.container .five.alt.columns {
    margin-right: 15px;
    width: 185px;
}
body.boxed, body.boxed #header {
    width: 100%;
}
.container .products .three.columns {
    width: 121px;
}
.container .products .four.columns {
    width: 168px;
}
}
@media only screen and (max-width: 767px) {
.container {
    width: 300px;
}
.container .columns, .container .column {
    margin: 0;
}
.container .products .three.columns, .container .products .four.columns, .container .one.column, .container .one.columns, .container .two.columns, .container .three.columns, .container .four.columns, .container .five.columns, .container .six.columns, .container .seven.columns, .container .eight.columns, .container .nine.columns, .container .ten.columns, .container .eleven.columns, .container .twelve.columns, .container .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, .container .sixteen.columns, .container .one-third.columns, .container .one-third.column, .container .two-thirds.column, .container .two-thirds.column, .container .twelve.alt.columns, .container .twelve.alt2.columns, .container .five.alt.columns, .container .eleven.alt.columns {
    width: 300px;
}
.container .twelve.alt2.columns {
    margin-left: 0;
}
.container .fourteen.carousel.columns {
    width: 240px;
}
.container .one.carousel.column {
    width: 30px;
}
body.boxed, body.boxed #header {
    width: 100%;
}
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
.container {
    width: 420px;
}
.container .columns, .container .column {
    margin: 0;
}
.container .products .three.columns, .container .products .four.columns, .container .one.column, .container .one.columns, .container .two.columns, .container .three.columns, .container .four.columns, .container .five.columns, .container .six.columns, .container .seven.columns, .container .eight.columns, .container .nine.columns, .container .ten.columns, .container .eleven.columns, .container .twelve.columns, .container .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, .container .sixteen.columns, .container .one-third.column, .container .one-third.columns, .container .two-thirds.column, .container .two-thirds.column, .container .twelve.alt.columns, .container .twelve.alt2.columns, .container .five.alt.columns, .container .eleven.alt.columns {
    width: 420px;
}
.container .twelve.alt2.columns {
    margin-left: 0;
}
.container .fourteen.carousel.columns {
    width: 340px;
}
.container .one.carousel.column {
    width: 40px;
}
body.boxed, body.boxed #header {
    width: 100%;
}
}
.container::after {
    clear: both;
    content: " ";
    display: block;
    height: 0;
    visibility: hidden;
}
.clearfix::before, .clearfix::after, .row::before, .row::after {
    content: " ";
    display: block;
    height: 0;
    overflow: hidden;
    visibility: hidden;
    width: 0;
}
.row::after, .clearfix::after {
    clear: both;
}
.row, .clearfix {
}
.clear {
    clear: both;
    display: block;
    height: 0;
    overflow: hidden;
    visibility: hidden;
    width: 0;
}
66

        body.boxed,

67

        body.boxed #header                          { width: 100%; }

68

    }

69

 

70

 

71

/* Shop grid  */

72

    .container .products .three.columns {

73

        width: 200px

74

    }

75

    .container .products .four.columns {

76

        width: 273px

77

    }

78

 

79

/* #Dekstop (960 Grid)

80

================================================== */

81

 

82

    /* Note: Design for a width of 960px */

83

 

84

    @media only screen and (min-width: 960px) and (max-width: 1199px) {

85

        .container                                  { position: relative; width: 960px; margin: 0 auto; padding: 0; }

86

        .container .column,

87

        .container .columns                         { float: left; display: inline; margin-left: 10px; margin-right: 10px; }

88

        .row                                        { margin-bottom: 20px; }

89

 

90

        /* Nested Column Classes */

91

        .column.alpha, .columns.alpha               { margin-left: 0; }

92

        .column.omega, .columns.omega               { margin-right: 0; }

93

 

94

        /* Base Grid */

95

        .container .one.column,

96

        .container .one.columns                     { width: 40px;  }

97

        .container .two.columns                     { width: 100px; }

98

        .container .three.columns                   { width: 160px; }

99

        .container .four.columns                    { width: 220px; }

100

        .container .five.columns                    { width: 280px; }

101

        .container .six.columns                     { width: 340px; }

102

        .container .seven.columns                   { width: 400px; }

103

        .container .eight.columns                   { width: 460px; }

104

        .container .nine.columns                    { width: 520px; }

105

        .container .ten.columns                     { width: 580px; }

106

        .container .eleven.columns                  { width: 640px; }

107

        .container .twelve.columns                  { width: 700px; }

108

        .container .thirteen.columns                { width: 760px; }

109

        .container .fourteen.columns                { width: 820px; }

110

        .container .fifteen.columns                 { width: 880px; }

111

        .container .sixteen.columns                 { width: 940px; }

112

 

113

        .container .one-third.columns,

114

        .container .one-third.column                { width: 300px; }

115

        .container .two-thirds.column,

116

        .container .two-thirds.column               { width: 620px; }

117

        .container .twelve.alt.columns              { width: 680px; margin-right: 30px; }

118

        .container .twelve.alt2.columns             { width: 680px; margin-left: 30px; }

119

        .container .eleven.alt.columns              { width: 610px; margin-right: 30px; }

120

        .container .five.alt.columns                { width: 245px; margin-right: 15px; }

121

 

122

        body.boxed,

123

        body.boxed #header                          { width: 1020px; }

