body {
    background-color: #F5F5DC;
}

@font-face{
	font-family:'gyst_variable_medium';
	src:url(../fonts/gyst_variable_light.otf);
	font-variation-settings: 'wght' 550;
	font-weight: bold;
}

@font-face{
	font-family:'open_sans_regular';
	src: url('../fonts/open_sans_regular.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
         url('../fonts/open_sans_regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}

@font-face {
    font-family: 'MyWebFont';
    src: url('myfont.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
         url('myfont.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}  

.dp_black {
    /*
    PANTONE Black C
    C66 M67 Y72 K86
    R31 G24 B15
    HEX #1f180f
    */
    color: #1f180f;
}

.dp_black_bg {
    background-color: #1f180f;
}

.dp_dark {
    /*
    PANTONE 132C
    C28 M45 Y100 K21
    R164 G123 B19
    HEX #fa47b13
    */
    color: #a47b13;
}

.dp_dark_bg {
    background-color: #a47b13;
}

.dp_light {
    /*
    PANTONE 9225C
    C7 M6 Y14 K0
    R240 G236 B224
    HEX #f0ece0
    */
    color: #f0ece0;
}

.dp_light_bg {
    background-color: #f0ece0;
}

.title {
	font-family: "gyst_variable_medium";
	color: #a47b13
}

.text {
	font-family: open_sans_regular;
	color: #1f180f;
}

.uppercase {
    text-transform: uppercase;
}

.dp-button {
    background-color: #a47b13 ;
    color:aliceblue !important;
    border-radius: 2em !important;
    border-width: 0 !important;
    padding: 10px 25px 10px 25px !important;
}

.dp-center-part {
    margin-left: 50px !important;
    margin-right: 50px !important;
}

.body-part {
    max-width: 1200px;
}

/*
a {
    text-decoration: none !important;
    color: #000 !important;
}*/

.socials{
    font-size: 18px;
    letter-spacing: 5px;
}

/*  specific */

/* menu */
.menu {
    z-index: 999;
    position: relative;
    min-height: 35px;
}

.menu a {
    float: left;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

.menu-centered {
    margin-left: auto !important;
    margin-right: auto !important;
    width: 50% !important;
}

.menu-right {
    position: absolute;
    float: right;
    right: 0;
}

.menu a {
    text-decoration: none !important;
    color: #000 !important;
}

.menu a:hover {
    background-color: #f0ece0;
    min-height: 50px !important;
}

@media screen and (max-width: 600px) {
    .topnav a, .topnav-right {
      float: none;
      display: block;
    }
  
    .topnav-centered a {
      position: relative;
      top: 0;
      left: 0;
      transform: none;
    }
  }

/* heaer */
.header {
    position: relative;
    margin-top: 50px;
    margin-bottom: 100px;
}

.header a {
    text-decoration: none !important;
    color: #000 !important;
}

@media screen and (max-width: 1000px) {
    .header-logo {
        max-width: 200px !important;
    }
   
    
}

.header-image {
    border-radius: 0 13em 13em 0 ;
    -moz-box-shadow-bottom: 40px 40px 20px black;
    -webkit-box-shadow-bottom: 40px 40px 20px black;
    box-shadow-bottom: 40px 40px 20px black;
    position: absolute;
    top: 48%;
    left: 0;
}

.header .title {
    font-size: 56px !important;
    line-height: 1;
    letter-spacing: 5px;
    padding-bottom: 20px;
}

.header .text {
    font-size: 20px;
    letter-spacing: 4px;
    padding-bottom: 20px;
}

.header .text-part {
    padding-bottom: 20px;
}

@media screen and (max-width: 1000px) {
    .header-image {
        max-width: 300px !important;
    }
     
    .header .title {
        font-size: 24px !important;
    }
    
    .header .text {
        font-size: 10px;
    }
}

@media screen and (max-width: 700px) {
    .header-image {
        max-width: 200px !important;
        position: unset;
    }
     
    .header .title {
        font-size: 24px !important;
    }
    
    .header .text {
        font-size: 10px;
    }
}

.padding-2 {
    margin-right: 2em !important;
}

/* our services */
.services {
    padding-bottom: 85px;
}

.service-title {
    font-size: 20px;
    margin-bottom: 10px;
}

.services .title {
    padding-left: 5%;
    font-size: 28px;
}

.services .parts {
    color: #1f180f;
}

.services .parts .text{
    padding-top: 20px;
    font-size: 14px;
    letter-spacing: 2px;
}

.services .parts .number {
    font-family: "gyst_variable_medium";
	width: 35px;
    height: 40px;
    font-size: 60px;
    font-weight: bolder;
    color: #1f180f;
}


/* sticker */
.sticker-body {
    position: relative;
}
.sticker {
    position: absolute;
    top: -30px;
    right: 0;
    max-width: 75% !important;
    z-index: 999;
    background-color: black;
    color: #FFF;
    font-family: open_sans_regular;
    font-size: 120%;
    margin-left: 25% !important;
    padding-top: 1em;
    padding-left: 25px;
    padding-bottom: 1em;
    border-radius: 10em 0em 0em 10em;
    overflow-x: visible;
    overflow-y: hidden;
}

.sticker .bold{
    font-weight: bold;
}

@media screen and (max-width: 700px) {
    .sticker-body {
        position: unset;
    }

    .sticker {
        position: unset;
    }

    .sticker-body p {
        margin-left: auto !important; 
        margin-right: 0 !important;
    }

}

/* about us */
.about-us {
    position: relative;  
    padding-top: 40px;  
    padding-bottom: 50px;
    margin-bottom: 100px;
}

.about-us .title-part {
    font-size: 16px;
}

.about-us .title {
    padding: 10px;
    font-size: 28px;
}

.about-us .text {
    font-size: 14px;
    letter-spacing: 2px;
}

.about-us li {
    list-style-type: none;
}

.about-us .about-us-image {
    border-radius: 13em 0 0 13em ;
    -moz-box-shadow-bottom: 40px 40px 20px black !important;
    -webkit-box-shadow-bottom: 40px 40px 20px black !important;
    box-shadow-bottom: 40px 40px 20px black !important;
    position: absolute;
    top: 48%;
    right: 0;
    height: 80%;
}

@media screen and (max-width: 1200px) {
    .about-us .about-us-image {
        max-width: 250px !important;
        -moz-box-shadow-bottom: 30px 30px 15px black !important;
        -webkit-box-shadow-bottom: 30px 30px 15px black !important;
        box-shadow-bottom: 30px 30px 15px black !important;
        position: inherit;
        top: 0;
        right: 0;
        height: 100%;
    }
     
    .about-us .title {
        font-size: 24px !important;
    }
    
    .about-us .text {
        font-size: 10px;
    }
}

@media screen and (max-width: 700px) {
    .about-us .autograph {
        max-width: 200px;
    }
    .about-us .about-us-image {
        max-width: 200px !important;
        position: inherit;
    }
     
    .about-us .title {
        font-size: 24px !important;
    }
    
    .about-us .text {
        font-size: 10px;
    }
}



/* contact */

.contact {
    padding-top: 30px;
    padding-bottom: 75px;
}

.contact .title {
    font-size: 28px;
}

.contact .row {
    margin-top: 20px;
}

.contact .text {
    font-size: 14px;
}

.contact .email-address {
	text-decoration: underline !important;
	color: #000 !important;
}

.contact .phonenumber {
    text-decoration: none !important;
    color: #000 !important;
}

.contact .text-help {
    color: gray;
}

input[type=text], textarea {
    border: none;
    border-bottom: 2px solid gray;
    color: #1f180f;
    min-width: 100%;
}

input[type=text]:focus, textarea:focus {
    outline: none;
    border: none;
    border-bottom: 2px solid #1f180f;
    color: #1f180f;
}

input[type=submit] {
    border: 2px 2px 2px 6px solid gray;
    background-color: #f0ece0;
    color: gray;
    border-radius: 5px;
    padding: 5px 10px 5px 10px;
}

input[type=submit]:hover {
    background-color: #dedacf;
}

input[type=submit]:active {
    background-color: #dedacf;
    color: rgb(96, 94, 94);
    transform: translateY(4px);
}

.contact a {
    text-decoration: none !important;
    color: #000 !important;
}


