/*
	Theme Name: Project Baromter
	Theme URI: https://www.internative.nl
	Author: Roy van der Loo
	Author URI: https://www.internative.nl
	Description: The theme for Project Barometer
	Version: 0.1
	License: GNU General Public License v2 or later
	License URI: http://www.gnu.org/licenses/gpl-2.0.html
	Text Domain: inn-projectbarometer
*/

/* Table of Contents

* Import Fonts
* Defaults

*/

/* Import Fonts
------------------------------------------------------------ */

@import url( '//fonts.googleapis.com/css?family=Source+Sans+Pro:400,600' );

/*  Fonts
------------------------------------------------------------ */

/* first for Internet Explorer < 9 */
@font-face {
	font-family: Kievit-Regular;
	src: url("assets/fonts/KievitWeb.eot");
}
/* then for WOFF-capable browsers */
@font-face {
	font-family: Kievit-Regular;
	src: url("assets/fonts/KievitWeb.woff") format("woff");
}
/* first for Internet Explorer < 9 */
@font-face {
	font-family: Kievit-Medium;
	src: url("assets/fonts/KievitWebPro-Medi.eot");
}
/* then for WOFF-capable browsers */
@font-face {
	font-family: Kievit-Medium;
	src: url("assets/fonts/KievitWebPro-Medi.woff") format("woff");
}

/* Custom container width
------------------------------------------------------------ */

.container {
	width: 1177px;
}

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

    .container {
        width: 100%;
    }

}

/* Content
------------------------------------------------------------ */

#content {
	position: relative;
	width: 805px;
    clear: both;
    margin-right: auto;
	margin-left: auto;
	margin-top: 120px;
	margin-bottom: 100px;
	background-color: #fff;
}
#content { width: 1105px; }
#content.smallerContent { width: 805px; }

#content > .container {

}

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

		#content.smallerContent {
			width: 100%;
		}

	}

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

		#content {
			width: 100%;
		}

	}

.survey-reset {
	width: 100%;
	clear: both;
	padding: 15px;
	background-color: #F1F1F1;
	line-height: 1.2;
	border-bottom: 1px solid #CFCFCF;
}

#loading {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	background-color: #f8f8fa;
	background-image: url( 'assets/img/body-background.jpg' );
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	-webkit-background-size: cover;
	overflow: hidden;
	z-index: 3;
}

	#loading svg {
		position: relative;
		top: 50%;
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		transform: translateY(-50%);
	}

#barometer-app {

}

	.barometer-header {
		position: relative;
		width: 100%;
		clear: both;
		padding: 25px;
		border-bottom: 1px solid #CFCFCF;
		background-image: url( 'assets/img/barometer-header-gradient.png' );
		background-repeat: repeat-x;
		background-position: center bottom;
	}

		.barometer-header h1 {
			display: inline-block;
			margin-bottom: 0;
			margin-top: 10px;
			margin-right: 20px;
		}

		.barometer-header p {
			margin-bottom: 0;
		}

		.barometer-header .text-right {
			text-align: right;
		}

		.toggleNewServey {
			color: #705ED1;
			font-weight: 600;
			cursor: pointer;
		}

		.header-tabs {
			position: absolute;
			bottom: -1px;
			right: 20px;
			list-style: none;
			display: inline-block;
			padding: 0;
			margin: 0;
			text-align: right;
		}

			.header-tabs li {
				display: inline-block;
				margin: 0 5px;
			}

				.header-tabs li a {
					position: relative;
					display: block;
					font-size: 18px;
					color: #76787A;
					font-weight: 700;
					text-decoration: none;
					padding: 10px 25px 10px 50px;
					background-color: #fff;
					border: 1px solid #EBEBEB;
					border-bottom: 1px solid #CFCFCF;
					cursor: pointer;
				}

					.header-tabs li .icon {
						position: absolute;
						left: 20px;
						top: 16px;
					}

				.header-tabs li a:hover {
					color: #E2002B;
					border: 1px solid #CFCFCF;
				}

					.header-tabs li a:hover #Rectangle-18,
					.header-tabs li a:hover #Line,
					.header-tabs li.active-tab a #Rectangle-18,
					.header-tabs li.active-tab a #Line {
						stroke: #E2002B;
					}

					.header-tabs li a:hover #Rectangle-6,
					.header-tabs li a:hover #Oval-6 use,
					.header-tabs li.active-tab a #Rectangle-6,
					.header-tabs li.active-tab a #Oval-6 use {
						fill: #E2002B;
					}

				.header-tabs li.active-tab a {
					color: #E2002B;
					border: 1px solid #CFCFCF;
					border-bottom: 1px solid #fff;
				}

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

		.barometer-header {
			padding-bottom: 75px;
		}

	}

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

		.barometer-header {
			padding-bottom: 50px;
		}

		.barometer-header h1 {
			display: block;
		}

		.header-tabs li a {
			padding: 5px 10px 5px 40px;
			font-size: 14px;
		}

		.header-tabs li .icon {
			left: 10px;
			top: 6px;
		}

	}

	.barometer-content {
		width: 100%;
		clear: both;
		padding: 35px 25px;
	}

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

		.barometer-content {
			padding: 35px 15px;
		}

	}

#new-survey {
	position: fixed;
	z-index: 999999;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow-y:auto;
}

	#new-survey:before {
		content: "";
		position: fixed;
		z-index: 1;
		width: 100%;
		height: 100%;
		background-color: rgba(0,0,0,0.4);
	}

.modalContent {
	position: absolute;
	z-index: 9999;
	top: 125px;
	margin-bottom: 125px;
	left: 50%;
	width: 530px;
	padding: 35px 35px 0 35px;
	background-color: #fff;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}

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

		.modalContent {
			width: 100%;
			left: 0;
			top:0;
			padding: 35px 15px 0 15px;
			-webkit-transform: translateX(0%);
			-ms-transform: translateX(0%);
			transform: translateX(0%);
		}

		.modalContent .user_list td {
			padding: 10px;
		}

	}

	#close-modal {
		position: absolute;
		top: 15px;
		right: 20px;
		text-decoration: none;
		cursor: pointer;
	}

		#close-modal .dashicons {
			font-size: 25px;
		}

	.modalContent > div {
		margin-bottom: 35px;
	}

	.modalContent a {
		font-size: 14px;
	}

	.modalContent input[type="text"],
	.modalContent textarea {
		width: 100%;
		border: 1px solid #EBEBEB;
		font-size: 14px;
	}

	.sweet-alert,
	.sweet-alert button {
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		border-radius: 0;
	}

/* Defaults
------------------------------------------------------------ */
body {
	background-color: #f8f8fa;
	background-image: url( 'assets/img/body-background.jpg' );
	background-repeat: no-repeat;
	background-position: top center;
	background-size: contain;
	-webkit-background-size: contain;
}

body > .container {
	margin-bottom: 100px;
}

body,
p,
select,
textarea {
	color: #76787A;
	font-family: 'Source Sans Pro', Verdana, Helvetica, Arial, Tahoma, sans-serif;
	font-size: 16px;
	font-weight: normal;
	line-height: 1.625;
	margin: 0;
	padding: 0;
	text-decoration: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

html {
	/* height: 100%; */
}

p {
	margin-bottom: 20px;
}

img {
	max-width: 100%;
}

ul {
	margin-bottom: 20px;
}

*,
*:focus {
	outline: none!important;
}


footer.site-footer li,
footer.site-footer ol,
footer.site-footer ul {
	margin: 0;
	padding: 0;
}

ul.twoColumnList,
ul.threeColumnList,
ul.fourColumnList,
ul.fiveColumnList {
	-moz-column-gap: 20px;
	-webkit-column-gap: 20px;
	column-gap: 20px;
}

@media (min-width: 600px) {

	ul.twoColumnList {
	    -moz-column-count: 2;
	    -webkit-column-count: 2;
	    column-count: 2;
	}

}

@media (min-width: 600px) {

	ul.threeColumnList {
	    -moz-column-count: 3;
	    -webkit-column-count: 3;
	    column-count: 3;
	}

}

@media (min-width: 600px) {

	ul.fourColumnList,
	#mapsvg-menu-markers {
	    -moz-column-count: 4;
	    -webkit-column-count: 4;
	    column-count: 4;
	}

}

@media (min-width: 600px) {

	ul.fiveColumnList {
	    -moz-column-count: 5;
	    -webkit-column-count: 5;
	    column-count: 5;
	}

}

@media (min-width: 600px) and (max-width: 786px) {

	.mega-menu-item ul.threeColumnList {
	    -moz-column-count: 2;
	    -webkit-column-count: 2;
	    column-count: 2;
	}

}

	@media (min-width: 600px) and (max-width: 850px) {

		ul.fiveColumnList {
		    -moz-column-count: 3;
		    -webkit-column-count: 3;
		    column-count: 3;
		}

	}


	ul.twoColumnList li,
	ul.threeColumnList li,
	ul.fourColumnList li,
	ul.fiveColumnList li {
		-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
          page-break-inside: avoid; /* Firefox */
               break-inside: avoid; /* IE 10+ */
	}

ol {
    counter-reset: li;
    list-style: none;
    margin: 0 0 25px 0;
    margin-bottom: 25px!important;
    padding: 0 0 0 25px;
}

	ol li {
		color: #000;
	    position: relative;
	    font-weight: 700;
	    line-height: 22px;
	}

		ol > li:before {
		    content: counter(li);
		    counter-increment: li;
		    position: absolute;
		    top: 4px;
		    left: -20px;
		    color: #CFCFCF;
		    font-weight: 400;
		    font-size: 14px;
		    line-height: 14px;
		    text-align: center;
		}

/* Fonts
------------------------------------------------------------ */

h1,h2,h3,h4,h5,h6 {
	color: #000;
	font-family: 'Kievit-Medium', Verdana, Helvetica, Arial, Tahoma, sans-serif;
	line-height: 1.2;
	margin-top: 0;
	margin-bottom: 10px;
}

h1 { font-size: 26px; line-height: 1.4; font-weight: 700; }
h2 { color: #76787A; font-size: 18px; line-height: 1.4; font-weight: 700; }
h3 { color: #E2002B; font-size: 18px; font-weight: 700; }

h4 { font-size: 16px; font-weight: 700; }
h5 { font-size: 14px; font-weight: 700; letter-spacing: 1px; }
h6 { font-size: 13px; font-weight: 700; letter-spacing: 1px; }

h2 span { color: #E2002B; }
.open h3 { color: #000; }

a,
a:visited {
	color: #E2002B;
	text-decoration: underline;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}

a:focus {
	text-decoration: none;
}

a:hover {
	color: #705ED1;
	text-decoration: underline;
}

.prev_survey {
	text-decoration: none;
	font-size: 14px;
	cursor: pointer;
}
	.prev_survey:hover {
		text-decoration: none;
	}

.purple-link {
	color: #705ED1;
	cursor: pointer;
}
	.purple-link:focus,
	.purple-link:hover { color: #000; }

a.external-link {
	position: relative;
	color: #E2002B;
	text-decoration: none;
	line-height: 1;
	display: inline-block;
	padding-right: 25px;
}

	a.external-link:hover {
		color: #705ED1;
	}

	a.external-link img {
		position: absolute;
		right: 0;
		top: 0;
		width: 15px;
	}

/* Dropdown menu button
------------------------------------------------------------ */

.btn-default {
	border-radius: 0;
	border-color: #C8CACE;
	font-size: 14px;
	font-weight: 400;
	color: #76787A;
	padding: 7px 30px 7px 15px;
}

	.btn-default span.project-current {
		min-width: 120px;
		display: inline-block;
		text-align: left;
	}

	.btn-default .caret {
		position: absolute;
		right: 15px;
		top: 15px;
	}

.dropdown-menu {
	border-radius: 0;
	padding: 0;
}

	.dropdown-menu>li>a {
		font-size: 15px;
		padding: 10px 20px;
		text-decoration: none;
		cursor: pointer;
	}

		.dropdown-menu>li>a:hover {
			color: #E2002B;
		}


#puntmeting-switch {
	display: block;
	width: 100%;
	clear: both;
	float: left;
	margin-bottom: 25px;
}

	.puntmeting-current {

	}

	 #puntmeting-switch > .btn {
	 	width: 100%;
	 	font-size: 12px;
	 	text-align: left;
	 }

	 	#puntmeting-switch .dropdown-menu {
	 		width: 100%;
	 	}

	 	#puntmeting-switch .dropdown-menu>li>a {
	 		font-size: 12px;
	 	}

	 	.puntmeting-current span:first-child,
	 	#puntmeting-switch .dropdown-menu>li>a span {
	 		display: inline-block;
	 		margin-right: 10px;
	 		font-size: 15px;
	 		font-family: 'Kievit-Medium', Verdana, Helvetica, Arial, Tahoma, sans-serif;
	 		font-weight: 700;
	 		color: #E2002B;
	 	}

/* Address
------------------------------------------------------------ */

.address-row {

}

.address {
	margin-bottom: 20px;
}

	.address span {
		display: block;
		color: #76787A;
		font-size: 16px;
	}

	.address-street {

	}

	.address-zipcode {
		margin-bottom: 10px;
	}

	.address a {
		display: block;
		color: #000;
		text-decoration: none;
	}

		.address a:hover {
			color: #705ED1;
		}

.address-img {
	display: block;
	height: 140px;
	margin-bottom: 20px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	-webkit-background-size: cover;
}

	.address .address-linkedin {
		display: inline-block;
		margin-top: 8px;
	}
		.address .address-linkedin img {
			width: 18px;
		}

/* Buttons and pagination
------------------------------------------------------------ */
.button,
.pagination-container a,
.pagination-container button {
	background-color: #705ED1;
	color: #fff!important;
	font-weight: 600;
	letter-spacing: 2px;
	line-height: 18px;;
	display: inline-block;
	padding: 15px 25px;
	border: none;
	text-align: center;
	text-decoration: none;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}

.pagination-container a,
.pagination-container button {
	width: 160px;
}

.button:focus,
.button:hover,
.pagination-container a:focus,
.pagination-container a:hover,
.pagination-container button:focus,
.pagination-container button:hover {
	background: #5846B8;
	color: #fff;
	text-decoration: none!important;
}

	.button[disabled] {
		background: #76787A;
	}

/* Header
------------------------------------------------------------ */

.header-background {
	position: absolute;
	top: 80px;
	left: 0;
	width: 100%;
	height: 350px;
	background-image: url( 'assets/img/header.jpg' );
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    -webkit-background-size: cover;
    z-index: 0;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 65%, 0% 100%);
	clip-path: polygon(0 0, 100% 0, 100% 65%, 0% 100%);
}

#header {
	position: relative;
	z-index: 2;
	width: 100%;
	background-color: #fff;
	height: 80px;
	padding: 20px 35px;
	border-top: 4px solid #E2002B;
}

	#header .title-area {
		display: inline-block;
		margin: 5px 0;
		float: left;
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}

		#header .title-area img {
			width: 368px;
		}

	#header #project-switch {
		display: none;
	}
		#header #project-switch.visible {
			display: inline-block;
			margin-left: 25px;
		}

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

		body {
			background-color: #fff;
			background-image: none;
		}

		#header {
			padding: 10px 10px;
			height: 50px;
		}

			#header .title-area {
				margin: 0;
			}

			#header .title-area img {
				width: 220px;
			}

		#menu-mainmenu {
			margin: 0!important;
		}

		#header #project-switch {
			position: absolute;
			top: 5px
		}

		.header-background {
			top: 50px;
			height: 100px;
		}

		#content {
			margin-top: 100px;
		}

	}

	@media only screen and (min-width : 769px ) {

		#menu-mainmenu {
			list-style: none;
			float: right;
			margin: 5px 0 0 0;
		}

			#menu-mainmenu li {
				display: inline-block;
				margin: 0 15px;
				-webkit-transition: all .3s ease-in-out;
				-moz-transition: all .3s ease-in-out;
				-ms-transition: all .3s ease-in-out;
				-o-transition: all .3s ease-in-out;
				transition: all .3s ease-in-out;
			}

				#menu-mainmenu li a {
					display: inline-block;
					font-size: 16px;
					font-weight: 600;
					letter-spacing: 1px;
					color: #76787A;
					text-decoration: none;
					text-transform: uppercase;
					border-bottom: 2px solid transparent;
				}

					#menu-mainmenu li a:hover,
					#menu-mainmenu li.current-menu-item a,
					#menu-mainmenu li.current-page-ancestor a {
						color: #000;
						border-bottom: 2px solid #E2002B;
					}

	}

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

		#header #project-switch {
			position: absolute;
			left: 0px;
			top: 65px
		}

	}

	.hamburger {
		display: none;
	}

	@media only screen and (min-width : 769px ) {

		#menu-mainmenu-holder {
			display: inline!important;
		}

	}

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

		#menu-mainmenu-holder { display: none; z-index:1000000; font-weight:bold; font-size:0.8em; width:100%; background:#fff; position:absolute; left: 0; top: 45px; text-align:center; font-size:12px;}
		#menu-mainmenu-holder ul { margin: 0; padding: 0;  border-top:#dddddd 1px solid; list-style-type: none; list-style-image: none;}
		#menu-mainmenu-holder li { display: block; border-bottom:#dddddd 1px solid;}
		#menu-mainmenu-holder ul li a { display: block; padding:10px 0; text-decoration:none;  margin: 0px; color:#76787A;}
		#menu-mainmenu-holder ul li a:hover {  color: #000; text-decoration:none;}

		.hamburger {
			display: inline-block;
			position: absolute;
			right: 15px;
			top: 15px;
		}

		.hamburger .line{
			width: 17px;
			height: 3px;
			background-color: #000;
			display: block;
			margin: 2px auto;
			-webkit-transition: all 0.3s ease-in-out;
			-o-transition: all 0.3s ease-in-out;
			transition: all 0.3s ease-in-out;
		}

		.hamburger:hover{
			cursor: pointer;
		}

			.hamburger.is-active{
				-webkit-transform: rotate(90deg);
				-ms-transform: rotate(90deg);
				-o-transform: rotate(90deg);
				transform: rotate(90deg);
			}

			.hamburger.is-active .line:nth-child(2){
				-webkit-transition: none;
				-o-transition: none;
				transition: none;
			}

			.hamburger .line:nth-child(2){
				-webkit-transition-delay: 0.3s;
				-o-transition-delay: 0.3s;
				transition-delay: 0.3s;
			}


			.hamburger.is-active .line:nth-child(2){
				opacity: 0;
			}

			.hamburger.is-active .line:nth-child(1),
			.hamburger.is-active .line:nth-child(3){
				width: 15px;
				-webkit-transform-origin: right;
				-moz-transform-origin: right;
				-ms-transform-origin: right;
				-o-transform-origin: right;
				transform-origin: right;
			}

			.hamburger.is-active .line:nth-child(1){
				-webkit-transform: translateY(6px) rotate(45deg);
				-ms-transform: translateY(6px) rotate(45deg);
				-o-transform: translateY(6px) rotate(45deg);
				transform: translateY(6px) rotate(45deg);
			}

			.hamburger.is-active .line:nth-child(3){
				-webkit-transform: translateY(-6px) rotate(-45deg);
				-ms-transform: translateY(-6px) rotate(-45deg);
				-o-transform: translateY(-6px) rotate(-45deg);
				transform: translateY(-6px) rotate(-45deg);
			}

		}

/* Forms
------------------------------------------------------------ */

	#loginForm {
		max-width: 400px;
		margin: 0 auto;
	}

		#loginForm > p {
			font-size: 14px;
		}

	.inn_errors {
		margin: 10px 0 16px;
		padding: 10px;
	}

		.inn_errors .error {
			display: block;
			color: #E2002B;
		}
			.inn_errors .error strong {
				color: #E2002B!important;
			}

	#inn_login_form {

	}

	#inn_login_form fieldset p,
	#edit-profile fieldset p {
		position: relative;
		margin-bottom: 16px;
		margin-top: 0!important;
	}
		#inn_login_form fieldset p span.required {
			position: absolute;
			z-index: 1;
			color: #FFA2B4;
			pointer-events: none;
			top: 18px;
			right: 15px;
		}

	#edit-profile fieldset label {
		display: none;
	}

	#inn_login_form input[type=text],
	#inn_login_form input[type=email],
	#inn_login_form input[type=password],
	#edit-profile input[type=text],
	#edit-profile input[type=email],
	#edit-profile input[type=password],
	.add_person input[type=text],
	.add_person input[type=email],
	.add_project input[type=text] {
		width: 100%;
		background-color: #fff;
		color: #000!important;
		font-size: 14px!important;
		font-weight: 700;
		padding: 13px 10px 13px 50px !important;
		border: 1px solid rgba(0, 0, 0, 0.2);
	}

		#inn_login_form input#inn_user_login,
		.add_person input[type=text] {
			background-image: url(images/placeholder-img-name-dark.png)!important;
			background-repeat: no-repeat;
			background-size: 15px 19px;
			background-position: 17px 15px;
		}

		#inn_login_form input#inn_user_login {
			background-image: url(images/placeholder-img-email-dark.png)!important;
			background-size: 16px 13px;
			background-position: 15px 18px;
		}

		.add_project input[type=text] {
			background-image: url(images/placeholder-img-new-project-dark.png)!important;
			background-repeat: no-repeat;
			background-size: 19px 19px;
			background-position: 15px 15px;
		}

		.add_project .option {
			margin-bottom: 10px;
		}

		#edit-profile #inn_user_email,
		.add_person input[type=email] {
			background-image: url(images/placeholder-img-email-dark.png)!important;
			background-repeat: no-repeat;
			background-size: 16px 13px;
			background-position: 15px 18px;
		}

		#inn_login_form input[type=password],
		#edit-profile input[type=password] {
			background-image: url(images/placeholder-img-password-dark.png)!important;
			background-repeat: no-repeat;
			background-size: 14px 19px;
			background-position: 17px 15px;
		}

		#inn_login_form ::-webkit-input-placeholder {
			color: rgba(0, 0, 0, 0.5); }

		#inn_login_form :-moz-placeholder {
			/* Firefox 18- */
			color: rgba(0, 0, 0, 0.5); }

		#inn_login_form ::-moz-placeholder {
			/* Firefox 19+ */
			color: rgba(0, 0, 0, 0.5); }

		#inn_login_form :-ms-input-placeholder {
			color: rgba(0, 0, 0, 0.5); }

	#inn_login_form input[type=submit],
	#header_upload_form input[type="submit"] {
		display: block;
		width: 100%;

		position: relative;
		z-index: 1;
		font-size: 16px;
		font-family: 'Source Sans Pro', serif;
		font-weight: 600;
		line-height: 26px;
		color: #fff!important;
		text-align: center;
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		border-radius: 0;
		border: 1px solid;
		border-color: #705ED1;
		text-decoration: none;
		text-transform: none;
		text-shadow: none;
		opacity: 1;
		padding: 10px 30px 12px;
		background-color: #705ED1;
		background: #705ED1; /* Old browsers */
		-webkit-appearance: none;
		-moz-appearance: none;
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}

		#inn_login_form input[type=submit]:hover {
			color: #fff!important;
			background: #5846B8;
			background-color: #5846B8;
			border-color: #5846B8;
			text-decoration: none!important;
		}


/* Accordion
------------------------------------------------------------ */

.accordion {
	padding: 0 0 40px;
	margin: 0;
}

.accordion > li {
	list-style: none;
	border-bottom: 1px solid #E9E9E9;
	position: relative;
	padding: 15px 0;
}

.accordion > li > h3 {
	margin-bottom: 0;
	cursor: pointer;
}

.accordion > li:after {
	position: absolute;
	right: 10px;
	top: 10px;
    font-family: dashicons;
	font-size: 20px;
	color: #1C1C45;
	content: "\f347";
}

.accordion > li div {
	padding: 15px 0 0 0;
}

/* Survey
------------------------------------------------------------ */
.theme-intro {
	background-color: #F1F1F1;
	padding: 30px 30px;
	margin: 0 0 45px 0;
}

.theme-intro h2 {
	margin-bottom: 0;
}

.theme-intro p {
	margin-bottom: 0;
}

.radio-list {
	list-style: none;
	padding: 0;
	margin-bottom: 25px;
}

	.radio-list li {
		position: relative;
		padding: 0 0 0 30px;
	}

		.radio-list li label {
			font-weight: 400;
		}

		.radio-list li input[type="radio"] {
			position: absolute;
			left: 0;
			top: 2px;
		}


input[type="text"] {
	color: rgba(39, 44, 66, 1);
	padding: 5px 10px !important;
	border: 1px solid #C8CACE;
}

textarea {
	color: rgba(39, 44, 66, 1);
	font-size: 17px;
	width: 100% !important;
	height: 128px;
	background-color: transparent;
	-webkit-box-shadow: none;
	box-shadow: none;
	margin-bottom: 25px;
	border: 1px solid #C8CACE;
	padding: 10px 10px !important;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	outline: 0;
}

	textarea#finished_text {
		margin-bottom: 0;
	}

	#example_mail textarea {
		margin: 10px 0px 5px;
		height: 220px;
	}

	#example_mail p {
		font-size: smaller;
	}

#inn_login_form input[type=text]:-webkit-autofill,
#inn_login_form input[type=email]:-webkit-autofill,
#inn_login_form input[type=password]:-webkit-autofill,
#edit-profile input[type=text]:-webkit-autofill,
#edit-profile input[type=email]:-webkit-autofill,
#edit-profile input[type=password]:-webkit-autofill,
.add_person input[type=text]:-webkit-autofill,
.add_person input[type=email]:-webkit-autofill,
.add_project input[type=text]:-webkit-autofill
input:-webkit-autofill {
  padding-left: 10px!important;
}

/* Error handling
------------------------------------------------------------ */
.error_handling .error {
	display: block;
	background-color: #FFD3DC;
	border: 2px solid #E2002B;
	padding: 15px;
	color: #E2002B;
	margin-bottom: 20px;

	/* Animation */
	animation: shake 150ms 2 linear;
	-moz-animation: shake 150ms 2 linear;
	-webkit-animation: shake 150ms 2 linear;
	-o-animation: shake 150ms 2 linear;
}

/* Succes handling
------------------------------------------------------------ */
.succes_handling .succes {
	display: block;
	background-color: #CBFCBC;
	border: 2px solid #46B125;
	padding: 15px;
	color: #46B125;
	margin-bottom: 20px;

	/* Animation */
	animation: shake 150ms 2 linear;
	-moz-animation: shake 150ms 2 linear;
	-webkit-animation: shake 150ms 2 linear;
	-o-animation: shake 150ms 2 linear;
}

/* Animations
------------------------------------------------------------ */
@keyframes shake {
	0% {
		transform: translate( 5px, 0 );
	}
	50% {
		transform: translate( -5px, 0 );
	}
	100% {
		transform: translate( 0, 0);
	}
}

@-moz-keyframes shake {
	0% {
		-moz-transform: translate( 5px, 0 );
	}
	50% {
		-moz-transform: translate( -5px, 0 );
	}
	100% {
		-moz-transform: translate( 0, 0 );
	}
}

@-webkit-keyframes shake {
	0% {
		-webkit-transform: translate( 5px, 0 );
	}
	50% {
		-webkit-transform: translate( -5px, 0 );
	}
	100% {
		-webkit-transform: translate( 0, 0 );
	}
}

@-ms-keyframes shake {
	0% {
		-ms-transform: translate( 5px, 0 );
	}
	50% {
		-ms-transform: translate( -5px, 0 );
	}
	100% {
		-ms-transform: translate( 0, 0 );
	}
}

@-o-keyframes shake {
	0% {
		-o-transform: translate( 5px, 0 );
	}
	50% {
		-o-transform: translate( -5px, 0 );
	}
	100% {
		-o-transform: translate( 0, 0 );
	}
}

@keyframes fade {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

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


	.toggle-box-container {
		position: relative;
		padding-bottom: 15px;
		border-bottom: 1px solid #CFCFCF;
	}
		.row-chart-container.toggle-box-container {
			border-bottom: none;
			padding-bottom: 0;
		}

		.toggle-box-trigger {
			position: absolute;
			right: 0;
			top: 0;
			display: inline-block;
			width: 100%;
			text-align: right;
			font-size: 14px;
			padding: 6px 0;
			font-weight: 700;
			line-height: 7px;
			-webkit-transition: all .3s ease-in-out;
			-moz-transition: all .3s ease-in-out;
			-ms-transition: all .3s ease-in-out;
			-o-transition: all .3s ease-in-out;
			transition: all .3s ease-in-out;
			cursor: pointer;
		}
			.toggle-box-trigger:hover {
				color: #E2002B;
			}

			.chart-description .toggle-box-trigger {
				padding: 17px 15px;
			}


		.toggle-box-container .toggle-box-content {
			max-height: 0;
			border-bottom: none;
			overflow: hidden;
			-webkit-transition: all .3s ease-in-out;
			-moz-transition: all .3s ease-in-out;
			-ms-transition: all .3s ease-in-out;
			-o-transition: all .3s ease-in-out;
			transition: all .3s ease-in-out;
		}

			.row-chart-container  .toggle-box-content {
				border-top: 1px solid #EBEBEB;
			}

			.toggle-box-container.open .toggle-box-content {
				max-height: 999px;
			}

}

/* Charts
------------------------------------------------------------ */
.row-chart-container {
	position: relative;
	margin-top: 15px;

	-webkit-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.1);
	box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.1);

	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}

.row-chart {
	width: 100%;
	position: relative;
	text-align: center;
	border-bottom: 1px solid #EBEBEB;
}

.row-chart > div {
	float: left;
	width: 25%;
}

.row-chart > div:nth-child( odd ) {
	background-color: #FAFAFA;
}

.row-chart .chart-label {
	position: relative;
	margin-bottom: 10px;
	font-size: 10px;
	margin-top: 10px;
}

.row-chart .chart-container {
	position: relative;
	height: 120px;
	margin-top: 30px;
}

.row-chart .chart-container .row-chart-bar,
.row-chart .chart-container .row-chart-bar-previous {
	height: 100%;
	bottom: 0;
	position: absolute;
	width: 100%;
	min-height: 1%;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}

	.row-chart .chart-container .row-chart-bar-previous {
		margin-left: 15%;
		width: 50%;
	}

		.row-chart .chart-container .row-chart-bar-previous > img {
			position: absolute;
			left: 0px;
			bottom: 0px;
			-webkit-border-radius: 2px;
			-moz-border-radius: 2px;
			border-radius: 2px;
		}

.row-chart .chart-container .row-chart-bar > div {
	padding-bottom: 5px;
	width: 100%;
	font-weight: bold;
	color: #1C1C45;
	position: absolute;
}

.row-chart .chart-container .row-chart-bar > img {
	position: absolute;
	width: 50%;
	margin-left: 25%;
	left: 0px;
	bottom: 0px;
	min-height: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}

.chart-description {
	background: #FFFFFF;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	padding: 10px 20px;
	color: #76787A;
	font-size: 14px;
}

	.chart-description strong {
		color: #000000;
	}



/* Result right column
------------------------------------------------------------ */

.result-right-block {
	margin-bottom: 35px;
}

	.result-right-block p,
	.result-right-block li {
		font-size: 14px;
	}

	.result-right-block a {
		cursor: pointer;
		color: #705ED1;
	}
		.result-right-block a:hover { color: #000; }

.project-status {

}

.project-notes textarea {
	margin-bottom: 0;
	height: 155px;
}

	#barometer-indicator {
		position: relative;
		display: inline-block;
		margin-top: 15px;
		margin-bottom: 20px;
	}

		#barometer-background {
			position: relative;
			z-index: 1;
			width: 225px;
		}

		#barometer-arrow {
			position: absolute;
			z-index: 2;
			bottom: -20px;
			left: 50%;
			width: 60px;
			-webkit-transform: translateX(-50%);
			-ms-transform: translateX(-50%);
			transform: translateX(-50%);
			-webkit-transform-origin: 50% 50%;
			-moz-transform-origin: 50% 50%;
			-ms-transform-origin: 50% 50%;
			-o-transform-origin: 50% 50%;
			transform-origin: 50% 50%;
			-webkit-transition: all .3s ease-in-out;
			-moz-transition: all .3s ease-in-out;
			-ms-transition: all .3s ease-in-out;
			-o-transition: all .3s ease-in-out;
			transition: all .3s ease-in-out;
		}

			/*.project-status.very-good #barometer-arrow { -ms-transform: translateX(-50%) rotate(-75deg); -webkit-transform: translateX(-50%) rotate(-75deg); transform: translateX(-50%) rotate(-75deg); }*/
			/*.project-status.good #barometer-arrow { -ms-transform: translateX(-50%) rotate(-28deg); -webkit-transform: translateX(-50%) rotate(-28deg); transform: translateX(-50%) rotate(-28deg); }*/
			/*.project-status.bad #barometer-arrow { -ms-transform: translateX(-50%) rotate(28deg); -webkit-transform: translateX(-50%) rotate(28deg); transform: translateX(-50%) rotate(28deg); }*/
			/*.project-status.very-bad #barometer-arrow { -ms-transform: translateX(-50%) rotate(75deg); -webkit-transform: translateX(-50%) rotate(75deg); transform: translateX(-50%) rotate(75deg); }*/

	.project-status h5 {
		font-size: 40px;
		font-weight: 400;
		line-height: 1;
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}

		h5.project-status-very-good,
		.green { color: #6BC50A !important; }
		h5.project-status-good,
		.yellow { color: #FFED00 !important; }
		h5.project-status-bad,
		.orange { color: #FFB81D !important; }
		h5.project-status-very-bad,
		.red { color: #D0011B !important; }

/* Settings
------------------------------------------------------------ */
.settings h2 {
	color: #76787A;
	margin: 20px 0;
}

.settings h3 {
	color: #000;
	font-size: 16px;
}

.settings h4 {
	color: #76787A;
	font-size: 16px;
}

.settings a {
	color: #705ED1;
	text-decoration: none;
	font-size: 15px;
	font-weight: bold;
	cursor: pointer;
	display: block;
	margin-top: 15px;
}

	.settings a:focus,
	.settings a:hover {
		color: #5846B8;
		text-decoration: none;
	}

.reminder,
.project-phase,
.project-settings,
.open-questions {
	padding: 30px;
	background: #FFFFFF;
	-webkit-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.1);
	box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.1);
	margin-bottom: 50px;
}

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

	.reminder,
	.project-phase,
	.project-settings,
	.open-questions {
		padding: 15px;
	}

}

	.open-questions {
		margin-top: 30px;
	}

		.open-questions h3 {
			margin-bottom: 25px;
		}

		.open-questions h4 {
			-webkit-transition: all .3s ease-in-out;
			-moz-transition: all .3s ease-in-out;
			-ms-transition: all .3s ease-in-out;
			-o-transition: all .3s ease-in-out;
			transition: all .3s ease-in-out;
			cursor: pointer;
		}

			.open-questions h4:hover {
				color: #E2002B;
			}

	.smallMargin {
		margin-bottom: 15px;
	}

.reminder .option label {
	margin-left: 5px;
	font-size: 14px;
}

.project-settings label {
	font-size: 14px;
}

.project-settings #header_upload_form .header-image a,
.project-settings #header_upload_form #header_image {
	margin-bottom: 15px;
}

.project-phase .option {
	margin-bottom: 10px;
	font-size: 14px;
}

	.project-phase .option label {
		display: block;
	}

.question_list {
	list-style: none;
	padding: 0;
	margin: 0 0 50px 0;
	background: #FFFFFF;
	box-shadow: 0 6px 24px 0 rgba(117,119,122,0.20);
}

.user_list,
.project_list {
	width: 100%;
}

.user_list.border {
	border: 1px solid #EBEBEB;
	margin-bottom: 10px;
}

.question_list > li,
.user_list td,
.project_list td {
	position: relative;
	padding: 10px 30px;
	color: #000000;
}

.question_list > li::before {
    font-family: dashicons;
	font-size: 14px;
	line-height: 28px;
	color: #CFCFCF;
	content: "\f345";
	position: absolute;
}

.question_list > li strong {
	padding-left: 30px;
	cursor: pointer;
	display: block;
}

.question_list > li small {
	cursor: pointer;
	display: block;
	padding-left: 20px;
	line-height: 10px;
}

.question_list > li:nth-child(even),
.user_list tr:nth-child(even),
.project_list tr:nth-child(even) {
	background-color: #F8F8F8;
}

.question_list > li:nth-child(odd),
.user_list tr:nth-child(odd),
.project_list tr:nth-child(odd) {
	background-color: #FFFFFF;
}

	.question_list > li ul li {
		list-style: none;
		font-size: 14px;
		padding-top: 5px;
	}

		.question_list > li ul li label {
			margin-left: 5px;
			display: inline;
			color: #76787A;
		}

		.question_list .question_required {
			font-weight: bold;
			color: #705ED1;
		}

.user_list tr td,
.project_list tr td {
	color: #9B9B9B;
	font-style: italic;
	font-size: 14px;
}

.user_list tr td:first-child,
.project_list tr td:first-child {
	font-style: normal;
	color: #000000;
	font-weight: 600;
}

.user_list tr td:last-child,
.project_list tr td:last-child {
	padding: 0;
	margin: 0;
}

.user_list span.delete_user,
.project_list span.delete_project {
	display: inline-block;
	float: left;
	width: 11px;
	height: 11px;
	background-image: url( assets/img/delete.png );
	background-repeat: no-repeat;
	background-size: 11px 11px;
	text-indent: -999999px;
	font-weight: bold;
	font-style: normal;
	color: #E2002B;
	font-size: 24px;
	cursor: pointer;
}

.user_list .add_person td,
.project_list .add_project td {
	background-color: #FFFFFF;
	padding: 25px 30px 30px !important;
}

	.user_list tr td input,
	.project_list tr td input {
		width: 100%;
		display: block;
		padding: 5px 15px;
		margin-bottom: 10px;
	}

		.user_list tr td input::-webkit-input-placeholder,
		.project_list tr td input::-webkit-input-placeholder, {
			color: #CFCFCF;
			font-size: 14px;
		}
		.user_list tr td input::-moz-placeholder,
		.project_list tr td input::-moz-placeholder {
			color: #CFCFCF;
			font-size: 14px;
		}
		.user_list tr td input:-ms-input-placeholder,
		.project_list tr td input:-ms-input-placeholder {
			color: #CFCFCF;
			font-size: 14px;
		}
		.user_list tr td input:-moz-placeholder,
		.project_list tr td input:-moz-placeholder {
			color: #CFCFCF;
			font-size: 14px;
		}

	.add_person.blocked a {
		margin: 0;
		display: inline;
	}

.address_list table,
.projects table {
	background: #FFFFFF;
	box-shadow: 0 6px 24px 0 rgba(117,119,122,0.20);
}

/* Switch button */
.switch-button {
	cursor: pointer;
	position: absolute;
	top: 16px;
	right: 20px;
}

.switch-button .button-bg {
	width: 25px;
	height: 14px;
	background-color: #E2002B;
	padding: 2px 0 0 2px;
	transition:all 0.2s ease;

	-webkit-border-radius: 1px;
	-moz-border-radius: 1px;
	border-radius: 1px;
}

.switch-button .button-switch {
	position: relative;
	left: 0px;
	width: 10px;
	height: 10px;
	background-color: #FFFFFF;
	transition: all 0.2s ease;

	-webkit-border-radius: 1px;
	-moz-border-radius: 1px;
	border-radius: 1px
}

.switch-button.button-active .button-switch {
	left: 11px;
}

.switch-button .button-in,
.switch-button .button-out {
	position: absolute;
	transition: all 0.2s ease;
}

.switch-button.button-active .button-bg {
	background-color:#7ED321;
}

/* Footer
------------------------------------------------------------ */

footer.site-footer {
	position: relative;
	width: 100%;
	clear: both;
	float: left;
	background-color: #fff;
	padding: 115px 0 80px 0;
}

.mobile #subscribe {
	margin-bottom: 0!important;
}

.mobile footer.site-footer {
	position: relative;
	bottom: auto;
}

	ul.dot-list {
		margin-bottom: 25px!important;
	}

	ul.dot-list li {
		position: relative;
		list-style-type: none;
		margin: 0;
		color: #000;
		padding: 0 0 0 30px;
		font-size: 16px;
	}

		ul.dot-list li:before {
			content: "•";
			position: absolute;
			left: 10px;
			top: 2px;
			font-size: 15px;
		}

	/* Footer Widgets
	------------------------------------------------------------ */

	#footer-widgets {
		margin-bottom: 32px;
	}

		#footer-logo {
			display: inline-block;
			width: 166px;
			margin-bottom: 20px;
		}
			#footer-logo img {
				float: left;
				width: 166px;
			}

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

		footer.site-footer .text-right {
			text-align: center;
		}

		footer.site-footer {
			padding-top: 55px;
			padding-bottom: 30px;
		}

		#footer-widgets {
			margin-bottom: 20px;
		}

	}

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

		#footer-widgets .col-xs-4 {
			width: 50%;
		}

	}

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

		#footer-widgets .col-xs-4 {
			width: 100%;
		}

	}

	/* Footer Nav
	------------------------------------------------------------ */

	footer.site-footer nav {
		display: inline-block;
	}

	#menu-footermenu {
		list-style: none;
	}

		#menu-footermenu li {
			float: left;
			font-size: 14px;
			color: #C8CACE;
			line-height: 14px;
			padding: 0 10px;
		}
			#menu-footermenu li:first-child {
				padding-left: 0;
			}

			#menu-footermenu li a {
				color: #C8CACE;
				text-decoration: none;
			}
				#menu-footermenu li a:hover {
					color: #000;
					text-decoration: underline;
				}

	.website-by {
		font-size: 14px;
		line-height: 22px;
		color: #C8CACE;
		text-align: right;
	}

		.website-by a {
			color: #C8CACE;
			text-decoration: none;
		}

        .website-by a:hover {
        	color: #000;
            text-decoration: underline;
        }

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

		.website-by {
			text-align: left;
		}

	}

/* Blog */
.blog .wp-post-image {
	height: 100%;
	object-fit: cover;
	max-height: 50vh;
}

.blog .barometer-content {
	padding: 0 25px;
}

.blog .barometer-content .row::before {
	margin-top: 30px;
}

.blog .barometer-content .row {
	margin-bottom: 60px;
	position: relative;
	clear: both;
}

.blog .barometer-content .row::after {
	width: 30vw;
	height: 2px;
	border-radius: 50%;
	background-color: #CFCFCF;
	left: 50%;
	bottom: -30px;
	margin-left: -15vw;
	position: absolute;
}

.blog .pagination {
	clear: both;
	width: 100%;
}

.blog .pagination .nav-previous {
	float: right;
}

.blog .pagination .nav-next {
	float: left;
}

@media only screen and (max-width: 767px) {
	.blog .barometer-content h2 {
		margin-top: 1.5rem;
	}
}

.single-post .wp-post-image {
	width: 100%;
	object-fit: cover;
	height: 50vh;
}

.single-post .barometer-content img {
	height: auto;
}