@import url("../../../assets/css/fonts/fonts-lato.css");
@import url("../../../assets/css/fonts/fonts-payfair.css");
@import url("../../../assets/css/fonts/fonts-lora.css");
@import url("../../../assets/css/fonts/fonts-opensans.css");
@import url("../../../assets/css/fonts/fonts-montserrat.css");
@import url("../../../assets/css/fonts/fonts-roboto.css");
@import url("../../../assets/css/fonts/fonts-chalkduster.css");
input {
    -webkit-border-radius: 0;
    -webkit-appearance: none;
    border-radius: 0;
}
/* inteface buttons */
.logged-in .user-design-page .interface-top-buttons{
    position: absolute;
    display: flex;
    justify-content: space-between;
    bottom: 0;
    width: 100%;
    flex-direction: column;
    left: 0;
    box-sizing: border-box;
    padding: 20px;
    right: auto;
    z-index: 9999;

}
.logged-in .user-design-page h3{
    display: block;
    border-bottom: 1px solid #6B7B8F;
    width: 100%;
    color: #fff;
    margin-top: 0;
    padding-bottom: 5px;
    margin-bottom: 35px;
}
.logged-in .user-design-page h3.current-edit{
    border: none;
    font-size: 15px;
    line-height: 25px;
    margin-bottom: 0px;
    padding-bottom: 0px;
    font-weight: 800;
}
.logged-in .user-design-page h2{
    display: block;
    color: #fff;
    width: 100%;
    margin-top: 0;
}
.logged-in .user-design-page .white h3,
.logged-in .user-design-page .white h3.current-edit,
.logged-in .user-design-page .white h2{
    color: #212933
}
.logged-in .user-design-page .interface-top-buttons .admin-button-small{
    margin-bottom: 2vh;
    width: 100%;
    margin-left: 0px;
    cursor: pointer;
}
.logged-in .user-design-page{
    font-family: 'Lato', sans-serif;
}
.logged-in .user-design-page .interface-top-buttons .admin-button-small{
    text-decoration: none;
}

.logged-in .user-design-page .admin-button-small{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 16px;
    min-width: 175px;
    height: 50px;
    margin-left: 20px;
    background: #EAB01C;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-family: 'Lato', sans-serif;
    font-weight: 700;
    font-size: 12px;
    line-height: 15px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #0C171F;
    box-sizing: border-box;
    border: none;
    cursor: pointer;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}
.logged-in .user-design-page .admin-button-small svg{
    margin-right: 10px;
}
/* Sidebar Left / Right */
.logged-in .user-design-page .aside-design{
    left: 0;

}
.logged-in .user-design-page .shop-design{
    display: none;
}
.logged-in .user-design-page .website-design-options{
    padding-left: 370px;
    padding-right: 440px;
    padding-top: 30px;
    padding-bottom: 30px;
    background-color: #2C3540;
    height: 100%;
    min-height: 100vh;
    box-sizing: border-box;

}
.logged-in .user-design-page .website-design-options.white{
    background-color: #f1f1f1;
}
.logged-in .user-design-page .aside-design-preview{
    background: #212933;
    position: fixed;
    width: 390px;
    height: 100vh;
    top: 0;
    right: 0px;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    box-sizing: border-box;
    padding: 50px;
    z-index: 99999;
    overflow-y: scroll;
}
.logged-in .user-design-page .website-design-options input[name="tab"],
.logged-in .user-design-page .website-design-options input[name="subtabdesign"],
.logged-in .user-design-page .website-design-options input[name="subtabglobal"]{
    display: none;
}
.logged-in .user-design-page .website-design-options .tab,
.logged-in .user-design-page .website-design-options .subtab{
    display: none;
}
.logged-in .user-design-page .website-design-options .tab-check:checked + .tab,
.logged-in .user-design-page .website-design-options .subtab-check:checked + .subtab{
    display: block;
}
.logged-in .user-design-page .aside-design .content-design{
    padding: 20px;
}
.logged-in .user-design-page .aside-design .content-design .accordion-title{
    color:  #FFF;
    font-size: 27px;
    font-weight: 800;
    line-height: 55px;
}
.logged-in .user-design-page .aside-design .content-design .active .accordion-title{
    color: #EAB01C;
}
.logged-in .user-design-page .aside-design .content-design .accordion-content{
    overflow: hidden;
    height: 0;
    display: flex;
    flex-direction: column;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}
.logged-in .user-design-page .aside-design .content-design .accordion-active .accordion-content{
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    height: auto;

}
.logged-in .user-design-page .aside-design .content-design .accordion-content label{
    color:  #FFF;
    font-size: 19px;
    font-weight: 800;
    line-height: 22px;
    list-style: none;
}
.logged-in .user-design-page .aside-design .content-design .accordion-content label.active {
    color: #EAB01C;
}


.logged-in .user-design-page .primarytab .accordion-title {
    cursor: pointer;
}

/* dotted box global*/
.logged-in .user-design-page .design-box-style{
    color: #FFF;
    text-align: center;
    font-family: var(--font);
    font-size: 15px;
    font-weight: 800;
    line-height: 40px;
    position: relative;
    margin-bottom: 15px;
    box-sizing: border-box;

}
.logged-in .user-design-page .design-box-style-border{
    margin: 0 auto;
    position: relative;
    box-sizing: border-box;
    width: 248px;
    height: 129px;
    border: 1px dashed #6B7B8F;
    padding: 20px;
    display: flex;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    cursor: pointer;
}
.logged-in .user-design-page .design-box-style-border:hover,
.logged-in .user-design-page input:checked + .design-box-style-border{
    border: 1px solid #EAB01C;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}
.logged-in .user-design-page .design-box-style-border.nopadding{
    padding: 0;
}
.logged-in .user-design-page .design-box-style-border.column{
    flex-direction: column;
}
.logged-in .user-design-page .design-box-style-border.bottom-align{
    align-items: flex-end;
}
.logged-in .user-design-page .design-box-style-border.top-align{
    align-items: flex-start;
}
.logged-in .user-design-page .design-box-style-border.justify-align{
    justify-content: space-between;
}
.logged-in .user-design-page .design-box-style-border .align-text-composed{
    width: 100%;
    display: flex;
}
.logged-in .user-design-page .design-box-style-border .align-text-composed.textcenter{
    justify-content: center;
}
.logged-in .user-design-page .design-box-style-border .align-text-composed.textleft{
    justify-content: flex-start;
}
.logged-in .user-design-page .design-box-style-border .align-text-composed.textright{
    justify-content: flex-end;
}
.logged-in .user-design-page .design-box-style-border.sizethreethird {
    padding-bottom: 10%;
}
.logged-in .user-design-page  .design-border-text{
    color: #FFF;
    text-align: center;
    font-family: var(--font);
    font-size: 15px;
    font-weight: 800;
    line-height: 40px;
    width: 248px;
    margin: 0 auto 15px;
    cursor: pointer;

}
.logged-in .user-design-page .design-box-style:before{
    content: "";
    background-repeat: no-repeat;
    background-size: cover;
    width: 248px;
    height: 129px;
    display: block;
    margin: 0 auto;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    cursor: pointer;
}
.logged-in .user-design-page .design-box-style.borderdashed:before{
    border: 1px dashed #6B7B8F;
}
.logged-in .user-design-page .design-box-style.borderfull:before{
    border: 1px solid #6B7B8F;
}
.logged-in .user-design-page input[type=radio]:checked + .design-box-style:before,
.logged-in .user-design-page input[type=checkbox]:checked + .design-box-style:before,
.logged-in .user-design-page .design-box-style:hover:before{
    border: 1px solid #eab01c;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}

.logged-in .user-design-page .flex-select-list,
.logged-in .user-design-page .font-select-list,
.logged-in .user-design-page #ThemeSelect,
.logged-in .user-design-page #DesignAllowItems{
    display: flex;
    flex-wrap: wrap;
}
.logged-in .user-design-page .flex-select-list .flex-space-box,
.logged-in .user-design-page #ThemeSelect .theme-style,
.logged-in .user-design-page #DesignAllowItems .header-slider-style{
    flex: 0 0 25%;
}
.logged-in .user-design-page .theme-response .selected-theme{
    width: 100%;
    height: 80vh;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}


/* Switch Box */
.logged-in .user-design-page .website-design-options .switch-box{
    display: flex;
    align-items: center;
    margin-bottom: 40px;
}
.logged-in .user-design-page .website-design-options .switch-box .text-switch{
    display: inline-block;
    vertical-align: top;
    user-select: none;
    margin-left: 16px;
    cursor: pointer;
    color: #1a1a1a;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
}
.logged-in .user-design-page .website-design-options .switch-box .switch {
    position: relative;
    display: inline-block;
    width: 58px;
    height: 22px;
    margin-bottom: 0px;
    min-width: 37px;
}

.logged-in .user-design-page .website-design-options .switch-box .switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.logged-in .user-design-page .website-design-options .switch-box .switch .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.logged-in .user-design-page .website-design-options .switch-box .switch .slider:before {
    position: absolute;
    content: "";
    height: 14px;
    width: 14px;
    left: 5px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

.logged-in .user-design-page .website-design-options .switch-box .switch input:checked + .slider {
    background-color: #E4E0E0;
}

.logged-in .user-design-page .website-design-options .switch-box .switch input:focus + .slider {
    box-shadow: 0 0 1px #EAB01C;
}

.logged-in .user-design-page .website-design-options .switch-box .switch input:checked + .slider:before {
    background-color: #0C949C;
    -webkit-transform: translateX(32px);
    -ms-transform: translateX(32px);
    transform: translateX(32px);
}

.logged-in .user-design-page .website-design-options .switch-box .switch .slider.round {
    border-radius: 34px;
    -webkit-border-radius: 34px;
    -moz-border-radius: 34px;
}

.logged-in .user-design-page .website-design-options .switch-box .switch .slider.round:before {
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
}
.logged-in .user-design-page .website-design-options .switch-box.black-switch .switch .slider{
    background-color: #3F4A58;
}
.logged-in .user-design-page .website-design-options .switch-box.black-switch .switch input:checked + .slider{
    background-color: #3F4A58;
}
.logged-in .user-design-page .website-design-options .switch-box.black-switch .switch .slider::before{
    background-color: #242D38;
}
.logged-in .user-design-page .website-design-options .switch-box.black-switch .switch input:checked + .slider::before{
    background-color: #EAB01C;
}
.logged-in .user-design-page .website-design-options .switch-box.black-switch .text-switch{
    font-size: 15px;
    font-weight: 500;
    line-height: 18px;
    color: #fff;
}
/*** THEME ***/

.logged-in .user-design-page .theme-response .style-theme1,
.logged-in .user-design-page .website-design-options #ThemeSelect .style-theme1:before{
    background-image:url("../../../assets/images/themes/A.jpg");
}
.logged-in .user-design-page .theme-response .style-theme2,
.logged-in .user-design-page .website-design-options #ThemeSelect .style-theme2:before{
    background-image:url("../../../assets/images/themes/B.jpg");
}
.logged-in .user-design-page .theme-response .style-theme3,
.logged-in .user-design-page .website-design-options #ThemeSelect .style-theme3:before{
    background-image:url("../../../assets/images/themes/C.jpg");
}
.logged-in .user-design-page .theme-response .style-theme4,
.logged-in .user-design-page .website-design-options #ThemeSelect .style-theme4:before{
    background-image:url("../../../assets/images/themes/D.jpg");
}
.logged-in .user-design-page .theme-response .style-theme5,
.logged-in .user-design-page .website-design-options #ThemeSelect .style-theme5:before{
    background-image:url("../../../assets/images/themes/E.jpg");
}
.logged-in .user-design-page .theme-response .style-theme6,
.logged-in .user-design-page .website-design-options #ThemeSelect .style-theme6:before{
    background-image:url("../../../assets/images/themes/F.jpg");
}
.logged-in .user-design-page .theme-response .style-theme7,
.logged-in .user-design-page .website-design-options #ThemeSelect .style-theme7:before{
    background-image:url("../../../assets/images/themes/G.jpg");
}
.logged-in .user-design-page .theme-response .style-theme8,
.logged-in .user-design-page .website-design-options #ThemeSelect .style-theme8:before{
    background-image:url("../../../assets/images/themes/H.jpg");
}
.logged-in .user-design-page .theme-response .style-theme9,
.logged-in .user-design-page .website-design-options #ThemeSelect .style-theme9:before{
    background-image:url("../../../assets/images/themes/I.jpg");
}
/*** GLOBAL STYLES ***/

/* Typography */
.logged-in .user-design-page .flex-space-box input,
.logged-in .user-design-page #GlobalTypographySelect .font-select-list input{
    display: none
}
.logged-in .user-design-page #GlobalTypographySelect .font-select{
    width: 48%;
    display: flex;
    border: 1px solid #6B7B8F;
    margin-bottom: 20px;
    margin-right: 20px;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    cursor: pointer;
    padding: 25px;
    box-sizing: border-box;
}
.logged-in .user-design-page #GlobalTypographySelect .font-select:hover,
.logged-in .user-design-page #GlobalTypographySelect input:checked + .font-select{
    border: 1px solid #EAB01C;
}
.logged-in .user-design-page .font-display .heading,
.logged-in .user-design-page #GlobalTypographySelect .font-select .heading{
    font-size: 21px;
    font-weight: 600;
    line-height: 25px;
    color: #6B7B8F;
    margin-bottom: 10px;
}
.logged-in .user-design-page .font-display .body{
    margin-top: 30px;
}
.logged-in .user-design-page .white .font-display .body,
.logged-in .user-design-page .white .font-display .heading{
    color: #212933;
}
.logged-in .user-design-page .font-display .body,
.logged-in .user-design-page .font-display .heading{
    border-bottom: 1px solid #6B7B8F;
    padding-bottom: 15px;
    margin-bottom: 15px;
}

.logged-in .user-design-page .font-display .body,
.logged-in .user-design-page #GlobalTypographySelect .font-select .body{
    font-size: 15px;
    font-weight: 500;
    line-height: 18px;
    color: #6B7B8F;
}
.logged-in .user-design-page .font-display .text-font{
    font-size: 16px;
}
.logged-in .user-design-page .uppercase h1,
.logged-in .user-design-page .uppercase h2,
.logged-in .user-design-page .uppercase h3,
.logged-in .user-design-page .uppercase h4{
    text-transform: uppercase;
}

.logged-in .user-design-page .font-display .heading,
.logged-in .user-design-page .font-display .body,
.logged-in .user-design-page #GlobalTypographySelect input:checked + .font-select .body,
.logged-in .user-design-page #GlobalTypographySelect input:checked + .font-select .heading{
    color: #fff;
}
.logged-in .user-design-page .font-display .text-font,
.logged-in .user-design-page .font-display h1,
.logged-in .user-design-page .font-display h2,
.logged-in .user-design-page .font-display h3,
.logged-in .user-design-page .font-display h4{
    color: #fff;
    margin: 0;
    border: none;
}


.logged-in .user-design-page .font-display.style-font1 h1,
.logged-in .user-design-page .font-display.style-font1 h2,
.logged-in .user-design-page .font-display.style-font1 h3,
.logged-in .user-design-page .font-display.style-font1 h4,
.logged-in .user-design-page .font-display.style-font1 .heading,
.logged-in .user-design-page #GlobalTypographySelect .font-select .style-font1 .heading{
    font-family: 'Playfair Display', sans-serif;
}
.logged-in .user-design-page .font-display.style-font1 .body,
.logged-in .user-design-page .font-display.style-font1 .text-font,
.logged-in .user-design-page #GlobalTypographySelect .font-select .style-font1 .body{
    font-family: 'Lato', sans-serif;
}
.logged-in .user-design-page .font-display.style-font2 h1,
.logged-in .user-design-page .font-display.style-font2 h2,
.logged-in .user-design-page .font-display.style-font2 h3,
.logged-in .user-design-page .font-display.style-font2 h4,
.logged-in .user-design-page .font-display.style-font2 .heading,
.logged-in .user-design-page #GlobalTypographySelect .font-select .style-font2 .heading{
    font-family: 'Lato', sans-serif;
}
.logged-in .user-design-page .font-display.style-font2 .body,
.logged-in .user-design-page .font-display.style-font2 .text-font,
.logged-in .user-design-page #GlobalTypographySelect .font-select .style-font2 .body{
    font-family: 'Lora', sans-serif;
}
.logged-in .user-design-page .font-display.style-font3 h1,
.logged-in .user-design-page .font-display.style-font3 h2,
.logged-in .user-design-page .font-display.style-font3 h3,
.logged-in .user-design-page .font-display.style-font3 h4,
.logged-in .user-design-page .font-display.style-font3 .heading,
.logged-in .user-design-page #GlobalTypographySelect .font-select .style-font3 .heading{
    font-family: 'Montserrat', sans-serif;
}
.logged-in .user-design-page .font-display.style-font3 .body,
.logged-in .user-design-page .font-display.style-font3 .text-font,
.logged-in .user-design-page #GlobalTypographySelect .font-select .style-font3 .body{
    font-family: 'Open Sans', sans-serif;
}
.logged-in .user-design-page .font-display.style-font4 h1,
.logged-in .user-design-page .font-display.style-font4 h2,
.logged-in .user-design-page .font-display.style-font4 h3,
.logged-in .user-design-page .font-display.style-font4 h4,
.logged-in .user-design-page .font-display.style-font4 .heading,
.logged-in .user-design-page #GlobalTypographySelect .font-select .style-font4 .heading{
    font-family: 'Roboto', sans-serif;
}
.logged-in .user-design-page .font-display.style-font4 .body,
.logged-in .user-design-page .font-display.style-font4 .text-font,
.logged-in .user-design-page #GlobalTypographySelect .font-select .style-font4 .body{
    font-family: 'Lato', sans-serif;
}
.logged-in .user-design-page .flex-select-list{
    display: flex;
    flex-wrap: wrap;
}


/* Underline */


.logged-in .user-design-page .flex-space-box .design-box-style::after {
    content: "";
    background-repeat: no-repeat;
    background-size: auto;
    width: 100%;
    height: 130px;
    display: block;
    margin: 0 auto;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
    padding: 0 15px;
    box-sizing: border-box;
    background-position: center 90px;
}
.logged-in .user-design-page .design-underline-center:after,
.logged-in .user-design-page .underline-style .design-underline:after{
    background-image:url("../../../assets/images/design/typography/underline-center.svg");
}
.logged-in .user-design-page .underline-style .design-graphic:after{
    background-image:url("../../../assets/images/design/typography/graphical-detail.svg");
}

.logged-in .user-design-page .underline-style .design-lineright:after{
    background-image:url("../../../assets/images/design/typography/line-left.svg");
}

.logged-in .user-design-page .underline-style .design-centerline:after{
    background-image:url("../../../assets/images/design/typography/title-center-lines.svg");
}
.logged-in .user-design-page  .design-underline-left:after{
    background-image:url("../../../assets/images/design/typography/underline-left.svg");
}
.logged-in .user-design-page .design-underline-right:after{
    background-image:url("../../../assets/images/design/typography/underline-right.svg");
}
.logged-in .user-design-page .logo-upload,
.logged-in .user-design-page .rudr-upload{
    width: 100px;
    height: 100px;
    background: #F0F0F0;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.logged-in .user-design-page .logo-upload:empty:before,
.logged-in .user-design-page .rudr-upload:empty:before{
    content: "";
    background-image:url('../../../assets/images/interface/addimage.svg');
    display: block;
    width: 43px;
    height: 44px;
    position: absolute;
    z-index:0;
}
.logged-in .user-design-page .image-block{
    position: relative;
}
.logged-in .user-design-page .logo-remove,
.logged-in .user-design-page .rudr-remove{
    position: absolute;
    right: 10px;
    top: 5px;
    text-decoration: none;
    color: #fff;
}
.logged-in .user-design-page .logo-remove svg,
.logged-in .user-design-page .logo-remove i,
.logged-in .user-design-page .rudr-remove svg,
.logged-in .user-design-page .rudr-remove i{
    color: #fff;
}
.logged-in .user-design-page .logo-upload img,
.logged-in .user-design-page .rudr-upload img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.logged-in .user-design-page .image-block-options,
.logged-in .user-design-page .layout-options{
    display: none;
}
.logged-in .user-design-page .image-options{
    width: 100px;
    height: 100px;
    position: relative;
    color: #fff;
}
.logged-in .user-design-page .image-block-options.active{
    display: block;
}
.logged-in .user-design-page .layout-options.active{
    display: flex;
}

.logged-in .user-design-page .hide{
    display: none!important;
}



.logged-in .user-design-page .aside-design-preview .flex-select-list .flex-space-box{
    flex: 100%;
    margin-top: 50px;
}
/* Colours */
.logged-in .user-design-page .clr-field{
    width: 40px;
    height: 40px;
    margin-right: 24px;
    margin-bottom: 30px;
}
.logged-in  .colours-list-box .show-under-image-bg{
    display: none;
    width: 100%;
    justify-content: space-between;
}
.logged-in .colours-list-box .show-under-image-bg.active_under{
    display: flex;
}
.logged-in .user-design-page .colour-select-list input{
    width: 40px;
    height: 40px;
    border: none;
    font: 0/0 a;
    cursor: pointer;
    opacity: 0;
}
.logged-in .user-design-page .colour-select-list .clr-field button{
    height: 40px;
    width: 40px;
    cursor: pointer;
    top: 0;
    transform: translateY(0%);
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    border: 1px solid #212933;
    background: transparent;
}
.logged-in .user-design-page .preview-colours .font-display .text-font a{
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}

.logged-in .user-design-page .colours-list-box{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.logged-in .user-design-page .colours-list-box .colour-select-list{
    flex: 0 0 48%;
}
.logged-in .user-design-page .colours-list{
    display: flex;

}
.logged-in .user-design-page .colour-style {
    width: 40px;
    height: 40px;
    margin-right: 4px;
    margin-bottom: 30px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    border: 1px solid transparent;
    padding: 10px;
    display: block;
}
.logged-in .user-design-page .radiopickcolour{
    display: none;
}
.logged-in .user-design-page .radiopickcolour:checked + .colour-style{
    border: 1px solid #212933;
}
.logged-in .user-design-page .colour-style .color-select{
    width: 100%;
    height: 100%;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    overflow: hidden;
    border: 1px solid #212933;
    cursor: pointer;

}
/* Buttons */


.logged-in .user-design-page .flex-select-list.buttons-list .flex-space-box{
    flex: 0 0 21%;
    margin-right: 5%;
    position: relative;
}
.logged-in .user-design-page .flex-select-list.buttons-list .flex-space-box .button-style{
    min-width:100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 55px;
    z-index: 1;
    cursor: pointer;
}
.logged-in .user-design-page .global-button{
    min-width: 214px;
    display: block;
    text-align: center;
    text-decoration: none;
    font-size: 15px;
    font-weight: 500;
    line-height: 55px;
    margin-bottom: 30px;
    position: relative;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    cursor: pointer;
}
.logged-in .user-design-page .global-button.global-button-solid{
    background: var(--primary-aside);
    color: #fff;
}



.logged-in .user-design-page .global-button.global-button-solid.global-button-rounded{
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.logged-in .user-design-page .global-button.global-button-solid.global-button-round{
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
}
.logged-in .user-design-page .global-button.global-button-underline{
    border-bottom:6px solid var(--primary-aside);
    color: var(--primary-aside);

}
.logged-in .user-design-page .global-button.global-button-underline.global-button-left{
    text-align: left;
}
.logged-in .user-design-page .global-button.global-button-underline.global-button-center{
    text-align: center;
}
.logged-in .user-design-page .global-button.global-button-underline.global-button-right{
    text-align: right;
}
.logged-in .user-design-page .design-shape-list{
    display: none;
}
.logged-in .user-design-page .design-shape-list.active{
    display: flex;
}
.logged-in .user-design-page .design-shape-list .icon-shape-style{
    width: 58px;
    height: 58px;
    border: 1px dashed #6B7B8F;
    margin-right: 10px;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    cursor: pointer;
}
.logged-in .user-design-page .design-shape-list .icon-shape-style.icon-shape-style-round{
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
}
.logged-in .user-design-page .design-shape-list .icon-shape-style.icon-shape-style-rounded{
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.logged-in .user-design-page .design-shape-list .icon-shape-style.icon-shape-style-custom{
    -webkit-border-radius: 10px;
    -webkit-border-top-right-radius: 0;
    -moz-border-radius: 10px;
    -moz-border-radius-topright: 0;
    border-radius: 10px;
    border-top-right-radius: 0;
}
.logged-in .user-design-page .design-shape-list input[type="radio"]:checked + .icon-shape-style{
    border: 1px solid #eab01c;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}

.logged-in .user-design-page .global-buttons-layout-options .button-layout-style{
    margin-right: 20px
}

.logged-in .user-design-page .global-buttons-layout-options .button-layout-style input[type="radio"]:checked + .flex-space-box .global-button.global-button-underline{
    border-color: #eab01c;
    color: #eab01c;
}
.logged-in .user-design-page .custom-border-radious-buttons{
    display: none;
}
.logged-in .user-design-page .custom-border-radious-buttons.active{
    display: block;
}
.logged-in .user-design-page .custom-border-radious{
    margin-left: 30px;
}
.logged-in .user-design-page .custom-border-radious-unit{
    display: flex;

}
.logged-in .user-design-page .custom-border-radious-unit input{
    display: none;
}
.logged-in .user-design-page .custom-border-radious-unit .unit-value{
    font-size: 15px;
    line-height: 18px;
    color: #fff;
    cursor: pointer;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    text-align: center;
    margin: 0 5px;
}
.logged-in .user-design-page .custom-border-radious-unit .unit-value:hover,
.logged-in .user-design-page .custom-border-radious-unit input[type="radio"]:checked + .unit-value{
    color: #eab01c;

}
.logged-in .user-design-page .custom-border-radious-values{
    display: flex;
    align-items: center;
}
.logged-in .user-design-page .custom-border-radious-values .big-input{
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 20px;
    margin-right: 20px;
}

.logged-in .user-design-page .custom-border-radious-values .big-input input{
    width: 340px;
    height: 40px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid #6B7B8F;
    -webkit-appearance: none;
    -moz-appearance: textfield;
    margin: 0;
    text-align: center;
    background-color: transparent;
    color: #fff;
    font-size: 15px;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}
.logged-in .user-design-page .custom-border-radious-values .big-input input:hover{
    border: 1px solid #eab01c;
}
.logged-in .user-design-page .custom-border-radious-values .big-input input:focus{
    outline: none;
}
.logged-in .user-design-page .custom-border-radious-values .small-input{
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 20px;
    margin-right: 20px;
}

.logged-in .user-design-page .custom-border-radious-values .small-input input{
    width: 40px;
    height: 40px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid #6B7B8F;
    -webkit-appearance: none;
    -moz-appearance: textfield;
    margin: 0;
    text-align: center;
    background-color: transparent;
    color: #fff;
    font-size: 15px;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}
.logged-in .user-design-page .custom-border-radious-values .small-input input:hover{
    border: 1px solid #eab01c;
}
.logged-in .user-design-page .custom-border-radious-values .small-input input:focus{
    outline: none;
}
.logged-in .user-design-page .custom-border-radious-values .small-input .border-prev{
    width: 10px;
    height: 10px;
    margin-top: 10px;

}
.logged-in .user-design-page .custom-border-radious-values .small-input .border-prev.top-left{
    border-top: 1px solid #6B7B8F;
    border-left: 1px solid #6B7B8F;
    -webkit-border-top-left-radius: 5px;
    -moz-border-radius-topleft: 5px;
    border-top-left-radius: 5px;
}
.logged-in .user-design-page .custom-border-radious-values .small-input .border-prev.top-right{
    border-top: 1px solid #6B7B8F;
    border-right: 1px solid #6B7B8F;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topright: 5px;
    border-top-right-radius: 5px;
}
.logged-in .user-design-page .custom-border-radious-values .small-input .border-prev.bottom-left{
    border-bottom: 1px solid #6B7B8F;
    border-left: 1px solid #6B7B8F;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-left-radius: 5px;
}
.logged-in .user-design-page .custom-border-radious-values .small-input .border-prev.bottom-right{
    border-bottom: 1px solid #6B7B8F;
    border-right: 1px solid #6B7B8F;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    border-bottom-right-radius: 5px;
}
.logged-in .user-design-page .custom-border-radious-values .small-input .border-prev.border-all{
    border: 1px solid #6B7B8F;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.logged-in .user-design-page .custom-border-radious-values .border-link{
    background-image:url("../../../assets/images/design/chain.svg");
    width: 17px;
    height: 16px;
    cursor: pointer;
}
.logged-in .user-design-page .custom-border-radious-values .border-link:hover,
.logged-in .user-design-page .custom-border-radious-values input[type="checkbox"]:checked + .border-link{
    filter: invert(30%) sepia(97%) saturate(363%) hue-rotate(1deg) brightness(91%) contrast(104%);

}
.logged-in .user-design-page .global-buttons-layout-options{
    display: none;
}
.logged-in .user-design-page .global-buttons-layout-options.active{
    display: flex;
}
.input-radious-box{
    display: none;
}
.input-radious-box.active{
    display: flex;
}


.social-icons-display{
    display: flex;
}
.social-icons-display .icon{
    width: 40px;
    height: 40px;
    border: 1px solid #eab01c;
    margin: 0 10px
}
.social-icons-display.fullbackground .icon{
    background: #eab01c;
}
/*** DESIGN ELEMENTS ***/


/* Header */

.website-design-options #DesignAllowItems .design-headerslider1:before{
    background-image:url("../../../assets/images/design/headerslider/hs-curve-left.svg");
}
.website-design-options #DesignAllowItems .design-headerslider2:before{
    background-image:url("../../../assets/images/design/headerslider/hs-curve-right.svg");
}
.website-design-options #DesignAllowItems .design-headerslider3:before{
    background-image:url("../../../assets/images/design/headerslider/hs-curve.svg");
}
.website-design-options #DesignAllowItems .design-headerslider4:before{
    background-image:url("../../../assets/images/design/headerslider/hs-wave-left.svg");
}
.website-design-options #DesignAllowItems .design-headerslider5:before{
    background-image:url("../../../assets/images/design/headerslider/hs-wave-right.svg");
}
.website-design-options #DesignAllowItems .design-headerslider6:before{
    background-image:url("../../../assets/images/design/headerslider/hs-angle-left.svg");
}
.website-design-options #DesignAllowItems .design-headerslider7:before{
    background-image:url("../../../assets/images/design/headerslider/hs-angle-right.svg");
}











/******DESIGNS*******/


.spacer{
    margin-bottom: 2%;
}
/*headers*/
.layout-header-global{
    padding: 2% 5%;
    width: 100%;
    box-sizing: border-box;
}
.layout-header{
    display: flex;
    align-items: center;
    width: 20%;
}
.layout-header .layout-logo{
    background-color: #6B7B8F;
    aspect-ratio: 1 / 1;
    width: 40%;
    border-radius: 50%;
    margin-right: 10%;
}
.layout-lines{
    display: flex;
    flex-direction: column;
    width: 60%;
}
.layout-lines .layout-line{
    background-color: #6B7B8F;
    aspect-ratio: 8/1;
    width: 100%;
}
.layout-lines .layout-line.layout-line1{
    margin-bottom: 10%;
}
.layout-lines .layout-line.layout-line2{
    width: 50%;
    aspect-ratio: 4/1;
}
.layout-heading1 .layout-menu{
    background-color: #6B7B8F;
    width: 70%;
    aspect-ratio: 53/1;
}
.layout-heading1 .layout-header{
    padding: 0;
    margin-bottom: 2%
}
.layout-heading2{
    display: flex;
    justify-content: space-between;
    background: #6B7B8F;
}
.layout-heading2 .layout-lines .layout-line,
.layout-heading2 .layout-header .layout-logo{
    background-color: #2C3540;
}
.layout-heading2 .layout-menu-burger{
    width: 8%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;

}
.layout-heading2 .layout-menu-burger .line{
    background-color: #2C3540;
    width: 100%;
    aspect-ratio: 7/1;
}

.layout-heading3{
    display: flex;
    justify-content: space-between;
}
.layout-heading3 .layout-lines .layout-line,
.layout-heading3 .layout-header .layout-logo{
    background-color: #6B7B8F;
}
.layout-heading3 .layout-menu-burger{
    width: 10%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;

}
.layout-heading3 .layout-menu-burger .line{
    background-color: #6B7B8F;
    width: 100%;
    aspect-ratio: 7/1;
}
.layout-heading3 .layout-right{
    display: flex;
    width: 80%;
    justify-content: flex-end;
}
.layout-heading3 .layout-social {
    width: 30%;
    margin-right: 10%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.layout-heading3 .layout-social .social-round{
    background-color: #6B7B8F;
    aspect-ratio: 1 / 1;
    width: 15%;
    border-radius: 50%;
}

.layout-heading4{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.layout-heading4 .layout-menu{
    background-color: #6B7B8F;
    width: 30%;
    aspect-ratio: 20/1;
}
.layout-heading4  .layout-header{
    flex-direction: column;
    text-align: center
}
.layout-heading4  .layout-lines{
    align-items: center;
}
.layout-heading4 .layout-header .layout-logo{
    margin: 0 auto 5%;
}

.layout-heading5{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}
.layout-heading5 .layout-menu{
    background-color: #6B7B8F;
    width: 70%;
    aspect-ratio:53/1;
}
.layout-heading3.active .layout-social .social-round,
.layout-header-drop-global.active .dropdown:before,
.layout-header-global.active .layout-menu-burger .line,
.layout-header-global.active .layout-menu,
.layout-header-global.active .layout-line,
.layout-header-global.active .layout-logo{
    background-color: #EAB01C;
}

/* headers drop */

.layout-header-drop-global{
    position: relative;
    width: 100%;
    z-index: 1;
}
.layout-header-drop-global.paddingbox{
    padding: 1% 5%;
}
.layout-header-drop-global .dropdown{
    position: relative;
    display: flex;
    padding: 2%;
    overflow: hidden;
}
.layout-header-drop-global .dropdown:before{
    content: "";
    background-color: #6B7B8F;
    width: 48%;
    position: absolute;
    z-index: -1;
    height: 100%;
    padding: 2%;
    top: -2%;
    left: -2%;
}
.layout-header-drop-global.layout-heading-drop1 .dropdown:before{
    width: 23%;
}
.layout-header-drop-global .layout-hd{
    aspect-ratio: 1 / 1;
    width: 10%;
    margin-right: 2%
}
.layout-header-drop-global .layout-hd .line{
    background-color: #2C3540;
    width: 100%;
    aspect-ratio: 10 / 1;
    margin-bottom: 10%;
}
.layout-header-drop-global .layout-hd-images-inline {
    display: flex;
    width: 25%;
}

.layout-header-drop-global .layout-hd-images-inline .image{
    background-color: #2C3540;
    aspect-ratio: 1 / 1;
    width: 30%;
    margin-right: 3%
}
.layout-header-drop-global .layout-hd-images-inline.layout-hd-images-inline2{
    display: flex;
    flex-wrap: wrap;
}
.layout-header-drop-global .layout-hd-images-inline.layout-hd-images-inline2  .image{
    width: 47%;
    margin-right: 3%;
    margin-bottom: 3%
}

/*underline*/
.layout-underline-global{
    padding: 2% 0%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
}
.layout-underline-global .title{
    aspect-ratio: 10 / 1;
    width: 40%;
    background-color: #6B7B8F;
}

.layout-underline-global .title.title-big{
    aspect-ratio: 8 / 1;
}
.layout-underline-global.layout-underline1{
    flex-direction: column;
    width: 40%;
    padding: 2%;
    margin: 0 auto;
}
.layout-underline-global.layout-underline1.left{
    align-items: flex-start;
}
.layout-underline-global.layout-underline1.right{
    align-items: flex-end;
}
.layout-underline-global.layout-underline1.center{
    align-items: center;
}
.layout-underline-global.layout-underline1.above{
    flex-direction: column-reverse;
}
.layout-underline-global.layout-underline1.bellow{
    flex-direction: column;
}
.logged-in .user-design-page .design-box-style-border.textleft{
    justify-content:  flex-start;
}
.logged-in .user-design-page .design-box-style-border.textcenter{
    justify-content: center;
}
.logged-in .user-design-page .design-box-style-border.textright{
    justify-content: flex-end;
}
.logged-in .user-design-page .design-box-style-border.preview .layout-underline-global.layout-underline1{
    margin: 0;
}
.logged-in .user-design-page .design-box-style-border.preview{
    margin-top: 50px;
}
.layout-underline-global.layout-underline1 .title{
    width: 100%;
    margin: 5% 0;
}
.layout-underline-global.layout-underline1 .line{
    aspect-ratio: 12 / 1;
    width: 50%;

    background-color: #EAB01C;
}
.layout-underline-global.layout-underline2{
    display: flex;
    width: 100%;
    flex-direction: column;
}
.layout-underline-global.layout-underline2 .graphic {
    display: flex;
    width: 60%;
    align-items: center;
    margin-top: 5%;
}
.layout-underline-global.layout-underline2 .graphic .line{
    aspect-ratio: 12 / 1;
    width: 50%;
    background-color: #EAB01C;

}
.layout-underline-global.layout-underline2 .graphic .logo{
    aspect-ratio: 1 / 1;
    min-width: 12%;
    background-color: #EAB01C;
    margin: 0 5%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.layout-underline-global.layout-underline3{
    justify-content: space-between;
}
.layout-underline-global.layout-underline3 .title{
    width: 20%;
}
.layout-underline-global.layout-underline3 .line{
    aspect-ratio: 45 / 1;
    width: 75%;
    background-color: #EAB01C;
}

.layout-underline-global.layout-underline4{
    justify-content: space-between;
    width: 60%;
    margin: 0 auto;
}
.layout-underline-global.layout-underline4 .title{
    width: 40%;
}
.layout-underline-global.layout-underline4 .line{
    aspect-ratio: 6 / 1;
    width: 20%;
    background-color: #EAB01C;
}

.layout-underline-global.layout-underline-position.active .title{
    background-color: #EAB01C;
}
.layout-underline-global.layout-underline-position.left{
    justify-content: flex-start;
}
.layout-underline-global.layout-underline-position.right{
    justify-content: flex-end;
}
.layout-underline-global.layout-underline-position.center{
    justify-content: center;
}
/*text*/
.layout-text-global{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%
}
.layout-text-global.left{
    align-items: flex-start;
}
.layout-text-global.center{
    align-items: center;
}
.layout-text-global.right{
    align-items: flex-end;
}
.layout-text-global .text{
    background-color: #6B7B8F;
}
.layout-text-global .text.text1{
    aspect-ratio: 36 / 1;
    width: 60%;
    margin-bottom: 2%
}

.layout-text-global .text.text2{
    aspect-ratio: 24 / 1;
    width: 40%;
    background-color: #6B7B8F;
}
/* buttons*/
.layout-buttons-global {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%
}
.layout-buttons-global.positionleft{
    justify-content: flex-start;
}
.layout-buttons-global.positioncenter{
    justify-content: center;
}
.layout-buttons-global.positionright{
    justify-content: flex-end;
}
.layout-buttons-global .button{
    aspect-ratio: 4 / 1;
    min-width: 20%;
    background-color: #6B7B8F;
    margin: 0 1%;
    border-radius: 50px;
}
.layout-buttons-global.active .button{
    background-color: #EAB01C;
}
/*announcement*/
.position-announcementright .layout-announcement-global{
    right:0;
}
.layout-announcement-global {
    position: absolute;
    width: 20%;
    margin: 0 5%;
    bottom: 10%;
    z-index: 10;
}
.layout-announcement-global .circle{
    aspect-ratio: 1 / 1;
    width: 20%;
    background-color: #6B7B8F;
    margin: 0 5%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    position: absolute;
    bottom: -7%;
}
.layout-announcement-global .announcement{
    width: 100%;
    aspect-ratio: 1 / 1.2;
    background-color: #fff;
    border: 1px solid #6B7B8F;
}
.layout-announcement-global .announcement .close{
    background: #fff;
    opacity: 0.65;
    width: 20%;
    aspect-ratio: 1 / 1;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-border-bottom-right-radius: 150%;
    -moz-border-radius-bottomright: 150%;
    border-bottom-right-radius: 150%;

}
.layout-announcement-global .announcement .top{
    background: #6B7B8F;
    height: 50%;
}
.position-announcementright .layout-announcement-global .circle{
    right: -14%;
}
.position-announcementleft .layout-announcement-global .circle{
    left: -14%;
}
.layout-announcement-global.active .circle{
    background: #EAB01C;
}

.layout-announcement-global.active .top{
    background: #EAB01C;
}
.layout-announcement-global.active .close{
    background: #6B7B8F;
    opacity: 1;
}

/*welcome*/
.opacity_bg,
.image_shape_welcome,
.image_shape_graphical,
.image_shape_news,
.image_shape_social,
.image_shape_calendar,
.show_bg_options_welcome,
.show_bg_options_links,
.show_bg_options_news,
.show_bg_options_social,
.show_bg_options_calendar,
.image_shape_accordion,
.image_shape_document_links,
.image_shape_page_links{
    display: none;
}

.image_shape_welcome.active,
.image_shape_graphical.active,
.image_shape_news.active,
.image_shape_social.active,
.image_shape_calendar.active,
.show_bg_options_welcome.active,
.show_bg_options_links.active,
.show_bg_options_news.active,
.show_bg_options_social.active,
.show_bg_options_calendar.active,
.image_shape_accordion.active,
.image_shape_document_links.active,
.image_shape_page_links.active{
    display: block;
}
.opacity_bg.active{
    display: flex;
}
.logged-in .user-design-page .colour-select-list .input-radious-box{
    color: #fff;
    margin-left: 20px;
    align-items: center;
}
.logged-in .user-design-page .colour-select-list .input-radious-box input{
    font-family: 'Lato', sans-serif;
    font-size: 14px;
    cursor: text;
    opacity: 1;
    appearance: textfield;
    -moz-appearance: textfield;
    -webkit-appearance: textfield;
    margin: 0 0 30px;
    border: 1px solid #fff;
    background-color: transparent;
    color: #fff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 0 10px;
    width: 25px;
}
.layout-welcome-global{
    position: relative;
    width: 90%;
    margin: 0 5%;
    display: flex;
    justify-content: space-between;
}
.logged-in .user-design-page h3.overwrite-box{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.logged-in .user-design-page h3.overwrite-box .switch-box{
    margin-bottom: 0;
}
.layout-welcome-global .image{
    width: 34%;
    padding: 3%;
    aspect-ratio: 1 / 1;
    background: #6B7B8F;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}
.layout-welcome-global .image .play{
    width: 20%;
    aspect-ratio: 1 / 1;
    background: #212933;
    -webkit-border-radius: 50%;
    -moz-border-radius:50%;
    border-radius:50%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.layout-welcome-global .image .play:before{
    content: "";
    width: 40%;
    aspect-ratio: 1 / 1;

}
.layout-welcome-global .image.centerplay{
    justify-content:center;
    align-items: center;
}
.layout-welcome-global .image.leftplay{
    justify-content: flex-start;
    align-items: flex-end;
}
.layout-welcome-global .image.rightplay{
    justify-content: flex-end;
    align-items: flex-end;
}
.layout-welcome-global .image.topleftplay{
    justify-content: flex-start;
    align-items: flex-start;
}
.layout-welcome-global .image.toprightplay{
    justify-content: flex-end;
    align-items:flex-start;
}
.layout-welcome-global.right{
    flex-direction: row-reverse;
}
.layout-welcome-global.left{
    flex-direction: row;
}
.layout-welcome-global.center{
    justify-content: center;
}
.layout-welcome-global .image.round{
    -webkit-border-radius: 50%;
    -moz-border-radius:50%;
    border-radius:50%;
}
.layout-welcome-global .image.rounded{
    -webkit-border-radius: 10%;
    -moz-border-radius:10%;
    border-radius:10%;
}
.layout-welcome-global .text-box{
    width: 55%;
}
.layout-welcome-global .text-box .layout-underline-global .title{
    width: 70%;
    margin-bottom: 3%;
}
.layout-welcome-global .text-box .layout-text-global .text.text1{
    width: 100%;
}
.layout-welcome-global .text-box .layout-text-global .text.text2{
    width: 70%;
    margin-bottom: 3%;
}
.layout-welcome-global .text-box .layout-buttons-global .button{
    min-width: 30%;
}
.layout-welcome-global.active .image,
.layout-welcome-global.active .title,
.layout-welcome-global.active .text,
.layout-welcome-global.active .button{
    background-color: #EAB01C;
}

.logged-in .user-design-page .design-box-style .select-box{
    display: flex;
    justify-content: space-between;
}

.logged-in .user-design-page .header-slider-style-check{
    cursor: pointer;
}

.logged-in .user-design-page .design-box-style .select-box .check{
    width:20px;
    height: 20px;
    background: #3C4753;
    display: inline-block;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    position: relative;
}
.logged-in .user-design-page .design-box-style .select-box .check::after{
    content: "";
    width:8px;
    height: 8px;
    background: #fff;
    display: none;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    position: absolute;
    top: 6px;
    left: 6px;
}
.logged-in .user-design-page .design-box-style .select-box .check.show:after{
    display: block;
}
.logged-in .user-design-page .design-box-style-border:before{
    position: absolute;
    bottom: 0;
    z-index: 9;
    width: 100%;
    height: 100%;
    content: "";
    background-size: 100% auto;
}
.logged-in .user-design-page .design-box-style-border.design-headerslider1:before,
.logged-in .user-design-page .design-box-style.design-headerslider1:before{
    background-image:url("../../../assets/images/design/headerslider/hs-curve-left.svg");
}
.logged-in .user-design-page .design-box-style-border.design-headerslider2:before,
.logged-in .user-design-page .design-box-style.design-headerslider2:before{
    background-image:url("../../../assets/images/design/headerslider/hs-curve-right.svg");
}

.logged-in .user-design-page .design-box-style-border.design-headerslider3:before,
.logged-in .user-design-page .design-box-style.design-headerslider3:before{
    background-image:url("../../../assets/images/design/headerslider/hs-curve.svg");
}
.logged-in .user-design-page .design-box-style-border.design-headerslider4:before,
.logged-in .user-design-page .design-box-style.design-headerslider4:before{
    background-image:url("../../../assets/images/design/headerslider/hs-wave-left.svg");
}
.logged-in .user-design-page .design-box-style-border.design-headerslider5:before,
.logged-in .user-design-page .design-box-style.design-headerslider5:before{
    background-image:url("../../../assets/images/design/headerslider/hs-wave-right.svg");
}
.logged-in .user-design-page .design-box-style-border.design-headerslider6:before,
.logged-in .user-design-page .design-box-style.design-headerslider6:before{
    background-image:url("../../../assets/images/design/headerslider/hs-angle-left.svg");
}
.logged-in .user-design-page .design-box-style-border.design-headerslider7:before,
.logged-in .user-design-page .design-box-style.design-headerslider7:before{
    background-image:url("../../../assets/images/design/headerslider/hs-angle-right.svg");
}
.logged-in .user-design-page .header-size-change{
    display: flex;
    justify-content: space-between;
}
.logged-in .user-design-page  .header-slider-style{
    padding: 0 10px;
}
.logged-in .user-design-page .design-box-style.size-sizethreethird:after{
    content: "";
    position: absolute;
    height: 30%;
    width:calc(100% - 3px);
    bottom: 0;
    background: #343E4A;
    margin: 0 auto;
    left: 1px;
    right: 0px;
    bottom: 1px;
    border-top: 1px solid #6B7B8F;
}
.logged-in .user-design-page .colours-list-box .colour-select-list.full-flex{
    flex:0 0 100%
}
.logged-in .user-design-page h3.overwrite-box.button-keyline-settings{
    display: none;
}
.logged-in .user-design-page h3.overwrite-box.button-keyline-settings.active{
    display: flex;
}