/*
Theme Name: bestvpnproviders.net
*/

body {
	background-color: #1c344e;
	font: normal 16px/22px Arial, sans-serif;
	color: #555;
	margin: 0;
}
body.image {	 
	background-repeat: no-repeat;
	background-position: center center;
	background-attachment: fixed;
	background-size: cover;
}

p { margin: 0 0 12px; }
ul { padding: 0 0 0 15px; margin: 0 0 7px; list-style-type: square; }

.none, .no, .hidden, .hid, .screen-reader-text {
    display: none;
    visibility: hidden;
}


table { font-family: Arial; }


/* Headings */
h1, h2, h3, h4, h5, h6, .title, .titlerow { display: block; margin: 0 0 5px; font-size: 17.5px; line-height: 22px; color: #226399; font-family: "Georgia"; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, a.title, .title a { text-decoration: none; }

/* Positionierung */
.clear { clear: both; }
.alignleft { float: left; }
img.alignleft { margin: 0 5px 5px 0; }
.alignright { float: right; }
img.alignright { margin: 0 0 5px 5px; }
.aligncenter, .alignnone { display: block; margin: auto; text-align: center; }
.alignnone { float: none; display: block; }

.wp-caption dt { margin: 0 auto 20px; padding: 0; }
.wp-caption dd { margin: 0; padding: 0; }

/* Hyperlinks */
a { color: #00698e; }
a:hover { color: #00bdca; text-decoration: none; }
a img { border: none; }

a.button {
	display: block;
	padding: 10px 0; 
	font: bold 18.5px/24px Arial, sans-serif;
	color: #fff;
	text-decoration: none;
	text-align: center;
	background: #ffad55;	
}
a.button:hover { 
	background: #ff8605;
}



.laendertext32 { padding: 20px 0; margin-bottom: 20px; list-style: none; }
.laendertext32 li {
background: no-repeat scroll center 10px transparent;
background-color: #e2fdff;
list-style: none outside none;
margin: 5px 1%;
padding: 50px 10px 10px;
font-size:12px;
font-family: Arial;
color:#666666;
line-height:normal;
text-decoration: none;
text-align: center;
font-weight:bold;
float: left; 
width: 16%;
height: 30px;
}
.laendertext32 li:hover { background-color: #00bdca; }
.laendertext32 li a { text-decoration: none; }
.laendertext32 li:hover a { color: #fff; }


/* Header */
#wrap, header .innerwrap, header nav.mainmenu, #versus-table .sticky {	
	width: 1200px;
	margin: 0 auto;	
}

header { margin: 5px auto 0; background-color: #1d2838; }
header .sticky { position: fixed; width: 100%; left: 0; top: 0; z-index: 100; border-top: 0; margin: auto; }
header .innerwrap { min-height: 70px; }
header .logo { text-align: right; display: inline; width: auto; float: left; margin: 10px 0; }
header .searchform { width: 40%; float: right; margin-top: 35px; margin-bottom: 10px; }


/* Suche */
h2.searchresults { margin: 25px 0; text-align: center; font-size: 30px; line-height: 40px; }
#s { height: 32px; width: 68%; margin-left: 1%; border: none;  }
#searchsubmit { height: auto; padding: 5px 0; width: 28%; float: right; margin-right: 1%; text-transform: lowercase; letter-spacing: .2px; background-color: #00698e; color: #fff; font: bold 14px/22px Arial, sans-serif; color: #fff; text-decoration: none; border: none; }
#searchsubmit:hover { cursor: pointer; background-color: #00bdca; }

.searchresults.tags { padding: 20px; background-color: #fff; }
.searchresults .country { width: 100px; float: left; display: block; padding: 15px 5px 10px; margin: 5px 5px 0 0; text-align: center; background-color: #dbf0fc; text-decoration: none; font-weight: bold; }
.searchresults .country:hover { background-color: #00BDCA; color: #fff; }
.searchresults .country .img { display: block; width: 32px; height: 32px; margin: auto; background-repeat: no-repeat; background-position: center center; }

.zumanbieter, input.vergleichen { display: block; margin: 5px 0; padding: 8px 10px; text-align:center;  background: #00698e; color: #fff; font-weight: bold; text-decoration: none; border: none; }
.zumanbieter:hover, input.vergleichen:hover { background: #00bdca; cursor: pointer; }


/* Content */
#main .post { margin: 25px auto; padding: 10px 15px; background-color: #fff; border: 1px solid #00BDCA; font-size: 17px; line-height: 30px; font-family: 'Georgia'; }
#main .postimg { float: right; width: auto; max-width: 200px; }
#main img { max-width: 100%; height: auto; }

#main h1, #main h2, #main h3 { color: #00bdca; font-family: 'Georgia', serif; font-size: 32px; line-height: 46px; margin: 30px auto 22px; text-align: center; }
#main h3 { font-size: 20px; line-height: 30px; }

#main .post h2, #main .post h3 { text-align: left; color: #333; font-size: 22px; line-height: 32px; margin: 5px 0 15px; }
#main .post h3 { font-size: 18px; line-height: 28px; margin: 5px 0 10px; }

#main.sidebar .content { width: 860px; padding: 10px; float: right; }

#main.single { background-color: #fff; margin-top: 15px; }
#main.single .post { background: transparent; border: none; }
#main.single .post .content { padding-bottom: 20px; }
#main.single .screenshot { display: block; width: 100%; height: 300px; overflow: hidden; margin-bottom: 20px; }

/* Links im Text als Button */
a.textbutton { display:block; width:200px; float:right; margin: 10px 0 30px 20px; padding: 4px 8px; text-align:center;  background: #00698E; color: #fff; font-weight: bold; font-family: 'Gudea'; text-decoration: none; border: none; }
a.textbutton:hover  { background: #3BA9CE; cursor: pointer; }



/* Tabellen */

.table.vergleich { display: table; }
.table.vergleich .row { display: table-row; }
.table.vergleich .cell { display: table-cell; vertical-align: top; }

table, .table { width: 100%; margin: 5px 0 10px; border-collapse: collapse; text-align: left; }
table th, table td, .table .cell { padding: 5px 10px; font-size: 14px; }
table th, .table .cell.th { background-color: #00bdca; border: 1px solid #00bdca; color: #fff; line-height: 16px; font-weight: bold; vertical-align: middle; }
table td, .table .cell.td { background-color: #fff; border: 1px solid #00BDCA; line-height: 20px; }

.vergleich { margin: 15px auto; }
.vergleich .th { text-align: left; text-transform: uppercase; }
.vergleich .cell .title { display: none; vertical-align: top; }
.vergleich .cell.c1 .thefeatures { display: none; text-align: left; }
.vergleich .c1 { text-align: center; }
.vergleich .c1 .small a { display: block; white-space: nowrap; margin: 5px auto; font-weight: bold; text-decoration: none; }
.vergleich .td:hover { cursor: pointer; }
.vergleich .tr:hover td { background-color: #d7f0ff; }
.vergleich .anbieterlogo { display: block; margin: 10px auto 30px; }
.vergleich a.zumanbieter { display: block; margin: 5px 0; padding: 5px 10px; text-align:center;  background: #00698e; color: #fff; font-weight: bold; text-decoration: none; }
.vergleich a.zumanbieter:hover { background: #00bdca; }
.vergleich .title { font-family: sans-serif; }


.vergleich .row.reviewrow .cell { padding: 0; height: 0; text-align: center; }
.vergleich a.row { text-decoration: none; color: #333; }
.vergleich .row.tbody.reviewrow .cell a.details-link { display: block; white-space: nowrap; margin-top: -30px; }
.vergleich .row.tbody.reviewrow .cell.c1 { height: 0 !important; }

@media all and (max-width: 850px) {
    .vergleich .row.detailsrow .cell.c1 { padding-bottom: 30px; } 
}
@media all and (max-width: 530px) {    
    .vergleich .row.reviewrow .cell { display: none !important; }
    .vergleich .row.tbody.reviewrow .cell.c1 { height: auto !important; display: block !important; }
    .vergleich .row.reviewrow .cell.c1 { display: block !important; margin-top: 0; padding: 10px 0; border-bottom: 3px solid #52a4ea; }
    .vergleich .row.reviewrow { border-bottom: 3px solid #52a4ea; }    
    .vergleich .row.tbody.reviewrow .cell a.details-link { margin: 0 auto; }
    .vergleich .stars { margin-bottom: 5px; }
    .vergleich .row.detailsrow { margin-bottom: 0; }
    .vergleich .row.detailsrow .cell.c1 { padding-bottom: 0; }
}


/* Versus */
#versus-table { width: 100%; margin: 10px auto 5px; background-color: #fff; border: 1px solid #00BDCA; }
#versus-table .sticky { position: fixed; top: 55px; z-index: 50; border-top: 0; margin: 0 auto; box-shadow: 0 3px 8px #ccc; }

#versus .title { color: #FFF; margin: 20px 0px 15px; font-size: 24px; line-height: 34px; }

#versus-table .row { clear: both; border-bottom: 1px solid #00BDCA; background-color: #fff; }
#versus-table .cell { float: left; vertical-align: top; }
#versus-table .bg, #versus-table .row.heading { background-color: #00BDCA; color: #fff; font-size: 16px; font-weight: bold; }
#versus-table .inner { padding: 5px 10px; }
#versus-table .bg .inner { padding: 0; }
#versus-table .logo { display: block; margin: 0 auto; height: 60px; overflow: hidden; }
#versus-table .logo img { width: auto; height: auto; max-height: 100%; }
#versus-table .more-link { display: block; margin-top: 15px; }

#versus-table .thead .cell { text-align: center; }
#versus-table .tbody .row.middle .cell { vertical-align: middle; }

#versus-table .row.country { height: 24px; overflow: hidden; }
#versus-table .row.country .inner { padding: 3px 10px; font-size: 14px; line-height: 14px; }
#versus-table .row.country .cell { text-align: center; }
#versus-table .row.country .cell.c1 { text-align: left; }


#versus-table.fiftyfifty .cell { width: 39%; }
#versus-table.fiftyfifty .cell.c1 { width: 39%; }

#versus-table.third .cell { width: 26%; }

#versus-table .cell.c1 { width: 22% !important; font-weight: bold; }
#versus-table .cell.c1 a { text-decoration: none; font-weight: normal; }
#versus-table .cell.colspan-3, #versus-table .cell.colspan-4 { width: 100% !important; float: none; text-align: center; }

.versusbox { width: 25%; float: left; margin: 0 1% 0 0; }
.versusbox strong { color: #00bdca; }
.versusbox select { width: 100%; font-size: 14px; letter-spacing: .8px; border: 1px solid #00bdca; }
.versusbox select:hover { border: 1px solid #0b3d67; }
.versusbox select option:hover { cursor: pointer; color: #e66900; }

input.vergleichen { float: right; margin-top: 61px; }




/* Pro & Contra */
.proconbox { clear: both; text-align: left; }
.proconbox strong { display: block; margin-bottom: 10px; font-size: 15px; }
.pro strong { color: #1fb51a; }
.proconbox ul { list-style: none; padding: 0; margin: 0; }
.proconbox ul li { padding: 0 0 5px 35px; margin-bottom: 5px; font-size: 14px; }
.pro ul { margin-bottom: 5px; }
.pro ul li { background: transparent url('images/icon_like.gif') no-repeat top left; }
.contra ul li { background: transparent url('images/icon_dislike.gif') no-repeat top left; }
.contra strong { color: #ef481a; }


/* Sidebar */
aside { float: left; width: 305px; margin-left: 1%; }
aside .title { font: bold 14.5px/20px Arial, sans-serif; color: #00698e; }

aside .menu-item a { color: #00BDCA !important; }

aside .box { padding: 5px; border: none; margin: 10px auto; }
aside .box .title, aside .titlerow, aside #respond h3 { padding: 10px !important; margin: 0 0 10px; font-size: 18px; line-height: 20px; font-weight: bold; color: #fff; background-color: #00bdca; }
aside .box .searchform { padding: 5px; }
aside hr { width: 98%; height: 1px; background: transparent; border: none; border-bottom: 3px solid #f0f0f0; margin: 5px auto 15px; }
aside .box img.logo { display:block; margin: 15px auto 25px; }
aside .box img { max-width: 100%; height: auto; }


/* Kommentare */
#comments { margin-top: 20px; }
#comments .stars.small { float: right; }
#comments ol { padding: 0 17px; }
#comments ol li { margin-bottom: 10px; padding-bottom: 3px; border-bottom: 1px dotted #ccc; }
.comment-author { margin-bottom: 10px; }

.comment-form-author, .comment-form-email { float: left; width: 49%; }
.comment-form-comment { clear: both; }

#respond, #wpcr_respond_1 { margin: 20px 0; background-color: #fff; }
#wpcr_respond_1 { margin: 20px 0 !important; }
#wpcr_respond_1 .inner { padding: 5px !important; }
.hreview { margin: 5px 0 10px; padding-bottom: 10px; border-bottom: 1px solid #abcfef; }
.hreview .title { text-align: left; }
#commentform { padding: 5px; }
#commentform p { margin: 0 0 5px; }
#commentform label { display: block; height: 25px; padding: 0; margin: 0; }
#commentform input, #commentform textarea { border: 1px solid #abcfef; }
#commentform textarea { width: 99.3%; }
#submit { width: 100%; margin: 0 auto; background-color: #00BDCA; border: 1px solid #abcfef; color: #fff; font: normal 14px/22px Arial, sans-serif; }
#submit:hover { background-color: #00698e; border-color: #00698e; color: #fff; cursor: pointer; }


/* Star Rating */
.stars, .stars span { display: block; height: 24px; background-image: url('images/stars.png'); }
.stars { margin: 5px auto 0; width: 128px; }
.stars span { text-indent: -9999.99em; background-position: 0 24px; }
.stars.small, .stars.small span { overflow: hidden; height: 12px; background-image: url('images/stars-small.png'); }
.stars.small { width: 64px; }
table.review-stars td { border: none; }
table.review-stars td.c1 { padding-top: 10px; font-weight: bold; font-size: 14px; }


/* Rating Snippet (schema.org) */
.product-rating { margin: 15px auto 0; font-size: 85%; line-height: 120%; color: #999; }
.product-rating a { color: #999; text-decoration: none; }


ul.positiv, ul.negativ { padding: 0 0 10px 50px; background-repeat: no-repeat; background-position: top left; }
ul.positiv { background-image: url('images/icon_like.gif'); }
ul.negativ { background-image: url('images/icon_dislike.gif'); } 

aside ul.similar, aside ul.searchterms { list-style: none; padding: 0; margin: 0; }
aside ul.searchterms li { float: left; margin-right: 5px; }
aside ul.similar li { clear: both; padding: 15px 0 10px; border-bottom: 1px solid #00BDCA; text-align: center; }
aside ul.similar.compare li { padding: 3px; }
aside ul.similar li.similarpost { text-align: left; }
aside ul.similar li.last { padding-bottom: 0; border-bottom: none; }
aside ul.similar li img.thumb { float: left; margin: 0 10px 5px 0; width: 50px; height: 50px; }
aside ul.similar li span { display: block; width: 225px; float: left; }

aside .bewertungslink { display: block; margin: 5px auto; text-align: center; }


/* Footer */
footer { clear: both; padding: 5px 20px; text-align: right; color: #00698e; }



/* Responsive */
@media all and (max-width: 1400px) {
	.versusbox { width: 24%; }	
	.laendertext32 li { width: 108px; margin: 5px; }
}
@media all and (max-width: 1240px) {
    #wrap, header .innerwrap, #versus-table .sticky { width: 1000px; }
    #main.sidebar .content { width: 660px; padding: 10px; } 
}
@media all and (max-width: 1080px) {
	.versusbox select { font-weight: normal; }
	.versusbox { width: 23%; }
	#wrap, header .innerwrap, #versus-table .sticky { width: 960px; }
	.vergleich .th { font-size: 14px; }
	#main.sidebar .content { width: 625px; }
	.laendertext32 li { width: 102px; height: 45px; } 
}
@media all and (max-width: 980px) {
	#wrap, header .innerwrap, #versus-table .sticky { width: 800px; }
	#main.sidebar .content { width: 465px; }
	#main.sidebar .content img, .wp-caption { max-width: 100%; width: 100%; height: auto; margin: auto; }
	.versusbox { width: 32%; }
	input.vergleichen { float: none; clear: both; margin-top: 15px; width: 100%; display: block; }
	header .searchform, header .logo { width: auto; float: none; clear: both; margin: 0 auto; display: block; }
	header .searchform { margin-bottom: 10px; }
	header .logo { text-align: center; }
	.vergleich .c1 { width: auto; }
	.laendertext32 li { width: 162px; height: 30px; } 
}
@media all and (max-width: 840px) {
	#wrap, header .innerwrap, #versus-table .sticky { width: 740px; }
	#main.sidebar .content { width: 400px; }	
	.laendertext32 li { width: 147px; }
	.comment-form-author, .comment-form-email { float: none; width: auto; }	
}
@media all and (max-width: 840px) {
    .vergleich .cell.c1 .thefeatures { display: block; }
    .vergleich .cell.features { display: none; }
}
@media all and (max-width: 768px) {	
	#wrap, header .innerwrap, #versus-table .sticky { width: 640px; }
	#main.sidebar .content { width: 300px; }
	.laendertext32 li { width: 122px; }
	a.zumanbieter, input.vergleichen { font-size: 12px; padding: 3px 5px; }	
	#versus-table .sticky { top: 35px; }	
	#main.single .screenshot { height: 200px; }
}
@media all and (max-width: 660px) {
	#wrap, header .innerwrap, #versus-table .sticky { width: 99%; }
	#main.sidebar .content, aside { width: 97%; float: none; clear: both; margin: 0 auto; padding-left: 0; padding-right: 0; }
	#main .post { padding: 0; }	
	aside .box img.alignnone { margin: auto; }
	#main.single .screenshot { width: 98%; margin: auto; max-width: 98%; }
	.laendertext32 li { width: 123px; }	
}
@media all and (max-width: 630px) {	
	body { font-size: 12px; line-height: 19px; }
	#main .post { font-size: 18px; line-height: 28px; }
	#main .post img { width: 100%; height: auto; float: none; clear: both; }	
	.laendertext32 li { width: 44%; margin: 1%; }	
	#versus-table .cell.c1 .country-name { font-size: 10px; }
	.vergleich .cell.monthlycosts { display: none; }
}
@media all and (max-width: 530px) {	
	#main .postimg { width: 50%; }
	#versus .title { font-size: 18px; line-height: 28px; }
	.laendertext32 li { width: 42%; }
	.comment-form-author, .comment-form-email { float: none; width: auto; }
	.vergleich .row, .vergleich .cell, .vergleich .cell .title { display: block !important; }
    .vergleich .row { margin-bottom: 10px; }
    .vergleich .cell.th, .vergleich .cell.c1 .thefeatures { display: none !important; }
    .vergleich .cell.td { font-size: 16px; }	
    a.zumanbieter, input.vergleichen { font-size: 18px; }
    .versusbox { width: 100%; } 
}


@media all and (max-width: 430px) {	
	#main .post { font-size: 16px; line-height: 26px; }
	#s { width: 65%; } 
	header .logo img { width: 100%; height: auto; }
	.laendertext32 li { width: 39%; }	
}