@import 'mixins';
@import 'variables';

#teams-teams-page {
    .invitations {
        .pure-button {
            background:$color-2;
            color:#fff;
            width:48%;
            padding:8px;
        }
    }
    .team,
    .new-team {
        display:block;
        text-decoration:none;
        border:1px solid #ccc;
        border-radius:3px;
        padding:10px;
        color:#333;
        margin-right:20px;
        margin-bottom:20px;
        text-align:center;
        &:hover {
            border-color:rgba($color-2, 0.5);
            .img {
                border-color:rgba($color-2, 0.5);
            }
        }
        .img {
            border:1px solid #ccc;
            border-radius:2px;
            background:#fff;
            width:100%;
            height: 180px;
            margin-bottom:10px;
            background-size:contain;
            background-repeat:no-repeat;
            background-position:center;
        }

        h3 {
            font-weight:$bold;
            @include font-size(14, 16);
            margin-bottom:5px;
            vertical-align:middle;
        }
    }
    .team {
        h3 {
            margin-bottom:8px;
        }
        .members {
            color:#aaa;
            @include font-size(12,12);
            i {
                @include font-size(10,12);
            }
            .text {
                display:inline-block;
                font-weight:$regular;
            }
        }
    }
    .new-team {
        h3 {
            margin:0px;
            line-height:36px;
        }
        .img {
            i {
                @include font-size(30, 180);
                color:#666;
            }
        }
    }
}
