/*
 *	LiveArt styles 
 * 	dependence: Twitter Bootstrap 3.2.0
 *
 *	Contents:
 *	1. General
 *	2. LiveArt App Page
 *	3. LiveArt Canvas and Main Components
 *	4. LiveArtForms Menu
 * 		4.1 Forms Components, styles for all tabs header, thumbnails
 *      4.1.1 Search
 *      4.1.2 Back button
 *		4.1.4 Forms Components - Categories Subcategories catalog
 *      4.2.2 Product Dimension Form
 * 		4.3 Add Text Form
 * 		4.4 Names Numbers Form
 * 		4.5 Upload Form
 *      4.6 Change color form
 *	5. Preview Menu
 *		5.1 Main Menu 
 *		5.2 Product Sides Switch (Ian)
 *		5.3 Zoom 
 *	6. Order Options (Vanja)
 *		6.1 Components
 *		6.2 Product info, colors, material
 *		6.3 Save, Share
 *		6.4 Sizes, Quantities
 *  7. Modals
 *       - general styles
 *       - Saved designs popup
 *       - Upload conditions popup
 *       - Upload Color Count Modal
 *
*/

/*	1. General styles	*/

html, body {
    background-color: #ebebeb;
    margin: 0;
    padding: 0;
}

*:focus {
    outline: none !important;
}

body {
    height: 100%;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 12px;
}

a, .btn > input[type=radio] {
    cursor: pointer;
}

a, a:hover {
    text-decoration: none;
    color: black;
}

label {
    font-size: 12px;
    font-weight: normal;
}

h5, h6 {
    line-height: 1.42857143;
}

h5 {
    font-weight: bold;
}

::-webkit-scrollbar {
    width: 7px;
    height: 7px;
    border: 1px solid #E0E0E0;
    border-radius: 3px;
    background-color: #E9E9E9;
    -moz-box-shadow: inset 0 1px #DCDCDC;
    -webkit-box-shadow: inset 0 1px #DCDCDC;
    box-shadow: inset 0 1px #DCDCDC;
}

::-webkit-scrollbar-track {
    border-radius: 3px;
}

::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background-color: #333333;
}

.bold {
    font-weight: bold;
}

.btn {
    -webkit-border-radius: 0px !important;
    -moz-border-radius: 0px !important;
    border-radius: 0px !important;
    padding: 4px 12px;
    font-size: 12px !important; 
    height: 28px;
}
    .btn > .caret {
        border-top: 4px solid #000000 !important;
    }

.btn-small > .caret {
    margin-top: 8px !important;
}

.btn.btn-default {
    background-color: #e6e6e6;
    background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
    background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
    border: 1px solid #cccccc;
    border-color: #e6e6e6 #e6e6e6 #bfbfbf;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    border-bottom-color: #b3b3b3;
}

.btn.btn-primary {
    border-left: 1px solid #0044cc;
    border-right: 1px solid #0044cc;
    border-top: 1px solid #0044cc;
    border-bottom: 1px solid #b3b3b3;
    background-color: #006dcc;
    background-image: linear-gradient(to bottom, #0088cc, #0044cc);
}

.btn.btn-inverse {
    color: #FFF;
    background-color: #363636;
    background-image: linear-gradient(to bottom, #444, #222);
    background-repeat: repeat-x;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
}

.btn.btn-round {
    width: 23px;
    height: 23px;
    padding: 0;
    margin: 0;
    border-radius: 10px !important;
}

    .btn.btn-round > i {
        margin-top: 0px !important;
        margin-left: 1px;
    }

.btn-link,
.btn-link:hover,
.btn-link:focus {
    color: #000;
}

    .btn-link[disabled],
    .btn-link[disabled]:hover,
    .btn-link[disabled]:focus {
        background: none;
        color: #999;
        opacity: 1;
    }

.btn-group > .btn + .dropdown-toggle {
    padding-right: 7px;
    padding-left: 7px;
}

.btn-group > .dropdown-menu {
    border: 1px solid #ccc;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.15);
    -moz-box-shadow: 0 1px 1px rgba(0,0,0,.15);
    box-shadow: 0 1px 1px rgba(0,0,0,.15);
    min-width: 99%;
}

    .btn-group > .dropdown-menu > li > a {
        font-size: 12px;
    }

        .btn-group > .dropdown-menu > li.active > a,
        .btn-group > .dropdown-menu > li > a:hover {
            color: #fff;
            background: #333;
        }

input[type="text"],
input[type="number"],
textarea {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    font-size: 12px !important;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding-top: 0;
    padding-bottom: 0;
}

    input[type="text"]::-ms-clear {
        display: none;
    }

input[type="number"] {
    padding-right:0px;
}

input.form-control {
    display: inline;
    height: 28px;
}

.input-group-addon {
    border-radius: 2px;
    padding: 4px 8px;
    font-size: 12px;
    line-height: 12px;
}

.dropdown-menu {
    font-size: 12px;
}

/* panels containers has absolute positioning to make the layout more flexible for the future development */
.liveart-panel-container {
    position: absolute;
    margin: 0;
    z-index: 999;
    width: auto;
    height: auto;

}

/*	2. LiveArt App Page	*/
#liveart-main-container {
    width: 945px;
    height: 585px;
    margin: auto;
}

#liveart-content {
    width: 100%;
    height: 100%;
    position: relative;
}

#liveart-header {
    height: 30px;
    width: 100%;
    background: url(../../assets/img/LiveArtLite_logo.png) no-repeat 2px center;
}

#liveart-fonts-preloader-container {
    width: 0px;
    height: 0px;
    position: absolute;
    top: -10000px;
    left: -10000px;
    overflow: hidden;    
}

/* panel is stretched to its container */
.liveart-panel {
    border: 0px;
    background-color: #ffffff;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.15);
    -moz-box-shadow: 0 1px 1px rgba(0,0,0,.15);
    box-shadow: 0 1px 1px rgba(0,0,0,.15);
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    width: 100%;
    height: 100%;
}

/* blue progress bar preloader */
#liveart-init-preloader {
    top: 50%;
    position: absolute;
    width: 400px;
    left: 50%;
    margin-left: -200px;
    height: 50px;
    margin-top: -25px;
}

/*	 3. LiveArt Canvas and Main Components	*/
#main-controls-container {
    /*width: 170px;
	height: 200px;*/
    top: 0;
    left: 0;
    z-index: 1020;
}

#canvas-container {
    width: 587px;
    height: 543px;
    margin-left: 156px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background-color: white;
}

#alert-container {
    position: absolute;
    left: 156px;
    width: 587px;
    max-height: 250px;
    overflow-y: auto;
    z-index:20;
}
    #alert-container .alert {
        margin: 0;
    }
    #alert-container span {
        margin-left: 5px;
    }

#product-sides-switch-container {
    background: transparent; /* for old browsers (IE8) */
    background: rgba(255, 255, 255, 0.4);
    bottom: 42px;
    left: 156px;
    width: 587px;
}

#preview-controls-container {
    top: 545px;
    max-width: 751px;
    text-align: center;
}

    /*#preview-controls-container:before {
        content: '';
        display: inline-block;
        height: 100%;
        vertical-align: middle;
        margin-right: -0.25em; *//* Adjusts for spacing */
    /*}*/

    #preview-controls-container > .liveart-button-bar {
        display: inline-block;
        vertical-align: middle;
    }

#order-options-container {
    width: 200px;
    top: 0;
    right: 0;
}

/*	4. LiveArtForms Menu	*/

/*  4.1 Forms Components    */
.liveart-list-view > li > .liveart-dropdown-form {
    position: relative;
    top: -42px;
    left: 42px;
    padding-top: 0px;
    width: auto;
}

.liveart-list-view > li#select-product > a {
    background-image: url(../../assets/img/select-product-icon.png);
    background-repeat: no-repeat;
    background-position: 9px center;
}

    .liveart-list-view > li.open#select-product > a,
    .liveart-list-view > li#select-product > a:hover {
        background-image: url(../../assets/img/select-product-icon-white.png);
    }

.liveart-list-view > li#change-colours > a {
    background-image: url(../../assets/img/select-products-color-icon.png);
    background-repeat: no-repeat;
    background-position: 9px center;
}

    .liveart-list-view > li.open#change-colours > a,
    .liveart-list-view > li#change-colours > a:hover {
        background-image: url(../../assets/img/select-products-color-icon-white.png);
    }

.liveart-list-view > li#add-text > a {
    background-image: url(../../assets/img/text-icon.png);
    background-repeat: no-repeat;
    background-position: 11px center;
}

    .liveart-list-view > li.open#add-text > a,
    .liveart-list-view > li#add-text > a:hover {
        background-image: url(../../assets/img/text-icon-white.png);
    }

.liveart-list-view > li#add-graphics > a {
    background-image: url(../../assets/img/add-graphics-icon.png);
    background-repeat: no-repeat;
}

    .liveart-list-view > li.open#add-graphics > a,
    .liveart-list-view > li#add-graphics > a:hover {
        background-image: url(../../assets/img/add-graphics-icon-white.png);
    }

.liveart-list-view > li#add-names > a {
    background-image: url(../../assets/img/add-numbers-icon.png);
    background-repeat: no-repeat;
}

    .liveart-list-view > li.open#add-names > a,
    .liveart-list-view > li#add-names > a:hover {
        background-image: url(../../assets/img/add-numbers-icon-white.png);
    }

.liveart-list-view > li#upload-graphics > a {
    background-image: url(../../assets/img/upload-graphics-icon.png);
    background-repeat: no-repeat;
}

    .liveart-list-view > li.open#upload-graphics > a,
    .liveart-list-view > li#upload-graphics > a:hover {
        background-image: url(../../assets/img/upload-graphics-icon-white.png);
    }

.liveart-list-view > li#clear-design > a {
    background-image: url(../../assets/img/red-cross-icon.png);
    background-repeat: no-repeat;
}

    

.liveart-list-view > li > a,
.liveart-list-view > li > a:focus {
    height: 38px;
    background-color: #ffffff;
    border: 1px solid #ffffff;
    background-position: 10px center;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.15);
    -moz-box-shadow: 0 1px 1px rgba(0,0,0,.15);
    box-shadow: 0 1px 1px rgba(0,0,0,.15);
    margin-bottom: 2px;
    color: #000000;
}

    .liveart-list-view > li.open > a,
    .liveart-list-view > li.open > a:hover,
    .liveart-list-view > li.open > a:focus,
    .liveart-list-view > li > a:hover {
        border-color: #000000;
        border-bottom-color: #333333;
        background-color: #333333;
        color: #ffffff;
    }

    .liveart-list-view > li > a:focus > span {
        display: none;
    }

    .liveart-list-view > li > a > span {
        padding-left: 22px;
        font-size: 12px;
    }

.liveart-list-view#liveart-main-menu {
    width: 154px;
    /*transition: width 0.5s;*/
    /*-moz-transition: width 0.5s, -moz-transform 0.5s; /* Firefox */
    /*-webkit-transition: width 0.5s, -webkit-transform 0.5s; /* Safari and Chrome */
    /*-o-transition: width 0.5s, -o-transform 0.5s; /* Opera */
}

    .liveart-list-view#liveart-main-menu.collapsed {
        width: 40px;
        /*transition: width 0.5s;*/
        /*-moz-transition: width 0.5s, -moz-transform 0.5s; /* Firefox */
        /*-webkit-transition: width 0.5s, -webkit-transform 0.5s; /* Safari and Chrome */
        /*-o-transition: width 0.5s, -o-transform 0.5s; /* Opera */
    }


    .liveart-list-view#liveart-main-menu > li > a > span {
        display: inline;
    }

    .liveart-list-view#liveart-main-menu.collapsed > li > a > span {
        display: none;
    }

.liveart-dropdown-form#select-product-form,
.liveart-dropdown-form#add-graphics-form {
    width: 482px;
    padding-bottom: 0px;
}

.liveart-dropdown-form#add-text-form,
.liveart-dropdown-form#upload-graphics-form {
    width: auto;
}

.liveart-dropdown-form-header {
    padding: 10px 10px 11px 22px;
    background-color: #333333;
    color: #ffffff;
}

.liveart-close-window-btn {
    display: block;
    float: right;
    width: 20px;
    height: 20px;
    background-image: url(../../assets/img/close-window-icon.png);
}

    .liveart-close-window-btn:hover,
    .liveart-close-window-btn:active {
        background-image: url(../../assets/img/close-window-icon-white.png);
    }

.tabs-left {
    height: 100%;
}

    .tabs-left .liveart-scroll-pane {
        overflow-y: scroll;
        overflow-x: hidden;
        float: left;
        height: 100%;
    }

    .tabs-left .liveart-tabs {
        background-color: #f8f8f8;
        height: 100%;
        margin: 1px 0px 0px 0px;
    }

        .tabs-left .liveart-tabs > li > a {
            white-space: nowrap;
            width: 105px;
            padding: 10px 22px 9px 22px;
            margin-bottom: 0px !important;
            border-left: none !important;
            border-radius: 0px !important;
            -webkit-border-radius: 0px !important;
            -moz-border-radius: 0px !important;
            color: #000000;
        }

        .tabs-left .liveart-tabs > li:first-child > a {
            border-top: none !important;
        }

        .tabs-left .liveart-tabs > li > a:hover {
            border-color: #dddddd;
        }

        .tabs-left .liveart-tabs > li.active > a {
            color: #000000;
            font-weight: bold;
        }

/*   4.1.1 Search   */
.search-box {
    
}

    .search-box .input-group {
        margin: 9px 0px 0px 10px;
    }

        .search-box .input-group input {
            width: 417px;
        }

        .search-box .input-group .input-group-addon {
            -webkit-border-radius: 2px 0 0 2px;
            -moz-border-radius: 2px 0 0 2px;
            border-radius: 2px 0 0 2px;
        }

        .search-box .input-group .close {
            position: absolute;
            right: 30px;
            line-height: 28px;
            z-index: 2;
        }

/*  4.1.2 Back button   */
.liveart-back-btn {
    display: block;
    float: left;
    width: 111px;
    height: 112px;
    margin-left: 10px;
    background-image: url(../../assets/img/back-icon.png);
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

    .liveart-back-btn:hover, .liveart-back-btn:active {
        background-image: url(../../assets/img/back-icon-white.png);
        background-color: #333333;
    }

/* 	4.1.4 Catalog with categories and subcategories (new, N-level navigation)*/
ul.liveart-categories-subcategories {
	margin: 0;
    margin-left: 10px;
	padding: 0;
	height: 334px;
	width: 472px;
	overflow-y: scroll;
	overflow-x: hidden;
}

ul.liveart-categories-subcategories.narrow {
	width: 361px;
}

#add-graphics-form .liveart-back-btn {
	padding: 32px;
	padding-right: 31px;
}

/*	cell renderer   */
ul.liveart-categories-subcategories > li {
	margin: 0;
	margin-right: -1px;
	margin-bottom: -1px;
	padding: 0;
    float: left;
	border-radius: 0px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	width: 112px;
	height: 112px;
	position: relative;
	cursor: pointer;
	border-color: #333333;
}

ul.liveart-categories-subcategories > li:last-child {
	margin-right: 0px;
}

	/*ul.liveart-categories-subcategories > li.category.active {
		background-image: url(../../assets/img/check-icon-white.png);
		background-repeat: no-repeat;
		background-position: 85px 5px;
	}
	*/

    ul.liveart-categories-subcategories > li.product {
        /*  space for label below  */
        margin-bottom: 25px;
    }

/*	cell content   */
ul.liveart-categories-subcategories > li > a {
	display: block;
	font-weight: bold;
	text-decoration: none;
	position: absolute;	
    bottom: 0; 
    width: 110px;
    height: 110px;
}

/*  cell image  */
    ul.liveart-categories-subcategories > li > a > img {
	    width: 110px;
        height: 110px;
    }
    ul.liveart-categories-subcategories > li > a > img[src$='svg'] {
        padding: 20px;
    }
    ul.liveart-categories-subcategories > li > a > img[src=''] {
       display: none;
    }  

 /*  cell label  */
	ul.liveart-categories-subcategories > li.image > a > span {
		display: none;
	}

    ul.liveart-categories-subcategories > li > a > span {
        position: absolute;
        top: 113px;
        text-overflow: ellipsis;
        font-weight:normal;
        white-space: nowrap;
        max-width: 112px;
        overflow-x: hidden;
        overflow-y: hidden;
    }

    ul.liveart-categories-subcategories > li.category > a > span {
        top: 83px;
        max-width: 110px;
        padding: 5px 10px;
        font-weight:bold;
        background-color: white;

        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

    ul.liveart-categories-subcategories > li.category:hover > a > span,
    ul.liveart-categories-subcategories > li.category:active > a > span {
        background-color: #333;
        color: white;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

/*  cell selection mark and highlight border    */
    ul.liveart-categories-subcategories > li > a > div.state {
	    width: 110px;
	    height: 110px;
	    position: absolute;
	    border: 5px solid transparent;
	    background-color: transparent;
  	    -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
	    top: 0px;
	    left: 0px;
    }

    ul.liveart-categories-subcategories > li:hover > a > div.state,
    ul.liveart-categories-subcategories > li.active > a > div.state {
	    border-color: #333333;
    }

    ul.liveart-categories-subcategories > li.active > a > div.state {
	    background-image: url(../../assets/img/check-icon.png);
	    background-repeat: no-repeat;
	    background-position: center center;
    }

    ul.liveart-categories-subcategories > li.category > a > div.state {
        display: none;
    }
/* 	end of 4.1.4 Catalog with categories and subcategories */

/*  4.2.2 Product Dimension Form  */
#liveart-main-menu.collapsed > li#main-controls-product-dimensions {
    display: none;
}

#main-controls-product-dimensions.liveart-panel {
    margin-top: -2px;
    margin-bottom: 2px;
    padding: 10px 10px 5px 10px;
}

    #main-controls-product-dimensions.liveart-panel .form-horizontal .control-group {
        
    }

    #main-controls-product-dimensions.liveart-panel .form-horizontal .control-label {
        width: 40px;
        text-align: left;
        padding-top: 4px;
    }

    #main-controls-product-dimensions.liveart-panel .form-horizontal .controls {
        width: 68px;
        display: inline-block;
    }

    #main-controls-product-dimensions.liveart-panel input[type='number'] {
        
    }

    #main-controls-product-dimensions.liveart-panel .form-horizontal .btn-group #selectedProductSize {
        width: 110px;
    }

    #main-controls-product-dimensions.liveart-panel .tooltip {
        min-width: 150px;
    }

    #main-controls-product-dimensions #productDimensionsSwapGroup {
        min-height: 10px;
        margin: 0;
    }

    #main-controls-product-dimensions #productDimensionsSwapGroup button {
          height: 20px;
          padding-top: 2px;
          width: 68px;
          margin-left: 43px;
          margin-top: -1px;
          margin-bottom: -1px;
    }

/*  4.3 Add Text Form   */
.liveart-list-view > li#add-text > .liveart-dropdown-form > div#add-text-form-content {
    padding-bottom: 10px;
    margin: 0px;
    width: 210px;
}

    .liveart-list-view > li#add-text > .liveart-dropdown-form > div#add-text-form-content > div,
    .liveart-list-view > li#add-text > .liveart-dropdown-form > div#add-text-form-content > h6 {
        margin-top: 0px;
        margin-bottom: 10px;
        margin-left: 20px;
    }

        .liveart-list-view > li#add-text > .liveart-dropdown-form > div#add-text-form-content > div.divider {
            margin-right: 20px;
        }

.liveart-list-view > li#add-text h6 {
    color: #333;
    font-size: 12px;
    font-weight: normal;
    margin: 3px 0;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form input[type='text'] {
    padding: 4px 6px;
}

    .liveart-list-view > li#add-text > .liveart-dropdown-form input[type='text']#add-text-input {
        width: 83px;
    }

    .liveart-list-view > li#add-text > .liveart-dropdown-form input[type='text']#edit-text-input {
        width: 119px;
    }

.liveart-list-view > li#add-text > .liveart-dropdown-form textarea {
    width: 100%;
    height: 60px;
    border-left: none;
    border-right: none;
    border-top: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    -moz-box-shadow: inset 0px 3px 6px 0px #C9C9C9;
    -webkit-box-shadow: inset 0px 3px 6px 0px #C9C9C9;
    box-shadow: inset 0px 3px 6px 0px #C9C9C9;
    background: #f5f5f5;
    resize: vertical;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 10px;
    padding: 4px 6px;
    font-size: 14px !important;
    line-height: 20px;
    color: #555555;
    vertical-align: middle;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-align-group.btn-group {
    margin-right: 10px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #add-text-btn {
    vertical-align: top;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #add-text-btn {
    display: inline-block;
    width: 74px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form .btn-group .btn#font-btn,
.liveart-list-view > li#add-text > .liveart-dropdown-form .btn-group .btn#text-effects-btn {
    width: 146px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form .btn-group .btn#font-btn {
    font-size: 18px !important;
    padding: 1px 6px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form .btn-group ul#font-list > li > a {
    font-size: 18px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form .btn-group #text-font-options {
    margin-top: 7px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form .btn,
.liveart-list-view > li#add-text > .liveart-dropdown-form div.colorPicker-picker {
    height: 28px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form div.colorPicker-picker {
    width: 28px;
    background-size: 26px 26px;
    margin-left: 5px;
}

/*.liveart-list-view > li#add-text > .liveart-dropdown-form #text-fill-color-picker+div.colorPicker-picker {
    width: 42px;
    margin-left: 15px;
}*/

.liveart-list-view > li#add-text > .liveart-dropdown-form div.colorPicker-picker {
    line-height: 44px;
}

/*.liveart-list-view > li#add-text > .liveart-dropdown-form .liveart-color-picker#text-stroke-color-picker + div.colorPicker-picker {
	width: 28px;
	float: right;
}
.liveart-list-view > li#add-text > .liveart-dropdown-form .liveart-color-picker#text-stroke-color-picker + div.colorPicker-picker.transparent {
	background-size: 28px 28px;
}
.liveart-list-view > li#add-text > .liveart-dropdown-form .liveart-color-picker#text-color-picker + div.colorPicker-picker {
	width: 58px;
}*/

.liveart-list-view > li#add-text > .liveart-dropdown-form > div#add-text-form-content > div#text-font-options {
    margin-top: 5px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form .liveart-color-picker#text-fill-color-picker + div.colorPicker-picker {
    width: 42px;
    margin-left: 15px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-align-left-btn,
.liveart-list-view > li#add-text > .liveart-dropdown-form #text-align-center-btn,
.liveart-list-view > li#add-text > .liveart-dropdown-form #text-align-right-btn,
.liveart-list-view > li#add-text > .liveart-dropdown-form .btn#bold-toggle-btn,
.liveart-list-view > li#add-text > .liveart-dropdown-form .btn#italic-toggle-btn {
    width: 28px;
    text-align: center;
    padding: 0px;
    margin-top: 0px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form .btn#bold-toggle-btn,
.liveart-list-view > li#add-text > .liveart-dropdown-form .btn#italic-toggle-btn {
    margin-right: 5px;
    margin-top: 1px;
    vertical-align: top;
}

    .liveart-list-view > li#add-text > .liveart-dropdown-form .btn#bold-toggle-btn > span,
    .liveart-list-view > li#add-text > .liveart-dropdown-form .btn#italic-toggle-btn > span {
        font-family: "Times New Roman", Times, serif;
        font-size: 16px;
        font-weight: bold;
        text-shadow: none;
    }

    .liveart-list-view > li#add-text > .liveart-dropdown-form .btn#italic-toggle-btn > span {
        font-style: italic;
    }

.liveart-list-view > li#add-text > .liveart-dropdown-form .btn:active#bold-toggle-btn,
.liveart-list-view > li#add-text > .liveart-dropdown-form .btn.active#bold-toggle-btn,
.liveart-list-view > li#add-text > .liveart-dropdown-form .btn.active#italic-toggle-btn,
.liveart-list-view > li#add-text > .liveart-dropdown-form .btn:active#italic-toggle-btn {
    background-color: #575757;
    border-color: #464646;
    -moz-box-shadow: inset 0 1px #4a4a4a;
    -webkit-box-shadow: inset 0 1px #4a4a4a;
    box-shadow: inset 0 1px #4a4a4a;
    background-image: none;
}

    .liveart-list-view > li#add-text > .liveart-dropdown-form .btn:active#bold-toggle-btn > span,
    .liveart-list-view > li#add-text > .liveart-dropdown-form .btn.active#bold-toggle-btn > span,
    .liveart-list-view > li#add-text > .liveart-dropdown-form .btn.active#italic-toggle-btn > span,
    .liveart-list-view > li#add-text > .liveart-dropdown-form .btn:active#italic-toggle-btn > span {
        color: #fff;
    }


.liveart-list-view > li#add-text > .liveart-dropdown-form #text-align-left-btn,
.liveart-list-view > li#add-text > .liveart-dropdown-form #text-align-center-btn,
.liveart-list-view > li#add-text > .liveart-dropdown-form #text-align-right-btn {
    background-repeat: no-repeat;
    background-position: center;
    background-color: #efefef;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-align-left-btn.active,
.liveart-list-view > li#add-text > .liveart-dropdown-form #text-align-center-btn.active,
.liveart-list-view > li#add-text > .liveart-dropdown-form #text-align-right-btn.active {
    background-color: #e0e0e0;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-align-left-btn {
    background-image: url(../../assets/img/text-align-left-icon.png);
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-align-center-btn {
    background-image: url(../../assets/img/text-align-center-icon.png);
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-align-right-btn {
    background-image: url(../../assets/img/text-align-right-icon.png);
}

.liveart-list-view > li#add-text .noUiSlider {
    margin-top: 10px;
    margin-right: 22px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-form-size input[type=text] {
    width: 48px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-form-size input[type=checkbox] {
    margin: 0 5px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-form-size label {
   display: inline;
   margin-left: 50px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-form-size button {
    vertical-align: top;
    width: 74px;
    margin-left: 95px;
    margin-top:10px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-form-size-label {
    margin-right: 9px;
    display: inline;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-form-size-label-seperator {
    font-size: 125%;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-form-size .btn.lock-btn {
     width: 24px;
     height: 28px;
     padding: 2px 2px;
     margin: 0px;
     margin-left: -4px;
     margin-right: -4px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-form-size .btn.lock-btn .icon-lock {
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-top: 1px;
    line-height: 14px;
    vertical-align: text-top;
    background-image: url("../img/glyphicons-lock.png");
    background-position: -14px 0px;
    background-repeat: no-repeat;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-form-size .btn.lock-btn.active .icon-lock {
     background-position: 0px 0px;
}

.liveart-list-view > li#add-text > .liveart-dropdown-form #text-form-size .control-label {
    max-width: 30px;
    overflow: hidden;
    white-space: nowrap;
    display: inline-block;
    vertical-align: middle;
}

/*  simulating btn-group    */
.liveart-list-view > li#add-text > .liveart-dropdown-form .text-form-size-group {

}

.liveart-list-view > li#add-text > .liveart-dropdown-form .text-form-size-group #text-width {
    -webkit-border-top-right-radius: 0px;
    -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius-topright: 0px;
    -moz-border-radius-bottomright: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}
.liveart-list-view > li#add-text > .liveart-dropdown-form .text-form-size-group .lock-btn {
    
}
.liveart-list-view > li#add-text > .liveart-dropdown-form .text-form-size-group #text-height {
    -webkit-border-top-left-radius: 0px;
    -webkit-border-bottom-left-radius: 0px;
    -moz-border-radius-topleft: 0px;
    -moz-border-radius-bottomleft: 0px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}
/*  simulating btn-group end   */

.liveart-list-view > li#add-text > .liveart-dropdown-form  #text-form-size-apply-btn {
    margin-top: 10px;
}

/*  4.4 Names Numbers Form  */
#add-names-form > #add-names-form-content {
    padding: 15px 22px 10px 22px;
    margin: 0px;
    text-align: center;
    width: 480px;
}

#add-names-form #liveart-add-more-names-btn {
    text-decoration: underline;
}

    #add-names-form #liveart-add-more-names-btn:hover {
        text-decoration: none;
    }

#add-names-form #names-controls {
    position: relative;
    display: inline-block;
    font-size: 0;
    white-space: nowrap;
    vertical-align: middle;
}

    #add-names-form #names-controls button {
        width: 110px;
    }

#add-names-form #names-number-table-container {
    margin-bottom: 5px;
    max-height: 210px;
    padding-right: 15px;
    overflow-x: hidden;
    overflow-y: auto;
}

#add-names-form #names-number-table {
    width: 100%;
}

#add-names-form #names-number-table td {
    padding-right: 5px;
    padding-bottom: 5px;
}

    #add-names-form #names-number-table td:last-child {
        padding-right: 0px;
    }

    #add-names-form #names-number-table td input[type="text"] {
        margin-bottom: 0px;
    }

        #add-names-form #names-number-table td input[type="text"].liveart-names-input {
            width: 188px;
        }

        #add-names-form #names-number-table td input[type="text"].liveart-numbers-input {
            width: 93px;
        }

    #add-names-form #names-number-table td div.btn-group.liveart-names-numbers-size > button:first-child {
        width: 60px;
    }

    #add-names-form #names-number-table td div.btn-group.liveart-names-numbers-size > .dropdown-menu {
        min-width: 60px;
    }

/*  4.5 Upload Form   */
.liveart-list-view > li#upload-graphics > .liveart-dropdown-form > div#upload-image-form-content {
    padding: 15px 22px 10px 22px;
    margin: 0px;
}

    .liveart-list-view > li#upload-graphics > .liveart-dropdown-form > div#upload-image-form-content #liveart-upload-upload-image-by-url {
        margin-bottom: 0px;
    }

        .liveart-list-view > li#upload-graphics > .liveart-dropdown-form > div#upload-image-form-content #liveart-upload-upload-image-by-url input {
            width: 83px;
        }

    .liveart-list-view > li#upload-graphics > .liveart-dropdown-form > div#upload-image-form-content #liveart-file-upload-container {
        margin: 0px;
        width: 130px;
    }

    .liveart-list-view > li#upload-graphics > .liveart-dropdown-form > div#upload-image-form-content .invisible {
        width: 0; height: 0;
    }
    
/*  end of 4. LiveArtForms Menu */

/*  4.6 Change color form   */

.liveart-list-view > #change-colours > a {
   display: block;
}

/*  4.6 end Change color form   */

/*	5. Preview Menu	*/
/*	5.1 Main Menu	*/
ul.liveart-button-bar {
    margin-bottom: 0px;
}

            ul.liveart-button-bar > li {
                padding: 0;
                -webkit-border-radius: 0px;
                -moz-border-radius: 0px;
                border-radius: 0px;
                border: 0;
                -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.15);
                -moz-box-shadow: 0 1px 1px rgba(0,0,0,.15);
                box-shadow: 0 1px 1px rgba(0,0,0,.15);
                background-color: #ffffff;
                background-image: none;
                margin-left: 0px;
                margin-right: 1px;
                margin-bottom: 1px;
                height: 40px;
            }

            ul.liveart-button-bar > li:last-child {
                 margin-right: 0px;
            }

            ul.liveart-button-bar > li > a {
                text-shadow: none;
                color: #000000;
                -webkit-border-radius: 0px;
                -moz-border-radius: 0px;
                border-radius: 0px;
                line-height: 20px;
            }

            ul.liveart-button-bar > li:first-child > a {
                -webkit-border-top-left-radius: 2px;
                -moz-border-top-left-radius: 2px;
                border-top-left-radius: 2px;
                -webkit-border-bottom-left-radius: 2px;
                -moz-border-bottom-left-radius: 2px;
                border-bottom-left-radius: 2px;
            }

            ul.liveart-button-bar > li:last-child > a {
                -webkit-border-top-right-radius: 2px;
                -moz-border-top-right-radius: 2px;
                border-top-right-radius: 2px;
                -webkit-border-bottom-right-radius: 2px;
                -moz-border-bottom-right-radius: 2px;
                border-bottom-right-radius: 2px;
            }

             ul.liveart-button-bar > li > a:hover,
             ul.liveart-button-bar > li.open > a:hover,
             ul.liveart-button-bar > li.active > a {
                background-color: #333333;
            }

             ul.liveart-button-bar > li > a:hover,
             ul.liveart-button-bar > li.active > a {
                color: #ffffff;
            }

             ul.liveart-button-bar > li > a > span {
                padding-left: 24px;
            }

            ul.liveart-button-bar > li > a:hover > span,
            ul.liveart-button-bar > li.active > a > span {
                color: #ffffff;
            }

            ul.liveart-button-bar > li#clear-design > a#clear-design-btn {
                background-image: url(../../assets/img/red-cross-icon.png);
                background-position: 12px center;
                background-repeat: no-repeat;
            }

            ul.liveart-button-bar > li#undo > a#undo-btn {
                background-image: url(../../assets/img/undo-icon.png);
                background-position: 9px 14px;
                background-repeat: no-repeat;
            }

                ul.liveart-button-bar > li#undo > a#undo-btn > span {
                    padding-left: 14px;
                }

            ul.liveart-button-bar > li#undo > a:focus#undo-btn,
            ul.liveart-button-bar > li#undo > a:hover#undo-btn {
                background-image: url(../../assets/img/undo-icon-white.png);
            }

            ul.liveart-button-bar > li#redo > a#redo-btn {
                background-image: url(../../assets/img/redo-icon.png);
                background-position: 50px 14px;
                background-repeat: no-repeat;
            }

                ul.liveart-button-bar > li#redo > a#redo-btn > span {
                    padding-left: 0px;
                    padding-right: 14px;
                }

            ul.liveart-button-bar > li#redo > a:focus#redo-btn,
            ul.liveart-button-bar > li#redo > a:hover#redo-btn {
                background-image: url(../../assets/img/redo-icon-white.png);
            }

            ul.liveart-button-bar > li.dropup > .dropdown-menu > li > a {
                background-repeat: no-repeat;
                background-position: center center;
            }

            ul.liveart-button-bar > li.dropup#layers > .dropdown-menu#layers-list > li > a.liveart-text-layer {
                background-image: url(../../assets/img/text-icon.png);
                background-position: 14px center;
            }

                ul.liveart-button-bar > li.dropup#layers > .dropdown-menu#layers-list > li > a.liveart-text-layer > span {
                    padding-left: 42px;
                }

            ul.liveart-button-bar > li.dropup#layers > .dropdown-menu#layers-list > li > a.liveart-image-layer > span {
                padding-left: 10px;
            }

            ul.liveart-button-bar > li.dropup#layers > .dropdown-menu#layers-list > li > a.liveart-image-layer > img {
                width: 22px;
                height: 22px;
                padding-left: 10px;
            }

            ul.liveart-button-bar > li.dropup#layers > .dropdown-menu#layers-list > li > a.liveart-text-layer:focus,
            ul.liveart-button-bar > li.dropup#layers > .dropdown-menu#layers-list > li > a.liveart-text-layer:hover {
                background-image: url(../../assets/img/text-icon-white.png);
            }

            ul.liveart-button-bar > li.dropup#flip > .dropdown-menu#flip-list > li#vertical-flip > a#vertical-flip-btn {
                background-image: url(../../assets/img/vertical-flip-icon.png);
            }

            ul.liveart-button-bar > li.dropup#flip > .dropdown-menu#flip-list > li#horizontal-flip > a#horizontal-flip-btn {
                background-image: url(../../assets/img/horizontal-flip-icon.png);
            }

            ul.liveart-button-bar > li.dropup#align > .dropdown-menu#align-list > li#align-left > a#align-left-btn {
                background-image: url(../../assets/img/align-left-icon.png);
            }

            ul.liveart-button-bar > li.dropup#align > .dropdown-menu#align-list > li#align-right > a#align-right-btn {
                background-image: url(../../assets/img/align-right-icon.png);
            }

            ul.liveart-button-bar > li.dropup#align > .dropdown-menu#align-list > li#align-center > a#align-center-btn {
                background-image: url(../../assets/img/align-center-icon.png);
            }

            ul.liveart-button-bar > li.dropup#overlap > .dropdown-menu#overlap-list > li#overlap-toward > a#overlap-toward-btn {
                background-image: url(../../assets/img/overlap-toward-icon.png);
            }

            ul.liveart-button-bar > li.dropup#overlap > .dropdown-menu#overlap-list > li#overlap-backward > a#overlap-backward-btn {
                background-image: url(../../assets/img/overlap-backward-icon.png);
            }

            #change-colours .liveart-color-picker-btn {
               
            }

            #change-colours ul li {
                list-style: none;
                width: 110px;
                height: 35px;
                padding-top: 10px;
                margin-right: 35px;
            }

            #change-colours a.liveart-color-picker-btn > span {
                padding-left: 0px;
                padding-right: 10px;
            }

            #change-colours a.liveart-color-picker-btn > div.colorPicker-picker {
                float: right;
                position: relative;
            }

            ul.liveart-button-bar > li > a.liveart-color-picker-btn > span {
                padding-left: 0px;
                padding-right: 10px;
            }

            ul.liveart-button-bar > li > a.liveart-color-picker-btn > div.colorPicker-picker {
                background-size: 16px 16px;
            }

            ul.liveart-button-bar ul#product-colorizable-elements-list a.liveart-color-picker-btn {
                padding: 0;
            }

            ul.liveart-button-bar ul#product-colorizable-elements-list a.liveart-color-picker-btn > span {
                width: 80%;
                display: inline-block;
                padding-left: 10px;
            }

            ul.liveart-button-bar ul#product-colorizable-elements-list a.liveart-color-picker-btn > div.colorPicker-picker {
                
            }

            ul.liveart-button-bar > li.dropup > .dropdown-menu {
                border-radius: 1px;
                border: 0;
                padding: 0;
                margin-bottom: 2px;
                -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.15);
                -moz-box-shadow: 0 1px 1px rgba(0,0,0,.15);
                box-shadow: 0 1px 1px rgba(0,0,0,.15);
            }

            ul.liveart-button-bar > li.dropup > .dropdown-menu {
                min-width: 100%;
            }

                ul.liveart-button-bar > li.dropup > .dropdown-menu:before {
                    display: none;
                }

                ul.liveart-button-bar > li.dropup > .dropdown-menu:after {
                    display: none;
                }

                ul.liveart-button-bar > li.dropup > .dropdown-menu > li > a {
                    height: 38px;
                    line-height: 38px;
                    border: 1px solid #ffffff;
                    padding-left: 0px;
                }

                    ul.liveart-button-bar > li.dropup > .dropdown-menu > li > a:focus,
                    ul.liveart-button-bar > li.dropup > .dropdown-menu > li > a:hover {
                        background-color: #333;
                        border-color: #252525;
                        background-image: none;
                        color: #fff;
                    }

                ul.liveart-button-bar > li.dropup > .dropdown-menu > .divider {
                    margin: 0px 0px -1px 0px;
                }

/*	5.2 Product Sides Switch	*/

#product-sides-switch-container {
    z-index: 998;
}

    #product-sides-switch-container .nav {
        margin-top: 7px;
        margin-bottom: 7px;
    }

    #product-sides-switch-container .nav-pills > li > a {
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        border-radius: 2px;
        background-color: transparent;
        color: #999;
    }

    #product-sides-switch-container .nav-pills > li.active > a,
    #product-sides-switch-container .nav-pills > li.active > a:hover,
    #product-sides-switch-container .nav-pills > li.active > a:focus {
        background-color: #333;
        color: #fff;
        font-weight: bold;
    }

    #product-sides-switch-container .nav-pills > li > a > span {
        border-bottom: 1px #ccc dotted;
        padding-bottom: 0;
    }

    #product-sides-switch-container .nav-pills > li.active > a > span {
        border-bottom: none;
    }

.centered-pills-container {
    line-height: 0;
    text-align: center;
}

    .centered-pills-container ul.nav-pills {
        display: inline-block;
    }

/*	5.3 Zoom	*/

.liveart-panel#zoom-container {
    padding: 9px 18px 21px !important;
}

#zoom-slider {
    margin-top: 7px;
    width: 100%;
}

/* end of 5. Preview Menu */


/*	6. Order Options	*/
/*	6.1 Components		*/
#order-options-container {
    color: #000;
    font-size: 11px;
}

    #order-options-container .liveart-panel {
        margin-bottom: 2px;
        padding: 18px 18px 12px;
    }

    #order-options-container h5,
    #order-options-container h6 {
        margin: 0px;
    }

    #order-options-container h6 {
        color: #333;
        font-size: 12px;
        font-weight: normal;
        margin: 3px 0;
    }

    #order-options-container .divider {
        border-top: 1px solid #dcdcdc;
        margin: 12px 0 6px 0;
        width: 100%;
    }

    #order-options-container .divider-vertical {
        border-right: 1px solid #dcdcdc;
        display: inline;
        height: 21px;
        margin: 0 7px 0 4px;
    }

    #order-options-container .gray {
        color: #999;
    }

    #order-options-container .btn-link {
        font-size: 11px;
        padding: 0;
    }

    #order-options-container table,
    #order-options-container tbody {
        width: 100%;
    }

        #order-options-container table td:last-child {
            text-align: right;
        }

/* 6.2 Product info, colors, material */

#product-info-inner {
    /* max-height: 177px;
    overflow-y: scroll; */
    width: 182px;
}

#order-options-container table.order-colors {
    line-height: 14px;
    margin-top: 12px;
}

#order-options-container .description {
    box-sizing: border-box;
    padding-right: 10px;
    width: 165px;
}

#liveart-product-material .btn-group{
    width:100%;
}

#liveart-product-material #material-btn {
    width: 85%;
    height: 28px;
}

#liveart-product-material #material-dropdown-btn {
    width: 15%;
    height: 28px;
}

#liveart-product-material #material-list.dropdown-menu {
    max-height: 200px;
    height: auto!important;
}

/* 6.3 Sizes, Quantities	*/
#product-sizes-list {
    width: 182px;
    max-height: 78px;
    overflow-x: hidden;
    overflow-y: auto;
    margin-top: 0px;
}

    #product-sizes-list > li {
        height: 26px;
    }
    #product-sizes-list li {
        width: 170px;
    }

    #product-sizes-list .quantity-label {
        font-size: 12px;
        font-weight: bold;
        padding-right: 5px;
    }

    #product-sizes-list select {
       width: 51px;
       padding: 4px 0px;
    }


    #product-sizes-list button.size-btn > span.size-btn-label {
        display: inline-block;
        width: 40px;
        overflow-x: hidden;
        vertical-align: middle;
    }

    #product-sizes-list .btn-group-quantity {
        margin-left: 5px;
        white-space: nowrap;
        display: inline;
    }

    #product-sizes-list .btn-group-quantity .glyphicon-plus {
        top: 1px;
        left: 0px;
    }

    #product-sizes-list .btn-group-quantity .glyphicon-minus {
        top: 1px;
    }

    #product-sizes-list input {
        font-size: 12px;
        font-weight: bold;
        text-align: center;
        width: 26px;
        padding: 0;
        margin: 0;
        border: none;
    }

    #product-sizes-list li .btn-group-quantity > button.close {
        float: none;
        padding-left: 5px;
        vertical-align: middle;
    }
    
    #product-sizes-list .btn {
        height: 24px;
    }

    #product-sizes-panel .btn-default {
        height: 24px;
    }   

    #product-sizes-panel .btn.btn-round {
        width: 18px;
        height: 18px;
    }

#order-options-container table.order-price {
    margin-bottom: 15px;
    max-height: 110px;
    overflow-x: hidden;
    overflow-y: auto;
    display: block;
}
    #order-options-container table.order-price tbody {
        display: inline-table;
    }

    #order-options-container table.order-price td:last-child {
        color: #000;
        font-size: 12px;
    }

#place-order-btn {
    font-weight: bold;
    height: 32px;
    width: 100%;
    line-height: 20px;
}

/* 6.4 Save, Share */
.liveart-panel#save-load-print-panel,
.liveart-panel#share-design-panel {
    text-align: center;
    padding: 7px 10px;
    height: 40px;
}

    .liveart-panel#save-load-print-panel #print-design-btn {
        background-image: url(../../assets/img/icon-printer.png);
        background-repeat: no-repeat;
        background-position: left center;
    }

        .liveart-panel#save-load-print-panel #print-design-btn span {
            margin-left: 20px;
        }

/* end of 6. Order Options	*/

/* 7. Modals */
.modal-content {
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
}

.modal-body {
    padding-top: 0;
}

.modal-header h3{
    font-size: 24px;
    font-weight: bold;
    margin-top: 0;
}

.modal-footer {
    background-color: transparent;
    border-top: none;
    padding: 0 15px 15px;
    text-align: left;
}

/* all popups*/
.modal .modal-content label {
   display: block;
   margin-top: 15px;
   vertical-align: top;
}

.modal .modal-content input[type="text"] {
    width: 50%;
    margin: 4px 0px;
}

.modal .modal-content input[type="checkbox"] {
    margin-right: 5px;
    margin-top: 2px;
}

/*  DPI warning   */
#dpu-exceeded-popup {
    position: absolute;
    pointer-events: none;
    background-color: rgba(255, 255, 2255, 0.8);
    user-select: none;
    left: 50%;
    margin-left: -275px;
    top: 10px;
    width: 500px;
    z-index: 99;
    border: red;
    border-style: solid;
    padding: 3px;
}

/* Shared designs popup */
#liveart-share-link-popup #liveart-share-link-input {
    cursor: pointer;
    resize: vertical; 
}

/* Design list designs popup */
#liveart-designs-list-popup .table > tbody > tr {
    cursor: pointer;
}
#liveart-designs-list-popup .table > tbody > tr.active > td {
    background-color: #333;
    color: #fff;
}

#liveart-designs-list-popup .modal-body {
    overflow-y: auto;
    height: 239px;
}
/* Saved designs popup end */

/* Upload conditions popup */
#liveart-upload-conditions-popup .modal-body {
    max-height: none;
    padding-right: 0px;
}

#liveart-upload-conditions-popup .upload-conditions-text {
    border: #ddd;
    max-height: 350px;
    overflow: auto;
    margin-bottom: 15px;
    padding-right: 15px;
}
/* Upload conditions popup end */

/* File uploading progress bar   */
#liveart-upload-bar .progress-bar.animate {
   width: 0%;
}

#liveart-upload-bar .uploading .progress {
    margin-bottom: 0px !important;
    margin-top: 15px;
}
/* File uploading progress bar end  */

/* Upload Color Count Modal */
#liveart-color-count-popup {
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.15);
    -moz-box-shadow: 0 1px 1px rgba(0,0,0,.15);
    box-shadow: 0 1px 1px rgba(0,0,0,.15);
    -webkit-border-radius: 0px;
    border: 1px solid #ddd;
}

    #liveart-color-count-popup .modal-content {
        width: 500px;
    }

    #liveart-color-count-popup .modal-body {
        padding-top: 25px;
    }

    #liveart-color-count-popup .modal-header {
        background: #000;
        margin: -1px;
    }

    #liveart-color-count-popup .modal-footer {
        border-top: 1px solid #ddd;
        padding: 14px 15px 15px;
    }

        #liveart-color-count-popup .modal-footer > * {
            float: right;
        }

    #liveart-color-count-popup #colors-number {
        margin-left: 25px;
    }

        #liveart-color-count-popup #colors-number-label {
            float: left;
            margin-right: 10px;
        }

        #liveart-color-count-popup #colors-numeric-stepper > input {
            font-size: 12px;
            font-weight: bold;
            text-align: center;
            width: 26px;
            padding: 0;
            margin: 0;
            border: none;
        }

    #liveart-color-count-popup .liveart-colorPicker-multi {
	    background-color: #ffffff;
	    padding: 3px;
	    overflow: hidden;
        max-height: 110px;
        overflow-y: auto;
    }

    #liveart-color-count-popup .liveart-colorPicker-multi.disable {
        opacity: 0.5;
    }

        #liveart-color-count-popup .liveart-colorPicker-multi .colorPicker-swatch.active {
	        background-position: center center;
	        background-repeat: no-repeat;
  	        background-image: url(../../assets/img/check-icon-white-border.png);
        }

        #liveart-color-count-popup .liveart-colorPicker-multi.disable .colorPicker-swatch {
            cursor: default;
        }
        #liveart-color-count-popup .liveart-colorPicker-multi.disable .colorPicker-swatch:hover:not(.active) {
            border: 1px solid #d7d7d7;
        }

    #liveart-color-count-popup #liveart-color-count-popup-process-colors {
        margin-top: 10px;
    }

        #liveart-color-count-popup #liveart-color-count-popup-process-colors input[type=checkbox] {
            float: left;
        }

        #liveart-color-count-popup #liveart-color-count-popup-process-colors label {
            margin-left: 25px;
            margin-bottom: 0px;
            font-weight: bold;
        }

    #liveart-color-count-popup-alert {
        margin-top: 10px;
    }
/* Upload Color Count Modal end */

/* Show version and buildtime window */
    .version-buildtime {
           position: absolute;
           width: 250px;
           height: 50px;
           padding-top: 10px;
           padding-left: 10px;
           z-index: 9999;
    }
/* Show version and buildtime window end*/

/* 7. Modal end*/