#section{
    position:absolute;
    top:0;
    bottom:0;
    right:0;
    left:0;
    padding:0;
    margin:0;
    min-height:auto;
    height:auto;
    width:auto;
    min-width:auto;
    overflow: hidden;
    }
    
   #header>.row>.col:nth-child(2){
   visibility:hidden;
    }
    
    #main-title-line-1,
    #main-title-line-2,
    #main-title-line-3{
    font-size:3.4em;
    font-weight:900;
    position:absolute;
    white-space: nowrap;
    top:50%;
    left:50%;
    line-height:1.1em;
    transform:translate(-50%,-50%);
    -moz-transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
    -o-transform:translate(-50%,-50%);
    -ms-transform:translate(-50%,-50%);
    }
    
    #main-title-line-1,
    #main-title-line-3{
    color:#000;
    text-align:right;
    }
    
    #main-title-line-2{
    color:#FFF;
    text-align:left;
    }
    
    #dashed-line-bg{
    position:absolute;
    top:50%; 
    left:50%; 
    }
    
    #euros {
    transition:opacity 0.6s, margin-top 0.75s;
    -moz-transition:opacity 0.6s, margin-top 0.75s;
    -webkit-transition:opacity 0.6s, margin-top 0.75s;
    -o-transition:opacity 0.6s, margin-top 0.75s;
    -ms-transition:opacity 0.6s, margin-top 0.75s;
    position:absolute;
    top:0;
    bottom: 0;
    left:0;
    right:0;
    margin-top:-100%;
    opacity:0;
    }
    
    #euros.starting {
    margin-top:0;
    opacity:1;
    }
    
    @media (orientation:landscape) {
    
    #dashed-line-bg{
    width:265px; 
    height:892px; 
    margin:-446px 0 0 -132.5px; 
    background:url('./../img/dashed-line-1.png') 50% 50% no-repeat;
    }
    
    #main-title-line-1{
    margin:-100px 0 0 -200px
    }
    
    #main-title-line-2{
    margin:5px 0 0 90px;
    }
    
    #main-title-line-3{
    margin:105px 0 0 -150px;
    }
    
    }
    
    @media (orientation:portrait) {
    
    #dashed-line-bg{
    width:203px; 
    height:1049px;
    margin:-524.5px 0 0 -101.5px;
    background:url('./../img/dashed-line-2.png') 50% 50% no-repeat;
    }
    
    #main-title-line-1{
    margin:-150px 0 0 -80px;
    }
    
    #main-title-line-2{
    margin:5px 0 0 20px;
    }
    
    #main-title-line-3{
    margin:162px 0 0 -46px
    }
    
    #main-title-line-1>span,
    #main-title-line-2>span,
    #main-title-line-3>span{
    display:block;
    }
    }
    
    .euro{
    width:130px;
    height:130px;
    position: absolute;
    margin-left:-65px;
    margin-top:-65px;
    }
    
    .euro::after{
    display:block;
    content:"";
    height:95px;
    width:0;
    border-left:1px solid rgba(255,255,255,0.4);
    position:absolute;
    left:50%;
    top:-50px;
    margin-left:10px;
    margin-top:10px;
    }
    
    .euro::before{
    display:block;
    content:"";
    height:70px;
    width:0;
    border-left:1px solid rgba(255,255,255,0.4);
    position:absolute;
    left:50%;
    top:-50px;
    margin-left:-10px;
    margin-top:-10px;
    }
    
    #button {
    width: 200px;
    height: 94px;
    position: absolute;
    font-size:16px;
    left:50%;
    margin-left:-100px;
    top:50%;
    margin-top:212px;
    display:block;
    cursor:pointer;
    }
    
    @media (orientation:portrait) {
    #button{
    margin-top:322px ;
    }
    }
    
    
    #button>.billet {
    width: 200px;
    height: 94px;
    position: absolute;
    overflow: hidden;
    background: white;
    border: 6px solid black;
    border-radius: 2%;
    display:block;
    }
    
    #button>.billet:nth-child(1) {
    margin-left: 10px;
    margin-top: -10px;
    }
    
    #button>.billet:nth-child(3) {
    margin-left: -10px;
    margin-top: 10px;
    }
    
    #button>.billet>.billet-inner {
    overflow: hidden;
    position: absolute;
    top: 6px;
    bottom: 6px;
    right: 6px;
    left: 6px;
    background: white;
    }
    
    #button>.billet>.billet-inner>i {
    display: block;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    position: absolute;
    border: 6px solid black;
    background: white;
    }
    
    #button>.billet>.billet-inner>:nth-child(2) {
    top: -24px;
    left: -24px;
    }
    
    #button>.billet>.billet-inner>:nth-child(3) {
    top: -24px;
    right: -24px;
    }
    
    #button>.billet>.billet-inner>:nth-child(4) {
    bottom: -24px;
    right: -24px;
    }
    
    #button>.billet>.billet-inner>:nth-child(5) {
    bottom: -24px;
    left: -24px;
    }
    
    #button>.billet>.billet-inner>span {
    display: block;
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    border: 5px solid black;
    overflow: hidden;
    line-height:56px;
    text-align: center;
    }
    
    #button>.billet>.billet-inner>span>h3 {
    display:inline-block;
    font-weight: 600;
    line-height: 1em;
    font-family:'Montserrat';
    color:#000; 
    font-size:1.4em;
    vertical-align: middle;
    }
    
    
    
@media (orientation:portrait) {
.euro, #dashed-line-bg{
transform : scale(0.45);
-moz-transform : scale(0.45);
-webkit-transform : scale(0.45);
-o-transform : scale(0.45);
-ms-transform : scale(0.45);
}
}
    
@media (orientation:landscape) {
.euro, #dashed-line-bg{
transform : scale(0.35);
-moz-transform : scale(0.35);
-webkit-transform : scale(0.35);
-o-transform : scale(0.35);
-ms-transform : scale(0.35);
}
}
    
@media (orientation:portrait) and (min-width:360px) and (min-height:640px) {
.euro, #dashed-line-bg{
transform : scale(0.55);
-moz-transform : scale(0.55);
-webkit-transform : scale(0.55);
-o-transform : scale(0.55);
-ms-transform : scale(0.55);
}
}

@media (orientation:portrait) and (min-width:375px) and (min-height:667px) {
.euro, #dashed-line-bg{
transform : scale(0.6);
-moz-transform : scale(0.6);
-webkit-transform : scale(0.6);
-o-transform : scale(0.6);
-ms-transform : scale(0.6);
}
}

@media (orientation:portrait) and (min-width:412px) and (min-height:732px) {
.euro, #dashed-line-bg{
transform : scale(0.65);
-moz-transform : scale(0.65);
-webkit-transform : scale(0.65);
-o-transform : scale(0.65);
-ms-transform : scale(0.65);
}
}

@media (orientation:portrait) and (min-width:600px) and (min-height:960px) {
.euro, #dashed-line-bg{
transform : scale(0.8);
-moz-transform : scale(0.8);
-webkit-transform : scale(0.8);
-o-transform : scale(0.8);
-ms-transform : scale(0.8);
}
}

@media (orientation:portrait) and (min-width:768px) and (min-height:1024px) {
.euro, #dashed-line-bg{
transform : scale(0.86);
-moz-transform : scale(0.86);
-webkit-transform : scale(0.86);
-o-transform : scale(0.86);
-ms-transform : scale(0.86);
}
}

@media (orientation:portrait) and (min-width:800px) and (min-height:1280px) {
.euro, #dashed-line-bg{
transform:scale(1);
-moz-transform:scale(1);
-webkit-transform:scale(1);
-o-transform:scale(1);
-ms-transform:scale(1);
}
}
 
@media (orientation:landscape) and (min-width:640px) and (min-height:360px) {
.euro, #dashed-line-bg{
transform : scale(0.4);
-moz-transform : scale(0.4);
-webkit-transform : scale(0.4);
-o-transform : scale(0.4);
-ms-transform : scale(0.4);
}
}

@media (orientation:landscape) and (min-width:667px) and (min-height:375px) {
.euro, #dashed-line-bg{
transform : scale(0.42);
-moz-transform : scale(0.42);
-webkit-transform : scale(0.42);
-o-transform : scale(0.42);
-ms-transform : scale(0.42);
}
}

@media (orientation:landscape) and (min-width:736px) and (min-height:414px) {
.euro, #dashed-line-bg{
transform : scale(0.47);
-moz-transform : scale(0.47);
-webkit-transform : scale(0.47);
-o-transform : scale(0.47);
-ms-transform : scale(0.47);
}
}

@media (orientation:landscape) and (min-width:960px) and (min-height:600px) {
.euro, #dashed-line-bg{
transform : scale(0.67);
-moz-transform : scale(0.67);
-webkit-transform : scale(0.67);
-o-transform : scale(0.67);
-ms-transform : scale(0.67);
}
}

@media (orientation:landscape) and (min-width:1023px) and (min-height:600px) {
.euro, #dashed-line-bg{
transform : scale(0.65);
-moz-transform : scale(0.65);
-webkit-transform : scale(0.65);
-o-transform : scale(0.65);
-ms-transform : scale(0.65);
}
}

@media (orientation:landscape) and (min-width:1023px) and (min-height:768px) {
.euro, #dashed-line-bg{
transform : scale(0.85);
-moz-transform : scale(0.85);
-webkit-transform : scale(0.85);
-o-transform : scale(0.85);
-ms-transform : scale(0.85);
}
}

@media (orientation:landscape) and (min-width:1279px) and (min-height:719px) {
.euro, #dashed-line-bg{
transform : scale(0.87);
-moz-transform : scale(0.87);
-webkit-transform : scale(0.87);
-o-transform : scale(0.87);
-ms-transform : scale(0.87);
}
}

@media (orientation:landscape) and (min-height:800px) {
.euro, #dashed-line-bg{
transform:scale(1);
-moz-transform:scale(1);
-webkit-transform:scale(1);
-o-transform:scale(1);
-ms-transform:scale(1);
}
}