/**** COLOURS ****/
/****
#182044
#00ADD7
#00C8D5
#00DEDD
#57EDEB
#B6EFF0
****/

/**** DEBUG ****/


.section-wrapper,
.section-wrapper-fullscreen,
.centered,
.section-heading,
.section-content,
#clients .showreel-item,
div{
	/**border:#000 thin dotted;**/
}


/**** FONTS ****/

@font-face {
  font-family: 'CenturyGothic';
  src: url('/theme/fonts/client/CenturyGothic.eot?#iefix') format('embedded-opentype'),  
  url('/theme/fonts/client/CenturyGothic.woff') format('woff'), 
  url('/theme/fonts/client/CenturyGothic.ttf')  format('truetype'), 
  url('/theme/fonts/client/CenturyGothic.svg#CenturyGothic') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'CenturyGothic-Bold';
  src: url('/theme/fonts/client/CenturyGothic-Bold.eot?#iefix') format('embedded-opentype'),  
  url('/theme/fonts/client/CenturyGothic-Bold.woff') format('woff'), 
  url('/theme/fonts/client/CenturyGothic-Bold.ttf')  format('truetype'), 
  url('/theme/fonts/client/CenturyGothic-Bold.svg#CenturyGothic-Bold') format('svg');
  font-weight: normal;
  font-style: normal;
}


.section .section-wrapper,
.section .section-wrapper-fullscreen,
.main-nav,
.footer{
	
}

.section .section-back{
	display:none;
}


/**** LOADER ***/

/* Center the loader */
#loader{
	width:100%;
	display:block;
	text-align:center;

	height:100%;
	position: absolute;
	top:0;
	left:0;
	z-index: 1;
}

#loader .loading-spin {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  width: 150px;
  height: 150px;
  margin: -75px 0 0 -75px;
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #00ADD7;
  width: 120px;
  height: 120px;
  margin: -60px 0 0 -60px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

#loader .loading-copy {
  position: absolute;
  width:100%;
  top: 50%;
  margin-top:80px;
  z-index: 2;
  color:#182044;
  font-size:1em;
  text-transform:lowercase;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


.navbar,
.wrapper-content,
.footer{
  display: none;
}

/****************************/

a{
	outline:none !important;
	transition: all 0.35s;
}

a:hover,
a:focus{
	text-decoration:none;
}

html, 
body,
.site-wrapper{
  height: 100%;
  margin: 0;
}

body{
	margin:0;
	padding:0;
	font-family: 'Muli', sans-serif;
	font-weight: 300;
	color:#182044;
	font-size:2em;
	line-height:normal;
}

@media screen and (max-width:700px){
	body{
		font-size:2em;
	}
}

h2{

	font-size:1em;
}

b, strong {
    font-weight: normal;
	font-weight: 700;
}

p {
  margin: 0 0 1em;
}

.section{
	position:relative;
	width:100%;
	min-height: 100%;
	height: 100%;
	height: auto;
}
.section.section-start{
	min-height: 200px;
	height: auto;
}
.section-start{
	padding-top:90px;
	padding-bottom:80px;
}
@media screen and (max-width:700px){
	.section-start{
	    padding-top:40px;
	    padding-bottom:10px;
    }
}

.section-back{
	position:relative;
	width:100%;
	min-height: 100%;
	height: 100%;
	z-index:2;
}

body.maintenance,
#maintenance,
#maintenance .section-back,
#maintenance #loader{
	background:#c1e9eb;
	color:#182044;
}

#maintenance p{
    text-transform:uppercase;
    font-size:1.8em;
    font-weight:bold;
}

#home,
#home .section-back,
#home #loader{
	background:#fff;
	color:#182044;
}

#about,
#about .section-back,
#about #loader{
	background:#00ADD7;
	color:#fff;
}
#about .asset-display{
    margin-top:2em;
}
#about #loader .loading-spin {
  border-top: 16px solid #182044;
}

#features,
#features .section-back,
#features #loader{
   	background:#182044;
	color:#fff; 
}

#examples,
#examples .section-back,
#examples #loader{
	background:#B6EFF0;
	color:#fff;
}
#examples .asset-display{
    margin-bottom:0em;
}

#packages,
#packages .section-back,
#packages #loader{
	background:#00C8D5;
	color:#fff;
}

#generation,
#generation .section-back,
#generation #loader{
	background:#00ADD7;
	color:#fff;
}
#generation #loader .loading-spin {
  border-top: 16px solid #182044;
}


#team,
#team .section-back,
#team #loader{
	background:#57EDEB;
	color:#182044;
}

.footer{
	background:#182044;
}

.privacy,
.privacy .section-back,
.privacy #loader,
.terms-and-conditions,
.terms-and-conditions .section-back,
.terms-and-conditions #loader{
	background:#fff;
	color:#182044;
}

.privacy a,
.terms-and-conditions a{
	color:#00ADD7;
}
.privacy a:hover,
.privacy a:focus,
.terms-and-conditions a:hover,
.terms-and-conditions a:focus{
	color:#182044;
}


/*** horizontal centered  - max width ***/
.section-wrapper{
	position: relative;
	max-width:1200px;
	margin-left:auto;
	margin-right:auto;
	padding-top:60px;
	padding-bottom:60px;
	min-height: 100%;
}

/*** horizontal fullscreen ***/
.section-wrapper-fullscreen{
	position: relative;
	width:100%;
	min-height: 100%;
}

/*** vertical centered ***/
.centered{
	/**position: absolute;
   	top: 50%;
	-ms-transform: translateY(-50%);
   	transform: translateY(-50%);**/
	width: 100%;

	padding-left:30px;
	padding-right:30px;
}
.centeredx{
    padding-left:30px;
	padding-right:30px;
}

#maintenance .centered{
	position: absolute;
   	top: 50%;
	-ms-transform: translateY(-50%);
   	transform: translateY(-50%);
	width: 100%;
	text-align:center;
}

@media screen and (max-width:1280px){
	.centered,
	.centeredx{
		padding-left: 60px;
		padding-right: 60px;
	}
}

@media screen and (max-width:700px){
	.centered,
	.centeredx{
		padding-left: 30px;
		padding-right: 50px;
	}
}

.section-inner-wrapper{
	position:absolute;
	width:100%;
}

.section-inner{
	max-width:1200px;
	margin-left:auto;
	margin-right:auto;
}

.behind{
	position:absolute;
	top:0;
}

.section-heading{
	font-weight: 700;
	font-size:2em;
	position: relative;
	line-height:normal;
	margin-bottom:1em;
}

.nobreak{
	white-space:nowrap;
}

.logo{
    max-width:650px;
}

#login .logo{
    max-width:400px;
}

.strap{
    margin-top:30px;
    font-size:0.7em;
}

@media screen and (max-width:700px){
    .logo{
        max-width:85%;
    }	
}

@keyframes fadeIn{
    0%{		opacity:0; 	}
	10%{ 	opacity:1; 	}
	30%{ 	opacity:1; 	}
	50%{ 	opacity:0; 	}
	100%{ 	opacity:0; 	}
}

/*** HOME ****/

#home .section-wrapper {
    padding-top: 30px;
    padding-bottom: 30px;
}

#home .section-heading{
	text-align:center;
	line-height: 0em;
}


@keyframes Mask {
	0%{	width:100%;}
	8%{width:0%;}
	100%{width:0%;}
}

@keyframes Fade {
	0%{	opacity:1;}
	25%{opacity:1;}
	26%{opacity:0;}
	100%{opacity:0;}
}

@keyframes Blink {
	0%{	opacity:0;}
	50%{opacity:1;}
	100%{opacity:0;}
}

.section-scroller {
    text-align: center;
    margin-top: 0;
    position: absolute;
    bottom: 0px;
    width:100%;
}

.section-scroller a{
	font-size:2em;
	color:#182044;

	display:inline-block;
	opacity:0;
	animation: Blink 3s ease;
	animation-fill-mode: alternate;
	animation-iteration-count:infinite;
	animation-delay: 1s;

}


.epa-preload-box {
  background: #fff;
  color: #182044;
  min-height: 10px;
  margin: 0px;
  padding: 10px;
  text-align: left;
}
.epa-preload-box .info-box-video.video-iframe {
  margin-bottom: 0px;
}

#features .epa-preload-box,
#generation .epa-preload-box{
    background: none;
}

#team .epa-preload-box,
#packages .epa-preload-box{
    background: #B6EFF0;
}

/****** ABOUT ******/
#about .epa-preload-box {
    padding:0px;
    background: #00ADD7;
    line-height: 0;
}
.about-item{
	display:inline-block;
	position:relative;
	width:26.66%;
	margin-right:10%;
	vertical-align:text-top;
}

.about-item:nth-child(3n){
	margin-right:0%;
}

.about-item span,
.about-item b,
.about-item strong{
	/***font-family:'CenturyGothic-Bold';**/
	font-weight:700;
	color:#656665;
}

@media screen and (max-width:900px){
	.about-item {
   		width: 100%;
    	margin-right: 0%;
		margin-bottom:2em;
	}
}


/****** SHOWREEL GENERIC ******/

.showreel{
}

.showreel-holder{
	width:100%;
	height: 100%;
	position: relative;
	display:inline-block;
}

.showreel-item{
	overflow:hidden;
	position:relative;
	display:inline-block;
	width:100%;
	height: 100%;

	background-repeat: no-repeat;
	background-position: center top;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.showreel-img{
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;

	height:100%;
}

.showreel-img{
	position:relative;
	width:100%;
}

.showreel-img img{

}

.showreel .slick-prev,
.showreel .slick-next{
	background: none;
    background-color: #182044;
    width: 40px;
    height: 40px;
	border-radius:100%;
	margin-top:-30px;
}

.showreel .slick-prev {
    left: 15px;
}

.showreel .slick-next {
    right: 15px;
}

.showreel .slick-next::before, 
.showreel .slick-prev::before {
    font-family: fontawesome;
    content: "\f105";
	line-height: 0.5em;
}

.showreel .slick-prev::before {
    font-family: fontawesome;
    content: "\f104";
}

.showreel .slick-next:hover,
.showreel .slick-prev:hover{
	background-color: #00ADD7;
	opacity:1;
}

.showreel .slick-next:focus,
.showreel .slick-prev:focus{
	background-color: #182044;
	opacity:1;
}

.showreel .slick-dots {
  position: relative;
  bottom: 0px;
  margin-top:20px;
}

.showreel .slick-dots li button {
  width: 10px;
  height: 10px;
  background: #fff;
  opacity: 1;
  border-radius: 50%;
}
.showreel .slick-dots li.slick-active button {
  background: #00DEDD;
}

#examples.showreel .slick-dots li.slick-active button {
  background: #182044;
}

#team.showreel .slick-dots li.slick-active button,
#packages.showreel .slick-dots li.slick-active button{
  background: #182044;
}

/****** EXAMPLES and TEAM ******/

#examples .epa-preload-box,
#team .epa-preload-box,
#packages .epa-preload-box {
  padding: 70px;
}

/**#examples.section,
#team.section{
	display: inline-block;
}**/

#examples .section-heading,
#team .section-heading,
#packages .section-heading{
	color:#fff;
	z-index:6;
	padding-top:0px;
	width:50%;
	padding-right:60px;
}

#team img,
#packages img{
    width:100%;
    position:relative;
    left:-150%;
}

#team .slick-current img,
#packages .slick-current img{
	animation: showreelSlideIn 1s ease;
	animation-delay: 0s;
    
	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}

#examples .showreel-item,
#team .showreel-item,
#packages .showreel-item{
	line-height: 0;
}

#examples .info-box-image-wrapper,
#team .info-box-image-wrapper,
#packages .info-box-image-wrapper{
	width:49%;
	line-height: normal;
	display: inline-block;
	vertical-align: top;
}

#examples .info-box-info,
#team .info-box-info,
#packages .info-box-info{
	width:50%;
	line-height: normal;
	display: inline-block;
	vertical-align: top;
	padding-left:40px;
}

#examples .info-box-image-wrapperX{
	width:100%;
}

#examples .info-box-infoX{
	display:none;
}

#examples p,
#team p,
#packages p{
    font-size:1em;
}


@keyframes showreelSlideIn{
    0%{	left:-100%;}
	100%{ 	left:0px; }
}


@media screen and (max-width:1100px){
    
    #examples .info-box-image-wrapper,
    #team .info-box-image-wrapper,
    #packages .info-box-image-wrapper{
	    width:100%;
    }

    #examples .info-box-info,
    #team .info-box-info,
    #packages .info-box-info{
	    width:100%;
	    padding-left:0px;
	    padding-top:40px;
    }

}


@media screen and (max-width:700px){
    #about .epa-preload-box {
      padding: 20px;
    }
    #examples .epa-preload-box, 
    #team .epa-preload-box,
    #packages .epa-preload-box{
      padding: 20px;
    }
    .showreel .slick-prev, 
	.showreel .slick-next{
	    display:none !important;
	} 
}


/**** PACKAGES OLD ****/

/**#packages .package-item{
    display:inline-block;
    width:100%;
    margin-bottom: 60px;
}
#packages .img-wrapper{
    display:inline-block;
    width:15%;
    vertical-align:top;
}
#packages .img-wrapper img{
    width:100%;
}
#packages .info-wrapper{
   display:inline-block;
    width:83%; 
    vertical-align:top;
    padding-left: 60px;
}

@media screen and (max-width:700px){
    #packages .info-wrapper{
        padding-left: 30px;
    }
}
#packages .info-wrapper .info-title{
    font-weight:700;
    margin-bottom:10px;
}

***/

/**** FOOTER ***/

.footer {
    position: relative;
    display: inline-block;
    width: 100%;
	color:#fff;
	font-size:0.7em;
}

.footer-copy{
	float:left;
	color:#d0d2ce;
	max-width:80%;
}

.footer-links{
	float:right;
}

.footer-links a{
	color:#fff;
	font-weight:700;
	margin-left:20px;
}

.footer-links a:hover,
.footer-links a:focus{
	color:#57EDEB;
}

.footer-links a.mainsite{
	display:none;
}

.privacy .footer-links a.mainsite{
	display:inline-block;
}
.terms-and-conditions .footer-links a.mainsite{
	display:inline-block;
}

@media screen and (max-width:700px){
	.footer {
		font-size:0.6em;
	}
}

@media screen and (max-width:1280px){
	.footer-copy{
		max-width:100%;
		width:100%;
	}
	.footer-links{
		float:left;
		width:100%;
		margin-top:10px;
	}
	.footer-links a{
		margin-left:0px;
		margin-right:10px;
	}

	.footer .centered {
    	padding-left: 30px;
    	padding-right: 30px;
	}
}

.privacy .section-content,
.terms-and-conditions .section-content{
	font-size:1em;
}

.privacy h2,
.terms-and-conditions h2{
	font-weight:700;
}



/***** COOKIES *****/

.cc-cookies {
	background:#182044;
	color:#fff;
	display:block;
	box-shadow: 15px 15px 30px rgba(0,0,0,.22);
	text-shadow: none;
	display:block;
	width:auto;
	max-width: 350px;
	padding:30px;
	border-radius:10px;
	top:20px;
	margin:auto;
}

.cc-cookies span{
	display:inline-block;
	width:100%;
	text-transform:lowercase;
	font-weight:700;
	font-size: 20px;
	margin-bottom:15px;
}


.cc-cookies a.cc-cookie-accept {
    display: inline-block;
    color: #fff;
    text-decoration: none;
    background: none;
    padding:5px 15px;
    margin: 0;
	margin-top:15px;
    border-radius: 2px;
	border:solid thin #fff;
    box-shadow: none;
    text-shadow: none;

	font-size: 1em;
    -o-transition: all 0.5s ease-in;
    -webkit-transition: all 0.25s ease-in;
    -moz-transition: all 0.25s ease-in;
    font-weight: normal;
}

.cc-cookies a.cc-cookie-accept:hover,
.cc-cookies a.cc-cookie-accept:focus{
	background:#fff;
	color:#57EDEB;
}








#cookies {
	z-index: 99999; 
	/**position: relative;**/
	position:fixed;
	top: 0; 
	left: unset;  
	height:auto;

	background: #182044; 
	color: #fff; 
	font-size: 0.7em;

	padding: 30px; 
	text-align:center;

	display:none;

	box-shadow: 15px 15px 30px rgba(0,0,0,.22);
	width:auto;
	max-width: 350px;
	border-radius:10px;
	top:20px;
	margin:auto;

   	left: 50%;
	-ms-transform: translateX(-50%);
   	transform: translateX(-50%);
}

.cookie-wrapper{
	width:100%;
	max-width:100%;
	margin: 0 auto;
	display: inline-block;
	text-align:left;
}

.cookie-title{
	float:none;
	margin-right: 0;
	font-weight:normal;
	line-height:normal;

	display:inline-block;
	width:100%;
	text-transform:lowercase;
	/***font-family:'CenturyGothic-Bold';**/
	font-weight:700;
	font-size: 20px;
	margin-bottom:15px;
}

.cookie-message{
	width:100%;
	float:none;
	margin-right: 0;
}

#cookies a {
  color: #57EDEB;
}

.cookie-buttons{

}


#cookies .cookie-buttons a{
	display: inline-block;
    color: #fff;
    text-decoration: none;
    background: none;
    padding:5px 15px;
    margin: 0;
    border-radius: 2px;
	border:solid thin #fff;
    box-shadow: none;
    text-shadow: none;

    -o-transition: all 0.5s ease-in;
    -webkit-transition: all 0.25s ease-in;
    -moz-transition: all 0.25s ease-in;
    font-weight: normal;
}


#cookies .cookie-buttons a:hover,
#cookies .cookie-buttons a:focus{
	background:#57EDEB;
	border:solid thin #57EDEB;
	color:#182044;
}

#cookies .cookie-buttons .cookie-accept{
	margin-right:10px;
} 

.cookie-accept::before{
	content: '\f00c';
	font-family: 'fontawesome';
	margin-right:5px;
}

.cookie-decline{

}

.cookie-decline::before{
	content: '\f00d';
	font-family: 'fontawesome';
	margin-right:5px;
}

.cookie-privacy{
	width:100%;
	float:none;
	margin-top:10px;
	display:none;
}

.cookie-privacy a{
	font-weight:normal;
}


.cookie-settings-control{
	width:100%;
}

.cookie-settings-control .intro{

}

/***@media screen and (max-width: 767px){
	.cookie-title,
	.cookie-message,
	.cookie-privacy{
		width:100%;
		margin-right:0;
		margin-bottom:10px;
	}

	.cookie-buttons a{
		width:48%;
		background:#fff;
		text-align:center;
		padding:5px;
	}
	.cookie-accept{
		margin-right:4%;
	}
	.cookie-decline{
		margin-right:0;
	}
}***/

.privacy-cookie-buttons{
	display: inline-block;
}

.privacy-cookie-accept,
.privacy-cookie-decline{
	display: inline-block;
	background:#eee;
	color:#999;
	padding:5px 10px;
	margin-left:20px;
	position: relative;
	border:solid #eee thin;
}

.privacy-cookie-accept.selected,
.privacy-cookie-decline.selected{
	background:#eee;
	color:#f60;
	border:solid #f60 thin;
}

.radiolabel{
	margin-left:10px;
	vertical-align:middle;
}

.radiobtn {
   	position:relative;
	display: inline-block;
	top:0px;
    height: 15px;
    width: 15px;
    background-color: #eee;
	border:solid #000 thin;
    border-radius: 50%;
	vertical-align:middle;
}

.selected .radiobtnX {
    background-color: #f60;
	border:solid #f60 thin;
}

.selected .radiobtn::after {
	display: inline-block;
	position: absolute;
    top: 2px;
    left: 2px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #000;
	content: "";
}


@media screen and (max-width: 767px){
	.privacy-cookie-buttons{
		width:100%;
		margin-top:20px;
	}
	.privacy-cookie-accept{
		margin-left:0px;
	}
}




.privacy-cookie-toggle {
	position: relative;
	display: inline-block;
	width: 60px;
	height: 34px;
	border-radius: 34px;
	background:#ccc;
	margin-right:10px;
	margin-left:10px;
	vertical-align: middle;
}

#privacy .privacy-cookie-toggle {
    background: #656665;
}

.privacy-cookie-toggle::before{
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: #fff;
    -webkit-transition: .4s;
    transition: .4s;
	border-radius: 50%;
}

.privacy-cookie-toggle.selected{
	background:#00ADD7;
}

#privacy .privacy-cookie-toggle.selected{
    background: #00ADD7;
}


.privacy-cookie-toggle.selected:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}


.togglelabel{
	vertical-align: middle;
}

.cookie-close{
	position:absolute;
	top:10px;
	right:10px;
	display:inline-block;
	cursor:pointer;
	border-radius:100%;
	width:20px;
	height:20px;
	background:#fff;
	text-align:center;
}

.cookie-close::before{
	content:'x';
	/***font-family:'CenturyGothic-Bold';**/
	font-weight:700;
	font-size: 16px;
	color:#48aedd;
	line-height: 14px;
}



@media screen and (max-width: 700px){
	#cookies {
		max-width: 90%;
		width:100%;
		font-size: 0.75em;
	}
	.cookie-settings-control .intro{
		display:inline-block;
		width:100%;
		margin-bottom:20px;
	}
	.privacy-cookie-toggle {
   		margin-left: 0px;
	}
}

.section ul{
    padding-left: 1em;
}

/**** LOGIN ****/

#loginX {
    text-align:center;
}

#login label{
    font-size:1em;
}
#login input.form-control{
    margin-top:10px;
}
#login .error{
    font-size:1em;
}

#login .btn-info {
    color: #ffffff;
    background-color: #00ADD7;
    border:none;
}

#login .btn-info:hover {
    color: #ffffff;
    background-color: #182044;
    border:none;
}