/*! HTML5 Boilerplate v5.0.0 | MIT License | http://h5bp.com/ */



/*

 * What follows is the result of much research on cross-browser styling.

 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,

 * Kroc Camen, and the H5BP dev community and team.

 */



/* ==========================================================================

   Base styles: opinionated defaults

   ========================================================================== */



html {

    color: #222;

    font-size: 1em;

    line-height: 1.4;

}



/* roboto-100 - latin */

@font-face {

  font-family: 'Roboto';

  font-style: normal;

  font-weight: 100;

  src: url('../fonts/roboto-v30-latin-100.eot'); /* IE9 Compat Modes */

  src: local(''),

       url('../fonts/roboto-v30-latin-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */

       url('../fonts/roboto-v30-latin-100.woff2') format('woff2'), /* Super Modern Browsers */

       url('../fonts/roboto-v30-latin-100.woff') format('woff'), /* Modern Browsers */

       url('../fonts/roboto-v30-latin-100.ttf') format('truetype'), /* Safari, Android, iOS */

       url('../fonts/roboto-v30-latin-100.svg#Roboto') format('svg'); /* Legacy iOS */

}

/* roboto-300 - latin */

@font-face {

  font-family: 'Roboto';

  font-style: normal;

  font-weight: 300;

  src: url('../fonts/roboto-v30-latin-300.eot'); /* IE9 Compat Modes */

  src: local(''),

       url('../fonts/roboto-v30-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */

       url('../fonts/roboto-v30-latin-300.woff2') format('woff2'), /* Super Modern Browsers */

       url('../fonts/roboto-v30-latin-300.woff') format('woff'), /* Modern Browsers */

       url('../fonts/roboto-v30-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */

       url('../fonts/roboto-v30-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */

}

/* roboto-regular - latin */

@font-face {

  font-family: 'Roboto';

  font-style: normal;

  font-weight: 400;

  src: url('../fonts/roboto-v30-latin-regular.eot'); /* IE9 Compat Modes */

  src: local(''),

       url('../fonts/roboto-v30-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */

       url('../fonts/roboto-v30-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */

       url('../fonts/roboto-v30-latin-regular.woff') format('woff'), /* Modern Browsers */

       url('../fonts/roboto-v30-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */

       url('../fonts/roboto-v30-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */

}

/* roboto-500 - latin */

@font-face {

  font-family: 'Roboto';

  font-style: normal;

  font-weight: 500;

  src: url('../fonts/roboto-v30-latin-500.eot'); /* IE9 Compat Modes */

  src: local(''),

       url('../fonts/roboto-v30-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */

       url('../fonts/roboto-v30-latin-500.woff2') format('woff2'), /* Super Modern Browsers */

       url('../fonts/roboto-v30-latin-500.woff') format('woff'), /* Modern Browsers */

       url('../fonts/roboto-v30-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */

       url('../fonts/roboto-v30-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */

}

/* roboto-700 - latin */

@font-face {

  font-family: 'Roboto';

  font-style: normal;

  font-weight: 700;

  src: url('../fonts/roboto-v30-latin-700.eot'); /* IE9 Compat Modes */

  src: local(''),

       url('../fonts/roboto-v30-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */

       url('../fonts/roboto-v30-latin-700.woff2') format('woff2'), /* Super Modern Browsers */

       url('../fonts/roboto-v30-latin-700.woff') format('woff'), /* Modern Browsers */

       url('../fonts/roboto-v30-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */

       url('../fonts/roboto-v30-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */

}

/* roboto-900 - latin */

@font-face {

  font-family: 'Roboto';

  font-style: normal;

  font-weight: 900;

  src: url('../fonts/roboto-v30-latin-900.eot'); /* IE9 Compat Modes */

  src: local(''),

       url('../fonts/roboto-v30-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */

       url('../fonts/roboto-v30-latin-900.woff2') format('woff2'), /* Super Modern Browsers */

       url('../fonts/roboto-v30-latin-900.woff') format('woff'), /* Modern Browsers */

       url('../fonts/roboto-v30-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */

       url('../fonts/roboto-v30-latin-900.svg#Roboto') format('svg'); /* Legacy iOS */

}



/*

 * Remove text-shadow in selection highlight:

 * https://twitter.com/miketaylr/status/12228805301

 *

 * These selection rule sets have to be separate.

 * Customize the background color to match your design.

 */



::-moz-selection {

    background: #b3d4fc;

    text-shadow: none;

}



::selection {

    background: #b3d4fc;

    text-shadow: none;

}



/*

 * A better looking default horizontal rule

 */



hr {

    display: block;

    height: 1px;

    border: 0;

    border-top: 1px solid #ccc;

    margin: 1em 0;

    padding: 0;

}



/*

 * Remove the gap between audio, canvas, iframes,

 * images, videos and the bottom of their containers:

 * https://github.com/h5bp/html5-boilerplate/issues/440

 */



audio,

canvas,

iframe,

img,

svg,

video {

    vertical-align: middle;

}



/*

 * Remove default fieldset styles.

 */



fieldset {

    border: 0;

    margin: 0;

    padding: 0;

}



/*

 * Allow only vertical resizing of textareas.

 */



textarea {

    resize: vertical;

}



/* ==========================================================================

   Browser Upgrade Prompt

   ========================================================================== */



.browserupgrade {

    margin: 0.2em 0;

    background: #ccc;

    color: #000;

    padding: 0.2em 0;

}



/* ==========================================================================

   Author's custom styles

   ========================================================================== */



body {

    background-color: #ffffff;

    font-family: 'Roboto', sans-serif;

    font-size: 18px;

    font-weight: 100;

    color: #282828;

    overflow-y: scroll;

}



h1 {

    font-size: 32px;

    font-weight: 100;

}



h2 {

    font-size: 26px;

    font-weight: 100;

    margin-bottom: 10px;

}



.white {

    color: #fff;

}



.black {

    color: #000;

}



input[type="text"], input[type="password"], input[type="email"], select, textarea {

    border: 1px solid #c6c6c6;

    outline: none;

    padding: 10px;

    margin: 10px 10px 10px 0px;

}



select {

    height: 40px;

    color: #888;

}



select option {

    color: #282828;

}



input[type="text"]:hover, input[type="text"]:focus, input[type="password"]:hover, input[type="password"]:focus, input[type="email"]:hover, input[type="email"]:focus, select:hover, select:focus, textarea:hover, textarea:focus {

    border: 1px solid #6d73af;

}



input[type=button], input[type="submit"] {

    border: 1px solid #282828;

    border-radius: 3px;

    outline: none;

    padding: 10px 20px 10px 20px;

    margin: 10px 10px 10px 0px;

    background-color: #c6c6c6;

    color: #282828;

    text-transform: uppercase;

}



input[type=button]:hover, input[type="submit"]:hover {

    background-color: #6d73af;

    color: #fff;

}



.wrapper {

    width: 100%;

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}



.wrapperFB {

    width: 100%;

    padding: 40px;

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}



.outherWrapper {

    width: 100%;

}



.innerWrapperNoPadding {

    width: 1000px;

    margin: 0 auto;

}



.innerWrapper {

    width: 1000px;

    margin: 0 auto;

    padding: 40px 0px 50px 0px;

}



/* different colors */



.lightgray {

    background-color: #f3f3f3;

}



.verylightgray {

    background-color: #fafafa;

}



.footergray {

    background-color: #f6f6f6;

}



.gray {

    color: #767777;

}



.ecemedBlue {

    background-color: #3c4363;

    color: #fff;

}



.ecemedBlueText {

    color: #3c4363;

}



.ecemedHoverBlue {

    background-color: #6d73af;

    color: #fff;

}



.ecemedBlueOther {

    color: #4c54a9;

}



/* end different colors */



.outherHeader {

    -webkit-box-shadow: 0px 2px 10px 0px rgba(50, 50, 50, 0.48);

    -moz-box-shadow:    0px 2px 10px 0px rgba(50, 50, 50, 0.48);

    box-shadow:         0px 2px 10px 0px rgba(50, 50, 50, 0.48);

    margin-bottom: 5px;

}



.header {

    height: 100px;

    line-height: 100px;

}



.logo {

    float: left;

}



.navigation {

    float: right;

}



.animBlock[data-position="right"] {

    

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}



/* Navigation */



.current a{

    border-bottom: 3px solid #8086b6;

    margin-bottom: 5px;

}



#mainNav, #navFixed {

    font-size: 18px;

    font-weight: 300;

    text-transform: uppercase;

    text-align: center;

    margin-top: -15px;

}



#mainNav ul, #navFixed ul {

    list-style: none;

    padding: 0px;

}



#mainNav ul li, #navFixed ul li {

    float: left;

    margin-left: 25px;

    margin-right: 25px;

}



#mainNav a:link, #mainNav a:visited, #navFixed a:link, #navFixed a:visited {

    color: #282828;

    text-decoration: none;

}

/*

#mainNav a li:active, .active {

    border-bottom: 2px solid #c2292e;

    padding-bottom: 5px;

}

*/



#mainNav li:hover, #mainNav li:active, #navFixed li:hover, #navFixed li:active {

    cursor: pointer;

}



nav div#pull, nav div#pullFixed {  

    display: none;  

}



#scrollNav {

    z-index: 9000;

    position: fixed;

    top: 0px;

    display: none;

    background-color: #fff;

    width: 100%;

    margin: 0 auto;

    left: 0px;

    -webkit-box-shadow: 0px 2px 10px 0px rgba(50, 50, 50, 0.48);

    -moz-box-shadow:    0px 2px 10px 0px rgba(50, 50, 50, 0.48);

    box-shadow:         0px 2px 10px 0px rgba(50, 50, 50, 0.48);

    margin-bottom: 5px;

}



#navFixed {

    float: right;

}



/* END Navigation */



#start {

    background-image: url(../img/aeskulapstab.png);

    background-position: center;

    background-repeat: no-repeat;

    height: 500px;

    text-align: center;

}



.startFirstBlock {

    font-size: 64px;

    font-weight: 500;

    margin-top: 100px;

    margin-bottom: 150px;

}



.startSecondBlock {

    font-size: 30px;

    color: #565656;

    font-weight: 100;

}



.whiteBold {

    font-weight: 400;

    text-transform: uppercase;

    display: inline-block;

    margin-top: 30px;

}



.blackBold {

    font-weight: 300;

    margin-bottom: 30px;

}



.ecemedLeft {

    float: left;

    width: 67%;

    padding: 20px;

}



.ecemedRight {

    float: right;

    width: 25%;

    padding: 20px;

}



#wir a, #wir a:link, #wir a:visited {

    color: #fff;

    text-decoration: none;

}



#wir a:hover {

    text-decoration: underline;

}



.sliderElement {

    min-height: 180px;

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}



.sliderLogo {

    float: left;

    width: 20%;

    padding-left: 60px;

    padding-top: 20px;

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}



.sliderLogo img {

    max-width: 100%;

}



.sliderText {

    float: left;

    width: 65%;

    padding: 0px 40px 0px 40px;

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}



.sliderTextElementLink {

    display: inline-block;

    text-align: right;

    padding-top: 10px;

    width: 100%;

}



.sliderTextElementLink a, .sliderTextElementLink a:link, .sliderTextElementLink a:visited {

    font-weight: 400;

    text-decoration: none;

    color: #282828;

    text-transform: uppercase;

}



.sliderTextElementLink a:hover {

    text-decoration: underline;

}



.contactLeft {

    float: left;

    width: 55%;

}



.contactRight {

    float: right;

    width: 40%;

    line-height: 40px;

}



.contactRight a, .contactRight a:link, .contactRight a:visited {

    color: #282828;

    text-decoration: none;

}



.contactRight a:hover {

    text-decoration: underline;

}



.contactIcon {

    display: inline-block;

    width: 25px;

}

#kontakt input[type="checkbox"] {

    width: auto;

}



#kontakt label#contactFormDSGVO {

    display: inline;

}



.highlightInput {

    border: 1px solid green;

}



#kontakt label {

    display: inline-block;

    width: 150px;

    vertical-align: top;

    margin-top: 20px;

}



#kontakt input, #kontakt textarea {

    width: 65%;

    font-size: 14px;

    font-weight: 300;

}



#kontakt textarea {

    height: 250px;

}



#kontakt input[type="submit"], #kontakt input[type="button"] {

    width: 150px;

    float: right;

    padding: 10px;

}



.smallText {

    font-size: 15px;

}



#footer {

    font-size: 11px;

    font-weight: 300;

    color: #767777;

    text-transform: uppercase;

    height: 40px;

    line-height: 40px;

}



#footer a, #footer a:link, #footer a:visited {

    color: #767777;

    text-decoration: none;

}



#footer a:hover {

    text-decoration: underline;

}



.footerLeft {

    float: left;

}



.footerRight {

    float: right;

}



#maps {

    position: relative;

    padding-bottom: 56%;

    height: 500px;

    overflow: hidden;

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}



#maps iframe {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

}



.info, .success, .warning, .error, .validation, .errorMessage {

    border: 1px solid;

    margin: 10px 40px 10px -10px;

    padding:15px 10px 15px 10px;

    width: 100%;

    display: inline-block;

    border-radius: 3px;

}

.info {

    color: #00529B;

    background-color: #BDE5F8;

}

.success {

    color: #4F8A10;

    background-color: #DFF2BF;

}

.warning {

    color: #9F6000;

    background-color: #FEEFB3;

}

.error, .errorMessage {

    color: #D8000C;

    background-color: #FFBABA;

}



/* fade in div's */

/** animated boxes **/

.animBlock {

  display: inline-block;

  opacity: 0;

  filter: alpha(opacity=0);

  position: relative;

  -webkit-transition: all .55s ease-in;

  -moz-transition: all .55s ease-in;

  -ms-transition: all .55s ease-in;

  -o-transition: all .55s ease-in;

  transition: all .55s ease-in;

  width: 100%;

}

.animBlock[data-position="left"] { left: -20%; }

.animBlock[data-position="right"] { right: -20%; }

 

.animBlock[data-position="left"].viewed {

  left: 0%;

  opacity: 1;

  filter: alpha(opacity=100);

}

.animBlock[data-position="right"].viewed {

  right: 0%;

  opacity: 1;

  filter: alpha(opacity=100);

}

/* end fade in div's */



@media all and (max-width: 960px) {



    .innerWrapper {

        padding: 40px 20px 40px 20px;

        width: 100%;

        -webkit-box-sizing: border-box;

        -moz-box-sizing: border-box;

        box-sizing: border-box;

    }



    .innerWrapperNoPadding {

        padding: 0px 20px 0px 20px;

        width: 100%;

        -webkit-box-sizing: border-box;

        -moz-box-sizing: border-box;

        box-sizing: border-box;

    }



    .header { 

        height:100px;

        line-height: 100px;

    }



    .sliderElement {

        height: auto;

    }



    .ecemedLeft {

        width: 50%;

        padding: 20px;

        -webkit-box-sizing: border-box;

        -moz-box-sizing: border-box;

        box-sizing: border-box;

    }



    .ecemedRight {

        width: 30%;

        padding: 20px;

        -webkit-box-sizing: border-box;

        -moz-box-sizing: border-box;

        box-sizing: border-box;

    }



    .contactLeft {

        width: 40%;

        -webkit-box-sizing: border-box;

        -moz-box-sizing: border-box;

        box-sizing: border-box;

    }



    .contactRight {

        width: 50%;

        -webkit-box-sizing: border-box;

        -moz-box-sizing: border-box;

        box-sizing: border-box;

    }



    #kontakt label {

        width: 100%;

        -webkit-box-sizing: border-box;

        -moz-box-sizing: border-box;

        box-sizing: border-box;

    }



    #kontakt input, #kontakt textarea {

        width: 100%;

        -webkit-box-sizing: border-box;

        -moz-box-sizing: border-box;

        box-sizing: border-box;

    }



    .startFirstBlock {

        font-size: 40px;

    }



    .startSecondBlock {

        font-size: 24px;

    }

}



@media all and (max-width: 870px) {

    .ecemedLeft {

        width: 100%;

    }



    .ecemedRight {

        width: 100%;

    }



    .contactLeft {

        width: 100%;

    }



    .contactRight {

        width: 100%;

    }



    .contactRightInfo {

        width: 40%;

        float: left;

    }



    #maps {

        float: left;

        width: 60%;

        height: 300px;

    }



    .sliderLogo {

        float: none;

        width: 100%;

        text-align: center;

        display: inline-block;

        margin: 0 auto;

        padding-left: 0px;

        padding-top: 0px;

    }



    .notViewed {

        opacity: 1;

    }



    .animBlock[data-position="left"] {

        left: 0%;

    }



    .animBlock[data-position="right"] {

        right: 0%;

    }



    .sliderText {

        float: none;

        width: 100%;

        -webkit-box-sizing: border-box;

        -moz-box-sizing: border-box;

        box-sizing: border-box;

    }



    #kontakt label {

        margin-top: 0px;

    }



    .wrapperFB {

        font-size: 14px;

    }

}



@media all and (max-width: 800px) {



    .logo {

        display: none;

        float: none;

    }



    .navigation {

        float: none;

        width: 100%;

    }



    .header {

        height: auto;

        line-height: normal;

        padding: 0px 0px 0px 0px;

        margin-bottom: -25px;

    }



    .outherHeader {

        display: none;

    }



    #mainNav, #navFixed {  

        border-bottom: 0;

        height: auto; 

        margin-top: 0px;

        width: 100%;

    }



    #mainNav ul, #navFixed ul {

        width: 100%;  

        display: none;  

        height: auto;

        margin-top: 0px;

        text-align: center;

        background-color: #d4d4d4;

        margin-bottom: -10px;

    }



    #mainNav ul li, #navFixed ul li {

        padding: 0px;

        font-size: 15px;

    }



    #mainNav a:link, #mainNav a:visited, #navFixed a:link, #navFixed a:visited {

        color: #fff;

    }



    #mainNav li:hover, #mainNav li:active, #navFixed li:hover, #navFixed li:active {

        cursor: pointer;

    }

    /*

    

    nav div#pull, nav div#pullFixed {  

        display: inline;  

        background-color: #000; 

        width: 100%;  

        height: 50px;

        line-height: 50px;

        font-size: 15px;

        position: relative;

        cursor: pointer;

        color: #fff;

        -webkit-box-sizing: border-box;

        -moz-box-sizing: border-box;

        box-sizing: border-box;

    }  



    nav div#pull:after, nav div#pullFixed:after {  

        content:"";  

        background: url('../img/nav-icon.png') no-repeat right;  

        width: 30px;  

        height: 30px;  

        display: inline-block;  

        position: absolute;  

        right: 15px;  

        top: 10px;  

    } 



    #mainNav ul a li, #navFixed ul a li {

        display: block;  

        float: none;  

        width: 100%; 

        position: relative;

        margin-right: 0px;

        margin-bottom: 0px;

        margin-left: 0px;

        padding: 20px 0px 20px 0px;

        color: #282828;

    }

    */

}



@media all and (max-width: 740px) {

    .contactRightInfo {

        width: 100%;

        display: inline-block;

        float: none;

        margin: 0 auto;

    }



    #maps {

        float: none;

        width: 100%;

        text-align: center;

        margin: 0 auto;

    }

}



@media all and (max-width: 600px) {

    .startFirstBlock {

        font-size: 30px;

    }



    .startSecondBlock {

        font-size: 24px;

    }



    .gray, .ecemedBlueText, .ecemedBlueOther {

        font-size: 26px;

        display: inline-block;

        width: 100%;

    }



    .startFirstBlock {

        margin-top: 60px;

        margin-bottom: 60px;

    }



    .whiteBold {

        font-size: 16px;

    }

}











/* ==========================================================================

   Helper classes

   ========================================================================== */



/*

 * Hide visually and from screen readers:

 * http://juicystudio.com/article/screen-readers-display-none.php

 */



.hidden {

    display: none !important;

    visibility: hidden;

}



/*

 * Hide only visually, but have it available for screen readers:

 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility

 */



.visuallyhidden {

    border: 0;

    clip: rect(0 0 0 0);

    height: 1px;

    margin: -1px;

    overflow: hidden;

    padding: 0;

    position: absolute;

    width: 1px;

}



/*

 * Extends the .visuallyhidden class to allow the element

 * to be focusable when navigated to via the keyboard:

 * https://www.drupal.org/node/897638

 */



.visuallyhidden.focusable:active,

.visuallyhidden.focusable:focus {

    clip: auto;

    height: auto;

    margin: 0;

    overflow: visible;

    position: static;

    width: auto;

}



/*

 * Hide visually and from screen readers, but maintain layout

 */



.invisible {

    visibility: hidden;

}



/*

 * Clearfix: contain floats

 *

 * For modern browsers

 * 1. The space content is one way to avoid an Opera bug when the

 *    `contenteditable` attribute is included anywhere else in the document.

 *    Otherwise it causes space to appear at the top and bottom of elements

 *    that receive the `clearfix` class.

 * 2. The use of `table` rather than `block` is only necessary if using

 *    `:before` to contain the top-margins of child elements.

 */



.clearfix:before,

.clearfix:after {

    content: " "; /* 1 */

    display: table; /* 2 */

}



.clearfix:after {

    clear: both;

}



/* ==========================================================================

   EXAMPLE Media Queries for Responsive Design.

   These examples override the primary ('mobile first') styles.

   Modify as content requires.

   ========================================================================== */



@media only screen and (min-width: 35em) {

    /* Style adjustments for viewports that meet the condition */

}



@media print,

       (-o-min-device-pixel-ratio: 5/4),

       (-webkit-min-device-pixel-ratio: 1.25),

       (min-resolution: 120dpi) {

    /* Style adjustments for high resolution devices */

}



/* ==========================================================================

   Print styles.

   Inlined to avoid the additional HTTP request:

   http://www.phpied.com/delay-loading-your-print-css/

   ========================================================================== */



@media print {

    *,

    *:before,

    *:after {

        background: transparent !important;

        color: #000 !important; /* Black prints faster:

                                   http://www.sanbeiji.com/archives/953 */

        box-shadow: none !important;

        text-shadow: none !important;

    }



    a,

    a:visited {

        text-decoration: underline;

    }



    a[href]:after {

        content: " (" attr(href) ")";

    }



    abbr[title]:after {

        content: " (" attr(title) ")";

    }



    /*

     * Don't show links that are fragment identifiers,

     * or use the `javascript:` pseudo protocol

     */



    a[href^="#"]:after,

    a[href^="javascript:"]:after {

        content: "";

    }



    pre,

    blockquote {

        border: 1px solid #999;

        page-break-inside: avoid;

    }



    /*

     * Printing Tables:

     * http://css-discuss.incutio.com/wiki/Printing_Tables

     */



    thead {

        display: table-header-group;

    }



    tr,

    img {

        page-break-inside: avoid;

    }



    img {

        max-width: 100% !important;

    }



    p,

    h2,

    h3 {

        orphans: 3;

        widows: 3;

    }



    h2,

    h3 {

        page-break-after: avoid;

    }

}