html { height: 100%; }

body { height: 100%; margin: 0 0 0 0; font-family: 'Kelson-Regular', Arial, sans-serif; background-color: #ffffff; }

@font-face {
	font-family: 'Kelson-Regular';
	src: url('fonts/Kelson-Regular.otf') format('opentype');
}

@font-face {
	font-family: 'Kelson-Light';
	src: url('fonts/Kelson-Light.otf') format('opentype');
}


::-moz-selection { background:#c6215f; color:#ffffff; }
::selection { background:#c6215f; color:#ffffff; } 

.top { background-color: #ffffff; padding: 2%; overflow: hidden; }

.top_logo { width: 50%; float: left; text-align: center; }
.top_slogan { width: 45%; float: left; text-align: center; }
.top_social { width: 5%; float: left; text-align: right; }

.top_logo img { width: 24%; }
.top_slogan img { width: 50%; }




   a:link.fb, a:visited.fb { float: left; display: block; width: 33px; height: 33px; margin: 0 5px 0 0; background-image: url('gfx/fb.svg'); background-repeat: no-repeat; background-position: 50% 50%; background-size: 70%; text-decoration: none; transition: background .40s ease-in-out; -moz-transition: background .40s ease-in-out; -webkit-transition: background .40s ease-in-out; }

a:hover.fb {  background-image: url('gfx/fb_on.svg'); }



@media screen and (max-width: 600px) {
  .top_logo  {
    width: 90%; padding: 7px 0 0 0;
  }
}


@media screen and (max-width: 600px) {
  .top_logo img {
    width: 50%;  
  }
}



@media screen and (max-width: 600px) {
  .top_slogan  {
    display: none;
  }
}


@media screen and (max-width: 600px) {
  .top_social  {
    width: 10%; margin: 7px 0 0 0;
  }
}



@media screen and (max-width: 600px) {
  a:link.fb { 

  width: 41px; height: 41px; background-size: 40%;  display: inline-block; float: none; margin: 0 1px 0 0;
  }
}



.bg {  background-image: linear-gradient(to right, #c62166 , #c53670);  overflow: hidden; }
.all { width: 90%; margin: 0px auto; overflow: hidden; }

.bottom { background-color: #ffffff; height: auto; }


@media screen and (max-width: 600px) {
  .all  {
    width: 99%;
  }
}

@media screen and (max-width: 1200px) {
  .all  {
    width: 100%;
  }
}



.info { margin: 0px auto; padding: 50px 10px 25px 10px; color: #ffffff; font-size: 14pt; text-align: center; }


.column_one {
  float: left;
  width: 30%; padding: 5% 0; 
   
}

.column_two {
  float: left;
  width: 30%; padding: 7% 0 2% 0; 
   
}


.column_three {
  float: left;
  width: 40%; padding: 0;  
   
}

.guy { width: 100%; display: flex; align-items: flex-end;  }
.guy img { width: 100%; }

.ks { width: 100%; }

.ks img { width: 20%; }




.dupa {
  float: left;
  width: 33%; height: 750px; padding: 0; text-align: center; background-image: url('gfx/guy.png'); background-position: 50% 100%; background-size: 550px; background-repeat: no-repeat; 
   
}



@media screen and (max-width: 600px) {
  .column_one {
    width: 100%; 
  }
}


@media screen and (max-width: 600px) {
  .column_two {
    width: 100%;
  }
}



@media screen and (max-width: 600px) {
  .column_three {
    width: 100%; height: 495px; padding: 0; background-image: url('gfx/guy.png'); background-size: 95%;  background-position: 50% 100%; background-repeat: no-repeat; 
  }
}


@media screen and (max-width: 600px) {
  .guy {
    display: none;
  }
}


@media screen and (min-width: 1200px) {
  .guy img {
    width: 120%; 
  }
}


.clear { clear: both; }



* {
font-variant-ligatures: none;
}

.box_one { 

width: 96%; margin: 0px auto; padding: 5% 5% 0 5%; text-align: left;
transition: background .40s ease-in-out; -moz-transition: background .40s ease-in-out; -webkit-transition: background .40s ease-in-out; 

}



.box_two { 

width: 82%; margin: 0px auto; text-align: center;
border: 0px; border-radius: 15px 15px 15px 15px; -moz-border-radius: 15px 15px 15px 15px; -webkit-border-radius: 15px 15px 15px 15px;
background-color: #ffffff;  background-image: url('gfx/bottom.svg'); background-size: 39%; background-position: 100% 100%; background-repeat: no-repeat; overflow: hidden;
transition: background .40s ease-in-out; -moz-transition: background .40s ease-in-out; -webkit-transition: background .40s ease-in-out;
}

.ribbon { padding: 30px 3% 30px 3%; background-image: url('gfx/ribbon.svg'); background-size: 22%; background-position: 101% 0%; background-repeat: no-repeat; }



@media screen and (max-width: 600px) {
  .box_one {
    width: 100%; padding: 0 2%; text-align: center;
  }
}



.l1 img { width: 80%; }
.l2 img { width: 80%; }
.l3 img { width: 60%; }
.arrows img { width: 10%; }
.r1 img { width: 83%; }
.r2 img { width: 77%; }


@media screen and (max-width: 600px) {
  .l1 img, .l2 img, .l3 img, .r1 img, .r2 img {
    width: 84%; 
  }
}



@media screen and (max-width: 600px) {
 .l3 img {
    padding: 0 16% 0 0; 
  }
}


@media screen and (max-width: 600px) {
  .arrows img {
    width: 15%; 
  }
}


@media screen and (max-width: 1460px) {
  .box_two {
    width: 94%; padding: 0; text-align: center; background-size: 45%;
  }
}



@media screen and (max-width: 1340px) {
  .box_two {
    width: 94%; padding: 0; text-align: center; background-size: 45%;
  }
}


@media screen and (max-width: 1200px) {
  .box_two {
    width: 96%; padding: 0; text-align: center; background-size: 45%;
  }
}



@media screen and (max-width: 1040px) {
  .box_two {
    width: 96%; padding: 0; text-align: center; background-size: 45%;
  }
}





@media screen and (max-width: 600px) {
  .box_two {
    width: 95%; padding: 0; text-align: center; background-size: 45%;
  }
}


@media screen and (max-width: 600px) {
  .ribbon {
    background-size: 27%;
  }
}



@media screen and (max-width: 1200px) {
  .box_two {
    width: 90%; 
  }
}



/* FORM */



.form_table { width: 90%; }
.form_table_cell { width: 100%; vertical-align: top; padding: 10px 0 10px 15%; }
.form_table td { text-align: left; }


.form_input {

	width: 85%; float: left;
	height: 39px;
	padding: 2px 9px; 
	font-family: 'Kelson-Regular', Arial, sans-serif;
	font-size: 10pt; font-weight: normal;
	color: #000000; letter-spacing: 0.5px;
	border: 1px solid #989898; background: transparent; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }



}

.form_table_message { vertical-align: top; width: 90%; height: 35px; text-align: left !important; float: left; padding: 0px 0 8px 0; }


#price_validation, #name_validation, #email_validation   {

	text-align: left; padding: 0 !important; 
	font-size: 12px; color: #c62166;

}

::placeholder {  font-family: 'Kelson-Light', Arial, sans-serif; color: #989898; opacity: 1; }

.form_send { height: 75px; padding: 0; text-align: center; width: 90%; }


.send_button {
 margin: 0px auto; text-align: center; display: block; font-family: 'Kelson-Regular', Arial, sans-serif; font-weight: normal; font-size: 16px; color: #ffffff; text-decoration: none; letter-spacing: 1px; background-color: #000000;
	padding: 0px 10px 0px 0; width: 105px; height: 40px; border: 0px;
	background-image: url('gfx/tick.svg'); background-size: 8%; background-position: 87% 50%; background-repeat: no-repeat;	
	transition: background .40s ease-in-out; -moz-transition: background .40s ease-in-out; -webkit-transition: background .40s ease-in-out;
cursor: pointer !important;


}


.send_button:hover {
background-color: #c6215f; color: #ffffff; text-decoration: none; background-position: 90% 50%;
cursor: pointer !important;

}




@media screen and (max-width: 1200px) {
  .form_table_cell {
   padding: 3px 0 3px 15%;
  }
}



@media screen and (max-width: 1200px) {
  .form_input {
   height: 24px; font-size: 7pt; 
  }
}


@media screen and (max-width: 600px) {
  .form_table {
    width: 100%;
  }
}


@media screen and (max-width: 600px) {
  .form_table_cell {
   padding: 7px 0 7px 15%;
  }
}

@media screen and (max-width: 600px) {
  .form_input {
   height: 34px; font-size: 10pt; 
  }
}



/* FORM */


* {
  box-sizing: border-box;
}