#Container{width:100%; padding:0px; margin:0px;}

.controls { width: 695px; margin: 0px auto 20px; color: #eee; }

label { font-weight: 300; margin: 0 .4em 0 0; }

button { display: inline-block; border: solid 2px #d6d6d6; cursor: pointer; padding: 5px 13px; background: none; margin: 0px 8px; font-size: 17px; color: #4d4d4d; font-family: 'futura_bk_btbook'; }

button.active { background: #3d58a0; border: solid 2px #3d58a0; font-size: 17px; color: #fff; font-family: 'futura_bk_btbook'; }

button:focus { outline: 0 none; }

button + label { margin-left: 1em; }

.container .mix,

.container .gap { display: inline-block; width: 33%; padding:10px 10px 15px 10px }

.container .mix { text-align: left; margin: 0px; display: none; position:relative;}

.container .mix:after { color: white; font-size: 16px; display: inline-block; vertical-align: top; padding: 0px; font-weight: 700; }

.container .mix:before { content: ''; display: inline-block; }

 

@media only screen and (max-width:767px) {

.container .mix,

.container .gap {width: 49%; }

.controls { width: 650px;}

}

@media only screen and (max-width:640px) {

.controls { width: 100%;}	

button{margin: 5px 8px;}

}

