.transfer-project-wrapper { flex-basis: 500px; flex-grow: 0; width: 90%; } .transfer-project { align-content: center; align-items: center; background: url('../images/discover.png') bottom center repeat-x; display: flex; height: calc(100vh - 40px); justify-content: center; min-height: calc(100vh - 40px); .transfer-title { @include font-type(light); } &-detail { align-items: center; border-bottom: 1px solid $whitish; border-top: 1px solid $whitish; display: flex; flex-direction: row; justify-content: center; margin: 1rem 0 3rem; padding: 1rem 0; } &-image { margin-right: 1rem; width: 4rem; } &-title { @include font-type(light); @include font-size(larger); margin-bottom: .25rem; } &-statistics { span { color: $gray-light; margin-right: .5rem; } svg { fill: $gray-light; margin-right: .25rem; } } &-private { text-transform: uppercase; } &-comment-link { color: $primary; cursor: pointer; display: block; margin-bottom: 1rem; &:hover { color: $primary-light; } } &-comment-header { display: flex; justify-content: space-between; .icon-close { cursor: pointer; fill: $gray-light; &:hover { fill: $red-light; transition: fill .2s; } } } &-comment-form { &.ng-enter { animation: dropdownFade .2s; } } &-comment-label { display: block; margin-bottom: .5rem; } &-comment { margin-bottom: 1rem; min-height: 6rem; } &-options { display: flex; a { @include font-size(large); display: block; flex: 1; padding: .75rem; &:first-child { margin-right: .5rem; } } } }