/***********************************************
 * Adjust Elements to Container
 ***********************************************/
[data-ratio], .data_ratio{
    position: relative; overflow: hidden;
    display: block;
}

/***********************************************
 * Video-Stylings
 ***********************************************/
[data-ratio] > video,
.data_ratio > video{
    -webkit-transform: translateY(-50%) translateX(-50%);
    -moz-transform: translateY(-50%) translateX(-50%);
    -ms-transform: translateY(-50%) translateX(-50%);
    -o-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
    position: absolute; top: 50%; left: 50%;
    z-index: 0; margin: 0 auto;
}
[data-ratio].adjust_to_width > video,
.data_ratio.adjust_to_width > video {
    width: 100%; height: auto;
}
[data-ratio].adjust_to_height > video,
.data_ratio.adjust_to_height > video{
    height: 100%; width: auto; max-width: none;
}

/***********************************************
 * Images Base-Stylings
 ***********************************************/
[data-ratio] > picture,
.data_ratio > picture {
    position: absolute; top: 0; left: 0; right: 0; bottom: 0;
    width: 100%; height: 100%;
}
[data-ratio] > picture > img,
[data-ratio] > img,
.data_ratio > picture > img,
.data_ratio > img{
    -webkit-transform: translateY(-50%) translateX(-50%);
    -moz-transform: translateY(-50%) translateX(-50%);
    -ms-transform: translateY(-50%) translateX(-50%);
    -o-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
    position: absolute; top: 50%; left: 50%;
    z-index: 0; margin: 0 auto;
}
[data-ratio].adjust_to_width > picture > img,
[data-ratio].adjust_to_width > img,
.data_ratio.adjust_to_width > picture > img,
.data_ratio.adjust_to_width > img{
    width: 100%; height: auto;
}
[data-ratio].adjust_to_height > picture > img,
[data-ratio].adjust_to_height > img,
.data_ratio.adjust_to_height > picture > img,
.data_ratio.adjust_to_height > img{
    height: 100%; width: auto; max-width: none;
}



.invert > [data-ratio].adjust_to_width > picture > img,
.invert > [data-ratio].adjust_to_width > img,
[data-ratio].adjust_to_width.invert > picture > img,
[data-ratio].adjust_to_width.invert > img,
.invert > .data_ratio.adjust_to_width > picture > img,
.invert > .data_ratio.adjust_to_width > img,
.data_ratio.adjust_to_width.invert > picture > img,
.data_ratio.adjust_to_width.invert > img{
    height: 100%; width: auto; max-width: none;
}
.invert > [data-ratio].adjust_to_height > picture > img,
.invert > [data-ratio].adjust_to_height > img,
[data-ratio].adjust_to_height.invert > picture > img,
[data-ratio].adjust_to_height.invert > img,
.invert > .data_ratio.adjust_to_height > picture > img,
.invert > .data_ratio.adjust_to_height > img,
.data_ratio.adjust_to_height.invert > picture > img,
.data_ratio.adjust_to_height.invert > img{
    width: 100%; height: auto;
}


/***********************************************
 * Images Position-Stylings
 ***********************************************/
[data-ratio].v_align_top > picture > img,
[data-ratio].v_align_bottom > picture > img,
[data-ratio].v_align_top > img,
[data-ratio].v_align_bottom > img,
.data_ratio.v_align_top > picture > img,
.data_ratio.v_align_bottom > picture > img,
.data_ratio.v_align_top > img,
.data_ratio.v_align_bottom > img{
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

[data-ratio].h_align_left > picture > img,
[data-ratio].h_align_right > picture > img,
[data-ratio].h_align_left > img,
[data-ratio].h_align_right > img,
.data_ratio.h_align_left > picture > img,
.data_ratio.h_align_right > picture > img,
.data_ratio.h_align_left > img,
.data_ratio.h_align_right > img{
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

[data-ratio].v_align_top.h_align_left > picture > img,
[data-ratio].v_align_top.h_align_right > picture > img,
[data-ratio].v_align_bottom.h_align_left > picture > img,
[data-ratio].v_align_bottom.h_align_right > picture > img,
[data-ratio].v_align_top.h_align_left > img,
[data-ratio].v_align_top.h_align_right > img,
[data-ratio].v_align_bottom.h_align_left > img,
[data-ratio].v_align_bottom.h_align_right > img,
.data_ratio.v_align_top.h_align_left > picture > img,
.data_ratio.v_align_top.h_align_right > picture > img,
.data_ratio.v_align_bottom.h_align_left > picture > img,
.data_ratio.v_align_bottom.h_align_right > picture > img,
.data_ratio.v_align_top.h_align_left > img,
.data_ratio.v_align_top.h_align_right > img,
.data_ratio.v_align_bottom.h_align_left > img,
.data_ratio.v_align_bottom.h_align_right > img {
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
}

[data-ratio].v_align_top > picture > img,
[data-ratio].v_align_top > img,
.data_ratio.v_align_top > picture > img,
.data_ratio.v_align_top > img { 
    top: 0; 
}
[data-ratio].v_align_bottom > picture > img,
[data-ratio].v_align_bottom > img,
.data_ratio.v_align_bottom > picture > img,
.data_ratio.v_align_bottom > img { 
    top: auto; bottom: 0; 
}
[data-ratio].h_align_left > picture > img,
[data-ratio].h_align_left > img,
.data_ratio.h_align_left > picture > img,
.data_ratio.h_align_left > img { 
    left: 0; 
}
[data-ratio].h_align_right > picture > img,
[data-ratio].h_align_right > img,
.data_ratio.h_align_right > picture > img,
.data_ratio.h_align_right > img { 
    left: auto; right: 0; 
}


.v_align_top > [data-ratio] > picture > img,
.v_align_bottom > [data-ratio] > picture >img,
.v_align_top > [data-ratio] > img,
.v_align_bottom > [data-ratio] > img,
.v_align_top > .data_ratio > picture > img,
.v_align_bottom > .data_ratio > picture >img,
.v_align_top > .data_ratio > img,
.v_align_bottom > .data_ratio > img{
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

.h_align_left > [data-ratio] > picture > img,
.h_align_right > [data-ratio] > picture > img,
.h_align_left > [data-ratio] > img,
.h_align_right > [data-ratio] > img,
.h_align_left > .data_ratio > picture > img,
.h_align_right > .data_ratio > picture > img,
.h_align_left > .data_ratio > img,
.h_align_right > .data_ratio > img{
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.v_align_top.h_align_left > [data-ratio] > picture > img,
.v_align_top.h_align_right > [data-ratio] > picture > img,
.v_align_bottom.h_align_left > [data-ratio] > picture > img,
.v_align_bottom.h_align_right > [data-ratio] > picture > img,
.v_align_top.h_align_left > [data-ratio] > img,
.v_align_top.h_align_right > [data-ratio] > img,
.v_align_bottom.h_align_left > [data-ratio] > img,
.v_align_bottom.h_align_right > [data-ratio] > img,
.v_align_top.h_align_left > .data_ratio > picture > img,
.v_align_top.h_align_right > .data_ratio > picture > img,
.v_align_bottom.h_align_left > .data_ratio > picture > img,
.v_align_bottom.h_align_right > .data_ratio > picture > img,
.v_align_top.h_align_left > .data_ratio > img,
.v_align_top.h_align_right > .data_ratio > img,
.v_align_bottom.h_align_left > .data_ratio > img,
.v_align_bottom.h_align_right > .data_ratio > img{
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
}

.v_align_top > [data-ratio] > picture > img,
.v_align_top > [data-ratio] > img,
.v_align_top > .data_ratio > picture > img,
.v_align_top > .data_ratio > img { 
    top: 0; 
}
.v_align_bottom > [data-ratio] > picture > img,
.v_align_bottom > [data-ratio] > img,
.v_align_bottom > .data_ratio > picture > img,
.v_align_bottom > .data_ratio > img { 
    top: auto; bottom: 0; 
}
.h_align_left > [data-ratio] > picture > img,
.h_align_left > [data-ratio] > img,
.h_align_left > .data_ratio > picture > img,
.h_align_left > .data_ratio > img { 
    left: 0; 
}
.h_align_right > [data-ratio] > picture > img,
.h_align_right > [data-ratio] > img,
.h_align_right > .data_ratio > picture > img,
.h_align_right > .data_ratio > img { 
    left: auto; right: 0; 
}


/***********************************************
 * Default Sizes
 ***********************************************/
[data-ratio]:before, .data_ratio:before{ display: block; position: relative; z-index: 0; }
[data-ratio][class*="small-fixed-height"], .data_ratio[class*="small-fixed-height"]{ min-height: 0; }
[data-ratio][class*="small-expand-height"], .data_ratio[class*="small-expand-height"]{ min-height: 100%; }
[data-ratio][class*="small-ratio-"]:before, .data_ratio[class*="small-ratio-"]:before{ content: '';}
[data-ratio][class*="small-ratio-1-1"]:before, .data_ratio[class*="small-ratio-1-1"]:before{ padding: 0 0 100%; }
[data-ratio][class*="small-ratio-2-1"]:before, .data_ratio[class*="small-ratio-2-1"]:before{ padding: 0 0 50%; }
[data-ratio][class*="small-ratio-3-1"]:before, .data_ratio[class*="small-ratio-3-1"]:before{ padding: 0 0 33.333%; }
[data-ratio][class*="small-ratio-3-2"]:before, .data_ratio[class*="small-ratio-3-2"]:before{ padding: 0 0 66.666%; }
[data-ratio][class*="small-ratio-4-3"]:before .data_ratio[class*="small-ratio-4-3"]:before{ padding: 0 0 75%; }
[data-ratio][class*="small-ratio-5-4"]:before, .data_ratio[class*="small-ratio-5-4"]:before{ padding: 0 0 80%; }
[data-ratio][class*="small-ratio-16-9"]:before, .data_ratio[class*="small-ratio-16-9"]:before{ padding: 0 0 56.25%; }
[data-ratio][class*="small-ratio-7-8"]:before, .data_ratio[class*="small-ratio-7-8"]:before{ padding: 0 0 114.28%; }
[data-ratio][class*="small-ratio-5-6"]:before, .data_ratio[class*="small-ratio-5-6"]:before{ padding: 0 0 120%; }
[data-ratio][class*="small-ratio-4-5"]:before, .data_ratio[class*="small-ratio-4-5"]:before{ padding: 0 0 125%; }
[data-ratio][class*="small-ratio-3-4"]:before, .data_ratio[class*="small-ratio-3-4"]:before{ padding: 0 0 133.333%; }
[data-ratio][class*="small-ratio-3-5"]:before, .data_ratio[class*="small-ratio-3-5"]:before{ padding: 0 0 166.666%; }
[data-ratio][class*="small-ratio-1-2"]:before, .data_ratio[class*="small-ratio-1-2"]:before{ padding: 0 0 200%; }
[class*="small-fixed-height"] [data-ratio], [class*="small-fixed-height"] > [data-ratio]{ min-height: 0; }
[class*="small-expand-height"] [data-ratio], [class*="small-expand-height"] > [data-ratio]{ min-height: 100%; }
[class*="small-ratio-"] [data-ratio]:before, [class*="small-ratio-"] > [data-ratio]:before{ content: '';}
[class*="small-ratio-1-1"] [data-ratio]:before, [class*="small-ratio-1-1"] > .data_ratio:before{ padding: 0 0 100%; }
[class*="small-ratio-2-1"] [data-ratio]:before, [class*="small-ratio-2-1"] > .data_ratio:before{ padding: 0 0 50%; }
[class*="small-ratio-3-1"] [data-ratio]:before, [class*="small-ratio-3-1"] > .data_ratio:before{ padding: 0 0 33.333%; }
[class*="small-ratio-3-2"] [data-ratio]:before, [class*="small-ratio-3-2"] > .data_ratio:before{ padding: 0 0 66.666%; }
[class*="small-ratio-4-3"] [data-ratio]:before, [class*="small-ratio-4-3"] > .data_ratio:before{ padding: 0 0 75%; }
[class*="small-ratio-5-4"] [data-ratio]:before, [class*="small-ratio-5-4"] > .data_ratio:before{ padding: 0 0 80%; }
[class*="small-ratio-16-9"] [data-ratio]:before, [class*="small-ratio-16-9"] > .data_ratio:before{ padding: 0 0 56.25%; }
[class*="small-ratio-7-8"] [data-ratio]:before, [class*="small-ratio-7-8"] > .data_ratio:before{ padding: 0 0 114.28%; }
[class*="small-ratio-5-6"] [data-ratio]:before, [class*="small-ratio-5-6"] > .data_ratio:before{ padding: 0 0 120%; }
[class*="small-ratio-4-5"] [data-ratio]:before, [class*="small-ratio-4-5"] > .data_ratio:before{ padding: 0 0 125%; }
[class*="small-ratio-3-4"] [data-ratio]:before, [class*="small-ratio-3-4"] > .data_ratio:before{ padding: 0 0 133.333%; }
[class*="small-ratio-3-5"] [data-ratio]:before, [class*="small-ratio-3-5"] > .data_ratio:before{ padding: 0 0 166.666%; }
[class*="small-ratio-1-2"] [data-ratio]:before, [class*="small-ratio-1-2"] > .data_ratio:before{ padding: 0 0 200%; }




@media screen and (min-width:40em){
    [data-ratio][class*="medium-fixed-height"], .data_ratio[class*="medium-fixed-height"]{ min-height: 0; }
    [data-ratio][class*="medium-expand-height"], .data_ratio[class*="medium-expand-height"]{ min-height: 100%; }
    [data-ratio][class*="medium-ratio-"]:before, .data_ratio[class*="medium-ratio-"]:before{ content: '';}
    [data-ratio][class*="medium-ratio-1-1"]:before, .data_ratio[class*="medium-ratio-1-1"]:before{ padding: 0 0 100%; }
    [data-ratio][class*="medium-ratio-2-1"]:before, .data_ratio[class*="medium-ratio-2-1"]:before{ padding: 0 0 50%; }
    [data-ratio][class*="medium-ratio-3-1"]:before, .data_ratio[class*="medium-ratio-3-1"]:before{ padding: 0 0 33.333%; }
    [data-ratio][class*="medium-ratio-3-2"]:before, .data_ratio[class*="medium-ratio-3-2"]:before{ padding: 0 0 66.666%; }
    [data-ratio][class*="medium-ratio-4-3"]:before .data_ratio[class*="medium-ratio-4-3"]:before{ padding: 0 0 75%; }
    [data-ratio][class*="medium-ratio-5-4"]:before, .data_ratio[class*="medium-ratio-5-4"]:before{ padding: 0 0 80%; }
    [data-ratio][class*="medium-ratio-16-9"]:before, .data_ratio[class*="medium-ratio-16-9"]:before{ padding: 0 0 56.25%; }
    [data-ratio][class*="medium-ratio-7-8"]:before, .data_ratio[class*="medium-ratio-7-8"]:before{ padding: 0 0 114.28%; }
    [data-ratio][class*="medium-ratio-5-6"]:before, .data_ratio[class*="medium-ratio-5-6"]:before{ padding: 0 0 120%; }
    [data-ratio][class*="medium-ratio-4-5"]:before, .data_ratio[class*="medium-ratio-4-5"]:before{ padding: 0 0 125%; }
    [data-ratio][class*="medium-ratio-3-4"]:before, .data_ratio[class*="medium-ratio-3-4"]:before{ padding: 0 0 133.333%; }
    [data-ratio][class*="medium-ratio-3-5"]:before, .data_ratio[class*="medium-ratio-3-5"]:before{ padding: 0 0 166.666%; }
    [data-ratio][class*="medium-ratio-1-2"]:before, .data_ratio[class*="medium-ratio-1-2"]:before{ padding: 0 0 200%; }
    [class*="medium-fixed-height"] [data-ratio], [class*="medium-fixed-height"] > [data-ratio]{ min-height: 0; }
    [class*="medium-expand-height"] [data-ratio], [class*="medium-expand-height"] > [data-ratio]{ min-height: 100%; }
    [class*="medium-ratio-"] [data-ratio]:before, [class*="medium-ratio-"] > [data-ratio]:before{ content: '';}
    [class*="medium-ratio-1-1"] [data-ratio]:before, [class*="medium-ratio-1-1"] > .data_ratio:before{ padding: 0 0 100%; }
    [class*="medium-ratio-2-1"] [data-ratio]:before, [class*="medium-ratio-2-1"] > .data_ratio:before{ padding: 0 0 50%; }
    [class*="medium-ratio-3-1"] [data-ratio]:before, [class*="medium-ratio-3-1"] > .data_ratio:before{ padding: 0 0 33.333%; }
    [class*="medium-ratio-3-2"] [data-ratio]:before, [class*="medium-ratio-3-2"] > .data_ratio:before{ padding: 0 0 66.666%; }
    [class*="medium-ratio-4-3"] [data-ratio]:before, [class*="medium-ratio-4-3"] > .data_ratio:before{ padding: 0 0 75%; }
    [class*="medium-ratio-5-4"] [data-ratio]:before, [class*="medium-ratio-5-4"] > .data_ratio:before{ padding: 0 0 80%; }
    [class*="medium-ratio-16-9"] [data-ratio]:before, [class*="medium-ratio-16-9"] > .data_ratio:before{ padding: 0 0 56.25%; }
    [class*="medium-ratio-7-8"] [data-ratio]:before, [class*="medium-ratio-7-8"] > .data_ratio:before{ padding: 0 0 114.28%; }
    [class*="medium-ratio-5-6"] [data-ratio]:before, [class*="medium-ratio-5-6"] > .data_ratio:before{ padding: 0 0 120%; }
    [class*="medium-ratio-4-5"] [data-ratio]:before, [class*="medium-ratio-4-5"] > .data_ratio:before{ padding: 0 0 125%; }
    [class*="medium-ratio-3-4"] [data-ratio]:before, [class*="medium-ratio-3-4"] > .data_ratio:before{ padding: 0 0 133.333%; }
    [class*="medium-ratio-3-5"] [data-ratio]:before, [class*="medium-ratio-3-5"] > .data_ratio:before{ padding: 0 0 166.666%; }
    [class*="medium-ratio-1-2"] [data-ratio]:before, [class*="medium-ratio-1-2"] > .data_ratio:before{ padding: 0 0 200%; }
}

@media screen and (min-width:64em){
    [data-ratio][class*="large-fixed-height"], .data_ratio[class*="large-fixed-height"]{ min-height: 0; }
    [data-ratio][class*="large-expand-height"], .data_ratio[class*="large-expand-height"]{ min-height: 100%; }
    [data-ratio][class*="large-ratio-"]:before, .data_ratio[class*="large-ratio-"]:before{ content: '';}
    [data-ratio][class*="large-ratio-1-1"]:before, .data_ratio[class*="large-ratio-1-1"]:before{ padding: 0 0 100%; }
    [data-ratio][class*="large-ratio-2-1"]:before, .data_ratio[class*="large-ratio-2-1"]:before{ padding: 0 0 50%; }
    [data-ratio][class*="large-ratio-3-1"]:before, .data_ratio[class*="large-ratio-3-1"]:before{ padding: 0 0 33.333%; }
    [data-ratio][class*="large-ratio-3-2"]:before, .data_ratio[class*="large-ratio-3-2"]:before{ padding: 0 0 66.666%; }
    [data-ratio][class*="large-ratio-4-3"]:before .data_ratio[class*="large-ratio-4-3"]:before{ padding: 0 0 75%; }
    [data-ratio][class*="large-ratio-5-4"]:before, .data_ratio[class*="large-ratio-5-4"]:before{ padding: 0 0 80%; }
    [data-ratio][class*="large-ratio-16-9"]:before, .data_ratio[class*="large-ratio-16-9"]:before{ padding: 0 0 56.25%; }
    [data-ratio][class*="large-ratio-7-8"]:before, .data_ratio[class*="large-ratio-7-8"]:before{ padding: 0 0 114.28%; }
    [data-ratio][class*="large-ratio-5-6"]:before, .data_ratio[class*="large-ratio-5-6"]:before{ padding: 0 0 120%; }
    [data-ratio][class*="large-ratio-4-5"]:before, .data_ratio[class*="large-ratio-4-5"]:before{ padding: 0 0 125%; }
    [data-ratio][class*="large-ratio-3-4"]:before, .data_ratio[class*="large-ratio-3-4"]:before{ padding: 0 0 133.333%; }
    [data-ratio][class*="large-ratio-3-5"]:before, .data_ratio[class*="large-ratio-3-5"]:before{ padding: 0 0 166.666%; }
    [data-ratio][class*="large-ratio-1-2"]:before, .data_ratio[class*="large-ratio-1-2"]:before{ padding: 0 0 200%; }
    [class*="large-fixed-height"] [data-ratio], [class*="large-fixed-height"] > [data-ratio]{ min-height: 0; }
    [class*="large-expand-height"] [data-ratio], [class*="large-expand-height"] > [data-ratio]{ min-height: 100%; }
    [class*="large-ratio-"] [data-ratio]:before, [class*="large-ratio-"] > [data-ratio]:before{ content: '';}
    [class*="large-ratio-1-1"] [data-ratio]:before, [class*="large-ratio-1-1"] > .data_ratio:before{ padding: 0 0 100%; }
    [class*="large-ratio-2-1"] [data-ratio]:before, [class*="large-ratio-2-1"] > .data_ratio:before{ padding: 0 0 50%; }
    [class*="large-ratio-3-1"] [data-ratio]:before, [class*="large-ratio-3-1"] > .data_ratio:before{ padding: 0 0 33.333%; }
    [class*="large-ratio-3-2"] [data-ratio]:before, [class*="large-ratio-3-2"] > .data_ratio:before{ padding: 0 0 66.666%; }
    [class*="large-ratio-4-3"] [data-ratio]:before, [class*="large-ratio-4-3"] > .data_ratio:before{ padding: 0 0 75%; }
    [class*="large-ratio-5-4"] [data-ratio]:before, [class*="large-ratio-5-4"] > .data_ratio:before{ padding: 0 0 80%; }
    [class*="large-ratio-16-9"] [data-ratio]:before, [class*="large-ratio-16-9"] > .data_ratio:before{ padding: 0 0 56.25%; }
    [class*="large-ratio-7-8"] [data-ratio]:before, [class*="large-ratio-7-8"] > .data_ratio:before{ padding: 0 0 114.28%; }
    [class*="large-ratio-5-6"] [data-ratio]:before, [class*="large-ratio-5-6"] > .data_ratio:before{ padding: 0 0 120%; }
    [class*="large-ratio-4-5"] [data-ratio]:before, [class*="large-ratio-4-5"] > .data_ratio:before{ padding: 0 0 125%; }
    [class*="large-ratio-3-4"] [data-ratio]:before, [class*="large-ratio-3-4"] > .data_ratio:before{ padding: 0 0 133.333%; }
    [class*="large-ratio-3-5"] [data-ratio]:before, [class*="large-ratio-3-5"] > .data_ratio:before{ padding: 0 0 166.666%; }
    [class*="large-ratio-1-2"] [data-ratio]:before, [class*="large-ratio-1-2"] > .data_ratio:before{ padding: 0 0 200%; }
}


[data-svg-dimensions] svg,
.data_svg_dimensions svg {
    width: 100%;
}
[data-ratio] svg,
.data_ratio svg {
    width: 100%;
    -webkit-transform: translateY(-50%) translateX(-50%);
    -moz-transform: translateY(-50%) translateX(-50%);
    -ms-transform: translateY(-50%) translateX(-50%);
    -o-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
    position: absolute; top: 50%; left: 50%;
    z-index: 0; margin: 0 auto;
}

[data-ratio].adjust_to_width svg,
[data-ratio].adjust_to_width svg,
.data_ratio.adjust_to_width svg,
.data_ratio.adjust_to_width svg{
    height: 100%; width: auto; max-width: none;
}
[data-ratio].adjust_to_height svg,
[data-ratio].adjust_to_height svg,
.data_ratio.adjust_to_height svg,
.data_ratio.adjust_to_height svg{
    width: 100%; height: auto;
}