
@font-face {
    font-family: "Allura";
    src: url('fonts/Allura-Regular.ttf') format('embedded-opentype'), /* Internet Explorer */
            url('fonts/Allura-Regular.ttf')  format('woff2'),             /* Super Modern Browsers */
            url('fonts/Allura-Regular.ttf')  format('woff'),              /* Pretty Modern Browsers */
            url('fonts/Allura-Regular.ttf')  format('truetype'),          /* Safari, Android, iOS */
            url('fonts/Allura-Regular.ttf')  format('svg');  
    }
    @font-face {
        font-family: "Century";
        src: url('fonts/Century\ Normal.ttf') format('embedded-opentype'), /* Internet Explorer */
                url('fonts/Century\ Normal.ttf')  format('woff2'),             /* Super Modern Browsers */
                url('fonts/Century\ Normal.ttf')  format('woff'),              /* Pretty Modern Browsers */
                url('fonts/Century\ Normal.ttf')  format('truetype'),          /* Safari, Android, iOS */
                url('fonts/Century\ Normal.ttf')  format('svg');  
        }

        
    
    

    #skicka {
        width: 75px;
        cursor: pointer;
        font-weight: bold;
        border-radius: 5px;
        /* border: 3px solid silver; */
        
    }
    #skicka:hover{
        background-color: rgb(91, 91, 91);
        
    }
      #captcha{
        z-index: 1;
        margin-bottom: 30PX;
    }
#flower-container1{
    /* margin: auto; */
    position: relative;
    /* right: 0; */
    /* border: 1px solid red; */
}
#flower-container2{
    /* margin: auto; */
    /* right: 0; */
    position: relative;
}
   #flower1{
    /* background-color: transparent; */
    
    /* position: absolute; */
    /* right: 0; */
    left: 0;
    position: absolute;
    transform: scalex(-1);
    z-index: 3;
    filter: grayscale(20%);

   }
   #flower2{
    pointer-events: none;
    /* display: none; */
    right: 0;
    position: absolute;
    z-index: 3;
    filter: grayscale(20%);
    /* border: 1px solid red; */
   }

   #wedimg-container2{
    position: absolute;
    /* border: 2px solid red; */
    text-align: center;
    width: 100%;
    height: 50px;
    background-image: 
    url("images/wedding-pattern2.png"),
    url("images/wedding-pattern2.png"),
    url("images/wedding-pattern2.png");
background-size: 200px, 200px, 200px; /* Resize both images */
background-repeat: repeat-x, repeat-x, repeat-x;
background-position: 0 0, 66px 0, 132px 0; /* Shift second image to overlap */
transform: translate(0,-35px);
/* margin-top: -30px;
margin-bottom: -15px; */
/* left: 0; */

    
   }
 

#vine-container1{
left: -125;
/* transform: rotate(180deg); */
background-image: url("images/vine_realistic_downscaled.png");
}

#vine-container2{
right: -125;
background-image: url("images/vine_realistic_downscaled2.png");

}
#column-container1{
    right: -50;
    transform: rotate(180deg);
}
#column-container2{
    left: -50;

}
/* #column-container3{
    left: -75;
    transform: rotate(90deg);
    top: -50%;
    margin-top: 32;
} */

.vine-container{
z-index: -2;
width: 200;
}
.column-container{
z-index: -1;    
width: 75;
background-image: url("images/column.png");

}

/* 
#x-column-container1    {
    position: absolute;
    background-image: url("images/roman_arch1.jpg");
    background-size: 25px;
    background-repeat: repeat-x;
    height: 50px;
    width: 115%;
    z-index: 10;
    top: 0;
    transform: translateX(-6.5%);
} */




.wedimg-container{
height: 100%;
position: absolute;
background-repeat: repeat-y;
top: 0;
filter:grayscale(80%);
background-size: 100%;
}

    #title-div{  
        
        contain: content;
        background-color: white;
        /* padding-top: 50px; */
        /* display: flex;   */
        /* border: 10px solid red;          */
        align-content: center;
        align-items: center;
        /* width: 90%; */
        margin: auto;   
        margin-bottom: 30;
        margin-top: 30;
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 0;
        padding-top: 50;
        /* margin-top: 10px; 
         */
        /* margin-left: 2%; */
        /* margin-right: 2%; */

        /* background-color: azure; */
        /* background-image: url("images/frame1.png");
        background-size: 100%;  */
        
    }   
    #title-image-container{ 
        
        /* background-image: url("images/frame1.png");
        background-size: 100%; */
        
        /* border: 2px solid; */
        display: flex;
        contain: content;
        
        max-height: 300px;
        /* height: 300px; */
        
        width: fit-content;
        margin: auto;
        gap: 10px;
        padding-right: 30px;
        padding-left: 30px;
        padding: 10%;
        /* overflow: hidden; */
        /* align-items: center;
        align-content: center; */
        /* border-radius: 3%; */
        /* background-color: #000000   ; */

    }
 
    .title-image{
       
        
        /* box-shadow: 10px 0px 10px rgba(0, 0, 0, 0.5); */
        /* border: 1px solid rgba(0, 0, 0, 0.2);     */
        /* margin-bottom: -30000px; */
        top: 0;
        display: block;
        width: 33%;
        align-self: center;
        /* border-radius: 3%; */
        /* margin-top: 100px; */
        margin-bottom: -100px;
        
        
        
        
        /* z-index: -20; */
        /* margin: auto; */
        /* margin-top: 20px;
        margin-left: 0; */



        
    }
    /* #title-image2{
        margin-top: 0;
        height: 10px;

    } */
    
    #title {
        
    color: rgb(0, 0, 0);
    font-family: "Allura";
    font-size: 50pt;
    text-align: center;
    padding-left: 5%;
    padding-right: 5%;
    /* height: 20px; */
    margin: auto;
    padding-top: 20px;
    padding-bottom: 30px;
    /* padding-bottom: 30px; */
    /* margin-top: -10px; */
    /* margin-bottom: -20px; */
    /* font-weight:lighter; */
    
    /* padding-top: 20px; */
    
    }
  
  
    
    body {
        font-family: Georgia, 'Times New Roman', Times, serif;
    /* background-image: url("images/floral_pattern.jpg");
    background-size: 20%; */
    /* background-blend-mode:darken; */
    /* background-blend-mode: lighten; */
    background-color: rgb(245, 245, 245);
    /* background-color: rgba(219, 98, 159, 0.647); */
    /* background-blend-mode:color-dodge; */
    /* background-color: rgba(6, 42, 30 */
    /* background-attachment:fixed; */
    /* background-repeat: repeat-x; */
           
    /* padding-top: 50px; */
    padding: 0;
    margin: 0;   
    color: white;
   
    }
    
    h1{
    font-weight: 500;
    text-align: center;
    
    /* font-size: 34pt; */
    
    }
    h2{
        margin-top: 0;
        font-size: 30pt;
        font-family: "Allura";  
    font-weight: 500;
    /* text-align: center; */
    }
    h3{
        font-weight: 500;
    text-align: center;
    /* font-family: 'Century'; */
    
    
    }
    
    p {
        /* font-family: 'century', serif; */
        /* font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; */
        
    /* text-align: left; */
    /* letter-spacing: .2px; */
    margin-top: 0%;
    word-wrap: break-word;
    margin-block-start: 0;
    font-size: 11pt;
    line-height: 18pt;
    /* font-weight:lighter; */
    
    }
    a {
        /* font-family: 'Century'; */
    color: white;
    }
    table{
    margin: 0 auto;
    }
   

    .required-asterix{
        color: red;
        font-size: 120%;
    }
    

    
    
    #content{
    /* contain: content;    */
    position: relative;
    /* display:grid; */
    /* border-right: 1px solid rgb(117, 57, 99);  
    border-left: 1px solid rgb(117, 57, 99);   */
    /* border-style:inset; */
    /* background-color: rgb(241, 234, 220, 1); */
    /* background-color: whitesmoke; */
    /* background-color: rgba(174, 166, 160, 0.); */
    /* opacity: 80%; */
    /* border-left: 5px solid rgb(245, 245, 245);
    border-right: 5px solid rgb(245, 245, 245); */
    background-color: rgb(245, 245, 245);
    max-width: 70%;
    margin: 0 auto;
    padding-top: 1px;
    height: fit-content;
    color: rgb(0, 0, 0);
    /* box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.5); */

    /* background-image: url("images/floral_pattern4.jpg");
    background-size: 100%;
    background-blend-mode:hard-light; */
    /* border-inline: 3px double silver; */
    /* border-radius: 10px; */
    }
   
    
    
    .flexbox {
         box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.5);
        background-color: white;
        /* border-bottom: 1px solid rgba(192, 192, 192, 0.5); */
        /* border-style: */
    /* position: relative; */
    display: grid;
    grid-template-columns: 1fr 1fr;
    /* grid-template-columns: repeat(auto-fill, minmax(2, 1fr)); */
    grid-template-rows: auto;
    border-radius: 5px;
    /* border: 1px solid black; */
    /* grid-template-columns: max-content; */
    /* grid-area: auto; */
    /* align-items:start; */
    /* width: 100%; */
    gap: 50px;
    /* display: grid; */
    /* grid-template-rows: auto; */
    /* margin: 200px; */
    /* padding: 20px; */
    /* right: 0; */
    padding: 30px;
    padding-top: 50px;
    contain: content;
    margin: auto;
    margin-bottom: 30px;

    /* margin-left: 10;
    margin-right: 10; */

    /* align-content: center; */
    /* height: fit-content; */
    /* border-radius: 50px; */
    /* text-align: left; */
    }
 
    .flexbox div{
        width: 100%;
        /* border: 1px solid red; */
    }
    
    .container{
        width: 100%;
        /* float: left; */
        /* grid-column-start: 1;
        grid-column-end: 3; */
        /* border: 1px solid rgb(117, 57, 99);      */
    }
    .image-div{
        margin-left: auto;
        margin-right: auto;
        contain: content;
        width: 100%;
        /* width: fit-content; */
        /* border-radius: 100%; */
        
        
        
    }
    #countdown-container{
        font-family:'Times New Roman', Times, serif;    
        /* border-bottom: 1px solid silver; */
        background-color: rgb(255, 255, 255);
        /* color: white; */
        display: block;
        contain: content;
        /* font-size: 20px; */
        text-align: center;
        font-style: italic;
        font-size: 15px;
        /* background-color: aliceblue; */
        
        
    }

   
    #countdown{
        display: flex;
        /* border: 1px solid red; */
        /* height: max-content; */
        margin: auto;
        /* width: fit-content; */
        /* gap: 5%; */
        padding-left: 5%;
        padding-right: 5%;
        padding-top: 10px;
        padding-bottom: 10px;
        /* background-color: #ffcece; */
        /* border: 1px solid rgba(0, 0, 0, 0.236); */
        
        
        
    }
    .countdown-n{
        margin: auto;
        text-align: center;
        /* width: 75px; */
        /* border:1px solid rgba(0, 0, 0, 0.223);   */
        /* border-radius: 20%; */
        padding: 5px;
  
       
    }
    .countdown-n h2{
        /* border: 1px solid black; */
        /* color: rgb(255, 197, 197); */
        /* background-color: #000000; */
        border-radius: 20%;
        text-align: center;
        width: 50px;
        /* padding: 0; */
        margin: auto;
        font-weight: 500    ;
        /* text-decoration: underline; */
        /* text-decoration: none; */
        font-size: 30px;
        /* margin-bottom: 10px; */
        font-weight: bold;
        /* font-style: italic; */
        /* font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; */
        font-style: normal;
        font-family: unset;
        
        
    }

    #menu-toggler {
        display: none; /* Hidden by default */
        position: fixed;
        height: 50px;
        top: 0;
        right: 0;
        z-index: 2  ;
        background-color:rgb(255, 255, 255);
        cursor: pointer;
        width: 100%;
        margin: 0;
        /* contain: content;         */
    }
    /* #menu-toggler div{
        height: 100%;
        align-content: center;
        width: 100%;
        float: left;
    }
    #menu-toggler div h1{
        text-align: right;
        padding-right: 66px;
        margin-top: 5;
    } */

    /* #topnav-container{
        overflow: hidden;
        contain: content;
        z-index: 5;
    } */
    #topnav {
    /* background-color: rgb(255, 242, 229); */
    /* display: flex;; */
    position: sticky;
    top: -0.01  ;
    height: 50px;
    width: 100%;
    /* margin-top: 20px; */
    /* margin-bottom: 20px; */
    text-align: center;
    /* margin-bottom: 50px; */
    align-content: center;
    /* padding: 10px; */
    /* padding-top: 10px; */
    /* padding-bottom: 1px; */
    /* box-shadow: #000000; */
    box-shadow: 0px 3px 9px rgba(0, 0, 0, 0.5);
    /* border: 1px solid black; */
    /* z-index: 10;
    position: relative; */
    z-index: 1;
    /* border: 1px solid silver; */
    
    /* border: 1px solid rgba(245, 202, 153, 0.5); */
    /* border: 3px double silver; */
    /* border-right: 10px; */
    /* border-left: 100px solid silver; */
    /* background-image: url("images/floral_pattern3.jpg"); */
    /* background-size: 40%; */
    /* background-blend-mode:lighten; */
    /* background-color: rgba(245, 245, 245, 0.5); */

    background-color: rgba(255, 255, 255, 0.626);
    background-image: url("images/floral_pattern3.jpg");
    background-size: 40%;
    background-blend-mode:lighten;
    
    

     /* background-color: white; */




    /* background-image: url("images/floral_pattern3.jpg");
    background-size: 50%;
    background-blend-mode: overlay;
    background-color: rgba(205, 202, 192, 1); */
    /* z-index: 2; */
    }
    #content-btn{
        /* border: 1px solid; */
        width: 100%;
        margin: auto;

    }
    #scroll-top-btn{
        width: 0%;
        margin-left: 3px;
        
    }
    #scroll-top-icon{
        /* filter:invert(50%); */
        margin: auto;
    }
    #button-container{
        display: flex;
    }

    /* .fixed{
        position: fixed;
        top: 0;
        left: 50%;
        top: 0%;
        transform: translateX(-50%);
        width: 50%;
    } */
    
    
    
    
    
    
    
    
    #topnav p {
    text-align: center;
    display: none;
    }
    #topnav h3{
    text-align: center;
    margin-bottom: -35px;
    }
    #logo {
    text-align: center;
    }
    
    #logo img {
    width: 400px;
    object-fit: cover;
    height: 100px;
    margin: 20px auto 0 auto;
    }
    /* #intro { */
        /* background-color: rgba(245, 245, 245, 0.5); */
        /* padding-left: 50px; */
        /* padding-right: 50px; */

    /* } */

    .row {
    display: flex;
    justify-content: space-between;
    flex-direction: row; 
    }
    .column {
    width: 48%;
    }
    
    .socials {
    text-align: center;
    padding: 3PX;
    /* padding: 100px; */
    }
    .socials a {
    /* margin: 100px 0; */
    /* padding: 100px 0px; */
    padding: 0 5%;
    /* padding: 5; */
    /* padding-top: 100px; */
    
    
    /* color: rgb(28, 117, 188); */
    
    }
    /* #menu-toggler{
    position: absolute;
    width: 50px;
    height: 50px;
    top: 20px;
    left: 20px;
    filter: invert(100%);
    cursor: pointer;
    }    */
    
    .socials a {
    font-family: social-media-icons;
    font-size: 300%;
    }
    
    
    
    
    
    /* Mindre kaos ovanför :)  */ 
    
    #omosstext{
    padding-left: 5%;
    padding-right: 5%;
    /* padding-top: 20%; */
    
    
    
    }
    .textlink{
    color: rgb(0, 0, 0);
    }
    
    
    
    
    
    
    
 
    
    
    
    
    * {
    box-sizing: border-box;
    }
    
    
    
    /* #topnav{
    background-color: rgb(255, 255, 255);
    z-index: 1;
    text-align:center;
    
    } */
    
    
    #page{
    color: rgb(255, 255, 255);
    }
    .btn{
         /* color: red; */
    font-size: 140%;
    /* padding-right: 20px; */
    /* margin-rig-ht: 2%; */
    font-weight: bold;
    position: relative;
    text-decoration: none;
    /* font-family: 'Century'; */
   
    margin: 2%;
    
    /* color:rgb(135, 55, 55); */
    color: #000000;
   
    
    }

    .btn:hover{
    /* color: rgb(194, 22, 22); */
    text-decoration: underline;
    /* text-decoration: underline; */
    /* background-image: url(images/ring_icon.png); */
    /* background-size: 20px;
    background-repeat: no-repeat; */
    /* position: absolute; */
    /* float: left; */
    /* border: 5px solid black; */
    /* display:  */
    
    /* font-size: 200%; */
    /* margin-bottom: -100px; */
    
    /* padding-left: -1%; */
    
    /* padding-bottom: 100%; */
    /* zoom: 110%; */
    /* padding-bottom: 500px */
    
    
    
    }
    #scroll-top-div{
        left: 0;
    }
    #home-icon-div{
        padding: 5px;
        /* left: 0; */
        width: 50px;
        /* width: 100px; */
        /* margin: auto; */
        /* border: 1px solid; */
    }

    
  
    
    
    
    
    ul{
    /*border: 5px solid black;*/
    /* text-align: left; */
    padding-left: 10%;
    /* margin-right: 60%; */
    /* padding-right: 20%; */
    /* padding-top: 100%; */
    /* word-wrap: break-word; */
    /* color: white; */
    }
    
    li{
    /*border: 5px solid black;*/
    margin-right: 55%;
    padding-bottom: 8em;
    /* padding-top: 15%; */
    text-align: left;
    padding-right: 20%;
    word-wrap: break-word;
    height: 200px;
    }
    
    #themanhimself{
    padding-bottom: 5%;
    width: 100%;
    
    }
    
    .menu_img{
    /* padding-right: 20%; */
    /* margin-top: -55%; */
    /* margin-left: -55% */
    margin-right: 5%;
    /* margin-bottom: 30%; */
    width: 50%;
    height: 50%;
    }
    #pdf{
    font-family: unset;
    /* padding-top: 100%; */
    /* margin-top: -4%; */
    
    }
    #meny{
    /* position: absolute; */
    width: 90%;
    margin-left: 5%;
    /* margin-right: ; */
    /* border: 5px solid black; */
    /* height: 2200px; */
    
    }
    
    
    
    
    a{
    color: rgb(44, 12, 205);
    text-decoration: underline;
    }
    
    
    
    
    
    
    td{
    vertical-align: baseline;
    border: 1px solid rgb(9, 8, 5);
    padding: 5px;
    }
    
    
    
    span{
    padding-left: 5%;
    }
    
    
    
    
    
    .schema{
    text-align: left;
    }
    #trubadurer_div{
    
    /* border: 10px solid black; */
    /* padding-left: 30%; */
    /* height: 100%; */
    text-align: center;
    contain: content;
    }
    #trubadurer_div img{
    width: 60%;
    }
    
    
    
 
    #google_maps_container{
    
    border-radius: 15px 15px 5px 5px;
    border: 1px solid rgb(0, 0, 0);
    border: 1px solid silver;
    background-color: rgba(255, 255, 255, 0);
    margin: 0 auto;
    overflow: hidden;
    text-align: center;
    contain: content;
    color: rgb(0, 0, 0);
    /* box-shadow: 0px 3px 9px rgba(0, 0, 0, 0.5); */
  
    }
    #google_maps_container-container{
        overflow: hidden;
    }


    #maps-nav{
        background-color: rgb(103, 103, 103);
        border: none;
        border-bottom: 1px solid silver;
        /* border: 1px solid silver; */
        /* border-bottom: 0; */
        text-align: left;
        /* padding: 0; */
        /* margin: 0; */
        height: 30px;
        /* width: fit-content; */
        /* padding: 3px; */
        /* padding-bottom: 0; */
        /* border-top-left-radius: 15px;
        border-top-right-radius: 15px; */
        contain: content;
        align-content: center;
        /* padding-right: 1px; */
        /* padding-left: 1px; */
        
    }
    .maps-nav-btn{
        color: white;
        background-color:rgb(47, 47, 47); 
        border: none;
        height: 100%;
        width: 33.33%;
        margin-right: -3;
        /* margin-left: 2; */
        /* border-right:  1px solid rgb(255, 0, 0); */
        /* margin-right: -5; */
        /* padding: 5px; */
        /* padding-left: 20px; */
        /* padding-right: 20px; */
        /* align-self: center; */
        font-weight: bold;
        contain: content;

    }
    .maps-nav-btn:hover{
        background-color: rgb(67, 67, 67);
        cursor: pointer;
    }

    .maps-nav-btn-active{
        background-color: rgb(255, 255, 255);
        color: black;
        pointer-events: none;

    }
    .maps-nav-btn-active:hover{
        background-color: white;
    }
.pictures{
        /* display: inline-block; */
    /* box-decoration-break: slice; */
    /* overflow: hidden; */
    width: 250px;
    
    /* height:500px; */
    /* width:auto; */
    /* object-fit: scale-down; */
    /* border: 1px solid; */
        /*border: 1px solid silver;*/
        border-radius: 5px;
        /* box-shadow: 5px 15px -35px rgba(0, 0, 0, 0.5); */
        /* box-shadow: 0px 0 20px rgba(0, 0, 0, 0.5); */
        /* background-image: url("images/frame1.png");
        background-size: 100%;
        padding: 10%; */
         
}
#tidslinje{
    border: none;
    /* padding-left: 20%; */
    /* padding-right: 20%; */
}
#tidslinje-div{
    text-align: center;

    /* padding-left: 20%; */
    /* padding-right: 20%; */
}

    /* .flexbox:nth-child(2n){
        background-color: rgb(255, 255, 255);
    }
    .flexbox:nth-child(2n-1){
        background-color: whitesmoke;
    } */
  

 
  
   
    
    
    
    
    
    
    
    
    input[type=text], select, textarea {
    width: 100%; /* Full width */
    padding: 12px; /* Some padding */ 
    border: 1px solid #000000; /* Gray border */
    border-radius: 4px; /* Rounded borders */
    box-sizing: border-box; /* Make sure that padding and width stays in place */
    margin-top: 6px; /* Add a top margin */
    margin-bottom: 16px; /* Bottom margin */
    resize: vertical /* Allow the user to vertically resize the textarea (not horizontally) */
    
    }
    
    /* Style the submit button with a specific background color etc */
    input[type=submit] {
    background-color: #000000;
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    }
    
    /* When moving the mouse over the submit button, add a darker green color */
    input[type=submit]:hover {
    background-color: #45a049;
    }
    /* input#diet{
        height: 100px;
        text-align: left ;
        cont
    } */
    
    /* Add a background color and some padding around the form */
    .section-divider{
       /* height: 30px; */
       /* background-color: rgb(245, 245, 245); */
       /* border-bottom: 1px solid rgb(225, 225, 225);
       border-top:  1px solid rgb(225, 225, 225); */
    }
    
    .slide-delay{
        transition-duration: 0.5s;
        transition-delay: 200ms;

    }
    .slide-nodelay{
        transition-duration: 0.7s;
        transition-delay: 0ms;
    }
    
    #form-div{
        /* transition: max-height 900ms ease-in-out; */
        transition-property: max-height;
        transition-timing-function: ease-in-out;
        /* transition-duration: 900ms;
        transition-delay: 0; */
        
        background-color: rgb(255, 255, 255);
        border: 1px solid black;
        z-index: 2;
        position: relative;
        contain: content;
        /* max-height: 700; */
        max-height: 50;
        border-radius: 5px;
        /* transition: max-height 0.6s ease-in-out;
        transition-delay: 300ms; */
        box-shadow: 0px 3px 9px rgba(0, 0, 0, 0.5);

    }
  
    #form-nav{
        contain: content;
        position: relative;
        z-index: 2;
        height: 50px;
        align-content: center;
        margin: auto;
        /* border-radius: 5px; */
        text-decoration: underline;
        font-weight: bolder;
        text-align: center;
        border-bottom: 1px solid black;



        
        
    }
    #show-form-btn{
        background-color: rgb(255, 255, 255);
        border: none;
        width: 100%;;
        height: 100%;
        /* border-radius: 8px; */
        /* padding: 10%; */
        /* margin-bottom: 5px; */
        font-weight: bold;
        cursor: pointer;
        font-size: 100%;
        


    
        background-color: rgba(255, 255, 255, 0.513);
        background-image: url("images/floral_pattern3.jpg");
        background-size: 100%;


        background-color: rgba(23, 21, 21, 0.744);
        color: rgba(255, 255, 255);
        background-blend-mode:darken;

    }
    #show-form-btn:hover{
        
        background-color: rgba(23, 21, 21, 0.5);

        background-blend-mode:darken;

        /* background-color: bisque; */
        

        /* background-color: rgba(198, 98, 98, 0.739); */
        /* background-color: rgba(92, 88, 88, 0.809); */

        /* color: white; */
        /* font-size: 88%; */
        /* background-size: 120%; */

    }
    #form-container {
        transition-property: top;
        transition-timing-function: ease-in-out;
        /* transition-duration: 900ms; */
        /* transition-delay: 0; */
        
        
position: relative;   
/* max-height: 600; */
/* right: 0; */
/* bottom: 0;      */
        contain: content;
    font-weight: bold;
    color: rgb(0, 0, 0);
    background-color: rgba(255, 255, 255, 0);
    /* padding: 2%; */
    z-index: 0;
    top: -600;
    margin: auto;
    padding: 3%;
    /* height: 600px; */
    align-content: center;
    border-radius: 10px;
    padding-top: 30px   ;

  
    }



    

    #form-paragraph{
        position: relative;
        bottom: 0;
        /* background-color: #45a049; */
        transition: bottom 0.9s ease-in-out;
        transition-delay: 500ms;
    }

    #image-frame-container {
        /* border: 2px solid red; */
        height: 450px;
        width: 100%;
        top: 0;
        position: absolute;
        padding-left: 2%;
        padding-right: 2%;
        
        
        /* position: absolute; */
        z-index: 1;
        /* left: -50; */
       
    }
    #image-frame{
        /* border: 2px solid; */
        /* position: relative; */
        width: 100%;
        height: 100%;
        /* position: absolute; */
    } 
    #email{
        width:100%;
        height: 40px;
    }
    
    #submission-confirmation{
        /* display: none;top */
        display: block  ;
        transition: top 0.5s ease-in-out;
        transition-delay: 200ms;
        position: relative;
        /* right: -1000; */
        top: 0;
        align-content: center;
        /* left: -1000; */
        /* left: 0; */
        background-color: rgba(133, 42, 42, 0);
        height: fit-content;
        /* width: 100%; */
        margin: auto;
        padding: 20px;   
        /* height: 150px; */
        color: black;
        border: none;
        /* height: 50px; */
        background-color: #9edca1;


       
    }
    #submission-confirmation h3{
        font-weight: bold;
        margin: 0;
        padding: 0;
    }
    
    #button-captcha-container{
        height: 80px;
        /* margin-left: -20px; */
        /* contain: content; */
        /* border: 1px solid; */
    }


    #thankYouMessage h1{
        /* font-size: */
        color: black;
        text-align: left;
    }
    
    .signupbtn{
        background-color: black;
        color: white;
        border: none;
        width: 100px;
        height: 30px;
        border-radius: 15px;
    }
    
    .anchor{
        
            scroll-margin-top: 80px;
        
    }
 
    
    #burger{
        display: none;
        z-index: 3;
        /* position:absolute;    */
        left: 0;
        top: 0;
        /* margin-top: 0;
        margin-right: 5; */
        border-radius: 10%;
    }


    #mobile-menu {
        display: none;
         /* Hide menu initially */
        position: fixed; 
        /* top: -250; */
        top: 0;
        
        color: #000000;
        /* right: -250px;  */
        /* Hidden off-screen */
        width: 100%;
        
        height: fit-content;
        box-shadow: -2px 0 5px rgba(0, 0, 0, 0.5);
        padding: 10px;
        /* padding-left: 70% ; */
        /* padding-top: 20px; */
        z-index: 1;
        flex-direction: column;
        gap: 10px;
        
        /* border-left: 3px unset #000000; */
        /* border-bottom: 3px unset #000000; */
        /* border-style:unset; */
        transition: top 0.2s ease-in-out;
        
        /* border-bottom-left-radius: 15px; */
       
        
        border-bottom: 1px solid rgba(0, 0, 0, 0.5);
        /* border-top: none; */
        padding-top: 50px;

        /* background-image: url("images/floral_pattern.jpg");
        background-size: 100%;
        background-blend-mode:lighten; */
        /* background-color: rgba(245, 245, 245, 0.5); */
        background-color:rgba(245, 245, 245, 1);
        background-color: white;
        
    }
  
    
  
    #mobile-menu-title {
        /* width: fi; */
        position: fixed;
        /* float: right; */
        align-self: center; 
        right: 0;
        margin-right: 0;
        /* margin: auto; */
        /* display: flex;
        flex-direction: row ;
        width: fit-content;
        height: 40px; */
    }
    #mobile-menu-title h3{
        font-size: 25px;
        margin-top: 8px;
        /* margin-left: 3px; */
        right: 0;
        margin-right: 0;
    }
    #mobile-menu a{
        font-size: 18px;
        text-decoration: none;
    }
 
    #asdasd{
        /* width:500px; */
        /* width: 180px; */
        /* contain: content; */
        height: 50px;
        padding: 10px;
        margin-top: -10px;
        /* grid-template-columns: 1fr 1fr; */
        /* z-index: 5; */
        /* border: 1px solid black; */
        align-content: center;
        

    } 

    .flower-random{
        shape-outside: ellipse();
        max-width: fit-content;
        /* border: 1px solid red; */
        border-radius: 50%;
    }
    .flower-random-absolute{
        /* display: none; */
        max-width: fit-content;
        /* border: 1px solid red; */
        position: absolute;
        z-index: 1;
        contain: content;

    }
   
 
    
    
    #contact{
            background-color: rgb(47, 47, 47); 
            padding: 10px;
           
    }

    #contact h3{
        text-align: center;
        color: white;
        margin: auto;
        /* margin: auto; */
    }
    #contact h3 a{
        color: white;
    }
 
    #section1{
        display: none;
    }
    .paragraph{
        padding-left: 10%;
        padding-right: 10%;
    }
    
    .paragraph-title {
        margin-top: 0;
        display: block;
        /* margin-top: 0; */
        
    }
    
    .paragraph-image-title {
        margin-top: 0;
        display: none;
    }
    .paragraph2{
        align-self:flex-end;
    }

    .noimage .paragraph{
        padding-left: 5%;
        padding-right: 5%;
    }
    #flwr-osa{
        margin-top: 130;
    }
    
    
    /* Screen scale ------------------------------------------------------------------------*/

    @media (max-width: 1200px) {
        .anchor{
            scroll-margin-top: 50px;
        }
        .flexbox{
            border-radius: 0;
        }
        .wedimg-container{
            display: none;
        }
        #content{
            max-width: 100%;
            border: none;
        }
        footer{
            width: 100%;
            /* background-color: red; */
        }
       
    }


    
    @media (max-width: 900px) {
        #title-div{
            margin-top: 0;
        }
       
        #flwr-osa{
            margin-top: 20;
        }
        .noimage .paragraph{
            padding-left: 0;
            padding-right: 0;
        }
        #section1{
            display: block;
        }
        
        .paragraph{
            order: 1;
            padding-left: 0%;
            padding-right: 0%;
            /* grid-area: b; */
            /* display: none; */
        }
        #intro-paragraph {
            order: unset;
        }
        .paragraph-title {
            /* display: block; */
            display: none;
        }
    
        .paragraph-image-title {
            /* display: none; */
            display: block;
        }
       





 
  


     
       
        #content{
            max-width: 100%;
            border: none;
        }


        #flower1{
            display: none;
        }
        #form    
        #logo img {
            width: 200px;
            height: 50px;
        }
        .flexbox {
            padding: 30px;
            grid-template-columns: 1fr;
            
        }
        .container{
            width: 100%;
            
        }
        .row {
            flex-direction: column; 
        }
        .column{
            width: 100%;
        }
        #topnav{
            display: none;
            /* height: 50px; */
            
            
            
        }
        #topnav hr{
            display: none;
        }
      
        #topnav.visible{
            display: block;
            
        }
        
        #topnav .btn{
            display: none;
            
        
        }
        #topnav.visible .btn{
            display: block;
            text-align: left;
        }
        #topnav p{
            display: block;
        }
        #topnav.visible p{
            display: none;
        }
        
        #topnav h3{
            display: none;
        }
        #menu-toggler {
            display: flex; 
            
        }
        #burger{
            display: block
        }
      
        #mobile-menu{
            display: block;
        }
    
        /* #mobile-menu a {
            display: block;
            color: #000000;
            text-decoration: none;
            font-size: 18px;
            margin-bottom: 10px;
            font-weight: bold;
        }
     */
        
        footer{
            width: 100%;
            /* background-color: red; */
        }
    
    }

    @media (max-width: 900px) {

        .flower-random-absolute{
            display: block;
        }
        .title-image{
            width: 50%;
        }
        #title-image3{
            display: none;
        }
        /* #countdown-container{
            font-size: 18px;
        }
        .countdown-n h2{
            font-size: 36px;
        }
     */
        
    }

    @media (max-width: 500px) {
        .title-image{
            width: 100%;
        }
        #title-image2{
            display: none;

            

        }

        #countdown-container{
            font-size: 12px;
        }
        .countdown-n h2{.
            font-size: 24px;
        }
    

        /* .countdown-n{
         
        
            font-size: 10px;
        }
        .countdown-n h2{
            font-size: 20px;
        } */
        
    }
    

        
        
       
       
      
    
    
    