☰

Instagram widescreen

Makes Instagram use its space better by filling the screen on home and profile pages using a grid layout.

/* ==UserStyle==
@name           Instagram widescreen
@namespace      legosavant
@version        2.0.0
@description    Makes Instagram use its space better by filling the screen on home and profile pages using a grid layout.
@preprocessor   stylus
@license        gplv3

@var checkbox two-row-home 'two row home' 1
==/UserStyle== */

@-moz-document domain("instagram.com") {
/*profile*/
.Nnq7C {
    display:inline-flex
}
._a3gq ._aayp [style^="flex-direction: column; padding-bottom"] {
    display:grid;
    padding:0!important
}
._a3gq ._ac7v:nth-child(even) {
    grid-column:2
}
._a3gq ._ac7v:nth-child(odd) {
    grid-column:1;
    margin-right:14px
}
._a3gq ._aanf { /*huge spacing is stupid*/
    margin-right:14px;
    margin-bottom:14px
}
._a3gq ._aa6b._aa6d ._aa6e {
    max-width:none!Important
}
._a3gq ._aang {
    margin:0
}
@media (min-width:0px) {

._a3gq ._aabd { /*width of images*/
    width:101px!important;
    flex:none
}
}
@media (min-width:850px) {
._a3gq ._aa_y {
    max-width:790px /*width of main profile page*/
}
._a3gq ._aanf { /*width of images*/
    width:120px!important;
    flex:none
}
}
@media (min-width:1150px) {
._a3gq ._aa_y {
    max-width:1090px /*width of main profile page*/
}
._a3gq ._aanf { /*width of images*/
    width:170px!important;
    flex:none
}
.Kj7h1 ._a3gq ._aabd {
    width:120px!important
}
}
@media (min-width:1386px) {
._a3gq ._aa_y {
    max-width:1330px /*width of main profile page*/
}
._a3gq ._aanf { /*width of images*/
    width:210px!important;
    flex:none
}
.Kj7h1 ._a3gq ._aabd {
    width:170px!important
}
}
@media (min-width:1750px) {
._a3gq ._aa_y {
    max-width:1690px /*width of main profile page*/
}
._a3gq ._aanf { /*width of images*/
    width:266px!important;
    flex:none
}
.Kj7h1 ._a3gq ._aabd {
    width:188px!important
}
}
@media (min-width:1919px) {
._a3gq ._aa_y {
    max-width:1916px /*width of main profile page*/
}
._a3gq ._aanf { /*width of images*/
    width:296px!important;
    flex:none
}
.Kj7h1 ._a3gq ._aabd {
    width:216px!important
}
._a3gq ._aa6b._aa6d {
    max-width:1000px!Important
}
}
@media (min-width:2100px) {
._a3gq ._aa_y {
    max-width:2000px /*width of main profile page*/
}
._a3gq ._aanf { /*width of images*/
    width:320px!important;
    flex:none
}
._a3gq ._aa6b._aa6d {
    max-width:1100px!Important
}
}
@media (min-width:2600px) {
._a3gq ._aa_y {
    max-width:2280px /*width of main profile page*/
}
._a3gq ._aanf { /*width of images*/
    width:360px!important;
    flex:none
}
._a3gq ._aa6b._aa6d {
    max-width:1400px!Important
}
}
/*igtv and similar*/
._a3gq ._ab9p [style^="flex-direction: column; padding-bottom"], ._ab04 [style^="flex-direction: column; padding-bottom"], ._aa-i [style^="flex-direction: column; padding-bottom"], ._a3gq ._aa6g [style^="flex-direction: column; padding-bottom"]{
    display:grid
}
._a3gq ._aa_9 {
    margin-right:5px;
    margin-bottom:5px
}
._a3gq ._aa_a {
    margin-bottom:0;
}
._a3gq ._abq3 {
    margin-right:14px;
}
._a3gq ._abq4 {
    margin-bottom:14px
}
._ab04 ._aang {
    margin-bottom:0
}
@media (min-width:850px) {
.Nnq7C .b9_1r, ._a3gq ._aa_9   {
    max-width:94px!important;
}
._ab04 ._aanf {
    max-width:141px
}
}
@media (min-width:1150px) {
.Nnq7C .b9_1r, ._a3gq ._aa_9   {
    max-width:131px!important;
}
._ab04 ._aanf {
    max-width:171px
}
}
@media (min-width:1386px) {
.Nnq7C .b9_1r, ._a3gq ._aa_9   {
    max-width:161px!important;
}
._ab04 ._aanf {
    max-width:222px
}
}
@media (min-width:1750px) {
.Nnq7C .b9_1r, ._a3gq ._aa_9   {
    max-width:206px!important;
}
._ab04 ._aanf {
    max-width:236px
}
}
@media (min-width:1919px) {
.Nnq7C .b9_1r, ._a3gq ._aa_9   {
    max-width:226px!important;
}
._ab04 ._aanf {
    max-width:256px
}
}
@media (max-width:1150px) {
.-V_eO:nth-child(1) {
    margin:50px 0 0;
}
.vrLJa .-V_eO {
    margin-left:15%!important
}
.v1Nh3.kIKUG._bz0w .-V_eO {
    margin-left:22%
}
.Ln-UN {
    display:block;
}
}
/*post*/
._a3gq ._aa6g [style^="flex-direction: column; padding-bottom"] ._ac7v._aang {
    width:50%
}
._aa6g {
    position:absolute;
    left:-22%
}
@media (max-width:1386px) {
    ._aa6g {
    left:-7%
    }
}
@media (max-width:1106px) {
    ._aa6g {
    left:0%
    }
}
.Z666a {
    padding-top:0

}
.Z666a div[style^="f"] {
    display:block
}
.Z666a ._a3gq ._aabd {
    max-width:268px!important
}
}

@-moz-document url("https://www.instagram.com/"), url-prefix("https://www.instagram.com/home") {

/*home*/
._a3gq ._aal- {
    max-width:calc(65%);
    padding-right:380px
}
._a3gq ._aam3 {
    max-width:none
}
._aak6._aak7._aak8._aak9._aaka {
    left:auto!important;
    right:40px
}


}