Make tabs span to full width.



  • Hi all, I'm trying to make a similar theme in vivaldi that I made for firefox, I'm almost there but I can't seem to get the tabs to span to fill the bar, the method I found in the large customizing thread doesn't seem to work now! Does anybody know how to achieve this? It was so easy in FF, but I'm struggling to get this to play ball. Many thanks, Sean



  • Still looking for the solution, I cannot crack this one, everything I try that should work just doesn't, it's a strange one.



  • Maybe you could share the most recent version of the code you are trying right now.



  • I'll have another play and get back to you with the code, I deleted what I'd tried last night. I can't seem to find the old code that did once work in the big customize thread either.

    It's basically messing with max-width of tabs but it does nothing anymore!



  • This is the code that I'm pretty sure did once work, but it doesn't anymore, I presume some naming has changed but inspecting elements isn't really helping me:

    #tabs-container.bottom #tabs .tab, #tabs-container.top #tabs .tab {
    width: 100% !important;
    max-width: 100% !important;
    }

    Sean



  • Quick update, it's most certainly something to do with .tab-position, I can get the tab to stretch full width, I thought I had it!, unfortunately opening another tab just puts it on top, and the new tab button gets covered, grrrr.



  • Yeah, I looked at it yesterday. You can forget about the old code. And the way you tried it doesn't only cover all other tabs, but also hides the + button and the trash icon. That's how far I got too, lol. I'm not good at CSS sadly, maybe someone else can help.



  • Thank you for giving it a go, I'm pulling my hair out! :)

    I've managed to get the new tab button fixed where I want it, next to min,max,close, it's one step nearer :)

    #tabs-container .newtab {
    position: static;
    float: right;
    }



  • @wiiija:

    Quick update, it's most certainly something to do with .tab-position, I can get the tab to stretch full width, I thought I had it!, unfortunately opening another tab just puts it on top, and the new tab button gets covered, grrrr.

    If you use the remote debugging port to look at the style of the .tab-position element, you'll see that the style sheets (standard or custom) are essentially overridden by a "style" element in the HTML - generated, I assume, by bundle.js when it lays out the tabs in the container.
    I believe you can still overcome this using css (in your custom.css) with a #tabs-container div.tab-position[style] {…}
    or something like it. It could be quite tricky to do what you're after as the tabs themselves sit inside several divs which use flex settings in a way that I've not taken the time to study in depth.



  • Thank you Broomass, very good info. I have delved deeper now thanks to the info and it does indeed look difficult to achieve at this time, so many divs use flex, I'll chalk this one down as a future project I think :)

    Sean



  • This would be much easier to do in Javascript rather than CSS.
    Just these steps:

    1. Get the amount of tabs in the bar.
    2. tab-width = bar-width / amount of tabs
    3. set each tab to tab-width
    4. loop over the tabs in the bar and set the margin-left to tab-width * tab-index

    example:
    bar is 500px
    there are 4 tabs
    tab-width = 500/4 = 125
    tab 0 margin-left: 0
    tab 1 margin-left 125
    tab 2 margin-left 250
    tab 4 margin-left 375



  • Thanks very much, I'm sure you are correct mavanmanen but that is completely lost on me, I only know css, .js is a future project to learn!



  • Let me install Tampermonkey and I'll see what I can do.



  • It's a tough one, I actually think it's nigh on impossible, I'm just surprised when it's so easy to do in FF.



  • If I understand your goal correctly, then this should work:

    .tab-strip {
        display: flex;
        flex-direction: row;
    }
    .tab-position {
        position: relative !important;
        flex: 1 1 100px !important;
        left: auto !important;
        top: auto !important;
    }
    
    #tabs-container .newtab {
        position: relative !important;
        left: auto !important;
        top: auto !important;
    }
    
    

    The reason you're struggling is probably because the elements are absolutely positioned. Absolute positioning can't layout elements relative to each other without some javascript to calculate and update the positions (top/left/width…).

    The CSS above overrides the absolute positioning, and uses flex for laying the elements on a row and allowing each element to grow and shrink as needed to fill the entire width.

    Below is a variation with multiple rows. It follows the same principle, but also makes sure the #tab-container will grow vertically as needed. Also, it specifies a max-width per tab; remove that if you want it to fill the full width. Notice that in this variation the flex of each tab has been changed to "flex: 1 0 100px". The second digit there specifies a "shrinkage"-weight of 0, which mean "no shrinkage". The tab will not shrink below its base width (100px), so that's when tabs start wrapping to new lines. If you want to increase the minimum tab width, then increase the 100px-value.

    #tabs-container {
        height: auto !important;
    }
    .tab-strip {
        display: flex;
        flex-direction: row;
        padding: 10px; /* Padding to make it less tight. May be removed. */
        flex-wrap: wrap;
    }
    .tab-position {
        position: relative !important;
        left: auto !important;
        top: auto !important;
        flex: 1 0 100px !important; /* 1 = grow, 0 = no shrink, 100px = base/minimum width */
        height: 30px !important;
        max-width: 300px !important; /* Max width. Remove to allow growing to full width. */
    }
    #tabs-container .newtab {
        position: relative !important;
        left: auto !important;
        top: auto !important;
    }
    
    

    The new tab button will also wrap along with the tabs. If you prefer to have it fixed on the right edge, then replace the last block with one of the following:

    /* Fixed position right side near top. */
    #tabs-container .newtab {
        position: absolute !important;
        left: auto !important;
        top: -3px !important;
        right: -33px;
    }
    
    
    /* Fixed position right side just above trashbin (follows trashbin as more rows are added). */
    #tabs-container .newtab {
        position: absolute !important;
        left: auto !important;
        top: auto !important;
        bottom: 22px !important;
        right: -33px;
    }
    
    

    Hope this helps :)



  • Weird, got an email with a big reply and it's gone now! thank you to the person for giving it a darn good go but it didn't work for me, though I do have a seriously customized setup as it is.

    To explain further to anybody who isn't exactly sure what I'm trying to do it's like this,
    If I have one tab open it spans the full 100% of the tabstoolbar, open another they both take 50% and so on a so forth.



  • The message had to pass through moderation since it was my first.

    Yeah, perhaps some other modifications are interfering. Do you have any other active styles on .tab-strip or .tab-position or .tab?



  • I do indeed, it's a pretty heavily customized setup as it is:

    /**[Fonts]**/
    
    #browser.win,
    #browser.win+div,
    #browser.win+div+div,
    #browser.win button,
    #browser.win input,
    #browser.win select,
    #browser.win textarea {
        font-family: 'Open Sans', Verdana, Arial, sans-serif !important;
    }
    /*#header #titlebar .window-buttongroup button {
    	height: 25px !important;
    }*/
    #browser.win.win10.tabs-top #header #titlebar .window-buttongroup button {
    	height: 25px !important;
    }
    
    .linux.normal .topmenu+#tabs-container.top,
    .win10.normal #tabs-container.top,
    .win.normal .topmenu+#tabs-container.top {
    	padding-top: 0 !important;
    }
    #header {
        border-bottom: 1px solid #697184;
        max-height: 25px !important;
        position: relative;
        flex: 0 0 auto;
    }
    .tabs-at-edge.maximized#browser.win.win10.tabs-top #header #titlebar .window-buttongroup button {
        height: 25px !important;
    }
    /**[New tab fixed to left]**/
    
    #tabs-container {
        padding-left: 20px !important;
        height: 24px !important;
    }
    .newtab {
        left: -30px !important;
    }
    /**[Selection color]**/
    
    ::selection {
        color:#fff !important;
        background: #b05158 !important;
    }
    /**[Auto-hide for nav-bar and side panels, comment to disable it]**/
    
    .toolbar-addressbar {
        visibility: hidden;
        opacity: 0;
        z-index: 2;
        position: fixed;
        transition: opacity .3s linear .7s, visibility 0s linear 1s;
    }
    #header:hover ~ #main .toolbar-addressbar,
    .toolbar-addressbar:hover {
        visibility: visible;
        opacity: 1;
        transition-delay: 0.1s;
    }
    /*#panels-container {
    	position: fixed;
    	height: 100%;
    	max-width: 0vw;
    	opacity: 0;
    	z-index: 1;
    	transition: max-width .5s cubic-bezier(0.18, 0.89, 0.32, 1.28), opacity .2s linear .2s;
    }
    #panels-container:hover {
    	max-width: 99vw;
    	opacity: 1;
    	transition-delay: 0s;
    }*/
    /**[Nav-bar bits]**/
    
    .toolbar-addressbar {
        height: 25px !important;
        width: 50% !important;
        left: 25% !important;
        right: 25% !important;
        border-bottom-right-radius: 3px;
        border-bottom-left-radius: 3px;
        background: #303541 !important;
        border-bottom: 1px solid #484e5c !important;
        border-left: 1px solid #484e5c !important;
        border-right: 1px solid #484e5c !important;
        -webkit-box-shadow: 0px 10px 44px -8px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px 10px 44px -8px rgba(0,0,0,0.75);
        box-shadow: 0px 10px 44px -8px rgba(0,0,0,0.75);
    }
    .address-top .toolbar.toolbar-addressbar:after {
        content: "";
        position: absolute;
        width: 100%;
        z-index: 1;
        height: 1px;
        background-color: var(--colorBorder);
        bottom: 0 !important;
    }
    .address-top .toolbar.toolbar-addressbar:after {
        display: none !important;
    }
    /**[Bookmark drop down size, requires a.js mod]**/
    
    .toolbar.toolbar-addressbar .button-toolbar.bookmarksbutton svg {
        display: none !important;
    }
    .toolbar.toolbar-addressbar .button-toolbar.bookmarksbutton {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAGSSURBVDiNpZLPTtNBEMe/M7NbtNeWGpV44EAwPSJnwwugZx/BeCPFZ0CuJr4B8Ui4mvgAFI4VGhJMTKh/miqQaNLf7sx4oLSIEH7Gb7KX3f1+5juzC/yn6PLG3NziLBgvQb5MhDoAONAn4y041rrd7Y/XAuabj16Y4VUIMbJwAPHZgRvMLOeUEjNW9zs7r889Mq7cXHwO0Fpl6laVRZiIQITRIjAzi4Sopo9rjfvHg36vPU4w21x4EJ33YmWqSvxXV3/IzZGK4a9E9vCws/uJASC4tEQk3mQGAGKCiMTg0gKAUZP2lEOIN7pH4hAiwZ5MAI7GFQ9yfQoQ3HHnQgL8ix9+dp0mAMJXuJcnwOGELxOAYVM1p7J21Zxg2BwDNNC6ZU1eIoW7wXJOGmgdGH2kH996p/Xpme9meYlZKkRXD8TdkYriJ4FXDjrt92MAAAz6Rzu1xr0TzXmJACJmnkzWYVlzKoohCKvdD+035z65WGHQ77XrtZkNdb1tpnctp6ppNjX9rKpvxcOz7t72u7KzKqXfCiClhcGYfsEAAAAASUVORK5CYII=') no-repeat center !important;
        margin-right: 0px !important;
        background-color: #303541 !important;
    }
    .toolbar.toolbar-addressbar .button-toolbar.bookmarksbutton:hover {
        background: url('data:image/png;base64,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') no-repeat center !important;
        margin-right: 0px !important;
        background-color: #303541 !important;
    }
    /**[ Menu button icon, requires .js mod as above, link in description]**/
    
    .vivaldi svg {
        display: none !important;
    }
    .vivaldi {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAGSSURBVDiNpZLPTtNBEMe/M7NbtNeWGpV44EAwPSJnwwugZx/BeCPFZ0CuJr4B8Ui4mvgAFI4VGhJMTKh/miqQaNLf7sx4oLSIEH7Gb7KX3f1+5juzC/yn6PLG3NziLBgvQb5MhDoAONAn4y041rrd7Y/XAuabj16Y4VUIMbJwAPHZgRvMLOeUEjNW9zs7r889Mq7cXHwO0Fpl6laVRZiIQITRIjAzi4Sopo9rjfvHg36vPU4w21x4EJ33YmWqSvxXV3/IzZGK4a9E9vCws/uJASC4tEQk3mQGAGKCiMTg0gKAUZP2lEOIN7pH4hAiwZ5MAI7GFQ9yfQoQ3HHnQgL8ix9+dp0mAMJXuJcnwOGELxOAYVM1p7J21Zxg2BwDNNC6ZU1eIoW7wXJOGmgdGH2kH996p/Xpme9meYlZKkRXD8TdkYriJ4FXDjrt92MAAAz6Rzu1xr0TzXmJACJmnkzWYVlzKoohCKvdD+035z65WGHQ77XrtZkNdb1tpnctp6ppNjX9rKpvxcOz7t72u7KzKqXfCiClhcGYfsEAAAAASUVORK5CYII=') no-repeat center !important;
    }
    .vivaldi:hover {
        background: url('data:image/png;base64,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') no-repeat center !important;
    }
    /**[Hide buttons, just remove the ones you wish to have visible]**/
    
    .button-addressfield.bookmark,
    .tab .tab-audio .audioicon,
    .button-toolbar.reload,
    .trash,
    .home,
    .tab-strip .favicon,
    .addressfield .input-dropdown,
    .addressfield .pageload .pageload-ticker,
    .addressfield .addressfield-siteinfo.certified,
    .addressfield .addressfield-siteinfo.secure,
    .addressfield .addressfield-siteinfo {
        display: none !important;
    }
    /**[Extension button - I only use one, use more the icons will all be same]**/
    
    /*.toolbar.toolbar-addressbar .button-toolbar.browserAction-button img {
        display: none !important;
    }
    .toolbar.toolbar-addressbar .button-toolbar.browserAction-button {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAGSSURBVDiNpZLPTtNBEMe/M7NbtNeWGpV44EAwPSJnwwugZx/BeCPFZ0CuJr4B8Ui4mvgAFI4VGhJMTKh/miqQaNLf7sx4oLSIEH7Gb7KX3f1+5juzC/yn6PLG3NziLBgvQb5MhDoAONAn4y041rrd7Y/XAuabj16Y4VUIMbJwAPHZgRvMLOeUEjNW9zs7r889Mq7cXHwO0Fpl6laVRZiIQITRIjAzi4Sopo9rjfvHg36vPU4w21x4EJ33YmWqSvxXV3/IzZGK4a9E9vCws/uJASC4tEQk3mQGAGKCiMTg0gKAUZP2lEOIN7pH4hAiwZ5MAI7GFQ9yfQoQ3HHnQgL8ix9+dp0mAMJXuJcnwOGELxOAYVM1p7J21Zxg2BwDNNC6ZU1eIoW7wXJOGmgdGH2kH996p/Xpme9meYlZKkRXD8TdkYriJ4FXDjrt92MAAAz6Rzu1xr0TzXmJACJmnkzWYVlzKoohCKvdD+035z65WGHQ77XrtZkNdb1tpnctp6ppNjX9rKpvxcOz7t72u7KzKqXfCiClhcGYfsEAAAAASUVORK5CYII=') no-repeat center !important;
    }
    .toolbar.toolbar-addressbar .button-toolbar.browserAction-button:hover {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw%2FeHBhY2tldCBiZWdpbj0i77u%2FIiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8%2BIDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QTIwRTNBRDU4OEQzMTFFNjgzN0RCNzdBMDRDRTczRUYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QTIwRTNBRDY4OEQzMTFFNjgzN0RCNzdBMDRDRTczRUYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpBMjBFM0FEMzg4RDMxMUU2ODM3REI3N0EwNENFNzNFRiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpBMjBFM0FENDg4RDMxMUU2ODM3REI3N0EwNENFNzNFRiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI%2FPnucbSIAAAExSURBVHjanJJNaoNQFIWf%2FwYdKGgdtXY3TnQWO2t3ELqCjLKErKCdNS2dKIK7EYdaVBAN%2FoT23oKiIW2THtD3uNzv6bvnUGSiMAyvuq57FEVxyTCMibW%2B76O2bV9Zlt1alpUMvdSw8X3flSTpSVXVBTRNz0OYFEWxL8vywXGctxFESFGUHTzkNwFM8jx3Eabw93iej3RdX5AzlKbpHmSyeCfDMGbQzXoza44363GPVwFwRQuC4E7vdAwd17CX47g7Gl7X5EIBY9Lkf%2FqkYdTxpRTMJaabptmhT6cGcaqGvQC%2BfNsBA4o0TTvLjiRJ6qqqTBpjhIlAc%2F8SmE%2Fqur6HAHyMkfM8bynL8vNPkcuyrEbItu33WVZRQRDosKzQWwj5LdYOh0OEc4B1i18aer8EGAD0IpRdprAoHgAAAABJRU5ErkJggg%3D%3D') no-repeat center !important;
    }*/
    /**[Hides all extension buttons]**/
    
    .toolbar.toolbar-addressbar .button-toolbar.browserAction-button {
        display: none !important;
    }  
    /**[Stripes animation progress bar]**/
    
    @keyframes animate-stripes {
        0% {
            background-position: 0 0;
        }
        100% {
            background-position: 60px 0;
        }
    }
    /**[Loading colour and stripes in address bar]**/
    
    .addressfield .pageload-indicator {
        background-color: #272b35 !important;
        display: inline-block;
        height: 18px !important;
        transition: width .4s ease-in-out;
        background-size: 30px 30px;
        background-image: linear-gradient(90deg, rgba(255, 255, 255, .25) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .25) 50%, rgba(255, 255, 255, .25) 75%, transparent 75%, transparent);
        animation: animate-stripes 3s linear infinite;
    }
    /**[Address field border and background gradient]**/
    
    .addressfield,
    .searchfield {
        height: auto !important;
        border: 1px solid rgba(242, 81, 87, .4) !important;
        border-radius: 3px !important;
        background: radial-gradient(circle, #3c4150, #1b1e25);
        -webkit-transform: skew(-20deg);
    }
    /**[New tab button]**/
    
    #tabs-container .newtab svg {
        display: none !important;
    }
    #tabs-container .newtab {
        height: 25px !important;
        margin-left: 0px !important;
        -webkit-transform: skew(-20deg);
        background-color: #b85a5a !important;
    }
    #tabs-container .newtab:hover {
        background-color: #5ce068 !important;
    }
    /**[Custom window control buttons]**/
    
    #browser.win.win10 #header #titlebar .window-buttongroup button.window-close:hover {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAHZSURBVCiRnZLPbtpAEMY/27tr2TQYSM0BiByaqhyiKqpq5ZDnCL0lbxDlYfIE7a006lsklziHHCI1aUIQMqqEaWDBhrBe4x4iEKh/Dp3TaDXf7G++GQVLcbW1VyRUHuuGvq9R6gBAIuKWmDx9iSU92bk/785rlXlyXdutZyzzo2UXDI2S5X5IYgkePE4iHh5u33inC+F1bbeetfMN66WFfwXvDTAMHuvbN96pcrW1V7TWWatQKhpjIRBNY9hrmRVBMIqQ0SlMxvCz053IPndUQuWxZRcMAIimMc7u2vD7fCHy+xxnd21E0xgAYNl5I9HIEdENvT6fyV7LwK2W4TV9pLMUiqbCe+jgvVNaUBBGQTL6B0IY3VjGquSywKsKLpo+kKZwN8vYWM+toGuUOmqK9O9uKMqf39M0JYmQbQBvFjMNhvCaPlyn9Iza9AFg5ddEyrYqxk8NKeTCPe+hA7f6jFfJZeFWy7hs/0AwigAAUsSIx9PP/7GOYCz40FF37s+7EQ8PeW8Ak7HfRHO3TcbAgwHCUXhQu73sLZ2cu29mX3yy7LxBGF0RShGDB4NxOAoP3n67+Aos3SoAfH/9zk40cqSaRp0xsgkAQshWMpk01NnspHZ72ZvX/gIbAdJTrJGD+AAAAABJRU5ErkJggg==') no-repeat center !important;
    }
    #browser.win.win10 #header #titlebar .window-buttongroup button.window-maximize:hover {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAHkSURBVCiRhZLPbtpAEMY/DF53IYKImA2UFppEyq1NLz1VTdRXaHBu7RtEeZg8QXsLoDxDhJRTL0HqpYe0DuJfME7BgI13De7BtUMaqd3T7sz8Ps3sfDGsnM3LHeYtlieUKhUikzIAcMF1Zz6rJSRyevv2ehDWxsJL9qKkpTPrn1XGqCzLq3oQQmA4uHWsyfjT3X6rHoHZi5KWY6yaVXP41zENA0NzoN3tt+qxzcsdRpMpvVAs0rDg17c+7O4oAmJyHLk3ZchrBL1225lPjXLCWyxPVMboqnJmV4XZ7MDujKOYlIgj/24bKmNUn46OJfpE0cKZxt8HWLoeJJLAtraHZDETgf5iCQCQCYFCU0cSUcjzMGn3LFyfXWExFwF89Bqp0vqjWQmRy5IP/0HQ6Vv4UW0GsBzH1uHeY9iP+ZLgovW3otO3oNebQdtyHFsfXiH19L5tLnhLcuazqhA8+L24FCVnXQs/a1fRzOndYFWCc7iuffZnHUm9UHxGxZTD+NqCL7xIgBYyyL4sRO9ep22bI7McGKBRqqgbrLaR+78BzKFxaB7cnN9brlGqpNcyX1TGqEzIA0BwjqExsCeW9dE8uDkHVrwKAPlGPudBPlZoUlOI8gIAXO7qrutUXeGdTt53h2HtbxHGynMvbK0wAAAAAElFTkSuQmCC') no-repeat center !important;
    }
    #browser.win.win10 #header #titlebar .window-buttongroup button.window-minimize:hover {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAFcSURBVCiRjZLNTsJQEEa/Xu4ttEGQn5JogjUG4YWoO0hkw4rwMOwlshOJLwQxiIkmcKHSklZ6W3CBIDGx9qxmMWcmk/kkHDHqJQvbINaOJ9QqlZkOAEKIsfh0H0H8Tqm+mu57pX0x7KYNNZm6z2h5hTJ2PA++EDA5dx3Lql83loODOOymjXRO65/msgjD5AtY85lx3VgOpFEvWVCUzFg7P1NCrW+mb++ua5s62QaxdkbLR5IAIKvlFSlGWySeUI3fN4VBGQNjyg2lMisCwOuLg8mzEypdXKko6iooYzrZbiIvw+EJErY08MUEQLmo76ZFwffEhHhrt+8LEXmnLwQ8z30gIH7H5NyNKi5m3Nmsgw4p1VdTx7LqJl/8K5nzOZyVXas0bf4Tubt0VTlJ9bJ/RG4x446zsmvl248n4CirOzmpSTHaYrJiMJldAoDwxNhbu/3NOuhUmjbf934BujmTMkkpVg4AAAAASUVORK5CYII=') no-repeat center !important;
    }
    #browser.win.win10 #header #titlebar .window-buttongroup button.window-close svg {
        display: none !important;
    }
    #browser.win.win10 #header #titlebar .window-buttongroup button.window-maximize svg {
        display: none !important;
    }
    #browser.win.win10 #header #titlebar .window-buttongroup button.window-minimize svg {
        display: none !important;
    }
    #browser.win.win10 #header #titlebar .window-buttongroup button.window-close:active {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAF4SURBVCiRlZKxTltBFETP3V3vkws3RKGLHEwUFyhCaSj4jeSlC3+A+Bi+gBIH5TNoAgUFUkxkx6JEiAYJa9dv96bA79mWSaRMtRrNaOfOvcISrrb3N52NR4h8BrpzeiLwbVa1jndH53e1VurHdX+vFPREoc0LEJgqerAzvDhrjNf9vVLRgbzkWIOWO8OLM7na3t9sudlEoR00E7PSsXZF+pgS3giFGICpT1XXOBuP6ngxwzBEHlLVmB5SxTBEYm6odrLu0CFS1kzHGnqFZxwC6kFEGIfIlvd0rGmcWfjiBHmjaENuWAtFwSgEBNjynlfOrU6pdM2yaa2GfzTkgFvg/WKmxDgEet7PowaAlV9FuDUCg+X2xiHSK57jbVhLr/D8jjMe06IdgdP/XocKT62cu2Z3dH6n6AFAIWbNBNCxtt4hCl/7N5f3BuD5jLQEpn9tQ3jKwqcPP398n8dd4Ne7j6+TdYcVlAZ5C5DRiRUGJufj/s3lfa39A5ZrnlSOvSrCAAAAAElFTkSuQmCC') no-repeat center !important;
    }
    #browser.win.win10 #header #titlebar .window-buttongroup button.window-maximize:active {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAFvSURBVCiRdZJbSltRFIa/tc6lioVGS708aEp96QiqIKR0DPX0sTMQB+MI+qgGxyCCoIMQ7CkILZqklCbxnH326kM8l6Tmf1qs/X+s2xYaWrvcXnWFO8T8vqBtADO7JbDTUOOjn3s3v0qvlMHK+VYiwjdgkec1MuFrr5N2K/AJOpkD1DIwJel10q6sXW6vOpffNisVP8ZYP6v9oRC+W0IWFGAUSdYOXeEOZ9sLNmIe0yHWy6ucqBC+fwmw6IgOFO+T8tHfjSH3ECovdlrISjTVZh3KFxXVzQr87ciuBhUc7y6jr+P/RhWjrZhNJf0gr2AJhGin9Rxsalg6m/WDnOx6AG4Cxx9eoa2wpoRU0cYZpAH3nyq7Sdu6sdBYFMdT57Cxx938RYq6fVmOCDYbSxeGWeHakw9wsbUvntNmxfmSzw8fv58pQK+Tdk1JgNF8P8MSmpkK1i/W3ziiAzNJROQtTD65BJw85u7oz6e7+9L7D6UhmyCba2wEAAAAAElFTkSuQmCC') no-repeat center !important;
    }
    #browser.win.win10 #header #titlebar .window-buttongroup button.window-minimize:active {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAEYSURBVCiRlZK9TsIAFIW/W2ob2GXDGgd3FwbqwjNo3eQNCA/DEziKxIcwoQkxPACLqboRZhpK6XHgJ8QoKXe4ucP9cs79MQ5Co1Y9I+8Z3CMFAJglcuzFKyp9C+PZrtd2xTJuRiaegCp/hZFK1vHD8XAPLuNmhBjYn8SBIwFmkR+Oh6ZRq74iT/5V+g1D6q1XgZOR98pCW4vVzPW6jhlRWWgPF3pwEQ2A788FXx+Lo8DFVY1GUEMQONJJWptsyLJRcwpcn+RVTB05NjgJAszV8+Yclieo9GYXZ9k6cCyMZ5J1yswqQNKjtSdzB8APx0PMIkF6TAnpzr99f4WDXwXQ28155npdExHocjtRYpVi4KZF39qT+a73B0GkbLlYk1YQAAAAAElFTkSuQmCC') no-repeat center !important;
    }
    #browser.win.win10 #header #titlebar .window-buttongroup button.window-close {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAFVSURBVCiRldKxasJAGMDxz8tdQrR4aBuHQrFgwUGKFIqDz2G66RuID5MnaLda6WO4VAcHoVoEKXQxqc1pTOzlknTRElqQ+J9u+H7HHXwpiDUq1QuYiI6iKg2JkCIAQMD9Ofe2T74gRnXWX+xnU/vDuFzTMzR9T7W8KhEcvw8CXwAzl96GOa3KZND7heNyTc9quS49o3AoZtmwMpd6ZTLopUaleoGeyvP8eUE9qHZ9fiw88cWKCBPRoVo+EQIAoFpODSTcRoqq6H//dCgsE8AZ5Q5hmVwkVrskQoooguhYBxBFEQq4eD/WBUK8I+5uu4KLxEhwH3z3+xH5ghgra+klhcy0XRSGBqrO+osNc1rMspMgcNZOszwdWrGVu22ksycPVMupWCb/nsdM23XWTvP69eUZILarAABvVzdaIOE2Squ6LONLAADOxTzwvC4KQ6M8HVr72R9vjo7cK7Tw7wAAAABJRU5ErkJggg==') no-repeat center !important;
    }
    #browser.win.win10 #header #titlebar .window-buttongroup button.window-maximize {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAF6SURBVDiNpZO9S1xBFMXPuTNvVyRaiC4otn7ABiOYxk4bY+3+m9pnq5AuhAgmYFiFQJLCQjZFFHHNmznX5u26xmheyIGBywy/H/NxB/jP8PeJ5eWNWdJ2Rb0w4zMAEHFpiR/d1T09Pew/Klhpb2y72ImhCIw0IFYrCS5XKstM84OT48M3QyYMi9XnL7ecYa9oNBshRpIGEtUwmAVaCCG7L8215q/752dfAcAAYLG9OSNZp4iNppk9el4zQxEbTck6i+3NmZFgUtopzMJT8D2JWZiUdkYCQOuIMTwF3kuMgdD6mABTd+XfYzA4MDUu+BceAsDqBYfYJaT6BggOXIwJ/EhKuTaulAE/GgkGcaKbk7Jq7EJKyCnlQZzoAlUj/Tz/PmjNLlwlaMVokXzQ4RUslKm8CcL+l+N3JyMBAPT7Z9/mWvPXuUyrdCdIuhPugLugMimVv5KZH/Q+f3g75P74mUR7xehr5pgGABEXnvgpkq97vfc/6t5VrdwCBjyZN42iRr4AAAAASUVORK5CYII=') no-repeat center !important;
    }
    #browser.win.win10 #header #titlebar .window-buttongroup button.window-minimize {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAF6SURBVDiNpZO9S1xBFMXPuTNvVyRaiC4otn7ABiOYxk4bY+3+m9pnq5AuhAgmYFiFQJLCQjZFFHHNmznX5u26xmheyIGBywy/H/NxB/jP8PeJ5eWNWdJ2Rb0w4zMAEHFpiR/d1T09Pew/Klhpb2y72ImhCIw0IFYrCS5XKstM84OT48M3QyYMi9XnL7ecYa9oNBshRpIGEtUwmAVaCCG7L8215q/752dfAcAAYLG9OSNZp4iNppk9el4zQxEbTck6i+3NmZFgUtopzMJT8D2JWZiUdkYCQOuIMTwF3kuMgdD6mABTd+XfYzA4MDUu+BceAsDqBYfYJaT6BggOXIwJ/EhKuTaulAE/GgkGcaKbk7Jq7EJKyCnlQZzoAlUj/Tz/PmjNLlwlaMVokXzQ4RUslKm8CcL+l+N3JyMBAPT7Z9/mWvPXuUyrdCdIuhPugLugMimVv5KZH/Q+f3g75P74mUR7xehr5pgGABEXnvgpkq97vfc/6t5VrdwCBjyZN42iRr4AAAAASUVORK5CYII=') no-repeat center !important;
    }
    /**[Back and forward custom buttons]**/
    
    .button-toolbar.back svg {
        display: none !important;
    }
    .button-toolbar.back {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAGSSURBVDiNpZLPTtNBEMe/M7NbtNeWGpV44EAwPSJnwwugZx/BeCPFZ0CuJr4B8Ui4mvgAFI4VGhJMTKh/miqQaNLf7sx4oLSIEH7Gb7KX3f1+5juzC/yn6PLG3NziLBgvQb5MhDoAONAn4y041rrd7Y/XAuabj16Y4VUIMbJwAPHZgRvMLOeUEjNW9zs7r889Mq7cXHwO0Fpl6laVRZiIQITRIjAzi4Sopo9rjfvHg36vPU4w21x4EJ33YmWqSvxXV3/IzZGK4a9E9vCws/uJASC4tEQk3mQGAGKCiMTg0gKAUZP2lEOIN7pH4hAiwZ5MAI7GFQ9yfQoQ3HHnQgL8ix9+dp0mAMJXuJcnwOGELxOAYVM1p7J21Zxg2BwDNNC6ZU1eIoW7wXJOGmgdGH2kH996p/Xpme9meYlZKkRXD8TdkYriJ4FXDjrt92MAAAz6Rzu1xr0TzXmJACJmnkzWYVlzKoohCKvdD+035z65WGHQ77XrtZkNdb1tpnctp6ppNjX9rKpvxcOz7t72u7KzKqXfCiClhcGYfsEAAAAASUVORK5CYII=') no-repeat center !important;
    }
    .button-toolbar.forward svg {
        display: none !important;
    }
    .button-toolbar.forward {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAGSSURBVDiNpZLPTtNBEMe/M7NbtNeWGpV44EAwPSJnwwugZx/BeCPFZ0CuJr4B8Ui4mvgAFI4VGhJMTKh/miqQaNLf7sx4oLSIEH7Gb7KX3f1+5juzC/yn6PLG3NziLBgvQb5MhDoAONAn4y041rrd7Y/XAuabj16Y4VUIMbJwAPHZgRvMLOeUEjNW9zs7r889Mq7cXHwO0Fpl6laVRZiIQITRIjAzi4Sopo9rjfvHg36vPU4w21x4EJ33YmWqSvxXV3/IzZGK4a9E9vCws/uJASC4tEQk3mQGAGKCiMTg0gKAUZP2lEOIN7pH4hAiwZ5MAI7GFQ9yfQoQ3HHnQgL8ix9+dp0mAMJXuJcnwOGELxOAYVM1p7J21Zxg2BwDNNC6ZU1eIoW7wXJOGmgdGH2kH996p/Xpme9meYlZKkRXD8TdkYriJ4FXDjrt92MAAAz6Rzu1xr0TzXmJACJmnkzWYVlzKoohCKvdD+035z65WGHQ77XrtZkNdb1tpnctp6ppNjX9rKpvxcOz7t72u7KzKqXfCiClhcGYfsEAAAAASUVORK5CYII=') no-repeat center !important;
    }
    .button-toolbar.back:hover {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NTUxRThFNDY5NDkwMTFFNkI0QTg4MTVGNERDQ0I5RTkiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NTUxRThFNDc5NDkwMTFFNkI0QTg4MTVGNERDQ0I5RTkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo1NTFFOEU0NDk0OTAxMUU2QjRBODgxNUY0RENDQjlFOSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo1NTFFOEU0NTk0OTAxMUU2QjRBODgxNUY0RENDQjlFOSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PrLbTfcAAAGUSURBVHjapFNNS8NAEN3ZbBT0KnpSUCFV60nbome9+vEzRL1J629o61EF/4Xo1Z5batuT1bQgiieL5wp1k11nliQttBKkQwjZzby3b2begtaajROCXgAQbThOeolxds5A7+P2DO3hEV+g+B1+5Fut6luYS4eDeQUEK8nUqVKsIIRtc4sLBjzIVEwp5XlSSs5Zzm3WLocInGT6GGkK9sTkNK03tnYiVY1KKeDRTMpeFxXl2s3H64hgeT21YGv+guAp4H1wCBwMQ/LT+5agVl+fah9Go9BW1rIsOw5s+oU5lEsYWgdFqkOOhceBw6BcYOogmgJ2d3ZzezdKGKx/VDTKJWwgmxtQ8L8g54B5QgXAOvXyw3yoIq4EotDAPvsKFLv1fU+GwLgSKJcwEYEvoKg8X9JI40g0mQotRRgjPjRSYi1zhKsL20Yj8T+MpI0HuqDhzH2u3gxZ2UmmTlBaUeCYcFQi6JOpGRV65GXUnG03a1cj7wJFIpFZVFzlUMUe/jSj0gAddOC9pUXedSvvQ5dpnPgVYAD0XdcqQ9ub+QAAAABJRU5ErkJggg==') no-repeat center !important;
    }
    .button-toolbar.forward:hover {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NjExNjM0OTM5NDkwMTFFNjlBNEVBMUQxNjhGQUNGNTciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NjExNjM0OTQ5NDkwMTFFNjlBNEVBMUQxNjhGQUNGNTciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo2MTE2MzQ5MTk0OTAxMUU2OUE0RUExRDE2OEZBQ0Y1NyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo2MTE2MzQ5Mjk0OTAxMUU2OUE0RUExRDE2OEZBQ0Y1NyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PuC1xSIAAAGZSURBVHjapFM9TwJBEN3Z25VEaqXSaEwAxUqRaK2tH//CRC0FfoMQOzX+DKOWGksMoJWoXKImVpLYYoJ7t+vswl4uOUQTpthidt6bN7NvQSlFhgmmDwAIEqlUbpoAKSoqNzA7pnPY45MoOCeSHLhu7dXW6uZgjh5BOpPdk5KUGOecUsoI0F6lJNKXnucJQSkpPDfqRxGCZGZpB2lKnMfiQLuEC8urgbL722sDEN+dNg5dcBu1k4BgZj47yRV94iOxUQsOhyUyJNKQfAmQsy8P9XejkSkn7zgO7we2QEuka3StxuicIQAiNyljfNC2wyTdWrkVvAJOkQCkCc88KBZX1kjl5nI8pAB3MYwPFJAPPCeszN/CKryrXOmurUABGuTM9z3xH7BuYmoRExD4DMpoE6HQMH+B9bNLzxcaY8a3RkrP5bYVqEP0Qtw6M2Ik7QHRaePM+83H6mnEyslMdhellfGVOGUOM+vteploI2svo+a826gf9/0L5j+kl6d88IpomHW8THSXDC3sfkElLTWb1bfIZxomfgQYANgU2RL93s40AAAAAElFTkSuQmCC') no-repeat center !important;
    }
    /**[Tab close custom buttons]**/
    
    .tab-position .tab .close {
        display: none !important;
    }
    .toolbar .button-toolbar {
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: transparent;
        background-repeat: no-repeat;
        background-position: 50% 50%;
        border: 0 solid transparent;
        min-width: 34px;
        height: 24px;
        margin: 0;
        padding: 0;
        background-size: 26px 26px;
        color: inherit;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    /**[Tabs to left edge]**/
    
    #tabs-container {
        background: #303541 !important;
        border-bottom: 1px solid #484e5c !important;
        margin-left: -4px !important;
    }
    /**[Tab progress bar colour]**/
    
    .tab-position .tab .progress-indicator {
        background-color: #f25157 !important;
    }
    /**[Toolbar button hover colour]**/
    
    .button-toolbar.next:hover,
    .button-toolbar.rewind:hover,
    .button-toolbar.reload:hover,
    .button-toolbar.home:hover,
    #tabs-container .trash {
        -webkit-filter: sepia(0%) hue-rotate(0deg) saturate(0) brightness(70%) opacity(10%) !important;
    }
    /**[Toolbar button colour]**/
    
    .button-toolbar.next,
    .button-toolbar.rewind,
    .button-toolbar.reload,
    .button-toolbar.home,
    #tabs-container .trash {
        -webkit-filter: sepia(0%) hue-rotate(0deg) saturate(0) brightness(70%) opacity(60%) !important;
    }
    /**[Button opacity for unused, reduce to .5 for default]**/
    
    button:disabled {
        opacity: 1 !important;
    }
    /**[Inactive tab text opacity]**/
    
    .isblurred .title {
        opacity: .5;
    }
    /**[Skew tabs]**/
    
    .tab-position .tab {
        -webkit-transform: skew(-20deg) !important;
    }
    /**[Active tab title opacity]**/
    
    .tab-position .tab.active .tab-header .title {
        opacity: 0;
    }
    /**[Tab title font etc]**/
    
    .tab-position .tab-header .title {
        font-family: 'Open Sans';
        font-size: 7pt !important;
        text-align: center !important;
        display: block !important;
    }
    .tab-position .tab .title {
        display: flex;
        flex: 1;
        padding-bottom: 5px !important;
        margin: 0 3px 0 6px;
        overflow: hidden;
        white-space: nowrap;
        line-height: 18px;
        -webkit-mask-image: -webkit-linear-gradient(180deg,transparent,#fff 12px);
        -webkit-mask-position: top right;
    }
    /**[center]**/
    
    .addressfield form input.url {
        font-size: 8pt !important;
        height: 21px !important;
        margin-top: -4px !important;
        opacity: .7;
        text-align: center !important;
    }
    /**[Remove focus outline, not that it seems to work, if you know the solution let me know please]**/
    
    input:focus {
        outline: none !important;
    }
    @-webkit-keyframes bounceInRight {
        from, 60%, 75%, 90%, to {
            -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        }
        from {
            opacity: 0;
            -webkit-transform: translate3d(3000px, 0, 0);
            transform: translate3d(3000px, 0, 0);
        }
        60% {
            opacity: 1;
            -webkit-transform: translate3d(-25px, 0, 0);
            transform: translate3d(-25px, 0, 0);
        }
        75% {
            -webkit-transform: translate3d(10px, 0, 0);
            transform: translate3d(10px, 0, 0);
        }
        90% {
            -webkit-transform: translate3d(-5px, 0, 0);
            transform: translate3d(-5px, 0, 0);
        }
        to {
            -webkit-transform: none;
            transform: none;
        }
    }
    @keyframes bounceInRight {
        from, 60%, 75%, 90%, to {
            -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        }
        from {
            opacity: 0;
            -webkit-transform: translate3d(3000px, 0, 0);
            transform: translate3d(3000px, 0, 0);
        }
        60% {
            opacity: 1;
            -webkit-transform: translate3d(-25px, 0, 0);
            transform: translate3d(-25px, 0, 0);
        }
        75% {
            -webkit-transform: translate3d(10px, 0, 0);
            transform: translate3d(10px, 0, 0);
        }
        90% {
            -webkit-transform: translate3d(-5px, 0, 0);
            transform: translate3d(-5px, 0, 0);
        }
        to {
            -webkit-transform: none;
            transform: none;
        }
    }
    @-webkit-keyframes bounceInLeft {
        from, 60%, 75%, 90%, to {
            -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        }
        0% {
            opacity: 0;
            -webkit-transform: translate3d(-3000px, 0, 0);
            transform: translate3d(-3000px, 0, 0);
        }
        60% {
            opacity: 1;
            -webkit-transform: translate3d(25px, 0, 0);
            transform: translate3d(25px, 0, 0);
        }
        75% {
            -webkit-transform: translate3d(-10px, 0, 0);
            transform: translate3d(-10px, 0, 0);
        }
        90% {
            -webkit-transform: translate3d(5px, 0, 0);
            transform: translate3d(5px, 0, 0);
        }
        to {
            -webkit-transform: none;
            transform: none;
        }
    }
    @keyframes bounceInLeft {
        from, 60%, 75%, 90%, to {
            -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        }
        0% {
            opacity: 0;
            -webkit-transform: translate3d(-3000px, 0, 0);
            transform: translate3d(-3000px, 0, 0);
        }
        60% {
            opacity: 1;
            -webkit-transform: translate3d(25px, 0, 0);
            transform: translate3d(25px, 0, 0);
        }
        75% {
            -webkit-transform: translate3d(-10px, 0, 0);
            transform: translate3d(-10px, 0, 0);
        }
        90% {
            -webkit-transform: translate3d(5px, 0, 0);
            transform: translate3d(5px, 0, 0);
        }
        to {
            -webkit-transform: none;
            transform: none;
        }
    }
    #browser .window-buttongroup {
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-delay: 1.5s;
        animation-delay: 1.5s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
        -webkit-animation-name: bounceInLeft;
        animation-name: bounceInLeft;
    }
    .tab-strip {
    
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-delay: 1.5s;
        animation-delay: 1.5s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
        -webkit-animation-name: bounceInRight;
        animation-name: bounceInRight;
    }
    
    As you can see  :blink: 
    
    Sean[/center]
    


  • Hmm, it seems to work here. I replaced my custom.css with yours, and appended the following. Attaching screenshot of what it looks like. Perhaps we are using different versions of Vivaldi?

    
    .tab-strip {
        display: flex;
        flex-direction: row;
    }
    .tab-position {
        position: relative !important;
        flex: 1 1 100px !important;
        left: auto !important;
        top: auto !important;
    }
    
    #tabs-container .newtab {
        position: relative !important;
        left: auto !important;
        top: auto !important;
    }
    
    

    Vivaldi 1.4.589.38 (Stable channel) (32-bit)
    Revision afa9b018e32575fcd8f8283755a315804ecf0671

    The screenshot is being shown with very low resolution for some reason. Here's a link: https://www.dropbox.com/s/gxupj70x5cn27em/Screenshot 2016-10-17 22.27.44.png?dl=0
    Attachments:



  • I shall give it another go, thanks very much! I do use latest snapshots though so that could be the problem. I'll place my new tab back to the left too hopefully.

    Update

    Yes it must be the version difference, it def doesn't work here, high five for doing that though, I'll see if I can adjust some bits to get it working B)


Log in to reply
 

Looks like your connection to Vivaldi Forum was lost, please wait while we try to reconnect.