button, input[type=button], input[type=submit]
{
	background-color: var(--button-background-color);
	border-color: var(--button-border-color);
}

button[disabled=disabled], input[type=button][disabled=disabled], input[type=submit][disabled=disabled]
{
	opacity: 0.5;
}

@media (max-width: 45rem)
{

button, input[type=button], input[type=submit]
{
	background-color: var(--narrow-button-background-color);
	border-color: var(--narrow-button-border-color);
}
}

/*
input, textarea
{
	background-color: var(--input-background-color);
	border-color: var(--input-border-color);
}

select
{
	background-color: var(--select-background-color);
	border-color: var(--select-border-color);
}

@media (max-width: 45rem)
{

input, textarea
{
	background-color: var(--narrow-input-background-color);
	border-color: var(--narrow-input-border-color);
}

select
{
	background-color: var(--narrow-select-background-color);
	border-color: var(--narrow-select-border-color);
}

}
*/

@import url('https://fonts.googleapis.com/css?family=Merriweather|Roboto:400,700&display=swap');

input[type=submit]:hover, button.portal-button:hover
{
     background-color: #BB3126;
}

input[type=text], input[type=email], input[type=password], textarea
{
     border: 1px solid #18192d;
     padding: 0.4rem;
     font-size: 100%;
}

input[type=text]:focus, input[type=email]:focus, input[type=password]:focus, textarea:focus
{
     border: 1px solid #69acdf;
}

@media screen and (max-width: 45rem) 
{
.quote, .quote-bar
{
     display: none;
}
.quote-sub
{
     background-color:#404571;
     padding: 16px;
}
}

.quote-table
{
     float: right;
}

.quote
{
     color: #FFFFFF;
     font-family: "Roboto",sans-serif;
     font-size: 40px;
     font-weight: 700;
     background-color:#404571;
     width: 312px;
     padding:48px;
     padding-top:96px;
     line-height:1.2;
}

.quote-bar
{
     background-color:#404571;
     height:32px;
     width:368px;
}

.quote-bar-corner
{
     width:32px;
}

.quote-sub
{
    padding-top: 32px;
     width: 400px;
}

div.portal-main-body-bottom
{
     background-image: url("https://ioresearch.jambo.software/panel/iopanel/res/m0-document-module/F2F2F2.png");
     background-position: left top;
     background-repeat: repeat-x;
     background-size: 100% 32px;
     border-bottom: 192px solid white;
}

div.portal-main-body-bottom > div
{
     max-width: 60em;
}

div.portal-main-body-bottom > div > div > img
{
     margin-top: 96px;
}

.portal-main .markdown a
{
     font-weight: normal;
}

div.portal-main-footer div
{
     font-weight: 700;
     font-family: "Roboto",sans-serif;
     font-size: 14px;
}

div.portal-main-footer
{
     border-top: 128px solid #29A49A !important;
     border-top: 128px solid #69acdf !important;
     border-top: 128px solid #dc5c51 !important;
     border-top: 128px solid #404571 !important;
     padding: 0;
     padding-bottom: 32px;
}

.portal-main-footer a
{
     color: #18192D;
}

.portal-main-footer a.footer
{
     font-size: 10px;
}

div.portal-main-header
{
     color: #FFFFFF;
     padding-right: 48px;
}

.portal-inliner label
{
     color: #FFFFFF;
     font-family: "Roboto",sans-serif
}

.portal-inliner label:hover
{
     color: #F2F2F2;
}

div.portal-main-header a, div.portal-main-header a:hover
{
     color: #FFFFFF;
     font-weight: 700;
     font-family: "Roboto",sans-serif !important;
     text-decoration: none;
     font-size: 16px;
     padding: 8px;
     padding-right: 32px;
     background-image: url("https://www.iopanel.nl/res/m0-document-module/white-arrow-icon-png-28.png");
     background-repeat: no-repeat;
     background-position: right 4px center;
     background-size: 12px 12px;
}

div.portal-main-header a:hover
{
     background-position: right 0px center;
     color: #F2F2F2;
}

.portal-main-body-top
{
     padding: 0px !important;
     max-width: 100% !important;
     height: auto;
     max-height: 295px;
     overflow-y: hidden;
}

.portal-main a
{
     font-weight: normal;
}

.portal-main a:hover
{
     color: #BB3126;
}

@media screen and (min-width: 40rem) 
{
body.wide header>nav .home_logo
{
     margin: 1rem 0 1rem 1rem
}

nav.portal-top-primary-menu.portal-menu.menubar
{
     padding: 36px;
     padding-left: 225px;
     padding-right: 16px;
     background-image: url("https://www.ioresearch.nl/wp-content/uploads/2020/02/IO-Research-Logo-FC-RGB.svg");
     background-position: 32px center;
     background-size: 185px 150px;
     background-repeat: no-repeat;
}
}

@media screen and (max-width: 40rem) 
{
nav.portal-top-primary-menu.portal-menu.menubar
{
     padding: 32px;
     padding-left: 96px;
     padding-right: 16px;
     background-image: url("https://www.ioresearch.nl/wp-content/uploads/2020/02/IO-Research-Logo-FC-RGB.svg");
     background-position: 4px center;
     background-size: 92px 75px;
     background-repeat: no-repeat;
}
}


nav.portal-top-primary-menu>ul>li
{
	border-right: 0px dotted #fff
}
nav.portal-top-primary-menu>ul>li:last-child
{
	border-right: none
}

div.portal-main-body-top
{
/*	box-shadow: 0px 0px 5px 5px #D1D1D1; */
	z-index: -1; max-width: 62rem; margin: 0 auto;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}

div.portal-main-body-top>a.portal-anchor
{
	color: #695a5b;
	padding: 0.4rem 1.5rem;
	border-left: 2px solid #e5dede;
	float:right;
	text-decoration: none !important
}

div.portal-main-body-top>a.portal-anchor:last-child
{
	border-left: none
}

.portal-main-body-right { float: right; padding: 2rem; text-align: left; vertical-align: top; width: calc(50% - 40rem) }

@media screen and (max-width: 84rem)
{
.portal-main-body-right { display: none }
}

@media screen and (max-width: 40rem)
{
/*div.portal-main-body-top { display: none }*/
}

div.portal-main-body-center
{
/*	box-shadow: 0px 0px 5px 5px #D1D1D1; */
	z-index: -1; max-width: 60rem; margin: 0 auto;
	min-height: 20rem
}

@media screen only @