*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body, html { font-size: 100%; padding: 0; margin: 0; }

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

body { font-family: 'calibre-light' , Calibri, Arial, sans-serif;
    color: #5C5C5C;background: #fff; 
 font-size: inherit; overflow-x: hidden;
 
}

a {
	color: inherit ;
	text-decoration: none;
	outline: none;   font-family: inherit
}



.blue { padding:6px 6px; background: #003; color:#fff; font-size:0.8em;  font-family: 'calibre-bold', Helvetica, sans-serif
}
.blue a{  font-size:0.8em;  
}

.grey{ padding:6px 6px; background: #ddd; border-radius:10px; color: #003; font-size:0.6em;  font-family:'calibre-bold', Helvetica, sans-serif; font-weight:400;
}

.grey a{  font-size:0.7em; font-weight:700;  font-family: 'calibre-bold', Helvetica, sans-serif
}

.logitem { font-size:1.3em; color:#003; font-family:'calibre-bold', Helvetica, sans-serif }
#norm a{  color:#003; letter-spacing:-1px;  padding:5px 5px; font-weight:100; font-family: 'calibre-bold', Helvetica, sans-serif;
 
}




a:hover {
	color: inherit;
}

/*Standard Navigation*/

/* Adjust form for smaller screens */
@media screen and (max-width: 30.75em) {
	active a {
		 visibility: visible;
	}
	
	
	inactive a {
		font-size: 0.8em; visibility:visible;
	}
}

@media screen and (max-width: 33.5625em) {
	.standard-nav {
		font-size: 0.9em;
	}
}
section {
	
	position: relative;
	background-color: inherit;
	float: center;
	width: 100%; 
}


bridge {
	
	position: relative;
	background-color: #CFFAD7;
	float: center;
	width: 100%;
}
.container {
	width: 960px;
	margin: 0 auto;
	padding: 50px 0 50px;
	overflow: hidden; 
}

.fix{
	width: 960px;
	margin: 0 auto; margin-left:2em;
	padding: 300px 0 300px; padding-top:1em;
	overflow: hidden; 
}



/* columns */

.column-container{
	overflow: hidden;
	margin: 40px 0 -40px;
}
.column-container:first-child {
	margin-top: 0;
}
.column-container:last-child {
	margin-bottom: 0;
}
.column {
	float: left;
	margin: 0 40px 40px 0;
}
.column.last {
	margin-right: 0;
}
.column.one-half {
	width: 460px;
}
.column.one-third {
	width: 293px; 
}
.column.two-thirds {
	width: 630px;
}
.column.one-fourth {
	width: 210px;
}
.column.three-fourths {
	width: 710px;
}
.column.full-width {
	width: 100%;
	margin-right: 0;
}
.column h3 {
	margin-bottom: 20px;
}

/* section cover */

#cover {
	  background-repeat:repeat;
	font-size: 1.3em;
}
#cover .container {
	padding: 240px 0 200px 0;
}
#cover p {
	padding-right: 560px;
}
#cover   {
	font-size: 78px;
	line-height: 60px;
	margin: 20px 0; letter-spacing:-2px;
}
#cover h3 {
	margin: 0;
}
#map  { background:url(../img/map.jpg ) 50% 50%;  background-position: bottom; background-color: none; padding: 10em 10em;}

/* section features */

#info { background: #201B17; 

	color: #AAF4AF;
}

#header { background:#000; background-image: url(../img/design-tools.jpg); 
color: #000;
}
#features { background:#A0E0AF; 

	color: #000;
}




active a { font-family: 'ProximaNova-Regular',Georgia, "Times New Roman", Times, serif; padding-bottom: 1px; font-weight:700; font-size:0.8em; color:#333;  padding: 5px 5px ;  margin-right: 5px ;  }
active a:hover { color: #604444; }


inactive a { font-family: 'ProximaNova-Regular',Georgia, "Times New Roman", Times, serif;  padding-bottom: 10px; font-weight:500;font-size:0.8em; color: #333;
  }

 /* Main Menu/ */
/* Adjust form for smaller screens */
@media screen and (max-width: 44.75em) {
	.standard-nav{
		font-size: 1em;  visibility: visible;
	}
}

@media screen and (max-width: 33.5625em) {
	.standard-nav {
		font-size: 1.3em; 
	}
}


.logo{
	float: right;
	color: #003;
	font-family:"NexaBold";
	font-size: 20px;
	font-weight: 800;
	letter-spacing: 0.15em;
	line-height: 30px;
	text-transform: uppercase;
}
.logo.sub{
	color: #000;
}
#masthead{
	min-height: 63px; background: rgba(255,255,255,1);
	width: 100%; margin-top:0; 
	position: fixed; 
	top: 0;  
	
	z-index: 9;
	-webkit-transition: all .4s ease-in-out;
	   -moz-transition: all .4s ease-in-out;
		-ms-transition: all .4s ease-in-out;
		 -o-transition: all .4s ease-in-out;
			transition: all .4s ease-in-out;
	
}

#masthead.sub{
	box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
	background-color: #333 ;  opacity: 0.95; 
	-webkit-transition: all .4s ease-in-out;
	   -moz-transition: all .4s ease-in-out;
		-ms-transition: all .4s ease-in-out;
		 -o-transition: all .4s ease-in-out;
			transition: all .4s ease-in-out;
}
#masthea{
	min-height: 80px; background:#FFF;
	width: 100%; 
	position: fixed;
	top: 0;
	padding: 5px 15px;
	z-index: 9;
	-webkit-transition: all .4s ease-in-out;
	   -moz-transition: all .4s ease-in-out;
		-ms-transition: all .4s ease-in-out;
		 -o-transition: all .4s ease-in-out;
			transition: all .4s ease-in-out;
}
#masthea.sub{
	box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
	background-color: #333 ;  opacity: 0.95; 
	-webkit-transition: all .4s ease-in-out;
	   -moz-transition: all .4s ease-in-out;
		-ms-transition: all .4s ease-in-out;
		 -o-transition: all .4s ease-in-out;
			transition: all .4s ease-in-out;
}

/* -------------------------------- 

Modules

-------------------------------- */
.cd-container {
  /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */
  width: 90%;
  max-width: 768px;
  margin: 0 auto;
}
.cd-container::after {
  /* clearfix */
  content: '';
  display: table;
  clear: both;
}

/* -------------------------------- 

Main components 

-------------------------------- */
.cd-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 70px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  z-index: 1000;
}
.cd-header:after {
  content: "";
  display: table;
  clear: both;
}
.cd-header #cd-logo {
  float: left;
  margin: 13px 0 0 5%;
}
.cd-header #cd-logo img {
  display: block;
}
@media only screen and (min-width: 768px) {
  .cd-header {
    height: 75px;
  }
  .cd-header #cd-logo {
    margin: 23px 0 0 5%;
  }
}

.cd-main-nav {
  float: right;
  margin-right: 5%;
  width: 44px;
  height: 100%;
  background: url("../img/cd-icon-menu.svg") no-repeat center center;
  background-size: 44px 44px;
  cursor: pointer;
}
.cd-main-nav ul {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
}
.cd-main-nav ul.is-visible {
  -webkit-transform: translateY(50px);
  -moz-transform: translateY(50px);
  -ms-transform: translateY(50px);
  -o-transform: translateY(50px);
  transform: translateY(50px);
}
.cd-main-nav a {
  display: block;
  height: 50px;
  line-height: 50px;
  padding-left: 5%;
  background: rgba(255,255,255,0.9);
  color: #333; z-index: 1000;
}
@media only screen and (min-width: 768px) {
  .cd-main-nav {
    width: auto;
    height: auto;
    background: none;
    cursor: auto;
  }
  .cd-main-nav ul {
    position: static;
    width: auto;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    line-height: 70px;
  }
  .cd-main-nav ul.is-visible {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
  .cd-main-nav li {
    display: inline-block;
    margin-left: 1em;
  }
  .cd-main-nav a {
    display: inline-block;
    height: auto;
    line-height: normal;
    background: transparent;
    padding: .6em 1em;
    border-top: none;
    font-size: 13px; font-weight:600; 
    font-size: 0.8125rem; font-family:'calibre-regular', Helvetica, sans-serif;
    text-transform: uppercase; color:#333
  }
  
  .cd-main-nav a:hover { color:#60F}
  
  #curet{padding-bottom:2.3em;border-bottom: 4px solid #60F}
  

}
ol, ul {
	list-style: none;
}

html, body, div, span, applet, object, 
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;

	vertical-align: baseline;
}
ul.circles li {
	list-style-image: url(../img/ul_circles.png);
	list-style-position: inside;
	margin-bottom: 10px;
	padding-left: 20px;
	text-indent: -20px;
}
ul.circles li a {
	color: #999; font-family:'calibre-bold',Helvetica, sans-serif; font-size:0.9em
}
ul.circles li a:hover {
	color: #000;
}


ul.cart li {
	list-style-image: url(../img/ul_circles.png);
	list-style-position: inside;
	padding-left: 20px;
	text-indent: -20px;
}


#contact { background: #fff; font-family: 'calibre-bold', Helvetica, sans-serif; font-size:0.9em}


#discover { font-size:2em; color:#fff; text-align:center;}

.grid-gallery figcaption h4 {
	margin: 0;
	padding: 0 0 0.2em; color:#fff; font-size:2em;font-family: 'calibre-bold', Helvetica, sans-serif
}
















.send a{color:#666;font-size:0.8em; float:left;padding-top:2em; border: 1px solid #666; padding:9px 8px; border-radius:4px;} .send a:hover {color:#000;  font-size:0.8em;  float:left;}
a:hover { opacity:0.8}

@media screen and (max-width: 23.5625em) {
#copyright { visibility:visible; } .top {font-size:50%;} #res {font-size:70%;} 

}


@media screen and (max-width: 23.5625em) { .loc a{ font-size:75%;} 
 
}



.photocomm { border-radius:50%; border: 1px solid #82888a }
.photocomm:hover { opacity:.7 }

.loglinkcen{ font-size:1em; text-align:center; color: #888; font-family:'calibre-bold', Helvetica, sans-serif }
.loglinkcen a{ font-size:1em; text-align:center; border: 1px solid #888; color: #888; padding: 5px 5px; font-family:'calibre-bold', Helvetica, sans-serif }
.profilelg { color: #003; font-size:1.4em; text-align:center; margin-top:4em;   }




/* General Demo Style */
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);

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

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body, html { font-size: 100%; padding: 0; margin: 0;}

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



/* Header Style */
.main,
.container > header {
	margin: 0 auto;
	padding: 2em;
}

.container > header {
	text-align: center;
	background: rgba(0,0,0,0.01);
}

.container > header h1 {
	font-size: 2.625em;
	line-height: 1.3;
	margin: 0;
	font-weight: 300;
}

.container > header span {
	display: block;
	font-size: 60%;
	color: #09f;
	padding: 0 0 0.6em 0.1em;
}



.component {
	line-height: 1.5em;
	margin: 0 auto;
	padding: 0;
	width: 90%;

	overflow: hidden; 
}


table {
    border-collapse: collapse;
    margin-bottom: 3em;
    width: 100%;
    background: #fff;
}
td, th {
    padding: 1em;
    text-align: left; 
}
	td.err {
	
		color: #fff;
		font-size: 0.75em;
		text-align: center;
		line-height: 1;
	}
th {
    font-weight: bold;
    color: #fff;
    white-space: nowrap;
}

#removeitem { padding:4px 4px; margin-left:0.7em; 
 font-size:0.8em; border-radius:60px; color:#000 ; background:#ddd; font-weight:100 }
tbody th {
	}
tbody tr:nth-child(2n-1) {
    transition: all .125s ease-in-out;
}
tbody tr:hover {
    }







/* Various buttons */
.see a{color:#000; font-size:0.9em; font-weight:100; float:left; font-family: inherit  } .see a:hover {color:#999; font-size:0.9em;  }
.inactive a{font-weight:100; float:left; font-family: inherit ;padding: 11px 14px; font-size:0.7EM; background: #999; color:#FFF}
.upload a{font-weight:700;  font-family: Helvetica, sans-serif ;padding: 13px 13px; font-size:0.7EM; background: #999; color:#fff}
.chatupload a{font-weight:700;  font-family: Helvetica, sans-serif ;padding: 14px 13px; font-size:0.7EM; background:#BEE4F9; color:#fff}

.active a{font-weight:100; float:left; font-family: inherit ;padding: 11px 14px; font-size:0.7EM; background: #09f; color:#FFF}
.post {font-weight:700; float:left; font-family: "Helvetica Neue" ;padding: 6px 6px; margin-left:1.38em; font-size:0.67EM; background: rgba(73,155,234,1);
background: -moz-linear-gradient(-45deg, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(73,155,234,1)), color-stop(100%, rgba(32,124,229,1)));
background: -webkit-linear-gradient(-45deg, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
background: -o-linear-gradient(-45deg, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
background: -ms-linear-gradient(-45deg, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
background: linear-gradient(135deg, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#499bea', endColorstr='#207ce5', GradientType=1 ); color:#FFF}



.center{ text-align:center}
.commauthname{ color:#82888a; font-size:0.8em; font-family: 'calibre-bold',Helvetica, sans-serif ;  text-align:center}
.view a{color:#999; font-size:0.9em; font-weight:100; float:right;  } .view a:hover {color:#5473DE; font-size:0.9em;  }
.location {padding-top: 1em; font-size:0.6em; color: #000; border-top: 1px solid #ddd; }
#comments { background: #fff}
.comment { padding:50px 50px; color:#fff; line-height:1.4;  border-bottom: 1px solid #DADADA ;  }
.pagenav { margin-right: 2.8em; float:right}
.pnum { padding-top: 1em; font-family:Helvetica, sans-serif}
.pnum a { color:#FFF}
.portnum { background:#000; color: #fff;font-weight: bold;font-size: 1em; font-family:Helvetica, sans-serif;   display: block;  float: left;  width: 22px;  height: 22px;outline: none;  text-align: center;text-decoration: none; line-height: 22px; margin-left: 3px; } 
.portcurrent { background: #333; color: #fff;font-weight: bold;font-size: 1em;   display: block;  float: left;  width: 22px;  height: 22px;outline: none;  text-align: center;text-decoration: none; line-height: 22px; margin-left: 3px; } 

.remove { float:left;  color:#F30; font-family:'ProximaNova-Regular',Helvetica, sans-serif}
.remove span{ font-family:'ProximaNova-Regular',Helvetica, sans-serif}
.pagenum { background:#000; color: #fff;font-weight: bold;font-size: 1em; font-family:Helvetica, sans-serif;   display: block;  float: left;  width: 22px;  height: 22px;outline: none;  text-align: center;text-decoration: none; line-height: 22px; margin-left: 3px; } 
.pagenav a{ color:#FFF}

.postclose a {font-weight:700; float:left; font-family: "Helvetica Neue" ;padding: 6px 6px; margin-left:1.38em; font-size:0.67EM; background:#666;color:#FFF; }

.commentno{ color: #ddd; font-size:2em; font-family: "Helvetica Neue", sans-serif; font-weight:400;  float: right; opacity:0.4}
.leavecomment { font-family:'calibre-bold', Helvetica, sans-serif; float:left; border-radius:3px; border:1px solid #666; font-size:0.8em; margin-left: 3.9em; padding: 9px 11px; color:#000; }
.leavecomment a{  color:#000; }
.rss a{ color: #09f; font-size:0.6em; letter-spacing:1px;  font-weight:100; padding-top:1em;  float: right; }

.cartcount {font-size:0.7em; color:#fff; vertical-align:super; font-weight:400; font-family: 'calibre-bold',"Helvetica Neue", sans-serif; background:#f97242; padding:3px 3px; border-radius: 20% 24%; margin-left:-0.3em;; }
.view a{color:#999; font-size:0.9em; font-weight:100; float:right;  } .view a:hover {color:#5473DE; font-size:0.9em;  }
.location {padding-top: 1em; font-size:0.6em; color: #000; border-top: 1px solid #ddd; }
#comments { background: #fff}
.loc { text-transform: capitalize; font-family:'calibre-bold',Arial, Helvetica, sans-serif; font-weight:100}
.comment { padding:50px 50px; color:#fff; line-height:1.4;  border-bottom: 1px solid #DADADA ;  }
.pagenav { margin-left: 2.8em;}
.pnum { padding-top: 1em; font-family:Helvetica, sans-serif}
.pnum a { color:#FFF}
.portnum { background:#000; color: #fff;font-weight: bold;font-size: 1em; font-family:Helvetica, sans-serif;   display: block;  float: left;  width: 22px;  height: 22px;outline: none;  text-align: center;text-decoration: none; line-height: 22px; margin-left: 3px; } 
.portcurrent { background: #333; color: #fff;font-weight: bold;font-size: 1em;   display: block;  float: left;  width: 22px;  height: 22px;outline: none;  text-align: center;text-decoration: none; line-height: 22px; margin-left: 3px; } 

.remove { float:left;  color:#F30; font-family:'ProximaNova-Regular',Helvetica, sans-serif}
.remove span{ font-family:'ProximaNova-Regular',Helvetica, sans-serif}
.pagenum { background:#000; color: #fff;font-weight: bold;font-size: 1em; font-family:Helvetica, sans-serif;   display: block;  float: left;  width: 22px;  height: 22px;outline: none;  text-align: center;text-decoration: none; line-height: 22px; margin-left: 3px; } 
.pagenav a{ color:#FFF}
#under{ padding-bottom: 0.2em; border-bottom:1px solid #333;}
.pagecurrent { background: rgba(73,155,234,1);
background: -moz-linear-gradient(-45deg, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(73,155,234,1)), color-stop(100%, rgba(32,124,229,1)));
background: -webkit-linear-gradient(-45deg, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
background: -o-linear-gradient(-45deg, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
background: -ms-linear-gradient(-45deg, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
background: linear-gradient(135deg, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#499bea', endColorstr='#207ce5', GradientType=1 ); color: #fff;font-weight: bold;font-size: 1em;   display: block;  float: left;  width: 22px;  height: 22px;outline: none;  text-align: center;text-decoration: none; line-height: 22px; margin-left: 3px; } 
.text { font-family:'calibre-bold', Helvetica, sans-serif ;color:#333; padding-top:5px; padding-bottom:10px;  line-height:1.4;}


.author a{ color: #000; font-size:0.6em; font-family:"Helvetica Neue", sans-serif ;letter-spacing:1px; text-transform:uppercase; font-weight:700; line-height:1.4;  }
.reply a{ color: #000; font-size:0.6em; font-family:"Helvetica Neue", sans-serif ;letter-spacing:1px; text-transform:uppercase; font-weight:700; line-height:1.4;  }
.userreply {  font-size:1em; letter-spacing:0px;  font-weight:100;  color:#09f }

.options a{  font-size:0.7em; color:#09f;  float: left; font-weight:700; text-transform:uppercase; float:right;  line-height:1.4 }
.time a{ color: #666; font-size:0.6em; font-family:'calibre-bold', sans-serif ;letter-spacing:0.5px; text-transform:uppercase; font-weight:700; line-height:1.4;   }


/* 
Styles for the html/body for special modal where we want 3d effects
Note that we need a container wrapping all content on the page for the 
perspective effects (not including the modals and the overlay).
*/
.md-perspective,
.md-perspective body {
	height: 100%;
	overflow: hidden;
}

.md-perspective body  {
	background: #fff;
	-webkit-perspective: 600px;
	-moz-perspective: 600px;
	perspective: 600px;
}

.container {
	background: none;
	min-height: 100%;
}

.md-modal {
	position: fixed; 
	top: 50%;
	left: 50%;
	width: 50%;
	max-width: 630px;
	min-width: 320px;
	height: auto;
	z-index: 2000;
	visibility: hidden;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}

.md-show {
	visibility: visible;
}

.md-overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	visibility: hidden;
	top: 0;
	left: 0;
	z-index: 1000;
	opacity: 0;
	background: rgba(255,255,255,0.8);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show ~ .md-overlay {
	opacity: 1;
	visibility: visible;
}

/* Content styles */
.md-content {
	color: inherit; background:#FFF ; ; position: relative;
	border-radius: 3px;
	margin: 0 auto; font-size:0.8em; -webkit-box-shadow: 10px 23px 76px 3px rgba(0,0,0,0.47);
-moz-box-shadow: 10px 23px 76px 3px rgba(0,0,0,0.47);
box-shadow: 10px 23px 76px 3px rgba(0,0,0,0.47);
} 

.md-content h3 {
	margin: 0;
	padding: 0.4em;
	text-align: center;
	font-size: 2em;
	font-weight: 100;
	opacity: 0.8;
	background: none;
	border-radius: 3px 3px 0 0;
}

.md-content > div {
	padding: 15px 40px 30px;
	margin: 0;
	font-weight: 300;
	font-size: 1.15em;
}

.md-content > div p {
	margin: 0;
	padding: 10px 0;
}

.md-content > div ul {
	margin: 0;
	padding: 0 0 30px 20px;
}

.md-content > div ul li {
	padding: 5px 0;
}

.md-content button {
	display: block;
	margin: 0 auto;
	font-size: 0.8em; font-weight:100;
}

/* Individual modal styles with animations/transitions */

/* Effect 1: Fade in and scale up */
.md-effect-1 .md-content {
	-webkit-transform: scale(0.7);
	-moz-transform: scale(0.7);
	-ms-transform: scale(0.7);
	transform: scale(0.7);
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-1 .md-content {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

/* Effect 2: Slide from the right */
.md-effect-2 .md-content {
	-webkit-transform: translateX(20%);
	-moz-transform: translateX(20%);
	-ms-transform: translateX(20%);
	transform: translateX(20%);
	opacity: 0;
	-webkit-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
	-moz-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
	transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
}

.md-show.md-effect-2 .md-content {
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
	opacity: 1;
}

/* Effect 3: Slide from the bottom */
.md-effect-3 .md-content {
	-webkit-transform: translateY(20%);
	-moz-transform: translateY(20%);
	-ms-transform: translateY(20%);
	transform: translateY(20%);
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-3 .md-content {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
}

/* Effect 4: Newspaper */
.md-effect-4 .md-content {
	-webkit-transform: scale(0) rotate(720deg);
	-moz-transform: scale(0) rotate(720deg);
	-ms-transform: scale(0) rotate(720deg);
	transform: scale(0) rotate(720deg);
	opacity: 0;
}

.md-show.md-effect-4 ~ .md-overlay,
.md-effect-4 .md-content {
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}

.md-show.md-effect-4 .md-content {
	-webkit-transform: scale(1) rotate(0deg);
	-moz-transform: scale(1) rotate(0deg);
	-ms-transform: scale(1) rotate(0deg);
	transform: scale(1) rotate(0deg);
	opacity: 1;
}

/* Effect 5: fall */
.md-effect-5.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-5 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateZ(600px) rotateX(20deg); 
	-moz-transform: translateZ(600px) rotateX(20deg); 
	-ms-transform: translateZ(600px) rotateX(20deg); 
	transform: translateZ(600px) rotateX(20deg); 
	opacity: 0;
}

.md-show.md-effect-5 .md-content {
	-webkit-transition: all 0.3s ease-in;
	-moz-transition: all 0.3s ease-in;
	transition: all 0.3s ease-in;
	-webkit-transform: translateZ(0px) rotateX(0deg);
	-moz-transform: translateZ(0px) rotateX(0deg);
	-ms-transform: translateZ(0px) rotateX(0deg);
	transform: translateZ(0px) rotateX(0deg); 
	opacity: 1;
}

/* Effect 6: side fall */
.md-effect-6.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-6 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translate(30%) translateZ(600px) rotate(10deg); 
	-moz-transform: translate(30%) translateZ(600px) rotate(10deg);
	-ms-transform: translate(30%) translateZ(600px) rotate(10deg);
	transform: translate(30%) translateZ(600px) rotate(10deg); 
	opacity: 0;
}

.md-show.md-effect-6 .md-content {
	-webkit-transition: all 0.3s ease-in;
	-moz-transition: all 0.3s ease-in;
	transition: all 0.3s ease-in;
	-webkit-transform: translate(0%) translateZ(0) rotate(0deg);
	-moz-transform: translate(0%) translateZ(0) rotate(0deg);
	-ms-transform: translate(0%) translateZ(0) rotate(0deg);
	transform: translate(0%) translateZ(0) rotate(0deg);
	opacity: 1;
}

/* Effect 7:  slide and stick to top */
.md-effect-7{
	top: 0;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}

.md-effect-7 .md-content {
	-webkit-transform: translateY(-200%);
	-moz-transform: translateY(-200%);
	-ms-transform: translateY(-200%);
	transform: translateY(-200%);
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
	opacity: 0;
}

.md-show.md-effect-7 .md-content {
	-webkit-transform: translateY(0%);
	-moz-transform: translateY(0%);
	-ms-transform: translateY(0%);
	transform: translateY(0%);
	border-radius: 0 0 3px 3px;
	opacity: 1;
}

/* Effect 8: 3D flip horizontal */
.md-effect-8.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-8 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: rotateY(-70deg);
	-moz-transform: rotateY(-70deg);
	-ms-transform: rotateY(-70deg);
	transform: rotateY(-70deg);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	opacity: 0;
}

.md-show.md-effect-8 .md-content {
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	transform: rotateY(0deg);
	opacity: 1;
}

/* Effect 9: 3D flip vertical */
.md-effect-9.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-9 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: rotateX(-70deg);
	-moz-transform: rotateX(-70deg);
	-ms-transform: rotateX(-70deg);
	transform: rotateX(-70deg);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	opacity: 0;
}

.md-show.md-effect-9 .md-content {
	-webkit-transform: rotateX(0deg);
	-moz-transform: rotateX(0deg);
	-ms-transform: rotateX(0deg);
	transform: rotateX(0deg);
	opacity: 1;
}

/* Effect 10: 3D sign */
.md-effect-10.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-10 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: rotateX(-60deg);
	-moz-transform: rotateX(-60deg);
	-ms-transform: rotateX(-60deg);
	transform: rotateX(-60deg);
	-webkit-transform-origin: 50% 0;
	-moz-transform-origin: 50% 0;
	transform-origin: 50% 0;
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-10 .md-content {
	-webkit-transform: rotateX(0deg);
	-moz-transform: rotateX(0deg);
	-ms-transform: rotateX(0deg);
	transform: rotateX(0deg);
	opacity: 1;
}

/* Effect 11: Super scaled */
.md-effect-11 .md-content {
	-webkit-transform: scale(2);
	-moz-transform: scale(2);
	-ms-transform: scale(2);
	transform: scale(2);
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-11 .md-content {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

/* Effect 12:  Just me */
.md-effect-12 .md-content {
	-webkit-transform: scale(0.8);
	-moz-transform: scale(0.8);
	-ms-transform: scale(0.8);
	transform: scale(0.8);
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-12 ~ .md-overlay {
	background: #e74c3c;
} 

.md-effect-12 .md-content h3,
.md-effect-12 .md-content {
	background: transparent;
}

.md-show.md-effect-12 .md-content {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

/* Effect 13: 3D slit */
.md-effect-13.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-13 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateZ(-3000px) rotateY(90deg);
	-moz-transform: translateZ(-3000px) rotateY(90deg);
	-ms-transform: translateZ(-3000px) rotateY(90deg);
	transform: translateZ(-3000px) rotateY(90deg);
	opacity: 0;
}

.md-show.md-effect-13 .md-content {
	-webkit-animation: slit .7s forwards ease-out;
	-moz-animation: slit .7s forwards ease-out;
	animation: slit .7s forwards ease-out;
}

@-webkit-keyframes slit {
	50% { -webkit-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -webkit-animation-timing-function: ease-out;}
	100% { -webkit-transform: translateZ(0) rotateY(0deg); opacity: 1; }
}

@-moz-keyframes slit {
	50% { -moz-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -moz-animation-timing-function: ease-out;}
	100% { -moz-transform: translateZ(0) rotateY(0deg); opacity: 1; }
}

@keyframes slit {
	50% { transform: translateZ(-250px) rotateY(89deg); opacity: 1; animation-timing-function: ease-in;}
	100% { transform: translateZ(0) rotateY(0deg); opacity: 1; }
}

/* Effect 14:  3D Rotate from bottom */
.md-effect-14.md-modal {

	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-14 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateY(100%) rotateX(90deg);
	-moz-transform: translateY(100%) rotateX(90deg);
	-ms-transform: translateY(100%) rotateX(90deg);
	transform: translateY(100%) rotateX(90deg);
	-webkit-transform-origin: 0 100%;
	-moz-transform-origin: 0 100%;
	transform-origin: 0 100%;
	opacity: 0;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

.md-show.md-effect-14 .md-content {
	-webkit-transform: translateY(0%) rotateX(0deg);
	-moz-transform: translateY(0%) rotateX(0deg);
	-ms-transform: translateY(0%) rotateX(0deg);
	transform: translateY(0%) rotateX(0deg);
	opacity: 1;
}

/* Effect 15:  3D Rotate in from left */
.md-effect-15.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-15 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
	-moz-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
	-ms-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
	transform: translateZ(100px) translateX(-30%) rotateY(90deg);
	-webkit-transform-origin: 0 100%;
	-moz-transform-origin: 0 100%;
	transform-origin: 0 100%;
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-15 .md-content {
	-webkit-transform: translateZ(0px) translateX(0%) rotateY(0deg);
	-moz-transform: translateZ(0px) translateX(0%) rotateY(0deg);
	-ms-transform: translateZ(0px) translateX(0%) rotateY(0deg);
	transform: translateZ(0px) translateX(0%) rotateY(0deg);
	opacity: 1;
}

/* Effect 16:  Blur */
.md-show.md-effect-16 ~ .md-overlay {
	background: rgba(180,46,32,0.5);
}

.md-show.md-effect-16 ~ .container {
	-webkit-filter: blur(3px);
	-moz-filter: blur(3px);
	filter: blur(3px);
}

.md-effect-16 .md-content {
	-webkit-transform: translateY(-5%);
	-moz-transform: translateY(-5%);
	-ms-transform: translateY(-5%);
	transform: translateY(-5%);
	opacity: 0;
}

.md-show.md-effect-16 ~ .container,
.md-effect-16 .md-content {
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-16 .md-content {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
}

/* Effect 17:  Slide in from bottom with perspective on container */
.md-show.md-effect-17 ~ .container {
	height: 100%;
	overflow: hidden;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
}	

.md-show.md-effect-17 ~ .container,
.md-show.md-effect-17 ~ .md-overlay  {
	-webkit-transform: rotateX(-2deg);
	-moz-transform: rotateX(-2deg);
	-ms-transform: rotateX(-2deg);
	transform: rotateX(-2deg);
	-webkit-transform-origin: 50% 0%;
	-moz-transform-origin: 50% 0%;
	transform-origin: 50% 0%;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.md-effect-17 .md-content {
	opacity: 0;
	-webkit-transform: translateY(200%);
	-moz-transform: translateY(200%);
	-ms-transform: translateY(200%);
	transform: translateY(200%);
}

.md-show.md-effect-17 .md-content {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
	-webkit-transition: all 0.3s 0.2s;
	-moz-transition: all 0.3s 0.2s;
	transition: all 0.3s 0.2s;
}

/* Effect 18:  Slide from right with perspective on container */
.md-show.md-effect-18 ~ .container {
	height: 100%;
	overflow: hidden;
}

.md-show.md-effect-18 ~ .md-overlay {
	background: rgba(143,27,15,0.8);
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}

.md-show.md-effect-18 ~ .container,
.md-show.md-effect-18 ~ .md-overlay {
	-webkit-transform-style: preserve-3d;
	-webkit-transform-origin: 0% 50%;
	-webkit-animation: rotateRightSideFirst 0.5s forwards ease-in;
	-moz-transform-style: preserve-3d;
	-moz-transform-origin: 0% 50%;
	-moz-animation: rotateRightSideFirst 0.5s forwards ease-in;
	transform-style: preserve-3d;
	transform-origin: 0% 50%;
	animation: rotateRightSideFirst 0.5s forwards ease-in;
}

@-webkit-keyframes rotateRightSideFirst {
	50% { -webkit-transform: translateZ(-50px) rotateY(5deg); -webkit-animation-timing-function: ease-out; }
	100% { -webkit-transform: translateZ(-200px); }
}

@-moz-keyframes rotateRightSideFirst {
	50% { -moz-transform: translateZ(-50px) rotateY(5deg); -moz-animation-timing-function: ease-out; }
	100% { -moz-transform: translateZ(-200px); }
}

@keyframes rotateRightSideFirst {
	50% { transform: translateZ(-50px) rotateY(5deg); animation-timing-function: ease-out; }
	100% { transform: translateZ(-200px); }
}

.md-effect-18 .md-content {
	-webkit-transform: translateX(200%);
	-moz-transform: translateX(200%);
	-ms-transform: translateX(200%);
	transform: translateX(200%);
	opacity: 0;
}

.md-show.md-effect-18 .md-content {
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
	opacity: 1;
	-webkit-transition: all 0.5s 0.1s;
	-moz-transition: all 0.5s 0.1s;
	transition: all 0.5s 0.1s;
}

/* Effect 19:  Slip in from the top with perspective on container */
.md-show.md-effect-19 ~ .container {
	height: 100%;
	overflow: hidden;
}

.md-show.md-effect-19 ~ .md-overlay {
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}

.md-show.md-effect-19 ~ .container,
.md-show.md-effect-19 ~ .md-overlay {
	-webkit-transform-style: preserve-3d;
	-webkit-transform-origin: 50% 100%;
	-webkit-animation: OpenTop 0.5s forwards ease-in;
	-moz-transform-style: preserve-3d;
	-moz-transform-origin: 50% 100%;
	-moz-animation: OpenTop 0.5s forwards ease-in;
	transform-style: preserve-3d;
	transform-origin: 50% 100%;
	animation: OpenTop 0.5s forwards ease-in;
}

@-webkit-keyframes OpenTop {
	50% { 
		-webkit-transform: rotateX(10deg); 
		-webkit-animation-timing-function: ease-out; 
	}
}

@-moz-keyframes OpenTop {
	50% { 
		-moz-transform: rotateX(10deg); 
		-moz-animation-timing-function: ease-out; 
	}
}

@keyframes OpenTop {
	50% { 
		transform: rotateX(10deg); 
		animation-timing-function: ease-out; 
	}
}

.md-effect-19 .md-content {
	-webkit-transform: translateY(-200%);
	-moz-transform: translateY(-200%);
	-ms-transform: translateY(-200%);
	transform: translateY(-200%);
	opacity: 0;
}

.md-show.md-effect-19 .md-content {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
	-webkit-transition: all 0.5s 0.1s;
	-moz-transition: all 0.5s 0.1s;
	transition: all 0.5s 0.1s;
}




@font-face {
	font-family: 'fontawesome';
	src:url('../fonts/fontawesome/fontawesome.eot?-e43dk9');
	src:url('../fonts/fontawesome/fontawesome.eot?#iefix-e43dk9') format('embedded-opentype'),
		url('../fonts/fontawesome/fontawesome.woff?-e43dk9') format('woff'),
		url('../fonts/fontawesome/fontawesome.ttf?-e43dk9') format('truetype'),
		url('../fonts/fontawesome/fontawesome.svg?-e43dk9#fontawesome') format('svg');
	font-weight: normal;
	font-style: normal;
} /* Made with http://icomoon.io/app */

/* General style */
.grid-gallery ul {
	list-style: none;
	margin: 0;
	padding: 0; 
}

.grid-gallery figure {
	margin: 0; cursor: default
}

.grid-gallery figure img {
	display: block;
	width: 100%; 
	opacity: 1; 
	filter: alpha(opacity=100); 
 	-webkit-transition: opacity 0.1s linear; -webkit-box-shadow: -1px 6px 50px -22px rgba(0,0,0,0.5);
-moz-box-shadow: -1px 6px 50px -22px rgba(0,0,0,0.5);
box-shadow: -1px 6px 50px -22px rgba(0,0,0,0.5);

}

	
.grid-gallery figure img:hover {
	opacity: 1;
	filter: alpha(opacity=50);
 	-webkit-transition: opacity 0.35s linear; 
	}

.grid-gallery figcaption h3 {
	margin: 0;
	padding: 0 0 0.2em; color:#999; font-size:1.01em; line-height:1.2
	; ; font-family:'calibre-regular', Helvetica, sans-serif; font-weight:100;
}

.grid-gallery figcaption h3 a{
	margin: 0; font-family: 'calibre-regular', Helvetica, sans-serif;
	padding: 0 0 0.2em; color:#999; font-weight:100; 
}

.timestamp{ font-family: 'calibre-regular', Helvetica, sans-serif; font-size:0.6em; float:right;  margin-top:1.38em; font-weight:100; color: #ccc }
.grid-gallery figcaption h5 {
	margin: 0;
	padding: 0 0 0.2em; color:#fff; font-size:2em
}


.grid-gallery figcaption h5 a{
	margin: 0; font-family:'calibre-regular', Helvetica, sans-serif;
	padding: 0 0 0.2em; color:#fff; font-weight:100;
}

.grid-gallery figcaption p {
	margin: 0; font-size:0.7em; color: #999; padding: 0 0 0.2em; font-weight:100; font-family:'calibre-bold', Helvetica, sans-serif 
}

/* Grid style */
.grid-wrap {
	max-width:100em;
	margin: 0 auto; background:#Fff;
	padding: 0 1em 3.875em; 
}

.masthead { 
 background-color:#fff; 
 
  }
  /* controls client section */
	
	#clients { background:#fff; text-align:center; color:#333; padding: 30px 30px;}
	
/* controls client section */
  
h2{ font-weight:100}
  
th { color: #666; }
  
.grid {
	margin: 0 auto;
}

.grid li {
	width: 25%;
	float: left;
	cursor: pointer; background:#Fff
}

.grid figure {
	padding: 15px;
	-webkit-transition: opacity 0.2s;
	transition: opacity 0.2s;
}

.grid li:hover figure {
	opacity: 1;
}

.grid figcaption {
	background: #fff;
	padding: 15px; padding-top:1em;-webkit-box-shadow: -1px 6px 50px -16px rgba(0,0,0,0.38);
-moz-box-shadow: -1px 6px 50px -16px rgba(0,0,0,0.38);
box-shadow: -1px 6px 50px -16px rgba(0,0,0,0.38); 
}





.grid .add { background:#fff; border: 1px solid #ddd}
.grid .event { background: #00aeef;  }
.grid .event p  {color:#fff; }
.grid .event p.descr { color: #003; font-family: 'calibre-bold'; font-size:0.87em;,Helvetica, sans-serif}
.slideshow-open .slideshow {
	opacity: 1;
	visibility: visible;
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
}

.slideshow ul {
	width: 100%;
	height: 100%;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translate3d(0,0,150px);
	transform: translate3d(0,0,150px);
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
}

.slideshow ul.animatable li {
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
}

.slideshow-open .slideshow ul {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

.slideshow li {
	width: 660px;
	height: 560px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -280px 0 0 -330px;
	visibility: hidden;
}

.slideshow li.show {
	visibility: visible;
}

.slideshow li:after {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(255,255,255,0.8);
	-webkit-transition: opacity 0.3s;
	transition: opacity 0.3s;
}

.slideshow li.current:after {
	visibility: hidden;
	opacity: 0;
	-webkit-transition: opacity 0.3s, visibility 0s 0.3s;
	transition: opacity 0.3s, visibility 0s 0.3s;
}

.slideshow figure {
	width: 100%;
	height: 100%;
	background: #fff;
	border: 50px solid #fff;
	overflow: hidden;
}

.slideshow figcaption {
	padding-bottom: 20px;
}

.slideshow figcaption h3 {
	font-weight: 400;
	font-size: 200%;
}

/* Navigation */
.slideshow nav span {
	position: fixed;
	z-index: 1000;
	color: #59656c;
	text-align: center;
	padding: 3%;
	cursor: pointer;
	font-size: 2.2em;
}

.slideshow nav span.nav-prev,
.slideshow nav span.nav-next {
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.slideshow nav span.nav-next {
	right: 0;
}

.slideshow nav span.nav-close {
	top: 0;
	right: 0;
	padding: 0.5em 1em;
	color: #31373a;
}

.icon:before,
.icon:after {
	font-family: 'fontawesome';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

span.nav-prev:before {
	content: "\e601";
}

span.nav-next:before  {
	content: "\e600";
}

span.nav-close:before {
	content: "\e602";
}

/* Info on arrow key navigation */
.info-keys {
	position: fixed;
	top: 10px;
	left: 10px;
	width: 60px;
	font-size: 8px;
	padding-top: 20px;
	text-transform: uppercase;
	color: #fff;
	letter-spacing: 1px;
	text-align: center;
}

.info-keys:before,
.info-keys:after {
	position: absolute;
	top: 0;
	width: 16px;
	height: 16px;
	border: 1px solid #fff;
	text-align: center;
	line-height: 14px;
	font-size: 12px;
}

.info-keys:before {
	left: 10px;
	content: "\e603";
}



.info-keys:after {
	right: 10px;
	content: "\e604";
}

/* Example media queries (reduce number of columns and change slideshow layout) */

@media screen and (max-width: 60em) {
	/* responsive columns; see "Element sizing" on http://masonry.desandro.com/options.html */
	.grid li {
		width: 33.3%;
	}
.cbp-tm-menu{ visibility:hidden}
	.slideshow li {
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		margin: 0;
	}#logo{ width:100%}

	.slideshow li figure img {
		width: auto;
		margin: 0 auto;
		max-width: 100%;
	}

	.slideshow nav span,
	.slideshow nav span.nav-close {
		font-size: 1.8em;
		padding: 0.3em;
	}

	.info-keys {
		display: none;
	}

}

@media screen and (max-width: 35em) {
	#herotext { font-size: 1.8em; letter-spacing:-1px} .grid li {
		width: 50%; font-size:100%;
	}  .top  {font-size:60%;} #quote { font-size: 170%}.comment{
		width : 31%;
	} .md-content { font-size:60%}#logo{ width:100%} #dte{ font-size:70%} .tabs nav a span { font-size:0.5em} #intro{ font-size: 1.6em}}

@media screen and (max-width: 24em) {

#herotext { font-size: 1.8em; letter-spacing:-1px}
	.grid li {
		width: 100%;font-size:90%;
	}  #logo{ width:100%}#dte{ font-size:70%} .tabs nav a span { font-size:0.5em} #intro{ font-size: 1.6em}

}
@media screen and (max-width: 24em) {
.grid-gallery figcaption p {
	margin: 0; font-size:0.75em; padding: 0 0 0.2em; font-weight:100; #logo{ width:100%} #intro{ font-size: 1.6em}
}

}
.time { font-weight:100; color: #959ba2; font-family:inherit}

.btime { font-weight:100; color: #f97242; font-family:'calibre-bold',Helvetica, sans-serif}
.order a{ font-weight:700; background:#f97242; color:#FFF; font-size:1em; padding:5px 5px; border-radius:10px; box-shadow:0 2px 3px #ccc }

.md-close{ font-family:'calibre-regular',Helvetica, sans-serif;font-weight:100; background:#999; color:#fff; font-size:0.7em; padding:9px 9px; border-radius:10px;cursor:inherit; border-radius:21px;}
.md-close a{ font-family:'calibre-regular',Helvetica, sans-serif;font-weight:100; background:none; color:#fff; font-size:1em; border-radius:21px; }
.remove a{ background:#fff; padding: 5px 5px; font-size:0.6em; float:right; color:#000; border-radius: 10px }

#proceed { font-family: 'calibre-regular',Helvetica, sans-serif;font-weight:100;  color: #999; font-size:0.8em; padding:12PX 14PX; border-radius:21px; background: none;  border: 1px double #999  }


.proceed a{ font-family: 'calibre-bold',Helvetica, sans-serif;font-weight:100; background:none; color:#000; font-size:1em; }
.proceed:hover{  background-color: rgba(0,0,0,0.2);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#1AFFFFFF, endColorstr=#1AFFFFFF)";
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#1AFFFFFF, endColorstr=#1AFFFFFF);
  }

button { background:none; outline:none; font-weight:500; border: none; font-family:'calibre-regular', Helvetica, sans-serif; cursor: pointer }
.item{ color:#f97242;  font-family: 'calibre-bold', Helvetica, sans-serif ;}
#item{ color:#333;  font-family:'calibre-bold', Helvetica, sans-serif ; font-size:1em}

#md-trigger { font-weight:400;font-family:'calibre-bold',Helvetica, sans-serif; background:#f97242; color:#FFF; font-size:0.6em; padding:5px 5px; border-radius:10px; box-shadow:0 2px 3px #ccc; cursor:inherit; outline:none; }


#preorder { font-weight:400;font-family:'calibre-bold',Helvetica, sans-serif; background: #2CCD5C; color:#FFF; font-size:0.6em; padding:5px 5px; border-radius:10px; box-shadow:0 2px 3px #ccc; cursor:inherit; outline:none; }


.md-trigger:hover { opacity: 0.8;}
.price { font-weight:800; color: #666; font-family:'calibre-bold',Helvetica, sans-serif}


.order a:hover{ opacity: 0.8 }
#signin a:hover{ opacity: 0.8 }

#signin a{ font-weight:100;padding: 6px 6px; font-family: 'calibre-bold',Helvetica, sans-serif}

#signin{ font-weight:100; padding: 6px 6px; color:#FFF; font-size:1em; }

#signup a:hover{ opacity: 0.8 }

#signup a{  color:#fff;font-weight:100; font-family: 'calibre-bold',Helvetica, sans-serif}

#signup { background:#f97242; 
  font-size: 1em; 

  border-radius:5px; color:#fff; padding: 6px 6px; font-weight:bold} 
.brludi { font-size:0.5em; background: #F2F2F2; padding:3.4px 3.4px; color:#666; border-radius:40%; }


.confirm { background:#22DB4B; text-align:center; border-radius: 6px; padding:9px 9px; color:#fff}
.confirm a { color:#FFF; text-align:center}
@media screen and (max-width: 44.75em) {#search {
       
        width: 96%; margin:0 auto; 

    }
	select{ width : 50%} 

}
}

@media screen and (max-width: 24em) {
    #search {
       
        width: 97.5%;margin:0 auto;

    }
}
input,
textarea,
 {
	font-family: 'calibre-regular', Helvetica, sans-serif;
	line-height: 1.5;
	font-size: 1em;
	color: #2d3c48; padding:10px 20px;width:600px ; height:50px; border-radius:4px;  font-weight:100;
	
	background: #fff;
}




input,
textarea,
select {
	font-family: inherit;	
	color: #000; padding:10px 10px; 
	
	background: #fff; opacity:0.8; border:none ; font-size:100%
	
}

input { width:90% ; height:40px; outline:none; border:none; }

textarea {
	min-height: 260px; outline: none;
}
select {
	 width:190px; outline: none;
}


.headtext {text-align:center; color:#f00; font-size:170%;  padding:3px 3px; }
.hed {text-align:center; font-family: 'calibre-bold', Helvetica, sans-serif;}
.hedsm {  font-family: 'ProximaNova-Regular'; font-size:0.7em; color:#666;  line-height:1.3;letter-spacing:1.5px; z-index:100}

input:focus
{
	outline: none; border:none;
	}

select:focus {
	outline: none; 
}



.notif {  color:#000; border-bottom: 1PX solid #EFEFEF;  }
.notcount { font-size: 0.73em; font-weight: 100; 
    font-family: 'calibre-bold', sans-serif; vertical-align:super;
    background: #F03; padding-top: 3px;padding-bottom: 3px;
    padding-right: 5px; padding-left:2PX;
    border-radius: 100%;
    text-align: center;
    margin-left: -0.1em; color:#FFF }

.notecount {    font-size: 0.63em;
    color: #30C260;
    vertical-align: super;
    font-weight: 100; border:1px solid #fff;
    font-family: 'calibre-bold', sans-serif;
    background: #fff; padding-top: 3px;padding-bottom: 3px;
    padding-right: 3px; padding-left: 3px; left:auto; right:auto;
    border-radius: 80%;
    text-align: center;
    margin-left: -0.8em;
} 

#and{ font-family: 'Libre Baskerville',Georgia, "Times New Roman", Times, serif; font-size:1.1em; font-weight:900}
.lovecount {    font-size: 0.63em;
    color: #F90F3E;
    vertical-align: super;
    font-weight: 100; border:1px solid #fff;
    font-family: 'calibre-bold', sans-serif;
    background: #fff; padding-top: 3px;padding-bottom: 3px;
    padding-right: 3px; padding-left: 3px; left:auto; right:auto;
    border-radius: 80%;
    text-align: center;
    margin-left: -0.8em;
} 
.bld { font-weight:100; color:#003}
.grid .not { background: none; border: 1px solid #f00  }
.grid .not p  {color:#f00; }
#notif { padding: 150px 20px; text-align:center; font-size:1.3em; color:#f97242}
#results { padding: 20px 20px; text-align:center; font-size:1.3em; color:#f97242}
#upsign a { font-family: 'calibre-bold';  text-align:center; font-size:1.3em; color:#999 font-weight:100}
 #headtag { margin-left:1.6EM;  font-size:1.2em; padding-bottom: 1EM;  width:94%; color: #666; font-family:'GothamRoundedLight', Helvetica, sans-serif}
 
 
 /* Default tab style */

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

.tabs {
	position: relative;
	overflow: hidden;
	margin: 0 auto;
	width: 100%; font-family:'calibre-regular', Helvetica, sans-serif;
	font-weight: 300;
	font-size: 1em;
}

/* Nav */
.tabs nav {
	text-align: center;
}

.tabs nav ul {
	position: relative;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	margin: 0 auto;
	padding: 0;
	max-width: 1200px;
	list-style: none;
	-ms-box-orient: horizontal;
	-ms-box-pack: center;
	-webkit-flex-flow: row wrap;
	-moz-flex-flow: row wrap;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;
}

.tabs nav ul li {
	position: relative;

	display: block;
	margin: 0;
	text-align: center;
	-webkit-flex: 1;
	-moz-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

.tabs nav a {
	position: relative;
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	line-height: 2.5; 
}

.tabs nav a span {
	vertical-align: middle;
	font-size: 0.79em; 
}

.tabs nav li.tab-current a {
	color: #333;
}

.tabs nav a:focus {
	outline: none;
}

/* Icons */
.icon::before {
	z-index: 10;
	display: inline-block;
	margin: 0 0.4em 0 0;
	vertical-align: middle;
	text-transform: none;
	font-weight: normal;
	font-variant: normal;
	font-size: 1.3em;
	font-family: 'stroke7pixeden';
	line-height: 1;
	speak: none;
	-webkit-backface-visibility: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.icon-upload::before {
	content: "\e68a";
}
.icon-tools::before {
	content: "\e60a";
}
.icon-plane::before {
	content: "\e625";
}
.icon-joy::before {
	content: "\e6a4";
}
.icon-plug::before {
	content: "\e69a";
}
.icon-home::before {
	content: "\e648";
}
.icon-gift::before {
	content: "\e652";
}
.icon-display::before {
	content: "\e65e";
}
.icon-date::before {
	content: "\e660";
}
.icon-config::before {
	content: "\e666";
}
.icon-coffee::before {
	content: "\e669";
}
.icon-camera::before {
	content: "\e66f";
}
.icon-box::before {
	content: "\e674";
}

/* Content */
.content-wrap {
	position: relative;
}

.content-wrap section {
	display: none;
	margin: 0 auto;
	padding: 1em;
	max-width: 1200px;
	text-align: center;
}

.content-wrap section.content-current {
	display: block;
}

.content-wrap section p {
	margin: 0;
	padding: 0.75em 0;
	color: rgba(40,44,42,0.05);
	font-weight: 900;
	font-size: 4em;
	line-height: 1;
}

/* Fallback */
.no-js .content-wrap section {
	display: block;
	padding-bottom: 2em;
	border-bottom: 1px solid rgba(255,255,255,0.6);
}

.no-flexbox nav ul {
	display: block;
}

.no-flexbox nav ul li {
	min-width: 15%;
	display: inline-block;
}

@media screen and (max-width: 58em) {
	.tabs nav a.icon span {
		display: none;
	}
	.tabs nav a:before {
		margin-right: 0;
	}
}

/* Individual tab styles */

/*****************************/
/* Bar */
/*****************************/

.tabs-style-bar nav {
	background: rgba(40,44,42,0.05);
}

.tabs-style-bar nav ul {
	border: 4px solid transparent;
}

.tabs-style-bar nav ul li a {
	margin: 0 2px;
	background-color: #f7f7f7;
	color: #74777b;
	transition: background-color 0.2s, color 0.2s;
}

.tabs-style-bar nav ul li a:hover,
.tabs-style-bar nav ul li a:focus {
	color: #000;
}

.tabs-style-bar nav ul li a span {
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 500;
	font-size: 0.6em;
}


/*****************************/
/* Icon box */
/*****************************/

.tabs-style-iconbox nav {
	background: rgba(255,255,255,0.4);
}

.tabs-style-iconbox nav ul li a {
	overflow: visible;
	padding: 2em 0;
	line-height: 1;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}

.tabs-style-iconbox nav ul li a span {
	font-weight: 700;
	font-size: 0.5em; font-family: 'calibre-bold', Helvetica, sans-serif	
}

.grid-gallery figcaption p.stats { color: #ccc;  font-family:'calibre-regular', Helvetica, sans-serif; font-size:1em;
	
}

.grid-gallery figcaption p.statslg { color:#fff;  font-family:'calibre-bold', Helvetica, sans-serif; font-size:2em; text-align:center
	
}




.tabs-style-iconbox nav ul li.tab-current a {
	background: #fff;
	box-shadow: -1px 0 0 #fff;
}

.tabs-style-iconbox nav ul li.tab-current a::after {
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -10px;
	width: 0;
	height: 0;
	border: solid transparent;
	border-width: 10px;
	border-top-color: #fff;
	content: '';
	pointer-events: none;
}

.tabs-style-iconbox nav ul li:first-child::before,
.tabs-style-iconbox nav ul li::after {
	position: absolute;
	top: 20%;
	right: 0;
	z-index: -1;
	width: 1px;
	height: 60%;
	background: rgba(0,0,0,0.07);
	content: '';
}

.tabs-style-iconbox nav ul li:first-child::before {
	right: auto;
	left: 0;
}

.tabs-style-iconbox .icon::before {
	display: block;
	margin: 0 0 0.25em 0;
}

/*****************************/
/* Underline */
/*****************************/

.tabs-style-underline nav {
	background: #f2F2F2;
}

.tabs-style-underline nav a {
	padding: 0.25em 0 0.5em; font-weight:100;
 border-radius: 3px;	-webkit-transition: color 0.2s; font-size:0.8em;
	transition: color 0.2s;font-family: 'calibre-regular', Helvetica, sans-serif	; text-transform:uppercase;
}

.tabs-style-underline nav a:hover { background:none; color:#fff;}

.tabs-style-underline nav li.currently {background:#00aeef; color:#fff }
.tabs-style-underline nav li.currently a{color:#fff; }


.tabs-style-underline nav li.recent {background:#4183c4; color:#fff }
.tabs-style-underline nav li.recent a{color:#fff }

.tabs-style-underline nav li.rising {background:#F4A853; color:#fff }
.tabs-style-underline nav li.rising a{color:#fff }



.tabs-style-underline nav li a::after {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 10px;
	background: #003;
	content: '';
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transform: translate3d(0,150%,0);
	transform: translate3d(0,150%,0);
}

.tabs-style-underline nav li.tab-current a::after {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

.tabs-style-underline nav a span {
	font-weight: 700; font-family:'calibre-bold', Helvetica, sans-serif
}

/*****************************/
/* Triangle and line */
/*****************************/

.tabs-style-linetriangle nav a {
	overflow: visible;
	border-bottom: 1px solid rgba(0,0,0,0.2);
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}

.tabs-style-linetriangle nav a span {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 1em;
}

.tabs-style-linetriangle nav li.tab-current a:after, 
.tabs-style-linetriangle nav li.tab-current a:before {
	position: absolute;
	top: 100%;
	left: 50%;
	width: 0;
	height: 0;
	border: solid transparent;
	content: '';
	pointer-events: none;
}

.tabs-style-linetriangle nav li.tab-current a:after {
	margin-left: -10px;
	border-width: 10px;
	border-top-color: #e7ecea;
}

.tabs-style-linetriangle nav li.tab-current a:before {
	margin-left: -11px;
	border-width: 11px;
	border-top-color: rgba(0,0,0,0.2);
}

@media screen and (max-width: 58em) {
	.tabs-style-linetriangle nav {
		font-size: 0.6em;
	}
}

/*****************************/
/* Top Line */
/*****************************/

.tabs-style-topline {
	max-width: 1200px;
}

.tabs-style-topline nav li {
	border: 1px solid rgba(40,44,42,0.1);
}

.tabs-style-topline nav li:not(:last-child) {
	border-right: none;
}

.tabs-style-topline nav li.tab-current {
	border-top-color: #003;
	border-bottom: none;
}

.tabs-style-topline nav a {
	padding: 0.65em 0 0.5em;
	background: rgba(40,44,42,0.05);
	color: #74777b;
	line-height: 1;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}

.tabs-style-topline nav a:hover,
.tabs-style-topline nav a:focus {
	color: #003;
}

.tabs-style-topline nav li.tab-current a {
	background: none;
	box-shadow: inset 0 3px 0 #003;
	color: #003;
}

.tabs-style-topline .icon::before {
	display: block;
	margin: 0;
}

.tabs-style-topline nav a span {
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
	font-size: 0.5em;
}

/*****************************/
/* Falling Icon, from http://vintageproductions.eu/grid/interactivity/ */ 
/*****************************/



.tabs-style-iconfall {
	overflow: visible;
}

.tabs-style-iconfall nav a {
	display: inline-block;
	overflow: visible;
	padding: 1em 0 1em;
	color: #ccc;
	line-height: 1;
	-webkit-transition: color 0.3s cubic-bezier(0.7,0,0.3,1); 
	transition: color 0.3s cubic-bezier(0.7,0,0.3,1);
}

.tabs-style-iconfall nav a:hover,
.tabs-style-iconfall nav a:focus,
.tabs-style-iconfall nav li.tab-current a {
	color: #ccc;
}

.tabs-style-iconfall nav a span {
	font-weight: 100;
}



.current{border-bottom: 3px solid #ccc;}
.tabs-style-iconfall nav li::before {
	position: absolute;
	bottom: 1em;
	left: 50%;
	margin-left: -20px;
	width: 40px;
	height: 4px;
	background: #fff;
	content: '';
	opacity: 0;
	-webkit-transition: -webkit-transform 0.2s ease-in;
	transition: transform 0.2s ease-in;
	-webkit-transform: scale3d(0,1,1);
	transform: scale3d(0,1,1);
}

.tabs-style-iconfall nav li.tab-current::before {
	opacity: 1;
	-webkit-transform: scale3d(1,1,1);
	transform: scale3d(1,1,1);
}

.tabs-style-iconfall .icon::before {
	display: block;
	margin: 0 0 0.35em;
	opacity: 0;
	-webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
	transition: transform 0.2s, opacity 0.2s;
	-webkit-transform: translate3d(0,-100px,0);
	transform: translate3d(0,-100px,0);
	pointer-events: none;
}

.tabs-style-iconfall nav li.tab-current .icon::before {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

@media screen and (max-width: 58em) {
	.tabs-style-iconfall nav li .icon::before {
		opacity: 1;
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
	}
}

/*****************************/
/* Moving Line */
/*****************************/

.tabs-style-linemove nav {
	background: #fff;
}

.tabs-style-linemove nav li:last-child::before {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 4px;
	background: #003;
	content: '';
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
}

/* Move the line */
.tabs-style-linemove nav li:first-child.tab-current ~ li:last-child::before {
	-webkit-transform: translate3d(-400%,0,0);
	transform: translate3d(-400%,0,0);
}

.tabs-style-linemove nav li:nth-child(2).tab-current ~ li:last-child::before {
	-webkit-transform: translate3d(-300%,0,0);
	transform: translate3d(-300%,0,0);
}

.tabs-style-linemove nav li:nth-child(3).tab-current ~ li:last-child::before {
	-webkit-transform: translate3d(-200%,0,0);
	transform: translate3d(-200%,0,0);
}

.tabs-style-linemove nav li:nth-child(4).tab-current ~ li:last-child::before {
	-webkit-transform: translate3d(-100%,0,0);
	transform: translate3d(-100%,0,0);
}

.tabs-style-linemove nav a {
	padding: 1em 0;
	color: #74777b;
	line-height: 1;
	-webkit-transition: color 0.3s, -webkit-transform 0.3s; 
	transition: color 0.3s, transform 0.3s;
}

.tabs-style-linemove nav li.tab-current a {
	color: #003;
	-webkit-transform: translate3d(0,8px,0);
	transform: translate3d(0,8px,0);
}

.tabs-style-linemove nav a span {
	font-weight: 700;
}

/*****************************/
/* Line */
/*****************************/

.tabs-style-line nav ul {
	padding: 0 2em;
	max-width: none;
	box-shadow: inset 0 -2px #d1d3d2;
}

.tabs-style-line nav a {
	padding: 0.7em 0.4em;
	box-shadow: inset 0 -2px #ccc;
	color: #000;
	text-align: left;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 100;
	font-size: 0.8em;
	line-height: 2;
	-webkit-transition: color 0.3s, box-shadow 0.3s;
	transition: color 0.3s, box-shadow 0.3s;
}

.tabs-style-line nav a:hover,
.tabs-style-line nav a:focus {
	box-shadow: inset 0 -2px #74777b;
}

.tabs-style-line nav li.tab-current a {
	box-shadow: inset 0 -2px #000;
	color: #000;
}

@media screen and (max-width: 58em) {
	.tabs-style-line nav ul {
		display: block;
		box-shadow: none;
	}
	.tabs-style-line nav ul li {
		display: block;
		-webkit-flex: none;
		flex: none;
	}
}

/*****************************/
/* Circle */
/*****************************/

.tabs-style-circle {
	overflow: visible;
}

.tabs-style-circle nav li::before {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -60px 0 0 -60px;
	width: 120px;
	height: 120px;
	
	border-radius: 50%;
	content: '';
	opacity: 0;
	-webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
	transition: transform 0.2s, opacity 0.2s;
	-webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
	transition-timing-function: cubic-bezier(0.7,0,0.3,1);
	-webkit-transform: scale3d(0,0,1);
	transform: scale3d(0,0,1);
}

@media screen and (max-width: 58em) {
	.tabs-style-circle nav li::before {
		margin: -40px 0 0 -40px;
		width: 80px;
		height: 80px;
	}
}

.tabs-style-circle nav li.tab-current::before {
	opacity: 1;
	-webkit-transform: scale3d(1,1,1);
	transform: scale3d(1,1,1);
}

.tabs-style-circle nav a {
	overflow: visible;
	color: #003;
	font-weight: 700;
	font-size: 1.2 em;
	line-height: 1.1;
	-webkit-transition: color 0.3s cubic-bezier(0.7,0,0.3,1); 
	transition: color 0.3s cubic-bezier(0.7,0,0.3,1);
}

.tabs-style-circle nav a span {
	display: inline-block;
}

.tabs-style-circle nav a span,
.tabs-style-circle .icon::before {
	-webkit-transition: -webkit-transform 0.3s cubic-bezier(0.7,0,0.3,1);
	transition: transform 0.3s cubic-bezier(0.7,0,0.3,1);
}

.tabs-style-circle nav a:hover,
.tabs-style-circle nav a:focus {
	color: #003;
}

.tabs-style-circle nav li.tab-current a {
	color: #003;
}

.tabs-style-circle nav li.tab-current a span {
	-webkit-transform: translate3d(0,4px,0);
	transform: translate3d(0,4px,0);
}

.tabs-style-circle .icon::before {
	display: inline-block;
	margin: 0;
	pointer-events: none;
}

.tabs-style-circle nav li.tab-current .icon::before {
	-webkit-transform: translate3d(0,-4px,0);
	transform: translate3d(0,-4px,0);
}

/*****************************/
/* Shape */
/*****************************/

.tabs-style-shape {
	max-width: 1200px;
}

.tabs-style-shape nav ul li {
	margin: 0 3em;
}

.tabs-style-shape nav ul li:first-child {
	margin-left: 0;
}

.tabs-style-shape nav ul li.tab-current {
	z-index: 100;
}

.tabs-style-shape nav li a {
	overflow: visible;
	margin: 0 -3em 0 0;
	padding: 0;
	color: #fff;
	font-weight: 500;
}

.tabs-style-shape nav li:first-child a span {
	padding-left: 2em;
	border-radius: 30px 0 0 0;
}

.tabs-style-shape nav li:last-child a span {
	padding-right: 2em;
	border-radius: 0 30px 0 0;
}

.tabs-style-shape nav li a svg {
	position: absolute;
	left: 100%;
	margin: 0;
	width: 3em;
	height: 100%;
	fill: #bdc2c9;
}

.tabs-style-shape nav li a svg:nth-child(2),
.tabs-style-shape nav li:last-child a svg {
	right: 100%;
	left: auto;
	-webkit-transform: scale3d(-1,1,1);
	transform: scale3d(-1,1,1);
}

.tabs-style-shape nav li a span {
	display: block;
	overflow: hidden;
	padding: 0.65em 0;
	background-color: #bdc2c9;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.tabs-style-shape nav li a:hover span {
	background-color: #003;
}

.tabs-style-shape nav li a:hover svg {
	fill: #003;
}

/* Make only shape clickable */
.tabs-style-shape nav li a svg {
	pointer-events: none;
}

.tabs-style-shape nav li a svg use {
	pointer-events: auto;
}

.tabs-style-shape nav li.tab-current a span,
.tabs-style-shape nav li.tab-current a svg {
	-webkit-transition: none;
	transition: none;
}

.tabs-style-shape nav li.tab-current a span {
	background: #fff;
}

.tabs-style-shape nav li.tab-current a svg {
	fill: #fff;
}

.tabs-style-shape .content-wrap {
	background: #fff;
}

@media screen and (max-width: 58em) {
	.tabs-style-shape nav ul {
		display: block;
		padding-top: 1.5em;
	}
	.tabs-style-shape nav ul li {
		display: block;
		margin: -1.25em 0 0;
		-webkit-flex: none;
		flex: none;
	}
	.tabs-style-shape nav ul li a {
		margin: 0;
	}
	.tabs-style-shape nav ul li svg {
		display: none;
	}
	.tabs-style-shape nav ul li a span {
		padding: 1.25em 0 2em !important;
		border-radius: 30px 30px 0 0 !important;
		box-shadow: 0 -1px 2px rgba(0,0,0,0.1);
		line-height: 1;
	}
	.tabs-style-shape nav ul li:last-child a span {
		padding: 1.25em 0 !important;
	}
	.tabs-style-shape nav ul li.tab-current {
		z-index: 1;
	}
}

/*****************************/
/* Line Box */
/*****************************/

.tabs-style-linebox nav ul li {
	margin: 0 0.5em;
	-webkit-flex: none;
	flex: none;
}

.tabs-style-linebox nav a {
	padding: 0 1.5em;
	color: #74777b;
	font-weight: 700;
	-webkit-transition: color 0.3s;
	transition: color 0.3s;
}

.tabs-style-linebox nav a:hover,
.tabs-style-linebox nav a:focus {
	color: #003;
}

.tabs-style-linebox nav li.tab-current a {
	color: #fff;
}

.tabs-style-linebox nav a::after {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	background: #d2d8d6;
	content: '';
	-webkit-transition: background-color 0.3s, -webkit-transform 0.3s;
	transition: background-color 0.3s, transform 0.3s;
	-webkit-transition-timing-function: ease, cubic-bezier(0.7,0,0.3,1);
	transition-timing-function: ease, cubic-bezier(0.7,0,0.3,1);
	-webkit-transform: translate3d(0,100%,0) translate3d(0,-3px,0);
	transform: translate3d(0,100%,0) translate3d(0,-3px,0);
}

.tabs-style-linebox nav li.tab-current a::after {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

.tabs-style-linebox nav a:hover::after,
.tabs-style-linebox nav a:focus::after,
.tabs-style-linebox nav li.tab-current a::after {
	background: #003;
}

@media screen and (max-width: 58em) {
	.tabs-style-linebox nav ul {
		display: block;
		box-shadow: none;
	}
	.tabs-style-linebox nav ul li {
		display: block;
		-webkit-flex: none;
		flex: none;
	}
}

/*****************************/
/* Flip */
/*****************************/

.tabs-style-flip {
	max-width: 1200px;
}

.tabs-style-flip nav a {
	padding: 0.5em 0;
	color: #003;
	-webkit-transition: color 0.3s;
	transition: color 0.3s;
}

.tabs-style-flip nav a:hover,
.tabs-style-flip nav a:focus,
.tabs-style-flip nav li.tab-current a {
	color: #74777b;
}

.tabs-style-flip nav a span {
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
	font-size: 0.625em;
}

.tabs-style-flip nav a::after {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	background-color: #f0f0f0;
	content: '';
	-webkit-transition: -webkit-transform 0.3s, background-color 0.3s;
	transition: transform 0.3s, background-color 0.3s;
	-webkit-transform: perspective(900px) rotate3d(1,0,0,90deg);
	transform: perspective(900px) rotate3d(1,0,0,90deg);
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%;
	-webkit-perspective-origin: 50% 100%;
	perspective-origin: 50% 100%;
}

.tabs-style-flip nav li.tab-current a::after {
	background-color: #fff;
	-webkit-transform: perspective(900px) rotate3d(1,0,0,0deg);
	transform: perspective(900px) rotate3d(1,0,0,0deg);
}

.tabs-style-flip .content-wrap {
	background: #fff;
}


/*****************************/
/* Fill up */
/*****************************/

.tabs-style-fillup nav ul li a {
	padding: 1.9em 0;
	border-right: 1px solid #003;
	line-height: 1;
	-webkit-transition: color 0.3s;
	transition: color 0.3s;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.tabs-style-fillup nav ul li:last-child a {
	border: none;
}

.tabs-style-fillup nav ul li.tab-current {
	z-index: 100;
}

.tabs-style-fillup nav ul li.tab-current a {
	color: #fff;
}

.tabs-style-fillup nav ul li a::after {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	height: calc(100% + 1px);
	border: 1px solid #003;
	background: #003;
	content: '';
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transform: translate3d(0,100%,0);
	transform: translate3d(0,100%,0);
}

.tabs-style-fillup nav ul li.tab-current a::after {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

.tabs-style-fillup nav ul li a span,
.tabs-style-fillup .icon::before {
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
	-webkit-transform: translate3d(0,5px,0);
	transform: translate3d(0,5px,0);
}

.tabs-style-fillup nav ul li a span {
	display: block;
	font-weight: 700;
	font-size: 0.7em;
	line-height: 1.5;
}

.tabs-style-fillup .icon::before {
	display: block;
	margin: 0;
}

.tabs-style-fillup nav ul li.tab-current a span,
.tabs-style-fillup li.tab-current .icon::before {
	-webkit-transform: translate3d(0,-10px,0);
	transform: translate3d(0,-10px,0);
}


/*****************************/
/* Trapezoid, based on http://lea.verou.me/2013/10/slanted-tabs-with-css-3d-transforms/ */
/*****************************/ 

.tabs-style-tzoid {
	max-width: 1200px;
}

.tabs-style-tzoid nav {
	padding: 0 1em;
}

.tabs-style-tzoid nav ul li {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.tabs-style-tzoid nav ul li a {
	padding: 0 1.5em 0 0.3em;
	color: #0d9564;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}

@media screen and (max-width: 54em) {
	.tabs-style-tzoid nav ul li a {
		padding: 0 0.5em 0 0.3em;
	}
}

.tabs-style-tzoid nav ul li a:hover,
.tabs-style-tzoid nav ul li a:focus {
	color: #fff;
}

.tabs-style-tzoid nav ul li.tab-current a,
.tabs-style-tzoid nav ul li.tab-current a:hover {
	color: #003;
}

.tabs-style-tzoid nav ul li a span {
	font-weight: 500;
	font-size: 0.75em;
}

.tabs-style-tzoid nav ul li a::after {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	outline: 1px solid transparent;
	border-radius: 10px 10px 0 0;
	background: #003;
	box-shadow: inset 0 -3px 3px rgba(0,0,0,0.05);
	content: '';
	-webkit-transform: perspective(5px) rotateX(0.93deg) translateZ(-1px);
	transform: perspective(5px) rotateX(0.93deg) translateZ(-1px);
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.tabs-style-tzoid nav ul li.tab-current a::after,
.tabs-style-tzoid .content-wrap {
	background: #fff;
	box-shadow: none;
}


.video-container {
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;
}

.video-container iframe, .video-container object, .video-container embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}


 .google-maps {
        position: relative;
        padding-bottom: 75%; 
        height: 0;
        overflow: hidden;
    }
    .google-maps iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important;
    }
	
	.cbutton {
	position: relative;
	display: inline-block;
	margin: 0.3em;
	padding: 0;
	border: none;
	background: none;
	color: #fff;
	font-size: 0.8em; font-family: 'calibre-bold', Helvetica, sans-serif;
	overflow: visible;
	-webkit-transition: color 0.7s;
	transition: color 0.7s;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.cbutton.cbutton--click,
.cbutton:focus {
	outline: none;
	color: #AC0404;
}

.cbutton__icon {
	display: block;
}

.cbutton__text {
	position: absolute; 
	opacity: 0; 
	pointer-events: none;
}

.cbutton::after {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -35px 0 0 -35px;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	content: '';
	opacity: 0;
	pointer-events: none;
}

.cbutton--box {
	width: 24px;
	height: 24px;
	border: 4px solid rgb(22, 35, 47);
}

.cbutton--box-color-1 {
	background: #ff8b00;
}

.cbutton--box-color-2 {
	background: #b61854;
}

.cbutton--box-color-3 {
	background: #1d5cab;
}

.cbutton--box-color-4 {
	background: #f2438c;
}

.cbutton--box-color-5 {
	background: #ff6414;
}

.cbutton--box-color-6 {
	background: #5ed500;
}

.cbutton--box-color-7 {
	background: #0077ff;
}

.cbutton--box-color-8 {
	background: #7bff00;
}

.cbutton--box-color-9 {
	background: #fff;
}

/* Individual Effects */

/* Effect Boris */
.cbutton--effect-boris::after {
	background: rgba(111,148,182,0.1);
}

.cbutton--effect-boris.cbutton--click::after {
	-webkit-animation: anim-effect-boris 0.3s forwards;
	animation: anim-effect-boris 0.3s forwards;
}

@-webkit-keyframes anim-effect-boris {
	0% {
		-webkit-transform: scale3d(0.3, 0.3, 1);
		transform: scale3d(0.3, 0.3, 1);
	}
	25%, 50% {
		opacity: 1;
	}
	to {
		opacity: 0;
		-webkit-transform: scale3d(1.2, 1.2, 1);
		transform: scale3d(1.2, 1.2, 1);
	}
}

@keyframes anim-effect-boris {
	0% {
		-webkit-transform: scale3d(0.3, 0.3, 1);
		transform: scale3d(0.3, 0.3, 1);
	}
	25%, 50% {
		opacity: 1;
	}
	to {
		opacity: 0;
		-webkit-transform: scale3d(1.2, 1.2, 1);
		transform: scale3d(1.2, 1.2, 1);
	}
}

/* Jelena */
.cbutton--effect-jelena::after {
	border: 2px solid rgba(111,148,182,0.5);
}

.cbutton--effect-jelena.cbutton--click::after {
	-webkit-animation: anim-effect-jelena 0.3s ease-out forwards;
	animation: anim-effect-jelena 0.3s ease-out forwards;
}

@-webkit-keyframes anim-effect-jelena {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.5, 0.5, 1);
		transform: scale3d(0.5, 0.5, 1);
	}
	to {
		opacity: 0;
		-webkit-transform: scale3d(1.2, 1.2, 1);
		transform: scale3d(1.2, 1.2, 1);
	}
}

@keyframes anim-effect-jelena {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.5, 0.5, 1);
		transform: scale3d(0.5, 0.5, 1);
	}
	to {
		opacity: 0;
		-webkit-transform: scale3d(1.2, 1.2, 1);
		transform: scale3d(1.2, 1.2, 1);
	}
}

/* Radomir */
.cbutton--effect-radomir::after {
	box-shadow: inset 0 0 0 35px rgba(111,148,182,0);
}

.cbutton--effect-radomir.cbutton--click::after {
	-webkit-animation: anim-effect-radomir 0.5s ease-out forwards;
	animation: anim-effect-radomir 0.5s ease-out forwards;
}

@-webkit-keyframes anim-effect-radomir {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.4, 0.4, 1);
		transform: scale3d(0.4, 0.4, 1);
	}
	80% {
		box-shadow: inset 0 0 0 2px rgba(111,148,182,0.8);
		opacity: 0.1;
	}
	100% {
		box-shadow: inset 0 0 0 2px rgba(111,148,182,0.8);
		opacity: 0;
		-webkit-transform: scale3d(1.2, 1.2, 1);
		transform: scale3d(1.2, 1.2, 1);
	}
}

@keyframes anim-effect-radomir {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.4, 0.4, 1);
		transform: scale3d(0.4, 0.4, 1);
	}
	80% {
		box-shadow: inset 0 0 0 2px rgba(111,148,182,0.8);
		opacity: 0.1;
	}
	100% {
		box-shadow: inset 0 0 0 2px rgba(111,148,182,0.8);
		opacity: 0;
		-webkit-transform: scale3d(1.2, 1.2, 1);
		transform: scale3d(1.2, 1.2, 1);
	}
}

/* Sanja */
.cbutton--effect-sanja::after {
	background: rgba(111,148,182,0.1);
}

.cbutton--effect-sanja.cbutton--click::after {
	-webkit-animation: anim-effect-sanja 1s ease-out forwards;
	animation: anim-effect-sanja 1s ease-out forwards;
}

@-webkit-keyframes anim-effect-sanja {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.5, 0.5, 1);
		transform: scale3d(0.5, 0.5, 1);
	}
	25% {
		opacity: 1;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

@keyframes anim-effect-sanja {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.5, 0.5, 1);
		transform: scale3d(0.5, 0.5, 1);
	}
	25% {
		opacity: 1;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

/* Novak */
.cbutton--effect-novak::after {
	background: rgba(111,148,182,0.25);
}

.cbutton--effect-novak.cbutton--click::after {
	-webkit-animation: anim-effect-novak 0.5s forwards;
	animation: anim-effect-novak 0.5s forwards;
}

@-webkit-keyframes anim-effect-novak {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.1, 0.1, 1);
		transform: scale3d(0.1, 0.1, 1);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(8, 8, 1);
		transform: scale3d(8, 8, 1);
	}
}

@keyframes anim-effect-novak {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.1, 0.1, 1);
		transform: scale3d(0.1, 0.1, 1);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(8, 8, 1);
		transform: scale3d(8, 8, 1);
	}
}

/* Ilinka */
.cbutton--effect-ilinka::after {
	background: rgba(111,148,182,0.25);
}

.cbutton--effect-ilinka.cbutton--click::after {
	-webkit-animation: anim-effect-ilinka 0.5s ease-out forwards;
	animation: anim-effect-ilinka 0.5s ease-out forwards;
}

@-webkit-keyframes anim-effect-ilinka {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

@keyframes anim-effect-ilinka {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

/* Marin */
.cbutton--effect-marin::after {
	box-shadow: inset 0 0 0 3px rgba(111,148,182,0.05);
}

.cbutton--effect-marin.cbutton--click::after {
	-webkit-animation: anim-effect-marin 0.5s ease-out forwards;
	animation: anim-effect-marin 0.5s ease-out forwards;
}

@-webkit-keyframes anim-effect-marin {
	0% {
		opacity: 1;
	}
	100% {
		box-shadow: inset 0 0 0 3px rgba(111,148,182,0.8);
		opacity: 0;
		-webkit-transform: scale3d(0.75, 0.75, 1);
		transform: scale3d(0.75, 0.75, 1);
	}
}

@keyframes anim-effect-marin {
	0% {
		opacity: 1;
	}
	100% {
		box-shadow: inset 0 0 0 3px rgba(111,148,182,0.8);
		opacity: 0;
		-webkit-transform: scale3d(0.75, 0.75, 1);
		transform: scale3d(0.75, 0.75, 1);
	}
}

/* Nikola */
.cbutton--effect-nikola::after {
	background: rgba(0,0,0,0.7);
}

.cbutton--effect-nikola.cbutton--click::after {
	-webkit-animation: anim-effect-nikola 0.5s forwards;
	animation: anim-effect-nikola 0.5s forwards;
}

@-webkit-keyframes anim-effect-nikola {
	0% {
		opacity: 0;
		-webkit-transform: scale3d(0.2, 0.2, 1);
		transform: scale3d(0.2, 0.2, 1);
	}
	50% {
		opacity: 1;
		-webkit-transform: scale3d(1.2, 1.2, 1);
		transform: scale3d(1.2, 1.2, 1);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(0.8, 0.8, 1);
		transform: scale3d(0.8, 0.8, 1);
	}
}

@keyframes anim-effect-nikola {
	0% {
		opacity: 0;
		-webkit-transform: scale3d(0.2, 0.2, 1);
		transform: scale3d(0.2, 0.2, 1);
	}
	50% {
		opacity: 1;
		-webkit-transform: scale3d(1.2, 1.2, 1);
		transform: scale3d(1.2, 1.2, 1);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(0.8, 0.8, 1);
		transform: scale3d(0.8, 0.8, 1);
	}
}

/* Tamara */
.cbutton--effect-tamara::after {
	box-shadow: 0 0 0 3px rgba(111,148,182,0.05);
}

.cbutton--effect-tamara.cbutton--click::after {
	-webkit-animation: anim-effect-tamara 0.5s ease-out forwards;
	animation: anim-effect-tamara 0.5s ease-out forwards;
}

@-webkit-keyframes anim-effect-tamara {
	0% {
		box-shadow: 0 0 0 3px rgba(111,148,182,0.3);
		opacity: 1;
		-webkit-transform: scale3d(0.6, 0.6, 1);
		transform: scale3d(0.6, 0.6, 1);
	}
	100% {
		box-shadow: 0 0 0 100px rgba(111,148,182,0);
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

@keyframes anim-effect-tamara {
	0% {
		box-shadow: 0 0 0 3px rgba(111,148,182,0.3);
		opacity: 1;
		-webkit-transform: scale3d(0.6, 0.6, 1);
		transform: scale3d(0.6, 0.6, 1);
	}
	100% {
		box-shadow: 0 0 0 100px rgba(111,148,182,0);
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

/* Zoran */
.cbutton--effect-zoran::after {
	background: rgba(111,148,182,0.1);
}

.cbutton--effect-zoran.cbutton--click::after {
	-webkit-animation: anim-effect-zoran 0.5s ease-out forwards;
	animation: anim-effect-zoran 0.5s ease-out forwards;
}

@-webkit-keyframes anim-effect-zoran {
	0% {
		opacity: 0.2;
	}
	50% {
		opacity: 1;
		-webkit-transform: scale3d(0.6, 1, 1);
		transform: scale3d(0.6, 1, 1);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}
	100% {
		opacity: 0.3;
		-webkit-transform: scale3d(1.1, 1.1, 1);
		transform: scale3d(1.1, 1.1, 1);
	}
}

@keyframes anim-effect-zoran {
	0% {
		opacity: 0.2;
	}
	50% {
		opacity: 1;
		-webkit-transform: scale3d(0.6, 1, 1);
		transform: scale3d(0.6, 1, 1);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}
	100% {
		opacity: 0.3;
		-webkit-transform: scale3d(1.1, 1.1, 1);
		transform: scale3d(1.1, 1.1, 1);
	}
}

/* Ivana */
.cbutton--effect-ivana::before {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -35px 0 0 -35px;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	content: '';
	opacity: 0;
	pointer-events: none;
}

.cbutton--effect-ivana::before,
.cbutton--effect-ivana::after {
	box-shadow: 0 0 0 2px rgba(111,148,182,0.5);
}

.cbutton--effect-ivana.cbutton--click::before {
	-webkit-animation: anim-effect-ivana-1 0.5s forwards;
	animation: anim-effect-ivana-1 0.5s forwards;
}

.cbutton--effect-ivana.cbutton--click::after {
	-webkit-animation: anim-effect-ivana-2 0.5s forwards;
	animation: anim-effect-ivana-2 0.5s forwards;
}

@-webkit-keyframes anim-effect-ivana-1 {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.5, 0.5, 1);
		transform: scale3d(0.5, 0.5, 1);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(1.1, 1.1, 1);
		transform: scale3d(1.1, 1.1, 1);
	}
}

@keyframes anim-effect-ivana-1 {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.5, 0.5, 1);
		transform: scale3d(0.5, 0.5, 1);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(1.1, 1.1, 1);
		transform: scale3d(1.1, 1.1, 1);
	}
}

@-webkit-keyframes anim-effect-ivana-2 {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.5, 0.5, 1);
		transform: scale3d(0.5, 0.5, 1);
	}
	50%, 100% {
		opacity: 0;
		-webkit-transform: scale3d(1.2, 1.2, 1);
		transform: scale3d(1.2, 1.2, 1);
	}
}

@keyframes anim-effect-ivana-2 {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.5, 0.5, 1);
		transform: scale3d(0.5, 0.5, 1);
	}
	50%, 100% {
		opacity: 0;
		-webkit-transform: scale3d(1.2, 1.2, 1);
		transform: scale3d(1.2, 1.2, 1);
	}
}

/* Marko */
.cbutton--effect-marko::after {
	box-shadow: inset 0 0 0 2px rgba(111,148,182,0.3);
}

.cbutton--effect-marko.cbutton--click::after {
	-webkit-animation: anim-effect-marko 0.5s forwards;
	animation: anim-effect-marko 0.5s forwards;
}

@-webkit-keyframes anim-effect-marko {
	0% {
		opacity: 1;
	}
	50% {
		box-shadow: inset 0 0 0 35px rgba(111,148,182,0.1);
		opacity: 1;
	}
	100% {
		box-shadow: inset 0 0 0 35px rgba(111,148,182,0.1);
		opacity: 0;
		-webkit-transform: scale3d(1.1, 1.1, 1);
		transform: scale3d(1.1, 1.1, 1);
	}
}

@keyframes anim-effect-marko {
	0% {
		opacity: 1;
	}
	50% {
		box-shadow: inset 0 0 0 35px rgba(111,148,182,0.1);
		opacity: 1;
	}
	100% {
		box-shadow: inset 0 0 0 35px rgba(111,148,182,0.1);
		opacity: 0;
		-webkit-transform: scale3d(1.1, 1.1, 1);
		transform: scale3d(1.1, 1.1, 1);
	}
}

/* Stoja */
.cbutton--effect-stoja::before {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -35px 0 0 -35px;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	content: '';
	opacity: 0;
	pointer-events: none;
}

.cbutton--effect-stoja::before,
.cbutton--effect-stoja::after {
	box-shadow: 0 0 0 2px rgba(111,148,182,0.5);
}

.cbutton--effect-stoja-left::before,
.cbutton--effect-stoja-left::after {
	-webkit-clip-path: polygon(0% 0%, 50% 0%, 50% 50%, 0% 50%);
	clip-path: polygon(0% 0%, 50% 0%, 50% 50%, 0% 50%);
}

.cbutton--effect-stoja-top::before,
.cbutton--effect-stoja-top::after {
	-webkit-clip-path: polygon(10% 0%, 90% 0%, 50% 50%);
	clip-path: polygon(25% 0%, 75% 0%, 50% 50%);
}

.cbutton--effect-stoja-right::before,
.cbutton--effect-stoja-right::after {
	-webkit-clip-path: polygon(50% 0%, 100% 0%, 100% 50%, 50% 50%);
	clip-path: polygon(50% 0%, 100% 0%, 100% 50%, 50% 50%);
}

.cbutton--effect-stoja.cbutton--click::before {
	-webkit-animation: anim-effect-stoja-1 0.5s forwards;
	animation: anim-effect-stoja-1 0.5s forwards;
}

.cbutton--effect-stoja.cbutton--click::after {
	-webkit-animation: anim-effect-stoja-2 0.5s forwards;
	animation: anim-effect-stoja-2 0.5s forwards;
}

@-webkit-keyframes anim-effect-stoja-1 {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.3, 0.3, 1);
		transform: scale3d(0.3, 0.3, 1);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

@keyframes anim-effect-stoja-1 {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.3, 0.3, 1);
		transform: scale3d(0.3, 0.3, 1);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

@-webkit-keyframes anim-effect-stoja-2 {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.5, 0.5, 1);
		transform: scale3d(0.5, 0.5, 1);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(1.5, 1.5, 1);
		transform: scale3d(1.5, 1.5, 1);
	}
}

@keyframes anim-effect-stoja-2 {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.5, 0.5, 1);
		transform: scale3d(0.5, 0.5, 1);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(1.5, 1.5, 1);
		transform: scale3d(1.5, 1.5, 1);
	}
}

/* Azra */
.cbutton--effect-azra img {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -35px 0 0 -35px;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	opacity: 0;
	pointer-events: none;
}

.cbutton--effect-azra.cbutton--click img {
	-webkit-animation: anim-effect-azra 0.5s ease-in forwards;
	animation: anim-effect-azra 0.5s ease-in forwards;
}

@-webkit-keyframes anim-effect-azra {
	0% {
		opacity: 0;
		-webkit-transform: scale3d(0.2, 0.2, 1) translate3d(0, 100%, 0);
		transform: scale3d(0.2, 0.2, 1) translate3d(0, 100%, 0);
	}
	50% {
		opacity: 0.7;
		-webkit-transform: scale3d(0.5, 0.5, 1) translate3d(0, 100%, 0);
		transform: scale3d(0.5, 0.5, 1) translate3d(0, 100%, 0);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(0.5, 0.5, 1) translate3d(0, 200%, 0);
		transform: scale3d(0.5, 0.5, 1) translate3d(0, 200%, 0);
	}
}

@keyframes anim-effect-azra {
	0% {
		opacity: 0.5;
		-webkit-transform: scale3d(0.2, 0.2, 1) translate3d(0, 100%, 0);
		transform: scale3d(0.2, 0.2, 1) translate3d(0, 100%, 0);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(0.5, 0.5, 1) translate3d(0, 200%, 0);
		transform: scale3d(0.5, 0.5, 1) translate3d(0, 200%, 0);
	}
}

/* Dejan */

.cbutton--effect-dejan::after {
	margin: -4px 0 0 -4px;
	width: 8px;
	height: 8px;
}

.cbutton--box-color-4.cbutton--effect-dejan::after {
	background: #f2438c;
}

.cbutton--box-color-5.cbutton--effect-dejan::after {
	background: #ff6414;
}

.cbutton--box-color-6.cbutton--effect-dejan::after {
	background: #5ed500;
}

.cbutton--effect-dejan .cbutton__helper {
	position: absolute;
	bottom: 0;
	opacity: 0;
	pointer-events: none;
}

.cbutton--effect-dejan .cbutton__helper--first {
	left: -15px;
	width: 30px;
	height: 30px;
	-webkit-transform-origin: -40% 50%;
	transform-origin: -40% 50%;
}

.cbutton--effect-dejan .cbutton__helper--second {
	left: 0px;
	width: 30px;
	height: 60px;
	-webkit-transform-origin: 140% 50%;
	transform-origin: 140% 50%;
}

.cbutton--effect-dejan .cbutton__helper img {
	position: absolute;
	top: 0;
	left: 0;
}

.cbutton--effect-dejan.cbutton--click .cbutton__helper--first {
	-webkit-animation: anim-effect-dejan-1 0.3s ease-out forwards;
	animation: anim-effect-dejan-1 0.3s ease-out forwards;
}

.cbutton--effect-dejan.cbutton--click .cbutton__helper--second {
	-webkit-animation: anim-effect-dejan-2 0.3s ease-out forwards;
	animation: anim-effect-dejan-2 0.3s ease-out forwards;
}

.cbutton--effect-dejan.cbutton--click .cbutton__helper--first img,
.cbutton--effect-dejan.cbutton--click .cbutton__helper--second img {
	-webkit-animation: anim-effect-dejan-3 0.3s ease-in forwards;
	animation: anim-effect-dejan-3 0.3s ease-in forwards;
}

.cbutton--effect-dejan.cbutton--click::after {
	-webkit-animation: anim-effect-dejan-4 0.3s ease-out forwards;
	animation: anim-effect-dejan-4 0.3s ease-out forwards;
}

@-webkit-keyframes anim-effect-dejan-1 {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
		-webkit-transform: rotate3d(0, 0, 1, -90deg);
		transform: rotate3d(0, 0, 1, -90deg);
	}
}

@keyframes anim-effect-dejan-1 {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
		-webkit-transform: rotate3d(0, 0, 1, -90deg);
		transform: rotate3d(0, 0, 1, -90deg);
	}
}

@-webkit-keyframes anim-effect-dejan-2 {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
		-webkit-transform: rotate3d(0, 0, 1, 90deg);
		transform: rotate3d(0, 0, 1, 90deg);
	}
}

@keyframes anim-effect-dejan-2 {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
		-webkit-transform: rotate3d(0, 0, 1, 90deg);
		transform: rotate3d(0, 0, 1, 90deg);
	}
}

@-webkit-keyframes anim-effect-dejan-3 {
	0% {
		-webkit-transform: scale3d(0.4, 0.4, 1);
		transform: scale3d(0.4, 0.4, 1);
	}
	50% {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	100% {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

@keyframes anim-effect-dejan-3 {
	0% {
		-webkit-transform: scale3d(0.4, 0.4, 1);
		transform: scale3d(0.4, 0.4, 1);
	}
	50% {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	100% {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

@-webkit-keyframes anim-effect-dejan-4 {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.1, 0.1, 1);
		transform: scale3d(0.1, 0.1, 1);
	}
	80% {
		opacity: 0.7;
		-webkit-transform: translate3d(0, -70px, 0) scale3d(1, 1, 1);
		transform: translate3d(0, -70px, 0) scale3d(1, 1, 1);
	}
	100% {
		opacity: 0;
		-webkit-transform: translate3d(0, -60px, 0) scale3d(1, 1, 1);
		transform: translate3d(0, -60px, 0) scale3d(1, 1, 1);
	}
}

@keyframes anim-effect-dejan-4 {
	0% {
		opacity: 1;
		-webkit-transform: scale3d(0.1, 0.1, 1);
		transform: scale3d(0.1, 0.1, 1);
	}
	80% {
		opacity: 0.7;
		-webkit-transform: translate3d(0, -70px, 0) scale3d(1, 1, 1);
		transform: translate3d(0, -70px, 0) scale3d(1, 1, 1);
	}
	100% {
		opacity: 0;
		-webkit-transform: translate3d(0, -60px, 0) scale3d(1, 1, 1);
		transform: translate3d(0, -60px, 0) scale3d(1, 1, 1);
	}
}

/* Filipa */
.cbutton--effect-filipa::after {
	border-radius: 0px;
	box-shadow: 0 0 0 2px rgba(111,148,182,0.9);
}

.cbutton--effect-filipa.cbutton--effect-filipa-left.cbutton--click::after {
	-webkit-animation: anim-effect-filipa-left 0.5s forwards;
	animation: anim-effect-filipa-left 0.5s forwards;
}

@-webkit-keyframes anim-effect-filipa-left {
	0% {
		opacity: 0.7;
		-webkit-transform: scale3d(0.2, 0.2, 1);
		transform: scale3d(0.2, 0.2, 1) 
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -135deg);
		transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -135deg);
	}
}

@keyframes anim-effect-filipa-left {
	0% {
		opacity: 0.7;
		-webkit-transform: scale3d(0.2, 0.2, 1);
		transform: scale3d(0.2, 0.2, 1) 
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -135deg);
		transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -135deg);
	}
}

.cbutton--effect-filipa.cbutton--effect-filipa-right.cbutton--click::after {
	-webkit-animation: anim-effect-filipa-right 0.5s forwards;
	animation: anim-effect-filipa-right 0.5s forwards;
}

@-webkit-keyframes anim-effect-filipa-right {
	0% {
		opacity: 0.7;
		-webkit-transform: scale3d(0.2, 0.2, 1);
		transform: scale3d(0.2, 0.2, 1) 
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 135deg);
		transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 135deg);
	}
}

@keyframes anim-effect-filipa-right {
	0% {
		opacity: 0.7;
		-webkit-transform: scale3d(0.2, 0.2, 1);
		transform: scale3d(0.2, 0.2, 1) 
	}
	100% {
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 135deg);
		transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 135deg);
	}
}

/* Lazar */
.cbutton--effect-lazar-inverted {
	-webkit-transform: scale3d(-1, 1, 1);
	transform: scale3d(-1, 1, 1);
}
.cbutton--effect-lazar::before {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -35px 0 0 0;
	width: 35px;
	height: 70px;
    border-radius: 0 35px 35px 0;
	background: rgba(111,148,182,0.15);
	content: '';
	opacity: 0;
	-webkit-transform-origin: 0 50%;
	transform-origin: 0 50%;
	pointer-events: none;
}

.cbutton--effect-lazar::after {
	right: 50%;
	left: auto;
	margin: -35px 0 0 0;
	width: 35px;
	height: 70px;
	border-radius: 35px 0 0 35px;
	background: rgba(111,148,182,0.1);
	-webkit-transform-origin: 100% 50%;
	transform-origin: 100% 50%;
}

.cbutton--effect-lazar.cbutton--click::before {
	-webkit-animation: anim-effect-lazar-1 0.8s ease-out forwards;
	animation: anim-effect-lazar-1 0.8s ease-out forwards;
}

.cbutton--effect-lazar.cbutton--click::after {
	-webkit-animation: anim-effect-lazar-2 0.8s ease-out forwards;
	animation: anim-effect-lazar-2 0.8s ease-out forwards;
}

@-webkit-keyframes anim-effect-lazar-1 {
	0%, 25% {
		opacity: 1;
		-webkit-transform: perspective(1000px) rotate3d(0, 1, 0, 0deg);
		transform: perspective(1000px) rotate3d(0, 1, 0, 0deg);
	}
	100% {
		opacity: 0;
		-webkit-transform: perspective(1000px) rotate3d(0, 1, 0, 180deg);
		transform: perspective(1000px) rotate3d(0, 1, 0, 180deg);
	}
}

@keyframes anim-effect-lazar-1 {
	0%, 25% {
		opacity: 1;
	}
	100% {
		opacity: 0;
		-webkit-transform: perspective(1000px) rotate3d(0, 1, 0, 180deg);
		transform: perspective(1000px) rotate3d(0, 1, 0, 180deg);
	}
}

@-webkit-keyframes anim-effect-lazar-2 {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

@keyframes anim-effect-lazar-2 {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

/* Jagoda */
.cbutton--effect-jagoda::before {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -25px 0 0 -25px;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	content: '';
	opacity: 0;
	pointer-events: none;
}

.cbutton--effect-jagoda::after {
	margin: -25px 0 0 -25px;
	width: 50px;
	height: 50px;
}

.cbutton--effect-jagoda::before,
.cbutton--effect-jagoda::after {
	box-shadow: 0 0 0 2px rgba(111,148,182,0.5);
}

.cbutton--effect-jagoda.cbutton--click::before,
.cbutton--effect-jagoda.cbutton--click::after {
	-webkit-animation-name: anim-effect-jagoda-2, anim-effect-jagoda-1;
	animation-name:anim-effect-jagoda-2, anim-effect-jagoda-1;
	-webkit-animation-duration: 1.2s;
	animation-duration: 1.2s;
	-webkit-animation-iteration-count: 5;
	animation-iteration-count: 5;
	-webkit-animation-timing-function: ease-out;
	animation-timing-function: ease-out;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}

.cbutton--effect-jagoda.cbutton--click::after {
	-webkit-animation-delay: 0.6s;
	animation-delay: 0.6s;
}

@-webkit-keyframes anim-effect-jagoda-1 {
	0%, 100% {
		opacity: 0;
	}
	40%, 60% {
		opacity: 1;
	}
}

@keyframes anim-effect-jagoda-1 {
	0%, 100% {
		opacity: 0;
	}
	40%, 60% {
		opacity: 1;
	}
}

@-webkit-keyframes anim-effect-jagoda-2 {
	0% {
		-webkit-transform: scale3d(0.5, 0.5, 1);
		transform: scale3d(0.5, 0.5, 1);
	}
	100% {
		-webkit-transform: scale3d(1.4, 1.4, 1);
		transform: scale3d(1.4, 1.4, 1);
	}
}

@keyframes anim-effect-jagoda-2 {
	0% {
		-webkit-transform: scale3d(0.5, 0.5, 1);
		transform: scale3d(0.5, 0.5, 1);
	}
	100% {
		-webkit-transform: scale3d(1.4, 1.4, 1);
		transform: scale3d(1.4, 1.4, 1);
	}
}

/* Simo */
.cbutton--effect-simo::before {
	position: absolute;
	top: 50%;
	left: -20px;
	margin: -4px 0 0 0;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: rgba(111,148,182,0.3);
	content: '';
	opacity: 0;
	-webkit-transform-origin: 35px 50%;
	transform-origin: 35px 50%;
}

.cbutton--effect-simo::after {
	border: 8px solid rgba(111,148,182,0.1);
}

.cbutton--effect-simo.cbutton--click::after {
	-webkit-animation: anim-effect-simo-1 5s forwards;
	animation: anim-effect-simo-1 5s forwards;
}

.cbutton--effect-simo.cbutton--click::before {
	-webkit-animation-name: anim-effect-simo-2, anim-effect-simo-3;
	animation-name: anim-effect-simo-2, anim-effect-simo-3;
	-webkit-animation-duration: 5s, 0.4s;
	animation-duration: 5s, 0.4s;
	-webkit-animation-iteration-count: 1, infinite;
	animation-iteration-count: 1, infinite;
	-webkit-animation-timing-function: ease, linear;
	animation-timing-function: ease, linear;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}

@-webkit-keyframes anim-effect-simo-1 {
	0%, 100% {
		-webkit-transform: scale3d(0, 0, 1);
		transform: scale3d(0, 0, 1);
		opacity: 0;
	}
	5%, 95% {
		opacity: 1;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

@keyframes anim-effect-simo-1 {
	0%, 100% {
		-webkit-transform: scale3d(0, 0, 1);
		transform: scale3d(0, 0, 1);
		opacity: 0;
	}
	5%, 95% {
		opacity: 1;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

@-webkit-keyframes anim-effect-simo-2 {
	0%, 5%, 95%, 100% {
		opacity: 0;
	}
	10%, 90% {
		opacity: 1;
	}
}

@keyframes anim-effect-simo-2 {
	0%, 5%, 95%, 100% {
		opacity: 0;
	}
	10%, 90% {
		opacity: 1;
	}
}

@-webkit-keyframes anim-effect-simo-3 {
	100% {
		-webkit-transform: rotate3d(0, 0, 1, 360deg);
		transform: rotate3d(0, 0, 1, 360deg);
	}
}

@keyframes anim-effect-simo-3 {
	100% {
		-webkit-transform: rotate3d(0, 0, 1, 360deg);
		transform: rotate3d(0, 0, 1, 360deg);
	}
}

/* Milan */
.cbutton--effect-milan::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -35px 0 0 -35px;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	opacity: 0;
	pointer-events: none;
}

.cbutton--effect-milan::after,
.cbutton--effect-milan::before {
	border: 4px solid rgba(111,148,182,0.1);
}

.cbutton--effect-milan.cbutton--click::after {
	-webkit-animation-name: anim-effect-milan-3, anim-effect-milan-1;
	animation-name: anim-effect-milan-3, anim-effect-milan-1;
	-webkit-animation-duration: 5s, 2s;
	animation-duration: 5s, 2s;
	-webkit-animation-iteration-count: 1, infinite;
	animation-iteration-count: 1, infinite;
	-webkit-animation-timing-function: ease, linear;
	animation-timing-function: ease, linear;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}

.cbutton--effect-milan.cbutton--click::before {
	-webkit-animation-name: anim-effect-milan-3, anim-effect-milan-2;
	animation-name: anim-effect-milan-3, anim-effect-milan-2;
	-webkit-animation-duration: 5s, 2s;
	animation-duration: 5s, 2s;
	-webkit-animation-iteration-count: 1, infinite;
	animation-iteration-count: 1, infinite;
	-webkit-animation-timing-function: ease, linear;
	animation-timing-function: ease, linear;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}

@-webkit-keyframes anim-effect-milan-1 {
	0% {
		-webkit-transform: perspective(1000px) rotate3d(1, 1, 1, 0deg);
		transform: perspective(1000px) rotate3d(1, 1, 1, 0deg);
	}
	100% {
		-webkit-transform: perspective(1000px) rotate3d(1, 1, 1, 360deg);
		transform: perspective(1000px) rotate3d(1, 1, 1, 360deg);
	}
}

@keyframes anim-effect-milan-1 {
	0% {
		-webkit-transform: perspective(1000px) rotate3d(1, 1, 1, 0deg);
		transform: perspective(1000px) rotate3d(1, 1, 1, 0deg);
	}
	100% {
		-webkit-transform: perspective(1000px) rotate3d(1, 1, 1, 360deg);
		transform: perspective(1000px) rotate3d(1, 1, 1, 360deg);
	}
}

@-webkit-keyframes anim-effect-milan-2 {
	0% {
		-webkit-transform: perspective(1000px) rotate3d(-1, -1, -1, 0deg);
		transform: perspective(1000px) rotate3d(-1, -1, -1, 0deg);
	}
	100% {
		-webkit-transform: perspective(1000px) rotate3d(-1, -1, -1, 360deg);
		transform: perspective(1000px) rotate3d(-1, -1, -1, 360deg);
	}
}

@keyframes anim-effect-milan-2 {
	0% {
		-webkit-transform: perspective(1000px) rotate3d(1, -1, 1, 0deg);
		transform: perspective(1000px) rotate3d(1, -1, 1, 0deg);
	}
	100% {
		-webkit-transform: perspective(1000px) rotate3d(1, -1, 1, 360deg);
		transform: perspective(1000px) rotate3d(1, -1, 1, 360deg);
	}
}

@-webkit-keyframes anim-effect-milan-3 {
	0%, 100% {
		opacity: 0;
	}
	25%, 75% {
		opacity: 1;
	}
}

@keyframes anim-effect-milan-3 {
	0%, 100% {
		opacity: 0;
	}
	25%, 75% {
		opacity: 1;
	}
}

/* Zorka */
.cbutton--effect-zorka .cbutton__helper {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -35px 0 0 -100px;
	width: 200px;
	height: 70px;
	opacity: 0;
	-webkit-filter: url(../index.html#lb-goo-filter);
	filter: url(../index.html#lb-goo-filter);
	pointer-events: none;
}

.cbutton--effect-zorka .cbutton__helper::before,
.cbutton--effect-zorka .cbutton__helper::after {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -28px 0 0 -28px;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: rgb(111,148,182);
	content: '';
}

.cbutton--effect-zorka.cbutton--click .cbutton__helper {
	-webkit-animation: anim-effect-zorka-1 0.7s ease-out;
	animation: anim-effect-zorka-1 0.7s ease-out;
}

.cbutton--effect-zorka.cbutton--click .cbutton__helper::before {
	-webkit-animation: anim-effect-zorka-2 0.7s ease-out forwards;
	animation: anim-effect-zorka-2 0.7s ease-out forwards;
}

.cbutton--effect-zorka.cbutton--click .cbutton__helper::after {
	-webkit-animation: anim-effect-zorka-3 0.7s ease-out forwards;
	animation: anim-effect-zorka-3 0.7s ease-out forwards;
}

@-webkit-keyframes anim-effect-zorka-1 {
	0% {
		opacity: 0.1;
	}
	50% {
		opacity: 0.175;
	}
	100% {
		opacity: 0;
	}
}

@keyframes anim-effect-zorka-1 {
	0% {
		opacity: 0.1;
	}
	50% {
		opacity: 0.175;
	}
	100% {
		opacity: 0;
	}
}

@-webkit-keyframes anim-effect-zorka-2 {
	100% {
		-webkit-transform: translate3d(40px, 0, 0) scale3d(0.8, 0.8, 1);
		transform: translate3d(40px, 0, 0) scale3d(0.8, 0.8, 1);
	}
}

@keyframes anim-effect-zorka-2 {
	100% {
		-webkit-transform: translate3d(40px, 0, 0) scale3d(0.8, 0.8, 1);
		transform: translate3d(40px, 0, 0) scale3d(0.8, 0.8, 1);
	}
}

@-webkit-keyframes anim-effect-zorka-3 {
	100% {
		-webkit-transform: translate3d(-40px, 0, 0) scale3d(0.8, 0.8, 1);
		transform: translate3d(-40px, 0, 0) scale3d(0.8, 0.8, 1);
	}
}

@keyframes anim-effect-zorka-3 {
	100% {
		-webkit-transform: translate3d(-40px, 0, 0) scale3d(0.8, 0.8, 1);
		transform: translate3d(-40px, 0, 0) scale3d(0.8, 0.8, 1);
	}
}

/* Stana */
.cbutton--effect-stana .cbutton__helper {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -40px 0 0 -40px;
	width: 80px;
	height: 80px;
	opacity: 0;
	pointer-events: none;
}

.cbutton--effect-stana line {
	fill: none;
	stroke-width: 2;
}

.cbutton--box-color-7 line {
	stroke: #0077ff;
}

.cbutton--box-color-8 line {
	stroke: #7bff00;
}

.cbutton--box-color-9 line {
	stroke: #fff;
}

.clip-ring {
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}

.cbutton--effect-stana.cbutton--click .cbutton__helper {
	-webkit-animation: anim-effect-stana 0.4s ease-in forwards;
	animation: anim-effect-stana 0.4s ease-in forwards;
}

@-webkit-keyframes anim-effect-stana {
	0%, 100% {
		opacity: 1;
	}
	50% {
		opacity: 0.3;

		-webkit-animation-timing: ease-out;
		animation-timing: ease-out;
	}
}

@keyframes anim-effect-stana {
	0%, 100% {
		opacity: 1;
	}
	50% {
		opacity: 0.3;

		-webkit-animation-timing: ease-out;
		animation-timing: ease-out;
	}
}

.cbutton--effect-stana.cbutton--click .clip-ring {
	-webkit-transition: -webkit-transform 0.4s ease-in-out;
    transition: transform 0.4s ease-in-out;
	-webkit-transform: scale3d(3, 3, 1);
	transform: scale3d(3, 3, 1);
}


.copyright span{font-size:0.6em; margin-left:2.4em; margin-right:1.4em;text-align:left;  text-transform:uppercase; color:#fff}

.or { background: #f00;  text-align:center;  margin-left:0.7em; margin-right:0.7em; border-radius:50%; color:#fff; padding-top:5px; padding-bottom:5px; padding-left:5px; padding-right:5px  }

#headlink{ color:#333; font-family:'calibre-bold',Arial, Helvetica, sans-serif; padding-bottom:0.2em; padding: 1px 1px; }
#headless{ color:#333; font-family:'calibre-bold',Arial, Helvetica, sans-serif; padding-bottom:0.2em; padding: 1px 1px;}

.top a { font-family:'calibre-bold',Helvetica, sans-serif; padding:10px 10px; font-size:25px;color: #999;  }

.top a:hover {  color:#f00; border-bottom: 2px solid #f00;  padding-bottom:0.7em   }

.navig {  padding: 6px 6px; font-family:'calibre-bold',Arial, Helvetica, sans-serif;; color:#999; border-right: 1px solid #ccc; font-size:0.9em} }


.relitem { font-size:1.4em; color:#ccc;   margin-left:1em; font-family:'calibre-bold', Helvetica, sans-serif }

.logitem { font-size:1.2em; color: #888; font-family:'calibre-bold', Helvetica, sans-serif }
.logitem { font-size:1.2em; color: #888; font-family:'calibre-bold', Helvetica, sans-serif }
.logitem a{ font-size:1.2em; color: #888; font-family:'calibre-bold', Helvetica, sans-serif }

.loglinkcen{ font-size:0.6em; text-align:center; color: #09f; font-family:'calibre-bold', Helvetica, sans-serif }
.loglinkcen:hover{ color:#09f }

#attend{ font-size:1em;padding: 7px 7px;  text-align:center;  border: 1px solid #888; color: #888; font-family:'calibre-bold', Helvetica, sans-serif }

#topalt{ font-size:25px; color:#999;  }


.attend{ font-size:1em; text-align:center;   color: #888; font-family:'calibre-bold', Helvetica, sans-serif }

.attend a{ font-size:1em;padding: 7px 7px; border: 1px solid #888; text-align:center; color: #888; font-family:'calibre-bold', Helvetica, sans-serif }


#attend a{ font-size:1em;padding: 7px 7px; border: 1px solid #888; text-align:center; color: #888; font-family:'calibre-bold', Helvetica, sans-serif }

.attend:hover{ color:#000;  }


.logsm { font-size:0.2em; color: #888; padding:6px 6px; background: #FAFAFA; text-transform:uppercase; font-family:'calibre-bold', Helvetica, sans-serif }

.logtitle{ font-size:1.4em; color: #ddd; font-family:'calibre-bold', Helvetica, sans-serif; text-align:center }
.logstats{ font-size:1.4em; color: #ccc; font-family:'calibre-bold', Helvetica, sans-serif; }
.loglink{ font-size:0.3em; color: #ccc; font-family:'calibre-bold', Helvetica, sans-serif; }
.loglink:hover{ color: #09f; }
.evtitem { font-size:0.8em; color:#003; font-family:'calibre-bold', Helvetica, sans-serif }
#deets {font-family:'calibre-bold', Helvetica, sans-serif; font-size:0.25em; letter-spacing:-0.2px }
.link {  font-family:'calibre-bold', Palatino, serif, Helvetica, sans-serif; Helvetica, sans-serif; color:#09f}
.numlink {  font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif, Helvetica, sans-serif; color:#333}
.tlink {  font-family: 'calibre-regular', "Book Antiqua", Palatino, serif, Helvetica, sans-serif; color:#333; font-size:105%; padding:1em; line-height: 1.8}

#socaccs { color:#60F; text-align:center}
#soclogo{ font-size:1.5em; }

#tools { color:#60F; text-align:center} 
#rub{padding: 12px 10px; background: #60F; color:#fff; border-radius: 5px}
#applogo{ font-size:1.5em}

.appicon{padding: 8px 6px; border:1px solid #60F;border-radius: 5px}
#ttable {  font-family: 'calibre-regular', "Book Antiqua", Palatino, serif, Helvetica, sans-serif; color:#333; font-size:96%; padding:1em; line-height: 1.3}
.theading{padding-left:0.76em; padding-bottom:0; font-size: 118%; font-weight:100; color: #999;  font-family: 'calibre-bold',Helvetica, sans-serif;}

#norm a{  color:#003; letter-spacing:-1px;  padding:5px 5px; font-weight:100; font-family:'calibre-bold', Helvetica, sans-serif;
 
}
#banner { height: 400px; max-width:100%; position:relative; text-align:center}
#banner:hover { opacity: 1 }
#camera { font-size:4em; color:#fff; padding: 2px 15px; ; border:1px solid #fff; border-radius: 10%;}
#camera:hover{ opacity:0.7;}


.resp img{width:100%;}

#title{  text-align:center; font-family:'calibre-bold', Helvetica, sans-serif; text-transform:uppercase; background:#FFF; font-size:3em;}
.photo { border-radius:50%; }
.photo:hover { opacity:.7 }

.photocomm { border-radius:50%; border: 1px solid #82888a }
.photocomm:hover { opacity:.7 }

.authorlg{ font-family:inherit; text-align:center; font-size:0.8em; font-family:'calibre-bold'; Helvetica, sans-serif; color:#333}
.authorlg a{ font-family:inherit; text-align:center; font-size:0.8em; font-family:'calibre-bold'; Helvetica, sans-serif; color:#333}

.quote { font-size:300%; text-transform: !important;  font-family: 'Playfair Display',Georgia, "Times New Roman", Times, serif; color:#999; line-height:1.2; font-style:italic}
.statslg { color:#333;  font-family:'calibre-bold', Helvetica, sans-serif; font-size:2em; text-align:center
	
}
.statssm { color:#333;  	font-family: 'calibre-bold', Helvetica, sans-serif; font-size:0.8em; text-align:center
	
}

.statssmm { color:#333;  font-family:'GothamRoundedLight', Helvetica, sans-serif; font-size:0.3em; text-align:center
	
}
#stats { color:#666;  font-family:'calibre-bold', Helvetica, sans-serif; font-size:1.3em;
	
}
.iconlg { font-size:30px; }
.commentcount {font-size:0.8em; color:#fff; vertical-align:super; font-weight:400; font-family:"Helvetica Neue", sans-serif; background: rgba(32,124,229,1);
background: -moz-linear-gradient(-45deg, rgba(32,124,229,1) 0%, rgba(73,155,234,1) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(32,124,229,1)), color-stop(100%, rgba(73,155,234,1)));
background: -webkit-linear-gradient(-45deg, rgba(32,124,229,1) 0%, rgba(73,155,234,1) 100%);
background: -o-linear-gradient(-45deg, rgba(32,124,229,1) 0%, rgba(73,155,234,1) 100%);
background: -ms-linear-gradient(-45deg, rgba(32,124,229,1) 0%, rgba(73,155,234,1) 100%);
background: linear-gradient(135deg, rgba(32,124,229,1) 0%, rgba(73,155,234,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#207ce5', endColorstr='#499bea', GradientType=1 ); padding:3px 3px; border-radius: 20% 24%; }


#jusin{ color:#999; text-align:center; font-size:110%; padding: 30px 30px;}
#pointot{ color:#666}






#share { padding: 5px 8px; border-radius:50%; background:none; color:#30C260; border:1px solid #30C260}
#love { padding: 5px 8px; border-radius:50%; background: none; color:#F90F3E; border:1px solid #F90F3E}






/* reset  list style */
.cbp-tm-menu,
.cbp-tm-menu ul {
	list-style: none;
}

/* set menu position; change here to set to relative or float, etc. */
.cbp-tm-menu {
	display: block;
	position: absolute;
	z-index: 1000;
	bottom: 0;
	width: 100%;
	background: #FFF;
	text-align: left
	;
	padding: 0 3em;
	margin: 0;
	text-transform: capitalize;
}

/* first level menu items */
.cbp-tm-menu > li {
	display: inline-block;
	margin: 0 1em;
	position: relative;
}

.cbp-tm-menu > li > a {
	line-height: 4em;
	padding: 0 0.6em;
	font-size: 0.78em;
	display: block;
	color: #999; font-weight:500; font-family:'calibre-regular',"Trebuchet MS", Arial, Helvetica, sans-serif
}

.no-touch .cbp-tm-menu > li > a:hover,
.no-touch .cbp-tm-menu > li > a:active {
	color: #999;
}

/* sumbenu with transitions */
.cbp-tm-submenu {
	position: absolute;
	display: block;
	visibility: hidden;
	opacity: 0;
	padding: 0;
	text-align: left;
	pointer-events: none;
	-webkit-transition: visibility 0s, opacity 0s;
	-moz-transition: visibility 0s, opacity 0s;
	transition: visibility 0s, opacity 0s;-webkit-box-shadow: 10px 23px 76px 3px rgba(0,0,0,0.47);
-moz-box-shadow: 10px 23px 76px 3px rgba(0,0,0,0.47);
box-shadow: 10px 23px 76px 3px rgba(0,0,0,0.47);
}

.cbp-tm-show .cbp-tm-submenu {
	width: 16em;
	left: 50%;
	margin: 0 0 0 -8em;
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	-webkit-transition: visibility 0s, opacity 0.3s;
	-moz-transition: visibility 0s, opacity 0.3s;
	transition: visibility 0s, opacity 0.3s;
}

.cbp-tm-show-above .cbp-tm-submenu {
	bottom: 100%;
	padding-bottom: 10px;
}

.cbp-tm-show-below .cbp-tm-submenu {
	top: 100%;
	padding-top: 10px;
}

/* extreme cases: not enough space on the sides */
.cbp-tm-nospace-right .cbp-tm-submenu {
	right: 0;
	left: auto;
}

.cbp-tm-nospace-left .cbp-tm-submenu {
	left: 0;
}

/* last menu item has to fit on the screen */
.cbp-tm-menu > li:last-child .cbp-tm-submenu {
	right: 0;
}

/* 	
arrow: depending on where the menu will be shown, we set 
the right position for the arrow
*/

.cbp-tm-submenu:after {
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.cbp-tm-show-above .cbp-tm-submenu:after {
	top: 100%;
	margin-top: -10px;
}

.cbp-tm-show-below .cbp-tm-submenu:after {
	bottom: 100%;
	margin-bottom: -10px;
}

.cbp-tm-submenu:after {
	border-color: transparent;
	border-width: 16px;
	margin-left: -16px;
	left: 50%;
}

.cbp-tm-show-above .cbp-tm-submenu:after {
	border-top-color: #fff;
}

.cbp-tm-show-below .cbp-tm-submenu:after {
	border-bottom-color: #fff;
}

.cbp-tm-submenu > li {
	display: block;
	background: #fff;
}

.cbp-tm-submenu > li > a {
	padding: 15px 2.3em 10px 1em; /* top/bottom paddings in 'em' cause a tiny "jump" in Chrome on Win */
	display: block;
	font-size: 0.72em;
	position: relative;
	color: #00aeef; font-weight:500;
	border: 4px solid #fff; text-transform: uppercase;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	transition: all 0.2s;
}

.no-touch .cbp-tm-submenu > li > a:hover,
.no-touch .cbp-tm-submenu > li > a:active {
	color: #999;
	
}

/* the icons (main level menu icon and sublevel icons) */
.cbp-tm-submenu li a:before,
.cbp-tm-menu > li > a:before {
	font-family: "Ionicons";
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	vertical-align: middle;
	margin-left: 0.6em;
	-webkit-font-smoothing: antialiased;
}

.cbp-tm-submenu li a:before {
	position: absolute;
	top: 50%;
	margin-top: -0.5em;
	right: 0.5em;
}

.cbp-tm-menu > li > a:not(:only-child):after {
	content: "\f35f"; font-family:"Ionicons";	font-size: 100%;
	opacity: 0.8;
}


.sharelink{ color:#333; }







.searchbar input{   height:100%; width:100%; font-size:300%;  color:#ccc;padding-top:5px; background: none; border-radius:15px; font-weight:100; font-family: 'calibre-regular',Helvetica, sans-serif }
.searchbar input:focus{ color:#999; opacity:1;   }

.searchbar input::-webkit-input-placeholder {
   color: #999; 
}

.searchbar input:-moz-placeholder { /* Firefox 18- */
   color:  color: #999;   opacity:0.6;
}

.searchbar input::-moz-placeholder {  /* Firefox 19+ */
   color: #999;    opacity:0.6;
}

.searchbar input:-ms-input-placeholder {  
   color: #999;    opacity:0.6;
}

.searchbar input::-webkit-input-placeholder::before { font-family: "Ionicons";line-height:0; content:' \f21f  ';color: #999; }
::-moz-placeholder::before  { font-family: "Ionicons"; content:' \f21f  ';line-height:0; color: #999; } /* firefox 19+ */
:-ms-input-placeholder::before  { font-family: "Ionicons"; content:' \f21f  ';line-height:0; color: #999;  } /* ie */
input:-moz-placeholder::before  { font-family: "Ionicons"; content:' \f21f  '; line-height:0; color: #999;   }

#searchbar{text-align: left; margin-left:4em}



.commentbar input{  
	
	font-size: 0.98em;
	color: #fff;   width:90% ; height:40px; border-radius:0px; border-bottom:1px solid #b2e3f9;  outline:none;   font-weight:100;
	
	background: none; font-family: 'calibre-regular',Helvetica, sans-serif }
.commentbar input:focus{ color:#fff;   }

.commentbar input::-webkit-input-placeholder {
   color: #b2e3f9;  
}

.commentbar input:-moz-placeholder { /* Firefox 18- */
   color:  #b2e3f9;  
}

.commentbar input::-moz-placeholder {  /* Firefox 19+ */
   color:  #b2e3f9;  
}

.commentbar input:-ms-input-placeholder {  
   color:  #b2e3f9;  
}

.commentbar input::-webkit-input-placeholder::before { font-family: "Ionicons"; line-height:0; content:' \f21d '; color: #b2e3f9; }
.commentbar input:-moz-placeholder::before  { font-family: "Ionicons"; content:' \f21d  '; line-height:0;color:  #b2e3f9;} /* firefox 19+ */
.commentbar input:-ms-input-placeholder::before  { font-family: "Ionicons"; content:' \f21d  ';line-height:0; color: #b2e3f9; } /* ie */
.commentbar input:-moz-placeholder::before  { font-family: "Ionicons"; content:' \f21d  '; line-height:0;color:  #b2e3f9;  }

.menuitemlg{float:left; width:450px;  font-size:3.2em; color: #fff}



.menuitem{float:right; width:415px; font-size:105%;  color: #fff; }
.newshead{ font-weight:900; font-family:'calibre-bold',Helvetica,Arial,sans-serif; font-size:0.7em; color:#b2e3f9}

.newsheadlg{ font-weight:900; font-family:'calibre-bold',Helvetica,Arial,sans-serif; font-size:0.25em; color:#b2e3f9}


@media screen and (max-width: 23.5625em) {.menuitem{  width:120%;float:left;  font-size:100%; color: #fff }
.menuitemlg{ width:120%; float:left; font-size:1em; font-weight:100; color: #fff} .newsheadlg{ font-size:0.68em;} .masthead { padding-top:-10px }.cbp-tm-menu{ visibility:hidden}  .searchbar input{ font-size:100%} #searchbar{ margin-left:1em}.tabs-style-underline nav a { font-size:68%}  
.tlink{ font-size:80%} #video{ width:100%; height: 100%} #imagecase{ margin:0 } #clogo{ width:30%}
	
}

@media screen and (max-width: 35em) {.menuitem{  width:120%;float:left;  font-size:100%; color: #fff }
.menuitemlg{ width:120%; float:left; font-size:1em; font-weight:100; color: #fff} .newsheadlg{ font-size:0.68em;} .masthead { padding-top:-10px; } .cbp-tm-menu{ visibility:hidden}.searchbar input{ font-size:100%} #searchbar{ margin-left:1em} .tlink{ font-size:80%} #video{ width:100%; height: 100%} .imagecase{ margin-right: 0.1em; } #ttable{ font-size:80%}#clogo{ width:30%}

}

}

@media screen and (max-width: 58em) {.menuitem{  width:120%;float:left;  font-size:100%; color: #fff }
.menuitemlg{ width:120%; float:left; font-size:1em; font-weight:100; color: #fff} .newsheadlg{ font-size:0.68em;} .masthead { padding-top:-10px} .cbp-tm-menu{ visibility:hidden} .searchbar input{ font-size:100%} #searchbar{ margin-left:1em}.tlink{ font-size:80%} #video{ width:100%; height: 100%} .imagecase{ margin-right: 0.1em; }#clogo{ width:30%}

}

.stive:hover{ color:#FFF}
.stive {font-weight:700; letter-spacing:1px; text-align:center; margin-left:0.2em; font-family: inherit ;padding: 11px 14px; border-radius:6px; font-size:0.65EM; background:#00aeef; color: #FFf;   font-family:'calibre-bold', Helvetica, sans-serif; -webkit-box-shadow: 10px 23px 76px 3px rgba(0,0,0,0.47);
-moz-box-shadow: 10px 23px 76px 3px rgba(0,0,0,0.47);
box-shadow: 10px 23px 76px 3px rgba(0,0,0,0.47);}

.lower{ list-style: none ; 
    display: inline-block;
    width: 100%;
    text-transform: uppercase;
    list-style: none;
    color:#aaa; 
    font-size: 0.78em;
    margin: 0;
    padding: 0; }
.main-footer{background:#FFF; padding:0px 60px; border-top:1.5px solid #aaa; border-bottom:20px solid #999}

.next-project-blue{ background: #ABB9FC; text-align:center; padding: 2em 2em; font-weight:100;color:#fff; font-size: 160%; font-family:'calibre-bold', Helvetica, sans-serif}
.next-project-green{ background: #8FD678; text-align:center; padding: 2em 2em; font-weight:100;color:#fff; font-size: 160%; font-family:'calibre-bold', Helvetica, sans-serif}
.next-project-purple{ background: rgba(85, 48, 127,0.5); text-align:center; padding: 2em 2em; font-weight:100;color:#fff; font-size: 160%; font-family:'calibre-bold', Helvetica, sans-serif}
.nextpro{ text-align: center; font-family:'calibre-regular', Helvetica, sans-serif; font-size:0.5em; border-bottom: 2px solid #fff; padding-bottom:0.88em }

p.stats { color: #ccc;  font-family:'calibre-regular', Helvetica, sans-serif; font-size:1em;  }

p.loc {
	margin: 0; font-size:0.8em;  color: #00aeef; padding: 0 0 0.2em; font-weight:900; font-family:'calibre-regular', Helvetica, sans-serif 
}

.redlink { color:#F4A853}




.cbp-mc-form {
	position: relative;
}

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

.cbp-mc-form:after { 
	clear: both; 
}

.cbp-mc-column {
	width: 43%;
	float: left;
}

.cbp-mc-form label {
	display: block;
	padding: 40px 5px 5px 2px;
	font-size: 1em;
	text-transform: capitalize; color:#999

	cursor: pointer;
}

.cbp-mc-form input,
.cbp-mc-form textarea,
.cbp-mc-form select {
	font-family: 'calibre-regular', Calibri, Arial, sans-serif;
	line-height: 1.5;
	font-size: 1em;

	color: #333;
	display: block;
	width: 100%;
	background: transparent; 
}




.cbp-mc-form input,
.cbp-mc-form textarea {
	border: 1px solid #333; outline:none
}

.cbp-mc-form textarea {
	min-height: 200px;
}



.cbp-mc-form select:focus {
	outline: none;
}

::-webkit-input-placeholder { /* WebKit browsers */
    color: #ccc;
   
}

:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #ccc;
   
}

::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #ccc;
   
}

:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #ccc;
    
}

.cbp-mc-submit-wrap {
	text-align: center;
	padding-top: 40px;
	clear: both;
}

.cbp-mc-form input.cbp-mc-submit {
	background: #10689a;
	border: none;
	color: #fff;
	width: auto;
	cursor: pointer;
	text-transform: uppercase;
	display: inline-block;
	padding: 15px 30px;
	font-size: 1.1em;
	border-radius: 2px;
	letter-spacing: 1px;
}

.cbp-mc-form input.cbp-mc-submit:hover {
	background: #1478b1;
}

@media screen and (max-width: 70em) {
	.cbp-mc-column {
		width: 50%;
	}
	.cbp-mc-column:nth-child(3) {
		width: 100%;
	}
}

@media screen and (max-width: 48em) {
	.cbp-mc-column {
		width: 100%;
		padding: 10px;
	}
}



#pointxt{float:right; color: #FFF; font-size:1.8em; float:left; text-transform:inherit; font-weight:100;font-family:  'calibre-bold',Helvetica, sans-serif}



.save{padding: 1EM 1EM; border-radius:21px; background: #60F; color:#FFF}

/*Purple*/
#purple{padding: 8PX 9PX; font-size:0.83em; font-weight:100; background: none; border-radius:21px; color:#30C260; text-align:center; letter-spacing:1px; border: 1px solid #30C260}

#purplesm{padding: 8PX 9PX; font-size:0.7em; font-weight:100; background: none; border-radius:21px; color:#30C260; text-align:center; letter-spacing:1px; border: 1px solid #30C260}

#purplebottom { border-bottom:2px solid #60C;}
/*Purple*/


/*Red*/
#red{padding: 8PX 12PX; font-size:0.7em; font-weight:100; background:#f00; border-radius:21px; color:#fff; text-align:center; letter-spacing:1px;}

#redbottom { border-bottom:2px solid #f00;}
/*Red*/

/*Orange*/
#orange{padding: 8PX 12PX; font-size:0.7em; font-weight:100; background:#f97242; border-radius:21px; color:#fff; text-align:center; letter-spacing:1px;}

#orangebottom { border-bottom:2px solid #f97242;}
/*Orange*/

/*Black*/
#black{padding: 8PX 12PX; font-size:0.8em; font-weight:500; background:#ccc;  border-radius:21px; color:#fff; text-align:center; letter-spacing:1px;}

#blackbottom { border-bottom:2px solid #333;}
/*Black*/


/*Grey*/
#grey{padding: 8PX 12PX; font-size:0.7em; font-weight:100; background:#999; border-radius:21px; color: #fff; text-align:center; letter-spacing:1px;}

#greybottom { border-bottom:2px solid #999;}
/*Grey*/

/*blue*/
#blue{padding: 8PX 12PX; font-size:0.7em; font-weight:100; background: #00aeef; border-radius:21px; color: #fff; text-align:center; letter-spacing:1px;}

#bluebottom { border-bottom:2px solid #00aeef;}
/*blue*/

/*Green*/
#green{padding: 8PX 12PX; font-size:0.7em; font-weight:100; background: #2FC66F ; border-radius:21px; color: #fff; text-align:center; letter-spacing:1px;}

#greenbottom { border-bottom:2px solid #2FC66F ;}
/*Green*/


#dte{color:#000;float:right}


.shead { 
 background-color:#000; text-align:center; padding: 40px 40px; height:100% }
  

.description h1{ font-family:'calibre-bold', Helvetica, sans-serif; font-size:0.91em;  font-weight:100; color:#fff}
.description p { font-family:'calibre-regular', Helvetica, sans-serif; font-size:0.91em;  color:#fff}
.description span{ font-family: 'Libre Baskerville', serif;   font-style:italic; font-size:1em; color:#fff}

#dtelg{ color:#999; font-family:'calibre-regular', serif;  text-align:center; font-size:90%}

#tag{ font-family:'calibre-regular', serif; border: 1px solid #999; color:#999; padding: 10px 14px ; letter-spacing:1px; font-weight:100; border-radius: 1px; font-size:60%}
#projtitle{text-align:center;   font-size:200%; line-height:1;}

#pod{ color:#60F}

.imagecase{ box-shadow: 15px 2px 20px rgba(198,198,198,0.9); margin-right: 2em; 
}

.imageshadow{ box-shadow: 15px 2px 20px rgba(198,198,198,0.9); 
 
}

.titletb{text-align:center; color: #999; font-size:160%; font-family:  'calibre-bold',Helvetica, sans-serif}

.titletab{text-align:center; padding:2em 1em;  color:#fff; font-size:140%; font-family:  'calibre-bold',Helvetica, sans-serif }


#twitter { color:#FFF; background:#6CF}
#logor{ font-family:'calibre-bold', Helvetica, sans-serif;   color:#999; margin-right:46em; line-height:0; font-size:1em }
.herotext{ font-family: 'Playfair Display', serif; font-style:italic; font-size:5em; font-weight:900; color:#ccc; letter-spacing:-4px; ;}

#numb{ border: 2px solid #fff;
    display: block;
    width: 2.1rem;
    height: 2.0rem;
    border-radius: 40px;
    text-align: center;
    line-height: 1.8rem;
    font-weight: bold;
    color: #fff;
    margin-bottom: 2em;}


#numba{ border: 2px solid #333;
    display: block;
    width: 2.1rem;
    height: 2.0rem;
    border-radius: 40px;
    text-align: center;
    line-height: 1.8rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 2em;}

#numbap{ border: 2px solid #2FC66F;
    display: block;
    width: 2.1rem;
    height: 2.0rem;
    border-radius: 40px;
    text-align: center;
    line-height: 1.8rem;
    font-weight: 100; font-size:0.75em;
    color: #fff; background:#2FC66F;
    margin-bottom: 2em;}



.sp-slideshow {
    position: relative;
	
	width: 100%;
	
	height: 460px;
	

}

.sp-content {
    background: #7d7f72 url(../img/grid.png) repeat scroll 0 0;
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.sp-parallax-bg {
    background: url(../img/map.png) repeat-x scroll 0 0;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.sp-slideshow input {
    position: absolute;
	bottom: 15px;
	left: 50%;
	width: 9px;
	height: 9px;
	z-index: 1001;
	cursor: pointer;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
}

.sp-slideshow input + label {
    position: absolute;
    bottom: 15px;
	left: 50%;
    width: 6px;
	height: 6px;
	display: block;
	z-index: 1000; border: 3px solid #666;

	border: 3px solid #666;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    -webkit-transition: background-color linear 0.1s;
    -moz-transition: background-color linear 0.1s;
    -o-transition: background-color linear 0.1s;
    -ms-transition: background-color linear 0.1s;
    transition: background-color linear 0.1s;
}
.sp-slideshow input:checked + label {
	background-color: #fff;
    background-color: rgba(255,255,255,0.9); 
}

.sp-selector-1, .button-label-1 {
    margin-left: -36px;
}

.sp-selector-2, .button-label-2 {
    margin-left: -18px;
}

.sp-selector-4, .button-label-4 {
    margin-left: 18px;
}

.sp-selector-5, .button-label-5 {
    margin-left: 36px;
}

.sp-arrow {
    position: absolute;
	top: 50%;
	width: 28px;
	height: 38px;
	margin-top: -19px;
	display: none;
	opacity: 0.8;
	cursor: pointer;
	z-index: 1000;
	background: transparent url(../img/arrows.png) no-repeat;
	
}
.sp-arrow:hover{
	opacity: 1;
}
.sp-arrow:active{
	margin-top: -18px;
}
.sp-selector-1:checked ~ .sp-arrow.sp-a2,
.sp-selector-2:checked ~ .sp-arrow.sp-a3,
.sp-selector-3:checked ~ .sp-arrow.sp-a4,
.sp-selector-4:checked ~ .sp-arrow.sp-a5 {
    right: 15px;
	display: block;
	background-position: top right;
}
.sp-selector-2:checked ~ .sp-arrow.sp-a1,
.sp-selector-3:checked ~ .sp-arrow.sp-a2,
.sp-selector-4:checked ~ .sp-arrow.sp-a3,
.sp-selector-5:checked ~ .sp-arrow.sp-a4 {
    left: 15px;
	display: block;
	background-position: top left;
}

.sp-slideshow input:checked ~ .sp-content {
    -webkit-transition: background-position linear 0.6s, background-color linear 0.8s;
    -moz-transition: background-position linear 0.6s, background-color linear 0.8s;
    -o-transition: background-position linear 0.6s, background-color linear 0.8s;
    -ms-transition: background-position linear 0.6s, background-color linear 0.8s;
    transition: background-position linear 0.6s, background-color linear 0.8s;
}

.sp-slideshow input:checked ~ .sp-content .sp-parallax-bg {
    -webkit-transition: background-position linear 0.7s;
    -moz-transition: background-position linear 0.7s;
    -o-transition: background-position linear 0.7s;
    -ms-transition: background-position linear 0.7s;
    transition: background-position linear 0.7s;
}

input.sp-selector-1:checked ~ .sp-content {
    background-position: 0 0;
	background-color: #fff;
}

input.sp-selector-2:checked ~ .sp-content {
    background-position: -100px 0;
	background-color: #fff;
}

input.sp-selector-3:checked ~ .sp-content {
    background-position: -200px 0;
	background-color: #Fff;
}

input.sp-selector-4:checked ~ .sp-content {
    background-position: -300px 0;
	background-color: #fff;
}

input.sp-selector-5:checked ~ .sp-content {
    background-position: -400px 0;
	background-color: #fff;
}

input.sp-selector-1:checked ~ .sp-content .sp-parallax-bg {
    background-position: 0 0;
}

input.sp-selector-2:checked ~ .sp-content .sp-parallax-bg {
    background-position: -200px 0;
}

input.sp-selector-3:checked ~ .sp-content .sp-parallax-bg {
    background-position: -400px 0;
}

input.sp-selector-4:checked ~ .sp-content .sp-parallax-bg {
    background-position: -600px 0;
}

input.sp-selector-5:checked ~ .sp-content .sp-parallax-bg {
    background-position: -800px 0;
}

.sp-slider {
    position: relative;
	left: 0;
    width: 500%;
	height: 100%;
	list-style: none;
    margin: 0;
	padding: 0;
    -webkit-transition: left ease-in 0.8s;
    -moz-transition: left ease-in 0.8s;
    -o-transition: left ease-in 0.8s;
    -ms-transition: left ease-in 0.8s;
    transition: left ease-in 0.8s; 
}

.sp-slider > li {
	color: #333;
	width: 20%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	height: 100%;
	padding: 0 60px;
    float: left;
	text-align: center;
	opacity: 0.4;
    -webkit-transition: opacity ease-in 0.4s 0.8s;
    -moz-transition: opacity ease-in 0.4s 0.8s;
    -o-transition: opacity ease-in 0.4s 0.8s;
    -ms-transition: opacity ease-in 0.4s 0.8s;
    transition: opacity ease-in 0.4s 0.8s; 
}
.sp-slider > li img{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	margin: 0 auto;
	padding: 40px 0 50px 0;
	max-height: 100%;
	max-width: 100%;
}
input.sp-selector-1:checked ~ .sp-content .sp-slider {
    left: 0;
}

input.sp-selector-2:checked ~ .sp-content .sp-slider {
    left: -100%;
}

input.sp-selector-3:checked ~ .sp-content .sp-slider {
    left: -200%;
}

input.sp-selector-4:checked ~ .sp-content .sp-slider {
    left: -300%;
}

input.sp-selector-5:checked ~ .sp-content .sp-slider {
    left: -400%;
}

input.sp-selector-1:checked ~ .sp-content .sp-slider > li:first-child,
input.sp-selector-2:checked ~ .sp-content .sp-slider > li:nth-child(2),
input.sp-selector-3:checked ~ .sp-content .sp-slider > li:nth-child(3),
input.sp-selector-4:checked ~ .sp-content .sp-slider > li:nth-child(4),
input.sp-selector-5:checked ~ .sp-content .sp-slider > li:nth-child(5){
	opacity: 1;
}
@media screen and (max-width: 840px){
	.sp-slideshow { height: 345px; }
}
@media screen and (max-width: 680px){
	.sp-slideshow { height: 285px; }
}
@media screen and (max-width: 560px){
	.sp-slideshow { height: 235px; }
}
@media screen and (max-width: 320px){
	.sp-slideshow { height: 158px; }
}

}



/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.fade-in {
  opacity:0;  /* make things invisible upon start */
  -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
  -moz-animation:fadeIn ease-in 1;
  animation:fadeIn ease-in 1;

  -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
  -moz-animation-fill-mode:forwards;
  animation-fill-mode:forwards;

  -webkit-animation-duration:1s;
  -moz-animation-duration:1s;
  animation-duration:1s;
}

.fade-in.one {
  -webkit-animation-delay: 0.7s;
  -moz-animation-delay: 0.7s;
  animation-delay: 0.7s;
}

.fade-in.two {
  -webkit-animation-delay: 2.0;
  -moz-animation-delay:2.0s;
  animation-delay: 2.0s;
}

.fade-in.three {
  -webkit-animation-delay: 3.1s;
  -moz-animation-delay: 3.1s;
  animation-delay: 3.1s;
}

.fade-in.four {
  -webkit-animation-delay: 4.1s;
  -moz-animation-delay: 4.1s;
  animation-delay: 4.1s;
}.fade-in.five {
  -webkit-animation-delay: 5.1s;
  -moz-animation-delay: 5.1s;
  animation-delay: 5.1s;
}

.fade-in.six {
  -webkit-animation-delay: 6.1s;
  -moz-animation-delay: 6.1s;
  animation-delay: 6.1s;
}.fade-in.seven {
  -webkit-animation-delay: 7.1s;
  -moz-animation-delay: 7.1s;
  animation-delay: 7.1s;
}.fade-in.eight {
  -webkit-animation-delay: 8.1s;
  -moz-animation-delay: 8.1s;
  animation-delay: 8.1s;
}.fade-in.nine {
  -webkit-animation-delay: 9.1s;
  -moz-animation-delay: 9.1s;
  animation-delay: 9.1s;
}


.intro {font-size: 2em; max-width:700px; font-weight:100; line-height:1}
.introcaption {font-size: 2em; max-width:700px; font-weight:100; line-height:1}

.divider {
    height: 1px;
    background: rgba(0,0,0,0.1);
    width: 100%;
    max-width: 700px;
    margin: 20px 0 50px;
    transition: .3s;
    -webkit-transition: .3s;
}
 @media screen and (max-width: 78em) {
.cbp-tm-menu{ visibility:hidden} }

.crossover {   text-decoration: line-through }
.introlink a {  color: #33F }
.introlink a:hover {  color:#F60; text-decoration: underline}

.proname {text-align: left; font-family: 'calibre-regular',  Helvetica, sans-serif;    font-size:1em; padding-left:1.4em; padding-bottom:0; color:#fff  }