/*Grid*/
.boxgrid{
display: grid;
grid-template-columns: 1fr 0.3fr;
grid-template-areas:'boxgrid_left boxgrid_right' 
                    ; 
}

.boxgrid_left{
    grid-area: boxgrid_left;
}

.boxgrid_right{
    grid-area: boxgrid_right;
}

/*Hero*/

.containerhero { /*picture hero*/
    display: flex;
    flex-direction: column;
    background-image:url("../media/imagesevents/inner-banner-bg-1-1.jpg");
    background-repeat: no-repeat;
    height: 420px; 
    background-position:center;
    background-size: cover;
    align-items: center;
    justify-content: center;
    color: white;
}

.containerhero--picture_title{ /*Titre hero*/
    color: white;
    margin-top: 50px;
}

.containerhero--picture_info{ /*Text hero*/
    display: flex;
    width: 350px;
    padding: 40px;
    padding: 10px 10px 10px 10px;
    border: 0.5px;
    border-style: solid none none none;
    border-color: #e4e4e4;
    margin-right: auto;
    margin-left: auto;
    align-items: center;
    justify-content: center;
    font-weight: 600;
}

.containerhero--picture_info_line{
    border: 0.5px;
    border-style: none solid none none;
    border-color: #e4e4e4;
}


/*NAV*/
.click--select{
    display: flex;
    margin: 5% 20%;
    background-color: white;
    border-radius: 3px;
    text-align: center;
    width: 690px;
}

.click--select_box1{
    background-color: white;
    border: 0.5px;
    height: 40px;
    width: 150px;
    border: 0.5px;
    border-style: solid solid solid none;
    border-color: #e4e4e4;

    font-weight: 100;
    text-align: center;

    padding: 10px 10px;
}

.click--select_box2{
    background-color: white;
    border: 0.5px;
    align-items: center;
    height: 40px;
    width: 150px;
    border: 0.5px;
    border-style: solid solid solid none;
    border-color: #e4e4e4;

    font-weight: 100;
    text-align: center;

    padding: 10px 10px;
}

.click--select_box3{
    background-color: white;
    border: 0.5px;
    align-items: center;
    justify-content: center;
    height: 40px;
    width: 150px;
    border: 0.5px;
    border-style: solid solid solid none;
    border-color: #e4e4e4;

    font-weight: 100;
    text-align: center;

    padding: 10px 10px;

}

.click--select_box4{
    background-color: white;
    border: 0.5px;
    align-items: center;
    height: 40px;
    width: 150px;
    border: 0.5px;
    border-style: solid none solid none;
    border-color: #e4e4e4;

    font-weight: 100;
    text-align: center;

    padding: 10px 10px;
}

.click--select_box_text{
    background-color: white;
}

.click--select_button {
    padding: 2px 2px;
    position: relative;
    background-color:#302e2f;
    color: white;
    border: 0.5px solid #302e2f;
    border-radius: 3px;
    margin: 0px 0px 0px 15px;
}

/*TEXT AND PICTURE EGYPT*/

.containerinfo{
    display: flex;
    /* flex-wrap: wrap; */
    justify-content: space-between;
    background-color: #302e2f;
    width: 690px;
    margin-left: 20%;
}

.text{
    width: 230px;
    padding: 20px 20px;
}

.text h3 {
    color:#e4e4e4;
}

.text_white{
    color: white;
}

.text_pictureegypt{
    /* margin: 0px 0px 15px 0px;  */
    background-image:url("../media/imageseventsdetails/event-d-1-1.jpg");
    background-repeat: no-repeat;
    /* background-size: 400px; */
    background-position: right;
    vertical-align:right;
    width: 400px;
}

/*hr et icones*/

.text_ligne {
    border: 0,1em solid  #abadb0;
}

.text_icone {
    color: #d99578;
}

.flex--picture--text_arrow {
    color: #d99578;
}

/* FORM */

.containerform{
    width: 90%;
    height: 600px;
    padding: 20px 20px;
    color: #abadb0;
    margin-left: -90%; /*@media*/
    margin-top: 50px;
}

.message { 
    background-color: #302e2f;
    border-radius: 5px;
    padding: 25px 25px 25px 25px;
}

.message--box_textone h2{ /*Title*/
    color: #e4e4e4;
    border-radius: 3px;
    text-align: left;
    font-size: 2em;
    font-weight: 900;
}

.message--box_texttwo{ /*Name*/
    height: 50px;
    width:90%;
    margin: 15px 15px;
    background-color: #302e2f;
    border: 0.5px solid  gray;
    color: #e4e4e4;
    border-radius: 3px;
    text-align: center;
}

.message--box_texthree{ /*EMAIL*/
    height: 50px;
    width:90%;
    margin: 15px 15px;
    background-color: #302e2f;
    border: 0.5px solid  gray;
    color: #e4e4e4;
    border-radius: 3px;
    text-align: center;
}

.message--box_flex{ /*NUMBER + CHILDREN FLEX*/
    height: 50px;
    border: none;
    display: flex;
    margin: 15px 15px;
}

.message--box_flex_textfour{ /*NUMBER + -*/
    height: 50px;
    width: 50%;
    margin-right: 25px;
    background-color: #302e2f;
    border: 0.5px solid  gray;
    color: #e4e4e4;
    border-radius: 3px;
}

.message--box_flex_textfive{ /*CHILDREN*/
    height: 50px;
    width: 50%;
    background-color: #302e2f;
    border: 0.5px solid  gray;
    color: gray;
    border-radius: 3px;
    font-size: 1.5em;
    text-align: center;
}

.message--box_textsix{ /*Message*/
    width:90%;
    height: 100px;
    margin: 15px 15px;
    background-color: #302e2f;
    border: 0.5px solid  gray;
    color: #e4e4e4;
    border-radius: 3px;
}

.message--box_textseven{ /*BUTTON*/
    width:90%;
    margin: 15px 15px;
    background-color: #D99578;
    border: 0.5px solid #D99578;;
    color: white;
    border-radius: 5px;
    padding: 13px 13px;
}

/*TEXT ABOUT EVENT*/

.detailsevent{
    width: 690px;
    margin: 5% 20%;
    font-size: 1.3em;
}

/*TEXT SCHEDULE*/

.textdetailstitle{
    width: 690px;
    margin: 0% 20%;   
}

.textdetails{
   display: flex;
   align-content: center;
   align-items: center;
    margin: 0% 20%;
    width: 690px;
    padding: 10px 0px;
}

.textdetails_hours {
    display: flex;
    flex-direction: column;
    font-size: 1.3em;
}

.textdetails_expo{
    display: flex;
    flex-direction: column;   
    font-size: 1.3em; 
}

.textdetails_hours_ampm{
    margin: 35px 0px;
    padding: 20px 20px;
    border-color:#abadb0;
    border-style: none solid none none;
    border-right-width: thin;
}

.textdetails_expo_jap{
    padding: 40px 20px;
}

.textdetails_expo_jap_title{
    margin: 0px 0px 10px 0px;
}

/*GALLERY & CONTACT & MAP ----> FLEX*/

.titlegallery{
    width: 690px;
    margin: 0% 20%; 
    padding: 0px 0px 20px;
}

.gallery{
    display: flex;
    width: 690px;
    margin: 0% 20%;   
}

.gallery_columone{
    display: flex;
    flex-direction: column;
    padding: 0px 45px 0px 0px;
}


.gallery_columtwo{
    display: flex;
    flex-direction: column;
    padding: 0px 0px 0px 0px;
}

.gallery_columone_contact{
    padding: 45px 0px 0px 0px;
    font-size: 1.3em;
}

.gallery_columone_one{
    padding: 0px 0px 45px 0px;
}

.gallery_columone_three{
    padding: 0px 0px 45px 0px;
}

.gallery_columtwo_geo{
    margin: 45px 0px 0px 0px;
    border: none;
    height: 30%;
}

/*ARROW BOTTOM*/

.arrowbox{
    display: flex;
    margin: 5% 20%;
}

.arrowbox_left{
    margin: 0% 35% 0% 0%;
    text-align: left;
}

.arrowbox_right{
    text-align: right;
}

.arrowbox_arrowone{
    width: 50px;
    rotate: 90deg;
}

.arrowbox_left_gray{
    color:gray;
}

.arrowbox_right_gray{
    color:gray;
}

/*font*/

@font-face {
    font-family: 'muli';
    src: url('../media/font/muli/Muli.ttf') format('truetype');
}

@font-face {
    font-family: 'prata';
    src: url('../media/font/Prata/Prata-Regular.ttf') format('truetype');
}

h1, h2, h3 {
    font-family: 'prata';
    color: black;
    font-weight: 100;
}

h1 {
    font-size: 3.5rem;
}

h2 {
    font-size: 1.8rem;
}

h3 {
    font-size: 12rem;
    margin-bottom: 0px;
}

p {
    font-size: 0.3rem;
}

/* RESPONSIVE */

@media screen and (max-width: 1680px) {

    /*Grid*/
.boxgrid{
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas:'boxgrid_left'
                        'boxgrid_right' 
                        ; 
    }
    
    .boxgrid_left{
        grid-area: boxgrid_left;
    }
    
    .boxgrid_right{
        grid-area: boxgrid_right;
    }

    /*NAV*/
.click--select{
    margin-right: auto;
    margin-left: auto;
    display: flex;
    background-color: white;
    border-radius: 3px;
    text-align: center;
    width: 100%;
    max-width: 600px;
}
    
    /* FORM */

.containerform{
    margin-top:5%;
    margin-right: auto;
    margin-left: auto;
    width: 70%;
    vertical-align: bottom;
}


.message--box_flex_textfour{ /*NUMBER + -*/
    height: 50px;
    width: 40%;
    margin-right: 2.4vw;
    background-color: #302e2f;
    border: 0.5px solid  gray;
    color: #e4e4e4;
    border-radius: 3px;
}



/*TEXT AND PICTURE EGYPT*/

.containerinfo{
    display: flex;
    flex-wrap: wrap; 
    flex-direction: column;
    background-image:url("../media/imageseventsdetails/event-d-1-1.jpg");
    background-repeat: no-repeat;
    background-position:bottom;
    background-size: 600px;
    margin-right: auto;
    margin-left: auto;
    width: 100%;
    max-width: 600px;
    height: 1100px;
}

.text{
    width: 40%;
    padding: 6% 6%;
}

/*TEXT SCHEDULE*/

.textdetailstitle{
    width: 690px;
    margin-right: auto;
    margin-left: auto;   
}

.textdetails{
   display: flex;
   align-content: center;
   align-items: center;
   margin-right: auto;
   margin-left: auto;
    width: 690px;
    padding: 10px 0px;
}

.textdetails_hours {
    display: flex;
    flex-direction: column;
    font-size: 1.3em;
}

.textdetails_expo{
    display: flex;
    flex-direction: column;   
    font-size: 1.3em; 
}

.textdetails_hours_ampm{
    margin: 35px 0px;
    padding: 20px 20px;
    border-color:#abadb0;
    border-style: none solid none none;
    border-right-width: thin;
}

.textdetails_expo_jap{
    padding: 40px 20px;
}

.textdetails_expo_jap_title{
    margin: 0px 0px 10px 0px;
}


/*TEXTE DETAILS ABOUT EVENT*/
.detailsevent{
    width: 600px;
    margin-right: auto;
    margin-left: auto;
    font-size: 1.3em;
}

/*GALLERY & CONTACT & MAP ----> FLEX*/

.titlegallery{
    margin-right: auto;
    margin-left: auto;
}

.gallery{
    display: flex;
    margin-right: auto;
    margin-left: auto; 
    padding: 0% 3%;
}

.gallery_columone{
    margin-right: auto;
    margin-left: auto;
    display: flex;
    flex-direction: column;
    padding: 0% 6% 0% 0%;
}

.gallery_columtwo{
    display: flex;
    flex-direction: column;
    padding: 0% 6% 0% 0%;
}

.gallery_columone_one{
    padding: 0px 0px 10px 0px;
    width: 300px;
}

.gallery_columone_two{
    width: 300px;
}

.gallery_columone_three{
    padding: 0px 0px 10px 0px;
    width: 300px;
}

.gallery_columone_four{
    width: 300px;
}

.gallery_columtwo_geo{
    margin: 45px 0px 0px 0px;
    border: none;
    height: 30%;
}

/*MAP*/

.gallery_columone_contact{
    display: flex;
    flex-direction: column;
    margin-right: auto;
    margin-left: auto;
}

.iframe {
    display: flex;
    flex-direction: column;
    margin-right: auto;
    margin-left: auto;
    width: 100%;
    max-width: 800px; 
}
   
}


@media screen and (max-width: 800px) {
    

}