#err{
    color: var(--red);
    background-color: #fff;
    padding: 15px 35px;
	border: 3px solid var(--red);
	}
#err.hid{padding: 0; display:none}
#promo1{padding: 10px;
    margin: 0 auto;
        display: block;
    background-color: var(--yellow);
    color: var(--blue);
    font-size: 22px;
	    border: 2px solid #fff;
    border-radius: 5px;
}

.errored {background-color: var(--pink)}

#step4 input.hid {margin: 0; display: none}

#step4 input,#step4 select  {padding: 10px;
    margin: 5px auto;
        display: block;
    background-color: var(--yellowLight);
    color: var(--blue);
    font-size: 22px;
	    border: 2px solid #fff;
    border-radius: 5px;
}

.blue {color:var(--blue); font-family: 'Montserrat', sans-serif;
    font-size: 24px;}

h2 {color: var(--yellow); font-family: 'Mulish', sans-serif; font-size: 34px;
    margin: 0 auto 20px;
    width: fit-content; line-height: 1.1;     text-align: center;}
	
	
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
   color: var(--blue);
  opacity: 0.8; /* Firefox */
}

.cLink {color: #fff; cursor:pointer;  margin: 20px auto;
        display: block;width: fit-content;}
.cLink:hover {text-decoration: underline}

#step1 {height: 250px; transition: height .5s}
#step2 {height: 510px; transition: height .5s}
#step1.hid, #step2.hid {height: 0; transition: height .5s}
#main.hid{dipslay: none}
#video1.hid{height:0; display:none}

#flex2, .flex2 {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.news {margin: 20px auto;
    margin: 20px auto;
    padding: 5px;
    background-color: #fff;
}
.news img {
    width: 100%;
    margin:  0;
}
.wow {
    font-size: 100px;
    font-family: 'Mulish', sans-serif;
    background-clip: text;
    -webkit-background-clip: text;
    color: var(--yellow);
    margin: 30px auto 10px auto;
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 1;
    text-align: center;
    font-size: 120px;
    font-size: 9vw;
    line-height: 0.9;
}

.step {height: fit-content; position: relative; transition: left .5s ease-out; left: 0; width: 100%}
.step.before {transition: left .5s ease-out; left: +200%; height: 0;}
.step.after, #step1.after, #step2.after, #step1.before, #step2.before{transition: left .5s ease-out; left: -200%; height: 0;}

.step span {margin: 20px auto 5px;
    display: block;
    width: calc(100% - 50px);
    line-height: 1.2;
}

.hid {height:0; padding: 0; display: none}

.error{    width: fit-content;
    margin: 0 auto;
    font-weight: bold;
    color: var(--orange);
}

#btSend,#btSend2 {    line-height: 1.3;}
#st5disp {margin: 0 auto}
#st5disp img {width: 100%}

.share { text-decoration: none;}
#shareFB {color: var(--red);
    background-color: var(--yellow);
    padding: 10px 20px;
    width: fit-content;
   
    font-size: 24px;
    margin: 10px auto;
}
@media (min-width:320px) { /* smartphones, portrait iPhone, portrait 480x320 phones (Android) */ 

	#main{width:90%}
	.news {width: 95%;}	
	#st5disp {width: 50%; max-width: 450px}
	#st8ad img{width: 95%;}
}

@media screen and (min-width: 1200px) {

	#main{width:100%}
	.news {width: 30%;}
	#st5disp {width: 95%; }
	#st8ad img{width: 50%;}
}