

.new-campaign, 
.campaign-inputs, 
.executive-summary, 
.bugget-allocation,
.analytics-insights,
.downloads
{
	margin-left: 0;
	width:100%;
}

.new-campaign .overlap-group, 
.campaign-inputs .overlap-group, 
.executive-summary .overlap-group1, 
.bugget-allocation .overlap-group,
.analytics-insights .overlap-group,
.downloads .overlap-group
{
    width: 100%;
    height: unset;
}

.new-campaign .left-panel-fixed,
.campaign-inputs .left-panel-fixed, 
.executive-summary .left-panel-fixed,
.bugget-allocation .left-panel-fixed,
.analytics-insights .left-panel-fixed,
.downloads .left-panel-fixed
{
	position:fixed;
	float: left;
	height: 100%;
}

.new-campaign .content, 
.campaign-inputs .content, 
.executive-summary .content, 
.bugget-allocation .content,
.analytics-insights .content,
.downloads .content
{
	margin-left: 300px;
	width: unset;
	left: unset;
	position: unset;
	height:unset;
	padding-top: 6px;
	min-height: 100vh;
}	


.new-campaign .footer, 
.campaign-inputs .footer, 
.executive-summary .footer,
.bugget-allocation .footer,
.analytics-insights .footer,
.downloads .footer
{
	width:100%;
	margin-top: 100px;
	top:unset;
}

.demo-visualisation-b {
	text-align: left;
}

/* fixes */

.campaigns-container{
	text-align: left;
}

.new-campaign .title {
	align-self:unset;
}

.executive-summary .button-container {
	box-shadow:unset;
}


.executive-summary .media-budget-1 {
	width: unset;
}

.analytics-insights .icon-channel,
.analytics-insights .icon-channel-3,
.analytics-insights .icon-channel-1
{
	background-repeat: no-repeat;
	background-size:contain;
}

.button-new-campaign {
	box-shadow: 0px 4px 4px #00000040;
}

.new-campaign .button-new-campaign {
	box-shadow: unset;
}

.new-campaign .place,
.new-campaign .target-channels,
.new-campaign .countries,
.new-campaign .genders 
{
	margin-right: unset;
	width: unset;
}


.input-field input[type=text]{
	border-radius: 10px;
}


.new-campaign .button-new-campaign{
  box-shadow: 0 0 10px #FBCBFF;
} 
.button-new-campaign{
  transition-duration: 0.15s;
}
.button-new-campaign:hover{
  box-shadow: 0 0 10px #FBCBFF;
}

/* interactions */
.campaigns-container a{
	color:var(--white);
}

.campaigns-container article:hover, 
.campaigns-container a:hover .frame{
	background-color: var(--white-2);
}


.unavailable, .top-nav img {
	cursor: not-allowed;
}


.frame-58.frame-1 .button {
  transition-duration: 0.15s;
}
.frame-58.frame-1 .button:hover{
  box-shadow: 0 0 10px #FBCBFF;
}

/* form */
.group-358 {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  gap: 9px;
  height: 101px;
  margin-right: -4px;
  min-width: 804px;
  position: relative;
  text-align: left;
}
.please-fill-in-your {
  color: var(--ebony-clay);
  font-family: var(--font-family-manrope);
  font-size: var(--font-size-l2);
  font-weight: 700;
  height: 44px;
  letter-spacing: 0.16px;
  line-height: normal;
  margin-left: 1px;
  width: 612px;
}

.form-field-group {
    align-items: center;
    background-color: var(--white);
    border: 2px solid;
    border-color: var(--canary);
    border-radius: 34px;
    box-shadow: 0px 4px 4px #00000040;
    display: flex;
    flex-direction: column;
    gap: 9px;
    min-height: 67px;
    padding: 3px 0;
    width: 612px;
    margin-top: 16px;
}



.select {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 5px;
  margin: 15px;
  overflow-y: scroll; 
  max-height:400px;
}

.select.two {
	grid-template-columns: repeat(2, 1fr);
}

.select__item {
  padding: 10px;
  cursor: pointer;
  font-family: var(--font-family-arial-bold);
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  align:center;
  border-radius: 15px;
  background: #f6f6f6;
  transition: background 0.1s;
}

.select__item:hover {
	box-shadow: inset 0 0 10px #FBCBFF;
}

.select__item--selected {
  background: #94A6FF;
  color: #ffffff;
}

.input-field{
	position: relative;
}

.input-field:hover .input-overlay{
	display: block;
}

.input-overlay {
  z-index: 100;
  display:none;
  align-items: center;
  background-color: var(--white);
  border: 2px solid;
  border-color: var(--canary);
  border-radius: 34px;
  box-shadow: 0px 4px 4px #00000040;
  position: absolute;
  width: 612px;
  top:-2px;
  padding-top:3px;
  gap: 9px;
}

.input-field .text-input{
  border:none;
  outline: none;
  display: inline-block;
  text-align: center;
}

.input-field .text-input:focus{
  box-shadow: inset 0 0 10px #FBCBFF;
}


/* age selector */
.age-slider span{
	font-size: 70%;
}


/* files apload */
.container {
/*  margin: 30px;*/
  padding-bottom: 20px;
  width:100%;
}
input[type="file"] {
  display: none;
}
label {
  display: block;
  position: relative;
  background-color: #025bee;
  color: #ffffff;
  font-size: 1.1em;
  text-align: center;
  width: 16em;
  padding: 1em 0;
  border-radius: 0.3em;
  margin: 0 auto 1em auto;
  cursor: pointer;
}
#image-display {
  	display: grid;
  	grid-template-columns: repeat(2, 1fr);
    gap: 23px;
    margin-left: 1px;
 	justify-content: space-evenly;
  	justify-items: center;
  	align-content: space-evenly;
  	align-items: center;
  	clear:all;
}
.active {
  border: 0.2em dashed #025bee;
}
#error {
  text-align: center;
  color: #ff3030;
  min-height: unset;
}





/* demo warning */
#dimScreen{
    position:fixed;
    padding:0;
    margin:0;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
    background:rgba(0,0,0,0.5);
}

#popup{
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 50%;
	background: #ffffff;
	border-radius: 34px;
	padding: 40px;
}

#popup .popup-text{ 
	padding: 20px 0;
}

#dimScreen .actions{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 5px;
    margin: 15px;
    justify-items: center;
}

#dimScreen.downloads-dim .actions{
	grid-template-columns: repeat(1, 1fr);
}


#dimScreen .actions a{
	border-radius: 34px;
	width:280px;
	height: 64px;
  transition-duration: 0.15s;

}

#dimScreen .actions a:hover {
	box-shadow: 0 0 10px #FBCBFF;
}

#dimScreen .actions img{
	width:280px;
}

.displayNone{
	display:none;
}
