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

	body{
		font-family: 'Roboto', 'Open Sans', sans-serif;;
background-color: #000000;
background-position: center 80px;
background-size: cover;
background-repeat: no-repeat;
background-attachment: scroll;

		background-image: url("http://survey.wehaa.net/flexeditor/default/flexeditor/images/background.jpg");
	}

	.gutter-l{
		padding-left: 20px;
	}
	.gutter-r{
		padding-right: 0;
	}

	.w-box-radius{
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
	}
	.w-box-padding{
		padding: 20px 20px 20px 20px;;
	}

	ul{
		list-style: none;
	}

	.img-fluid,
	.img-thumbnail {
		width: 100%;
	}

	/*****************************************************************************************
	SURVEY BODY
	******************************************************************************************/
	.main-body-wrapper {
		/* min-height: 100%;*/

		/* Equal to height of footer */
		/* But also accounting for potential margin-bottom of last child */
		/* margin-bottom: -165px;*/
	}

	/*****************************************************************************************
	SURVEY HEADER
	******************************************************************************************/
	header.header{
		margin-top: 20px;
margin-bottom: 30px;
background-color: #ffffff;
display: show;

		height: 80px;
		line-height: 80px;
	}
	header.header .logo{
		background-position: center center;
background-size: contain;
background-repeat: no-repeat;
width: 320px;
height: 80px;
margin: 0 auto 0 auto;

hyperlink-target: ['Header']['logo']['hyperlink-target'];

		background-image: url("http://survey.wehaa.net/flexeditor/default/flexeditor/images/header-logo.png");
	}
	header.header .logo a{
		display: block;
		width: 100%;
		height: 100%;
	}
	header.header .logo-tablet{
		background-position: center center;
background-size: contain;
background-repeat: no-repeat;
height: 80px;

		background-image: url("http://survey.wehaa.net/flexeditor/default/flexeditor/images/header-logo.png");
	}
	header.header .logo-mobile{
		background-position: center center;
background-size: contain;
background-repeat: no-repeat;
height: 80px;

		background-image: url("http://survey.wehaa.net/flexeditor/default/flexeditor/images/header-logo.png");
	}

	/*****************************************************************************************
	FOOTER
	******************************************************************************************/
	.footer-push{
		height: 165px;
	}
	footer.footer{
		height: 165px;
color: #fff;
margin-top: 65px;
background-color: #000000;
display: show;

	}
	footer.footer .container{
		height: 100%;
	}
	footer.footer .footer-wrapper{
		height: 100%;
background-color: #000000;
padding-top: 20px;
padding-bottom: 20px;

	}
	footer.footer .logo{
		background-position: center center;
background-size: contain;
width: 320px;
height: 80px;
margin: 0 auto 0 auto;

		background-image: url("http://survey.wehaa.net/flexeditor/default/flexeditor/images/footer-logo.png");
		background-repeat: no-repeat;
	}
	footer.footer .logo a{
		display: block;
		width: 100%;
		height: 100%;
	}
	footer.footer .logo-mobile{
		background-image: url("http://survey.wehaa.net/flexeditor/default/flexeditor/images/footer-logo.png");
	}



	/*****************************************************************************************
	SURVEY INDEX
	******************************************************************************************/
	.survey-header-title{
		display: -webkit-box;
    	-webkit-line-clamp: 1;
    	-webkit-box-orient: vertical;
    	white-space: normal;

		color: #ffffff;
font-size: 50px;
font-weight: bold;
line-height: 100px;
text-align: center;
background-color: #687789;
html: HEADER TITLE HERE;
display: show;

	}

	.survey-index{
		margin: 20px 0 0 0;
	}
	.survey-item{
		padding-left: 0;
		margin-bottom: 15px;
	}
	.survey-item:nth-child(3n+0){
		padding-right: 0;
	}
	.survey-item-wrapper{
		background-color: #ffffff;

	}
	.survey-item-thumb{
		min-height: 140px;
	}
	.survey-item-image{
		margin-bottom: 15px;
		width: 100%;
		height: 210px;
	}
	.survey-item-text{
		margin-bottom: 15px;
		height: 130px;
	}
	.survey-item-top-info{
		margin: 0 0 20px 0;

	}
	.survey-item-type{
		font-family: inherit;
font-size: 16px;
line-height: 19px;
font-weight: bold;
color: #556271;

	}
	.survey-item-title a{
		display: -webkit-box;
    	-webkit-line-clamp: 2;
    	-webkit-box-orient: vertical;
    	white-space: normal;

		font-family: inherit;
font-size: 24px;
line-height: 28px;
font-weight: bold;
color: #556271;
margin: 0;

	}
	.survey-item-title a:hover{
		color: #556271;
	}
	.survey-item-subtitle a{
		font-family: inherit;
font-size: 14px;
line-height: 16px;
font-weight: 500;
color: #556271;
margin: 0;

	}
	.survey-item-enddate{
		font-family: inherit;
font-size: 14px;
line-height: 19px;
color: #556271;

	}
	.survey-item-short-description{
		display: -webkit-box;
    	-webkit-line-clamp: 3;
    	-webkit-box-orient: vertical;
    	white-space: normal;

		font-family: inherit;
font-size: 14px;
line-height: 16px;
font-weight: 300;
color: #556271;
min-height: 50px;

	}
	.survey-item-buttons{
		border-top: none;
padding: 0;

	}
	.survey-item-vote-btn{
		font-family: inherit;
font-size: 16px;
line-height: 32px;
text-transform: uppercase;
color: #ffffff;
background-color: #0099d9;
border: inherit;

	}
	.survey-item-vote-btn:hover{
		color: #ffffff;
background-color: #0099d9;
border: inherit;

	}

	.survey-item-buttons .share{
		padding: 0;
		margin: 8px 0 0 0;
background-color: #fff;
font-size: 16px;
color: #556271;
color-hover: ['Survey item']['Share']['color-hover'];
text-align: left;

	}
	.survey-item-buttons .share .share-title{
		float: left;
		margin: 6px 10px 0 0;

	}
	.survey-item-buttons .share ul{
		margin: 0;
		padding: 0;
		float: right;
		font-size: 26px;

	}
	.survey-item-buttons .share ul li{
		display: inline-block;
		margin: 0 2px;
	}
	.survey-item-buttons .share ul li,
	.survey-item-buttons .share ul li a{
		color: #556271;
	}
	.survey-item-buttons .share ul li:hover,
	.survey-item-buttons .share ul li a:hover{
		color: inherit;
	}



	/*****************************************************************************************
	AUTOCOMPLETE
	******************************************************************************************/
	.twitter-typeahead{
        width: 100%;
    }
    .typeahead,
    .tt-query,
    .tt-hint {
      width: 396px;
      height: 30px;
      padding: 8px 12px;
      font-size: 24px;
      line-height: 30px;
      border: 2px solid #ccc;
      -webkit-border-radius: 8px;
         -moz-border-radius: 8px;
              border-radius: 8px;
      outline: none;
    }

    .typeahead {
      background-color: #fff;
    }

    .typeahead:focus {
      border: 2px solid #687789;
    }

    .tt-query {
      -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
         -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
              box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    }

    .tt-hint {
      color: #999
    }

    .tt-menu {
      width: 422px;
      margin: 12px 0;
      padding: 8px 0;
      background-color: #fff;
      border: 1px solid #ccc;
      border: 1px solid rgba(0, 0, 0, 0.2);
      -webkit-border-radius: 8px;
         -moz-border-radius: 8px;
              border-radius: 8px;
      -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
         -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
              box-shadow: 0 5px 10px rgba(0,0,0,.2);
    }

    .tt-suggestion {
      padding: 3px 20px;
      font-size: 18px;
      line-height: 24px;
    }

    .tt-suggestion:hover {
      cursor: pointer;
      color: #fff;
      background-color: #687789;
    }

    .tt-suggestion.tt-cursor {
      color: #fff;
      background-color: #687789;

    }

    .tt-suggestion p {
      margin: 0;
    }

	/*****************************************************************************************
	RESPONSIVE
	******************************************************************************************
	/* T A B L E T */
	@media  all and ( min-width: 576px ) and ( max-width: 960px ) {
		header.header{
			margin-top: 20px;
margin-bottom: 30px;

			height: 80px;
			line-height: 80px;
		}

		.survey-header-title{
			font-size: 35px;
line-height: 100px;

		}
	}

	/* M O B I L E */
	@media  all and ( max-width: 576px ) {
		.gutter-l{
			padding-left: 0;
		}
		.gutter-r{
			padding-right: 0;
		}

		.survey-item{
			padding-left: 0;
			padding-right: 0;
		}

		header.header{
			margin-top: 20px;
margin-bottom: 30px;

			height: 80px;
			line-height: 80px;
		}

		.survey-header-title{
			font-size: 25px;
line-height: 100px;

		}
	}