#editorTopbarContainer {
    background-color: rgb(255, 255, 255);
    left: 0;
    top: 0;
    width: 100%;
    height: 70px;
    z-index: 54;
    position: fixed;
}

#editorTopbarContainer .topBarContent {
    height: 100%;
    float: left;
    width: auto;
}

#editorTopbarContainer .topBarContent.navbarTopLeft {
    padding-left: 0px
}

#editorTopbarContainer .navbarCenter {
    float: right;
}

#editorTopbarContainer ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: inline-block;
    float: left;
}

.navbarTopLeft ul .logoContainer {
    width: 60px;
    background-color: #fff;
    -webkit-transition: width 0.2s ease;
    -moz-transition: width 0.2s ease;
    -o-transition: width 0.2s ease;
    transition: width 0.2s ease;
    cursor: pointer;
}

.navbarTopLeft ul .maximizeContainer a {
    display: block;
    color: #2040aa;
    text-decoration: none;
    height: 60px;
    line-height: 60px;
    font-size: 14px;
}

.navbarTopLeft ul .projectInfo {
    width: 150px;
}


.navbarTopLeft ul .projectInfo .info label {
    display: block;
}


.navbarTopLeft ul .projectInfo .projectCover {
    font-size: 13px;
    font-family: 'Lato', sans-serif;
    color: rgb(134, 148, 153);
}


.navbarTopLeft ul li.maximizeContainer {
    transition: background-color 0.2s ease;
    -webkit-transition: background-color 0.2s ease;
    -moz-transition: background-color 0.2s ease;
    -o-transition: background-color 0.2s ease;
}

body.expand .navbarTopLeft ul li.maximizeContainer {
    background-color: #fff;
}

body.expand .navbarTopLeft ul li .maximizeMenu, .navbarTopLeft ul li .minimizeMenu {
    display: none;
}

.navbarTopLeft ul li .maximizeMenu, body.expand .navbarTopLeft ul li .minimizeMenu {
    display: block;
}

body.expand .navbarTopLeft ul li.maximizeContainer a {
    color: #2040aa;
}

/*li.projectInfo .load .printqicon-selectdown {
    -webkit-transition : transform 0.3s ease;
    -moz-transition    : transform 0.3s ease;
    -ms-transition     : transform 0.3s ease;
    -o-transition      : transform 0.3s ease;
    transition         : transform 0.3s ease;
    -webkit-transform : rotateX(0deg);
    -moz-transform    : rotateX(0deg);
    -ms-transform     : rotateX(0deg);
    -o-transform      : rotateX(0deg);
    transform         : rotateX(0deg);
}*/

li.projectInfo .load .printqicon-selectdown.flip {
    -webkit-transform: rotateX(180deg);
    -moz-transform: rotateX(180deg);
    -ms-transform: rotateX(180deg);
    -o-transform: rotateX(180deg);
    transform: rotateX(180deg);
}

.navbarCenter ul {
    text-align: center;
}

.navbarCenter ul li {
    width: 173px;
    height: 60px;
    display: block;
    float: left;
    -webkit-transition: background-color 0.2s ease;
    -moz-transition: background-color 0.2s ease;
    -ms-transition: background-color 0.2s ease;
    -o-transition: background-color 0.2s ease;
    transition: background-color 0.2s ease;
}

.navbarCenter ul li:hover {
    background-color: rgb(251, 251, 253);
}

.navbarCenter ul li:hover .effectbarLeftRight, .navbarCenter ul li:hover .effectbarRightLeft {
    width: 100% !important;
}

.navbarCenter ul li a {
    display: block;
    color: #2E9ED5;
    text-decoration: none;
    height: 60px;
    line-height: 60px;
}

.navbarCenter ul li a span {
    color: #384347;
}

.navbarCenter ul li a span {
    font-family: 'Lato', sans-serif;
    font-size: 16px;
    margin-left: 10px;
}

.navbarCenter ul li.active {
    background-color: rgb(251, 251, 253);
}

.navbarCenter ul li.active .effectbarRightLeft, .navbarCenter ul li.active .effectbarLeftRight {
    width: 100%;
}

.navbarCenter ul li.active a {
    color: #2040aa;
}

.navbarCenter ul li.active span {
    color: #384347;
}

.navbarCenter ul li .editPersonalization, .navbarCenter ul li .previewPersonalization {
    line-height: 60px;
    font-size: 16px;
    cursor: pointer;
    position: relative;
}

.navbarCenter ul li .effectbarRightLeft, .navbarCenter ul li .effectbarLeftRight {
    position: absolute;
    width: 0;
    background-color: #2040aa;
    bottom: 0;
    margin-left: 0;
    height: 2px;
    -webkit-transition: width 0.3s ease;
    -moz-transition: width 0.3s ease;
    -ms-transition: width 0.3s ease;
    -o-transition: width 0.3s ease;
    transition: width 0.3s ease;
}

.navbarCenter ul li .effectbarRightLeft {
    right: 0;
}

.navbarCenter ul li .effectbarLeftRight {
    left: 0;
}

.navbarRight ul li {
    width: 80px;
    display: inline-block;
    line-height: 100px;
    text-align: center;
}

.navbarRight ul li:last-of-type {
    margin-right: 50px;
}

.navbarRight ul li a {
    color: #2040aa;
}

.navbarRight ul li a {
    text-decoration: none;
    height: 100px;
    line-height: 100px;
    font-size: 12px;
    display: block;
}

.navbarRight ul li.disabled a {
    color: #E8E9EB;

}

.navbarRight ul li a span.title {
    color: #5e6a7a;
}

.navbarRight ul li.disabled span.title {
    color: #E8E9EB;
}

.navbarRight ul li span.title {
    font-size: 11px;
    font-family: 'Lato', sans-serif;
    height: 100%;
}

.navbarRight ul li a.redo span.title {
    margin-right: 5px;
}

.navbarRight ul li a.undo span.title {
    margin-left: 5px;
}

.navbarRight {
    text-align: right;
}

body.expand .logoContainer {
    width: 140px;
}

.expand .logoContainer div.small_logo {
    display: none;
}

.logoContainer div.large_logo {
    display: none;
}

.logoContainer div.small_logo {
    display: block;
    width: 30px;
    height: 30px;
}

.expand .logoContainer div.large_logo {
    display: block;
    width: 120px;
    height: 30px;
}

.logoContainer .top_logo {
    background-repeat: no-repeat;
    background-position: center left 0;
    display: block;
    background-size: contain;
}

.logoSubContainer {
    padding: 15px;
}

body.edit #current_page_name_preview {
    display: none;
}

.actionsTopBar {
    width: auto;
    height: 100%;
    display: inline-block;
}

.navbarCenter.topBarContent .actionsTopBar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    text-align: center;
}

body.preview_area .undo_redo_group,
body.preview_area .navbarCenter .actionsTopBar div.readyToPrint,
body #addtoCartContainer,
body .navbarCenter .actionsTopBar div#attach,
body .navbarCenter .actionsTopBar div.edit,
body .navbarCenter .actionsTopBar div#attachAdmin {
    display: none !important;
}

body.preview_area .navbarCenter .actionsTopBar div#attach,
body.preview_area .navbarCenter .actionsTopBar div.edit,
body.preview_area .navbarCenter .actionsTopBar div#attachAdmin {
    display: block !important;
}

.navbarCenter.topBarContent .actionsTopBar .edit {
    background-color: rgb(241, 244, 246);
    min-width: 100px;
    height: 36px;
    margin: 0px;
    border-radius: 3px;
}

.navbarCenter.topBarContent .actionsTopBar .edit a {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-size: 14px;
    margin: 0px;
    line-height: 33px;
    color: #343e4c;
    text-decoration: none;
}

.readyToPrint {
    width: auto;
    height: 100%;
    display: inline-block;
    float: left;
}

.navbarCenter .actionsTopBar div#attach {
    margin-left: 30px;
}

.navbarCenter .actionsTopBar div#attach {
    margin-left: 30px;
}

/*end top bar*/
#LogoBuilderApp {
    z-index: 10000 !important;
}