@font-face {
font-family: 'Occupied Regular';
font-style: normal;
font-weight: normal;
src: local('Occupied Regular'), url('fonts/Occupied.woff') format('woff');
}


@font-face {
font-family: 'Occupied Italic';
font-style: normal;
font-weight: normal;
src: local('Occupied Italic'), url('fonts/Occupied Italic.woff') format('woff');
}

*{
	margin: 0;
	padding: 0;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
/* lay-out */
html, body {
    height:100%;
    width: 100%;
    margin: 0;
    padding: 0;
	color: #000000;
	font-size: 16px;
	font-family: 'PT Sans', sans-serif, Verdana, Candara, Tahoma,Helvetica,sans-serif;
	text-decoration: none;
    background-color: #ffffff;
}
p {
	margin: 0;
}
ul {
	margin-left: 15px;
	padding: 0;
}
a, a:hover:active  {
	color: #000;
	text-decoration: underline;
	font-weight: none;
}
a:hover  {
	font-style: none;
	font-weight: none;
	text-decoration: underline;
}
hr {
    border: 0;
    width: 100%;
    color: #f29400;
    background-color: #f29400;
    height: 3px;
 }
h1, h2, h3, h4, h1 a, h2 a, h3 a, h4 a {
	text-decoration: none;
	color: #f29400;
	font-weight: normal;	
}
h1{
	font-family: 'Occupied Regular';
	text-transform: uppercase;	
	margin: 0 0 10px 0;
	font-size: 40px;
	line-height: 40px;
}
h2{
	font-size: 20px;
	line-height: 26px;
}
h3{
	font-size: 18px;
	line-height: 24px;
}
h4{
	font-size: 16px;
	line-height: 20px;
}
.snippet {
	float: right;
}
.content li { 
    padding-left: 1em; 
    text-indent: -.7em;
/*	color: #f29400; */
}
#container {
    width: 100%;	
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -140px;   
    background-color: #ffffff;
	position: relative;
    z-index: 2;
 }
.scrollup{
    width: 40px;
    height: 40px;
    opacity: 0.6;
    position: fixed;
    bottom: 15px;
    right: 15px;
    display: none;
    text-indent: -9999px;
    z-index: 20;
    background: url(afbeeldingen/icon_top.png)  no-repeat;
}
@media screen and (min-width:451px) {
		#gerelateerdwrapper{
		position: relative;	
		margin-left: auto;
		margin-right: auto;
	}
	.logo {
		float: left;
		margin: 10px 0 0 0;
	}	
	#menubalk {
		height: 100px;
		background-color: #ffffff;
	}	
	.socialmediadiv {
		width:48px;
		height:192px;
		z-index:130;
		float:right;
		padding:0px;
		position:fixed;
		right:0;
		top:190px;
		display:inline-block;
	}
	.socialmediadiv a img {
		display:block;
	}	
	.contentleft, .contentright {
		display:tab		vertical-align: top;
		width: 50%;
	}
	#headerbalk {
		background-color: #f29400;
		height: 50px;
		white-space:nowrap;
	}	
	.headerbalktekst {
		color: #ffffff;
		text-align: center;
		font-size: 20px;
		padding-top: 12px;		
	}
	.recept {
		width: 100%; 
		height: auto; 
	}
	.receptnodig {
		float: left; 
		width: 100%; 
		height: auto; 
		padding: 10px; 
		background: #ffffff;
	}
	.receptimg {
		clear: left;
		float: left; 
		width: 100%; 
		height: 300px; 
		overflow-y: hidden; 
		padding: 0px; 
		background: #ffffff;
	}
	.receptimg img {
		object-fit: cover;
	}
	.receptbereiding {
		clear: left;
		float: left; 
		width: 100%; 
		padding: 10px; 
		height: auto;
	}		
}
@media screen and (min-width:601px) {
	.recept {
		width: 100%; 
		height: auto; 
	}
	.receptnodig {
		float: left; 
		width: 50%; 
		height: 300px; 
		overflow-y: hidden; 
		padding: 10px; 
		background: #ffffff;
	}
	.receptimg {
		clear: none;
		float: left; 
		width: 50%; 
		height: 300px; 
		overflow-y: hidden; 
		padding: 0px; 
		background: #ffffff;
	}
	.receptimg img {
		object-fit: cover;
	}
	.receptbereiding {
		clear: left;
		float: left; 
		width: 100%; 
		padding: 10px; 
	}
}
@media screen and (min-width:801px) {
	#gerelateerdwrapper{
		position: relative;	
		margin-left: auto;
		margin-right: auto;
	}
	.headertekst1 {
		line-height:50px;
		top:56%;
		left:5%;
		font-size: 25px;		
		z-index:1;
	}
	.headertekst2 {
		border: 1px solid #f29400;
		background-color:white;
		color: #f29400;
		top:67%;
		left:10%;
		z-index:2;
	}
	.headertekst3 {
		top:80%;
		left:30%;
		font-size: 20px;
	}
	.content {
		padding: 10px 0px;
		width:auto;
	}		
}
@media screen and (min-width:1240px) {
	#menubalkwrapper, #contentwrapper, #gerelateerdwrapper, #footerwrapper{
		width: 1200px;
		position: relative;	
		margin-left: auto;
		margin-right: auto;
	}
	#menubalk {
		height: 100px;
		background-color: #ffffff;
	}	
	#hoofdmenu{ 
		position: absolute;
		right: 0px;
		z-index: 110;
		height: 50px;
		border-bottom: 10px solid #f29400;
		top: 50px;		
	}		
	#headerwrapper {
		max-width: 1200px;
		margin-left: auto;
		margin-right: auto;
	}
	#headerbalk {
		background-color: #f29400;
		height: 50px;
		white-space:nowrap;
	}	
	.headerbalktekst {
		color: #ffffff;
		text-align: center;
		font-size: 20px;
		padding-top: 12px;
	}
	.headerbalktekst:before {
		content: "Orthokliniek Oost - Ootmarsum-Enschede-Rijssen - Uw gezondheid, onze zorg!"
	}
	.content {
		width: 1200px;
		/* height: 100%;		 */
		padding: 0px;
		float: left;	
	}
	.contentleft, .contentright {
		display:table-cell;
		vertical-align: top;
		width: 50%;		
	}
	.recept {
		width: 100%; 
		height: 300px; 
		overflow-y: hidden; 
	}
	.receptnodig {
		float: left; 
		width: 25%; 
		height: 300px; 
		overflow-y: hidden; 
		padding: 10px; 
		background: #ffffff;
	}
	.receptimg {
		clear: none;		
		float: left; 
		width: 25%; 
		height: 300px; 
		overflow-y: hidden; 
		padding: 0px; 
		background: #ffffff;
	}
	.receptimg img {
		object-fit: cover;
	}
	.receptbereiding {
		clear: none;
		float: left; 
		width: 50%; 
		padding: 10px; 
		height: 300px; 
		overflow-y: auto;
	}	
}
@media screen and (max-width:1239px) {
	#menubalkwrapper, #gerelateerdwrapper, #footerwrapper{
	
		position: relative;	
		padding-left: 10px;
		padding-right: 10px;
	}
	#menubalk {
		height: 150px;
		background-color: #ffffff;
	}	
	#hoofdmenu{ 
		position: absolute;
		right: 0px;
		z-index: 110;
		height: 50px;
		border-bottom: 10px solid #f29400;
		top: 100px;		
	}		
	#contentwrapper, #headerwrapper {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
	}	
	.headerbalktekst:before {
		content: "Orthokliniek Oost - Ootmarsum-Enschede-Rijssen - Uw gezondheid, onze zorg!"
	}	
	.content {
		padding: 5px 0;
		width: 100%;	
		padding: 20px 40px 20px 20px;
		float: left;	
	}
	.contentleft, .contentright {
		display:table-cell;
		vertical-align: top;
		width: 50%;		
	}
}

@media screen and (max-width:800px) {
	html, body {
		overflow-x: hidden;
		font-size: 14px;
	}
	h1{
		font-size: 20px;
		line-height: 26px;
	}
	h2{
		font-size: 16px;
		line-height: 22px;
	}
	h3{
		font-size: 15px;
		line-height: 21px;
	}
	h4{
		font-size: 14px;
		line-height: 20px;
	}		
	.logo {
		float: left;
		margin: 30px 0 0 0;
		max-width: 80%;
	}	
	.snippet {
		display: none;
	}
	#menubalk {
		height: 120px;
		background-color: #ffffff;
		border-bottom: 5px solid #f29400;		
	}	
	#hoofdmenu{ 
		position: absolute;
		right: 0px;
		z-index: 150;
		height: 80px;
		top: 45px;	
		border-bottom: none;
	}	
	.socialmediadiv {
		width:40px;
		height:160px;
		z-index:130;
		float:right;
		padding:0px;
		position:fixed;
		right:0;
		top:100px;
		display:inline-block;
	}
	.socialmediadiv a img {
		display:block;
	}	
	.headertekst1 {
		line-height:30px;
		padding: 10px !important;
		min-height:50px !important;
		top:20%;
		left:5%;
		z-index:1;
	}
	.headertekst2 {
		border: 1px solid #f29400;
		background-color:white;
		color: #f29400;
		top:45%;
		left:10%;
		z-index:2;
	}
	.headertekst3 {
		top:60%;
		left:30%;
		z-index:3;		
	}	
	.headerbalktekst:before {
		content: "Orthokliniek Oost - Ootmarsum-Enschede-Rijssen"
	}
	.content {
		padding: 10px 20px;
	}	
	.contentleft, .contentright {
		display:table-row;
		width: 100%;		
	}
	.contentright {
		height: 300px;
	}
	#footer {
		background-color: #fbdfb2;
		padding-bottom: 5px;
		width: 100%;
		height: 240px !important;
	}	
	.footer {
		padding: 20px 50px 20px 20px !important;
	}
	.footer img{
		max-width: 90%;
		margin-top: 20px;
	}	
}	
@media screen and (max-width:450px) {	
	#menubalk {
		height: 100px;
		background-color: #ffffff;
		border-bottom: 5px solid #f29400;		
	}	
	#hoofdmenu{ 
		position: absolute;
		right: 0px;
		z-index: 150;
		height: 80px;
		top: 45px;	
		border-bottom: none;		
	}	
	#headerbalk {
		background-color: #f29400;
		height: 20px;
		white-space:nowrap;
	}
	.headerbalktekst, .headertekst1, .headertekst2, .headertekst3, .socialmediadiv, .socialmediadiv a img {
		display:none !important;
	}
	.recept {
		width: 100%; 
		height: auto; 
	}
	.receptnodig {
		float: left; 
		width: 100%; 
		height: auto; 
		padding: 10px; 
		background: #ffffff;
	}
	.receptimg {
		clear: left;
		float: left; 
		width: 100%; 
		height: 300px; 
		overflow-y: hidden; 
		padding: 0px; 
		background: #ffffff;
	}
	.receptimg img {
		object-fit: cover;
	}
	.receptbereiding {
		clear: left;
		float: left; 
		width: 100%; 
		padding: 10px; 
		height: auto;
	}	
}

#header {
	position: relative;
}
#content {
	display:inline-block;
	background-color: #fdf6e9;
    width: 100%;
 }
#gerelateerd {
    display:inline-block;
	background-color: #ffffff;
    width: 100%;
 }
.gerelateerd {
	padding: 0px;
	float: left;
    width: 100%;	
}
.stickyfooter, .push {
	height: 135px;	
    position: relative;
    z-index: 1000;	
}
#footer {
	background-color: #fbdfb2;
	padding-bottom: 5px;
	width: 100%;
	height: 140px;
}
.footer {
	clear: both;
}
.footer {
	color: #f29400;
	text-decoration: none;
    padding: 10px;	
}
.footer a {
	color: #f29400;
	text-decoration: none;
}
.grecaptcha-badge {
    z-index: 2000;
}
blockquote {
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
	padding-left: 5px;
	border-left: 3px solid #666666;
}


input[type="button"], button[type="button"], input[type="submit"], .btn {
    background: #585858;
	min-width: 20px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: none;
    color: #ffffff;
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    line-height: 13px;
    margin: 2px 0;
    padding: 8px 13px 8px 10px !important;
	cursor: pointer;
}
input[type="button"]:hover, button[type="button"]:hover, input[type="submit"]:hover, .btn:hover {
	background: #f19110;
}

input:not([type="submit"]):not([type="button"]), select, textarea
{
	vertical-align: baseline !important;
	padding: 1px !important;
	margin: 2px !important;
	outline: 0;
	display: inline-block;
	font-family: candara, Tahoma, Arial, sans-serif; 
	font-size: 14px;
}

label
{
	vertical-align: baseline !important;
	padding-left: 1px !important;
	padding-right: 1px !important;
	padding-top: 2px !important;
	padding-bottom: 2px !important;
	outline: 0 !important;
	margin: 2px;
	clear: left;
	display: inline-block;
	min-width: 150px;
	line-height: 1em;
}

/* Tabellen */
table { 
  width: 100%; 
  border-collapse: collapse; 
}
/* Zebra striping 
tr:nth-of-type(even) { 
  background: #eee; 
}
th { 
  background: #333; 
  color: #ffffff; 
  font-weight: bold; 
}
} */
td, th { 
  text-align: left; 
  vertical-align: top;
}

/* Orthokliniek */
.headertekst1, .headertekst2, .headertekst3 {
	padding: 10px 20px;
	display:inline-block;
	position:absolute;
}
.headertekst1, .headertekst3 {
	background-color:#f29400;
	min-height:70px;
	-webkit-box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.75);
	box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.75);
	border: 1px solid white;
}
.headertekst3:hover {
    background: #d98400;
}
.headertekst1 a, .headertekst1 a:hover, .headertekst2 a, .headertekst2 a:hover, .headertekst3 a, .headertekst3 a:hover {
	text-decoration: none;
}
.contentlefttext, .contentrighttext {
	padding:20px;
}
.contentleftimage, .contentrightimage {
	padding:0px;
	overflow: hidden;
}
.white {
	background-color: #ffffff;
}
.orange {
	background-color: #fbdfb2;
}
.contentbox {
	display:table;
    width: 100%;	
}
.button {
	padding: 10px 20px;
	display:inline-block;
	background-color:#f29400;	
	color: #ffffff;
}
.button a {
	color: #ffffff;
	text-decoration: none;
}
.nivo-controlNav {
	display:none !important;
}
.nivo-caption {
	opacity: 1 !important;
}
.nivo-directionNav a{
	top: 90% !important;
}
.category_article {
	background: #ffffff;
}

/*=== Trigger  ===*/
.animate {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
 
/*=== Optional Delays, change values here  ===*/
.one {
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
animation-delay: 0.4s;
}
 
.two {
-webkit-animation-delay: 1.7s;
-moz-animation-delay: 1.7s;
animation-delay: 1.7s;
}
 
.three {
-webkit-animation-delay: 2.3s;
-moz-animation-delay: 2.3s;
animation-delay: 2.3s;
}
 
.four {
-webkit-animation-delay: 3.3s;
-moz-animation-delay: 3.3s;
animation-delay: 3.3s;
}
 
/*=== Animations start here  ===*/
/*=== FADE IN  ===*/
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
 
  to {
    opacity: 1;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
 
  to {
    opacity: 1;
  }
}
 
.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}
 
 
/*=== FADE IN DOWN ===*/
@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
 
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
 
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
 
.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}
 
/*==== FADE IN UP ===*/
@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
 
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
 
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
 
.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
 
/*=== FADE IN LEFT ===*/
@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
 
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
 
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
 
.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}
 
 
/*==== FADE IN RIGHT ===*/
@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
 
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
 
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
 
.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}