/*general*/
@import url('https://fonts.googleapis.com/css?family=Macondo');

@import url('https://fonts.googleapis.com/css?family=Princess+Sofia');

body{
	position: relative;
	background-image : url(../img/imgSite/background.jpeg);
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size : 100% 100%;
	font-family: 'Macondo', cursive;
}

#content-wrap .container-fluid,
#content-wrap .container{
	padding : 60px  0px  0px  0px;
}

.row {
	margin-right : 0px;
	margin-left : 0px;
}

/*menu*/
#menu.container-fluid{
	padding : 0px;
}

#menu .navbar-brand,
aside h4,
.titre-galerie-news,
#headerNews h3,
#headerGallerys h3
{
	font-family: 'Princess Sofia', cursive;
}

aside h4
{
	color : #A34034;
}

.navbar-brand img{
	width : 38px;
}

/*acueuil*/
#carouselPresentation,
#carouselNews,
#carouselGallery{
	width : 100%;
}

#carouselPresentation{
	background-image : radial-gradient(circle at top right, #343A40, black 40%);
	font-size : 1.1em;
}

#carouselPresentation .carousel-m-caption{
	top : 0px;
	color : #A34034;
	text-shadow: 1px 1px 1px #aaa;
}

/*news
 * */
#carouselNews,
#carouselGallery{
	background : rgba(250, 250, 250, .7);
}

#headerNews,
#headerGallerys{
	text-shadow : 2px 2px 1px #545A60;
	background :  radial-gradient(circle at top right, #343A40, black 80%);
}

.card{
	overflow : hidden;
	box-shadow : 4px 6px 8px #343A40;
	transition: box-shadow 0.3s ease-in-out;
}

a.card:hover{
	box-shadow : 8px 10px 10px #343A40;
}

#carouselNews .card,
#carouselGallery .card{
	width: 18rem;
	height : 330px;
	text-align : center;
	text-decoration: none;
}

#carouselNews .card h5,
#carouselGallery .card h5{
	color : #A34034;
}

#carouselNews .card-img-top{
	max-height : 150px;
}

#carouselGallery .card-header{
	height : 150px;
	perspective: 950px;
	perspective-origin: right;
}

#carouselGallery .card-header .imgsCard{
	width : 150px;
	height : 120px;
	
	background : #000;
	background-size : contain;
	background-repeat : no-repeat;
	background-position : center;
	
	margin-right : -3rem;
	margin-left : -3rem;
	
	transform : rotateY(50deg);
	
}

.container>article,
.container>div,
.container>form,
.container>aside>div,
.contact>div,
.contact>form{
	background : rgba(250, 250, 250, .7);
}

@media (min-width: 992px) {
	.container aside{
		width: 16.8%;
		position : absolute;
		right : 5px;
		top : 60px;
	}
	
	#folder{
		position : fixed;
	}
	
}



/*éditeur wysiwyg*/
.myWidget-wysiwyg{
	padding : 0px;
	display : flex;
	flex-direction: column;
}

.wysiwyg-comandes{
	padding : 5px 0px;
	display : flex;
	flex-wrap: wrap;
	
	font-weight : 600;
}

.wysiwyg-comandes input,
.wysiwyg-comandes button,
.wysiwyg-comandes .ui-selectmenu-button{
	height : 37px;
}

.wysiwyg-editor{
	min-height : 300px;
	flex: 1;
}

.wysiwyg-editor textarea{
	min-height : 290px;
}

.wysiwyg-textEditor{
	border : 0;
	flex: 1;
}

/*dropLoad*/
#nav-tabsFiles{
	height : 500px;
	overflow : auto;
}

#tab-video,
#tab-img{
	height : 100%
}

#nav-tabsFiles img,
#nav-tabsFiles video{
	width : 130px;
	margin : 5px;
}

/*édituer de galerie*/
#galerieField{
	min-height : 300px;
	list-style-type: none;
}

#galerieField img{
	max-width : 300px;
	max-height : 300px;
}

#galerieField li{
	background : #000;
	width : 300px;
	height : 300px;
	cursor : grab;
}

#galerieField .close{
	position : absolute;
	top : 2px;
	right : 2px;
	width : 24px;
	height : 24px;
}

.voile{
	background : rgba(50, 50, 50, .5);
}

.voile:focus{
	background : rgba(50, 50, 50, .5);
}

/*galerie*/
.galerie{
	perspective: 950px;
	perspective-origin: center;
}

@keyframes viewCard {

    25% {
        transform: rotateY(15deg) translateZ(25px) translateX(-110px) scale(1);
    }
    
    50%{
		z-index : 1000;
    }

    100% {

        transform: rotateY(0deg) translateZ(300px) translateX(-30px) scale(1.2);
		box-shadow : 10px 15px 30px #343A40;

		z-index : 1000;

    }

}

.galerie .card{
	width : 18rem;
	height : 20rem;
	background : #000;
	background-size : contain;
	background-repeat : no-repeat;
	background-position : center;
	
	margin-right : -4rem;
	margin-left : -2rem;
	
	transform : rotateY(20deg);
	
	cursor : pointer;
}

.galerie .card:hover{
	animation : viewCard 2.3s ease-out forwards alternate;
}

.galerie .card .rounded{
	color : #ddd;
}

#galerieModal .modal-dialog{
	max-width : 90%;
}

#carouselGalerie .carousel-item{
	background-image : radial-gradient(circle at top right, #343A40, black 40%);
}

#carouselGalerie .carousel-item img{
	margin : auto;
}

.voile{
	background : rgba(50, 50, 50, .5);
}

.voile:focus{
	background : rgba(50, 50, 50, .5);
}

#formContact #message{
	min-height : 270px;
}

.date-news{
	right : 10px;
}


/*icon*/
.icon{
	width: 24px;
	height: 24px;
	display : inline-block;
}

.icon-add{
	mask: url(../img/icon/ic_add_circle_24px.svg) no-repeat;
}

.icon-edit{
	mask: url(../img/icon/ic_mode_edit_24px.svg) no-repeat;
}

.icon-bold{
	mask: url(../img/icon/ic_format_bold_24px.svg) no-repeat;
}

.icon-italic{
	mask: url(../img/icon/ic_format_italic_24px.svg) no-repeat;
}

.icon-underlined{
	mask: url(../img/icon/ic_format_underlined_24px.svg) no-repeat;
}

.icon-strikethrough{
	mask: url(../img/icon/ic_strikethrough_s_24px.svg) no-repeat;
}

.icon-indice{
	mask: url(../img/icon/ic_indice_24px.svg) no-repeat;
}

.icon-exposant{
	mask: url(../img/icon/ic_exposant_24px.svg) no-repeat;
}

.icon-list-bulleted{
	mask: url(../img/icon/ic_format_list_bulleted_24px.svg) no-repeat;
}

.icon-list-numbered{
	mask: url(../img/icon/ic_format_list_numbered_24px.svg) no-repeat;
}

.icon-indent-increase{
	mask: url(../img/icon/ic_format_indent_increase_24px.svg) no-repeat;
}

.icon-indent-decrease{
	mask: url(../img/icon/ic_format_indent_decrease_24px.svg) no-repeat;
}

.icon-title{
	mask: url(../img/icon/ic_title_24px.svg) no-repeat;
}

.icon-size{
	mask: url(../img/icon/ic_format_size_24px.svg) no-repeat;
}

.icon-link{
	mask: url(../img/icon/ic_insert_link_24px.svg) no-repeat;
}

.icon-photo{
	mask: url(../img/icon/ic_insert_photo_24px.svg) no-repeat;
}

.icon-movie{
	mask: url(../img/icon/ic_movie_24px.svg) no-repeat;
}

.icon-print{
	mask: url(../img/icon/ic_print_24px.svg) no-repeat;
}

.icon-code{
	mask: url(../img/icon/ic_code_24px.svg) no-repeat;
}

.icon-visibility{
	mask: url(../img/icon/ic_visibility_24px.svg) no-repeat;
}

.icon-justifyleft{
	mask: url(../img/icon/ic_format_align_left_24px.svg) no-repeat;
}

.icon-justifycenter{
	mask: url(../img/icon/ic_format_align_center_24px.svg) no-repeat;
}

.icon-justifyright{
	mask: url(../img/icon/ic_format_align_right_24px.svg) no-repeat;
}

.icon-justifyfull{
	mask: url(../img/icon/ic_format_align_justify_24px.svg) no-repeat;
}

.icon-warning{
	mask: url(../img/icon/ic_warning.svg) no-repeat center;
	mask-size:  20px 20px;
}

.icon-trash{
	mask: url(../img/icon/ic_trash.svg) no-repeat center;
	mask-size:  20px 20px;
}

.icon-undo{
	mask: url(../img/icon/ic_undo.svg) no-repeat;
	mask-size:  24px 24px;
}

.icon-checkmark{
	mask: url(../img/icon/ic_checkmark.svg) no-repeat;
}

.icon-facebook{
	mask: url(../img/icon/ic_facebook.svg) no-repeat;
	mask-size:  24px 24px;
	background : #4267b2;
}