/* Browser Reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
 margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font: inherit; vertical-align: baseline; font-family: inherit; font-style: inherit; font-weight: inherit;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
 display: block
}
html {
 font-size: 62.5%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;
}
*, :before, :after {
 -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}
body {
 background: #fff; line-height: 1;
}
article, aside, details, figcaption, figure, footer, header, main, nav, section {
 display: block
}
ol, ul {
 list-style: none
}
table {
 border-collapse: collapse; border-spacing: 0;
}
caption, th, td {
 font-weight: 300; text-align: left;
}
blockquote:before, blockquote:after, q:before, q:after {
 content: ''; content: none;
}
blockquote, q {
 quotes: none
}
a:focus {
 outline: none
}
strong, b {
font-weight: 600;
}
a:hover, a:active {
 outline: 0
}
a img {
 border: 0
}
img {
 max-width: 100%; height: auto;vertical-align: middle;
}
.post_img {
 padding:20px;
}
.circular-image { width: 200px; height: 200px; -webkit-border-radius: 150px; -moz-border-radius: 150px; -ms-border-radius: 150px;-o-border-radius: 150px; border-radius: 150px;
}
select {
 max-width: 100%
}
/* Typography */
body, button, input, select, textarea {
 color: #333; font-family: 'Signika', sans-serif; font-size: 17px; line-height: 1.65em;font-weight: 300;
}
h1 {
 font-size: 26px; margin-bottom: 0.7em; color: #3F51B5; line-height: 1.65em;font-weight: 400;
}
h2 {
 font-size: 22px; margin-bottom: 0.7em;line-height: 1.65em;font-weight: 400;
}
h3 {
 font-size: 22px; color: #3F51B5; margin-bottom: 0.7em; line-height: 1.618em;font-weight: 400;
}
.tabs-pane h3 {
 font-size: 22px; color: #3F51B5; margin-bottom: 0.7em; line-height: 1.618em;font-weight: 400;
}

h4 {
 font-size: 20px; color: #3F51B5; margin-bottom: 0.7em;line-height: 1.618em;font-weight: 300;
}
p {
 margin-bottom: 1.65em
}
em, i {
 font-style: italic;
}
blockquote {
 border-left: 2px solid #205493; padding-left: 1rem;
}
a {
 color: #2196F3; text-decoration: none;
}
a:hover, a:active {
 text-decoration: underline
}
.big {
 font-size: 22px; color: #333; line-height: 1.65em;
}
.max-width-90 {
 max-width: 90%
}
.big-blue {
 font-size: 23px; color: #333; line-height: 1.65em;
}
.feature h1 {
font-size: 26px;
}
.feature h2 {
font-size: 22px;
color: #3F51B5;
font-weight: 400;
}
/* social buttons */
.grey-box {
 background: #F4F4F6; color: #fff; padding: 1em; width: 100%;
}
.share-button {
 display: inline
}
.social-group .fa {
 margin-right: 15px
}
.share-link {
 padding: 10px 20px; background-color: #FFF; color: #fff; font-size: 14px;
}
.facebook {
 background: #3B5998
}
.twitter {
 background: #00ACED
}
.google-plus {
 background: #D14836
}
/* font styling */
.subtext {
 color: #333; font-size: 17px;
}
.green-text {
  color: #00bfa5;
  font-size:18px;
}
.subtext-big {
 color: #333;
}
.intro p {
 font-size: 20px; max-width: 60%; margin: auto; padding-bottom: 50px;line-height: 40px;
}
.berekenen-intro p {
 margin-bottom: 0;
}

.big-p {
 font-size: 20px;text-align: left; padding-right: 30px;line-height: 40px;
}
.berekenen h1 {
 margin-top: 30px;
}
.content ul {
 margin-left: 1em;
}
.content li {
 list-style-type: square;
}
/* Elements */
html {
 box-sizing: border-box;
}
*, :before, :after {
 box-sizing: inherit
}
body {
 background: #fff;
}
blockquote:before, blockquote:after, q:before, q:after {
 content: ""
}
blockquote, q {
 quotes: "" ""
}
hr {
 background-color: #ccc; border: 0; height: 1px; margin-bottom: 1.618em;
}
ul, ol {
 margin: 0 0 1.65em 1em;
}
ul {
 list-style-type: square;
}
ol {
 list-style: decimal;
}
li > ul, li > ol {
 margin-bottom: 0; margin-left: 1.65em;
}
dt {
 font-weight: 600;
}
dd {
 margin: 0 11.618em 1.618em;
}
img {
 height: auto; max-width: 100%;
}
table {
 margin: 0 0 1.65em; width: 100%;
}
/* Accordion */
.accordion-title {
 position: relative; display: block; margin: 0; margin-bottom: -1px; padding: 12px 40px 12px 0; border-top: 1px solid #cbd8e6; border-bottom: 1px solid #cbd8e6; color: #212121; text-decoration: none; line-height: 1.4em; cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
}
.accordion-title.accordion-title-opened {
 margin-bottom: 0; font-weight: 600;
}
.accordion-title a, .accordion-title:hover {
 color: #333; text-decoration: none;
}
.accordion-panel {
 padding: 1.65em 0; margin-bottom: 10px;
}
.accordion-toggle {
 position: absolute; top: 50%; margin-top: -8px; right: 20px; padding: 0; font-size: 0; line-height: 1;
}
.accordion-toggle-closed {
 background: #333; width: 1px; height: 15px; margin-left: 1px;
}
.accordion-toggle-closed:before {
 position: absolute; top: 7px; left: -7px; content: ""; width: 15px; height: 1px; background: #333;
}
.accordion-toggle-opened:before {
 position: absolute; top: 7px; left: -8px; content: ""; width: 15px; height: 1px; background: #333;
}
/* FAQ */
ul.faq {
 margin-left: 0
}
ul.faq li {
 list-style: none; padding: 12px 0; border-bottom: 1px solid #eee;
}
ul.faq li::after {
 font-family: FontAwesome; content: "  "; margin: 0 7px 0 5px; color: #FF0673; float: right;
}
ul.faq a {
 color: #333
}
/* blockquote */
.blockquote-outline h2 {
color: #3F51B5;font-weight: 400;
}
.blockquote-outline ul {
list-style: none;
}
blockquote {
 margin: 40px 0
}
blockquote small, cite {
 color: #00bfa5; font-style: normal;
}
small, blockquote cite {
 line-height: 1
}
.blockquote-home {
 max-width: 820px; padding: 40px; background: #FFF; border-radius: 5px; border: none; margin: 45px auto; text-align: center;
}
blockquote p {
 font-style: normal; margin-bottom: 0.5em;
}
.blockquote-people img {
 width: 100px; height: 100px;
}
.blockquote-people li {
 border-radius: 100px; overflow: hidden; opacity: .4;
}
.blockquote-people li.active {
 opacity: 1; margin-top: -5px; border-radius: 100px; border: 6px solid #FFF;
}
.blockquote-outline {
 max-width: 820px; padding: 40px; border-radius: 5px; border: 2px solid #ecf3fb; border-top: 13px solid #ecf3fb; margin: 45px auto; text-align: center;
}
/* verzekeraars */
.verzekeraars-box3 {
 background-color: #fff; border-radius: 50%; width: 100%; height: 100%;
}
.verzekeraars-box3 .unit-logo {
 width: 200px; height: 100px; margin: 0 auto; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);
}
.whiteborder {
 border-radius: 50%; width: 290px; height: 290px; border: 1px solid #fff; padding: 10px; margin: 0 auto;
}
.verzekeraars-box2 .unit-25 {
text-align: center;border: 5px solid #ecf3fb;
}
.verzekeraars-box2 .unit-25:last-child {
 border-right: none;
}
.verzekeraars-box2 .unit-logo {
 width: 160px; margin: 20px auto;height: 100px;
}
.verzekeraars-box1 .unit-25 {
border-right: 1px solid #e7e7e8;
padding: 25px;
text-align: center;
margin: 25px auto;
}
.verzekeraars-box1 .unit-logo {
 width: 160px; height: 50px; margin-bottom: 25px; margin-left: auto; margin-right: auto;
}
.verzekeraars-box1 .unit-25:last-child {
 border-right: 0;
}
.box-float {
width: 25%;
float: left;
border: 1px dashed #cbd8e6;
padding: 25px;
text-align: center;
margin: 25px auto;
height: 300px;
}
@media (max-width: 979px){
  .box-float {
  width: 320px;
  float: left;
  }
}
/* Tables */
.compare table {
  max-width: 100%;
  width: 100%;
  empty-cells: show;
  background-color: #fff;
}
.compare table img {
  vertical-align: top;
}
.compare table caption {
  text-transform: uppercase;
  padding: 0 1.0999999999999999em;
  color: rgba(0, 0, 0, 0.4);
  font-size: 12.75px;
}
.compare table th,
.compare table td {
  border-bottom: 1px solid #CFD8DC;
  padding: 1.825em 1.0999999999999999em;
  vertical-align: middle;
}
.compare table tfoot th,
.compare table tfoot td {
  color: rgba(0, 0, 0, 0.4);
}
.compare table thead {
    color: #333;
}
td.aanbieder {
width: 175px;
}
.cel-a {
  width: 25%;
  color: #3F51B5;
}
.cel-b {
  width: 75%;
  color: #333;
}
td {
  padding: 4px 0;
}
@media screen and (max-width: 600px) {
table {width:100%;}
thead {display: none;}
tr:nth-of-type(2n) {background-color: inherit;}
tr td:first-child {background: #f0f0f0; font-weight:600;font-size:1.3em;}
tbody td {display: block;  text-align:center;}
tbody td:before {
    content: attr(data-th);
    display: block;
    text-align:center;
  }
}
/* rating */
.rating span.star.filled::before{ color:#cbd8e6; content:"\f005";}
.rating span.star::before {
 content: "\f005"; padding-right: 5px; color: #ffca28;
}
.verzekeraars-box1 {
 margin-bottom: 90px
}
::before, ::after {
 box-sizing: border-box
}
.rating span.star {
 font-family: FontAwesome; font-weight: 300; font-style: normal; font-size: 17px;
}
.rating {
 direction: rtl; color: #333; font-size: 0;
}
/* pricetables */
.units-row.pricetables {
 margin-bottom: 140px; margin-top: 50px;
}
.pricetables .unit-33 {
 margin-left: -1px
}
.pricetables .unit-33:first-child {
 border: 3px solid #00BFA5; margin-top: -3px;
}
.pricetables .logowrap {
 width: 150px; height: 80px; margin-bottom: 10px; margin-left: auto; margin-right: auto;
}
.pricetables .logobox {
 padding: 50px 0 30px; border-left: 1px solid #cbd8e6; border-right: 1px solid #cbd8e6; border-top: 5px solid #cbd8e6;
}
ul.voorwaarden {
 list-style: none; width: 100%; margin: 0; display: block;
}
ul.voorwaarden li {
 border-left: 1px solid #cbd8e6; border-top: 1px solid #cbd8e6; border-right: 1px solid #cbd8e6; background-color: #FFFEF1; padding: 12px 0; text-align: center;
}
.pricetables .price-button {
 border: 1px solid #cbd8e6; padding: 35px;
}
.pricetables .socialproof {
 background-color: #00BFA5; color: #FFF; padding: 20px;
}
.pricetables .fa-check {
 margin-right: 10px; color: #00BFA5;
}
.pricetables .fa-close {
 margin-right: 10px; color: #D0021B;
}
/* WordPress Styles */
.alignnone {
 margin: 5px 20px 20px 0
}
.aligncenter, div.aligncenter {
 display: block; margin: 5px auto;
}
.alignright {
 float: right; margin: 5px 0 20px 20px;
}
.alignleft {
 float: left; margin: 5px 20px 20px 0;
}
a img.alignright {
 float: right; margin: 5px 0 20px 20px;
}
a img.alignnone {
 margin: 5px 20px 20px 0
}
a img.alignleft {
 float: left; margin: 5px 20px 20px 0;
}
a img.aligncenter {
 display: block; margin-left: auto; margin-right: auto;
}
/* blog */
.block-entry {
 overflow: hidden; border-bottom: 1px solid #cbd8e6;
}
h2 a {
 font-size: 18px; color: #212121; font-weight: 400; text-decoration: underline;line-height: 33px;display: block;
}
.block-entry img {
 float: left; margin-right: 30px;
}
.block-entry p {
 margin-top: 15px
}
/* comments */
#comments {
 margin-top: 100px
}
#comments .date {
 margin-left: 10px
}
#comments h3 {
 color: #212121; margin-bottom: 30px;
}
#comments form {
 margin-top: 70px
}
#comments .forms span.star::before {
 color: #CFD8DC
}
#comments .answer {
 border-top: 1px solid #cbd8e6; border-bottom: 1px solid #cbd8e6; padding-top: 30px; margin-top: -1px;
}
#comments .comment-content {
 margin-top: 20px
}
li.comment {
 list-style: none
}
/* colors */
.gray-light {
 background-color: #F4F4F6
}
/* Buttons */
.btn, input[type="submit"].btn {
 display: inline-block; vertical-align: top; font-family: 'Signika', sans-serif; font-size: 1em; font-weight: 300; line-height: 1.65em; text-align: center; text-decoration: none; color: #222; -webkit-appearance: none; outline: none; margin: 0; border: none; border-radius: 5px; box-shadow: none; cursor: pointer; background: #e0e3e5; padding: 15px 30px;border-bottom: 3px solid rgba(0, 0, 0, 0.1);
}
.btn::-moz-focus-inner {
 border: 0; padding: 0;
}
.btn-outline, input[type="submit"].btn-outline {
 background: none;
}
.btn-outline:hover, input[type="submit"].btn-outline:hover {
 border-color: #b3b6b7
}
.btn-blue:hover, input[type="submit"].btn-blue:hover {
 color: #00BFA5; background: #1a52a5;
}
.btn-blue.btn-outline, input[type="submit"].btn-blue.btn-outline {
 background: #F4F4F6;padding: 15px 30px;border-bottom: 3px solid rgba(0, 0, 0, 0.1);border-radius: 5px;
}
.btn-blue.btn-outline:hover, input[type="submit"].btn-blue.btn-outline:hover {
 color: #fff; background: #3f51b5;
}
.btn-red, input[type="submit"].btn-red {
 color: #fff; background: #3F51B5;background-image: linear-gradient(60deg, #0F1980, #3F51B5);font-weight: 600;text-decoration: underline;font-size: 20px;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .16);
}
.btn-red:hover, input[type="submit"].btn-red:hover {
 color: #fff; background: #3F51B5;
}
.btn-green, input[type="submit"].btn-green {
 color: #fff; background-color: #00CAAB;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .16);
}
.btn-green:hover, input[type="submit"].btn-green:hover {
 color: #fff; opacity: .85;
}
.btn-green:after, input[type="submit"].btn-green:after {
  content: "";
  font-family: 'fontAwesome';
  margin-left: 15px;
  color: white;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
/* Buttons Group */
.btn-group {
 margin: 0 auto
}
.btn-single, .btn-group {
 display: inline-block; margin-right: 2px; vertical-align: bottom;
}
.btn-single:after, .btn-group:after {
 content: ""; display: table; clear: both;
}
/* header */

.site-header {
padding: 20px 0 0 0;
position: relative;
}
.site-branding {
float: left;
margin-bottom:10px;
}
.site-branding img {
 display: block
}
.itemscope {
 margin: 0; padding: 0;
}
a.sitelogo {
 display: block; text-decoration: none; border: none; line-height: 20px; padding: 10px 0;
}
#site-navigation {
 float: right
}
#site-navigation ul {
 margin: 0; padding: 0;
}
#site-navigation li {
 float: left; list-style-type: none; padding: 10px 15px;
}
#site-navigation a:link {
 text-decoration: none; display: block; padding-top: 10px; padding-bottom: 10px; line-height: 21px;
}
#site-navigation a:hover {
 text-decoration: underline
}
/* sections */
.section {
 width: 100%
}
section.feature-big {
overflow: hidden;
 background-repeat:no-repeat;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover;
background-position:center;
position: relative;
}
section.feature-small {
 padding-top: 40px; padding-bottom: 0;
}
section.feature-image {
 padding-top: 0; padding-bottom: 0;
}
section.feature {
 padding-top: 95px; padding-bottom: 95px;
}
section.content {
 padding-top: 75px; padding-bottom: 95px;
}
.image-bg {
 margin-top: 90px; bottom: 0; height: 100px; width: 100%;
}
section.feature-big.bg-blue-light {
margin-right: 3%;
border-radius: 0 0 50px 0;
}
section.feature-big.bg-blue-light::before {
content: "";
position: absolute;
bottom: 0;
left: 50%;
width: 0;
height: 0;
z-index: 2;
}
section.feature-big.bg-blue-light::after {
content: "";
position: absolute;
bottom: 0;
z-index: 2;
height: 47px;
width: 100%;
background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.1) 80%, rgba(255, 255, 255, 0.1) 100%);
margin-bottom: -10px;
}
.berekenen .image-bg {
 bottom: 0; margin: 0; height: 100px;
}
.feature-big ol {
margin: 0 0 0 1em;
  }
.overlay-img {
    opacity: 0.4;
    width: 100%;
height: 400px;
background-repeat: no-repeat;
background-size: cover;
}
.overlay-img-small {
    width: 100%;
height: 150px;
background-repeat: no-repeat;
background-size: cover;
}
.site-section-content {
 padding-top: 0; padding-bottom: 40px;
}
.bg-white {
 background-color: #fff;
}
.bg-blue-light {
 background-color: #ecf3fb;
}
.bg-green-light {
 background-color: #E0F2F1;
}
.bg-green-lighter {
 background-color: #EFF8F8;
}
.bg-blue {
 background-color: #3F51B5;
}
/* Breadcrumbs */
.post-template-default .breadcrumbsbox{
 padding: 15px 0;background-color: #ecf3fb;
}
.breadcrumbsbox {
 padding: 15px 0;background-color: #fff;
}
.page-template-verzekering .breadcrumbsbox {
 padding: 20px 0; border-top: 2px solid #ecf3fb; border-bottom: 0;
}
.breadcrumbs:after {
 content: ""; display: table; clear: both;
}
.breadcrumbs ul {
 font-size: 0.9em; list-style: none; margin: 0;
}
.breadcrumbs ul:after {
 content: ""; display: table; clear: both;
}
.breadcrumbs li {
 float: left; margin-right: 5px; text-transform: lowercase;
}
.breadcrumbs li + li:before {
 font-family: FontAwesome; content: "  "; margin: 0 7px 0 5px; color: #333;
}
.breadcrumbs a {
text-decoration: none; text-transform: lowercase;
}
.breadcrumbs a:hover {
 color: #333; text-decoration: underline;
}
.breadcrumbs li.active a, .breadcrumbs span, .breadcrumbs li.active a:hover {
 text-decoration: none; cursor: text; color: #333; text-transform: lowercase;
}
/* forms */
input, textarea {
 width: 100%; padding: 10px; font: 18px 'Signika', sans-serif; border: 1px solid #cbd8e6;
}
.comment-form #submit {
    background: #f4f4f6;
    padding: 15px 30px;
    border-bottom: 3px solid rgba(0, 0, 0, .1);
    border-radius: 5px;
}
::-webkit-input-placeholder {
 color: #333;
}
:-moz-placeholder {
 /* Firefox 18- */ color: #333;
}
::-moz-placeholder {
 /* Firefox 19+ */ color: #333;
}
:-ms-input-placeholder {
 color: #333;
}
/* Column Widths and Positions */
.wrapper, #main, #footer {
 margin: auto; max-width: 1170px; padding: 0 20px;
}
.wrap-hide {
 margin: auto; max-width: 1170px; padding: 0 20px;
}
.wrap-full {
 margin: auto; max-width: 1170px; padding: 0 20px;
}
.wrap {
 position: relative
}
/* Grid */
.units-container:after, .units-row:after {
 content: ""; display: table; clear: both;
}
.units-container:after, .units-row:after {
 content: ""; display: table; clear: both;
}
.units-container {
 /* it's the trick to not collapse padding-top in the child element */ padding-top: 1px; margin-top: -1px;
}
.units-row {
 margin-bottom: 2em
}
.width-100, .unit-100 {
 width: 100%
}
.width-90, .unit-90 {
 width: 90%
}
.width-80, .unit-80 {
 width: 80%
}
.width-75, .unit-75 {
 width: 75%
}
.width-70, .unit-70 {
 width: 70%
}
.width-66, .unit-66 {
 width: 66.6%
}
.width-65, .unit-65 {
 width: 65%
}
.width-60, .unit-60 {
 width: 60%
}
.width-50, .unit-50 {
 width: 50%
}
.width-40, .unit-40 {
 width: 40%
}
.width-35, .unit-35 {
 width: 35%
}
.width-33, .unit-33 {
 width: 33.3%
}
.width-30, .unit-30 {
 width: 30%
}
.width-25, .unit-25 {
 width: 25%
}
.width-20, .unit-20 {
 width: 20%
}
.width-10, .unit-10 {
 width: 10%
}
.units-row .unit-90, .units-row .unit-80, .units-row .unit-75, .units-row .unit-70, .units-row .unit-66, .units-row .unit-65, .units-row .unit-60, .units-row .unit-50, .units-row .unit-40, .units-row .unit-35, .units-row .unit-33, .units-row .unit-30, .units-row .unit-25, .units-row .unit-20, .units-row .unit-10 {
 float: left; margin-left: 3%;
}
.units-row .unit-90:first-child, .units-row .unit-80:first-child, .units-row .unit-75:first-child, .units-row .unit-70:first-child, .units-row .unit-66:first-child, .units-row .unit-65:first-child, .units-row .unit-60:first-child, .units-row .unit-50:first-child, .units-row .unit-40:first-child, .units-row .unit-35:first-child, .units-row .unit-33:first-child, .units-row .unit-30:first-child, .units-row .unit-25:first-child, .units-row .unit-20:first-child, .units-row .unit-10:first-child {
 margin-left: 0
}
.units-row .unit-90 {
 width: 89.7%
}
.units-row .unit-80 {
 width: 79.4%
}
.units-row .unit-75 {
 width: 74.25%
}
.units-row .unit-70 {
 width: 69.1%
}
.units-row .unit-66 {
 width: 65.666666666667%
}
.units-row .unit-65 {
 width: 65.666666666667%
}
.units-row .unit-60 {
 width: 58.8%
}
.units-row .unit-50 {
 width: 48.5%
}
.units-row .unit-40 {
 width: 38.2%
}
.units-row .unit-35 {
 width: 31.333333333333%
}
.units-row .unit-33 {
 width: 31.333333333333%
}
.units-row .unit-30 {
 width: 27.9%
}
.units-row .unit-25 {
 width: 22.75%
}
.units-row .unit-20 {
 width: 17.6%
}
.units-row .unit-10 {
 width: 7.3%
}
.centered, .unit-centered {
 float: none !important; margin: 0 auto !important;
}
.unit-padding {
 padding: 1.65em
}
.units-padding .unit-100, .units-padding .unit-90, .units-padding .unit-80, .units-padding .unit-75, .units-padding .unit-70, .units-padding .unit-66, .units-padding .unit-65, .units-padding .unit-60, .units-padding .unit-50, .units-padding .unit-40, .units-padding .unit-35, .units-padding .unit-33, .units-padding .unit-30, .units-padding .unit-25, .units-padding .unit-20, .units-padding .unit-10 {
 padding: 1.65em
}
.units-split .unit-90, .units-split .unit-80, .units-split .unit-75, .units-split .unit-70, .units-split .unit-66, .units-split .unit-65, .units-split .unit-60, .units-split .unit-50, .units-split .unit-40, .units-split .unit-35, .units-split .unit-33, .units-split .unit-30, .units-split .unit-25, .units-split .unit-20, .units-split .unit-10 {
 margin-left: 0
}
.units-split .unit-90 {
 width: 90%
}
.units-split .unit-80 {
 width: 80%
}
.units-split .unit-75 {
 width: 75%
}
.units-split .unit-70 {
 width: 70%
}
.units-split .unit-66 {
 width: 66.6%
}
.units-split .unit-65 {
 width: 65%
}
.units-split .unit-60 {
 width: 60%
}
.units-split .unit-50 {
 width: 50%
}
.units-split .unit-40 {
 width: 40%
}
.units-split .unit-35 {
 width: 35%
}
.units-split .unit-33 {
 width: 33.3%
}
.units-split .unit-30 {
 width: 30%
}
.units-split .unit-25 {
 width: 25%
}
.units-split .unit-20 {
 width: 20%
}
.units-split .unit-10 {
 width: 10%
}
.unit-push-50 {
position: relative;
padding: 70px 70px 100px 60px;
left: 0;
background: linear-gradient(-180deg, rgba(63, 81, 181, 0.71) 0%, #3F51B5 75%);
max-width: 600px;
width: 90%;
border-radius: 0 50px 0 0;
}
.unit-push-50 h1 {
color:white;
}
.unit-push-50 p {
color: #B7BEE3;
}
ul.toplist__list {
    color: #B7BEE3;
}
header:after {
 content: ""; display: table;
}
header:after {
 clear: both
}
/* panel */
.panel {
 position: fixed; left: -15.625em; width: 15.625em; border-right: 1px solid #cbd8e6; background-color: #F4F4F6;
}
.panel a {
 text-decoration: none; margin-bottom: 10px; margin-left: 15px; font-size: 16px; color: #212121;
}
.panel ul {
 list-style: outside none none; margin: 20px 0 0 20px;
}
.panel li {
 margin-bottom: 5px
}
/* Helpers */
.text-centered {
 text-align: center;
}
.text-left {
 text-align: left;
}
.text-right {
 text-align: right;
}
.block {
 display: block;
}
.left {
 float: left;
}
.right {
 float: right;
}
.margin {
 margin: 20px;
}
.margin-top {
 margin-top: 20px;
}
.margin-right {
 margin-right: 20px;
}
.margin-left {
 margin-left: 20px;
}
.padding {
 padding: 20px;
}
.end {
 margin-bottom: 0 !important;
}

/* Pagination */
.pagination {
 position: relative; left: -9px; margin-left: 0; list-style: none;
}
.pagination:after {
 content: ""; display: table; clear: both;
}
.pagination li {
 float: left; margin-right: 2px; list-style-type: none; display: inline-block;
}
.pagination a, .pagination span {
 display: block; padding: 5px 15px; border-radius: 0; border: 1px solid #3F51B5; color: #3F51B5; text-decoration: none;
}
.pagination li:last-child a {
 border: none
}
.pagination span, .pagination li.active a, .pagination li.active a:hover {
 border: 1px solid #cbd8e6; color: #333; cursor: text;
}
.pagination a:focus, .pagination a:hover {
 text-decoration: underline; background-color: #3F51B5; color: #fff;
}
/* NavBar */
.navbar:after {
 content: ""; display: table; clear: both;
}
.navbar ul {
 list-style: none; margin: 0 auto; display: inline-block;
}
.navbar li {
 float: left; margin-right: 1.65em;
}
/* Tabs */
.nav-tabs {
 margin-bottom: 5em
}
.nav-tabs:after {
 content: ""; display: table; clear: both;
}
.nav-tabs ul {
 list-style: none; margin: 0;
}
.nav-tabs li {
 float: left; margin-right: -1px;
}
.nav-tabs a, .nav-tabs span {
 display: block; line-height: 1; padding: 1em 2em;
}
.nav-tabs a {
 color: #333; text-decoration: none;background-color: #F4F4F6;
}
.nav-tabs a:hover {
 color: #333; background-color: #F4F4F6;
}
.nav-tabs li.active a, .nav-tabs span {
 color: #3F51B5; background: #fff; position: relative; border: 1px solid #3F51B5; cursor: default; text-decoration: none;
}
/* Tabby */
.tabs {
 display: none; visibility: hidden;
}
.tab-button {
 display: inline-block; margin-right: 1.65em; opacity: .4;
}
.tab-button:last-child {
 margin-right: 0
}
.tab-button.active {
 opacity: 1
}
.js-tabby .tabs {
 display: block; visibility: visible;
}
.tabs img {
 border-radius: 50%; box-shadow: 0 0 0 6px #FFF;
}
.js-tabby .tabs-pane {
 display: none; visibility: hidden;
}
.tabs-pane.active {
 display: block; visibility: visible;
}
.tabs:before, .tabs:after {
 display: table; content: "";
}
.tabs:after {
 clear: both
}
/* cards */
.card-wrap {
 padding: 25px; background-color: #fff;
}
.card-p {
 text-align: left; padding-right: 30px;
}
.card h3 {
 color:#212121;
}
.card-wrap h3 {
font-size: 18px;
}

/* Sidebars */
.widget-title {
 word-wrap: break-word
}
.sidebar ul {
 margin: 0
}
.sidebar li {
 list-style-type: none; margin-bottom: 8px; padding: 0; word-wrap: break-word;
}
.sidebar ul > li:last-child {
 margin-bottom: 0
}
.sidebar .widget {
 margin-bottom: 50px
}
.sidebar .search-form {
 width: 100%
}
/* Primary Sidebar */
.sidebar-primary {
 float: right; width: 300px; padding-top: 10px;
}
.sidebar-primary a {
 text-decoration: underline
}
/* icons */
.icon img {
 margin-bottom: 55px
}
/* footer */
#footer {
padding: 40px 0; color: #333;
}
#footer a {
 color: #333
}
.footerlinks a {
 color: #333
}
ul.footerlinks {
list-style-type: none;
padding: 0;
margin:0;
}
ul.footerlinks2 {
margin-top: 55px;
list-style-type: none;
padding: 0;
}
#footer a {
 color: #333
}
.footer-logo p {
color: #333;
padding: 15px 0;
}
.footer-logo {
    margin-bottom: 40px;
}
.canvas-brands, .canvas-brands figure {
    display: inline-block;
    line-height: 0;
    margin-left: 60px;
}
.canvas-brands, .canvas-brands figure {
    margin-left: 0;
}
.canvas-brands img {
    height:auto;
    max-width:80px;
    max-height:40px;
    margin-right: 25px;
    margin-top: 10px;
}
/* Responsive */
@media only screen and (max-width: 767px) {
    .left {
     float: none
    }
    .hide-on-mobile {
     display: none;
    }
    header .btn-blue.btn-outline {
     margin: 0; border: 0;padding: 0;background-color: white;
    }
    .nav-tabs li {
     float: none; margin-left: 0; width: 100%;
    }
}

@media only screen  and (min-width : 1284px) {
    .unit-push-50 {
    left: 5%;
}
}

/* =Grid Responsive */
@media only screen and (max-width: 767px) {
    .mobile-width-100 {
     width: 100%
    }
    .units-row .unit-90, .units-row .unit-80, .units-row .unit-75, .units-row .unit-70, .units-row .unit-66, .units-row .unit-65, .units-row .unit-60, .units-row .unit-50, .units-row .unit-40, .units-row .unit-35, .units-row .unit-33, .units-row .unit-30, .units-row .unit-25, .units-row .unit-20, .units-row .unit-10 {
     width: 100%; float: none; margin-left: 0; margin-bottom: 2em;
    }
    .unit-push-90, .unit-push-80, .unit-push-75, .unit-push-70, .unit-push-66, .unit-push-65, .unit-push-60, .unit-push-50, .unit-push-40, .unit-push-35, .unit-push-33, .unit-push-30, .unit-push-25, .unit-push-20, .unit-push-10 {
     left: 0
    }
    .units-row .unit-push-right {
     float: none
    }
    .units-mobile-50 .unit-90, .units-mobile-50 .unit-80, .units-mobile-50 .unit-75, .units-mobile-50 .unit-70, .units-mobile-50 .unit-66, .units-mobile-50 .unit-65, .units-mobile-50 .unit-60, .units-mobile-50 .unit-40, .units-mobile-50 .unit-30, .units-mobile-50 .unit-35, .units-mobile-50 .unit-33, .units-mobile-50 .unit-25, .units-mobile-50 .unit-20, .units-mobile-50 .unit-10 {
     float: left; margin-left: 3%; width: 48.5%;
    }
    .units-mobile-50 .unit-90:first-child, .units-mobile-50 .unit-80:first-child, .units-mobile-50 .unit-75:first-child, .units-mobile-50 .unit-70:first-child, .units-mobile-50 .unit-66:first-child, .units-mobile-50 .unit-65:first-child, .units-mobile-50 .unit-60:first-child, .units-mobile-50 .unit-40:first-child, .units-mobile-50 .unit-35:first-child, .units-mobile-50 .unit-30:first-child, .units-mobile-50 .unit-33:first-child, .units-mobile-50 .unit-25:first-child, .units-mobile-50 .unit-20:first-child, .units-mobile-50 .unit-10:first-child {
     margin-left: 0
    }
}
/* Typography Responsive */
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
    h1 {
     font-size: 26px; line-height: 1.125;
    }
    h2 {
     font-size: 22px; line-height: 1.25;
    }
    h3 {
     line-height: 1.25;
    }
    h4 {
     line-height: 1.22
    }
    .intro p {
     font-size: 22px; max-width: 80%;
    }
    .wrap-hide {
     margin: auto; max-width: 1170px; padding: 0;
    }
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
    button, input, select, textarea, html, body, form {
     font-size: 16px
    }
    h1 {
     font-size: 22px; line-height: 1.25;
    }
    .feature h2 {
     font-size: 22px; line-height: 1.15384615;
    }
    h2 {
     font-size: 22px; line-height: 1.15384615;
    }
    h3 {
     font-size: 20px; line-height: 1.13636364;
    }
    h4 {
     font-size: 18px; line-height: 1.11111111;
    }
    .intro p {
     font-size: 18px; font-weight: 300; max-width: 90%;
    }
    .big-p {
     font-size: 18px; font-weight: 300;
    }
    ul, ol, ul ul, ol ol, ul ol, ol ul {
     margin-left: 1.65em
    }
    blockquote {
     margin-left: 0;
    }
    .btn-group {
     width: 100%;
    }
    section.feature-image {
     display: none;
    }
    .wrap-hide {
     margin: auto; max-width: 1170px; padding: 0;
    }
    #footer {
     font-size: 15px;
    }
    #header {
     border-bottom: 1px solid #E3F2FD;
    }
}
/* Forms Responsive */
@media only screen and (max-width: 767px) {
    .forms-list label {
     display: inline-block;
    }
}

/* The side navigation menu */
.sidenav {
    height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 100; /* Stay on top */
    top: 0;
    left: 0;
    background-color: #F4F4F6; /* Black*/
    border-right: 1px solid #cbd8e6;
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 60px; /* Place content 60px from the top */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 17px;
    color: #333;
    display: block;
    transition: 0.3s
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover, .offcanvas a:focus{
    text-decoration: underline;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 18px;}
}