$blauClar: #cce3ec;
$blauFosc: #69bcc9;
#nushu{
    .capcalera{
        background:$blauClar;position:relative;margin:52px auto 0 auto;
        .logos{
            @media screen and (max-width: 600px) {
                padding:0 10px;
            }
        }
        .container {
            background:none;
            display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
            display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
            display: -ms-flexbox;      /* TWEENER - IE 10 */
            display: -webkit-flex;     /* NEW - Chrome */
            display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
            @media screen and (max-width: 987px) {
                width:100%;padding:0;
            }
            @media screen and (max-width: 900px) {
                display:block;
            }
            @media screen and (max-width: 600px) {
                display:inline-block;
            }
            div{
                -webkit-box-flex: 1;      /* OLD - iOS 6-, Safari 3.1-6 */
                -moz-box-flex: 1;         /* OLD - Firefox 19- */
                -webkit-flex: 1;          /* Chrome */
                -ms-flex: 1;              /* IE 10 */
                flex: 1;                  /* NEW, Spec - Opera 12.1, Firefox 20+ */
                @media screen and (max-width: 900px) {
                    display:block;
                }
                &.column-left{
                    .criatures{margin-top:35px;margin-bottom: 12px;}
                    .nushu{
                        margin-bottom: 25px;
                        @media screen and (max-width: 900px) {
                            position: relative;display:block;max-width:100%
                        }
                    }
                    .ext{
                        display:none;
                        @media screen and (max-width: 900px) {
                            display:block;position:absolute;height:126px;top: 20px;left: 370px;
                        }
                        @media screen and (max-width: 700px) {
                            left: 220px;
                        }
                        @media screen and (max-width: 400px) {
                            right:-15px;left:auto;height:120px;
                        }
                    }
                }
                &.column-center{
                    .ext{
                        position:absolute;margin-left:100px;
                        @media screen and (max-width: 900px) {
                            display:none;
                        }
                    }
                }
                &.column-right{                
                    .generalitat{
                        float:right;margin-top:80px;
                        @media screen and (max-width: 900px) {
                            margin-top:-90px;
                        }
                        @media screen and (max-width: 600px) {
                            width:100%;margin-top:0;margin-bottom:10px;
                        }
                        .e7{
                            color:#999;margin:0 0 7px 0;
                            @media screen and (max-width: 600px) {
                                float:left;padding:13px 10px 13px 0;
                            }
                        }
                    }
                }
            }
        }
        .submenu{
            background:$blauFosc;height:35px;width: 100%;bottom: 0;
            .container{
                margin:0 auto;display:block;
                @media screen and (max-width: 600px) {
                    padding:0;
                }
                .nav-left,
                .nav-right{
                    margin:0;
                    padding:0;list-style:none;
                    @media screen and (max-width: 600px) {
                        display:none;
                    }
                    li{
                        float:left;
                        &.first{
                            a{border-right:2px solid $blauFosc}
                        }
                        a{
                            text-decoration: none;display:block;background:$blauClar;color:$blauFosc;height:35px;line-height:35px;padding:0 10px;
                            &.disable{text-decoration:line-through;cursor: text}
                        }
                    }
                }
                .nav-left{float:left}
                .nav-right{
                    float:right;
                    @media screen and (max-width: 600px) {
                        float:none;
                    }
                }
                .nav-mobile{
                    display: none;
                    @media screen and (max-width: 600px) {
                        display:block;margin:0;padding:0;list-style:none;
                    }
                    li{
                        float:right;
                        &.icon{
                            float:left;
                            a{
                                border-right:2px solid $blauClar;
                                .icon{
                                    &:before{line-height:35px;font-size:14px}
                                }
                            }
                        }
                        a{
                            text-decoration: none;display:block;color:$blauClar;height:35px;line-height:35px;padding:0 10px;
                            &.disable{text-decoration:line-through;cursor: text}
                        }
                    }
                }
            }
        }
    }
    .container{
        margin:35px auto 0 auto;
        .header{
            .title{padding-top:0}
        }
    }
    .contingut{
        .usuari{
            display: block;
            .capcalera{
                margin:0;
                p{text-align: right}
            }
            .col{
                width:33%;float:left;
                @media screen and (max-width: 600px) {
                    width:100%;
                }
                &.final{
                    width:34%;
                    @media screen and (max-width: 600px) {
                        width:100%;
                    }
                }
                #nom,
                #email{
                    width:99%;
                    @media screen and (max-width: 600px) {
                        width:100%;
                    }
                }
            }
            .queden{margin-top:-20px;}
        }
        ul{
            &.respostes{
                iframe{
                    height:420px;margin-bottom:15px;
                    @media screen and (max-width: 900px) {
                        height:350px;
                    }
                    @media screen and (max-width: 600px) {
                        height:300px;
                    }
                }
                li{
                    p{
                        img{
                            width:100%;height:auto;max-width:100%;max-height:100%;margin:0 20px 15px 0;
                            &.big{
                                width:100%;height:auto;max-width:100%;max-height:100%;
                            }
                        }
                    }
                }
            }
        }
    }
}