/* ------ */
/* Layout */
/* ------ */

.PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container
{
    margin-left  : -7.5px;
    margin-right : -7.5px;
}

.PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > [class^="linha"]:last-child
{
    margin-bottom : 15px;
}

.PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > [class^="linha"] > .LinhaContent
{
    padding : 15px 25px 0px 25px;
}

@media screen and ( min-width: 640px)
{
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > [class^="linha"] { margin-left : calc( 1 * ( 100% / 2) + 15px); }
    
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha1
    {
        box-sizing : content-box;

        width: calc( ( ( 100% - ( 1 * 15px)) / 2));
        float: left;

        margin-left : 0px;
        border-right: 15px solid white;
    }

    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha1 > .LinhaContent
    {
        position  : relative;
        top       : 50%;
        transform : translateY(-50%);
        padding   : 10px;
    }
}
@media screen and ( min-width: 768px)
{
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > [class^="linha"] { margin-left : calc( 2 * ( 100% / 3) + 15px); }
    
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha1,
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha2
    {
        box-sizing : content-box;

        width: calc( ( ( 100% - ( 2 * 15px)) / 3));
        float: left;

        margin-left : 0px;
        border-right: 15px solid white;
    }

    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha1 > .LinhaContent,
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha2 > .LinhaContent
    {
        position  : relative;
        top       : 50%;
        transform : translateY( -50%);
        padding   : 10px;
    }
}
@media screen and ( min-width: 992px)
{
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > [class^="linha"] { margin-left : calc( 3 * ( 100% / 4) + 15px); }
    
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha1,
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha2,
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha3
    {
        box-sizing : content-box;

        width: calc( ( ( 100% - (3 * 15px)) / 4));
        float: left;

        margin-left : 0px;
        border-right: 15px solid white;
    }

    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha1 > .LinhaContent,
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha2 > .LinhaContent,
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha3 > .LinhaContent
    {
        position  : relative;
        top       : 50%;
        transform : translateY( -50%);
        padding   : 10px;
    }
}
@media screen and ( min-width: 1200px)
{
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > [class^="linha"] { margin-left : calc( 4 * (100% / 5) + 15px); }
    
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha1,
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha2,
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha3,
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha4
    {
        box-sizing : content-box;

        width: calc( ( ( 100% - ( 4 * 15px)) / 5));
        float: left;

        margin-left : 0px;
        border-right: 15px solid white;
    }

    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha1 > .LinhaContent,
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha2 > .LinhaContent,
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha3 > .LinhaContent,
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > .linha4 > .LinhaContent
    {
        position  : relative;
        top       : 50%;
        transform : translateY( -50%);
        padding   : 10px;
    }
}

/* ----- */
/* Style */
/* ----- */

.PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container
{
    background-color : rgba( 64, 64, 64, 0.2);
}

.PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > [class^="linha"]
{
    font-family : Lato-Bold;
    font-size   : 12pt;
    font-weight : normal;
    line-height : 12pt;
    color       : rgba( 64, 64, 64, 1);
    text-align  : left;
}
.PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > [class^="linha"] a
{
    color           : rgba( 64, 64, 64, 1);
    cursor          : pointer;
}
.PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > [class^="linha"] a:active,
.PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > [class^="linha"] a:hover,
.PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > [class^="linha"] a:visited
{
    text-decoration : none;
}
.PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container > [class^="linha"] a:focus
{
    text-decoration : none;
    outline         : none;
}

@media screen and ( min-width: 640px)
{
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha1 { background-color : none; background-image : url('../images/01-exp.jpg'); background-size : cover; background-position : center; color : white; text-align : center;}

    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha1 a { line-height: 26pt; font-size : 16pt; color : white; }
}
@media screen and ( min-width: 768px)
{
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha1 { background-color : none; background-image : url('../images/01-exp.jpg'); background-size : cover; background-position : center; color : white; text-align : center; }
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha2 { background-color : none; background-image : url('../images/08-exp.jpg'); background-size : cover; background-position : center; color : white; text-align : center; }
    
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha1 a { line-height: 26pt; font-size : 16pt; color : white; }
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha2 a { line-height: 26pt; font-size : 16pt; color : white; }
}
@media screen and ( min-width: 992px)
{
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha1 { background-color : none; background-image : url('../images/01-exp.jpg'); background-size : cover; background-position : center; color : white; text-align : center; }
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha2 { background-color : none; background-image : url('../images/08-exp.jpg'); background-size : cover; background-position : center; color : white; text-align : center; }
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha3 { background-color : none; background-image : url('../images/03-exp.jpg'); background-size : cover; background-position : center; color : white; text-align : center; opacity: 0.6;}
    
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha1 a { line-height: 26pt; font-size : 16pt; color : white; }
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha2 a { line-height: 26pt; font-size : 16pt; color : white; }
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha3 a { line-height: 26pt; font-size : 16pt; color : white; }
}
@media screen and ( min-width: 1200px)
{
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha1 { background-color : none; background-image : url('../images/01-exp.jpg'); background-size : cover; background-position : center; color : white; text-align : center; }
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha2 { background-color : none; background-image : url('../images/08-exp.jpg'); background-size : cover; background-position : center; color : white; text-align : center; }
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha3 { background-color : none; background-image : url('../images/03-exp.jpg'); background-size : cover; background-position : center; color : white; text-align : center; opacity: 0.6;}
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha4 { background-color : none; background-image : url('../images/04-exp.jpg'); background-size : cover; background-position : center; color : white; text-align : center; }

    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha1 a { line-height: 26pt; font-size : 16pt; color : white; }
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha2 a { line-height: 26pt; font-size : 16pt; color : white; }
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha3 a { line-height: 26pt; font-size : 16pt; color : white; }
    .PA-WebPartContentWrapper .DisplayControlContentWrapper .SetControlContentWrapper > .info-container .linha4 a { line-height: 26pt; font-size : 16pt; color : white; }
}