@charset "UTF-8";
/* CSS Document */
.grid {
	padding:10px;
}
.grid-sizer {width:100%;}
.grid-item {
  float: left;
   min-height:100px; min-width:120px; width:100%; height:auto;
   text-align: left;
font-size:0px;
margin-top:10px;
}
.grid-item-left {
  float: left;
   min-width:300px; width:40%; max-width:500px;
   text-align: left;
border:6px solid #ffffff;
}
.grid-item-right {
  float: left;
   min-height:100px; min-width:120px; width:57%; 
   text-align: left;
}
.gridcontent {
	padding:20px 10px 10px 40px;
	font-size:12px;
   	color:#333;
	}
.grid-item-left img {width:100%;  }
.grid-item-left img:hover {opacity:.7;}
	
grid-item a{text-decoration:none; color:#222;}
grid-item a:hover{color:#0451c5;}

.button {
  display: inline-block;
  padding: 6px 14px;
  margin-bottom: 10px;
  background: none;
  border: none;
  border-radius: 7px;
  color: #222;
  font-family: sans-serif;
  font-size: 14px;
  text-shadow: 0 1px white;
  cursor: pointer;
}

.button:hover {
  background-color: transparent;
  color: #6295e2;
}

.button:active,
.button.is-checked {
  background-color: transparent;
}

.button.is-checked {
  color: #0451c5;
}

.button:active {
}

/* ---- button-group ---- */

.button-group:after {
  content: '';
  display: block;
  clear: both;
}

.button-group .button {
  float: left;
  border-radius: 0;
  margin-left: 0;
  margin-right: 1px;
  border-radius: 3px;
}

/*
.button-group .button:first-child { border-radius: 0.5em 0 0 0.5em; }
.button-group .button:last-child { border-radius: 0 0.5em 0.5em 0; }
*/
@media (max-width: 1200px) {
}
@media (max-width: 900px) {
}
@media (max-width: 780px) {
	.grid-item-left {
  float: left;
   width:100%;
   text-align: left;
border:6px solid #ffffff;
}
.grid-item-right {
  float: left;
   min-height:100px; min-width:120px; width:100%; 
   text-align: left;
}
@media (max-width: 500px) {
	.gridcontent {
	padding:20px 10px 10px 10px;
	}
}