/*
pour mémoire
.article-text P {
	margin-top: 1em;
	margin-bottom: 1em;
	margin-block-end: 1em;
	margin-block-start: 1em;
	display: block;
	border: 1px dashed purple;
	
par défaut du navigateur
	display: block;
	margin-top: 1em;
	margin-bottom: 1em;
	margin-left: 0;
	margin-right: 0;
}
*/



/* article-dialog.css */
.article {
    font-family: 'Droid Serif', serif;
    margin: 0;
    padding: 0;
    max-width: 1100px;
    margin: 0 auto;
	oborder: 4px dashed purple !important;
}

.article-content {
    max-width: 800px;
    margin: 0 auto;
    margin-top: 1em;
    display: flex;
    flex-direction: column;
	oborder: 4px dashed purple !important;
}

.article-title {
    font-size: 2.5em;
    text-align: center;
    margin-top: 1em;
	oborder: 4px dashed purple !important;
}
/*.article-image-title {
    display: inline-block;
    font-size: 0.9em;
    font-weight: bold;
	oborder: 4px dashed purple !important;
}
.article-image-text {
    display: inline-block;
    font-size: 0.9em;
	oborder: 4px dashed purple !important;
}
.article-image-author {
    display: inline-block;
    font-size: 0.9em;
	oborder: 4px dashed purple !important;
}*/
.article-section {
    font-size: 1.0em;
    font-weight: normal;
    margin-top: 1em;
    margin-bottom: 1em;
    oborder-bottom: 2px solid #3d7acc;
	padding-bottom: 0.4em;
	oborder: 4px dashed purple !important;
}
.article-author {
    font-size: 1.0em;
    font-weight: normal;
    margin-top: 1em;
    margin-bottom: 1em;
	oborder: 4px dashed purple !important;
}
.article-notation {
    font-size: 1.0em;
    font-weight: normal;
    margin-top: 1em;
    margin-bottom: 1em;
	oborder: 4px dashed purple !important;
}
.article-suptitle {
    font-size: 1.70em;
    font-weight: normal;
    margin-top: 1em;
	oborder: 4px dashed purple !important;
	otext-align: justify;
}
.article-subtitle {
    font-size: 1.70em;
    font-weight: normal;
    margin-top: 1em;
	oborder: 4px dashed purple !important;
	otext-align: justify;
}
.article-chapo {
    font-size: 1.70em;
    font-weight: normal;
    margin-top: 1em;
	oborder: 4px dashed purple !important;
	otext-align: justify;
}
.article-text {
    font-size: 1.25em;
    margin-top: 1em;
	oborder: 4px dashed purple !important;
	otext-align: justify;
}
.article-text P {
	margin-bottom: 1em;		/* rem => em */
	oborder: 4px dashed purple !important;
}
.article-subarticle-title {
    font-size: 2.5em;
    text-align: center;
    margin-top: 1em;
	oborder: 4px dashed purple !important;
}
.article-subarticle-author {
    font-size: 1.0em;
    font-weight: normal;
    margin-top: 1em;
    margin-bottom: 1em;
	oborder: 4px dashed purple !important;
}
.article-subarticle-suptitle {
    font-size: 1.70em;
    font-weight: normal;
    margin-top: 1em;
	oborder: 4px dashed purple !important;
}
.article-subarticle-chapo {
    font-size: 1.70em;
    font-weight: normal;
    margin-top: 1em;
	oborder: 4px dashed purple !important;
}
.article-subarticle-text {
    font-size: 1.25em;
    margin-top: 1em;
	oborder: 4px dashed purple !important;
}

@media (max-width: 500px) {
    .article {
    }
    .article-title {
        font-size: 1.5em;
    }
    .article-section {
        margin-top: 0.5em;
        margin-bottom: 0.5em;
    }
    .article-author {
        margin-top: 0.5em;
        margin-bottom: 0.5em;
    }
    .article-suptitle {
        font-size: 1.3em;
    }
    .article-subtitle {
        font-size: 1.3em;
    }
    .article-chapo {
        font-size: 1.3em;
    }
    .article-text {
        font-size: 1.1em;
    }
	
    .article-subarticle-title {
        font-size: 1.5em;
    }
    .article-subarticle-author {
        margin-top: 0.5em;
        margin-bottom: 0.5em;
    }
	.article-subarticle-suptitle {
        font-size: 1.3em;
	}
    .article-subarticle-chapo {
        font-size: 1.3em;
    }
    .article-subarticle-text {
        font-size: 1.1em;
    }
}

.article IMG {
    -webkit-user-drag: none;
	oborder: 4px dashed purple !important;
}        /* better as we have allowed swipe */

/* figaro + resize.php?maxwidth=1024&maxheight=1024 */
.article-inline-image {
	oborder: 4px dashed purple !important;
}

/* tribuca + resize.php?maxwidth=1024&maxheight=500 */
/* le principe on conserve les proportions et la largeur s'adaptera à la largeur */
.article-inline-image {
    max-width: 100%;
}
/* ensuite on gère juste que sur la hauteur on n'occupe pas plus de 1/3 */
@media (max-height: 2048px) {
    .article-inline-image {
        max-height: 1000px;
    }
}

@media (max-height: 1536px) {
    .article-inline-image {
        max-height: 700px;
    }
}

@media (max-height: 1024px) {
    .article-inline-image {
        max-height: 600px;
    }
}

@media (max-height: 960px) {
    .article-inline-image {
        max-height: 500px;
    }
}
@media (max-height: 768px) {
    .article-inline-image {
        max-height: 400px;
    }
}

@media (max-height: 640px) {
    .article-inline-image {
        max-height: 300px;
    }
}
@media (max-height: 480px) {
    .article-inline-image {
        max-height: 200px;
    }
}
@media (max-height: 320px) {
    .article-inline-image {
        max-height: 100px;
    }
}

/* article-dialog.css */





.article-1 {
	max-width: 800px; margin: 0 auto; margin-top: 20px;
	oborder: 4px dashed purple !important;
}
/*.article-image-title {
	display: inline;
	oborder: 4px dashed purple !important;
}
.article-image-text {
	display: inline;
	oborder: 4px dashed purple !important;
}
.article-image-author {
	display: inline;
	oborder: 4px dashed purple !important;
}*/

.article-image-data-0 {
	position: absolute;
	bottom: 0;
	font-size: 1em;
	line-height: 1em;
	width: 100%;
	box-sizing: border-box;
	padding: 1.4em;
	padding-bottom: 0;
	margin-bottom: 2em;			/* avoid overwriting navigation */
	text-align: center;
}
.article-image-data-1 {
	background-color: white;
}
.article-image-title {
	font-weight: bold;
	font-size: 1em;
}
.article-image-text {
	font-size: 0.9em;
}
.article-image-author {
	font-weight: bold;
	font-size: 0.9em;
}

.article-with-author .article-author-container {
	display: block;
	oborder: 4px dashed purple !important;
}

.article-image-container {
	display: none;
	margin: 0 auto;
	oborder: 4px dashed purple !important;
}
.article-with-image .article-image-container {
	display: table;
	oborder: 4px dashed purple !important;
}

.article-with-subarticle .article-subarticle-container {
	display: block;
	oborder: 4px dashed purple !important;
}
.article-logo {
	float: left; margin-right: 10px; vertical-align: middle;
	max-height: 6em;
	oborder: 4px dashed purple !important;
}