// REMOVE BORDERS
.section {
	&.votelist-letters, &.votelist-header {
		border:0;
	}
}

// VOTE LISTE HEADER
.votelist-header
{
    //background: #d1d6db url(../images/backgrounds/match-top.jpg) no-repeat right top ;
    //background:@primary-30-fallback url("../images/backgrounds/zone-right-kuber.png") no-repeat 606px -142px;
    background-color: @primary-30;
    background-color: @primary-30-fallback;
    background-size: 53% auto;
    padding: 10px;
    //height:104px;
    margin: 0 10px;

    div.section
    {
        border-bottom: 0;
    }

    &.votebackground
    {
        background: @primary none no-repeat 606px -142px;
        color: #FFF;

        a
        {
            color: #FFF;
            text-decoration: underline;

            &:hover
            {
                color: #FFF;
                text-decoration: underline;
            }
        }

        p, h2, span
        {
            color: #FFF;
        }
    }

    .meta-txt
    {
        font: 12px/1 "gibsonRegular","Arial",sans-serif;
        color: @primary-100-fallback;
        color: @primary-100;
        margin-top: -30px;
        padding-bottom: 24px;
    }

    &.item
    {
        border: none;
        padding-bottom: 10px;
    }

    h2
    {
        border: none;
        color: @primary-60-fallback;
        color: @primary-60;
        font: 24px/1 "gibsonRegular","Arial",sans-serif;
        padding: 20px 20px 0;
        text-transform: uppercase;

        span
        {
            display: block;
            font: 42px/1 "gibsonSemiBold","Arial Black",sans-serif;
            color: #000;
            text-transform: none;
        }
    }

    &.list
    {
        h2
        {
            padding: 10px 20px;
        }
    }

    p
    {
        &.a
        {
            padding-bottom: 30px;
            a
            {
                font-family:GibsonSemiBold;
                font-size:14px;
            }
        }

        padding: 10px 20px 10px;
        color: @secondary;
        font: 18px/20px "gibsonRegular","Arial",sans-serif;
        width: 90%;
    }
    /*.boxed-image {padding:10px !important;}
	*/
    .profile
    {
        background-color: @grey-20;

        &.boxed-image
        {
            padding: 10px !important;
        }

        a
        {
            color: #FFF;
        }

        .image-wrap
        {
            width: 70px !important;
            padding-right: 0 !important;

            ~ *
            {
                margin-left: 70px !important;
            }
        }

        .profile-img
        {

            .letter-color
            {
                position: absolute;
                top: 0;
                right: 0;
                z-index: 1000;
            }
        }

        div.meta
        {
            padding: 0px 8px 8px 8px;
            color: #FFF;
            font: 14px/17px "gibsonSemiBold","Arial Black",sans-serif;

            .title
            {
                color: @primary-100-fallback;
                color: @primary-100;
                font: 11px/13px "gibsonRegular","Arial",sans-serif;
                text-transform: uppercase;
                display: block;
            }
        }
    }
} // END VOTE LISTE HEADER

.boxed { 
    & > .votelist-header {
        margin: 0;
    }
    .viewMatchResult {
        .section.header {
            h2 {
                margin: 20px 0 0;
            }
        }
        .combine-layout {
            .span-12 {
                padding: 0;
            }
        }
    }
    &.section {
        .combine-layout {
            //margin-left: 0;
            //margin-right: 0;
        }
    }
    .match-result-all-elected-container {
        margin-left: -10px;
        margin-right: -10px;
        width: auto;
    }
    .set-answers-button-container {
        padding: 0 10px;
    }
}

.votelist-area {
    .candidate-list {
        div.display-all {
            button {
                background: none;
                &:hover {
                    background: none;
                }
                text-decoration: underline;
                color: @blue-font;
                &:before {
                    color: @primary;
                }

            }
            [class*="dr-icon-add open-true"]:before {
				content: "\f11e";
			}    
        }
    }
	.votepercent-container {
		
		.votepercent-value, .votepercent-text {
			max-width: 45%;
			text-align: center;
			display:inline-block;

		}
		.votepercent-value {
			float: right;
			margin-top: -10px;
		}
	}
}
// VOTELISTE LETTERS
.votelist-letters {
    span {
        &.txt {
            display: block;
            margin: 10px 0;
            font: 14px/16px "gibsonRegular","Arial",sans-serif;
            color: @secondary;

            a, a:link, a:visited {
                color: @secondary;
				text-decoration:underline;
            }
        }
    }

    .letters {
        background-color: @primary-30-fallback;
        background-color: @primary-30;
        padding:10px 0 10px 10px;

		&:after {
            clear: both;
            content: ".";
            visibility: hidden;
            height: 0;
            line-height: 0;
            display: block;
        }

        span, li a {
            //height: 32px;
            float: left;
            display: block;
        }
		li a {
			text-align: center;
		}

        span {
            color:@secondary;
            font: 14px/16px "gibsonRegular","Arial",sans-serif;
            text-transform: uppercase;
            margin: 0 15px 0 0;
			width:100%;
        }

        ul {
			display:block;
			float:left;
			width:100%;
			margin-top:10px;
            li {
                background: #000;
                float: left;
                height: 32px;
                margin-bottom: 10px;
                margin-right: 10px;
                width: 32px;
                a {
                    text-indent: -9999px;
                    //width: 32px;
                    color: #FFF;
                    font: 24px/32px "gibsonSemiBold","Arial Black",sans-serif;
                    margin: 0 10px 10px 0;

                    &:hover {
                        opacity: 0.60;
                    }

                    &.other {
                        width: 90px;
                        color: #000;
                    }
                }
            }

            
        }
    }
} // END // VOTELISTE LETTERS

// CANDIDATE LIST
//.viewMatchResult .candidate-list .candidate-agreement { bottom:10px; }

// SORRY FOR THE QUICK FIX
.dr-page-article {
	.candidate-list {
		.item {
			p.call-to-action-links {
				margin-top:7px !important;
                padding-bottom:0;
			}

			.subheadline { 
				margin-top:0px;
			}			
		}
	}
}




.candidate-list {

	.municipality-result {
		background:url("/assets/img/border.svg") repeat-x scroll -2px 100% rgba(0, 0, 0, 0);
		line-height:14px;
		padding:5px 0;
		text-align:right;
		div {
			font:14px/1 "gibsonRegular","Arial",sans-serif;
			display:inline-block;
			&.votes-2009 {
				.res {
					color:#717e8d;
					text-align:center;
				}
			}
			&.votes-2013,&.votes-2009 {
				padding-right:10px;
				text-align:right;
				border-right:1px solid rgb(255, 255, 255);
				border-right:1px solid rgba(0, 0, 0, 0.2);
			}
			&.down,&.up {
				padding-left:10px;
				text-align:right;

				span.updo {
					width:17px;
					height:9px;
					display:inline-block;
					padding-right:5px;
				}
				div.res {
					text-align:right;
					display:inline-block;
					font:12px/1 "gibsonRegular","Arial",sans-serif;
					color:#717e8d;
				}
			}

			&.down span.updo {
				background:url("../images/down.png") no-repeat top left;
			}
			&.up span.updo {
				background:url("../images/up.png") no-repeat top left;
			}
		}
	}


	.heading-xsmall {
		font-size:14px;
		line-height:14px;
	}
	
	.candidate-item, .item {
		padding-top:20px;
		.subheadline { 
			margin-top:2px;
			color:@primary-100-fallback;
			color:@primary-100;
			font-size:11px;
		}

		.resultCandidate {
			position:relative;
			height:140px;    /*bbbbbbbbbbbbbbbbbbb*/
            .image-wrap {
                padding-right: 0;
            }
		}
		p.number {
			border-radius:13px;
			background:#000;
			font:24px/40px "gibsonLight","Arial",sans-serif;
			width:25px;
			height:25px;
			text-align: center;
			color:#FFF;
		}
	}
	[class*="image-"] {
		.image-wrap {
			
			.letter-color {
				position:absolute;
				z-index:999;
				right:0;
				top:0;				
				text-indent:-9999px;
				display:block;
			}
		}
	}
	[class*="image-1"] {
		.image-wrap {
			.letter-color {
				right:0;
			}
		}
	}

	li.item {
		.candidate-profile-meta {
			float:left;
			margin:0 !important; // THAT SUCKS
			width:200px;
		}
		&:first-child {
			.candidate-pct {
				//top:4px;
				}
			}
		.candidate-pct {
			
			//float:right;
			//margin:0 !important;
			text-align:right;

			// AGRA - SHIT FIX
			position:absolute;
			right:0;
			top:22px;
			// AGRA - SHIT FIX END
			
			a, img {
				display: block;
			}

			.pct-num {
				color:@secondary;
				font:36px/1 "gibsonLight","Arial",sans-serif;
			}

			&.hidden { display:none; }

			span {
				font:11px/1 "gibsonRegular","Arial",sans-serif;
				text-transform:uppercase;
				color:@primary-100-fallback;
				color:@primary-100;
				display:block;
			}

		}
		
		// AGRA - FUCK FIX
		.candidate-agreement {
			//position: absolute;
			//bottom:15px;
			//width:100%;
			//margin:0 !important;
			display:block; // AGRA from inline to block

			> div {
				//margin-left:11.2903% !important;
				margin-right:10px;
			}
		
			&.hidden {
				display:none;
			}
		
			a {
				color:@primary;
				text-transform:uppercase;
				text-decoration:underline;
				display:block;
				font:12px "gibsonRegular","Arial",sans-serif;
				margin:3px 0 0 0;
				font-size:12px;
				//margin-left:11.2903%;
				&.see-profile,
				&.see-test {
					&.hidden { display:none; }
				}
			}

			span.see-candidateNoTest {
				&.hidden { display:none; }
				//margin-left:11.2903%;
				padding:2px 10px;
				margin-top:5px;
				//display:block;
				// AGRA - shit fix
				display:inline-block;
			}

			div {
				background-color:@secondary-light;
				height:6px;
				overflow:hidden;
				&.hidden {
					display:none;
				}
				.bar {
					background-color:@secondary;
				}
			}
		
		}
	    [class*="heading-"] {
            & ~ .candidate-agreement {
                //margin-top: 30px;
            }
	    }
	    .title {
            & ~ .candidate-agreement {
                //margin-top: 15px;
            }
	    }
    }
}

.span-6  {
	.candidate-list li.item {
		.pv-votes-avail-container {
			.pv-votes:not(.hidden) {
			 + .elected-icon {
				margin-top:2px;
			 }
			}
		}
		.candidate-agreement {
			display:inline;
			//bottom:8px;
			> div
			{
				//margin-left:15% !important;
			}
		}
	}
}


.viewMatchResult
{
    font: 24px/1 "gibsonRegular","Arial",sans-serif;

    .section.header
    {
        border-bottom: none;

        h2
        {
            -moz-box-sizing: border-box;
            border-bottom: 1px solid rgba(0, 0, 0, 0.2);
            border-top: 6px solid #000000;
            font-size: 24px;
            line-height: 1;
            margin: 20px 10px 0;
            padding: 15px 10px 15px 0;
            text-transform: uppercase;
        }
    }

    .alert
    {
        margin: 20px 10px 40px;
        font: 24px/1 "gibsonRegular","Arial",sans-serif;
        text-transform: uppercase;

        a
        {
            color: @primary;
            text-decoration: underline;

            &:before
            {
                line-height: 26px;
                width: 26px;
                font-size: 26px;
                text-align: center;
                margin-right: 10px;
            }
        }
    }

    .loading
    {
        margin: 20px 10px 20px;
        color: @secondary;
    }

    .candidate-list
    {

        li.item
        {
            &:first-child
            {
                margin-top: 20px;
            }

            &.match-result
            {
                .candidate-agreement
                {
                    bottom: 20px;

                    > div
                    {
                        margin-left: 30.9524% !important;
                        background-color: #fff;
                    }
                }
            }

            .candidate-agreement
            {
                position: absolute;
                bottom: 10px;
                width: 100%;
                margin: 0 !important;


                > div
                {
                    margin-left: 15.9574% !important;
                    margin-right: 10px;
                }
            }

            &.boxed-image + .item
            {
                background: none;
            }
        }
    }

    .result-share
    {
        display: block;

        .dr-site-share-horizontal
        {
            background-image:none !important;
        }

        > menu
        {
            background: none;
            margin-bottom: -10px;
            padding-top: 4px;

            &:before
            {
                background: none;
                border-top: #fff 1px solid;
            }

            a
            {
                color: @primary;
            }

            span
            {
                font-size: 14px;
                color: #717e8d;
            }

            li
            {
                padding-top: 0;
                padding-bottom: 0;
            }
        }
    }
}
// END CANDIDATE LIST



@media (max-width: 830px)
{
	.votelist-header {
		h2 {
			span {
				font:30px/69px "gibsonSemiBold","Arial Black",sans-serif;
			}
		}
	} 

	.candidate-list { 
		
		.candidate-profile-meta {
			//width:95px;
			width: 68%
		}
		.candidate-pct {
			span {
				font-size:11px;
				line-height:14px;
			}
			.pct-num {}
		}
	
		.match-result {
			.image-1 .image-wrap ~ *,
			.image-2 .image-wrap ~ * {
				padding-left:0 !important;
			}

			.resultCandidate {
				
				.candidate-pct {
					padding:0;
				}

				.candidate-profile-meta {
					width:125px;
					padding-top:0px;
					padding-left:0;

					.heading-small {
						font-size:14px;
						line-height:16px;
					}
				}

				.candidate-agreement {
					bottom:39px;
					left:3px;
				}
			}	
		}

        li.item {
			div.candidate-agreement {
				& > div {
					margin-left: 11.2903% !important;	
				}
			}
		}		
	}
	.match-result {
		.candidate-list {
			.candidate-profile-meta {
				width:95px;
			}			
		}
	}
}
@media (max-width: 700px) {
	.candidate-list {
		[class*="image-1"] {
			.image-wrap {
				.letter-color {
					right:10px;
				}
			}
		}
	 }

	 .votelist-header {
	 h2 {
			padding:30px 20px 0;
			span {
				font:30px/30px "gibsonSemiBold","Arial Black",sans-serif;
			}
		}
		p {
		padding:10px 20px 0px;
		color:@secondary;
		font:18px/20px "gibsonRegular", "Arial", sans-serif;
		width:86%;
	}
		.profile { position:relative; }
	} 
	

	.candidate-list { 
		.image-1 .image-wrap ~ *, .image-2 .image-wrap ~ * {
			
				padding-left:0 !important;
			
				
		}
		
		.candidate-profile-meta {
			//width:95px;
			width: 61%;
		}

		.candidate-pct {
			
			span {
				font-size:11px;
				line-height:14px;
			}
			.pct-num {
				
			}
		}
	
		.match-result .resultCandidate {
			.candidate-pct {
				padding:0;

			}
			.candidate-profile-meta {
				width:270px;
				padding-top:0px;
				.heading-small { font-size:24px; line-height:26px; }
			}

			.candidate-agreement {
				bottom:50px;
				left:3px;
			}
		}
		li.item {
			div.candidate-agreement {
				& > div {
					margin-left: 25% !important;	
				}
			}
		}
	}

}
@media (max-width: 530px) {

    .collaps-items + div.display-all button { line-height:16px; }

	.candidate-list { 
		.image-1 .image-wrap ~ *, .image-2 .image-wrap ~ *, .item .image-wrap ~ * {		
			padding-left:0 !important;
			width: 40%;
			word-wrap: break-word;				
		}
		
		.candidate-profile-meta {
			//width:95px;
			width: 40%;
		}

		.candidate-pct {
			
			span {
				font-size:11px;
				line-height:14px;
			}
			.pct-num {
				
			}
		}
	
		.match-result .resultCandidate {
			.candidate-pct {
				padding:0;

			}
			.candidate-profile-meta {
				width:125px;
				padding-top:0px;
				.heading-small { font-size:20px; line-height:22px; }
			}

			.candidate-agreement {
				bottom:50px;
				left:3px;
			}
		}
		li.item {
			div.candidate-agreement {
				& > div {
					margin-left: 33.333333% !important;	
				}
			}
		}
	}
}




@media (max-width: 380px) {

	.boxed, .boxed-image {
		padding: 10px !important;
	}
	.boxed > .votelist-header {
		padding: 0 10px;
	}
	.votelist-header {
	 	h2 {
			padding: 10px 0 0;
		}
		p {
			padding: 10px 0;
			width: 100%;
			&.a{
				padding-bottom: 20px;
			}
		}
		.profile { position:relative; }
	}

    .viewMatchResult .candidate-list {
    	> h2 {
    		margin: 0;
    	}
        .image-1 .image-wrap ~ *, .image-2 .image-wrap ~ * { padding-left: 0 !important; }

        li.item {
        	padding-top: 10px;
            & > * { /*width:100%;*/ word-wrap:break-word; }
            &:first-child {
            	margin-top: 10px;
                .candidate-pct { top: 2px; }
            }
            .candidate-pct { top: 12px; }
            .candidate-profile-meta { 
            	width: 120px; 
	            .subheadline {
					width: 90px;
				}
			}
        }

        .candidate-pct {

            span { font-size: 11px; line-height: 14px; }
            .pct-num { }
        }

        .match-result .resultCandidate {
            .candidate-pct { padding: 0; }
            .candidate-profile-meta { width: 88px; padding-top: 0px;
                .heading-small { font-size: 14px; line-height: 16px; }
            }

            .candidate-agreement { bottom: 50px; left: 3px; }
        }
    } 
}

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

	.votelist-header {
	padding:0;
		&.votebackground {
			background-image: url("../images/backgrounds/zone-right-kuber.png");

		}

	}
}

@media (max-width: 830px) {

	.votelist-header {
		padding:0;
		&.votebackground {
			
			h2 span {
				line-height: 1;
			}
		}
	}

}

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

	.votelist-header {
		padding:0;
		&.votebackground {
			padding: 20px;

			h2 {
				display: inline;
				padding: 0;
				
				span {
					display: inline;
				}
			}

			p {
				display: inline;
				padding: 0;
				font-size: 0;
				text-indent: -9999px;

				a {
					font-size: 18px;
				}
			}

		}

	}
    .result-share {
        [class*="dr-site-share"][class*="-horizontal"] li { margin-left: 2px; margin-right: 2px; }
    }
}