/*
	Template Name: Partij voor de Dieren
*/

/* NORMALIZE */
@import url("css/normalize.css?s=5") screen;

/* SLIDESHOW */
@import url("css/basics.css?s=5") screen;

/* CUSTOM STUFF */
@import url("css/custom.css?s=5") screen;
@import url("css/slicknav.css?s=5") screen;

/* FORMS */
@import url("css/forms.css?s=5") screen;

/* MEDIA QUERIES */

#mobilemenu { display: none; }

@media only screen and (max-width: 700px) {
	#wrapper {
		width: 100%;	
	}
	.col_1_1 { width: 100%; }
	.col_1_2 { width: 100%; }
	.col_1_3 { width: 100%; }
	.col_2_3 { width: 100%; }
	.col_1_4 { width: 100%; }
	.col_3_4 { width: 100%; }
	
	.col { margin-top: 2%; } 
	
	.nomobile { display: none; }
	#navigation { display: none; }
	#mobilemenu { display: block; }
	nav { padding: 0px; margin: 0px; margin-top: 0px;  }
	
	.content { padding: 5px 10px; }
	
	
}

@media screen and (min-width:1250px) {
	#wrapper {
		width: 1200px;
	}
}

@media screen and (min-width:960px) and (max-width:1250px) {
	#wrapper {
		width: 940px;
	}
	ul#navigation li a { font-size: 13px !important; }
}

@media screen and (min-width:700px) and (max-width:960px) {
	#wrapper {
		width: 700px;
	}
	
	
	body {
		font-size: 11px;
	}
	
	ul#navigation { font-size: 12px; letter-spacing: 0px; }
	ul#navigation li { line-height: 35px; }
	ul#navigation li a { font-size: 9px !important; }

	h1 { font-size: 20px;    }
	h2 { font-size: 18px; 	 }
	h3 { font-size: 15px; }
	h4 { font-size: 12px;  }
	
	.widget-title { font-size: 13px; }
	
	.datefield { font-size: 9px; padding: 1px 3px; margin-right: 2px;}

	ul.widget-body li {
		margin-left: 4%;
		line-height: 10px;
	}
  .heroSlider .rsOverflow,
  .royalSlider.heroSlider {
      height: 320px !important;
  }
}

@media screen and (min-width:960px) and (min-height:660px) {
  .heroSlider .rsOverflow,
  .royalSlider.heroSlider {
      height: 320px !important;
  }
}

@media screen and (min-width:960px) and (min-height:1000px) {
    .heroSlider .rsOverflow,
    .royalSlider.heroSlider {
        height: 360px !important;
    }
}
@media screen and (min-width: 0px) and (max-width: 800px) {
  .royalSlider.heroSlider,
  .royalSlider.heroSlider .rsOverflow {
    height: 300px !important;
  }
  .infoBlock {
    padding: 10px;
    height: auto;
    max-height: 100%;
    min-width: 40%;
    left: 5px;
    top: 5px;
    right: auto;
    font-size: 12px;
  }
  .infoBlock h3 {
     font-size: 14px;
     line-height: 17px;
  }
}