| ... | ... | @@ -43,37 +43,23 @@ article { | 
| 43 | 43 | font-size: 2.0em; font-style: italic; | 
| 44 | 44 | line-height: 1.3em; | 
| 45 | 45 | } | 
| 46 | -  img { | |
| 46 | +  img, video, .flash-video { | |
| 47 | 47 | max-width: 100%; | 
| 48 | + height: auto; | |
| 48 | 49 | border: .5em solid #fff; | 
| 49 | 50 | @include border-radius(.3em); | 
| 50 | 51 | @include box-shadow(rgba(#000, .15) 0 1px 4px); | 
| 51 | 52 | @include box-sizing(border-box); | 
| 52 | 53 | display: block; | 
| 53 | 54 | margin: 0 auto 1.5em; | 
| 54 | -    &.left { | |
| 55 | - float: left; | |
| 56 | - margin-right: 1.5em; | |
| 57 | - } | |
| 58 | -    &.right { | |
| 59 | - float: right; | |
| 60 | - margin-left: 1.5em; | |
| 61 | - } | |
| 62 | -    &.left, &.right { | |
| 63 | - margin-bottom: .8em; | |
| 64 | - } | |
| 65 | 55 | } | 
| 66 | -  img, video { max-width: 100%; height: auto; } | |
| 67 | -  video { | |
| 68 | - width: 100%; display: block; margin-bottom: 1.5em; | |
| 69 | - padding: .8em; background: #fff; border: 1px solid #eee; | |
| 70 | - @include box-sizing(border-box); | |
| 56 | +  img { | |
| 57 | +    &.left { float: left; margin-right: 1.5em; } | |
| 58 | +    &.right { float: right; margin-left: 1.5em; } | |
| 59 | +    &.left, &.right { margin-bottom: .8em; } | |
| 71 | 60 | } | 
| 61 | +  video { display: block; margin-bottom: 1.5em; width: 100%; } | |
| 72 | 62 |    .flash-video { | 
| 73 | - max-width: 100%; | |
| 74 | - margin-bottom: 1.5em; | |
| 75 | - @include box-sizing(border-box); | |
| 76 | - padding: .8em; background: #fff; border: 1px solid #eee; | |
| 77 | 63 |      > div { | 
| 78 | 64 | position: relative; | 
| 79 | 65 | display: block; |