himynameisdave/Christmas-Grid.markdown

## Christmas-Grid.markdown

      
    Raw
  

              Christmas-Grid.markdown
            
          
    Christmas Grid

Just a fluid Christmas grid! A Festivus for the rest of us!
Dope icons from here: http://www.flaticon.com/packs/merry-christmas-line
Christmas Colors based on Adam Lindqvist's Pen: http://codepen.io/adamlindqvist/pen/EaPeJg
A Pen by Dave Lunny on CodePen.
License.

  
## index.html
<div class="row">
  <div class="box">
    <svg width="100%" height="100%" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
      <path d="M451.387,147.02l-70.792-29.211c0-0.049,0.002-0.104,0.002-0.154c0-16.707-6.617-44.734-50.933-44.734
		c-14.332,0-32.018,3.969-47.489,10.752c7.001-8.553,15.266-15.668,23.539-20.129c5.088-2.746,6.988-9.094,4.245-14.182
		c-2.745-5.088-9.093-6.988-14.181-4.244c-14.401,7.768-27.904,21.271-37.302,35.66c-9.112-19.162-23.089-26.57-23.965-27.018
		c-5.149-2.631-11.454-0.588-14.083,4.561c-2.63,5.146-0.588,11.451,4.559,14.082c0.126,0.064,7.758,4.342,13.634,15.568
		c-17.208-9.377-39.146-15.051-56.286-15.051c-44.315,0-50.932,28.027-50.932,44.734c0,0.051,0.002,0.104,0.002,0.154L60.613,147.02
		c-0.237,0.098-0.469,0.203-0.695,0.316c-0.006,0.004-0.013,0.006-0.02,0.01c-0.35,0.176-2.803,1.166-4.151,3.422
		c-1.521,2.545-1.609,5.531-1.609,5.926v207.875c0,4.006,2.287,7.66,5.89,9.412l191.105,92.93c1.519,0.801,3.184,1.229,4.864,1.229
		c1.562,0,3.127-0.35,4.577-1.055l191.396-93.07c3.603-1.752,5.89-5.408,5.89-9.414V156.775c0-0.027,0.003-0.053,0.003-0.082
		C457.862,152.455,455.306,148.635,451.387,147.02z M331.52,93.33c26.365,0,29.999,11.439,29.999,23.801
		s-3.634,23.801-29.999,23.801c-15.324,0-63.661-7.902-63.661-19.029S302.518,93.33,331.52,93.33z M181.24,93.33
		c29.002,0,63.661,17.445,63.661,28.572s-48.337,19.029-63.661,19.029c-26.365,0-29.999-11.439-29.999-23.801
		S154.875,93.33,181.24,93.33z M142.021,390.574L75.071,358.02V172.336l66.949,27.625V390.574z M92.079,156.68l43.559-17.973
		c5.731,12.467,18.67,23.68,46.698,23.68c9.461,0,20.533-0.914,31.484-2.922l-55.443,24.494L92.079,156.68z M245.529,440.908
		l-82.575-40.154V208.6l82.575,34.074V440.908z M256.038,224.145l-70.84-29.148l71.014-31.375l70.691,31.365L256.038,224.145z
		 M349.046,400.785l-82.579,40.156V242.674l82.579-34.074V400.785z M298.653,159.551c10.796,1.947,21.686,2.836,31.011,2.836
		c28.028,0,40.966-11.213,46.698-23.678l43.592,17.984l-3.471,1.434l-62.802,25.84L298.653,159.551z M436.925,358.051
		l-66.946,32.555V199.961l54.943-22.67l12.002-4.939V358.051z"/>
    </svg>
  </div>
  <div class="box">
    <svg width="100%" height="100%" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
      <path d="M411.877,83.355c-16.615,0-31.182,8.922-39.172,22.225c-23.242-8.693-56.521-17.941-92.92-17.941
		c-47.35,0-87.11,15.645-118.177,46.5c-37.852,37.595-61.933,97.59-71.645,178.396h-0.448c-19.733,0-35.787,16.054-35.787,35.786
		v44.535c0,19.733,16.054,35.787,35.787,35.787h281.062c19.734,0,35.787-16.054,35.787-35.787v-44.535
		c0-19.732-16.053-35.786-35.787-35.786h-8.094c-25.779-49.346-34.035-90.45-24.529-122.235
		c6.309-21.098,19.645-34.67,32.025-43.135c7.033,16.178,23.162,27.523,41.896,27.523c25.182,0,45.668-20.486,45.668-45.667
		C457.545,103.841,437.059,83.355,411.877,83.355z M370.578,332.536c8.705,0,15.787,7.082,15.787,15.786v44.535
		c0,8.705-7.082,15.787-15.787,15.787H89.516c-8.705,0-15.787-7.082-15.787-15.787v-44.535c0-8.705,7.082-15.786,15.787-15.786
		H370.578z M364.355,127.022c-16.738,10.033-36.641,27.719-45.563,57.548c-10.412,34.813-3.252,77.804,21.279,127.966H110.106
		c9.323-75.006,31.368-130.21,65.596-164.206c27.185-27,62.204-40.691,104.083-40.691c34.066,0,65.717,9.25,84.879,16.295
		L364.355,127.022z M411.877,154.688c-14.152,0-25.666-11.514-25.666-25.667c0-14.152,11.514-25.666,25.666-25.666
		c14.154,0,25.668,11.514,25.668,25.666C437.545,143.174,426.031,154.688,411.877,154.688z"/>
    </svg>
  </div>
  <div class="box">
    <svg width="100%" height="100%" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
      <path d="M381.719,394.609L213.471,154.825c-1.779-2.536-2.465-5.622-1.926-8.689c0.537-3.068,2.23-5.737,4.768-7.517
		c1.961-1.376,4.26-2.104,6.65-2.104c3.811,0,7.383,1.849,9.555,4.944c8.416,11.996,22.199,19.158,36.867,19.157
		c9.275,0,18.203-2.824,25.816-8.166c9.84-6.904,16.402-17.227,18.479-29.066c2.076-11.84-0.584-23.779-7.488-33.618
		C287.199,62.7,256.049,46.54,222.863,46.54c-20.943,0-41.086,6.365-58.246,18.407c-22.191,15.57-36.996,38.887-41.689,65.654
		c-4.691,26.768,1.299,53.73,16.871,75.921l168.246,239.783c8.416,11.995,22.197,19.156,36.865,19.156
		c9.275,0,18.203-2.824,25.816-8.167C391.039,443.042,395.971,414.922,381.719,394.609z M246.039,323.116l69.65,12.211
		l29.705,42.334l-69.65-12.211L246.039,323.116z M299.443,312.174l-69.648-12.211l-29.705-42.335l69.648,12.211L299.443,312.174z
		 M142.627,134.054c1.051-5.988,2.752-11.75,5.014-17.233c6.172,6.724,15.881,13.314,30.986,18.537
		c4.859,1.68,9.639,2.999,13.98,4.029c-0.309,1.078-0.566,2.176-0.764,3.296c-1.459,8.33,0.406,16.722,5.256,23.631l10.445,14.886
		l-63.189-11.078C141.121,158.537,140.486,146.272,142.627,134.054z M289.82,101.255c3.836,5.466,5.313,12.099,4.16,18.676
		c-1.154,6.577-4.801,12.312-10.268,16.148c-4.23,2.969-9.186,4.538-14.328,4.538c-8.156,0-15.818-3.978-20.494-10.645
		c-4.271-6.084-10.516-10.385-17.539-12.313c0.996-11.943,6.24-33.908,30.717-41.139C272.965,82.45,282.516,90.845,289.82,101.255z
		 M176.105,81.319c13.777-9.668,29.947-14.779,46.758-14.779c4.367,0,8.689,0.354,12.934,1.032
		c-11.025,8.465-17.018,19.499-20.27,28.916c-2.924,8.462-3.941,16.523-4.25,22.269c-1.957,0.781-3.832,1.78-5.621,2.954
		c-15.443-2.709-40.998-9.987-46.975-23.889C163.58,91.566,169.426,86.005,176.105,81.319z M154.258,192.162l69.531,12.19
		l29.705,42.333l-69.65-12.211l-27.674-39.441C155.506,194.089,154.877,193.128,154.258,192.162z M359.24,440.921
		c-4.232,2.969-9.188,4.539-14.33,4.539c-8.156,0-15.818-3.979-20.494-10.644l-32.428-46.213l69.652,12.211l3.705,5.282
		C373.264,417.381,370.525,433.003,359.24,440.921z"/>
    </svg>
  </div>
</div>
<div class="row">
  <div class="box">
    <svg width="100%" height="100%" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
      <path d="M451.949,307.714l-58.997,15.809l-22.876-13.207l39.68-10.633c5.335-1.43,8.501-6.913,7.071-12.247
		c-1.429-5.334-6.915-8.503-12.247-7.071l-58.999,15.809l-24.615-14.211c3.222-8.034,5.014-16.79,5.014-25.962
		c0-9.171-1.791-17.927-5.014-25.96l24.617-14.213l58.999,15.808c0.867,0.232,1.737,0.344,2.594,0.344
		c4.415-0.001,8.456-2.947,9.653-7.415c1.43-5.335-1.736-10.818-7.071-12.247l-39.68-10.632l22.875-13.207l58.997,15.808
		c0.867,0.232,1.737,0.344,2.594,0.344c4.415-0.001,8.456-2.947,9.653-7.415c1.43-5.334-1.736-10.817-7.071-12.247l-39.679-10.632
		l30.437-17.572c4.783-2.762,6.422-8.877,3.66-13.66c-2.761-4.781-8.877-6.422-13.66-3.66l-30.437,17.573l10.631-39.679
		c1.43-5.335-1.736-10.818-7.071-12.247s-10.817,1.737-12.247,7.071l-15.807,58.996l-22.876,13.208l10.632-39.681
		c1.43-5.334-1.736-10.817-7.071-12.247c-5.338-1.43-10.817,1.736-12.247,7.071l-15.809,58.999l-24.642,14.227
		c-10.87-13.772-26.785-23.377-44.94-25.987v-28.414l43.189-43.19c3.905-3.905,3.905-10.237,0-14.143
		c-3.906-3.904-10.236-3.904-14.143,0L266,130.048v-26.412l43.189-43.19c3.905-3.905,3.905-10.237,0-14.143
		c-3.906-3.904-10.236-3.904-14.143,0L266,75.351V40.205c0-5.522-4.478-10-10-10s-10,4.478-10,10v35.146l-29.047-29.046
		c-3.906-3.904-10.236-3.904-14.143,0c-3.905,3.905-3.905,10.237,0,14.143L246,103.636v26.412l-29.047-29.046
		c-3.906-3.904-10.236-3.904-14.143,0c-3.905,3.905-3.905,10.237,0,14.143L246,158.333v28.414
		c-18.154,2.61-34.069,12.215-44.938,25.986l-24.644-14.228l-15.81-58.998c-1.43-5.336-6.916-8.502-12.247-7.071
		c-5.335,1.43-8.501,6.913-7.071,12.247l10.633,39.68l-22.875-13.206l-15.809-58.997c-1.43-5.336-6.915-8.503-12.247-7.071
		c-5.335,1.43-8.501,6.913-7.071,12.247l10.633,39.68l-30.438-17.573c-4.784-2.762-10.899-1.122-13.66,3.66
		c-2.762,4.783-1.123,10.898,3.66,13.66l30.437,17.573l-39.677,10.632c-5.335,1.43-8.501,6.913-7.071,12.247
		c1.197,4.469,5.237,7.415,9.653,7.415c0.856,0,1.728-0.111,2.594-0.344l58.996-15.809l22.876,13.207l-39.679,10.633
		c-5.335,1.43-8.501,6.913-7.071,12.247c1.197,4.469,5.237,7.415,9.653,7.415c0.856,0,1.728-0.111,2.594-0.344l58.998-15.809
		l24.616,14.212c-3.223,8.033-5.014,16.789-5.014,25.961c0,9.171,1.791,17.927,5.014,25.96l-24.617,14.213l-58.999-15.808
		c-5.336-1.429-10.817,1.737-12.247,7.071c-1.43,5.335,1.736,10.817,7.071,12.247l39.68,10.632l-22.876,13.207L60.05,307.715
		c-5.337-1.431-10.817,1.737-12.247,7.071c-1.43,5.335,1.736,10.817,7.071,12.247l39.679,10.632l-30.437,17.572
		c-4.783,2.762-6.422,8.877-3.66,13.66c1.853,3.208,5.213,5.002,8.67,5.002c1.696,0,3.416-0.433,4.99-1.342l30.438-17.573
		l-10.632,39.679c-1.43,5.334,1.736,10.817,7.071,12.247c0.867,0.232,1.737,0.344,2.594,0.344c4.415,0,8.456-2.947,9.653-7.415
		l15.808-58.996l22.876-13.208l-10.632,39.681c-1.43,5.335,1.736,10.817,7.071,12.247c0.867,0.232,1.737,0.344,2.594,0.344
		c4.415,0,8.456-2.947,9.653-7.415l15.808-58.998l24.643-14.228c10.869,13.772,26.784,23.377,44.939,25.987v28.413l-43.189,43.191
		c-3.905,3.905-3.905,10.237,0,14.143c1.953,1.952,4.512,2.929,7.071,2.929s5.118-0.977,7.071-2.929L246,381.951v26.414
		l-43.188,43.189c-3.905,3.905-3.905,10.237,0,14.143c1.953,1.952,4.512,2.929,7.071,2.929s5.118-0.977,7.071-2.929L246,436.65
		v35.145c0,5.522,4.478,10,10,10s10-4.478,10-10v-35.146l29.047,29.046c3.906,3.904,10.236,3.904,14.143,0
		c3.905-3.905,3.905-10.237,0-14.143L266,408.365v-26.414l29.048,29.047c3.906,3.904,10.236,3.904,14.143,0
		c3.905-3.905,3.905-10.237,0-14.143L266,353.666v-28.413c18.155-2.61,34.07-12.215,44.939-25.986l24.643,14.228l15.811,58.999
		c1.197,4.468,5.237,7.414,9.653,7.414c0.856-0.001,1.728-0.111,2.595-0.344c5.334-1.43,8.5-6.913,7.07-12.248l-10.633-39.679
		l22.875,13.207l15.809,58.996c1.197,4.469,5.237,7.415,9.653,7.415c0.856-0.001,1.728-0.111,2.594-0.344
		c5.335-1.43,8.501-6.913,7.071-12.247l-10.633-39.679l30.437,17.572c1.575,0.909,3.294,1.342,4.99,1.342
		c3.456,0,6.818-1.794,8.67-5.002c2.762-4.783,1.123-10.898-3.66-13.66l-30.437-17.572l39.678-10.633
		c5.335-1.43,8.501-6.913,7.071-12.247C462.767,309.45,457.283,306.283,451.949,307.714z M256,305.979
		c-27.559,0-49.979-22.42-49.979-49.979s22.42-49.979,49.979-49.979s49.979,22.42,49.979,49.979S283.559,305.979,256,305.979z"/>


    </svg>
  </div>
  <div class="box">
    <svg width="100%" height="100%" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
      <svg width="100%" height="100%" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
      <path d="M396.676,356.47c-28.269-25.442-49.445-47.649-68.104-71.618h29.546c4.141,0,7.853-2.552,9.336-6.417
		s0.432-8.246-2.646-11.016c-24.529-22.076-58.057-60.418-62.611-69.2h42.578c4.141,0,7.853-2.552,9.336-6.417
		s0.432-8.246-2.646-11.016c-29.489-26.541-49.67-52.252-71.525-90.473l-1.979-11.538l12.652-12.333
		c1.749-1.705,2.378-4.254,1.623-6.577c-0.754-2.323-2.762-4.015-5.179-4.367l-17.485-2.541l-7.818-15.843
		c-1.081-2.19-3.312-3.577-5.754-3.577s-4.673,1.387-5.754,3.577l-7.818,15.843l-17.485,2.541c-2.417,0.352-4.425,2.044-5.179,4.367
		c-0.755,2.322-0.126,4.872,1.623,6.577l12.652,12.333l-1.995,11.632c-22.195,38.93-41.661,63.521-71.504,90.379
		c-3.078,2.77-4.13,7.15-2.646,11.016s5.195,6.417,9.336,6.417h42.58c-16.952,24.295-36.003,45.251-62.613,69.2
		c-3.078,2.77-4.13,7.15-2.646,11.016s5.195,6.417,9.336,6.417h29.546c-0.215,0.275-0.427,0.552-0.642,0.826
		c-0.091,0.107-0.174,0.219-0.259,0.329c-18.439,23.53-39.39,45.429-67.204,70.463c-3.078,2.77-4.13,7.149-2.646,11.015
		s5.195,6.417,9.336,6.417H246v98.145c0,5.523,4.478,10,10,10s10-4.477,10-10v-98.145h71.662c0.006,0,0.012,0.001,0.018,0.001
		c0.007,0,0.014-0.001,0.021-0.001h52.286c4.141,0,7.853-2.552,9.336-6.417S399.754,359.239,396.676,356.47z M247.608,65.17
		c2.09-0.303,3.896-1.616,4.831-3.51l3.558-7.209l3.558,7.209c0.935,1.894,2.741,3.207,4.831,3.51l7.958,1.157l-5.758,5.613
		c-1.512,1.474-2.202,3.598-1.845,5.679l1.346,7.85c-0.022,0.011-7.104-3.667-7.104-3.667c-0.935-0.491-1.96-0.737-2.985-0.737
		s-2.051,0.246-2.985,0.737c0,0-7.029,3.582-7.085,3.553l1.326-7.735c0.357-2.082-0.333-4.206-1.845-5.679l-5.758-5.613
		L247.608,65.17z M250.838,97.442l5.159-2.712l5.071,2.666c0,0,20.932,39.979,40.527,60.58
		c-39.994-6.267-59.025-27.436-65.211-35.977C244.313,110.875,250.838,97.442,250.838,97.442z M192.141,178.219
		c11.941-12.209,22.471-24.776,32.555-38.886c11.275,13.017,35.063,33.212,77.125,38.886h-18.242h-55.154H192.141z M233.903,198.219
		h44.195c1.971,3.044,3.958,6.029,5.972,8.966c-10.768,7.769-35.54,22.14-77.359,27.991
		C216.54,223.431,225.384,211.378,233.903,198.219z M179.165,264.852c2.606-2.558,5.132-5.098,7.597-7.631
		c59.465-3.479,94.047-22.88,109.082-33.818c10.893,14.179,22.85,27.567,36.991,41.449h-24.177H203.342H179.165z M147.5,353.902
		c16.501-15.817,30.529-30.802,43.282-46.251c20.534,21.506,46.688,36.25,71.171,46.251H147.5z M338.283,353.902
		c-7.192-0.926-89.601-12.55-134.964-62.129c1.729-2.289,3.446-4.591,5.144-6.922h95.074c17.479,24.008,36.512,45.613,60.963,69.051
		H338.283z"/>
    </svg>
  </div>
  <div class="box">
    <svg width="100%" height="100%" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
      <g>
		<path d="M294.92,131.832c31.797,12.01,57.282,37.002,69.92,68.569c1.564,3.909,5.318,6.286,9.286,6.286
			c1.237,0,2.495-0.231,3.714-0.719c5.127-2.053,7.619-7.873,5.566-13c-14.716-36.758-44.392-65.86-81.42-79.846
			c-5.167-1.951-10.937,0.656-12.888,5.822C287.146,124.11,289.753,129.881,294.92,131.832z"/>
		<path d="M444.272,435.927l-49.678-72.809c-0.311-0.455-0.666-0.867-1.04-1.259c28.941-33.167,44.729-75.134,44.729-119.611
			c0-100.512-81.772-182.284-182.284-182.284S73.716,141.737,73.716,242.249c0,44.477,15.788,86.444,44.729,119.611
			c-0.374,0.392-0.729,0.804-1.04,1.259l-50,73.281c-2.089,3.063-2.313,7.029-0.581,10.308c1.731,3.278,5.135,5.329,8.842,5.329
			h360.668c0.006,0,0.014,0,0.02,0c5.523,0,10-4.477,10-10C446.354,439.735,445.577,437.617,444.272,435.927z M256,79.964
			c89.483,0,162.284,72.8,162.284,162.284c0,42.395-16.113,82.231-45.461,112.631H266v-31.671h74.248
			c4.104,0,7.792-2.508,9.301-6.325c1.508-3.817,0.53-8.168-2.466-10.974c-15.539-14.551-27.627-27.466-38.235-40.965h11.361
			c4.104,0,7.792-2.508,9.301-6.325c1.508-3.817,0.53-8.169-2.466-10.974c-14.633-13.702-25.575-25.885-35.191-39.383h19.966
			c4.104,0,7.792-2.508,9.3-6.325c1.509-3.817,0.531-8.168-2.464-10.974c-19.708-18.458-40.625-45.29-53.478-68.571
			c-0.854-1.977-2.352-3.693-4.389-4.804c-4.849-2.644-10.923-0.858-13.567,3.992c-12.815,23.499-33.962,50.733-53.875,69.383
			c-2.995,2.806-3.973,7.157-2.464,10.974c1.508,3.817,5.195,6.325,9.3,6.325h19.965c-9.614,13.496-20.558,25.679-35.191,39.384
			c-2.995,2.805-3.973,7.157-2.465,10.974c1.509,3.817,5.196,6.325,9.301,6.325h11.36c-10.607,13.499-22.694,26.413-38.234,40.965
			c-2.996,2.806-3.974,7.157-2.466,10.974c1.509,3.817,5.196,6.325,9.301,6.325H246v31.671H139.177
			c-29.348-30.399-45.461-70.236-45.461-112.631C93.716,152.765,166.517,79.964,256,79.964z M273.34,188.261h-34.68h-14.801
			c11.728-13.096,22.919-27.805,32.134-42.271c9.198,14.367,20.488,29.18,32.184,42.271H273.34z M267.767,208.261
			c8.373,13.243,17.279,24.839,28.283,36.683h-6.94h-66.221h-6.939c11.006-11.845,19.911-23.44,28.284-36.683H267.767z
			 M283.889,264.943c9.402,13.27,19.547,25.468,31.899,38.265H196.212c12.352-12.796,22.498-24.997,31.898-38.265H283.889z
			 M94.595,432.036l36.354-53.281h250.102l36.354,53.281H94.595z"/>
	</g>
    </svg>
  </div>
</div>

## style.less
* { box-sizing: border-box; }
html, body {
  margin:0; padding: 0;
  height: 100%; width: 100%;
}

.row {
  clear: both;
  width: 100%;
  height: 50%;
}

.box {
  height: 100%;
  width: 33.3332%;
  float: left;

  @media screen and ( max-width: 680px ) {
      width: 100%;
  }

}

.row:nth-of-type(odd){
  .box{
    &:nth-of-type(1){
      background: #F5624D;
    }
    &:nth-of-type(2){
      background: #34A65F;
    }
    &:nth-of-type(3){
      background: #235E6F;
    }
  }
}

.row:nth-of-type(even){
  .box {
    &:nth-of-type(1){
      background: #34A7C7;
    }
    &:nth-of-type(2){
      background: #CC231E;
    }
    &:nth-of-type(3){
      background: #0F8A5F;
    }
  }
}
	<div class="row">
	<div class="box">
	<svg width="100%" height="100%" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
	<path d="M451.387,147.02l-70.792-29.211c0-0.049,0.002-0.104,0.002-0.154c0-16.707-6.617-44.734-50.933-44.734
	c-14.332,0-32.018,3.969-47.489,10.752c7.001-8.553,15.266-15.668,23.539-20.129c5.088-2.746,6.988-9.094,4.245-14.182
	c-2.745-5.088-9.093-6.988-14.181-4.244c-14.401,7.768-27.904,21.271-37.302,35.66c-9.112-19.162-23.089-26.57-23.965-27.018
	c-5.149-2.631-11.454-0.588-14.083,4.561c-2.63,5.146-0.588,11.451,4.559,14.082c0.126,0.064,7.758,4.342,13.634,15.568
	c-17.208-9.377-39.146-15.051-56.286-15.051c-44.315,0-50.932,28.027-50.932,44.734c0,0.051,0.002,0.104,0.002,0.154L60.613,147.02
	c-0.237,0.098-0.469,0.203-0.695,0.316c-0.006,0.004-0.013,0.006-0.02,0.01c-0.35,0.176-2.803,1.166-4.151,3.422
	c-1.521,2.545-1.609,5.531-1.609,5.926v207.875c0,4.006,2.287,7.66,5.89,9.412l191.105,92.93c1.519,0.801,3.184,1.229,4.864,1.229
	c1.562,0,3.127-0.35,4.577-1.055l191.396-93.07c3.603-1.752,5.89-5.408,5.89-9.414V156.775c0-0.027,0.003-0.053,0.003-0.082
	C457.862,152.455,455.306,148.635,451.387,147.02z M331.52,93.33c26.365,0,29.999,11.439,29.999,23.801
	s-3.634,23.801-29.999,23.801c-15.324,0-63.661-7.902-63.661-19.029S302.518,93.33,331.52,93.33z M181.24,93.33
	c29.002,0,63.661,17.445,63.661,28.572s-48.337,19.029-63.661,19.029c-26.365,0-29.999-11.439-29.999-23.801
	S154.875,93.33,181.24,93.33z M142.021,390.574L75.071,358.02V172.336l66.949,27.625V390.574z M92.079,156.68l43.559-17.973
	c5.731,12.467,18.67,23.68,46.698,23.68c9.461,0,20.533-0.914,31.484-2.922l-55.443,24.494L92.079,156.68z M245.529,440.908
	l-82.575-40.154V208.6l82.575,34.074V440.908z M256.038,224.145l-70.84-29.148l71.014-31.375l70.691,31.365L256.038,224.145z
	M349.046,400.785l-82.579,40.156V242.674l82.579-34.074V400.785z M298.653,159.551c10.796,1.947,21.686,2.836,31.011,2.836
	c28.028,0,40.966-11.213,46.698-23.678l43.592,17.984l-3.471,1.434l-62.802,25.84L298.653,159.551z M436.925,358.051
	l-66.946,32.555V199.961l54.943-22.67l12.002-4.939V358.051z"/>
	</svg>
	</div>
	<div class="box">
	<svg width="100%" height="100%" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
	<path d="M411.877,83.355c-16.615,0-31.182,8.922-39.172,22.225c-23.242-8.693-56.521-17.941-92.92-17.941
	c-47.35,0-87.11,15.645-118.177,46.5c-37.852,37.595-61.933,97.59-71.645,178.396h-0.448c-19.733,0-35.787,16.054-35.787,35.786
	v44.535c0,19.733,16.054,35.787,35.787,35.787h281.062c19.734,0,35.787-16.054,35.787-35.787v-44.535
	c0-19.732-16.053-35.786-35.787-35.786h-8.094c-25.779-49.346-34.035-90.45-24.529-122.235
	c6.309-21.098,19.645-34.67,32.025-43.135c7.033,16.178,23.162,27.523,41.896,27.523c25.182,0,45.668-20.486,45.668-45.667
	C457.545,103.841,437.059,83.355,411.877,83.355z M370.578,332.536c8.705,0,15.787,7.082,15.787,15.786v44.535
	c0,8.705-7.082,15.787-15.787,15.787H89.516c-8.705,0-15.787-7.082-15.787-15.787v-44.535c0-8.705,7.082-15.786,15.787-15.786
	H370.578z M364.355,127.022c-16.738,10.033-36.641,27.719-45.563,57.548c-10.412,34.813-3.252,77.804,21.279,127.966H110.106
	c9.323-75.006,31.368-130.21,65.596-164.206c27.185-27,62.204-40.691,104.083-40.691c34.066,0,65.717,9.25,84.879,16.295
	L364.355,127.022z M411.877,154.688c-14.152,0-25.666-11.514-25.666-25.667c0-14.152,11.514-25.666,25.666-25.666
	c14.154,0,25.668,11.514,25.668,25.666C437.545,143.174,426.031,154.688,411.877,154.688z"/>
	</svg>
	</div>
	<div class="box">
	<svg width="100%" height="100%" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
	<path d="M381.719,394.609L213.471,154.825c-1.779-2.536-2.465-5.622-1.926-8.689c0.537-3.068,2.23-5.737,4.768-7.517
	c1.961-1.376,4.26-2.104,6.65-2.104c3.811,0,7.383,1.849,9.555,4.944c8.416,11.996,22.199,19.158,36.867,19.157
	c9.275,0,18.203-2.824,25.816-8.166c9.84-6.904,16.402-17.227,18.479-29.066c2.076-11.84-0.584-23.779-7.488-33.618
	C287.199,62.7,256.049,46.54,222.863,46.54c-20.943,0-41.086,6.365-58.246,18.407c-22.191,15.57-36.996,38.887-41.689,65.654
	c-4.691,26.768,1.299,53.73,16.871,75.921l168.246,239.783c8.416,11.995,22.197,19.156,36.865,19.156
	c9.275,0,18.203-2.824,25.816-8.167C391.039,443.042,395.971,414.922,381.719,394.609z M246.039,323.116l69.65,12.211
	l29.705,42.334l-69.65-12.211L246.039,323.116z M299.443,312.174l-69.648-12.211l-29.705-42.335l69.648,12.211L299.443,312.174z
	M142.627,134.054c1.051-5.988,2.752-11.75,5.014-17.233c6.172,6.724,15.881,13.314,30.986,18.537
	c4.859,1.68,9.639,2.999,13.98,4.029c-0.309,1.078-0.566,2.176-0.764,3.296c-1.459,8.33,0.406,16.722,5.256,23.631l10.445,14.886
	l-63.189-11.078C141.121,158.537,140.486,146.272,142.627,134.054z M289.82,101.255c3.836,5.466,5.313,12.099,4.16,18.676
	c-1.154,6.577-4.801,12.312-10.268,16.148c-4.23,2.969-9.186,4.538-14.328,4.538c-8.156,0-15.818-3.978-20.494-10.645
	c-4.271-6.084-10.516-10.385-17.539-12.313c0.996-11.943,6.24-33.908,30.717-41.139C272.965,82.45,282.516,90.845,289.82,101.255z
	M176.105,81.319c13.777-9.668,29.947-14.779,46.758-14.779c4.367,0,8.689,0.354,12.934,1.032
	c-11.025,8.465-17.018,19.499-20.27,28.916c-2.924,8.462-3.941,16.523-4.25,22.269c-1.957,0.781-3.832,1.78-5.621,2.954
	c-15.443-2.709-40.998-9.987-46.975-23.889C163.58,91.566,169.426,86.005,176.105,81.319z M154.258,192.162l69.531,12.19
	l29.705,42.333l-69.65-12.211l-27.674-39.441C155.506,194.089,154.877,193.128,154.258,192.162z M359.24,440.921
	c-4.232,2.969-9.188,4.539-14.33,4.539c-8.156,0-15.818-3.979-20.494-10.644l-32.428-46.213l69.652,12.211l3.705,5.282
	C373.264,417.381,370.525,433.003,359.24,440.921z"/>
	</svg>
	</div>
	</div>
	<div class="row">
	<div class="box">
	<svg width="100%" height="100%" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
	<path d="M451.949,307.714l-58.997,15.809l-22.876-13.207l39.68-10.633c5.335-1.43,8.501-6.913,7.071-12.247
	c-1.429-5.334-6.915-8.503-12.247-7.071l-58.999,15.809l-24.615-14.211c3.222-8.034,5.014-16.79,5.014-25.962
	c0-9.171-1.791-17.927-5.014-25.96l24.617-14.213l58.999,15.808c0.867,0.232,1.737,0.344,2.594,0.344
	c4.415-0.001,8.456-2.947,9.653-7.415c1.43-5.335-1.736-10.818-7.071-12.247l-39.68-10.632l22.875-13.207l58.997,15.808
	c0.867,0.232,1.737,0.344,2.594,0.344c4.415-0.001,8.456-2.947,9.653-7.415c1.43-5.334-1.736-10.817-7.071-12.247l-39.679-10.632
	l30.437-17.572c4.783-2.762,6.422-8.877,3.66-13.66c-2.761-4.781-8.877-6.422-13.66-3.66l-30.437,17.573l10.631-39.679
	c1.43-5.335-1.736-10.818-7.071-12.247s-10.817,1.737-12.247,7.071l-15.807,58.996l-22.876,13.208l10.632-39.681
	c1.43-5.334-1.736-10.817-7.071-12.247c-5.338-1.43-10.817,1.736-12.247,7.071l-15.809,58.999l-24.642,14.227
	c-10.87-13.772-26.785-23.377-44.94-25.987v-28.414l43.189-43.19c3.905-3.905,3.905-10.237,0-14.143
	c-3.906-3.904-10.236-3.904-14.143,0L266,130.048v-26.412l43.189-43.19c3.905-3.905,3.905-10.237,0-14.143
	c-3.906-3.904-10.236-3.904-14.143,0L266,75.351V40.205c0-5.522-4.478-10-10-10s-10,4.478-10,10v35.146l-29.047-29.046
	c-3.906-3.904-10.236-3.904-14.143,0c-3.905,3.905-3.905,10.237,0,14.143L246,103.636v26.412l-29.047-29.046
	c-3.906-3.904-10.236-3.904-14.143,0c-3.905,3.905-3.905,10.237,0,14.143L246,158.333v28.414
	c-18.154,2.61-34.069,12.215-44.938,25.986l-24.644-14.228l-15.81-58.998c-1.43-5.336-6.916-8.502-12.247-7.071
	c-5.335,1.43-8.501,6.913-7.071,12.247l10.633,39.68l-22.875-13.206l-15.809-58.997c-1.43-5.336-6.915-8.503-12.247-7.071
	c-5.335,1.43-8.501,6.913-7.071,12.247l10.633,39.68l-30.438-17.573c-4.784-2.762-10.899-1.122-13.66,3.66
	c-2.762,4.783-1.123,10.898,3.66,13.66l30.437,17.573l-39.677,10.632c-5.335,1.43-8.501,6.913-7.071,12.247
	c1.197,4.469,5.237,7.415,9.653,7.415c0.856,0,1.728-0.111,2.594-0.344l58.996-15.809l22.876,13.207l-39.679,10.633
	c-5.335,1.43-8.501,6.913-7.071,12.247c1.197,4.469,5.237,7.415,9.653,7.415c0.856,0,1.728-0.111,2.594-0.344l58.998-15.809
	l24.616,14.212c-3.223,8.033-5.014,16.789-5.014,25.961c0,9.171,1.791,17.927,5.014,25.96l-24.617,14.213l-58.999-15.808
	c-5.336-1.429-10.817,1.737-12.247,7.071c-1.43,5.335,1.736,10.817,7.071,12.247l39.68,10.632l-22.876,13.207L60.05,307.715
	c-5.337-1.431-10.817,1.737-12.247,7.071c-1.43,5.335,1.736,10.817,7.071,12.247l39.679,10.632l-30.437,17.572
	c-4.783,2.762-6.422,8.877-3.66,13.66c1.853,3.208,5.213,5.002,8.67,5.002c1.696,0,3.416-0.433,4.99-1.342l30.438-17.573
	l-10.632,39.679c-1.43,5.334,1.736,10.817,7.071,12.247c0.867,0.232,1.737,0.344,2.594,0.344c4.415,0,8.456-2.947,9.653-7.415
	l15.808-58.996l22.876-13.208l-10.632,39.681c-1.43,5.335,1.736,10.817,7.071,12.247c0.867,0.232,1.737,0.344,2.594,0.344
	c4.415,0,8.456-2.947,9.653-7.415l15.808-58.998l24.643-14.228c10.869,13.772,26.784,23.377,44.939,25.987v28.413l-43.189,43.191
	c-3.905,3.905-3.905,10.237,0,14.143c1.953,1.952,4.512,2.929,7.071,2.929s5.118-0.977,7.071-2.929L246,381.951v26.414
	l-43.188,43.189c-3.905,3.905-3.905,10.237,0,14.143c1.953,1.952,4.512,2.929,7.071,2.929s5.118-0.977,7.071-2.929L246,436.65
	v35.145c0,5.522,4.478,10,10,10s10-4.478,10-10v-35.146l29.047,29.046c3.906,3.904,10.236,3.904,14.143,0
	c3.905-3.905,3.905-10.237,0-14.143L266,408.365v-26.414l29.048,29.047c3.906,3.904,10.236,3.904,14.143,0
	c3.905-3.905,3.905-10.237,0-14.143L266,353.666v-28.413c18.155-2.61,34.07-12.215,44.939-25.986l24.643,14.228l15.811,58.999
	c1.197,4.468,5.237,7.414,9.653,7.414c0.856-0.001,1.728-0.111,2.595-0.344c5.334-1.43,8.5-6.913,7.07-12.248l-10.633-39.679
	l22.875,13.207l15.809,58.996c1.197,4.469,5.237,7.415,9.653,7.415c0.856-0.001,1.728-0.111,2.594-0.344
	c5.335-1.43,8.501-6.913,7.071-12.247l-10.633-39.679l30.437,17.572c1.575,0.909,3.294,1.342,4.99,1.342
	c3.456,0,6.818-1.794,8.67-5.002c2.762-4.783,1.123-10.898-3.66-13.66l-30.437-17.572l39.678-10.633
	c5.335-1.43,8.501-6.913,7.071-12.247C462.767,309.45,457.283,306.283,451.949,307.714z M256,305.979
	c-27.559,0-49.979-22.42-49.979-49.979s22.42-49.979,49.979-49.979s49.979,22.42,49.979,49.979S283.559,305.979,256,305.979z"/>



	</svg>
	</div>
	<div class="box">
	<svg width="100%" height="100%" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
	<svg width="100%" height="100%" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
	<path d="M396.676,356.47c-28.269-25.442-49.445-47.649-68.104-71.618h29.546c4.141,0,7.853-2.552,9.336-6.417
	s0.432-8.246-2.646-11.016c-24.529-22.076-58.057-60.418-62.611-69.2h42.578c4.141,0,7.853-2.552,9.336-6.417
	s0.432-8.246-2.646-11.016c-29.489-26.541-49.67-52.252-71.525-90.473l-1.979-11.538l12.652-12.333
	c1.749-1.705,2.378-4.254,1.623-6.577c-0.754-2.323-2.762-4.015-5.179-4.367l-17.485-2.541l-7.818-15.843
	c-1.081-2.19-3.312-3.577-5.754-3.577s-4.673,1.387-5.754,3.577l-7.818,15.843l-17.485,2.541c-2.417,0.352-4.425,2.044-5.179,4.367
	c-0.755,2.322-0.126,4.872,1.623,6.577l12.652,12.333l-1.995,11.632c-22.195,38.93-41.661,63.521-71.504,90.379
	c-3.078,2.77-4.13,7.15-2.646,11.016s5.195,6.417,9.336,6.417h42.58c-16.952,24.295-36.003,45.251-62.613,69.2
	c-3.078,2.77-4.13,7.15-2.646,11.016s5.195,6.417,9.336,6.417h29.546c-0.215,0.275-0.427,0.552-0.642,0.826
	c-0.091,0.107-0.174,0.219-0.259,0.329c-18.439,23.53-39.39,45.429-67.204,70.463c-3.078,2.77-4.13,7.149-2.646,11.015
	s5.195,6.417,9.336,6.417H246v98.145c0,5.523,4.478,10,10,10s10-4.477,10-10v-98.145h71.662c0.006,0,0.012,0.001,0.018,0.001
	c0.007,0,0.014-0.001,0.021-0.001h52.286c4.141,0,7.853-2.552,9.336-6.417S399.754,359.239,396.676,356.47z M247.608,65.17
	c2.09-0.303,3.896-1.616,4.831-3.51l3.558-7.209l3.558,7.209c0.935,1.894,2.741,3.207,4.831,3.51l7.958,1.157l-5.758,5.613
	c-1.512,1.474-2.202,3.598-1.845,5.679l1.346,7.85c-0.022,0.011-7.104-3.667-7.104-3.667c-0.935-0.491-1.96-0.737-2.985-0.737
	s-2.051,0.246-2.985,0.737c0,0-7.029,3.582-7.085,3.553l1.326-7.735c0.357-2.082-0.333-4.206-1.845-5.679l-5.758-5.613
	L247.608,65.17z M250.838,97.442l5.159-2.712l5.071,2.666c0,0,20.932,39.979,40.527,60.58
	c-39.994-6.267-59.025-27.436-65.211-35.977C244.313,110.875,250.838,97.442,250.838,97.442z M192.141,178.219
	c11.941-12.209,22.471-24.776,32.555-38.886c11.275,13.017,35.063,33.212,77.125,38.886h-18.242h-55.154H192.141z M233.903,198.219
	h44.195c1.971,3.044,3.958,6.029,5.972,8.966c-10.768,7.769-35.54,22.14-77.359,27.991
	C216.54,223.431,225.384,211.378,233.903,198.219z M179.165,264.852c2.606-2.558,5.132-5.098,7.597-7.631
	c59.465-3.479,94.047-22.88,109.082-33.818c10.893,14.179,22.85,27.567,36.991,41.449h-24.177H203.342H179.165z M147.5,353.902
	c16.501-15.817,30.529-30.802,43.282-46.251c20.534,21.506,46.688,36.25,71.171,46.251H147.5z M338.283,353.902
	c-7.192-0.926-89.601-12.55-134.964-62.129c1.729-2.289,3.446-4.591,5.144-6.922h95.074c17.479,24.008,36.512,45.613,60.963,69.051
	H338.283z"/>
	</svg>
	</div>
	<div class="box">
	<svg width="100%" height="100%" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
	<g>
	<path d="M294.92,131.832c31.797,12.01,57.282,37.002,69.92,68.569c1.564,3.909,5.318,6.286,9.286,6.286
	c1.237,0,2.495-0.231,3.714-0.719c5.127-2.053,7.619-7.873,5.566-13c-14.716-36.758-44.392-65.86-81.42-79.846
	c-5.167-1.951-10.937,0.656-12.888,5.822C287.146,124.11,289.753,129.881,294.92,131.832z"/>
	<path d="M444.272,435.927l-49.678-72.809c-0.311-0.455-0.666-0.867-1.04-1.259c28.941-33.167,44.729-75.134,44.729-119.611
	c0-100.512-81.772-182.284-182.284-182.284S73.716,141.737,73.716,242.249c0,44.477,15.788,86.444,44.729,119.611
	c-0.374,0.392-0.729,0.804-1.04,1.259l-50,73.281c-2.089,3.063-2.313,7.029-0.581,10.308c1.731,3.278,5.135,5.329,8.842,5.329
	h360.668c0.006,0,0.014,0,0.02,0c5.523,0,10-4.477,10-10C446.354,439.735,445.577,437.617,444.272,435.927z M256,79.964
	c89.483,0,162.284,72.8,162.284,162.284c0,42.395-16.113,82.231-45.461,112.631H266v-31.671h74.248
	c4.104,0,7.792-2.508,9.301-6.325c1.508-3.817,0.53-8.168-2.466-10.974c-15.539-14.551-27.627-27.466-38.235-40.965h11.361
	c4.104,0,7.792-2.508,9.301-6.325c1.508-3.817,0.53-8.169-2.466-10.974c-14.633-13.702-25.575-25.885-35.191-39.383h19.966
	c4.104,0,7.792-2.508,9.3-6.325c1.509-3.817,0.531-8.168-2.464-10.974c-19.708-18.458-40.625-45.29-53.478-68.571
	c-0.854-1.977-2.352-3.693-4.389-4.804c-4.849-2.644-10.923-0.858-13.567,3.992c-12.815,23.499-33.962,50.733-53.875,69.383
	c-2.995,2.806-3.973,7.157-2.464,10.974c1.508,3.817,5.195,6.325,9.3,6.325h19.965c-9.614,13.496-20.558,25.679-35.191,39.384
	c-2.995,2.805-3.973,7.157-2.465,10.974c1.509,3.817,5.196,6.325,9.301,6.325h11.36c-10.607,13.499-22.694,26.413-38.234,40.965
	c-2.996,2.806-3.974,7.157-2.466,10.974c1.509,3.817,5.196,6.325,9.301,6.325H246v31.671H139.177
	c-29.348-30.399-45.461-70.236-45.461-112.631C93.716,152.765,166.517,79.964,256,79.964z M273.34,188.261h-34.68h-14.801
	c11.728-13.096,22.919-27.805,32.134-42.271c9.198,14.367,20.488,29.18,32.184,42.271H273.34z M267.767,208.261
	c8.373,13.243,17.279,24.839,28.283,36.683h-6.94h-66.221h-6.939c11.006-11.845,19.911-23.44,28.284-36.683H267.767z
	M283.889,264.943c9.402,13.27,19.547,25.468,31.899,38.265H196.212c12.352-12.796,22.498-24.997,31.898-38.265H283.889z
	M94.595,432.036l36.354-53.281h250.102l36.354,53.281H94.595z"/>
	</g>
	</svg>
	</div>
	</div>
	* { box-sizing: border-box; }
	html, body {
	margin:0; padding: 0;
	height: 100%; width: 100%;
	}

	.row {
	clear: both;
	width: 100%;
	height: 50%;
	}

	.box {
	height: 100%;
	width: 33.3332%;
	float: left;

	@media screen and ( max-width: 680px ) {
	width: 100%;
	}

	}

	.row:nth-of-type(odd){
	.box{
	&:nth-of-type(1){
	background: #F5624D;
	}
	&:nth-of-type(2){
	background: #34A65F;
	}
	&:nth-of-type(3){
	background: #235E6F;
	}
	}
	}

	.row:nth-of-type(even){
	.box {
	&:nth-of-type(1){
	background: #34A7C7;
	}
	&:nth-of-type(2){
	background: #CC231E;
	}
	&:nth-of-type(3){
	background: #0F8A5F;
	}
	}
	}