#advent-wrapper {
      padding-top:20px; 
      background-image: url(../images/advent/bg.jpg);
      background-position: bottom right;
      background-repeat: no-repeat;
      background-attachment: fixed;
      background-size: cover;
      background-color: #b6d3d7;
      color: #fff;
      font-family: 'Open Sans', sans-serif;
      font-size: 10px;
      width:100%;
    }
    
    #advent-wrapper-wrap a {
        font-size: 10px;
        color: #9ababf;
        font-family: 'Open Sans', sans-serif;
        transition: none;
    }
    #advent-wrapper-wrap a:link {
        text-decoration: none;
        color: #9ababf;
    }
    #advent-wrapper-wrap a:hover {
        text-decoration: none;
        color: #d2e5e8;
    }
    #advent-wrapper-wrap a:active {
        text-decoration: none;
        color: #9ababf;
    }
    
    #advent-wrapper-wrap {
        margin: 0 auto;
        max-width: 875px;
        text-align: center;
        min-height:950px;
    }
    
    #advent-wrapper-wrap > img {
        width: 61%;
        height: auto;
    }
    
    img.social {
        width: 25%;
        height: auto;
        padding: 15px;
    }
    
    #doors {
        list-style: none;
        text-align: center;
        padding: 0;
    }
    
    .door {
        display: inline-block;
        padding: 5px 20px;
    }
    
    .door a {
        display: block;
        width: 90px;
        background-size: 90px auto;
        background-position: 0 0;
    }
    
    .door a:hover {
        background-position: left bottom;
    }

    .d1 a, .d2 a, .d3 a, .d4 a, .d5 a, .d6 a, .d7 a, .d8 a, .d9 a, .d10 a, .d11 a, .d12 a, .d13 a, .d14 a, .d15 a, .d16 a, .d17 a, .d18 a, .d19 a, .d20 a, .d21 a, .d22 a, .d23 a, .d24 a {
        height: 104px;
    }
    
    .d1 > a {
        background-image: url('../images/advent/doors/1.png');
    }
    
    .d2 > a {
        background-image: url('../images/advent/doors/2.png');
    }
    
    .d3 > a {
        background-image: url('../images/advent/doors/3.png');
    }
    
    .d4 > a {
        background-image: url('../images/advent/doors/4.png');
    }
    
    .d5 > a {
        background-image: url('../images/advent/doors/5.png');
    }
    
    .d6 > a {
        background-image: url('../images/advent/doors/6.png');
    }
    
    .d7 > a {
        background-image: url('../images/advent/doors/7.png');
    }
    
    .d8 > a {
        background-image: url('../images/advent/doors/8.png');
    }
    
    .d9 > a {
        background-image: url('../images/advent/doors/9.png');
    }
    
    .d10 > a {
        background-image: url('../images/advent/doors/10.png');
    }
    
    .d11 > a {
        background-image: url('../images/advent/doors/11.png');
    }
    
    .d12 > a {
        background-image: url('../images/advent/doors/12.png');
    }
    
    .d13 > a {
        background-image: url('../images/advent/doors/13.png');
    }
    
    .d14 > a {
        background-image: url('../images/advent/doors/14.png');
    }
    
    .d15 > a {
        background-image: url('../images/advent/doors/15.png');
    }
    
    .d16 > a {
        background-image: url('../images/advent/doors/16.png');
    }
    
    .d17 > a {
        background-image: url('../images/advent/doors/17.png');
    }
    
    .d18 > a {
        background-image: url('../images/advent/doors/18.png');
    }
    
    .d19 > a {
        background-image: url('../images/advent/doors/19.png');
    }
    
    .d20 > a {
        background-image: url('../images/advent/doors/20.png');
    }
    
    .d21 > a {
        background-image: url('../images/advent/doors/21.png');
    }
    
    .d22 > a {
        background-image: url('../images/advent/doors/22.png');
    }
    
    .d23 > a {
        background-image: url('../images/advent/doors/23.png');
    }
    
    .d24 > a {
        background-image: url('../images/advent/doors/24.png');
    }
    
    @media only screen 
    and (min-device-width : 320px) 
    and (max-device-width : 568px) 
    and (orientation : portrait) { 
    
        #advent-wrapper-wrap {
            margin: 0 auto;
            max-width: 400px;
            text-align: center;
        }
        
        #advent-wrapper-wrap > img {
            width: 90%;
            height: auto;
        }
        
        img.social {
            width: 40%;
            height: auto;
            padding: 0px !important;
        }
        
        #doors {
            list-style: none;
            padding: 0px;
            text-align: center;
        }
        
        .door {
            display: inline-block;
            padding: 5px 10px;
        }
        
        .door a {
            display: block;
            width: 43px;
            background-size: 43px auto;
            background-position: 0 0;
        }

        .d1 a, .d2 a, .d3 a, .d4 a, .d5 a, .d6 a, .d7 a, .d8 a, .d9 a, .d10 a, .d11 a, .d12 a, .d13 a, .d14 a, .d15 a, .d16 a, .d17 a, .d18 a, .d19 a, .d20 a, .d21 a, .d22 a, .d23 a, .d24 a {
            height: 49px;
        }
    
     }
    
    @media only screen and (max-width : 650px)  {
        #advent-wrapper-wrap > img {
            width: 81%;
        }
        
        img.social {
            width: 35%;
        }
    }
    
    @media only screen and (max-width : 760px)  {
        img.social {
            width: 35%;
        }
    }
    
    @media only screen and (max-width : 427px)  {
    
        img.social {
            width: 55%;
            height: auto;
            display: block;
            margin-left: auto;
            margin-right: auto;
        }
    
    }