/************************************************************************************************************
*	DHTML modal dialog box	(CSS for the DHTMLSuite_modalMessage class)
*
*	Created:						August, 26th, 2006
*	@class Purpose of class:		Display a modal dialog box on the screen.
*
*	Css files used by this script:	modal-message.css
*
* 	Update log:
*
************************************************************************************************************/

.modalDialog_transparentDivs{
    filter:alpha(opacity=40);	/* Transparency */
    opacity:0.4;	/* Transparency */
    background-color:#AAA;
    z-index:1;
    position:absolute; /* Always needed	*/
    box-sizing: content-box;
}
.modalDialog_contentDiv{

    /* border:1px solid #888; */
    border: 0px;
    padding:3px;
    z-index:100;
    position:absolute;
    /* background-color:#F4F4F4; */
    background-color: transparent;
    font-family: Verdana, Geneva, Arial, helvetica, sans-serif;
    font-weight: bold;
    font-size: 12px;
    color: #000000;
    text-align: center;
    padding-top: 12px;
    box-sizing: content-box;
    line-height: 12px;
}

.modalDialog_contentDiv *{
    box-sizing: content-box;
}

.modalDialog_contentDiv_shadow{
    display: none;
/*    z-index:90;
    position:absolute;
    background-color:#555;
    filter:alpha(opacity=30);
    opacity:0.3;
    box-sizing: content-box;*/
}



#loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
}
#loader {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #3498db;
    -webkit-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
    animation: fade_in_show_2 3s, spin 2s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

#loader:before {
    content: "";
    position: absolute;
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #e74c3c;
    -webkit-animation: spin 3s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
    animation: spin 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

#loader:after {
    content: "";
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 15px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #f9c922;
    -webkit-animation: spin 1.5s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
    animation: spin 1.5s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

@-webkit-keyframes spin {
    0%   {
        -webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg);  /* IE 9 */
        transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
    }
    100% {
        -webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg);  /* IE 9 */
        transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
    }
}
@keyframes spin {
    0%   {
        -webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg);  /* IE 9 */
        transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
    }
    100% {
        -webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg);  /* IE 9 */
        transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
    }
}

/* fade_in_show és fade_in_show_2 animációk a main.css-ben vannak definiálva */