/*
SCSS variables and mixins
*/
/*
Some styles to make this demo look pretty (or at least decent)
If you want to style everything yourself, you shouldn't need these
*/
.tabbed-content{max-width:360px;padding:0;display:none;margin:1em auto}.tabs ul{margin:0;text-align:center}.item.active .item-content{padding:1em;-webkit-transition:opacity .3s ease-in-out;-moz-transition:opacity .3s ease-in-out;-o-transition:opacity .3s ease-in-out;-ms-transition:opacity .3s ease-in-out;transition:opacity .3s ease-in-out}.tabbed-content .item::before{content:attr(data-title)}.tabbed-content .item .item-content{opacity:0;visibility:hidden;height:0}.tabbed-content .item.active .item-content{opacity:1;visibility:visible;height:auto}@media all and (min-width:800px){.item.active .item-content{padding:0}.tabs-side .tabs li{margin-bottom:2px}.tabbed-content .tabs,.tabbed-content.tabs-side .tabs li{display:block}.tabbed-content .item{min-height:0}.tabbed-content .item::before{display:none}.tabbed-content.tabs-side .tabs{width:150px;float:left}.tabbed-content.tabs-side .item{margin-left:150px}}@media screen and (max-width:480px){.tabbed-content{display:block}}@media screen and (min-width:481px) and (max-width:600px){.tabbed-content{display:block}}@media screen and (min-width:601px) and (max-width:767px){.tabbed-content{display:block}}