
html{
    Scroll-behavior: smooth;
}
body {
    font-family: 'poppins-light'; font-size: 0.875rem; line-height: 1.2; color: #2a4155; padding: 0; margin: 0; background-color: #fff; overflow-x: hidden; width: 100%
}
a{transition: .3s all ease-in}

.container{
    max-width: 75rem; margin: 0 auto; scroll-behavior: smooth;
}

.form{
    color: #343535; text-decoration: none; scroll-behavior: smooth; padding: 0.2rem 0 0;
}

.form:hover{
    color: #1491f2;
    font-weight: bold;
}

figure{margin:0; padding: 0}

.container{
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
   
}

.aaa{
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
    -webkit-box-align: center; -webkit-flex-align: center; -ms-flex-align: center; -webkit-align-items: center; -ms-grid-row-align:center; align-items: center;
    -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;
     -moz-justify-content: center; -ms-justify-content: center;  -webkit-justify-content: center; justify-content: center;
}

.all-content{padding-top: 3rem}

#background-video{width: 115%}
.back1{position: fixed; z-index: -999; width: 100%; top: -11rem;
display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
-moz-justify-content: center; -ms-justify-content: center;  -webkit-justify-content: center; justify-content: center;}

header{background: #fff; padding: 1.3rem 0; position: fixed; z-index: 99999; width: 100%; box-shadow: 0 0 0.27rem rgb(214 138 64 / 35%); transition: .3s all ease-in; top: 0}
header .container{position: relative;
-webkit-box-align: center; -webkit-flex-align: center; -ms-flex-align: center; -webkit-align-items: center; -ms-grid-row-align:center; align-items: center;}
header .fa-chevron-down{color: #01c6fd; font-size: .6rem; transition: .3s all ease-in}

.logo{position: absolute; left: 0; top: -1.3rem}
.logo figure{width:13rem; height: 7rem; box-shadow: 0 0 0.27rem rgb(214 138 64 / 35%); border-radius: 0 0 5px 5px; background: url(../images/logo-hjp2.svg) center center no-repeat #fff; background-size: 85% auto; transition: .3s all ease-in}
.logo figure:hover{background-size: 90%}

.menu{
    margin: 0 0 0 15rem; padding: 0;
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    grid-gap: 2rem
}
.menu li{list-style: none;}
.menu li a{
    color: #0070ce; font-family: 'poppins-medium'; text-decoration: none; font-weight: 600;
}
.menu li a:hover, .menu li:hover a{color: #01c6fd}
.menu li ul{
    padding: 0; margin: 0; position: absolute; background: linear-gradient(to bottom right, #01c6fd, #0070ce); padding: 1rem; border-radius: 0 0 3px 3px; border-top: 3px solid #0070ce;
    min-width: 10rem; transition: .5s all ease-in; display: none;  cursor: pointer; box-shadow: 0 0 .7rem rgb(214 138 64 / 40%);  
}
.menu li:hover ul{display: block;}
.menu li:hover .fa-chevron-down, .lang:hover .fa-chevron-down{transform: rotate(180deg);}
.menu li ul li a{color: #fff; font-size: .75rem; font-family: 'poppins'; padding: .7rem; display: block; position: relative; z-index: 0}
.menu li:hover ul li a{color: #fff}
.menu li ul li a:hover{color: #0070ce}
.menu li ul li a:after{width: calc(100% + 2rem); height: 100%; display: block; content: ''; position: absolute; background-color: #fff; border-radius: 3px; top: 0; left: -1.5rem; z-index: -1; transition: .3s all ease-in; opacity: 0; box-shadow: 0 0 0.27rem rgb(214 138 64 / 35%);}
.menu li ul li a:hover:after{opacity: 1}
.menu li ul li a:before{width:0; height:0; display: block; content: ''; position: absolute; background-color: #ffa600; border-radius: 1px; top: 0; bottom: 0; margin: auto; left: -1rem; transition: .4s all ease-in;}
.menu li ul li a:hover:before{width: 4px; height: 4px; left: -.4rem;}
.menu li ul.two-level{
    width: 100%; left: 0; margin: 0; padding: 1rem 0; flex-wrap: wrap; 
}
.menu li ul.two-level:after{background-image: url(../images/jp2-bleu.svg); position: absolute; content: ''; display: block; width: 100%; height: 90%; bottom: 0; left: 0; background-repeat: no-repeat; background-position: bottom left; z-index: -1; opacity: .3}
.menu li:hover ul.two-level{
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
}
.menu li ul.two-level li{    
    border-right: 1px solid #01c6fd; width: 20%; box-sizing: border-box; padding: 0 .3rem
}
.menu li ul.two-level li:last-child{border: none;}
.menu li ul.two-level li ul{
    padding: 0 .3rem; margin: 0;
    display: block; width: auto; position: relative; background: none; border: none; box-shadow: none;
}
.menu li ul.two-level li ul li{border: none; width: 100%;}
.menu li ul.two-level li ul li a{padding: .3rem .7rem; font-family: 'poppins-light'; font-weight: normal;}
.menu li ul.two-level li ul li a:before, .menu li ul.two-level li ul li a:after{display: none;}
.menu li ul.two-level li ul li a:hover{color: #2a4155}

.lang span, .lang li a{
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
    -webkit-box-align: center; -webkit-flex-align: center; -ms-flex-align: center; -webkit-align-items: center; -ms-grid-row-align:center; align-items: center;
    grid-gap: .5rem; color: #2a4155
}
.lang ul{display: none; position: absolute; background-color: #fff; border-radius: 0 0 5px 5px; margin: 0; padding: .5rem; box-shadow: 0 0 .7rem rgb(214 138 64 / 40%)}
.lang ul li{list-style: none;}
.lang ul li a{text-decoration: none; color: #2a4155; border-radius: 3px; padding: .4rem}
.lang ul li a:hover{color: #fff; background-color: #01c6fd}
.lang:hover{cursor: pointer;}
.lang:hover ul{display: block;}
.lang strong{font-family: 'poppins-light'; font-weight: normal;}

.baseline{
    height: 26rem;
    width: 100%;
}
.baseline h1{
    color: #fff; margin: 0; padding: 1.2rem calc(((100% - 75rem) / 2) + 4rem) 0 7rem; position: relative; font-size: 2.4rem; text-shadow: 0 0 2.5rem rgba(0, 0, 0, 1);
}
.baseline h1 strong{font-family: 'poppins-bold'; font-weight: bolder;}
.baseline h1 span, .baseline h1 strong{display: block;}
.baseline h1:before{background: #01c6fd; width: 5rem; height: 4.5rem; border-radius: 4.5px; left: 0; top: 0; display: block; content: ''; position: absolute; box-shadow: 0 0 0.27rem rgb(214 138 64 / 35%); z-index: 0}
.baseline h1:after{background: #fe0000; width: 2rem; height: 2rem; border-radius: 3px; left: 3.5rem; top: 3rem; display: block; content: ''; position: absolute; z-index: 1; box-shadow: 0 0 0.27rem rgb(214 138 64 / 35%);}
.baseline .slick-slide{
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    justify-content: flex-end;
}
.baseline aside{padding-top: 4rem}

.slick-prev, .slick-next{border:none; background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0)); position: relative; font-size: 0; width: 10rem; cursor: pointer; position: absolute; top: 0; height: 100%; z-index: 999}
.slick-next{background: linear-gradient(to left, #fff, rgba(255, 255, 255, 0)); right: 0}
.slick-prev:before, .slick-next:before{
position: absolute; content: "\f054"; width: 2rem; height: 2rem; font-size: 2rem; top: 0; display: block; bottom: 0; margin: auto; right: 2rem; font-family: 'font-awesome'; font-size: 1.5rem;
    color: #0070ce; transition: .3s all ease-in
}
.slick-prev:before{content: "\f053"; left: 2rem; right: inherit;}
.slick-prev:hover:before, .slick-next:hover:before{color: #01c6fd}

.main-baseline{}

.search{position: relative; z-index: 9999; margin-top: -2.8rem;}
.search:after{width: calc(((100% - 75rem) / 2) + 58rem); height: 100%; background: linear-gradient(to bottom right, #01c6fd, #0070ce); border-radius: 0 5px 5px 0; box-shadow: 0 0 .7rem rgb(214 138 64 / 40%); position: absolute; top: 0; left: 0; content: ''; display: block;z-index: -1}
.search form{background: #fff; border-radius: 5px; width: 30rem; margin: 0; padding-left: .7rem; flex-wrap: wrap; box-sizing: border-box;
    -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
-webkit-box-align: center; -webkit-flex-align: center; -ms-flex-align: center; -webkit-align-items: center; -ms-grid-row-align:center; align-items: center;
}
.search .form-group{margin: 0; width: calc(100% - 9rem)}
.search .form-group input{border: none; font-family: "poppins"; height: 3rem; line-height: 3rem; padding-top: 1.5rem;}
.search .form-group label{color: #2a4155; top: 17px;}
.search .form-group label strong{font-family: "poppins-bold"; font-weight: bolder;}
.search .form-group label svg{color: #01c5fd}
.search .form-group .bar{display: none;}
.search form button{}
.search input:focus ~ label, .search input:valid ~ label{
    top: .2rem;
}

.short-container{width: 58rem; padding: 1rem 1rem 1rem 0; box-sizing: border-box;
display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
-webkit-box-align: center; -webkit-flex-align: center; -ms-flex-align: center; -webkit-align-items: center; -ms-grid-row-align:center; align-items: center;
-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
}

.main-bt{
    border:none; cursor: pointer; border-radius: 5px; color: #fff; font-family: "poppins"; padding: 1.3rem; background-color: #ffa600; grid-gap: .7rem; text-decoration: none;
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; position: relative; overflow: hidden; transition: .3s all ease-in; font-size: .875rem;
}
.main-bt:hover{box-shadow: .2rem .2rem .1rem rgba(0, 0, 0, .3)}
.main-bt span{z-index: 0}
.main-bt:before{background: rgba(255, 255, 255, 1); position: absolute; content: ''; display: block; margin: auto; width: 0rem; height: 0rem; left: 0; right: 0; bottom: 0; top: 0; z-index: 0; transition: .3s all ease-in; border-radius: 30rem}
.main-bt:hover:before{width: 30rem; height: 30rem; background: rgba(255, 255, 255, .1)}
.main-bt strong{font-family: "poppins-bold"; font-weight: bolder;}
.main-bt.red-bt{background-color: #f00001}

.sky-blue{background: #e8faff; margin-top: -2.85rem; border-bottom: 4px solid #ffa600;}
.sky-blue .container{
    padding: 6rem 0 3.7rem 0; flex-wrap: wrap; grid-gap: 2rem; align-items: flex-start; margin-bottom: -5rem;
}
.main-actu{width: calc(50% - 1rem); padding: 0 3rem; box-sizing: border-box;}
.actu{border: 3px solid #fff; box-shadow: 0 0 0.27rem rgb(214 138 64 / 35%); border-radius: 5px; background-color: #fff;}
.actu aside{position: relative; background-size: auto 100%; background-repeat: no-repeat; border-radius: 5px; height: 20rem; cursor: pointer; transition: .3s all ease-in; background-position: center}
.actu aside:hover{background-size: auto 110%}
.actu aside div{padding: 1rem 1rem .5rem 1rem; background: linear-gradient(to top, #fff, rgba(255, 255, 255, .8)); position: absolute; bottom: 0}
.actu aside div h2{margin: 0 0 .5rem 0; padding: 0; font-size: 1rem;}
.actu aside div p{margin: 0; padding: 0; }
.actu aside div a{color: #ffa600; text-decoration: none; font-family: "poppins-bold"; margin-top: 0.7rem; display: block;}
.actu aside div a:hover{color: #fe0000}
.actu .slick-prev, .actu .slick-next{
    width: 3rem;
    background: none;
}
.actu .slick-prev:before{left: -3.2rem}
.actu .slick-next:before{right: -3.2rem}
.paved{
   display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
   flex-wrap: wrap;
   grid-gap: .7rem ; width: calc(50% - 1rem)
}
.paved aside{
    background: #fff; box-shadow: 0 0 0.27rem rgb(214 138 64 / 35%); border-radius: 5px; padding: 1.5rem; width: 30%; position: relative;
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    -webkit-box-align: center; -webkit-flex-align: center; -ms-flex-align: center; -webkit-align-items: center; -ms-grid-row-align:center; align-items: center;
    -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;
    grid-gap: .7rem; box-sizing: border-box; cursor: pointer; text-align: center; overflow: hidden; transition: .3s all ease-in
}
.paved aside:hover{color: #fff; margin-top: -.4rem; margin-bottom: .4rem}
.paved aside:before{background: rgba(0, 112, 206, 0); position: absolute; content: ''; display: block; margin: auto; width: 0rem; height: 0rem; left: 0; right: 0; bottom: 0; top: 0; z-index: 0; transition: .3s all ease-in; border-radius: 30rem}
.paved aside:hover:before{width: 100%; height: 100%; background: rgba(0, 112, 206, 1); border-radius: 0}
.paved aside figure, .paved aside span{z-index: 0}
.paved figure{
    width: 4rem; height: 4rem; background-position: center; background-size: 80%; background-repeat: no-repeat;
}
.paved figure.rdv{
    background-image: url(../images/ic-phone.png)
}
.paved figure.ambulance{
    background-image: url(../images/ic-ambulance.png)
}
.paved figure.imagerie{
    background-image: url(../images/ic-imagerie.png)
}
.paved figure.baby{
    background-image: url(../images/ic-baby.png)
}
.paved figure.domicile{
    background-image: url(../images/ic-domicile.png)
}
.paved figure.offres{
    background-image: url(../images/ic-offres.png)
}

h2.big-title{
    color: #0070ce; font-size: 1.8rem; margin: 0 0 1rem 0; padding: 0;
}
h2.big-title strong{font-family: 'poppins-bold'; font-weight: bolder;}
.main-actu h2.big-title{margin-left: -3rem}

.bloc-service{
    background-color: #fff; padding: 3.5rem 0 3rem 0; 
}
.bloc-service .container{
    -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;
    -moz-justify-content: center; -ms-justify-content: center;  -webkit-justify-content: center; justify-content: center;
    -webkit-box-align: center; -webkit-flex-align: center; -ms-flex-align: center; -webkit-align-items: center; -ms-grid-row-align:center; align-items: center;
}
.bloc-service .container article{width: 100%;
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    flex-wrap: wrap;
-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.bloc-service .slick-list {
  padding: 0 0 1rem 0;
}
.bloc-service .container article aside{background: #fff; box-shadow: 0 0 0.27rem rgb(214 138 64 / 35%); border-radius: 5px; padding: 1.5rem; text-align: center; display: inline-block; box-sizing: border-box; margin: 3rem .5rem 0 .5rem;
height: 85%; transition: .3s all ease-in
}
.bloc-service .container article aside:hover{box-shadow: 0 0 0.7rem rgb(214 138 64 / 45%)}
.bloc-service .container article aside a{text-decoration: none; color: #2a4155; position: relative; }
.bloc-service .container article aside ul a{padding: .4rem; line-height: 1rem}
.bloc-service .container article aside ul a:after{content: ""; display: inline-block; position: absolute; top: .57rem; left: -3px; margin: auto; width: 4px; height: 4px; background-color: #00c6fd}
.bloc-service .container article aside a:hover{color: #ffa600}
.bloc-service .container article aside figure{
    background-color: #ffa600; width: 4rem; height: 4rem; border-radius: 3px; background-repeat: no-repeat; background-position: center; background-size: 50%;
    margin: -3rem auto 1rem auto; box-shadow: 0 0 0.27rem rgb(214 138 64 / 35%); transition: .3s all ease-in
}
.bloc-service .container article aside:hover figure{margin-top: -3.5rem; margin-bottom: 1.6rem}
.bloc-service .container article aside ul{margin: 0; padding: 0}
.bloc-service .container article aside ul li{display: inline-block; list-style: none; font-size: .73rem}

.dark-blue{
    background: linear-gradient(to bottom right, #01c6fd, #0070ce); position: relative; padding: 3rem 0 1rem 0; color: #fff; z-index: 0; border-top: 4px solid #ffa600;
}
.dark-blue:before{
    background-image: url(../images/jp2-bleu.svg); position: absolute; content: ''; display: block; width: 100%; height: 100%; bottom: 0; left: 0; background-repeat: no-repeat; background-position: top right; z-index: -1; opacity: .3; background-size: 30%; transition: .7s all ease-in
}
.dark-blue:hover:before{background-size: 32%}
.dark-blue .container{
    -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;
    -moz-justify-content: center; -ms-justify-content: center;  -webkit-justify-content: center; justify-content: center;
    -webkit-box-align: center; -webkit-flex-align: center; -ms-flex-align: center; -webkit-align-items: center; -ms-grid-row-align:center; align-items: center;
}
.dark-blue h2{color: #fff} 
.dark-blue article{
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    flex-wrap: wrap; width: 100%;
    -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
}
.dark-blue aside{
    padding: 1rem; box-sizing: border-box; font-family: 'poppins-light'; font-size: 1.3rem; font-weight: normal; position: relative; width: 25%;
}
.dark-blue aside:after{width: 1.2rem; height: 1.2rem; background-color: #0070ce; border-radius: 3px; display: block; position: absolute; content: ''; top: 0; bottom: 0; margin: auto; right: -.6rem}
.dark-blue aside:nth-child(2):after{background-color: #ffa600}
.dark-blue aside:nth-child(3):after{background-color: #f00001}
.dark-blue aside:last-child:after{display: none;}
.dark-blue aside p{text-align: center;}
.dark-blue aside strong{
    font-family: 'poppins-bold'; font-size: 2.4rem; font-weight: normal; display: block;
}

.trust{
    background-color: #fff; padding: 3rem 0
}
.trust .container{
    -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;
    -moz-justify-content: center; -ms-justify-content: center;  -webkit-justify-content: center; justify-content: center;
    -webkit-box-align: center; -webkit-flex-align: center; -ms-flex-align: center; -webkit-align-items: center; -ms-grid-row-align:center; align-items: center;
}
.trust .container article{width: 100%; margin-top: 1.5rem;}
.trust .container article figure{height: 100px; position: relative;}
.trust .container article figure img{position: absolute; height: 90%; width: auto; margin: auto; top: 0; left: 0; right: 0; bottom: 0; transition: .3s all ease-in}
.trust .container article figure:hover img{height: 100%}

.trust .slick-prev:before, .bloc-service .slick-prev:before{left: 0}
.trust .slick-next:before, .bloc-service .slick-next:before{right: 0}

.trust .slick-prev, .bloc-service .slick-prev, .trust .slick-next, .bloc-service .slick-next{width: 7rem}

.bloc-service .slick-dots{margin: 1rem 0 0 0; padding: 0; width: 100%;
display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
-moz-justify-content: center; -ms-justify-content: center;  -webkit-justify-content: center; justify-content: center;
}
.bloc-service .slick-dots li{list-style: none; margin: 0 1rem}
.bloc-service .slick-dots li button{width: 8px; height: 8px; cursor: pointer; font-size: 0px; display: block; position: relative; border-radius: 1px; background: #01c6fd; transition: .3s all ease-in; border: none;
padding: 0; margin: 0
}
.bloc-service .slick-dots li button:hover, .bloc-service .slick-dots li.slick-active button{background: #0070ce}
.bloc-service .slick-dots li.slick-active button:after{position: absolute; display: block; content: ''; width: 12px; height: 12px; top: -3px; left: -3px; background: transparent; border: 1px solid #ffa600}

footer{
    background: linear-gradient(to bottom right, #01c6fd, #0070ce); color: #fff; padding: 2rem 0; 
}
footer a{text-decoration: none;}
footer a:hover{color: #2a4155}
footer .container{
    -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;
    -webkit-box-align: center; -webkit-flex-align: center; -ms-flex-align: center; -webkit-align-items: center; -ms-grid-row-align:center; align-items: center;
}
footer .container div{
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
     -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
    padding-bottom: 1rem; border-bottom: 1px solid #01c6fd; width: 100%
}
footer .container div ul{margin-left: 0; padding-left: 0}
footer .container div ul li{list-style: none; font-size: .73rem; margin: .5rem 0; grid-gap: 0.5rem; 
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;}
footer .container aside{
    -moz-justify-content: center; -ms-justify-content: center;  -webkit-justify-content: center; justify-content: center;
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    padding-top: 2rem

}
footer a{color: #fff}

.crumb, .listing{
    background: #e8faff
}
.crumb{padding: 1rem 0 2rem 0;}
.crumb ul{
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    justify-content: flex-end;
    width: 100%; padding: 0 0 0 15rem; grid-gap: 1rem; position: relative;
}
.crumb ul:after{
    display: block; content: ''; position: absolute; width: 100%; height: 1px; right: 0; bottom: -1rem; background: linear-gradient(to left, #01c6fd, transparent); opacity: .2;
}
.crumb ul li{
    list-style: none; position: relative; color: #2a4155; font-size: .73rem
}
.crumb ul li:after{
    display: block; position: absolute; content: "\f054"; font-family: 'font-awesome'; font-size: .5rem; right: -0.7rem; top: 0.25rem; opacity: .5;
}
.crumb ul li:last-child:after{display: none;}
.crumb ul li a{
    color: #0070ce; text-decoration: none;
}
.crumb ul li a:hover{
    color: #2a4155;
}
.listing{
    padding-bottom: 6rem;
}
.listing .container{
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;
    -webkit-box-align: center; -webkit-flex-align: center; -ms-flex-align: center; -webkit-align-items: center; -ms-grid-row-align:center; align-items: center;
}
.listing section{
    display: flex; grid-gap: 1.5rem; flex-wrap: wrap;
}
.listing article{
    background: #fff; box-shadow: 0 0 0.27rem rgb(214 138 64 / 35%); border-radius: 5px; cursor: pointer; width: calc(33.3% - 1rem); transition: .3s all ease-in
}
.listing article:hover{box-shadow: 0 0 0.7rem rgb(214 138 64 / 50%)}
.listing article figure{
    height: 10rem; background-size: 100% auto; transition: .3s all ease-in; background-position: center; border-radius: 5px 5px 0 0
}
.listing article:hover figure{
    background-size: 110% auto;
}
.listing article h3, .listing article p{
    padding: 0 1.5rem;
}
.listing article p{
    margin-bottom: 1.3rem;
}
.listing article h3{
    transition: .3s all ease-in; margin: 1.5rem 0 0 0;
}
.listing article:hover h3{
    color: #ffa600
}
.listing article a{
    background: #01c6fd; color: #fff; padding: 1rem; display: block; border-radius: 0 0 5px 5px; text-decoration: none; text-align: center; font-family: 'poppins-medium';
}
.listing article a:hover{box-shadow: none; background-color: #ffa600}
.listing h2.big-title{margin-bottom: 2rem}

.contact{
    background: linear-gradient(to bottom, #01c6fd, rgba(255, 166, 0, .9)); position: relative; border-bottom: 4px solid #01c6fd; margin-top: -1px;
}
.contact:before{
    width: calc((100% - 75rem) / 2); height: 100%; background-color: #fff; left: 0; top: 0; display: block; position: absolute; content: ''
}
.contact .main-bt{background-color: #01c6fd}
.contact .container{
    flex-wrap: wrap; 
}
.contact-detail{
    width: 40%; background-color: #fff; padding: 3rem 3rem 3rem 0
}
.contact-detail ul{
    color: #0070ce; margin: 0; padding: 0
}
.contact-detail ul li{
    list-style: none; margin: .5rem 0; grid-gap: .7rem; padding-top: 0.4rem; position: relative;
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; margin-bottom: 2.5rem;
}
.contact-detail ul li:after{
    width: 4rem; height: 3px; background: #01c6fd; position: absolute; bottom: -1.3rem; left: 0; content: ''; display: block; z-index: -1;
}
.contact-detail ul li:last-child{margin-bottom: 1rem;}
.contact-detail ul li:last-child:after{
    display: none
}
.contact-detail ul li svg{
    background: #fff; box-shadow: 0 0 0.2rem rgba(0, 0, 0, .3); padding: 0.4rem; border-radius: 2rem; width: 1rem; height: 1rem; margin-top: -0.4rem;
}
.contact-detail ul li a{
    color: #0070ce; text-decoration: none;
}
.contact-form{
    width: 50%; color: #fff; padding: 3rem 0 2rem 0; 
}
.innerpage .search:before {
    width: 100%; height: 51%; background: #01c6fd; position: absolute; bottom: 0; right: 0; content: ''; display: block; z-index: -1;
}
.form-group input[type="text"], .form-group input[type="email"], .form-group input[type="password"], .form-group input[type="date"], .form-group input[type="file"], .form-group select, .form-group textarea{
    border: none; border-bottom: 1px solid rgba(255, 255, 255, .4); border-radius: 0px; color: #fff; font-family:'poppins'; line-height: 1.2rem;
}
.form-group label svg{
    margin-right: .4rem
}
.more-details section{
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    flex-wrap: wrap;
    -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
}
.more-details section figure{
    width: 20rem; position: relative; z-index: 0
}
.more-details section figure:after{
    display: block; content: ''; position: absolute; width: 20rem; height: 16.5rem; right: -2rem; top: -2rem; background: #ffa600; border-radius: 5px; z-index: -1;
}
.more-details section img{
    width: 100%; border: 3px solid #fff; box-shadow: 0 0 0.27rem rgb(214 138 64 / 35%); border-radius: 5px; height: auto
}
.more-details section div{
    width: calc(100% - 24rem); text-align: justify;
}
.more-details .container{
    position: relative;
}
.more-details .container:after{
    display: block; content: ''; position: absolute; width: 100%; height: 1px; right: 0; bottom: -3rem; background: linear-gradient(to left, #01c6fd, transparent); opacity: .2;
}
.more-details section div::first-letter{
    font-size: 4rem; font-weight: bold; color: #fe0000; display: inline-block; float: left; margin-right: .7rem; margin-top: -.7rem
}
.more-details.presentation section div{
    width: 100%; 
}
.more-details.presentation section div section{
     display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;  
    flex-wrap: wrap; 
}
.more-details.presentation section div section img{
    width: 45%;
}





