/* =================================================
        Responsive CSS for SSFP Publications.
================================================= */

.line-left-* {
    border-left: none;
    padding-left: unset;
}

.line-left-xs {
    border-left: 1px solid black;
    padding-left: 10px;
    
}

@media (min-width: 768px) { /* SM */
    .line-left-sm {
        border-left: 1px solid black;
        padding-left: 10px;
    }
}

@media (min-width: 992px) { /* MD */
    .line-left-md {
        border-left: 1px solid black;
        padding-left: 10px;
    }
}

@media (min-width: 1200px) { /* LG */
    .line-left-lg {
        border-left: 1px solid black;
        padding-left: 10px;
    }
}

.line-right-* {
    border-right: none;
    padding-right: unset;
}

.line-right-xs {
    border-right: 1px solid black;
    padding-right: 10px;
}

@media (min-width: 768px) { /* SM */
    .line-right-sm {
        border-right: 1px solid black;
        padding-right: 10px;
         
    }
}

@media (min-width: 992px) { /* MD */
    .line-right-md {
        border-right: 1px solid black;
        padding-right: 10px;
         
    }
}

@media (min-width: 1200px) { /* LG */
    .line-right-lg {
        border-right: 1px solid black;
        padding-right: 10px;
         
    }
}

.line-bottom-* {
    border-bottom: none;
    padding-bottom: unset;
}

.line-bottom-xs {
    border-bottom: 1px solid black;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

@media (min-width: 768px) { /* SM */
    .line-bottom-sm {
        border-bottom: 1px solid black;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }
}

@media (min-width: 992px) { /* MD */
    .line-bottom-md {
        border-bottom: 1px solid black;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }
}

@media (min-width: 1200px) { /* LG */
    .line-bottom-lg {
        border-bottom: 1px solid black;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }
}

.line-top-* {
    border-top: none;
    padding-top: unset;
}

.line-top-xs {
    border-top: 1px solid black;
    padding-top: 10px;
}

@media (min-width: 768px) { /* SM */
    .line-top-sm {
        border-top: 1px solid black;
        padding-top: 10px;
    }
}

@media (min-width: 992px) { /* MD */
    .line-top-md {
        border-top: 1px solid black;
        padding-top: 10px;
    }
}

@media (min-width: 1200px) { /* LG */
    .line-top-lg {
        border-top: 1px solid black;
        padding-top: 10px;
    }
}



/*=============== Images ======================== */

img.l-float-xs {
    float:left;
    margin-right: 10px;
}

img.r-float-xs {
    display: unset;
    float:right;
    margin-left: 10px;
}

img.center-xs {
    display: unset;
    display: block;
    margin: 0 auto;
}

@media (min-width: 600px) { /* SM2 */
    img.l-float-sm2 {
        display: unset;
        float:left;
        margin-right: 10px;
    }

    img.r-float-sm2 {
        display: unset;
        float:right;
        margin-left: 10px;
        
    }
    
    img.center-sm2 {
        display: block;
        margin: 0 auto;
        float:unset;
    }

}

@media (min-width: 768px) { /* SM */
    img.l-float-sm {
        display: unset;
        float:left;
        margin-right: 10px;
    }

    img.r-float-sm {
        display: unset;
        float:right;
        margin-left: 10px;
        
    }
    
    img.center-sm {
        display: block;
        margin: 0 auto;
        float:unset;
    }

}

@media (min-width: 992px) { /* MD */
    img.l-float-md {
        display: unset;
        float:left;
        margin-right: 10px;
    }

    img.r-float-md {
        display: unset;
        float:right;
        margin-left: 10px;
    }

    img.center-md {
        display: block;
        margin: 0 auto;
        float:unset;
    }

}

@media (min-width: 1200px) { /* LG */
    img.l-float-lg {
        display: unset;
        float:left;
        margin-right: 10px;
    }

    img.r-float-lg {
        display: unset;
        float:right;
        margin-left: 10px;
    }
    img.center-lg {
        display: block;
        margin: 0 auto;
        float:unset;
    }

}

/*=============== Image Size ======================== */

img.size-small-xs {
    width:200px;
    max-width: 100%;
}

img.size-med-xs {
    width:300px;
    max-width: 100%;
}

img.size-large-xs {
    width:400px;
    max-width: 100%;
}

img.size-xlarge-xs {
    width:500px;
    max-width: 100%;
}

img.size-2xlarge-xs {
    width:600px;
    max-width: 100%;
}


@media (min-width: 600px) { /* SM2 */
    img.size-small-sm2 {
        width:200px;
        max-width: 100%;
    }
    
    img.size-med-sm2 {
        width:300px;
        max-width: 100%;
    }
    
    img.size-large-sm2 {
        width:400px;
        max-width: 100%;
    }
    
    img.size-xlarge-sm2 {
        width:500px;
        max-width: 100%;
    }
    
    img.size-2xlarge-sm2 {
        width:600px;
        max-width: 100%;
    }
}

@media (min-width: 768px) { /* SM */
    img.size-small-sm {
        width:200px;
        max-width: 100%;
    }
    
    img.size-med-sm {
        width:300px;
        max-width: 100%;
    }
    
    img.size-large-sm {
        width:400px;
        max-width: 100%;
    }
    
    img.size-xlarge-sm {
        width:500px;
        max-width: 100%;
    }
    
    img.size-2xlarge-sm {
        width:600px;
        max-width: 100%;
    }
}

@media (min-width: 992px) { /* MD */
    img.size-small-md {
        width:200px;
        max-width: 100%;
    }
    
    img.size-med-md {
        width:300px;
        max-width: 100%;
    }
    
    img.size-large-md {
        width:400px;
        max-width: 100%;
    }
    
    img.size-xlarge-md {
        width:500px;
        max-width: 100%;
    }
    
    img.size-2xlarge-md {
        width:600px;
        max-width: 100%;
    }
}

@media (min-width: 1200px) { /* LG */
    img.size-small-lg {
        width:200px;
        max-width: 100%;
    }
    
    img.size-med-lg {
        width:300px;
        max-width: 100%;
    }
    
    img.size-large-lg {
        width:400px;
        max-width: 100%;
    }
    
    img.size-xlarge-lg {
        width:500px;
        max-width: 100%;
    }
    
    img.size-2xlarge-lg {
        width:600px;
        max-width: 100%;
    }
}

/* ============== Masthead Font ================*/

.masthead-font {
    font-family: impact, 'Anton', sans-serif;
    font-weight: normal;
    color:black;
}

.block-link.masthead-font {
    font-size: 150%;
}

.standard-masthead {
    font-size: 40px; /* For xs*/
    margin-top: 5px;
}
@media (min-width: 600px) {
    .standard-masthead {
        font-size: 50px;
        margin-top: 5px;
    }
}

@media (min-width: 768px) {
    .standard-masthead {
        font-size: 66px;
        margin-top: 5px;
    }
}

@media (min-width: 992px) {
    .standard-masthead {
        font-size: 88px;
        
    }
}

/* ==============  ================= */


div.dropdown-trigger{
    padding: 0px;
}

a.dropdown-trigger{
    display: inline-block;
    width: 100%;
    
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 15px;
    padding-right: 15px;
}

.block-link {
    display: inline-block;
    width: 100%;

    padding-top:6px;
    padding-bottom:6px;
    padding:11px;
    padding-right:11px;
    font-size: 120%;
}

a.block-link:hover {
    border-width: 1px; 
    border-style: solid;
    padding-top:5px;
    padding-bottom:5px;
    padding:10px;
    padding-right:10px;
}

.main-container {
    border-width: 1px; 
    border-style: solid;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
}

 /* ================== Publication Row ===================*/

.section-list-row{
    border-left: 1px solid;
    border-right: 1px solid; 
}

a.publication-link {
    font-size: 16px;
    border: 1px solid;
    padding: 5px;
    display: inline-block;
    width: 100%;
    height: 100%;
}

a.publication-link.collapsed {
    border-width: 1px;
    border-style: solid;
}

a.publication-link:hover {
    border: 1px solid;
}

@media (min-width: 768px) {   
    a.publication-link {
        font-size: 16px;
        padding: unset;
    }
}
@media (min-width: 992px) {
    a.publication-link {
        font-size: 18px;
    }
}

a.publication-menu-toggle {
    display: inline-block;
    width: 100%;
    
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 15px;
    padding-right: 15px;
}

div.publication-row{
    padding: 0px;
}

@media (min-width: 768px) {
    div.publication-row{
        border-bottom: 3px solid;
        padding-top: 3px;
        padding-bottom: 3px;
    }
}

@media (max-width: 767px) {
    .publication-col{
        padding: 0px;
    }
}

 /*====================== About  Row =====================*/
 a.about-row {
    font-size: 16px;
}

a.about-row-dropdown {
    font-size: 16px;
    display: inline-block;
    padding-top: 5px;
    padding-bottom: 5px;
    width: 100%;
    height: 100%;
    border-width: 1px;
    border-style: solid;
}

a.about-row-dropdown:hover {
    border: 1px solid;
}

div.about-row{
    padding: 0px;
}


div.about-row{
    border-bottom: 3px solid black;
    padding-top: 3px;
    padding-bottom: 3px;
    border-bottom: 3px solid black;
}


.about-col{
    padding: 0px;
}

div.about-dropdown{
    border-bottom: 3px solid;
    padding-top: 3px;
    padding-bottom: 3px;
}

.show-900 {
    font: unset;
    display: none
}

.hidden-900 {
    font: unset;
}

@media (max-width: 950px) { /*La Prensa fix*/
    .hidden-900 {
        display: none;
    }
    .show-900 {
        display: unset
    }

}
@media (max-width: 767px) { /*La Prensa fix*/
    .hidden-900 {
        display: unset;
    }
    .show-900 {
        display: none
    }
}

/* ==================== Content ======================== */

img {
    max-width: 100%;
}

div.article img {
    max-width: 100%;
    margin-bottom: 10px;
}

h1.headline, h2.headline, 
h3.headline, h4.headline, 
h5.headline, h6.headline {
    margin-top: 10px;
}

div.article img {
    max-width: 100%;
    margin-bottom: 10px;
}

div.content-sidebar {
    padding: 10px;
    margin-top:10px;
}

/* ============================== Layout ============================== */
.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-xs-5ths {
    width: 20%;
    float: left;
}

@media (min-width: 768px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }
    
}

@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }
}

.no-transition {
    transition: none !important;
}