$turquoise: #08d58f; $faint_grey: #EEEEEE; $light_grey: #DDDDDD; $mid_grey: #AAAAAA; $dark_grey: #333333; $secondary_grey: #888888; $red: #cf2d2d; $green: #47af2a; $blue: #32b5f2; @mixin one_line_text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } @mixin clearfix { &::after { content: ''; clear: both; display: block; } } @mixin animate( $duration: 0.2s, $easing: ease-in-out ){ -webkit-transition: all $duration $easing; -moz-transition: all $duration $easing; -o-transition: all $duration $easing; transition: all $duration $easing; } @keyframes fill_from_left { from { width: 0%; } to { width: 100%; } } @mixin animate_timeout( $duration: 0.2s ){ animation-name: fill_from_left; animation-duration: $duration; animation-timing-function: linear; } @mixin blur( $size: 10px ) { -webkit-filter: blur( $size ); filter: blur( $size ); } @mixin responsive( $width ){ @media (max-width: $width){ @content; } }