@import url('https://fonts.googleapis.com/css2?family=Cormorant:ital,wght@0,300..700;1,300..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+SC:wght@300;400;500;600;700&family=Cormorant:ital,wght@0,300..700;1,300..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Great+Vibes&display=swap');

@font-face {
  font-family: 'Alta_R';
  src: url('https://januarnatasyha.lavierproject.com/font/alta-regular.otf');
}

@font-face {
  font-family: 'Melinda_S';
  src: url('https://januarnatasyha.lavierproject.com/font/Melinda Script.ttf');
}

@font-face {
  font-family: 'Southland';
  src: url('https://januarnatasyha.lavierproject.com/font/Southland.ttf');
}

@font-face {
    font-family: 'Alta Regular';
    /*src: url('https://januarnatasyha.lavierproject.com/font/alta-regular.otf');*/
    src: url('https://januarnatasyha.lavierproject.com/font/alta_regular.eot'); 
    src: url('https://januarnatasyha.lavierproject.com/font/alta_regular.eot?#iefix') format("embedded-opentype"), 
       url('https://januarnatasyha.lavierproject.com/font/alta_regular.woff2') format('woff2'), 
       url('https://januarnatasyha.lavierproject.com/font/alta_regular.woff') format('woff'), 
       url('https://januarnatasyha.lavierproject.com/font/alta_regular.ttf')  format('truetype'), 
       url('https://januarnatasyha.lavierproject.com/font/alta_regular.svg#Alta Regular') format('svg'); 
}

@font-face {
    font-family: 'Southland Regular';
    src: url('https://januarnatasyha.lavierproject.com/font/southland_regular.eot'); 
    src: url('https://januarnatasyha.lavierproject.com/font/southland_regular.eot?#iefix') format("embedded-opentype"), 
       url('https://januarnatasyha.lavierproject.com/font/southland_regular.woff2') format('woff2'), 
       url('https://januarnatasyha.lavierproject.com/font/southland_regular.woff') format('woff'), 
       url('https://januarnatasyha.lavierproject.com/font/southland_regular.ttf')  format('truetype'), 
       url('https://januarnatasyha.lavierproject.com/font/southland_regular.svg#Southland Regular') format('svg'); 
}

@font-face {
    font-family: 'Melinda Script';
    src: url('https://januarnatasyha.lavierproject.com/font/melinda_script.eot'); 
    src: url('https://januarnatasyha.lavierproject.com/font/melinda_script.eot?#iefix') format("embedded-opentype"), 
       url('https://januarnatasyha.lavierproject.com/font/melinda_script.woff2') format('woff2'), 
       url('https://januarnatasyha.lavierproject.com/font/melinda_script.woff') format('woff'), 
       url('https://januarnatasyha.lavierproject.com/font/melinda_script.ttf')  format('truetype'), 
       url('https://januarnatasyha.lavierproject.com/font/melinda_script.svg#Melinda Script') format('svg'); 
}

body,html{
    /*background:#6d1d1d;*/
    height: 100vh;
    margin:0px;
    padding:0px;
    overflow-x:hidden;
    overflow-y:hidden;
    background:#808080;
    /*background:url('../image/opening-desktop.jpg');*/
    background-size: cover;
	background-repeat: no-repeat;
	/*background-attachment: fixed;*/
	/*background-position: 50% 25%;*/
	background-position: top;
}

.container-fluid{
    height:71vh;
    /*margin:2.5vh;*/
    display: flex;
    flex-direction: column;
    font-size: 1.875rem;
    text-align: center;
    justify-content:center;
    align-items: center;
    align-content: space-between;
    flex-direction: column;
}

.youre_invited_to{
    font-family:"Cormorant SC" !important;
    /*font-family: 'Alta_R';*/
    /*font-style:italic;*/
    /*color:#FFF4CF;*/
    color:black;
    font-size:1.25rem;
    letter-spacing: 0.1875rem;
    height:15vh;
}

#for{
    /*font-family: 'Bell MT';*/
    font-family:"Cormorant SC" !important;
    /*font-family: 'Alta_R';*/
    /*font-style:italic;*/
    color:#FFF4CF;
    font-size:1.5rem;
    text-align:center;
    margin: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.the_wedding_of{
    /*color:#FFF4CF;*/
    margin-top:33vh;
    color:#E5E3D7;
    font-family:"Alta Regular" !important;
    /*font-family: 'Alta_R';*/
    font-size:1.25rem;
    letter-spacing: 0.1875rem;
}

.wedding_name{
    /*color:#FFF4CF;*/
    color:#E5E3D7;
    margin-top:-2rem;
    margin-bottom:-2.25rem;
    /*font-family: 'Southland';*/
    font-family:'Southland Regular';
    font-size:4.5rem;
    letter-spacing: 0.1875rem;
}

.wedding_date{
    /*color:#FFF4CF;*/
    color:#E5E3D7;
    font-family:"Cormorant SC" !important;
    /*font-family: 'Alta_R';*/
    font-size:1.25rem;
    letter-spacing: 0.1875rem;
}

.open{
    /*margin-top:1.8rem;*/
    /*padding:0.625rem;*/
    padding: 1rem 4rem;
    font-size:1.5rem;
    border-radius:15px;
    cursor:pointer;
    border: 0px;
    background:transparent;
    
    letter-spacing: 0.1875rem;
    text-decoration:none;
    
    /*font-family: 'Alta_R';*/
    font-family:"Alta Regular";
    color:black;
    font-size:1rem;
}

.open a{
    letter-spacing: 0.1875rem;
    text-decoration:none;
    /*color:black;*/
    /*font-family: 'Alta_R';*/
    font-family:"Alta Regular";
    color:black;
    font-size:1rem;
    /*font-style:italic;*/
}

@media only screen and (max-width: 1000px)  {
    .the_wedding_of{
        font-size:2rem;
    }
    
    .wedding_name{
        font-size:4.5rem;
    }
    
    .wedding_date{
        font-size:2rem;
    }
}

@media only screen and (max-width: 600px)  {
    body{
        background-repeat: no-repeat;
	    -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background:url('../image/opening-background-hp.png');
        background-position: center;
        background-size: cover;
	    height: 100vh;

    }
    
    #for{
        /*font-family: 'Bell MT';*/
        font-size:1.25rem;
    }
    
    .youre_invited_to{
        font-size:1.1rem;
    }
    
    .the_wedding_of{
        font-size:1.1rem;
    }
    
    .wedding_name{
        font-size:4.5rem;
    }
    
    .wedding_date{
        font-size:1.1rem;
    }
    
    .open{
        /*padding:0.625rem;*/
        padding: 0.625 1rem;
        /*font-size:1.25rem;*/
        border-radius:15px;
        
        letter-spacing: 0.1875rem;
        font-size:0.75rem;
    }
    
    .open a{
        letter-spacing: 0.1875rem;
        font-size:0.75rem;
    }
}

@media only screen and (max-width: 380px)  {
    #for{
        /*font-family: 'Bell MT';*/
        font-size:1rem;
    }
    
    .youre_invited_to{
        font-size:0.75rem;
    }
    
    .the_wedding_of{
        /*font-size: calc(0.4rem + 0.6rem * ((100vw) / 380));*/
        font-size:0.75rem;
    }
    
    .wedding_name{
        /*font-size: calc(0.4rem + 0.6rem * ((100vw) / 380));*/
        font-size:4.5rem;
    }
    
    .wedding_date{
        /*font-size: calc(0.4rem + 0.6rem * ((100vw) / 380));*/
        font-size:0.625rem;
    }
    
    .open{
        /*padding:0.625rem;*/
        padding: 0.625 1rem;
        /*font-size:1rem;*/
        border-radius:15px;
        
        letter-spacing: 0.1875rem;
        font-size:0.75rem;
    }
    
    .open a{
        letter-spacing: 0.1875rem;
        font-size:0.75rem;
    }
}