Generated by SassMeister.com.
.border-radius {
-webkit-border-raius: 5px;
-moz-border-raius: 5px;
-ms-border-raius: 5px;
-o-border-raius: 5px;
border-raius: 5px;
}
.icon-error, .icon-info {
transition: background-color ease .2s;
margin: 0 .5em;
}
.icon-error {
color: red;
}
.icon-info {
color: blue;
}
.content {
width: 960px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.content {
width: 720px;
}
}
@media only screen and (max-width: 767px) {
.content {
width: 90%;
}
}
// ----
// Sass (v3.3.5)
// Compass (v1.0.0.alpha.18)
// ----
// Mixin @each vendor
@mixin vendor($prop, $args) {
@each $vendor in webkit, moz, ms, o {
-#{$vendor}-#{$prop}: $args;
}
#{$prop}: $args;
}
.border-radius {
@include vendor(border-raius,5px);
}
//////////////////////////////////////////
%icon {
transition: background-color ease .2s;
margin: 0 .5em;
}
.icon-error {
@extend %icon;
color: red;
}
.icon-info {
@extend %icon;
color: blue;
}
//////////////////////////////////////////
@mixin media($type) {
@if $type == tablet {
@media only screen and (min-width:768px) and (max-width:991px) {
@content;
}
}
@else if $type == mobile {
@media only screen and (max-width:767px) {
@content;
}
}
}
.content {
width: 960px;
@include media(tablet) {
width: 720px;
}
@include media(mobile) {
width: 90%;
}
}