body .dialog a { color: #f15a4b; text-decoration: underline; }

#progressOuter
{
    max-width: 950px;
    margin: 0px auto;
    background-image: url(/assets/general/progress_bar_empty.png);
    background-position: bottom left;
    position: relative;
}

#progressBar
{
    font-family: 'ProximaNova-Regular', sans-serif;
    .name { position: absolute; left: 0px; width: 100%; line-height: 60px; }
    .size { position: absolute; right: 0px; width: 300px; text-align: right; line-height: 60px;}

    .wrapper
    {
    	width: 100%;
	    background-image: url(/assets/general/progress_bar.png);
	    background-repeat: repeat-x;
	    background-position: bottom left;
	    height: 60px;
    }
}

.app-menu
{
    .mainNavigation 
    { 
        z-index: 1;
        padding-top: 10px; 
        display: none;

        @media (min-width: 768px)
        {
            UL LI {
                margin: 0px 30px 0px 0px;
            }
        }

        a
        {
            font-size: 13px;
            color: black;
        }
    }
}

#rsvp .image { text-align: left; }

#ourWeddingApp { display: none; }


.live-edit-mode #weddingParty li.col:hover { box-sizing: border-box; border: 0px; }

.head-wrap { z-index: 0; }
.live-edit-mode .head-wrap.editable:hover
{
    cursor: pointer;
}
.live-edit-mode .head-wrap.editable:hover:before 
{
    top: 0px;
    right: 0px;
    background-position: 98% 2%;
    width: 100%;
    height: 100%;
}

.mode-guest .rsvpall { display: none !important; }

.section-center 
{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
}

.travel_section_1
{
    form legend
    {
        font-size: 30px; 
        font-weight: bold;
        font-family: "BebasNeue_Bold";
        margin-bottom: 90px;
    }

    .copyside
    {
        position: relative;
        height: 346px;


        .travel-copy
        {
            width: 100%;
            .section-center;
        }
    }

    .travel-title
    { 
        margin: 0px;
        text-transform: uppercase;
    }

    .travel-locations 
    { 
        font-weight: bold;
        font-family: "gothamhtf-book-webfont";
        font-size: 18px;
        text-transform: uppercase;
        line-height: 26px;

        background: url(/images/hr_divider.png) no-repeat center bottom;
        padding-bottom: 20px;

    }

    .travel-dates 
    {
        font-weight: bold;
        font-family: "gothamhtf-bold-webfont";
        font-size: 18px;
        text-transform: uppercase;
        line-height: 26px;
    }

    .travel-subtitle
    {
        font-family: 'PlayfairDisplay-Italic';
        font-size: 23px;
        font-style: italic;
        margin-bottom: 20px;
        margin-top: 5px;
    }

    .travel-price
    {
        font-family: 'PlayfairDisplay-Regular';
        font-size: 35px;
    }

    .travel-pricedetails
    {
        font-family: "gothamhtf-bold-webfont";
        font-size: 10px;
        text-transform: uppercase;
        background: none;
        margin-top: 20px;
        margin-bottom: 10px;
    }

    #travel_high_title
    {
        margin-top: 75px;
        font-size: 60px;
    }

    #travel_low_title
    {
        font-size: 40px;
    }

    #travel_low_copy
    {
        max-width: 550px;
        margin: 0px auto;
    }
}

.travel_section_2 (@color: #888)
{
    p, h1, h2, h3, h4 {
        color: @color;
    }

    form legend
    {
        .image 
        {
            text-align: center;
        }

        font-size: 20px; 
        font-weight: bold;
        font-family: 'DINPro-Medium';
        margin-bottom: 90px;
        letter-spacing: 1px;
    }

    .container
    {
        max-width: 960px;
    }

    .copyside
    {
        position: relative;
        height: 346px;


        .travel-copy
        {
            width: 100%;
            .section-center;
        }
    }

    .travel-title
    { 
        margin: 0px;
        text-transform: uppercase;
        font-family: "DINPro-Bold";
    }

    .travel-locations 
    { 
        font-weight: bold;
        font-family: "DINPro-Medium";
        font-size: 18px;
        text-transform: uppercase;
        line-height: 26px;

        background: url(/images/hr_divider_888.png) no-repeat center bottom;
        padding-bottom: 20px;

    }

    .travel-dates 
    {
        font-weight: bold;
        font-family: "DINPro-Medium";
        font-size: 18px;
        text-transform: uppercase;
        line-height: 26px;
    }

    .travel-subtitle
    {
        font-family: 'PlayfairDisplay-Italic';
        font-size: 23px;
        font-style: italic;
        margin-bottom: 20px;
        margin-top: 5px;
    }

    .travel-price
    {
        font-family: "DINPro-Bold";
        font-size: 35px;
    }

    .travel-pricedetails
    {
        font-family: "DINPro-Medium";
        font-size: 10px;
        text-transform: uppercase;
        background: none;
        margin-top: 20px;
        margin-bottom: 10px;
    }

    #travel_high_title
    {
        margin-bottom: 50px;
        font-size: 45px !important;
    }

    #travel_low_title
    {
        font-size: 25px;
        margin-bottom: 20px;
    }

    #travel_low_copy
    {
        max-width: 550px;
        margin: 0px auto;
        line-height: 30px;
        font-size: 18px !important;
        letter-spacing: 1px;
        font-family: 'Gibson-Regular';
    }
}

@media (max-width: 767px)
{
    #travel .copyside .travel-copy { position: static !important; transform: inherit !important; margin-top: 5px; }
}

.luxe-event #travel .luxe
{
    display: block;
}

.luxe-event #travel .normal
{
    display: none;
}

.normal-event #travel .luxe
{
    display: none;
}

.normal-event #travel .normal
{
    display: block;
}

#travel p.travel-url a { color: inherit; text-decoration: none; }

@media (min-width: 1040px)
{
    #photos ul li { width: 25%; }
}

@media (min-width: 820px) and (max-width: 1039px)
{
    #photos ul li { width: 33%; }
}

@media (min-width: 600px) and (max-width: 819px)
{
    #photos ul li { width: 50%; }
}

@media (max-width: 599px)
{
    #photos ul li { width: 100%; }
}


#photos ul li { box-sizing: border-box; border: 5px solid white; } 
#photos ul li img { width: 100%;  }