.PopupHolder h2, #LogonPopup h2 { font-family: 'LucidaBrightRegular'; }

#backgroundPopup { display: none;
                   position: fixed;
                   _position: absolute; /* hack for internet explorer 6*/
                   height: 100%;
                   width: 100%;
                   top: 0;
                   left: 0;
                   background: #000000;
                   border: 1px solid #cecece;
}

.mosaic-backdrop {
    display: none;
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
}

.mosaic-overlay {
    display: none;
    z-index: 5;
    position: absolute;
    width: 100%;
    height: 100%;
    background: #111;
}

.PopupHolder,.PopupHolderVisible {
    position: fixed !important;
    left: 25%;
    top: 15%;
    margin:0 auto !important;
    width: auto;
    height: auto;
    background: #525562;
    border: 1px solid #111;
    padding: 10px;
    visibility: hidden;
    border-radius:5px;
    font-size: 1.2em;
    z-index:2000;

}

.PopupHolderVisible{visibility: visible;z-index:900000 !important}

.PopupHolder h2 { color: White; }

.PopupClose {
    
    margin-bottom:5px;
    width: 48px;
    height: 48px;
    padding:2px;
    float:right;
    border:solid 1px #CeCeCe;
    display:block;
    overflow:hidden;
    background: url(../Images/PopupClose.png) no-repeat top right;
    border-radius:5px;
    cursor: pointer;
    text-indent: -10000px;
}

.PopupFrame {
    width:100%;
    margin-left:auto;
    margin-right:auto;
}

#SignupForm,.PopupFrame,.PopupError {
    overflow: auto;
    overflow-x: hidden;
    color:#EEE;
    width:45%;
    float:left;
    margin-right:10px;
    padding:5px;
}


.PopupError{
    background-color: white;
    font-weight: bold;
    color:red;
    width:95%;
    border-radius:7px;
}

.FrontRow, .FrontRowHeader {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    height: auto;
    overflow: hidden;
    margin-bottom: 15px;
    overflow:hidden;
}

.FrontRow input { width: 90%; }

.FrontRowHeader {
    color: #FFFFFF;
    font-weight: bold;
    margin-top:10px;
}

.FrontCell, .FrontCellHeader, .FrontCellEnd, .FrontCellHeaderEnd {
    float: left;
    display: inline-table;
    /* border-right: solid 1px #DCDCDC;*/
    padding: 5px;
    height: auto;
    min-height: 50px;
}

.FrontCell span {
    width:100%;
    float:left;
    display:block;
    font-size:0.9em;
    text-align:justify;
}

.FrontCellEnd, .FrontCellHeaderEnd {
    border-right: none;
}

.FrontCellControl,.FrontCellTitle {
    float: left;
    display: inline-table;
    /*border-right: solid 1px #DCDCDC;*/
    height: auto;
    min-height: 50px;
}

.FrontCellControl {
    float: right;
    width: 70%;
}
.FrontCellControl input, .FrontCellControl textarea {
    padding: 5px;
    font-size: 1.1em;
    border: none;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    -webkit-border-radius: 5px;
    color: #333;
    background: #eee!important;
}

.FrontCellTitle {
    float: left;
    width: 30%;
    padding-top: 6px;
}

.FrontRowImage {
    border:solid 1px #DCDCDC;
    padding:2px;
    border-radius:3px;
    cursor:pointer;
    background-color:#EEE;
    margin:5px;
}

.FrontRowImage:hover { box-shadow:2px 2px 6px #000000; }

#divErrorMessage { float: left; margin-bottom: 10px; }


#LogonPopup, #Register {
    left: 15%;
    top: 15%;
    width: 70%;
    height: auto;
    border: 1px solid #111;
    padding: 10px;
    visibility: hidden;
    border-radius:5px;
    padding: 20px;
}
/*#Register { font-size: 0.9em; padding-bottom: 30px; }
#Register h2 { font-size: 1.8em; }
#Register p { text-align: left; }*/
/*#Register input.text { 
    float: left; 
    width: 50%!important; 
    margin: 9px 0px 15px 0px; 
    font-size: 1.8em;
    padding: 13px;
}*/
#Register #divSubmitError { clear: both; color: #FFFF66; margin-bottom: 15px; }


#MyHootsDetails { height: 600px!important; overflow-y:scroll; }
#myHootsDetails .hoot { width: 22%; }

#FrameDetailsLogin, #FrameDetails { float: left; width: 59%!important; padding: 0!important; margin: 0!important; }
	#FrameDetailsLogin .FrontRow a, #FrameDetails .FrontRow a { color: #ebd373; }
	#FrameDetailsLogin .button, #FrameDetails .button, #ContactSeller .button {
	  float: right!important;
	  background: url('http://darvelmusicfestival.org/images/template/btn-search.png') center center no-repeat!important;
	  width: 155px!important;
	  height: 48px!important;
	  padding-top: 15px!important;
	  text-align: center!important;
	  color: #FFF!important;
	  padding-right: 0px!important;
	  font-weight: normal!important;
	  margin-right: 25px!important;
	}

#FrameBenefitsLogin, #FrameBenefits { float: left; width: 40%!important; padding: 0!important; margin: 0!important; }
	#FrameBenefitsLogin li, #FrameBenefits li { font-size: 0.9em; margin-bottom: 15px; background: url('http://darvelmusicfestival.org/Images/Template/bullet-white.png') no-repeat; background-position: 0 6px; padding-left: 15px; }

#Register #divSubmitError { margin-bottom: 0px!important; }

#ContactSeller { }
		#ContactSeller p { text-align: left; font-size: 1.1em!important; color: #FFF; }
		#ContactSeller .PopupFrame { width: 90%!important; }
		#ContactSeller #txtMessage { width: 90%; }
	
	

/* ============================= */
/* ! Layout for 1024px version   */
/* ============================= */

@media handheld, only screen and (max-width: 1023px) {


}

/* ============================= */
/* ! Layout for tablet version   */
/* ============================= */

@media handheld, only screen and (max-width: 1024px)
{

    #ImagePopup, #VideoPopup {
        width: 80%;
        left: 8%;
        padding: 2%;
        height: auto!important;
    } 

    #logonpopup, #register { 
        left: 12.5%;
        top: 10%;
        width: 70%!important;
        height: auto;
        border: 1px solid #111;
        padding: 10px;
        visibility: hidden;
        border-radius: 5px;
        padding: 2.5%;
    }
	
	#LogonPopup, #Register, #ContactSeller {
    left: 0;
    top: 0;
    width: 90%;
    height: auto;
    border: none;
    padding: 10px;
    visibility: hidden;
    border-radius: 0px;
    padding: 5%;
	font-size: 0.9em;
	}
	
	.PopupClose { top:10px; right: 10px; }
	.PopupFrame { }
		.PopupFrame h2 { margin-bottom: 5px!important; }
		.PopupFrame .FrontRow { }
		.PopupFrame .FrontCellTitle { height: auto!important; }
		.FrontRow, .FrontRowHeader  { margin-bottom: 5px!important; }

	#social_login_container { height: 75px!important; overflow:hidden!important; }

    .FrontCellTitle, .FrontCellControl { width: 100%; }
    .frontrow input { width: 100%; max-width: 100%; }
	
}

/* ============================= */
/* ! Layout for mobile version   */
/* ============================= */

@media handheld, only screen and (max-width: 480px) {
	
	#FrameBenefitsLogin, #FrameBenefits { display: none; visibility: hidden!important; }
	#FrameDetailsLogin, #FrameDetails { width: 100%!important; }
	.FrontCellTitle { width: 40%!important; }
	.FrontCellControl { width: 60%!important; }
	
	#MyHootsDisplay .PopupFrame { width: 95%!important; }
	#MyHootsDisplay .PopupFrame .icon-delete { float: right; margin-left: 10px; }
	
}


/* ========================================== */
/* ! Provide higher res assets for iPhone 4   */
/* ========================================== */

@media only screen and (-webkit-min-device-pixel-ratio: 2)
{

    /*	.logo {
                            background: url(http://darvelmusicfestival.org/css/logo2x.jpg) no-repeat;
                            background-size: 212px 303px;
                    }*/

}