﻿/***** BUILDER CSS *****/

/* Prevent scroll on narrow devices */
/*html, body {
  overflow-x: hidden;
  padding: 0px !important;
}*/

body .builder{
    color:#212529;
    font-family: var(--bs-body-font-family);
}

.builder h1,.builder h2, .builder h3, .builder h4, .builder h5, .builder h6{
    font-family: var(--bs-body-font-family);
}

/*** ANCHORS ***/
.builder a, .builder .btn-link{
    color:#1d9d84;
    text-decoration:none;
    cursor:pointer;
}
.builder a:hover,.builder .btn-link:hover,.builder .btn-link:focus,.builder .btn-link:active,.builder :not(.btn-check)+.btn-link:active{
    text-decoration:underline;
    color:#1d9d84;
    cursor:pointer;
}
.builder.btn.btn-link.btn-link-sucess{
    color:#1d9d84;
    text-decoration:none;
}
.builder.btn.btn-link.btn-link-sucess:hover{
    text-decoration:underline;
    color:#1d9d84;
}

/*** COLORS ***/
.bg-success{
    background-color:#1d9d84!important;
}
.text-success{
    color:#1d9d84!important;
}
.svg-success {
    filter: invert(42%) sepia(53%) saturate(2703%) hue-rotate(139deg) brightness(84%) contrast(85%);
}
.svg-white {
    filter: invert(99%) sepia(99%) saturate(4%) hue-rotate(196deg) brightness(107%) contrast(100%);
}
.svg-black {
    filter: invert(0%) sepia(0%) saturate(12%) hue-rotate(257deg) brightness(104%) contrast(104%);
}
.svg-dark{
    filter: invert(43%) sepia(2%) saturate(1988%) hue-rotate(167deg) brightness(102%) contrast(85%);
}

/***BUTTONS ***/
.builder.btn-success {
    color: #fff;
    background-color:#1d9d84!important;
    border-color:#1d9d84!important;
}
.builder.btn-success:hover, .builder.btn-success:active {
    color: #fff;
    background-color:#139376;
    border-color:#139376;
    text-decoration:none;
}
.builder.btn-outline-success {
    color:#1d9d84;
    border-color:#1d9d84;
}
.builder.btn-outline-success:hover, .builder.btn-outline-success:active {
    color:#139376;
    border-color: #139376;
    text-decoration:none;
}
.builder.btn-light{
    
}
.builder.btn-light:hover, .builder.btn-light:active{
    text-decoration:none;
}
.builder.btn-edit{
    color:rgba(var(--bs-secondary-rgb));
}
.builder.btn-edit:hover, .builder.btn-edit:active{
    color:#1d9d84;
}
.builder.btn-offcanvas-buttons{
    color:rgba(var(--bs-secondary-rgb));
}
.builder.btn-offcanvas-buttons:hover, .builder.btn-offcanvas-buttons:active{
    color:#1d9d84;
}
.builder.btn-close-offcanvas{
    color:rgba(var(--bs-secondary-rgb));
}
.builder.btn-close-offcanvas:hover, .builder.btn-close-offcanvas:active{
    color:#1d9d84;
}
.builder.btn-offcanvas-position{
    color:rgba(var(--bs-secondary-rgb));
}
.builder.btn-offcanvas-position:hover, .builder.btn-offcanvas-position:active{
    color:#1d9d84;
}
.builder.btn-navbar{
    color:rgba(var(--bs-secondary-rgb));
    text-decoration:none;
}
.builder.btn-navbar:hover, .builder.btn-navbar:active, .builder.btn-navbar:focus, .builder.btn-offcanvas-position:active {
    color: #1d9d84;
    text-decoration: none;
}
.builder.btn-copy img{
    filter: invert(43%) sepia(2%) saturate(1988%) hue-rotate(167deg) brightness(102%) contrast(85%);
}
.builder.btn-copy img:hover, .builder.btn-copy img:active{
    filter: invert(42%) sepia(53%) saturate(2703%) hue-rotate(139deg) brightness(84%) contrast(85%);
    /*filter: invert(13%) sepia(16%) saturate(595%) hue-rotate(118deg) brightness(92%) contrast(90%);*/
}

/*** BUTTON CHECK ***/
.builder .btn-check:checked+.btn.btn-outline-success {
    color: var(--bs-btn-active-color);
    background-color:#1d9d84;
    border-color:#1d9d84;
}

/*** NAVBAR ***/
.builder.navbar .navbar-brand{
    font-size:1.4rem;
    color:#1d9d84;
}
.builder.navbar .navbar-brand:hover {
    text-decoration:none;
    color:#1d9d84;
}
.builder.navbar .navbar-brand:focus{
   text-decoration:none;
   color:#1d9d84;
}
.builder.navbar .navbar-nav .nav-link {
     color:rgba(0, 0, 0, 0.55);
}
.builder.navbar .navbar-nav .nav-link:hover {
    color:#1d9d84;
    text-decoration:none;
}

.builder.navbar .dropdown a{
    color:rgba(0,0,0,.9);
}
.builder.navbar .dropdown a:hover {
    text-decoration:none;
    color:#1d9d84;
}
.builder.navbar .dropdown .dropdown-item:focus, .dropdown-item:hover {
    background:#fff;
}

/*** COLORS ***/
.builder.bg-success{
    background-color:#1d9d84!important;
}
.builder.text-success{
    color:#1d9d84!important;
}
.builder.text-custom-light{
    color:#666;
}

/*OFFCANVAS*/
/*Transition*/
.builder.fade-scale {
  opacity: 1;
  -webkit-transition: all .20s linear;
  -o-transition: all .20s linear;
  transition: all .20s linear;
}

/*EDIT SITE ELEMENTS*/
/*siteElement hover*/
.builder.edit-siteElement{
    position:absolute; 
    top: 0px;
    right: 0px;
    left: 0px;
    bottom: 0px;
    opacity:0;
}
.builder.edit-siteElement:hover, .builder.edit-siteElement:focus{
    opacity:1;
    cursor:pointer;
    border: 3px dotted #1d9d84;
}
.builder.edit-siteElement .edit-content{
    background-color:#000;
    opacity:0.20;
    width:100%;
    height:100%;
    background-size: cover;
}
.builder.edit-siteElement .add-section{
     position: absolute;
     left: 50%;
     transform: translateX(-50%);
     bottom:-16px;
     z-index:3;
}
/*siteElement selected*/
.builder.selected-siteElement{
    position:absolute; 
    top: 0px;
    right: 0px;
    left: 0px;
    bottom: 0px;
    opacity:1;
    border: 4px solid #1d9d84;
    cursor:default;
}
.builder.selected-siteElement:hover .add-section, .selected.edit-siteElement:focus .add-section{
    opacity:1;
}
.builder.selected-siteElement .edit-content{
    background-color:#1d9d84;
    opacity:0.00;
    width:100%;
    height:100%;
    background-size: cover;
}
.builder.selected-siteElement .add-section{
    opacity:0;
     position: absolute;
     left: 50%;
     transform: translateX(-50%);
     bottom:-16px;
     z-index:3;
}
/*.builder.selected-siteElement{
    position:absolute; 
    top: 0px;
    right: 0px;
    left: 0px;
    bottom: 0px;
    opacity:1;
    cursor:default;
    border: 4px solid #1d9d84;
}
.builder.selected-siteElement .add-section{
     display:none;
}*/
/*Aspect ratio 3:2 -> fill and crop*/
.imgPreviewContainer_3_2 {
    position: relative;
    width:100%;
    height: 0;
    padding-top: 66.67%; 
    overflow:hidden;
}
/*Aspect ratio 4:3 -> fill and crop*/
.imgPreviewContainer_4_3 {
    position: relative;
    width:100%;
    height: 0;
    padding-top: 75%; 
    overflow:hidden;
}
/*Aspect ratio 16:9 -> fill and crop*/
.imgPreviewContainer_16_9 {
    position: relative;
    width:100%;
    height: 0;
    padding-top: 56.25%; 
    overflow:hidden;
}
.imgPreviewContainer_4_3 img, .imgPreviewContainer_16_9 img, .imgPreviewContainer_3_2 img{    
    position: absolute;
    top:0;
	width:100%;
    height:100%;
    object-fit: cover;
    object-position: center center;
}

.logoPreviewContainer {
    height:80px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow:hidden;
}
.logoPreviewContainer img {
    height:100%;
    object-fit: cover;
    object-position: center center;
}

/***ICONS***/
.selectIconList i {
    font-size: 2rem;
    padding: 2px 6px 2px 6px;
    border-radius: 10px;
    cursor: pointer;
    border: 3px solid transparent;
}
.selectIconList i.selected {
    border-color: #1d9d84;
}
.builder .fontSize18{
    font-size: 18px;
}


.editorBadge {
    cursor: default;
    display: inline-block;
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
    color: #212529;
    padding: 10px 12px;
    border-radius: 5px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
    text-decoration: none;
    font-size: 14px;
}
.editorBadge img {
  width: 25px;
  height: 25px;
  margin-right:8px;
}
.editorBadge .badge-text{
    font-weight:normal;
}
.editorBadge .badge-brand{
    font-weight:bold;
    color: #1d9d84;
}

/*** LOADER ***/
.builder.loader {
    z-index:9999;
    background-color: rgba(0,0,0,0.85)
}

.builder.loaderAnimation{
  width: 50px;
  height: 50px;
  border: 6px solid #1d9d84;
  border-radius: 50%;
  /*border-top: 6px solid #3498db;*/
  border-right: 6px solid rgba(0,0,0,0);
  animation: spin 1s linear infinite;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/*** TOOLTIP ***/
.tooltip { pointer-events: none; }

/*** SWITCH ***/
.form-check-input:checked {
    background-color: #1d9d84;
    border-color: #1d9d84;
}
.form-check-input:hover{
    cursor:pointer;
}

/*** ADD SECTION RADIOS ***/
.list-group-radio .list-group-item {
    cursor: pointer;
    border-radius: 0.5rem;
}
.list-group-radio .list-group-item:hover, .list-group-radio .list-group-item:focus {
    background-color: var(--bs-light);
}
.list-group-radio .form-check-input:checked + .list-group-item {
    background-color: var(--bs-body);
    border-color: #1d9d84;
    box-shadow: 0 0 0 2px #1d9d84;
}


/*** RANGE INPUT ***/
input[type=range]::-webkit-slider-thumb {
   background: #1d9d84;
}
input[type=range]::-moz-range-thumb {
   background: #1d9d84;
}
/* for ie */
input[type=range]::-ms-thumb {
   background: #1d9d84;
}


/*** Tiny MCE ***/
.tox .tox-statusbar{
    border-top:none!important;
    height:15px!important;
}

/*** Radio and checkbox inputs color ***/
.custom-radio-color:checked {
    background-color: #1d9d84;
    color: #fff;
    border-color: #1d9d84;
}
.custom-radio-color:focus {
    box-shadow: 0 0 0 .25rem rgba(29,157,132,.25);
}

/*** Color picker ***/
.pickr .pcr-button {
    width: 2.5rem!important;
    height: calc(1.5rem + 0.50rem + 2px)!important;
    border-radius: 0.375rem !important;
}
.pickr .pcr-button::before {
    border-radius: 0.375rem!important;
}
.pickr .pcr-button::after {
    box-shadow: unset !important;
    border: 1px solid #ced4da;
    border-radius: 0.375rem !important;
    transition:unset!important;
}
.pickr input:focus, .pickr input.pcr-active, .pickr button:focus, .pickr button.pcr-active, .pcr-app input:focus, .pcr-app input.pcr-active, .pcr-app button:focus, .pcr-app button.pcr-active {
    box-shadow: 0 0 0 0.15rem rgba(13,110,253,.25) !important;
    /*box-shadow: 0 0 0 0.15rem rgba(0, 0, 0,.25) !important;*/
    /*box-shadow: 0 0 0 0.25rem rgba(66, 68, 90,.25) !important;*/
    /*box-shadow: unset !important;*/
}
.pcr-app .pcr-interaction .pcr-result {
    color: #212529!important;
}
.pcr-current-color {
    border: 1px solid #dee2e6 !important;
}

/*** Nav tabs ***/
/*.nav .nav-item button {
    padding-bottom:10px;
}*/
.nav .nav-item button.active {
    background-color: transparent;
    color: #1d9d84 !important;
    border-bottom: 2px solid #1d9d84 !important;
    border-radius: 5px 5px 0 0;
}