*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

html, body {
    height: 100%;
    padding: 0;
    margin: 0;
}

body {
	position: relative;
    font-family: 'Montserrat', Calibri, Arial, sans-serif;
    color: #fff;
    background: #eee;
    overflow: hidden;
	font-size: 14px;
	font-weight: 300;
}

.loaded body { background: #333; }

/* LOADER ANIMATION */
.cssload-thecube {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 73px;
	height: 73px;
	margin: -35px 0 0 -35px;
	position: absolute;
	transform: rotateZ(45deg);
		-o-transform: rotateZ(45deg);
		-ms-transform: rotateZ(45deg);
		-webkit-transform: rotateZ(45deg);
		-moz-transform: rotateZ(45deg);
}
.loaded .cssload-thecube { display: none; }
.cssload-thecube .cssload-cube {
	position: relative;
	transform: rotateZ(45deg);
		-o-transform: rotateZ(45deg);
		-ms-transform: rotateZ(45deg);
		-webkit-transform: rotateZ(45deg);
		-moz-transform: rotateZ(45deg);
}
.cssload-thecube .cssload-cube {
	float: left;
	width: 50%;
	height: 50%;
	position: relative;
	transform: scale(1.1);
		-o-transform: scale(1.1);
		-ms-transform: scale(1.1);
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
}
.cssload-thecube .cssload-cube:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #38bbd9;
	animation: cssload-fold-thecube 2.76s infinite linear both;
		-o-animation: cssload-fold-thecube 2.76s infinite linear both;
		-ms-animation: cssload-fold-thecube 2.76s infinite linear both;
		-webkit-animation: cssload-fold-thecube 2.76s infinite linear both;
		-moz-animation: cssload-fold-thecube 2.76s infinite linear both;
	transform-origin: 100% 100%;
		-o-transform-origin: 100% 100%;
		-ms-transform-origin: 100% 100%;
		-webkit-transform-origin: 100% 100%;
		-moz-transform-origin: 100% 100%;
    border-radius: 50%;
    border-top-left-radius: 0;		
}
.cssload-thecube .cssload-c2 {
	transform: scale(1.1) rotateZ(90deg);
		-o-transform: scale(1.1) rotateZ(90deg);
		-ms-transform: scale(1.1) rotateZ(90deg);
		-webkit-transform: scale(1.1) rotateZ(90deg);
		-moz-transform: scale(1.1) rotateZ(90deg);
}
.cssload-thecube .cssload-c3 {
	transform: scale(1.1) rotateZ(180deg);
		-o-transform: scale(1.1) rotateZ(180deg);
		-ms-transform: scale(1.1) rotateZ(180deg);
		-webkit-transform: scale(1.1) rotateZ(180deg);
		-moz-transform: scale(1.1) rotateZ(180deg);
}
.cssload-thecube .cssload-c4 {
	transform: scale(1.1) rotateZ(270deg);
		-o-transform: scale(1.1) rotateZ(270deg);
		-ms-transform: scale(1.1) rotateZ(270deg);
		-webkit-transform: scale(1.1) rotateZ(270deg);
		-moz-transform: scale(1.1) rotateZ(270deg);
}
.cssload-thecube .cssload-c2:before {
	animation-delay: 0.35s;
		-o-animation-delay: 0.35s;
		-ms-animation-delay: 0.35s;
		-webkit-animation-delay: 0.35s;
		-moz-animation-delay: 0.35s;
}
.cssload-thecube .cssload-c3:before {
	animation-delay: 0.69s;
		-o-animation-delay: 0.69s;
		-ms-animation-delay: 0.69s;
		-webkit-animation-delay: 0.69s;
		-moz-animation-delay: 0.69s;
}
.cssload-thecube .cssload-c4:before {
	animation-delay: 1.04s;
		-o-animation-delay: 1.04s;
		-ms-animation-delay: 1.04s;
		-webkit-animation-delay: 1.04s;
		-moz-animation-delay: 1.04s;
}



@keyframes cssload-fold-thecube {
	0%, 10% {
		transform: perspective(136px) rotateX(-180deg);
		opacity: 0;
	}
	25%,
				75% {
		transform: perspective(136px) rotateX(0deg);
		opacity: 1;
	}
	90%,
				100% {
		transform: perspective(136px) rotateY(180deg);
		opacity: 0;
	}
}

@-o-keyframes cssload-fold-thecube {
	0%, 10% {
		-o-transform: perspective(136px) rotateX(-180deg);
		opacity: 0;
	}
	25%,
				75% {
		-o-transform: perspective(136px) rotateX(0deg);
		opacity: 1;
	}
	90%,
				100% {
		-o-transform: perspective(136px) rotateY(180deg);
		opacity: 0;
	}
}

@-ms-keyframes cssload-fold-thecube {
	0%, 10% {
		-ms-transform: perspective(136px) rotateX(-180deg);
		opacity: 0;
	}
	25%,
				75% {
		-ms-transform: perspective(136px) rotateX(0deg);
		opacity: 1;
	}
	90%,
				100% {
		-ms-transform: perspective(136px) rotateY(180deg);
		opacity: 0;
	}
}

@-webkit-keyframes cssload-fold-thecube {
	0%, 10% {
		-webkit-transform: perspective(136px) rotateX(-180deg);
		opacity: 0;
	}
	25%,
				75% {
		-webkit-transform: perspective(136px) rotateX(0deg);
		opacity: 1;
	}
	90%,
				100% {
		-webkit-transform: perspective(136px) rotateY(180deg);
		opacity: 0;
	}
}

@-moz-keyframes cssload-fold-thecube {
	0%, 10% {
		-moz-transform: perspective(136px) rotateX(-180deg);
		opacity: 0;
	}
	25%,
				75% {
		-moz-transform: perspective(136px) rotateX(0deg);
		opacity: 1;
	}
	90%,
				100% {
		-moz-transform: perspective(136px) rotateY(180deg);
		opacity: 0;
	}
}
/* END ANIMATION */

a { color: #ffffff; text-decoration: none; transition: color 0.3s; }

.clearer { clear: both; width: 0px; height: 0px; }
/* MICRO CLEARFIX HACK */
.cf:before, .cf:after {content:"";display:table} /* For modern browsers */
.cf:after {clear:both}
.cf {zoom:1} /* For IE 6/7 (trigger hasLayout) */

.bold { font-weight: bold; }
.bolder { font-weight: 900; }

.pt-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    -webkit-perspective: 1200px;
    -moz-perspective: 1200px;
    perspective: 1200px;
}
.pt-page,
.pt-trigger-container { opacity: 0; transition: opacity 0.3s; }
.loaded .pt-page,
.loaded .pt-trigger-container { opacity: 1; }

.scrollContent { width: 100%; height: 100%; position: absolute; top: 0; left: 0; box-sizing: border-box; padding: 100px 4% 35px; }

.pt-page {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;
    visibility: hidden;
    overflow: auto;
/*     -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
 */    -webkit-transform: translate3d(0, 0, 0) scale(1);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0) scale(1);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.pt-page-current, .no-js .pt-page {
    visibility: visible;
    z-index: 1;
}

.no-js body {
    overflow: auto;
}

.pt-trigger-container {
    position: absolute;
    width: 100%;
    z-index: 999999;
    left: 50%;
    padding: 0;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
	font-family: 'Montserrat';
	font-weight: 300;
	transition: 1s;
	transition-delay: .2s;
}


.pt-trigger-remove { display: none; }

/* .pt-trigger-active { background: rgb(0,0,0); background: rgba(0,0,0,.8); } */

.pt-trigger-container ul { padding: 0; position: absolute; top: 40px; right: 3%; }

.pt-trigger-container .seperator { list-style: none; display: inline; font-size: 26px; line-height: 0; letter-spacing: -3px; }
.pt-trigger {
    border: none;
    font-size: 18px;
    padding: 10px;
    cursor: pointer;
    display: inline;
    transition: .4s;
	color: #ffffff;
}

.pt-trigger:hover { opacity: 0.75; }
.logo { position: fixed; top: 50%; left: 50%; z-index: 999; margin-top: -240px; margin-left: -54px; padding: 0; width: 107px; height: 115px; text-align: center; }
.logo img { display: none; }
.logo svg { backface-visibility: hidden; width: 107px; height: 115px; transition: all 0.3s; }
.logo svg .bb-lightBlue { fill: #38bbd9; }
.logo svg .bb-babyBlue { fill: #0a58a3; }
.logo svg .bb-midBlue { fill: #1e7cb2; }
.logo svg .bb-darkBlue { fill: #328ebe; }

.logo svg .bbDarkBlue { fill: #0a58a3; }
.logo svg .bbLightBlue { fill: #38bbd9; }
.logo svg #bbBlue { fill: #328ebe; }
.logo svg #bbDarkerBlue { fill: #1e7cb2; }
.logo svg .bbStroke { fill: transparent; }

.loaded .logo svg { height: 60px; width: 56px; }
.loaded .logo svg .bbDarkBlue,
.loaded .logo svg .bbLightBlue,
.loaded .logo svg #bbBlue,
.loaded .logo svg #bbDarkerBlue { fill: transparent; }
.loaded .logo svg .letters,
.loaded .logo svg .bbStroke { fill: #ffffff; opacity: 0.6; }
.logo.pt-trigger:hover,
.loaded .logo:hover svg .letters,
.loaded .logo:hover svg .bbStroke { opacity: 1; }

.logo,
.logo svg * { transition: all 0.3s; }
.loaded .logo { top: 30px; left: 3%; margin: 0; }

.loaded .logo svg .bb-lightBlue { fill: #38bbd9; }
.loaded .logo svg .bb-babyBlue {fill: #0e4b86;}
.loaded .logo svg .bb-midBlue {fill: #137fb7;}
.loaded .logo svg .bb-darkBlue {fill: #49a3d2;}

.bottomIcons { position: fixed; right: 3%; bottom: 8px; z-index: 99; padding: 0; margin: 0; opacity: 0; transition: opacity 0.3s; }
.loaded .bottomIcons { opacity: 1; }
.bottomIcons li { display: inline-block; margin: 0 0 0 10px; transition: opacity 0.3s; }
.bottomIcons li:hover { opacity: 0.8; }
.webmail { font-size: 14px; }
.webmail img { width: 20px; height: 20px; vertical-align: middle; margin-right: 5px; }
.bottomCall img { width: 20px; height: 20px; vertical-align: middle; }
.bottomIcons span { display: inline-block; vertical-align: middle; }

/* Page Styles */
.pt-page-ontop {
    z-index: 999;
}

.pt-page h1,
.pt-page h2,
.pt-page h3 {
    font-family: 'Montserrat';
	font-weight: 100;
    line-height: 1;
    margin: 0;
    width: 100%;
    text-align: center;
}

.pt-page h2 { font-size: 40px; margin-bottom: 20px; }
.pt-page h3 { font-size: 34px; margin-bottom: 20px; }

.pt-page h4 { font-weight: 100; padding: 0px 10%; font-size: 20px; }
.pt-page ul { padding: 0 10%; padding-left: 15%; text-align: left; }

.pt-page li { margin-bottom: 15px; }

/********* PAGE 1 ***************/
.pt-page-1 { background: #328ebe; position: relative;}
.pt-page-1 h1 { font-size: 10vw; }
.pt-page-1 .moto { position: absolute; width: 80%; top: 30%; left: 10%; z-index: 2; text-align: center; }
.pt-page-1 p { width: 100%; text-align: center; font-family: 'Montserrat'; font-weight: 100; font-size: 1.8vw; }
.pt-page-1 .moto a { position: fixed; left: 50%; bottom: 50px; opacity: 0; transition: opacity 0.3s 1.2s, transform 0.3s 1.2s, color 0.3s; transform: translateY(-20px) rotate(90deg); display: inline-block; font-size: 50px; font-weight: 100; letter-spacing: -4px;padding: 0; margin: 0; background: transparent; color: #89d6ff; text-decoration: none; line-height: 50px; margin-left: -15px; }
.loaded .pt-page-1 .moto a { opacity: 1; transform: translateY(0) rotate(90deg); }
.loaded .pt-page-1 .moto a:hover { color: #b2e4ff; }

/********* PAGE 2 ***************/
.pt-page-2 { background: #512061; }
.pt-page-2 p { text-align: left; line-height: 1.6em; max-width: 1000px; margin: 0 auto 1.2em; }
.pt-page-2 img { display: block; margin: 0 auto; width: auto; height: 80px; backface-visibility: hidden; }
.pt-page-2 img.arrow { width: 22px; height: auto; display: inline-block; margin: 0 0 0 5px; transition: 0.4s ease; }
.pt-page-2 a { transition: 0.4s ease; display: block; backface-visibility: hidden; }
.pt-page-2 a:hover { transform: scale(1.05); opacity: 1; }
.pt-page-2 a div:hover img.arrow { transform: translateX(3px); }
.pt-page-2 ul { padding: 0; margin: 80px 0 0; list-style: none; display: flex; align-items: flex-start; justify-content: space-between; }
.pt-page-2 li { margin: 0; padding: 0 20px; width: 20%; text-align: center; }
.pt-page-2 h3 { font-weight: 900; font-size: 12px; min-height: 2em; margin: 1em 0; display: flex; align-items: center; justify-content: center; }
.pt-page-2 a div { font-size: 12px; }


/********* PAGE 3 ***************/
.pt-page-3 { background: #3C9877; overflow: hidden; }
.pt-page-3 img { display: block; margin: 0 40px 0 auto; width: auto; height: 80px; }
.pt-page-3 ul { padding: 0; margin: 80px auto 0; list-style: none; max-width: 1000px; }
.pt-page-3 li { margin: 0 0 60px; padding: 0 20px; width: 100%; text-align: left; display: flex; }
.pt-page-3 li .text { text-align: left; padding-left: 40px; }
.pt-page-3 h3 { font-weight: 900; font-size: 18px; margin: 0 0 1em; text-align: left; }
.pt-page-3 p { line-height: 1.6em; }

/********* PAGE 4 ***************/
.pt-page-4 { background: #C56E2F; }
.pt-page-4 ul { padding: 0; margin: 80px auto 0; list-style: none; display: flex; flex-wrap: wrap; width: 100%; }
.pt-page-4 li { margin: 0 0 60px; width: 20%; box-sizing: border-box; padding: 0 20px; }
.pt-page-4 li img { width: 100%; }

/********* PAGE 5 ***************/
.pt-page-5 { background: #2983B3; }

.pt-page-5 a:hover { color: rgba(255,255,255,0.7); }

.pt-page-5 h3,
.pt-page-5 h4 { text-align: left; margin: 0 0 20px; padding: 0; }
.pt-page-5 h4 { font-size: 24px; }

.pt-page-5 .halfWrapper { width: 50%; margin: 0 auto; float: left; box-sizing: border-box; padding: 30px 3% 0; position: relative; overflow: hidden; }
.pt-page-5 .halfWrapper:first-child:after { content: ''; position: absolute; top: 100px; right: 0; height: calc(100% - 100px); background: #ffffff; width: 1px; opacity: 0; transform: scale3d(0,0,0); transition: transform 0s 0s; }
.pt-page-5.pt-page-current .halfWrapper:first-child:after { opacity: 0.2; transform: scale3d(1,1,1); transition: transform 0.8s 0.8s; }
.pt-page-5 button { font-size: 22px; color: rgba(255,255,255,0.75); padding: 0; background: #373C65; border: none; transition: color 0.3s; letter-spacing: 5px; cursor: pointer; outline: 0; font-family: 'Montserrat'; font-weight: 900; position: relative; overflow: hidden; transform-style: preserve-3d; margin: 0; }
.pt-page-5 button div { padding: 15px 100px; position: relative; z-index: 2; }
.pt-page-5 button:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%;background: #553765; transform: scale3d(0,0,0); transition: transform 0.15s linear; z-index: 1;}
.pt-page-5 button:hover { color: #fff; }
.pt-page-5 button:hover:before { transform: scale3d(1,1,1); }
.pt-page-5 button:active:before { transform: scale3d(0.95,0.75,1); }
.fieldWrapper input, 
.fieldWrapper textarea { width: 100%; font-size: 18px; padding: 22px 10px 10px; color: #000; letter-spacing: 1px; border: none; font-family: 'Montserrat'; font-weight: 300; outline: 0; transition: background 0.3s; background: rgb(255,255,255); background: rgba(255,255,255,0.2); color: #fff; border: 1px solid rgba(255,255,255,0.1); border-radius: 0; -webkit-appearance: none; }
.fieldWrapper textarea { height: 240px; overflow: auto; }
.fieldWrapper input:focus, 
.fieldWrapper textarea:focus { background: rgba(255,255,255,0.75); color: #333; border-color: #ffffff; }
.fieldWrapper { margin: 10px 0; position: relative; }
.fieldWrapper label { position: absolute; top: 6px; left: 10px; visibility: hidden; opacity: 0; transform: translate3d(0,10px,0); transition: all 0.3s; font-size: 12px; color: rgba(255, 255, 255, 0.6); }
.fieldWrapper input:focus ~ label,
.fieldWrapper textarea:focus ~ label { color: #888; }
.fieldWrapper.withVal label,
.fieldWrapper.writing label { visibility: visible; opacity: 1; transform: translate3d(0,0,0); }

.fieldWrapper input::-webkit-input-placeholder { color: rgba(255,255,255,0.5); }
.fieldWrapper input:-moz-placeholder { color: rgba(255,255,255,0.5); }
.fieldWrapper input::-moz-placeholder { color: rgba(255,255,255,0.5); }
.fieldWrapper input:-ms-input-placeholder { color: rgba(255,255,255,0.5); }
.fieldWrapper textarea::-webkit-input-placeholder { color: rgba(255,255,255,0.5); }
.fieldWrapper textarea:-moz-placeholder { color: rgba(255,255,255,0.5); }
.fieldWrapper textarea::-moz-placeholder { color: rgba(255,255,255,0.5); }
.fieldWrapper textarea:-ms-input-placeholder { color: rgba(255,255,255,0.5); }

.fieldWrapper input:focus::-webkit-input-placeholder { color: #888; }
.fieldWrapper input:focus:-moz-placeholder { color: #888; }
.fieldWrapper input:focus::-moz-placeholder { color: #888; }
.fieldWrapper input:focus:-ms-input-placeholder { color: #888; }
.fieldWrapper textarea:focus::-webkit-input-placeholder { color: #888; }
.fieldWrapper textarea:focus:-moz-placeholder { color: #888; }
.fieldWrapper textarea:focus::-moz-placeholder { color: #888; }
.fieldWrapper textarea:focus:-ms-input-placeholder { color: #888; }

.fieldWrapper input.error,
.fieldWrapper textarea.error { box-shadow: 0 0 10px -3px #e30000; }
.fieldWrapper input.error + label + label,
.fieldWrapper textarea.error + label + label { display: none; }
.fieldWrapper input.valid + label + label,
.fieldWrapper textarea.valid + label + label { display: block; }
.fieldWrapper label.error,
.fieldWrapper input:focus ~ label.error,
.fieldWrapper textarea:focus ~ label.error { color: #ad0000; visibility: visible; opacity: 1; transform: translate3d(0,0,0); font-weight: 400; }

.pt-page-5 .reCaptchaOverlay { position: fixed; z-index: 99; top: 0; left: 0; background: rgba(0,0,0,0.5); width: 100%; height: 100%; transition: transform 0.5s; transform: translate3d(0,-100%,0); }
.openReCaptcha .pt-page-5 .reCaptchaOverlay { transform: translate3d(0,0,0); }
.pt-page-5 .reCaptchaOverlay .reCaptchaBox { display: none; position: absolute; top: 50%; left: 50%; transform: translate3d(-50%,-50%,0); }
.pt-page-5 .reCaptchaOverlay .reCaptcha { box-shadow: 3px 2px 31px -10px #000; }
.openReCaptcha .pt-page-5 .reCaptchaOverlay .reCaptchaBox { display: block; }

.mailFormWrapper .formResponseMsg { visibility: hidden; opacity: 0; position: absolute; top: 0; left: 0; width: 100%; padding: 100px 3% 0; box-sizing: border-box; }
.mailFormWrapper.formResponse .formResponseMsg { visibility: visible; opacity: 1; }
.mailFormWrapper.formResponse #mailForm { opacity: 0; visibility: hidden; }

.formResponseMsg .success { position: relative; padding-left: 50px; }
.formResponseMsg .formResponseIcon { position: relative; top: 12px; left: 12px; }
.formResponseMsg .formResponseIcon:before { content:'';
    position: absolute;
    width: 0;
    height: 5px;
    background: #68cf5c;
    left: 0;
    top: 0;
    transform: rotate(-45deg) translateX(-5px) translateY(10px);
    transform-origin: top left;
    transition: width 0.3s 0.6s;
}
.formResponseMsg .formResponseIcon:after { content:'';
    position: absolute;
    width: 0;
    height: 5px;
    background: #68cf5c;
    left: 0;
    top: 0;
    transform: rotate3d(0, 0, 1, 45deg);
    transform-origin: top left;
    transition: width 0.3s 0.3s;
}

.mailFormWrapper.formResponse .formResponseMsg .formResponseIcon:before { width: 30px; }
.mailFormWrapper.formResponse .formResponseMsg .formResponseIcon:after { width: 15px; }
.refreshForm { padding-left: 50px; }
.refreshForm a span { display: inline-block; vertical-align: middle; }
.refreshForm svg { width: 16px; height: 16px; vertical-align: middle; transform: rotate(0deg); transition: transform 0.3s; }
.refreshForm svg * { fill: rgba(255,255,255,1); transition: 0.3s; }
.refreshForm a:hover svg { transform: rotate(360deg); }
.refreshForm a:hover svg * { fill: rgba(255,255,255,0.7); }


/* ENVELOPE

.envelopeContainer, .envelopeContainer * {
  box-sizing: border-box;
}

.envelopeContainer {
  width: 130px;
  margin: 20px auto;
  text-align: center;
  position: absolute;
  top: 100px;
  left: 50%;
  margin-left: -65px;
  visibility: hidden;
  opacity: 0;
}

.envelope {
  background: #553765;
  width: 100%;
  height: 80px;
  position: relative;
  margin: 85px 0 30px 0;
  z-index: 1;
}

.envelope:before,
.envelope:after {
  content: "";
  position: absolute;
  bottom: 0;  
}

.envelope:before {
  right: 0;
  border-bottom: 0px solid transparent;
  border-top: 80px solid transparent;
  border-right: 130px solid #3D224C;
  z-index: 1;
}

.envelope:after {
  left: 0;
  border-bottom: 0px solid transparent;
  border-top: 80px solid transparent;
  border-left: 130px solid #5B3F6B;
  z-index: 1;
}

.envelopeContainer .open {
  border-right: 65px solid transparent;
  border-top: 40px solid #553765;
  border-left: 65px solid transparent;
  position: absolute;
  z-index: 0;
  left: 0;
  top: 85px;
  transform-origin: 0% 0%;
  transform: rotateX(180deg);
}

.paper {
  width: 110px;
  height: 145px;
  position: absolute;
  bottom: 0;
  left: 50%;
  margin-left: -55px;
  background: #f2f2f2;
  z-index: 0;
}

.paper:before {
  content: "";
  position: absolute;
}  

.paper:before {
  width: 110px;
  height: 75px;
  background: rgba(177,177,177,0.1);
  bottom: 0;
  left: 0;
}

.envelopeContainer ul {
  margin: 25px auto 0 auto;
  padding: 0;
  display: block;
  width: 80%;
}

.envelopeContainer li {
  list-style: none;
  background: #d3d3d3;
  width: 100%;
  height: 5px;
  margin-bottom: 5px;
}

.envelopeContainer li:nth-child(1) {
  width: 50%;  
}

.envelopeContainer li:nth-child(2) {
  margin-bottom: 20px;  
  width: 20%;
}

.envelopeContainer a {
  background: #878387;
  text-decoration: none;
  text-transform: uppercase;
  color: #fff;
  letter-spacing: 1px;
  font: bold 13px "helvetica"; 
  padding: 8px 15px;
  box-shadow: 0 3px 0 #2a2c2b;
}

.envelopeContainer a:active,
.envelopeContainer a:hover {
   box-shadow: 0 1px 0 #2a2c2b;
} */

/* TRIGGER ANIMATIONS
.envelopeContainer.is-active { visibility: visible; opacity: 1; transition: visibility 0.3s 0s, opacity 0.3s 0s, transform 0.3s 2s, -webkit-filter 0.3s 2s, filter 0.3s 2s; transform: translateX(700px); -webkit-filter: blur(5px); filter: blur(5px); 
	animation: slideOut;
	animation-fill-mode: forwards;
	animation-iteration-count:infinite;
}

.is-active .open {
  animation: foldUp 1s ease-in-out; 
  animation-fill-mode: forwards;
  animation-delay: 1s;
  animation-iteration-count:infinite;
}
  
.is-active .paper {
  animation: paperUp 1.5s ease-in-out; 
  animation-fill-mode: forwards;
  animation-iteration-count:infinite;
}
 */
/* ANIMATIONS
@keyframes slideOut {
from {  
	transform: translateX(700px); -webkit-filter: blur(5px); filter: blur(5px);
	}
to {
	transform: translateX(0px); -webkit-filter: blur(0px); filter: blur(0px);
	}  
}

@keyframes foldUp {
from {  
    transform: rotateX(180deg);
}  
to {  
    transform:rotateX(0deg);
    z-index: 9;
   }  
}

@keyframes paperUp {  
  from {  
      height: 145px;
	} 100% {
      height: 75px;
  }  
} */
/* END ENVELOPE */

.next,
.prev,
.menu  { display: none; }
.pt-page-7 ul {  padding: 1% 2%; }
.pt-page-7 li {  width: 100%; display: block; text-align: center; }
.pt-page-7 .pt-trigger { border: solid white 1px; font-size: 24px; padding: 2%; cursor: pointer; display: block; transition: .4s; width: 100%; }

/*No Animation Support Message Style*/
.pt-message {
    display: none;
    position: absolute;
    z-index: 99999;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #da475c;
    color: #fff;
    text-align: center;
}

.pt-message p {
    margin: 0;
    line-height: 60px;
    font-size: 26px;
}

.no-cssanimations .pt-message {
    display: block;
}

.moreItems { display: none; }

@media only screen and (max-width : 1280px) {

	.pt-page-4 .webhosting svg { width: 135px; height: 155px; }
	.pt-page-4 .mailhosting svg { width: 135px; height: 155px; }
	.pt-page-4 .domainreg svg { width: 183px; height: 155px; }


}

@media only screen and (max-width : 960px) {

	.loaded .logo,
	.loaded .logo svg { width: 100px; height: 59px; }
	.loaded .logo { left: 50%; margin-left: -50px; }
	
	.next,
	.prev { display: block; position: absolute; top: 0; padding: 0; width: 80px; height: 80px; line-height: 70px; font-size: 40px; }
	.next { right: 0; text-align: right; padding-right: 20px; }
	.prev { left: 0; text-align: left; padding-left: 20px; }
	.pt-trigger-container { transition-delay: 2s; }
	.pt-trigger-container ul { display: none; }

	.pt-page-1 .moto { width: 100%; left: 0; }

	.pt-page-2 .item { width: 50%; padding-bottom: 60px; padding-top: 40px; }
	.pt-page-2 p { display: none; }
	.pt-page-2 h4 { font-size: 18px; }
	
	.pt-page-3 ul.sliderContent { padding-top: 100px; }
	.pt-page-3 .owl-prev,
	.pt-page-3 .owl-next { background-size: 38px 70px; }
	.owl-prev { left: 0; }
	.owl-next { right: 0; }
	.owl-dots { bottom: 50px; }
	
	.pt-page-4 .item { width: 100%; padding-top: 40px; }

	.pt-page-5 h2 { margin: 30px 0; font-size: 24px; padding: 0 10%; }
	.pt-page-5 h4 { pading: 30px 0 0; padding: 0 10%; font-size: 16px; }
	.pt-page-5 ul { padding: 0 5%; }
	.pt-page-5 ul li { margin: 2%; width: 24%; }

	.pt-page-5 .halfWrapper { width: 100%; padding-bottom: 100px; padding-top: 0; }
	.pt-page-5 .halfWrapper:first-child:after { top: auto;right: 3%; height: 1px; width: 94%; bottom: 50px; }

}



@media only screen and (max-width : 767px) {

	.pt-page-3 .slider .desc { font-size: 30px; top: 50%; padding: 0 40px; }
	.pt-page-3 .details .photos img { width: 100%; margin: 0 0 10px 0; }
	.pt-page-3 .header .client { font-size: 30px; }
	.pt-page-3 .slider .desc .smaller,
	.pt-page-3 .header .thin { font-size: 22px; }
	.pt-page-3 .header a { margin-bottom: 10px; display: block; }
	
	.pt-page-5 button { width: 100%; }
	
	.bottomIcons { right: 0; width: 100%; text-align: center; }
}

@media only screen and (max-width : 400px) {
	.pt-page-2 .item { width: 100%; }
	
	.pt-page-5 h2 { font-size: 32px; }
	.bottomIcons li { margin: 0 0 0 4px; }
	.bottomIcons li:first-child { margin: 0 4px 0 0; }
}