/*
Theme Name: 	Blogus Child
Description: Child of blogus theme https://docs.themeansar.com/docs/blogus/
Author: Themeansar
Author URI: https://themeansar.com
Template: 	blogus
Version: 1.0.0.79
*/

/* form contact */
.grid-inputs {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 15px 33px;
}

.field-group input {
    border: 1px solid #888f95;
    border-radius: 8px;
    height: 56px;
    font-size: 16px;
}

.wpcf7-textarea {
    border-radius: 8px;
    border-width: 1px;
}

.field-group input::-ms-input-placeholder { /* Edge 12-18 */
color: #666;
}

.field-group input::placeholder {
color: #666;
}

.wpcf7-not-valid-tip {
    font-size: 14px;
}

.btn-contact input.wpcf7-form-control.wpcf7-submit {
    width: 100%;
    border-radius: 8px;
    font-size: 20px;
    font-weight: 700;
}


.wpcf7 form .wpcf7-response-output {
		display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 12px;
    box-shadow: 0px 8px 24px 0px rgba(81, 68, 149, 0.21);
    color: #fff;
    font-size: 16px;
    text-align: center;
    min-height: 90px;
    width: 370px;
    border-width: 0 0px 10px 0;
    padding: 10px;
    position: fixed;
    top: 0px;
    right: 15px;
	opacity:1;
	animation: hide 25s forwards;
	   z-index: 9;
		background-color: transparent;
 		background: var(--Gradient-2, linear-gradient(97deg, rgba(23, 88, 201, 1) 0.39%, rgba(72, 177, 221, 1) 43.04%, rgba(114, 200, 247, 1) 100.12%));
}

@keyframes hide {
from {opacity: 1;}
to {opacity: 0;}
}

.wpcf7-spinner {
    display: block;
    margin: 10px auto;
}


/***/

/* fixed btn */

.fixed-btn {
    background: #cfecfc;
    display: flex;
	flex-direction: column;
	align-items:center;
    position: fixed;
    right: 0;
    bottom: 50%;
	border-radius: 10px 0 0 10px;
	padding:10px;
}

.fixed-btn p {
    color: #000;
    font-size: 12px;
    margin: 0;
    font-weight: 700;
}

/**** table of contents ***/
#ez-toc-container{
		margin-top:30px;
	-webkit-box-shadow: 0 15px 30px rgba(27, 44, 92, .1);
    box-shadow: 0 15px 30px rgba(27, 44, 92, .1);
    border-radius: 10px;
    border: none !important;
		padding:0;
}

#ez-toc-container .ez-toc-js-icon-con{
	border:none !important;
}

.ez-toc-btn:before{
		position:absolute;
		content:'';
		inset:0;
}

 #ez-toc-container .ez-toc-title-container {
    padding: 10px 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    min-height: 43px;
}


#ez-toc-container nav>ul {
    padding: 0 1em 1em!important;
}



 #ez-toc-container .ez-toc-page-1 {
    border-top: 1px solid rgba(28, 30, 83,.1);
	 border-radius:10px;
}

 #ez-toc-container .ez-toc-list .ez-toc-link {
    position: relative;
		 display:block;
		 text-decoration:none;
		 -webkit-transition: padding-left .3s ease-in-out, color .3s ease-in-out;
    transition: padding-left .3s ease-in-out, color .3s ease-in-out;
}

 #ez-toc-container .ez-toc-list .ez-toc-link::before {
    content: " ";
    position: absolute;
    inset: 0;
    background: linear-gradient(85.82deg,rgba(114, 200, 247,.1) 1.61%, rgba(246, 199, 180,.8) 98.82%);
    width: 0;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    -webkit-transition: width .3s ease-in-out;
    transition: width .3s ease-in-out;
	 border-radius:10px;
}

#ez-toc-container .ez-toc-link:hover::before {
    width: 100%;
}

#ez-toc-container .ez-toc-link:hover{
color:black;
}

#ez-toc-container .ez-toc-page-1{
	background:url('/wp-content/uploads/2024/07/rocket-black-svg.svg') no-repeat left;
}

/*******************/

/* sidebar article */
.bs-sidebar .bs-widget{
	box-shadow: none;
}
.sidebar-wrapper {
    position: relative;
    text-align: center;
    background-color: #011A33;
    color: #fff;
    border-radius: 8px;
    padding: 20px;
	margin-bottom:15px;
}
.sidebar-wrapper h4 {
    color: #fff;
    font-weight: 500;
    font-size: 22px;
    margin-bottom: 10px;
}

.sidebar-wrapper p {
    color: #fff;
}

.btn-sidebarbanner {
    position: relative;
    color: #011A33;
    background: #fff;
    border-radius: 10px;
    display: table;
    margin: 0 auto;
    padding: 10px 27px;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    transition: all 0.5s;
}

.btn-sidebarbanner:hover{
	color:#fff;
	background:#62C2F6;
}

h4.title-social-share {
    text-align: center;
}

.post-share-icons {
    padding: 10px 0;
    border:none;
    margin-top: 0px;
}

/*  footer article */
.banner-wrapper{
	display: flex;
    flex-direction: column;
    gap: 20px;
	margin:25px 0;
	position:relative;
	padding:30px 20px;
	text-align:center;
    border-radius: 20px;
    background: linear-gradient(103deg, rgba(246, 199, 180, 0.50) 0.36%, rgba(251, 213, 141, 0.50) 99.28%);
}
.banner-wrapper:before{
	position:absolute;
	content:'';
	top:30px;
	left:100px;
	background:url('/wp-content/uploads/2024/06/icon-banner-1.png') no-repeat;
	width:79px;
	height:79px;
	
}

.banner-wrapper:after{
	position:absolute;
	content:'';
	bottom:30px;
	right:100px;
	background:url('/wp-content/uploads/2024/06/icon-banner-2.png') no-repeat;
	width:77px;
	height:77px;
	
}

.banner-wrapper h4 {
    font-size: 40px;
    max-width: 500px;
    margin: 0 auto;
    font-weight: 900;
    font-family: 'Work Sans',sans-serif;
}

.banner-wrapper p{
	color:#000000;
}

a.btn-banner {
    background: white;
    padding: 10px 20px;
    border-radius: 8px;
    color: #72C8F7;
    font-weight: 700;
    font-size: 18px;
    display: table;
    margin: 0 auto;
	cursor:pointer;
}
a.btn-banner:hover{
	background:#72C8F7;
	color: white;
}

.box-wrapper {
    display: flex;
	gap:50px;
    justify-content: center;
    align-items: center;
    background: var(--Gradient-2, linear-gradient(97deg, rgba(23, 88, 201, 0.40) 0.39%, rgba(72, 177, 221, 0.40) 43.04%, rgba(114, 200, 247, 0.40) 100.12%));
    border-radius: 20px;
    padding: 40px 30px;
}

.box-text {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.box-text h4{
	position:relative;
	font-size: 45px;
    font-weight: 900;
    font-family: 'Work Sans',sans-serif;
	padding-bottom:35px;
}

.box-text h4:before{
	position:absolute;
	content:'';
	bottom:0;
	left:0;
	background:url('/wp-content/uploads/2024/07/Vector-1.svg') no-repeat;
	width:306px;
	height:22px;
}

.box-text p{
	font-size:18px;
}

/*  */


/*    Logo header     */
.bs-default .navbar-brand img {
    width: auto !important;
    height: auto !important;
    object-fit: contain;
}

.bs-default .navbar-brand {
    place-content: center;
}

/* Ville Page  https://blog.toog-app.com/ville/ */

.container-ville {
    display: flex;
    flex-flow: row wrap;
    gap: 1rem;
    justify-content: center;
    align-items: start;
}

.container-ville>div {
    position: relative;
    overflow: hidden;
}

.container-ville>div>a {
    position: absolute;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-weight: bold;
    font-size: 1.5rem;


}



.container-ville>div>img {
    border-radius: 1rem;
    display:block;
    filter: grayscale(100%);
    transition: filter .5s ease;

}

.container-ville>div:hover>img {
    filter: grayscale(0%);
}



/* General */
.title {
font-size:1.7rem;
}

/* Menu */
#navbar-wp  ul {
width:100%;
border-radius:1rem;
}
#menu-blogus-menu li a.nav-link {
color:white;
}
#menu-blogus-menu li a.nav-link::after{
content: '';
width: 0px;
height: 2px;
display: block;
background: white;
transition: 300ms;

}
#menu-blogus-menu li a.nav-link:hover::after{
width:100%;
}
/* Menu icons */
#custom-background-css > header > div.bs-header-main.d-none.d-lg-block > div > div > div > div:nth-child(3) > div > a, #custom-background-css > header > div.bs-header-main.d-none.d-lg-block > div > div > div > div:nth-child(3) > div > label > span::before {
background: #011a33;
}

/* searchbar active */
div.modal-header > button, div.modal-body > form > input {
background: #011a33;
}
div.modal-header > button:hover, div.modal-body > form > input:hover  {
background: #003566;
opacity:1;
}
/* breadcrumb */
.bs-breadcrumb-section .overlay {
border-radius:8px;
}

#content > div > div > div.bs-breadcrumb-section > div > div > div > nav > ol > span > span:nth-child(1) > a:hover {
color: #011A33;	
}

/* home article */

.wp-block-faq-block-for-gutenberg-faq{
	border-radius:10px;
	background-color:#cfecfc !important;
}


.bs-blog-post {
border-radius:1rem;
}


article > div.bs-blog-meta > span.bs-blog-date >  a:hover, article > div.bs-blog-meta > span.bs-blog-date >  a:focus {
		color:#011A33;

}
article.small {
min-height: 26rem;
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-evenly;
}
.bs-blog-thumb.lg {
	height:17rem;
}

article.small h2.title > a::after, article.bs-posts-sec-post h2.title > a::after {    
content: '';
width: 0px;
margin-top: .5rem;
height: 2px;
display: block;
background: #011A33;
transition: 300ms;
}

article.small h2.title > a:hover::after,article.bs-posts-sec-post h2.title > a:hover::after{
width: 100%;

}
article.small > div.bs-blog-category > a.blogus-categories.category-color-1, article.small > div.bs-blog-category > a.blogus-categories.category-color-2, article.small > div.bs-blog-category > a.blogus-categories.category-color-3, article.small > div.bs-blog-category > a.blogus-categories.category-color-4,	article > div > div.bs-blog-category > a.blogus-categories.category-color-4, article > div > div.bs-blog-category > a.blogus-categories.category-color-3, article > div > div.bs-blog-category > a.blogus-categories.category-color-2,article > div > div.bs-blog-category > a.blogus-categories.category-color-1,
div.bs-blog-category > a.blogus-categories.category-color-4, div.bs-blog-category > a.blogus-categories.category-color-3, div.bs-blog-category > a.blogus-categories.category-color-2, div.bs-blog-category > a.blogus-categories.category-color-1 {
border-radius:1rem;
}


article.small > div.bs-blog-category > a.blogus-categories.category-color-1:hover, article.small > div.bs-blog-category > a.blogus-categories.category-color-2:hover, article.small > div.bs-blog-category > a.blogus-categories.category-color-3:hover, article.small > div.bs-blog-category > a.blogus-categories.category-color-4:hover, article > div > div.bs-blog-category > a.blogus-categories.category-color-4:hover, article > div > div.bs-blog-category > a.blogus-categories.category-color-3:hover, article > div > div.bs-blog-category > a.blogus-categories.category-color-2:hover, article > div > div.bs-blog-category > a.blogus-categories.category-color-1:hover,
div.bs-blog-category > a.blogus-categories.category-color-4:hover, div.bs-blog-category > a.blogus-categories.category-color-3:hover, div.bs-blog-category > a.blogus-categories.category-color-2:hover, div.bs-blog-category > a.blogus-categories.category-color-1:hover{
background-color: transparent;
}
article.small > div.bs-blog-category > a.blogus-categories.category-color-1:hover,  a.blogus-categories.category-color-1:hover, div.bs-blog-category > a.blogus-categories.category-color-1:hover {
box-shadow: inset 0px 0px 0px 1px #62C2F6;	
color: #62C2F6;
}

article.small > div.bs-blog-category > a.blogus-categories.category-color-2:hover,  a.blogus-categories.category-color-2:hover, div.bs-blog-category > a.blogus-categories.category-color-2:hover {
box-shadow: inset 0px 0px 0px 1px #feb236;	
color: #feb236;
}

article.small > div.bs-blog-category > a.blogus-categories.category-color-4:hover,  a.blogus-categories.category-color-4:hover, div.bs-blog-category > a.blogus-categories.category-color-4:hover {
box-shadow: inset 0px 0px 0px 1px #F5C1AB;	
color: #F5C1AB;
}

article.small > div.bs-blog-category > a.blogus-categories.category-color-3:hover, a.blogus-categories.category-color-3:hover, div.bs-blog-category > a.blogus-categories.category-color-3:hover{
	box-shadow: inset 0px 0px 0px 1px #622569;	
	color: #622569;
}

/* Btn Lire plus / read more */
.custom-readmore-btn {
border: none;
text-align: center;
font-weight: 600;
border-radius: 40px;
color: rgb(255, 255, 255);
background: linear-gradient(93deg, #72C8F7 0%, #F6C7B4 61.33%, #FBD58D 100%);
padding: 0.5rem 1rem;
display:block;
max-width:40%;
min-width:fit-content;
margin-top:1.5rem;

}
.custom-readmore-btn:hover  {
color: white;
transform: translatey(.3rem);

}
/************************/
/*       hover article */
/************************/
.bs-blog-post .title a:hover, .bs-blog-post .title a:focus, .bs-blog-post .title a:hover, .bs-blog-post .title a:focus {
color: #b7e0f8!important;

}



/* navlinks pagination  */
.navigation.pagination .nav-links .page-numbers.current, .navigation.pagination .nav-links .page-numbers.current, .navigation.pagination .nav-links a:hover, a.error-btn, .post-nav-links a { 
background-color: #011A33!important;
}
/************************/
/*      Article Page    */
/************************/
article.small.single > figure.wp-block-image > img {
	margin:0 auto;
	display:block;
}
  
 /*Table of content*/
article > div.wp-block-yoast-seo-table-of-contents.yoast-table-of-contents {
		min-width:fit-content;
    width: 50%;
    background-color: #011A33;
    border-radius: 1rem;
    padding: 2rem;
    margin: 2rem 0;
    transition: 200ms;


}


article > div.wp-block-yoast-seo-table-of-contents.yoast-table-of-contents:hover {
	box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
 

}

article > div.wp-block-yoast-seo-table-of-contents.yoast-table-of-contents h2 {
	    border-bottom: 1px solid white;
	    color:white;
	    margin-bottom: 1.5rem;
}

article > div.wp-block-yoast-seo-table-of-contents.yoast-table-of-contents li  {
	    margin:.5rem;
	list-style: url('https://blog.toog-app.com/wp-content/uploads/2024/03/rocket-white.svg');

}

article > div.wp-block-yoast-seo-table-of-contents.yoast-table-of-contents li > a {
	    color:white;
}
article > div.wp-block-yoast-seo-table-of-contents.yoast-table-of-contents li > a:hover {
	    color:#B7E0F8;
}

div .bs-blog-post.single {
box-shadow: var(--bxsh);

}
#content > div > div > div.col-lg-12 > div.bs-blog-post.single > div > div > div > span > a:hover {
color:#011A33;
}

div.bs-blog-post.single > article img {
	border-radius:1rem;
}
.featured-image-caption {
	display:none;
}

.bs-blog-post .bs-blog-thumb img {
	border-radius: 1rem;
    margin: 0 auto;
    display: block;
}

div.bs-blog-post.single > article > figure > img {
    width: 48rem;
	height:24rem;
    object-fit: cover;
}

@media (max-width: 760px) {
	div.bs-blog-post.single > article > figure > img {
	height:auto;}
}

/*********************************/
/* bouton réserver dans article */
/********************************/
.has-text-align-center.custom-btn-reserver {
	    margin: 0 auto;
}
.custom-btn-reserver {
	color:#ffffff;
}
.custom-btn-reserver a {
border: none;
text-align: center;
font-weight: 600;
border-radius: 40px;
color: #ffffff;
background: linear-gradient(93deg, #72C8F7 0%, #F6C7B4 61.33%, #FBD58D 100%);
padding: 0.5rem 1rem;
display: block;
max-width: 20%;
min-width: fit-content;
margin: 1.5rem 0;

}
.custom-btn-reserver:hover {
transform:translatey(.3rem);
}

.custom-btn-reserver:hover a {
color: #ffffff;
}

/************************/
/* icon up to nav      */
/************************/

.bs_upscr {
background: #011A33!important;
border-color:#011A33!important;
}
/************************/
/* footer               */
/************************/
footer .container > .row >div {
width:25%!important;
}

.bs-footer-bottom-area {
display:none;
}
/************************/
/* Footer > communauté */
/************************/
.custom-footer-layout p{
	font-weight:700;
	font-size:18px;
}
.custom-footer-layout a{
	color:#888F95 !important;
}

.custom-footer-layout a:hover{
	color:#72c8f7 !important;
}

.custom-footer-layout img {
    margin-bottom: 50px;
}

.footer-social a {
    margin: 0 5px;
    font-size: 20px;
    color: #000 !important;
}

/**  responsive tablet **/
@media only screen and (max-width: 1200px) {
	.box-wrapper {
    flex-direction: column;
	}
	.grid-inputs {
    grid-template-columns: 1fr;
	}
	.box-wrapper img {
    width: 100%;
	}
	
	footer .container > .row >div {
    width: 50%!important;
    text-align: center;
	}
	.custom-footer-layout img {
    width: auto;
	}

}


/**  responsive mobile **/
@media only screen and (max-width: 768px) {
	.box-wrapper {
    flex-direction: column;
	}
	.grid-inputs {
    grid-template-columns: 1fr;
	}
	.box-wrapper img {
    width: 100%;
	}
	
	footer .container > .row >div {
    width: 100%!important;
    text-align: center;
	}

}