/* =============================================================================
   HTML5 CSS Reset Minified - Eric Meyer
   ========================================================================== */

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent}
body{line-height:1}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;vertical-align:baseline;background:transparent;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}
li{list-style:none}


/* =============================================================================
   My CSS
   ========================================================================== */


/* ---- base ---- */

html,body{
	width:100%;
	height:100%;
	background:#111;
}

html{
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body{
  font:normal 75% Arial, Helvetica, sans-serif;
	font:normal 75% 'Montserrat', sans-serif;
}

canvas{
  display:block;
  vertical-align:bottom;
}

/* ---- particles.js ---- */

#particles-js{
  width: 100%;
  height: 100%;
  background-color: #000;
}

/* ---- Menu ---- */
input[type="checkbox"]#togglebox {
  /* checkbox used to toggle menu state */
  position: absolute;
  left: 0;
  top: 0;
  visibility: hidden;
}

label#navtoggler{  /* Main label icon to toggle menu state */
  z-index: 9;
  display: block;
  position: relative;
  font-size: 8px;
  /* change font size to change label dimensions. Leave width/height below alone */
  width: 4em;
  height: 2.5em;
  top: 45px;
  right: 45px;
  text-indent: -1000px;
  border-top: 0.6em solid white;
	border-bottom: 0.6em solid white;
  /* border color */
  border-width: 0.6em 0;
  cursor: pointer;
	position: absolute;
}

label#navtoggler:hover{  /* Main label icon to toggle menu state */
	border-top: 0.6em solid green;
	border-bottom: 0.6em solid green;
}

label#navtoggler::before{
  /* inner strip inside label */
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 0.6em;
  top: 50%;
  margin-top: -0.3em;
  left: 0;
  background: white; /* stripes background color. Change to match border color of parent label above */
}
label#navtoggler:hover::before{

  background: green; /* stripes background color. Change to match border color of parent label above */
}
nav#expand-fullpagemenu{ /* Full screen nav menu */
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  visibility: hidden;
  -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
  -webkit-transform: scale(0.9);  /* initially scale down nav size */
  transform: scale(0.9);
  background: #0F0F0F;
  display: block;
  position: fixed;
	z-index: 100;
  opacity: 0;
	text-align: center;
	overflow: auto;
  -moz-transition: visibility 0s 0.5s, opacity 0.5s, -moz-transform 0.5s; /* transition settings */
  -webkit-transition: visibility 0s 0.5s, opacity 0.5s, -webkit-transform 0.5s;
  transition: visibility 0s 0.5s, opacity 0.5s, transform 0.5s;
}

input[type="checkbox"]#togglebox:checked ~ nav#expand-fullpagemenu{ /* nav state when corresponding checkbox is checked */
	visibility: visible;
	-webkit-transform: scale(1);
	transform: scale(1);
	opacity: 1;
  -ms-transition-delay: 0s;
  -moz-transition-delay: 0s;
  -webkit-transition-delay: 0s;
  -transition-delay: 0s;
}

nav#expand-fullpagemenu label#closex{ /* Large x close button inside nav */
  width: 50px;
  height: 50px;
	overflow: hidden;
  display: block;
  position: absolute;
  cursor: pointer;
	text-indent: -1000px;
  z-index: 10;
  top: 20px;
  right: 20px;
}
nav#expand-fullpagemenu label#closex:hover{ /* Large x close button inside nav */
  transform: rotate(45deg);
}
nav#expand-fullpagemenu label#closex:hover::before, nav label#closex:hover::after{ /* render large cross inside close button */

	background: green;
}
nav#expand-fullpagemenu label#closex::before, nav label#closex::after{ /* render large cross inside close button */
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 2px;
  background: white;
  top: 50%;
  margin-top: -3px;
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

nav#expand-fullpagemenu label#closex::after{ /* render large cross inside close button */
  -ms-transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

nav#expand-fullpagemenu a{
	text-decoration: none;
  color: white;
  text-transform: uppercase;
}

nav#expand-fullpagemenu ul{
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
  max-height: 100%;
  top: 50%; /* center UL vertically inside nav */
  -webkit-transform: translateY(-50%); /* center UL vertically inside nav */
  transform: translateY(-50%);
  font-weight: 200;
	font-size: 2.4em;/* use google font inside nav UL */
}

nav#expand-fullpagemenu ul li{
  margin-bottom: 25px;
}
nav#expand-fullpagemenu ul li:hover::before,nav#expand-fullpagemenu ul li:hover::after{
border-width: 0 25px;
}

li::before,li::after{
	content: '';
    display: inline-block;
    vertical-align: middle;
    box-sizing: border-box;
    height: 2px;
    border: solid green;
	  border-width: 0 0px;
}
li::before {
	margin-right: 20px;
}
li::after {
	margin-left: 20px;
}

.main{
	position: absolute;
	width: 290px;
	top: 50%;
	left: 50%;
	margin: -81px 0 0 -145px;
	z-index: 10;
}
.hr{
	position: absolute;
	height: 75px;
	border-style: solid;
	border-width: 0 2px 0  0;
	border-color: green;
	bottom: 0;
	left: 50%;
}
.discover{
	cursor: pointer;
	position: absolute;
	color: white;
	bottom: 78px;
	font-size: 2em;
	left: 50%;
	transform: translate(-50%, -50%);
}

@media (min-width:420px) {
	.discover:hover{
		font-size: 2.1em;
	}
}
#logoMin{
	position: absolute;
	top:20px;
	left:20px;
	width: 75px;
}
/* ABOUT START */
.containerAbout{
	width: 65%;
	margin: 0 auto;
	text-align: center;
	color: white;
	margin-top: 10%;
	min-height: calc(100vh - 180px);
}
.horizontAbout{
	background-color: green;
  width: 60px;
  height: 2px;
  margin:20px auto 40px;
}
.containerAbout p{
	font-size: 22px;
	text-align: justify;
	margin-bottom: 25px;
	font-weight: 200;

}


@media (max-width:321px) {
	.discover{
		font-size: 16px;
	}
}

/* ABOUT END */
/* PARTNERS START */
.containerPartners{
  display: flex;
  margin: 0 auto;
  justify-content:space-around;
  flex-wrap: wrap;
  width: 65%;
}
@media (max-width:420px) {
	.containerPartners{
	  width: 95%;
	}
}
.our{
	margin-top: 8%;
  text-align: center;
  font-size: 32px;
	color: white;

}

.horizontPartners{
	background-color: green;
  width: 60px;
  height: 2px;
  margin:25px auto 60px;
}
.containerPartners div{
	width: 175px;
	height: 95px;
	margin-bottom: 12px;
}
.containerPartners img{
	margin-left: 50%;
	width: 80%;
	transform: translate(-50%, -50%);
}
/* PARTNERS END */

/* SERVICES START */
.containerServices{
  display: flex;
  margin: 0 auto;
  justify-content:space-around;
  flex-wrap: wrap;
  width: 65%;
}
.our{
  text-align: center;
  font-size: 32px;
}
.itemServices{
  width: 250px;
	height: 140px;
}
.itemServices img{
	width: 25%;
	margin-left: 50%;
	transform: translate(-50%, -50%);
}
.itemServices p{
  text-align: center;
	color: white;
	text-transform: uppercase;
}
.descServices{
	color: white;
	text-align: center;
	font-size: 20px;
}
.horizontServices{
	background-color: green;
	width: 60px;
	height: 2px;
	margin:20px auto;
}
.coverP{
  margin: 0 auto 60px;
  width: 65%;
}
.divImg{
	height: 50px;
}
/* SERVICES END */

/* CONTACTS START */
.containerContacts{
	margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 15%;
	min-height: calc(100vh - 250px);
}

.qr{
  width: 300px;
	padding-right: 50px;
}
@media (max-width:640px) {
	.qr{
		padding-right: 0;
	}
}
.contact{
  width: 23%;
  color: white;
  text-align: right;
  padding: 0 50px 0 0;
  width: 300px;

}
.contactTitel{
  font-weight: bold;
  margin: 0;
  margin-bottom: 12px;
	font-size: 1.35em;
}
.contactDesc{
  margin: 0;
  margin-bottom: 22px;
	font-size: 1.45em;
}
.contact p:last-child{
  margin-bottom: 0;
}
.contactDesc a{
  text-decoration:none;
  color: white;
}
.contact h1{
  margin-top: 0;
  margin-bottom: 0;
}
.horizontContacts{
  background-color: green;
  width: 80px;
  height: 2px;
  margin-left: calc(100% - 55px);
  margin-top: 34px;
  margin-bottom: 34px;
}
.fa-map-marker-alt, .fa-envelope, .fa-phone-alt{
	color: green;
	margin-right: 7px;
	font-size: 22px;

}
@media (max-width:642px) {
	.qr{
		margin-top: 35px;
	}
	.containerContacts, .containerAbout, .our{
		margin-top: 135px;
	}
}
/* CONTACTS END */
.test{
	position: absolute;
	width: 170px;
	left:40px;
	bottom: 60px;
	font-size: 1.1rem;
	color: white;
}
.rights_PS{
	font-size: 16px;
	color: white;
	margin-bottom: 15px;
	text-align: center;
}
.rights_CA{
	font-size: 16px;
	color: white;
	height: 50px;
	width: 100%;
	text-align: center;
}
@media (max-width:420px) {
	.containerAbout p{
		text-align: left;
		font-size: 14px;
	}
	.containerAbout{
		width: 85%;

	}
	.discover{
		font-size: 20px;
	}
	.rights_PS, .rights_CA{
		font-size: 12px;
	}
	.rights_CA{
		position: static;
		margin: 15px 0;
	}
}
@media (max-width:930px) {
	.rights_CA{
		position: static;
		margin: 15px 0;
	}
}
.wrapper{
	overflow: hidden;
}
