body {
font-family: "LatoWebLight", Arial;
color: #000000;
margin: 0;

}

html {
  
  line-height: 1.4;
  width: 100%;
  height: 100%;
}

img {
	max-width:100%;
	height:auto;
    }
* {
	box-sizing: border-box;
}


h1 {
  font-family: "LatoWebLight", Arial;
  font-weight: 100;
  text-align: center;
  font-size: 3.1vw;
  line-height: 3.8vw;
  color:#000000;
  padding: 2% 3%;
  }
  
 .oportunities {
  font-family: "LatoWebBold", Arial;
  text-align: center;
  font-size: 2.6vw;
  line-height: 3.1vw;
  color:#ffffff;
  padding: 3vw 3vw 0 3vw;
 }
h2 {
  font-family: "LatoWebBlack", Arial;
  text-align: center;
  color:#b31e4b;
  font-size: 2vw;
  line-height: 3vw;
  padding: 2vw;
  }

.price {
  font-size: 5vw;
  line-height: 5vw;
}

h3 {
  font-family: "LatoWebLight", Arial;
  font-weight: 100;
  font-size: 1.7vw;
  line-height: 2.2vw;
  text-align: left;
  padding: 4vw 2vw 0 5.3vw;
  color:#000000;
}
.training {
  padding: 0vw 4vw 0 5.3vw;
  font-size: 1.3vw;
  line-height: 1.6vw;	
}
h4 {
  font-family: "LatoWebBold", Arial;
  font-size: 1.2vw;
  line-height: 1.4vw;
  text-align: center;
  color:#000000;
  padding: 0 5vw;
  
}

table, td, th {
  border: 0px solid;
  padding: 1vw;
}

table {
  width: 100%;
  border-collapse: collapse;
}
.tdwithborder {
	border-right: 1px solid #000000;
}
.trwithborder {
	border-bottom: 1px solid #000000;
}
.colored {
  font-family: "LatoWebBlack", Arial;
  font-size: 1.6vw;
  line-height: 1.8vw;
  color: #b31e4b;
}
.lastline {
  font-family: "LatoWebLight", Arial;
  font-weight: 100;
  text-align: center;
  font-size: 1.6vw;
  line-height: 2vw;
  color: #000000;
  padding: 0 2vw 2vw 2vw;
  }
.new {
  font-family: "LatoWebBold", Arial;
  text-align: center;
  font-size: 2.1vw;
  line-height: 2.3vw;
  color: #b31e4b;
}

p {
  font-family: "LatoWebLight", Arial;
  font-weight: 100;
  text-align: left;
  font-size: 1vw;
  line-height: 1.3vw;
  color:#000000;
  padding: 3%;
}
.pbag {
  font-family: "LatoWebLight", Arial;
  font-weight: 100;
  text-align: left;
  font-size: 1.3vw;
  line-height: 2vw;
  color:#7f28c4;
  padding: 0vw 6vw 0vw 2vw;
}

.wrapsection {
    margin: 0px auto;
	padding: 0;
} 
.wrapsection:after {
  content: "";
  display: table;
  clear: both;
}
.wrapsectioncolor {
    background-color: #e2e2e2;
	margin: 0 3vw;
} 
.wrapsectioncolor:after {
  content: "";
  display: table;
  clear: both;
}

.spacer {
	display: block;
	height: 2vw;
	width: 100%;
	}


.dark {
	font-family: "LatoWebBold", Arial;
}
.darker {
	font-family: "LatoWebBlack", Arial;
}
.lighter {
	font-family: "LatoWebLight", Arial;
    font-weight: 100;
}
.regular {
	font-family: "LatoWeb", Arial;
    font-weight: 100;
}

.hero {
	width: 100%;
	float: left;
	text-align: center;
	padding: 0;
	position: relative;
}
.hero:after {
  content: "";
  display: table;
  clear: both;
}
.hero3 {
	width: 33.33%;
	float: left;
	text-align: center;
	padding: 0;
}
.hero3:after {
  content: "";
  display: table;
  clear: both;
}



.desc  {
  font-family: "LatoWeb", Arial;
  font-size: 0.9vw;
  line-height: 1.2vw;
  color:#000000;
  position: absolute;
}
.conditions  {
  font-size: 1.8vw;
  line-height: 2.3vw;
  position: absolute;
}

.desc11  {
  text-align: center;
  position: absolute;
  top: 82%;
  left: 18vw;
  padding-right:60vw;
}
.desc12  {
  text-align: center;
  position: absolute;
  top: 82%;
  left: 40vw;
  padding-right:32vw;
}
.desc13  {
  text-align: center;
  position: absolute;
  top: 82%;
  left: 67vw;
  padding-right:7vw;
}

.desc14 {
  text-align: center;
  top: 79%;
  left: 60vw;
  padding-right:12vw;
}

.desc21  {
  text-align: center;
  position: absolute;
  top: 81%;
  left: 15vw;
  padding-right:60vw;
}
.desc22  {
  text-align: center;
  position: absolute;
  top: 81%;
  left: 37vw;
  padding-right:31vw;
}
.desc23  {
  text-align: center;
  position: absolute;
  top: 81%;
  left: 66vw;
  padding-right:6vw;
}

.desc24 {
  text-align: center;
  top: 82%;
  left: 56vw;
  padding-right:8vw;
}

.desc31  {
  text-align: center;
  position: absolute;
  top: 79%;
  left: 15vw;
  padding-right:60vw;
}
.desc32  {
  text-align: center;
  position: absolute;
  top: 79%;
  left: 38vw;
  padding-right:30vw;
}
.desc33  {
  text-align: center;
  position: absolute;
  top: 79%;
  left: 66vw;
  padding-right:6vw;
}
.desc35  {
  text-align: center;
  position: absolute;
  top: 86%;
  left: 6vw;
  padding-right:58vw;
}

.desc36 {
  text-align: center;
  top: 86%;
  left: 52vw;
  padding-right:8vw;
}
.desc34 {
  text-align: center;
  top: 76%;
  left: 60vw;
  padding-right:9vw;
}
.headlinedesc1 {
  font-family: "LatoWebBold", Arial;
  text-align: center;
  position: absolute;
  top: 76%;
  left: 16vw;
  padding-right:50vw; 
}
.headlinedesc2 {
  font-family: "LatoWebBold", Arial;
  text-align: center;
  position: absolute;
  top: 79%;
  left: 60vw;
  padding-right:6vw; 
}


.samples1  {
  font-family: "LatoWeb", Arial;
  text-align: left;
  color:#ffffff;
  font-size: 1.55vw;
  line-height: 1.9vw;
  position: absolute;
  top: 6%;
  left: 45.5vw;
  padding-top: 0vw;
  padding-right:14vw;
}
.samples2  {
  font-family: "LatoWebLight", Arial;
  font-weight: 100;
  text-align: left;
  color:#000000;
  font-size: 1.4vw;
  line-height: 1.6vw;
  position: absolute;
  top: 49%;
  left: 45.5vw;
  padding-top: 0vw;
  padding-right:15vw;
}
.samples3  {
  font-family: "LatoWeb", Arial;
  text-align: left;
  color:#ffffff;
  font-size: 0.95vw;
  line-height: 1.1vw;
  position: absolute;
  top: 62%;
  left: 45.5vw;
  padding-top: 0vw;
  padding-right:12vw;
}
.samples-button {
    position: absolute;
	top: 70%;
    left: 60vw;
	padding-right: 5vw;
}
.button_white {
	width: auto;
	border-radius: 0.5vw;
	font-size: 3vw;
    line-height: 4vw;
	padding: 2vw 3vw;
    color: #000000;
	background-color: #ffffff;
}

.headlineinpink {
  font-family: "LatoWebLight", Arial;
  font-weight: 100;
  text-align: center;
  color:#000000;
  font-size: 2vw;
  line-height: 2.3vw;
}
.ln {
  font-family: "LatoWebBlack", Arial;
  font-size: 1.55vw;
  line-height: 1.9vw;
}
.bigger {
  font-family: "LatoWebBlack", Arial;
  font-size: 3vw;
  line-height: 3.3vw;
}

.headlineinpink2 {
  font-family: "LatoWebBold", Arial;
  font-size: 1.55vw;
  line-height: 2.2vw;
  text-align: center;
  color:#000000;
}
.bigger2 {
  font-family: "LatoWebBlack", Arial;
  font-size: 1.6vw;
  line-height: 1.6vw;
}
.price {
  font-family: "LatoWebBold", Arial;
  font-size: 1.3vw;
  line-height: 2vw;
  text-decoration:line-through;
}

.diffpadding {
	padding-top: 8vw;
}

.nopadding {
	padding-top: 0;
}

.rounddiv {
	background: rgb(117,50,156);
    background: linear-gradient(90deg, rgba(117,50,156,1) 0%, rgba(212,41,145,1) 50%, rgba(117,50,156,1) 100%);
	color: #ffffff; 
	margin:6vw 5vw;
	border-radius: 6vw 0 6vw 0;
}

.container {
  position: relative;
  text-align: center;
}
.avonontext {
  font-family: "LatoWebBlack", Arial;
  color:#ffffff;
  text-align: right;
  font-size: 2.5vw;
  line-height: 2.3vw;
  position: absolute;
  top: 25%;
  left: 50vw;
  padding-right:7vw;
  margin-top:0;
}
.different {
  font-family: "LatoWebLight", Arial;
  font-weight: 100;
  text-align: right;
  font-size: 2vw;
  line-height: 2.3vw;
  color:#ffffff;
  padding: 1vw 0;
  }

.downloadnow {
  font-family: "LatoWebBlack", Arial;
  text-align: center;
  color:#ffffff;
  font-size: 1.3vw;
  line-height: 1vw;
  padding: 8% 14% 0 13%;
}

.transptext {
	font-family: "LatoWebBlack", Arial;
	color: transparent;
   -webkit-text-stroke: 0.1vw #E5231B;
}


.badges {
	height: 5.5vw;
	width: auto;
	padding-top: 1.5vw;
}
.avonon {
	padding: 4% 15% 2% 2%;
}

a { color: #000000; text-decoration: none; }
.button_round {
	font-family: "LatoWebBold", Arial;
	width: 15vw;
	border-radius: 0.2vw;
	color: #ffffff;
	background-color: #000000;
	text-decoration: none;
	padding: 1vw 2vw;
}
.button_round:hover {color: #fff; opacity: 0.8;}



.deskt {
	display: block;
}
.mob {
	display: none;
}



/*********************
RESPONSIVE
*********************/


@media all and  (max-width: 600px) {
	
h1 {
  font-size: 5.2vw;
  line-height: 6vw;
  padding: 2% 2% 0;
  }
		
h2 {
  font-size: 5vw;
  line-height: 6vw;
  padding: 3vw;
  }

.price {
  font-size: 15vw;
  line-height: 15vw;
}

h3 {
  font-size: 3.2vw;
  line-height: 4vw;
  text-align: center;
 }
 
 .training {
  padding: 0vw 6vw;
  font-size: 4.5vw;
  line-height: 5.2vw;	
}
h4 {
  font-size: 3vw;
  line-height: 4vw;
 
}		
.colored {
  font-size: 4vw;
  line-height: 5vw;
  color: #b31e4b;
}
 
p {
  font-size: 2.3vw;
  line-height: 3vw;
  } 
.transptext {
	font-family: "LatoWebBlack", Arial;
	color: transparent;
   -webkit-text-stroke: 0.2vw #E5231B;
}

.plus {
	padding:0vw 35vw;	
}
.diffpadding {
	padding-top: 8vw;
}

.nopadding {
	padding-top: 0;
}


.hero {
	text-align: center;
	padding:0vw;
}
.hero3 {
	width: 100%;
	float: none;
}

.deskt {
	display: none;
}
.mob {
	display: block;
}

.rounddiv {
	margin:8vw 5vw;
	border-radius: 10vw 0 10vw 0;
	padding: 1vw;
}

.desc  {
  font-size: 2.2vw;
  line-height: 2.8vw;
  text-align: center;
}
.desc11  {
  top: 38%;
  left:41vw;
  padding-right:13vw;
}
.desc12  {
  top: 63%;
  left: 34vw;
  padding-right:10vw;
}
.desc13  {
  top: 91%;
  left:34vw;
  padding-right:10vw;
}


.desc14 {
  top: 89%;
  left: 13vw;
  padding-right:13vw;
}

.desc21  {
  top: 39%;
  left:19vw;
  padding-right:0vw;
}
.desc22  {
  top: 63%;
  left:19vw;
  padding-right:0vw;
}
.desc23  {
  top: 91%;
  left:19vw;
  padding-right:0vw;
}

.desc24 {
  top: 89%;
  left: 12vw;
  padding-right:12vw;
}

.desc31  {
  top: 39%;
  left:25vw;
  padding-right:0vw;
}
.desc32  {
  top: 63%;
  left:25vw;
  padding-right:0vw;
}
.desc33  {
  top: 91%;
  left:25vw;
  padding-right:0vw;
}


.desc34 {
  text-align: center;
  top: 89%;
  left: 12vw;
  padding-right:12vw;
}

.desc35 {
  text-align: center;
  top: 41%;
  left: 2vw;
  padding-right: 2vw;
}

.desc36 {
  text-align: center;
  top: 92.5%;
  left: 10vw;
  padding-right: 0vw;
}
.conditions  {
  font-size: 2.8vw;
  line-height: 3vw;
}

.headlinedesc1 {
  text-align: center;
  top: 37%;
  left: 36vw;
  padding-right:30vw; 
}
.headlinedesc2 {
  text-align: center;
  top: 88%;
  left: 29vw;
  padding-right:6vw; 
}
.samples1  {
  font-size: 3.55vw;
  line-height: 4.2vw;
  top: 3%;
  left: 2vw;
  padding-top: 0vw;
  padding-right:6vw;
}
.samples2  {
  font-size: 3.2vw;
  line-height: 4.2vw;
  position: absolute;
  top: 24%;
  left: 2vw;
  padding-top: 0vw;
  padding-right:13vw;
}
.samples3  {
  font-size: 2.2vw;
  line-height: 2.6vw;
  position: absolute;
  top: 32%;
  left: 2vw;
  padding-top: 0vw;
  padding-right:6vw;
}
.samples-button {
    position: absolute;
	top: 60%;
    left: 60vw;
	padding-right: 5vw;
}
.button_white {
	width: auto;
	border-radius: 0.5vw;
	font-size: 3vw;
    line-height: 4vw;
	padding: 2vw 3vw;
	background-color: #ffffff;
	color: #000000;
}

.ln {
  font-size: 3.6vw;
  line-height: 5vw;
}
.headlineinpink {
  font-size: 3.7vw;
  line-height: 4.3vw;
}
.bigger {
  font-family: "LatoWebBlack", Arial;
  font-size: 6vw;
  line-height: 7vw;
}

.headlineinpink2 {
  font-size: 3.2vw;
  line-height: 4vw;

}
.bigger2 {
  font-family: "LatoWebBlack", Arial;
  font-size: 4.5vw;
  line-height: 4.5vw;
}
.price {
  font-family: "LatoWebBold", Arial;
  font-size: 2.8vw;
  line-height: 3.5vw;
  text-decoration:line-through;
}
.spacer {
	height: 4vw;
}



.avonontext {
  text-align: center;
  font-size: 4.5vw;
  line-height: 5.5vw;
  position: absolute;
  top: 70%;
  left: 7vw;
  padding-right:7vw;
  margin-top:0;
}
.different {
  text-align: center;
  font-size: 3.7vw;
  line-height: 4.7vw;
  padding: 0 6vw;
}
.different2 {
  text-align: center;
  font-size: 5vw;
  line-height: 6vw;
  color:#b31e4b;
  padding: 2vw 0 0;
 }
.badges {
	width: 80%;
	height: auto;
	padding-top: 1.5vw;
	display: inline;
	margin: 0 auto;
}
.avonon {
	padding:0;
	margin: 0 auto;
	width: 30%;
	height:auto;
}


.button_round {
	width: auto;
	border-radius: 0.5vw;
	font-size: 3vw;
    line-height: 4vw;
	padding: 2vw 3vw;
}

.lastline {
  font-size: 2.8vw;
  line-height: 3.5vw;
  padding: 0 2vw 2vw 2vw;
  }
.new {
  font-size: 3.6vw;
  line-height: 4.3vw;
}

.downloadnow {
  font-size: 3vw;
  line-height: 3vw;
  padding: 12% 0%;
}
 .oportunities {
  font-size: 4vw;
  line-height: 5vw;
   }

}