html,body,form,ul,ol,li,div,p,h1,h2,h3,h4,h5 { margin:0; padding:0; }
body { background:#FFFFFF; padding:0 0px 0 0px; font-size:16px; }
li,th,td,div,p,a,h1,h2,h3,h4,h5,h8,h9,input,select,textarea { font-family: 'Open Sans', sans-serif; font-size:16px; color:#000000; font-weight:normal; }
li { list-style-type:none; }
.txt, textarea, select { color:#333226; width:200px; padding:3px 2px 3px 2px; margin:2px 0 5px 0; border:1px solid #000000; }
.btn { color:#333226; width:90px; margin-top:2px; padding:3px 0 3px 0; }
img { display:block; border:none; }
a { color:#000000; font-weight:bold; text-decoration:none; }
a:hover { text-decoration:none; color:#000000; }
table td.label { vertical-align:top; padding:4px 5px 0 0; }
table td.field { vertical-align:top; padding-bottom:1px; }
#container { margin:0 auto; max-width:1418px; overflow:hidden; background:#FFFFFF; }
/* start header ---------------------------------------------------------------------- background:#f1d6cf; */
#header { width:100%; display:flex; flex-direction:row; justify-content:flex-start; padding-bottom:0px; background:#f1d6cf; }
#logo { width:374px; height:72px; padding:0px; margin-top:38px; margin-left:55px; margin-right:30px; }
#logo img { width:100%; min-width:275px; }
/* start menu ---------------------------------------------------------------------- */
#menu { width:1014px; height:45px; padding:10px; margin-top:37px; }
#menu ul { display:inline-block; margin-left:185px; height:45px; margin-top:15px; }
#menu ul li { float:left; display:block; padding-right:55px; text-transform:uppercase; transition:all 0.5s ease; }
#menu ul li a { font-size:14px; color:#000000; font-weight:600; display:inline-block; line-height:24px; text-decoration:none; margin-top:0px; padding-top:0px; }
#menu ul li a:hover { border-bottom: 1px solid currentColor; }
#menu ul li a.active { border-bottom: 1px solid currentColor; } /* replacing: text-decoration:underline; text-underline-position:under; */
/* fin menu ---------------------------------------------------------------------- */
/* fin header ---------------------------------------------------------------------- */
/* start home page ---------------------------------------------------------------------- content-top background:#f1d6cf; position:absolute; z-index: 99; */
#content_all { width:100%; padding-top:0px;}
#content_top { width:100%; margin-top:-1px; margin-bottom:60px; padding-top:0px; padding-bottom:70px; background:#f1d6cf;}
#content_top_title { width:100%; }
#content_top_title h1 { color:#000000; font-family: 'Lora', serif; font-size:36px; line-height:46px; letter-spacing:1px; padding-top:70px; margin-bottom:40px; margin-left:200px; }
#content_top_image { width:100%; margin-bottom:0px; display:flex; flex-direction:column; align-items: flex-end; }
#content_top_image img { width:100%; max-width:1129px; margin-bottom:0px;}
#filet { width:100%; margin-top:-50px; margin-left:auto; margin-right:auto; }
#content_home_about { width:100%; margin-top:0px; display:flex; flex-direction:row; align-items: flex-start; }
#sideways { width:20px; height:100%; margin-left:70px; margin-right:10px; padding-top:50px; }
#sideways img { margin-left:0px; padding-top:0px;}
#content_home_about_left { max-width:725px; padding-left:95px; padding-right:0px; display:flex; flex-direction:row; align-items: flex-end; }
#content_home_about_left img { width:100%; max-width:630px; padding-top:50px; }
#content_home_about_right { width:40%; padding-top:50px; }
#titles_right { width:100%; margin-bottom:75px; margin-top:0px; }
#titles_right img { float:right; margin-right:170px; }
#content_home_about_right h1 { width:400px; color:#000000; font-family: 'Lora', serif; font-size:36px; line-height:46px; letter-spacing:1px; margin-left:85px; margin-bottom:20px; }
#content_home_about_right h2 { width:360px; color:#000000; font-family: 'Open Sans', sans-serif; font-size:14px; line-height:22px; letter-spacing:1px; margin-left:85px; padding-top:10px; margin-bottom:10px;}
#content_home_about_bottom { width:100%; margin-top:0px; padding-top:80px; margin-bottom:40px; display:flex; flex-direction:column; justify-content:center; background:#ffffff; }
#content_home_about_bottom h1 { width:100%; color:#000000; font-family: 'Lora', serif; text-align:center; font-size:36px; line-height:46px; letter-spacing:1px; margin-left:0px; margin-bottom:20px; }
#content_home_about_bottom h2 { width:100%; color:#000000; font-family: 'Open Sans', sans-serif; text-align:center; font-size:14px; line-height:22px; letter-spacing:1px; margin-left:0px; padding-top:10px; margin-bottom:0px;}
#button_container_home_view_project {width:100%; margin:0 auto; display:flex; flex-direction:column; justify-content:center; }
#button_container_home_about { width:100%; height:100px; margin-left:85px; }
#button_container_home_about_bottom { width:100%; height:100px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
/* */
.black_button { display:inline-block; height:auto; padding:10px 30px; margin:30px auto;
color:#ffffff; background-color:#3e3e40; letter-spacing:0.15em;
font-family:'Open Sans', sans-serif; font-size:12px; font-weight:600;
line-height:1em; text-decoration:none; border: 1px solid #3e3e40; }
.black_button:hover { color:#000000; background-color:#ffffff; }
#content_home_mid_image { width:100%; display:flex; flex-direction:column; justify-content:flex-start; margin-bottom:60px; }
#content_home_mid_image img { width:100%; }
#content_home_work { width:100%; margin-top:0px; margin-bottom:60px; display:flex; flex-direction:row; align-items: flex-start; }
#sideways_work { width:20px; height:100%; margin-left:70px; margin-right:10px; padding-top:50px; }
#sideways_work img { margin-left:0px; padding-top:0px;}
#content_home_work_left { max-width:725px; padding-left:95px; padding-right:0px; display:flex; flex-direction:row; align-items: flex-end; }
#content_home_work_left img { width:100%; max-width:630px; padding-top:50px; }
#content_home_work_right { width:40%; padding-top:50px; }
#titles_right_work { width:100%; margin-top:200px; }
#titles_right_work img { float:right; margin-right:170px; margin-bottom:75px; }
#content_home_work_right h1 { width:400px; color:#000000; font-family: 'Lora', serif; font-size:36px; line-height:46px; letter-spacing:1px; margin-left:85px; margin-bottom:20px; }
#content_home_work_right h2 { width:360px; color:#000000; font-family: 'Open Sans', sans-serif; font-size:14px; line-height:22px; letter-spacing:1px; margin-left:85px; padding-top:10px; margin-bottom:10px;}
#button_container_home_work{ width:100%; height:100px; margin-left:85px; }
#content_home_travel { width:100%; margin-top:0px; margin-bottom:60px; display:flex; flex-direction:row; align-items: flex-start; }
#sideways_travel { width:20px; height:100%; margin-left:70px; margin-right:10px; padding-top:0px; }
#sideways_travel img { margin-left:0px; padding-top:0px;}
#content_home_travel_container { width:100%; margin-left:95px; display:flex; flex-direction:row; align-items:flex-start; }
#content_home_travel_left { width:500px; min-height:594px; padding-top:0px; margin-left:0px; background:#fae9e1; }
#titles_left_travel { width:100%; margin-top:75px; }
#titles_left_travel img { float:right; margin-right:50px; margin-bottom:0px; }
#text_spacer { width:100%; padding-top:100px;}
#content_home_travel_left h1 { width:100%; color:#000000; margin-top:0px; margin-left:50px; margin-bottom:0px; font-family: 'Lora', serif; font-size:36px; line-height:46px; letter-spacing:1px; }
#content_home_travel_right { max-width:511px; padding-left:0px; padding-right:0px; display:flex; flex-direction:row; align-items: flex-start; }
#content_home_travel_right img { width:100%; max-width:511px; padding-top:0px; }
#button_container_home_travel { width:100%; height:100px; margin-left:50px; margin-top:-10px; }
#content_home_craftman { width:100%; margin-top:50px; margin-bottom:60px; display:flex; flex-direction:row; align-items: flex-start; background:url(../images/_A7A7387.jpg) no-repeat; background-position:right top 110px; }
#content_home_craftman_left { max-width:621px; padding-left:0px; padding-right:0px; display:flex; flex-direction:row; align-items: flex-end; }
#content_home_craftman_left img { width:100%; max-width:621px; padding-top:0px; }
#content_home_craftman_right { width:100%; height:100%; padding-top:0px; }
#titles_right_craftman { width:100%; margin-top:20px; margin-left:85px; }
#titles_right_craftman img { margin-left:150px; margin-bottom:60px; }
#content_home_craftman_right h1 { width:375px; margin-left:85px; margin-bottom:0px; color:#000000; font-family: 'Lora', serif; font-size:36px; line-height:46px; letter-spacing:1px; }
#content_home_craftman_right { width:100%; height:100%; padding-top:0px; }
#button_container_home_craftman { width:100%; margin-left:85px; }
#content_home_craftman_right_image { width:100%; margin:0 auto; padding-top:40px; display:flex; flex-direction:column; align-items:center; }
#content_home_craftman_right_image img { width:100%; padding-top:0px; display:none; }
#content_home_quote { width:100%; height:auto; margin-top:0px; margin-bottom:60px; display:flex; flex-direction:row; align-items:flex-start; background:#dfe9e1; }
#content_home_quote_left { width:200px; background:#ffffff; }
#content_home_quote_left img { width:30px; margin:0 auto; }
#content_home_quote_right { margin:0 auto; display:flex; flex-direction:column; align-items:center; align-content:center; flex-grow:inherit; padding-top:40px; padding-bottom:40px; }
#content_home_quote_right h1 { width:700px; margin-left:0px; margin-top:90px; margin-bottom:20px; color:#000000; font-family: 'Lora', serif; text-align:center; font-size:36px; line-height:46px; letter-spacing:1px; }
#content_home_quote_right h2 { width:700px; margin-left:0px; font-size:18px; color:#000000; text-align:center; }
#content_social_media { width:100%; padding-top:40px; padding-bottom:40px; margin-top:0px; margin-bottom:0px; display:flex; flex-direction:column; align-items:center; }
#content_social_media_instagram { width:100%; }
#content_social_media_instagram h1 { margin-top:40px; margin-left:200px; padding-bottom:40px; font-family: 'Lora', serif; font-size: 24px; text-align:left; }
#container_instagram_module { width:100%; margin:0 auto; }
#content_social_media_icons { margin-left:0px; margin-top:80px; height:30px; display:flex; flex-direction:row; align-items:center; }
#content_social_media_icons img { float:left; padding-right:15px; }
/* start footer max-width:511px; ---------------------------------------------------------------------- */
#footer_container { width:100%; height:215px; background:#eceeed; display:flex; flex-direction:column; align-items:center; margin-bottom:40px; padding:0px; }
#footer_container h1 { padding-top:40px; color:#000000; font-family: 'Open Sans', sans-serif; font-weight:600; text-align:center; font-size:14px; line-height:24px; letter-spacing:1px; } /* text-decoration:underline; text-underline-position:under; */
#footer_container h1 a { text-decoration:none; border-bottom:0px; }
#footer_container h1 a:hover { border-bottom: 1px solid currentColor; }
#footer_container h2 { width:100%; padding-top:20px; color:#000000; font-family: 'Open Sans', sans-serif; text-align:center; font-size:14px; line-height:28px; letter-spacing:1px; margin-left:0px;margin-bottom:0px;}
/* end footer ---------------------------------------------------------------------- h1 { width:700px; margin-left:-130px; social_media: height:545px; */
/* test slideshow START */
#slideshow {
margin: 0px auto;
position: relative;
width: 900px;
height: 340px;
padding: 10px;
box-shadow: 0 0 0px rgba(0, 0, 0, 0.4);
/* debug using box-shadow 0 0 0px as: 0 0 10px , to see div shadow & position */
}
#slideshow > div {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
}
/* test slideshow END */
/* END home page ---------------------------------------------------------------------- */
/* start projects navigation system ---------------------------------------------------------------------- */
#content_project_navigation { width:100%; margin-top:110px; margin-bottom:0px; padding-top:0px; padding-bottom:0px; display:flex; flex-direction:row; align-items:flex-start; }
#content_project_nav_left { width:50%; height:225px; margin-top:0px; margin-bottom:0px; padding-top:108px; padding-left:72px; padding-bottom:0px; display:flex; flex-direction:row; align-items:flex-start; }
#content_project_nav_left img { width:55px; margin-right:72px; }
#content_project_nav_left h2 { width:100%; margin-bottom:30px; color:#000000; font-family: 'Open Sans', sans-serif; font-size:16px; font-weight:700; letter-spacing:2px; text-align:left; }
#content_project_nav_left h3 a { padding-top:0px; color:#000000; font-family: 'Lora', serif; font-size:28px; font-weight:normal; letter-spacing:1px; text-align:left; border-bottom: 1px solid currentColor;} /* text-decoration:underline; */
#content_project_nav_left h3 a:hover { text-decoration:none; border-bottom:0px; }
#content_project_nav_right { width:50%; height:225px; margin-top:0px; margin-bottom:0px; padding-top:108px; padding-right:72px; padding-bottom:0px; display:flex; flex-direction:row; justify-content:flex-end; }
#content_project_nav_right img { width:55px; margin-left:72px; }
#content_project_nav_right h2 { width:100%; margin-bottom:30px; color:#000000; font-family: 'Open Sans', sans-serif; font-size:16px; font-weight:700; letter-spacing:2px; text-align:right; padding-right:72px; }
#content_project_nav_right h3 { text-align:right; }
#content_project_nav_right h3 a { padding-top:0px; color:#000000; font-family: 'Lora', serif; font-size:28px; font-weight:normal; letter-spacing:1px; border-bottom: 1px solid currentColor;} /* text-decoration:underline; */
#content_project_nav_right h3 a:hover { text-decoration:none; border-bottom:0px; }
/* END projects navigation system ---------------------------------------------------------------------- */
/* start project Lakeside page ---------------------------------------------------------------------- */
#content_top_projects { width:100%; margin-top:0px; margin-bottom:0px; padding-top:0px; padding-bottom:0px; display:flex; flex-direction:row; align-items: flex-start; }
#sideways_projects { width:20px; height:100%; margin-left:70px; margin-right:10px; padding-top:75px; }
#sideways_projects img { margin-left:0px; padding-top:0px;}
#content_top_projects_title { width:100%; }
#content_top_projects_title h1 { color:#000000; font-family: 'Lora', serif; font-size:36px; line-height:46px; letter-spacing:1px; padding-top:70px; margin-bottom:20px; margin-left:90px; }
#content_top_projects_image { width:100%; margin-bottom:25px; padding-bottom:70px; display:flex; flex-direction:column; align-items: flex-end; }
#content_top_projects_image img { width:100%; max-width:1129px; margin-bottom:0px; margin-top:-80px;}
#content_top_citation { width:100%; padding-bottom:110px; padding-top:105px; }
#content_top_citation h1 { color:#000000; font-family: 'Lora', serif; font-size:36px; line-height:46px; letter-spacing:1px; margin-bottom:0px; margin-left:180px; }
#content_mid_citation { width:100%; padding-bottom:0px; padding-top:0px; }
#content_mid_citation h1 { color:#000000; font-family: 'Lora', serif; font-size:36px; line-height:46px; letter-spacing:1px; margin-bottom:0px; margin-left:180px; }
#content_lakeside_photos01 { width:100%; padding:0px; margin-top:0px; margin-bottom:0px; display:flex; flex-direction:row; justify-content:flex-start; }
#content_lakeside_photos01_left { width:50%; display:flex; justify-content:flex-start; align-items:center; }
#content_lakeside_photos01_right { width:50%; display:flex; justify-content:flex-end; }
#content_lakeside_photos02 { width:100%; padding:0px; margin-top:110px; margin-bottom:110px; display:flex; justify-content:center; }
#content_lakeside_photos03 { width:100%; padding:0px; margin-top:0px; margin-bottom:110px; display:flex; flex-direction:row; justify-content:flex-start; }
#content_lakeside_photos03_left { width:50%; display:flex; justify-content:flex-start; }
#content_lakeside_photos03_right { width:50%; display:flex; justify-content:flex-end; }
#content_lakeside_photos04 { width:100%; padding:0px; margin-top:110px; margin-bottom:110px; display:flex; justify-content:center; }
#content_lakeside_photos05 { width:100%; padding:0px; margin-top:110px; margin-bottom:110px; display:flex; flex-direction:column; justify-content:center; }
#content_lakeside_photos06 { width:100%; padding:0px; margin-top:110px; margin-bottom:110px; display:flex; justify-content:center; }
#content_lakeside_photos07 { width:100%; padding:0px; margin-top:0px; margin-bottom:0px; padding-bottom:110px; padding-top:110px; display:flex; flex-direction:row; justify-content: flex-start; background:#fbe1e2; }
#content_lakeside_photos07_left { width:50%; display:flex; justify-content:flex-start; align-items:center; }
#content_lakeside_photos07_right { width:50%; display:flex; justify-content:flex-end; }
/* END project Lakeside page ---------------------------------------------------------------------- */
/* start project Loft Office page ---------------------------------------------------------------------- */
#content_top_projects_split { width:100%; margin-top:0px; margin-bottom:0px; padding-top:0px; padding-bottom:0px; display:flex; flex-direction:row; align-items: flex-start; }
#all_left { width:50%; min-width:709px; display:flex; flex-direction:column; justify-content:flex-start; }
#top_left { width:50%; min-width:709px; height:100%; display:flex; flex-direction:row; justify-content:flex-start; }
#content_top_projects_title_split { width:100%; display:flex; flex-direction:row; justify-content:flex-start; }
#content_top_projects_title_split h1 { color:#000000; font-family: 'Lora', serif; font-size:36px; line-height:46px; letter-spacing:1px; padding-top:70px; margin-bottom:20px; margin-left:90px; }
#bottom_left { width:100%; margin-top:223px; display:flex; align-items:flex-end; } /* */
#top_right { width:50%; display:flex; flex-direction:column; justify-content: flex-start;}
#top_right img { padding-top:70px; }
#content_loftoffice_photos01 { width:100%; padding:0px; margin-top:0px; margin-bottom:0px; display:flex; flex-direction:row; justify-content:flex-start; }
#content_loftoffice_photos01_left { width:100%; display:flex; justify-content:flex-start; align-items:center; }
/* END project Loft Office page ---------------------------------------------------------------------- */
/* start project Palm Beach page ---------------------------------------------------------------------- */
#content_palmbeach_photos01 { width:100%; padding:0px; margin-top:0px; margin-bottom:0px; display:flex; flex-direction:row; justify-content:flex-start; }
#content_palmbeach_photos01_left { width:50%; display:flex; justify-content:flex-start; align-items:center; }
#content_palmbeach_photos01_right { width:50%; display:flex; justify-content:flex-end; align-items:center; }
#content_palmbeach_photos02 { width:100%; padding:0px; margin-top:0px; margin-bottom:110px; display:flex; justify-content:center; }
#content_palmbeach_photos03 { width:100%; padding:0px; margin-top:110px; margin-bottom:110px; display:flex; flex-direction:column; justify-content:center; }
#content_palmbeach_photos04 { width:100%; margin:0px; padding-top:110px; padding-bottom:110px; display:flex; justify-content:center; background:#e0ecf3; }
/* END project Palm Beach page ---------------------------------------------------------------------- */
/* start project Township page ---------------------------------------------------------------------- */
#bottom_left_township { width:100%; margin-top:201px; display:flex; align-items:flex-end; }
#content_township_photos02 { width:100%; padding:0px; margin-top:0px; margin-bottom:110px; display:flex; justify-content:center; }
#content_township_photos03 { width:100%; padding:0px; margin-top:0px; margin-bottom:110px; display:flex; flex-direction:row; justify-content:flex-start; }
#content_township_photos03_left { width:50%; display:flex; justify-content:flex-start; }
#content_township_photos03_right { width:50%; display:flex; justify-content:flex-end; }
#content_township_photos04 { width:100%; padding:0px; margin-top:110px; margin-bottom:110px; display:flex; justify-content:center; }
#content_township_photos05 { width:100%; padding:0px; margin-top:110px; margin-bottom:110px; display:flex; flex-direction:column; justify-content:center; }
#content_township_photos07 { width:100%; padding:0px; margin-top:0px; margin-bottom:0px; padding-bottom:0px; padding-top:0px; display:flex; flex-direction:row; justify-content: flex-start; }
#content_township_photos07_left { width:50%; display:flex; justify-content:flex-start; align-items:center; }
#content_township_photos07_right { width:50%; display:flex; justify-content:flex-end; align-items:center;}
/* END project Township page ---------------------------------------------------------------------- */
/* start project City Contemporary page ---------------------------------------------------------------------- */
#content_city_photos02 { width:100%; padding:0px; margin-top:0px; margin-bottom:110px; display:flex; justify-content:center; }
#content_city_photos03 { width:100%; padding:0px; margin-top:110px; margin-bottom:110px; display:flex; flex-direction:column; justify-content:center; }
#content_city_photos07 { width:100%; padding:0px; margin-top:0px; margin-bottom:0px; padding-bottom:110px; padding-top:110px; display:flex; flex-direction:row; justify-content: flex-start; background:#fdf6e6; }
#content_city_photos07_left { width:50%; display:flex; justify-content:flex-start; align-items:center; }
#content_city_photos07_right { width:50%; display:flex; justify-content:flex-end; }
/* END project City Contemporary page ---------------------------------------------------------------------- */
/* start project Elegant Cottage page ---------------------------------------------------------------------- */
#content_cottage_photos02 { width:100%; padding:0px; margin-top:0px; margin-bottom:110px; display:flex; justify-content:center; }
#content_cottage_photos03 { width:100%; padding:0px; margin-top:110px; margin-bottom:110px; display:flex; flex-direction:column; justify-content:center; }
#content_cottage_photos07 { width:100%; padding:0px; margin-top:0px; margin-bottom:0px; padding-bottom:110px; padding-top:110px; display:flex; flex-direction:row; justify-content: flex-start; background:#dce6e5; }
#content_cottage_photos07_left { width:50%; display:flex; justify-content:flex-start; align-items:center; }
#content_cottage_photos07_right { width:50%; display:flex; justify-content:flex-end; }
/* END project Elegant Cottage page ---------------------------------------------------------------------- */
/* start project The Island page ---------------------------------------------------------------------- */
#content_island_photos02 { width:100%; padding:0px; margin-top:0px; margin-bottom:110px; display:flex; justify-content:center; }
#content_island_photos03 { width:100%; padding:0px; margin-top:110px; margin-bottom:110px; display:flex; flex-direction:column; justify-content:center; }
/* END project The Island page ---------------------------------------------------------------------- */
/* start project Urban Classic page ---------------------------------------------------------------------- */
#bottom_left_urbanclassic { width:100%; margin-top:180px; display:flex; align-items:flex-end; align-content:flex-end; }
#bottom_left_urbanclassic img { align-self:flex-end; }
#content_urbanclassic_photos02 { width:100%; padding:0px; margin-top:110px; margin-bottom:110px; display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-end; }
#content_urbanclassic_photos03 { width:100%; padding:0px; margin-top:0px; margin-bottom:110px; display:flex; flex-direction:row; justify-content:flex-start; }
#content_urbanclassic_photos03_left { width:50%; display:flex; justify-content:flex-start; }
#content_urbanclassic_photos03_right { width:50%; display:flex; justify-content:flex-end; }
#content_urbanclassic_photos04 { width:100%; padding:0px; margin-top:110px; margin-bottom:110px; display:flex; justify-content:center; }
#content_urbanclassic_photos07 { width:100%; padding:0px; margin-top:0px; margin-bottom:0px; padding-bottom:0px; padding-top:0px; display:flex; flex-direction:row; justify-content: flex-start; }
#content_urbanclassic_photos07_left { width:50%; display:flex; justify-content:flex-start; align-items:center; }
#content_urbanclassic_photos07_right { width:50%; display:flex; justify-content:flex-end; align-items:center;}
/* END project Urban Classic page ---------------------------------------------------------------------- */
/* start project Bromont page ---------------------------------------------------------------------- */
#content_bromont_photos02 { width:100%; padding:0px; margin-top:0px; margin-bottom:110px; display:flex; justify-content:center; }
#content_bromont_photos03 { width:100%; padding:0px; margin-top:110px; margin-bottom:110px; display:flex; flex-direction:column; justify-content:center; }
#content_bromont_photos03 img { width:100%; }
#content_bromont_photos04 { width:100%; padding:0px; margin-top:0px; margin-bottom:110px; display:flex; justify-content:center; }
#content_bromont_photos07 { width:100%; padding:0px; margin-top:0px; margin-bottom:0px; padding-bottom:110px; padding-top:0px; display:flex; flex-direction:row; justify-content: flex-start; }
#content_bromont_photos07_left { width:50%; display:flex; justify-content:flex-start; align-items:center; }
#content_bromont_photos07_left img { width:100%;}
#content_bromont_photos07_right { width:50%; display:flex; justify-content:flex-end; }
#content_bromont_photos07_right img { width:100%;}
/* END project Bromont page ---------------------------------------------------------------------- */
/* start project Owls Head page ---------------------------------------------------------------------- */
#bottom_left_owlshead {width:100%; height:100%; margin-top:180px; display:flex; align-items:flex-end; align-content:flex-end; }
#bottom_left_owlshead img { align-self:flex-end; }
#content_owlshead_photos01 { width:100%; padding:0px; margin-top:0px; margin-bottom:110px; display:flex; flex-direction:column; justify-content:center; }
#content_owlshead_photos02 { width:100%; padding:0px; margin-top:0px; margin-bottom:110px; display:flex; justify-content:center; }
#content_owlshead_photos03 { width:100%; padding:0px; margin-top:0px; margin-bottom:110px; display:flex; flex-direction:row; justify-content:flex-start; }
#content_owlshead_photos03_left { width:50%; display:flex; justify-content:flex-start; }
#content_owlshead_photos03_right { width:50%; display:flex; justify-content:flex-end; }
#content_owlshead_photos04 { width:100%; padding:0px; margin-top:0px; margin-bottom:110px; display:flex; justify-content:center; }
/* END project Owls Head page ---------------------------------------------------------------------- */
/* start About Us page ---------------------------------------------------------------------- */
#content_top_about { width:100%; margin-top:0px; margin-bottom:0px; padding-top:0px; padding-bottom:70px; display:flex; flex-direction:row; align-items:flex-start; }
#sideways_about { width:20px; height:100%; margin-left:70px; margin-right:10px; padding-top:75px; }
#sideways_about img { margin-left:0px; padding-top:0px;}
#content_top_about_title { width:100%; }
#content_top_about_title h1 { color:#000000; font-family: 'Lora', serif; font-size:36px; line-height:46px; letter-spacing:1px; padding-top:70px; margin-bottom:70px; margin-left:90px; }
#content_top_projects_image { width:100%; margin-bottom:25px; padding-bottom:70px; display:flex; flex-direction:column; align-items: flex-end; }
#content_top_projects_image img { width:100%; max-width:1129px; margin-bottom:0px; margin-top:-80px;}
#content_top_citation_about { width:890px; padding-bottom:110px; padding-top:105px; margin:0px auto;}
#content_top_citation_about h1 { color:#000000; font-family: 'Lora', serif; font-size:36px; line-height:46px; letter-spacing:1px; text-align:center; margin-bottom:0px; }
/* not working either...
#content_top_citation_about p { color:#000000; font-family: 'Verdana', sans-serif; font-size:36px; line-height:46px; letter-spacing:1px; text-align:center; margin-bottom:0px; }
*/
#content_about_photos01 { width:100%; padding:0px; margin-top:0px; margin-bottom:0px; display:flex; flex-direction:row; justify-content:flex-start; }
#content_about_photos01_left { width:50%; display:flex; justify-content:flex-end; align-items:center; }
#content_about_photos01_right { width:50%; padding-top:30px; display:flex; flex-direction:column; justify-content:flex-start; }
#content_about_photos01_right p { margin-left:90px; margin-bottom:20px; max-width:460px; color:#000000; font-family: 'Open Sans', sans-serif; font-size:16px; line-height:28px; letter-spacing:1px; text-align:left; }
/* End About Us page ---------------------------------------------------------------------- */
/* start Luxury Life Italy page ---------------------------------------------------------------------- */
#content_top_lifestyle_split { width:100%; margin-top:0px; margin-bottom:0px; padding-top:0px; padding-bottom:70px; display:flex; flex-direction:row; align-items: flex-start; }
#bottom_left_lifestyle { width:100%; margin-left:70px; display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; }
#bottom_left_lifestyle h1 { margin-left:0px; margin-top:20px; margin-bottom:10px; color:#000000; font-family: 'Open Sans', sans-serif; font-size:16px; font-weight:600; line-height:28px; letter-spacing:1px; text-align:left; }
#bottom_left_lifestyle p { margin-left:0px; margin-bottom:20px; max-width:560px; color:#000000; font-family: 'Open Sans', sans-serif; font-size:16px; line-height:28px; letter-spacing:1px; text-align:left; }
#content_top_citation_lifestyle_italy { width:100%; padding-bottom:110px; padding-top:105px; margin:0px auto;}
#content_top_citation_lifestyle_italy h1 { color:#000000; font-family: 'Lora', serif; font-size:36px; line-height:46px; letter-spacing:1px; text-align:center; margin-bottom:0px; }
#content_lifestyle_italy_photos_2020_01 { width:100%; flex-direction:column; }
#content_lifestyle_italy_photos_2020_01 img { margin:auto; display:block; padding-bottom:50px;}
#content_lifestyle_italy_photos_2020_01 p { padding-bottom:50px; color:#000000; font-family: 'Open Sans', sans-serif; font-size:16px; line-height:28px; letter-spacing:1px; text-align:center; }
#content_lifestyle_italy_photos01 { width:100%; padding:0px; margin-top:0px; margin-bottom:90px; padding-bottom:0px; padding-top:0px; display:flex; flex-direction:row; justify-content: flex-start; }
#content_lifestyle_italy_photos01_left { width:50%; display:flex; flex-direction:column; justify-content:flex-start; }
#content_lifestyle_italy_photos01_left p { margin-left:70px; margin-top:40px; margin-bottom:20px; max-width:560px; color:#000000; font-family: 'Open Sans', sans-serif; font-size:16px; line-height:28px; letter-spacing:1px; text-align:left; }
#content_lifestyle_italy_photos01_right { width:50%; display:flex; flex-direction:column; justify-content:flex-end; align-items:center;}
#content_lifestyle_italy_photos01_right p { margin-left:-60px; margin-top:110px; margin-bottom:20px; max-width:560px; color:#000000; font-family: 'Open Sans', sans-serif; font-size:16px; line-height:28px; letter-spacing:1px; text-align:left; }
#content_lifestyle_module_row { width:100%; margin-top:110px; display:flex; flex-direction:row; justify-content:center; align-items: flex-start; align-content: flex-start; }
#content_lifestyle_module_row_next { width:100%; margin-top:110px; display:flex; flex-direction:row; justify-content:center; align-items: flex-start; align-content: flex-start; }
#lifestyle_module_item { width:247px; padding-left:25px; padding-right:25px; }
#lifestyle_module_item p { margin-top:40px; color:#000000; font-family: 'Open Sans', sans-serif; font-size:16px; line-height:28px; letter-spacing:1px; text-align:left; }
/* END Luxury Life Italy page ---------------------------------------------------------------------- */
/* start Contact page basics ---------------------------------------------------------------------- */
#content_top_contact_split { width:100%; margin-top:0px; margin-bottom:0px; padding-top:0px; padding-bottom:70px; display:flex; flex-direction:row; align-items: flex-start; }
#content_top_contact_title_split { width:100%; display:flex; flex-direction:column; justify-content:flex-start; }
#content_top_contact_title_split h1 { color:#000000; font-family: 'Lora', serif; font-size:28px; line-height:46px; letter-spacing:1px; padding-top:70px; margin-bottom:20px; margin-left:90px; }
#content_top_contact_title_split a { padding-top:0px; color:#000000; font-family: 'Lora', serif; font-size:28px; font-weight:normal; letter-spacing:1px; text-align:left; border-bottom: 1px solid currentColor;} /* text-decoration:underline; */
#content_top_contact_title_split a:hover { text-decoration:none; border-bottom:0px; }
#bottom_left_contact { width:100%; margin-left:90px; margin-top:0px; display:flex; align-items:flex-start; } /* */
#content_social_media_icons_contact { margin-left:0px; margin-top:15px; height:30px; display:flex; flex-direction:row; align-items:center; }
#content_social_media_icons_contact img { float:left; padding-right:15px; }
#content_social_media_icons_contact a { border-bottom:0px; }
#top_right_contact { width:50%; display:flex; flex-direction:column; justify-content:flex-start;}
#top_right_contact img { width:512px; margin-top:70px; border: 1px solid #000000; }
#content_top_citation_contact { width:100%; padding-bottom:60px; padding-top:105px; margin:0 auto;}
#content_top_citation_contact h1 { color:#000000; font-family: 'Lora', serif; font-size:36px; line-height:46px; letter-spacing:1px; margin-bottom:0px; text-align:center;}
/* END Contact page basics ---------------------------------------------------------------------- */
/* start formulaire Contact page ---------------------------------------------------------------------- */
#text_field { width:100%; margin-top:0px; margin-bottom:0px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.text_field_text { width:550px; padding:20px; margin-top:5px; margin-bottom:0px; margin-left:0px; font-family: 'Lora', serif; font-size:20px; color:#000000; font-weight:normal; overflow:auto;}
.champ_contact input {
display:inline-block;
margin-bottom:45px;
padding-left:20px; padding-top:10px; padding-bottom:10px; padding-right:10px;
width:560px; height:45px;
background:#FFFFFF;
border: 1px solid #000000;
font-family: 'Lora', serif; font-size:20px; color:#000000; font-weight:normal; line-height:17px;
}
#formulaire_contact { width:100%; margin-top:0px; padding:0px; padding-bottom:50px; margin-bottom:110px; background:#ffffff; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.submit { width:100%; margin:0 auto; display:flex; flex-direction:column; align-items:center; justify-content:center; }
/* end formulaire Contact page ----------------------------------------------------------------------
/* start Download Login page ---------------------------------------------------------------------- */
#content_form { width:100%; height:150px; background:#e2e2e2; display:flex; flex-direction:column; align-items:center; justify-content:center; }
#login_form { width:100%; display:flex; align-items:center; flex-direction:column;}
#login_form .input_text {
display:inline-block;
margin:0 auto;
padding:10px;
width:400px; height:25px;
background:#FFFFFF;
border: 1px solid #000000;
font-size:18px; color:#000000; font-weight:normal; line-height:17px;
}
#button_container_login { clear:both; width:100%; height:25px; display:flex; align-items:center; }
/* end Download Login page ---------------------------------------------------------------------- */
/* ------------------ START ALL MOBILES CODE ---------------- */
/* start mobiles ---------------------------------------------------------------------- 1134px
-- débug Pixel 2: 1080 (était 1024 avant) */
/* tweak 1134px pour espace à gauche du menu KOWD ---------------------------------------------------------------------- 1134px */
@media only screen and (max-width : 1134px)
{
#menu ul { margin-left:30px; margin-top:0px; }
}
/* start mobiles standard KOWD -------------------------------------------------------------------- 1080px */
/* work debug - backups
#titles_right img { margin-right:30px; margin-top:25px; }
#titles_right_work img { margin-right:30px; margin-top:25px; margin-bottom:5px; }
#titles_right_work { width:100%; margin-top:20px; margin-bottom:75px; }
#titles_right_craftman { width:90%; margin-top:20px; margin-bottom:95px; margin-right:30px;}
#titles_right_craftman img { float:right; margin-right:30px; margin-top:25px; margin-bottom:25px; }
*/
/* #button_container_home_view_project { width:100%; margin-left:0px; display:flex; flex-direction:column; justify-content:center; }
.black_button { margin:0 auto; font-size:20px !important; } font-size: 12px;
.black_button22-notworking { font-size:26px; padding:20px 30px; }
*/
@media only screen and (max-width : 1080px)
{
/* doesn't change anything ... html { font-size: 100%} ci-dessous: .black_button ancien font-size:26px; */
body { font-size: 20px; /* fonts will Never get larger than this */ }
#container { width:100%; min-width:1080px;}
.black_button { font-size:16px; margin-left:180px; padding: 30px 50px;}
/* margin-left:0px; pour décentrer le bouton noir */
#logo { width:100%; height:auto; margin-top:10px; margin-left:10px; }
#logo img { width:100%; min-width:779px; max-width:779px; margin-left:40px; margin-top:40px; }
#content_home_about { flex-direction:column; }
#content_top { padding-bottom: 0px; }
#content_top_title { margin-bottom:80px; }
#sideways { display:none; }
#sideways_work { display:none; }
#sideways_travel { display:none; }
#content_home_about_left { width:100%; max-width:1082px; padding-left:0px; flex-direction:column; justify-content:center; }
#content_home_about_left img { width:100%; max-width:630px; margin:0 auto; padding-top:0px; }
#content_home_about_right { width:100%; padding-top:10px; display:flex; flex-direction:column; justify-content:center; align-content:center; }
#titles_right { margin-top:20px; margin-bottom:40px; margin-left:180px; }
#titles_right img { float:none; margin-left:0px; margin-top:40px; } /* debug - ancien était: margin-left:auto; margin-right:auto; */
#content_home_about_right h1 { width:100%; margin-left:180px; text-align:left; line-height:52px; font-size:42px; }
#content_home_about_right h2 { width:80%; text-align:left; line-height:26px; font-size:0.85em; margin-left:180px; padding:0px; padding-right:60px; margin-bottom:40px; }
#button_container_home_about { width:100%; margin-left:0px; display:flex; flex-direction:column; justify-content:center; }
#button_container { display:flex; justify-content:center; margin-left:10px; }
#content_home_about_bottom { width:100%; margin:0 auto; padding-top:40px; margin-bottom:60px; }
#content_home_about_bottom h1 { width:100%; margin-left:180px; text-align:left; line-height:52px; font-size:2.635em; }
#content_home_about_bottom h2 { width:100%; margin-left:180px; margin-right:10px; text-align:left; line-height:1.25em; font-size:1.15em; padding-top:10px; margin-bottom:40px; color:#000000; }
/* debug - anciennes versions weird:
#content_home_about_bottom h2 { width:100%; margin-left:180px; margin-right:10px; text-align:left; line-height:26px; font-size:1em; padding-top:10px; margin-bottom:40px; }
#content_home_work_right h2 { width:100%; margin-left:180px; margin-right:10px; text-align:left; line-height:26px; font-size:1em; padding-top:10px; margin-bottom:40px; }
*/
#content_home_mid_image { margin-bottom:20px; }
#content_home_work { flex-direction:column; margin-bottom:60px; }
#content_home_work_left { width:100%; max-width:1082px; padding-left:0px; flex-direction:column; justify-content:center; }
#content_home_work_left img { width:100%; margin:0 auto; }
#content_home_work_right { width:100%; margin:0 auto; padding-top:40px; margin-bottom:0px; }
#titles_right_work { width:100%; margin-top:0px; margin-bottom:40px; margin-left:180px; }
#titles_right_work img { float:none; margin-left:0px; margin-top:40px; } /* debug - ancien était: margin-left:auto; margin-right:auto; */
#titles_left_travel{ width:100%; margin-left:180px; margin-top:0px; margin-bottom:40px; }
#titles_left_travel img { float:none; min-width:168px; margin-left:0px; margin-top:40px; } /* debug - ancien était: margin-left:auto; margin-right:auto; */
#content_home_work_right h1 { width:100%; margin-bottom:40px; padding-right:0px; margin-left:180px; text-align:left; line-height:52px; font-size:2.655em; }
#button_container_home_work { width:100%; margin-left:0px; display:flex; flex-direction:column; justify-content:center; }
#content_home_work_right { width:80%; padding-right:200px; }
#content_home_work_right h2 { width:100%; margin-left:180px; margin-right:10px; padding-right:200px; text-align:left; line-height:1.25em; font-size:1.20em; padding-top:10px; margin-bottom:40px; color:#000000; }
#content_home_travel_container { width:100%; margin-left:0px; padding-left:0px; flex-direction:column;}
#content_home_travel_left { width:100%; padding-left:0px; padding-top:40px; padding-bottom:0px; }
#content_home_travel_left h1 { width:70%; padding-right:20px; margin-left:180px; margin-bottom:60px; text-align:left; line-height:52px; font-size:42px; }
#text_spacer { padding-top:40px; }
#content_home_travel_right { width:100%; min-width:100%; margin:0 auto; display:flex; flex-direction:column; justify-content:center; background: #fae9e1; padding-bottom:80px; }
#content_home_travel_right img { width:100%; min-width:621px; margin:0 auto; margin-top:40px;} /* max-width:621px; */
#button_container_home_travel { width:100%; margin-left:0px; margin-bottom:0px; display:flex; flex-direction:column; justify-content:center; }
#content_home_quote { height:auto; min-height:200px;}
#content_home_quote_left { display:none; }
#content_home_quote_right { width:95%; padding-left:0px; padding-right:0px; margin-top:40px; margin-left:auto; margin-right:auto; }
#content_home_quote_right h1 { width:100%; margin-top:40px; font-size: 28px;}
#content_home_quote_right h2 { width:100%; padding-bottom:40px; margin-left:0px;}
#content_home_craftman { width:100%; margin-top:20px; margin-bottom:40px; display:flex; flex-direction:column; justify-content:center; background-image:none; }
#content_home_craftman_left { width:100%; max-width:100%; margin-bottom:40px; display:none; }
#content_home_craftman_left img { width:100%; margin:0 auto;}
#button_container_home_craftman { width:100%; margin-top:20px; margin-left:0px; display:flex; flex-direction:column; justify-content:start; }
#titles_right_craftman { width:100%; margin-left:180px; margin-top:20px; margin-bottom:40px; }
#titles_right_craftman img { float:none; margin-left:0px; margin-top:40px; } /* debug - ancien était: margin-left:auto; margin-right:auto; */
#content_home_craftman_right { width:100%; margin:0 auto; padding-left:60px;}
#content_home_craftman_right h1 { width:90%; margin-left:0px; margin-right:0px; margin-bottom:40px; padding-left:0px; padding-right:0px; text-align:left; line-height:52px; font-size:48px; }
#content_home_craftman_right { width:100%; margin:0 auto; padding-left:0px; padding-right:60px;}
#content_home_craftman_right h1 { width:75%; margin-left:180px; margin-right:0px; margin-bottom:40px; padding-left:0px; padding-right:0px; text-align:left; line-height:52px; font-size:48px; }
#content_home_craftman_right_image { width:100%; margin:0px auto; padding-top:60px; justify-content:center;}
#content_home_craftman_right_image img { display:inline; max-width:620px; }
#content_social_media { padding:0px; padding-bottom:40px; }
#content_social_media_instagram h1 { margin-left:50px; font-size:33px; text-align:center; }
#container_instagram_module { width:90%; }
#content_social_media_icons { width:100%; margin-left:0px; display:flex; flex-direction:row; justify-content:center; }
#footer_container { width:100%; display:flex; flex-direction:column; align-items:center; margin-bottom:0px; padding:0px; }
#footer_container h2 { width:100%; font-size:22px; padding:20px;}
/* start project lakeside page ---------------------------------------------------------------------- */
#content_top_projects { padding-bottom:80px; margin-top:-1px; }
#content_top_projects_title h1 { margin-left:60px; margin-bottom:40px; padding-top: 70px; }
#sideways_projects { display:none; }
#content_top_citation { padding-top:60px; padding-bottom:60px; }
#content_top_citation h1 { width:100%; font-size:31px; margin-left:60px; }
#content_mid_citation { padding-top:0px; padding-bottom:0px; }
#content_mid_citation h1 { font-size:28px; margin-left:60px; margin-right:0px; }
#content_top_projects_image { margin-bottom:0px;}
#content_top_projects_image img { width:100%; max-width:1129px; margin-top:0px;}
/* .debug { width:90%; font-size:32px; margin-left:60px; } */
#content_lakeside_photos01 { flex-direction:column; justify-content:center; }
#content_lakeside_photos01_left { width:100%; }
#content_lakeside_photos01_left img { width:100%; height:100%; }
#content_lakeside_photos01_right { width:100%;}
#content_lakeside_photos01_right img { width:100%; height:100%; }
#content_lakeside_photos02 img { width:100%; height:100%; }
#content_lakeside_photos03 { flex-direction:column; }
#content_lakeside_photos03_left { width:100%; }
#content_lakeside_photos03_left img { width:100%; height:100%; }
#content_lakeside_photos03_right { width:100%; }
#content_lakeside_photos03_right img { width:100%; height:100%; }
#content_lakeside_photos04 img { width:100%; height:100%; }
#content_lakeside_photos05 img { width:100%; }
#content_lakeside_photos06 img {width:100%; height:100%; }
#content_lakeside_photos07 { flex-direction:column; }
#content_lakeside_photos07_left { width:100%; flex-direction:column; }
#content_lakeside_photos07_left img { width:100%; }
#content_lakeside_photos07_right { width:100%; flex-direction:column; align-items:center; }
#content_lakeside_photos07_right img { width:100%; }
/* END project lakeside page ---------------------------------------------------------------------- */
/* start project Loft Office page ---------------------------------------------------------------------- */
#content_top_projects_split { flex-direction:column; margin-top:-1px; }
#all_left { width:100%;}
#top_left { width:100%; }
#bottom_left { width:100%; margin-top: 60px; justify-content:center; }
#bottom_left img { width:80%; height:80%; }
#top_right { width:100%; }
#top_right img { width:100%; height:100%;}
/* END project Loft Office page ---------------------------------------------------------------------- */
/* start project Palm Beach page ---------------------------------------------------------------------- */
#content_palmbeach_photos01 { flex-direction:column; justify-content:center; }
#content_palmbeach_photos01_left { width:100%; justify-content:center; }
#content_palmbeach_photos01_right { width:100%;justify-content:center; }
#content_palmbeach_photos01 img { width:100%; height:100%; margin-top:-2px; }
#content_palmbeach_photos03 img { width:100%; }
/* END project Palm Beach page ---------------------------------------------------------------------- */
/* start project Township page ---------------------------------------------------------------------- */
#bottom_left_township { width:100%; margin-top: 60px; justify-content:center; }
#bottom_left_township img { width:100%; height:auto; }
#content_top_citation h1.township { font-size:28px; }
#content_mid_citation h1.township { font-size:28px; }
#content_township_photos02 img { width:100%; height:100%; }
#content_township_photos03 { flex-direction:column; }
#content_township_photos03_left { width:100%; }
#content_township_photos03_left img { width:100%; height:100%; }
#content_township_photos03_right { width:100%; }
#content_township_photos03_right img { width:100%; height:100%; }
#content_township_photos04 img { width:100%; height:100%; }
#content_township_photos05 img { width:100%; }
#content_township_photos07 { flex-direction:column; }
#content_township_photos07_left { width:100%; flex-direction:column; }
#content_township_photos07_left img { width:100%; height:auto; }
#content_township_photos07_right { width:100%; flex-direction:column; align-items:center; }
#content_township_photos07_right img { width:100%; height:auto; }
/* END project Township page ---------------------------------------------------------------------- */
/* start project City Contemporary page ---------------------------------------------------------------------- */
#content_city_photos03 img { width:100%; }
#content_city_photos07 { flex-direction:column; }
#content_city_photos07_left { width:100%; flex-direction:column; }
#content_city_photos07_left img { width:100%; height:auto; }
#content_city_photos07_right { width:100%; flex-direction:column; align-items:center; }
#content_city_photos07_right img { width:100%; height:auto; }
/* END project City Contemporary page ---------------------------------------------------------------------- */
/* start project Elegant Cottage page ---------------------------------------------------------------------- */
#content_cottage_photos03 img { width:100%; }
#content_cottage_photos07 { flex-direction:column; }
#content_cottage_photos07_left { width:100%; flex-direction:column; }
#content_cottage_photos07_left img { width:100%; height:auto; }
#content_cottage_photos07_right { width:100%; flex-direction:column; align-items:center; }
#content_cottage_photos07_right img { width:100%; height:auto; }
/* END project Elegant Cottage page ---------------------------------------------------------------------- */
/* start project The Island page ---------------------------------------------------------------------- */
#content_island_photos03 img { width:100%; }
/* END project The Island page ---------------------------------------------------------------------- */
/* start project Urban Classic page ---------------------------------------------------------------------- */
#bottom_left_urbanclassic { width:100%; margin-top: 60px; justify-content:center; }
#bottom_left_urbanclassic img { width:100%; height:auto; }
#content_top_citation h1.urbanclassic { font-size:28px; }
#content_mid_citation h1.urbanclassic { font-size:28px; }
#content_urbanclassic_photos02 img { width:100%; height:100%; }
#content_urbanclassic_photos03 { flex-direction:column; }
#content_urbanclassic_photos03_left { width:100%; }
#content_urbanclassic_photos03_left img { width:100%; height:100%; }
#content_urbanclassic_photos03_right { width:100%; }
#content_urbanclassic_photos03_right img { width:100%; height:100%; }
#content_urbanclassic_photos04 img { width:100%; height:100%; }
#content_urbanclassic_photos07 { flex-direction:column; }
#content_urbanclassic_photos07_left { width:100%; flex-direction:column; }
#content_urbanclassic_photos07_left img { width:100%; height:auto; }
#content_urbanclassic_photos07_right { width:100%; flex-direction:column; align-items:center; }
#content_urbanclassic_photos07_right img { width:100%; height:auto; }
/* END project Urban Classic page ---------------------------------------------------------------------- */
/* start project Bromont page ---------------------------------------------------------------------- */
#content_bromont_photos03 img { width:100%; }
#content_bromont_photos07 { flex-direction:column; }
#content_bromont_photos07_left { width:100%; flex-direction:column; }
#content_bromont_photos07_left img { width:100%; height:auto; }
#content_bromont_photos07_right { width:100%; flex-direction:column; align-items:center; }
#content_bromont_photos07_right img { width:100%; height:auto; }
/* END project Bromont page ---------------------------------------------------------------------- */
/* start project Owls Head page ---------------------------------------------------------------------- */
#bottom_left_owlshead img { width:100%; height:100%; }
#content_owlshead_photos01 img { width:100%; height:100%; }
#content_owlshead_photos02 img { width:100%; height:100%; }
#content_owlshead_photos03 { flex-direction:column; }
#content_owlshead_photos03_left { width:100%; }
#content_owlshead_photos03_left img { width:100%; height:100%; }
#content_owlshead_photos03_right { width:100%; }
#content_owlshead_photos03_right img { width:100%; height:100%; }
#content_owlshead_photos04 img { width:100%; }
/* END project Owls Head page ---------------------------------------------------------------------- */
/* start About Us page ---------------------------------------------------------------------- */
#content_top_about { padding-bottom:80px; margin-top:-1px; }
#content_top_about_title h1 { font-size:180%; margin-left:60px; margin-bottom:40px; padding-top:70px; }
#sideways_about { display:none; }
#content_top_about_image { margin-bottom:0px;}
#content_top_about_image img { width:100%; max-width:1129px; margin-top:0px;}
#content_top_citation_about { max-width:75%; margin:20px auto; }
#content_top_citation_about h1 { font-size:20px; }
/* not working either... weird #content_top_citation_about p { font-size:125%; }
*/
#content_about_photos01 { flex-direction:column; justify-content:center; }
#content_about_photos01_left { width:100%; }
#content_about_photos01_left img { width:100%; height:100%; }
#content_about_photos01_right { width:100%; margin-top:40px;}
#content_about_photos01_right p { max-width:90%; margin:0px auto; margin-bottom:50px; color:#000000; font-family: 'Open Sans', sans-serif; font-size:16px; line-height:50px; letter-spacing:1px; text-align:left; }
/* End About Us page ---------------------------------------------------------------------- */
/* start Luxury Lifestyle Italy page ---------------------------------------------------------------------- */
#content_top_lifestyle_split { flex-direction:column; }
#content_top_lifestyle_split h1 { font-size:300%; line-height:60px; }
#bottom_left_lifestyle { width:100%; margin-top: 60px; margin-left:auto; margin-right:auto; }
#bottom_left_lifestyle img { width:100%; height:auto; }
#bottom_left_lifestyle h1 { padding-left:40px; margin-top:40px; margin-bottom:20px; }
/* test: #bottom_left_lifestyle p { padding-left:40px; padding-right:40px; margin-bottom:20px; font-size:80%; line-height:40px; } */
#bottom_left_lifestyle p { padding-left:40px; margin-bottom:20px; max-width:90%; line-height:40px; }
#content_top_citation_lifestyle_italy { width:100%; margin:20px auto; }
/* buggy... produces very small type on tablets #content_top_citation_lifestyle_italy h1 { font-size:80%; } */
#content_lifestyle_italy_photos_2020_01 p { font-size:22px; line-height:34px; padding-left:30px; padding-right:30px;}
#content_top_citation_lifestyle_italy h1 { padding-left:30px; padding-right:30px;}
#content_lifestyle_italy_photos01 { flex-direction:column; }
#content_lifestyle_italy_photos01_left { width:100%; flex-direction:column; }
#content_lifestyle_italy_photos01_left img { width:100%; height:auto; }
#content_lifestyle_italy_photos01_left p { margin-left:0px; padding-left:40px; max-width:80%; font-size:200%; line-height:50px; }
#content_lifestyle_italy_photos01_right { width:100%; flex-direction:column; align-items:start; }
#content_lifestyle_italy_photos01_right p { margin-left:0px; padding-left:40px; max-width:80%; font-size:200%; line-height:40px; }
#content_lifestyle_italy_photos01_right img { width:100%; height:auto; margin-top:40px; }
#content_lifestyle_module_row { flex-direction:column; }
#content_lifestyle_module_row_next { flex-direction:column; margin-top:40px; }
#lifestyle_module_item { width:100%; padding-left:0px; padding-right:0px; }
#lifestyle_module_item img { width:100%; height:auto; }
#lifestyle_module_item img.notext { width:100%; height:auto; margin-bottom:70px;}
#lifestyle_module_item p { max-width:80%; font-size:120%; line-height:160%; margin-bottom:40px; padding-left:40px; }
/* End Luxury Lifestyle Italy page ---------------------------------------------------------------------- */
/* start contact page ---------------------------------------------------------------------- */
#content_top_contact_title_split { width:100%; margin:0 auto; margin-top:-1px; }
#content_top_contact_title_split h1 { margin:0 auto; }
#bottom_left_contact { width:100%; margin:0 auto; }
#content_social_media_icons_contact { margin:60px auto; }
#top_right_contact { width:100%; margin:0 auto;}
#content_top_contact_split { width:100%; flex-direction:column; margin-top:-1px; }
#top_right_contact { width:100%; margin:0 auto;}
#top_right_contact img { width:590px; height:auto; margin:0 auto; margin-top:70px;}
#content_top_citation_contact { padding-top:60px; margin-top:-1px; }
#formulaire_contact { width:100%; margin-top:-1px; }
#formulaire_contact .black_button { margin:60px auto; }
/* END contact page ---------------------------------------------------------------------- */
}
/* KOWD mobile styles standard END */
/* ----------- iPhone 6, 6S, 7, 8, X, XR, Pixel2, Pixel2 XL ----------- */
/* Portrait and Landscape */
@media only screen
and (min-device-width: 375px)
and (max-device-width: 667px)
and (-webkit-min-device-pixel-ratio: 2) {
#container { width:100%; max-width:980px; overflow: hidden; }
#menu_burger { margin-right: 1500px; }
#content_top_title h1 { font-size:36px; margin-left:60px; line-height:52px; color:#000000; }
#content_home_craftman { background-image:none; margin-bottom:40px; padding-bottom:40px; }
/* couleur changée pour débugage - remettre noir à la fin
#button_container_home_craftman { width:100%; margin-left:0px; margin-bottom:20px; display:flex; flex-direction:column; justify-content:center; }
*/
}
/* Portrait */
@media only screen
and (min-device-width: 375px)
and (max-device-width: 667px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: portrait) {
}
/* Landscape */
@media only screen
and (min-device-width: 375px)
and (max-device-width: 667px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: landscape) {
}
/* ----------- END iPhone 6, 6S, 7, 8, X, XR, Pixel2, Pixel2 XL ----------- */
/* ----------- iPhone 6+, 7+ and 8+ ----------- */
/* Portrait and Landscape */
@media only screen
and (min-device-width: 414px)
and (max-device-width: 736px)
and (-webkit-min-device-pixel-ratio: 3) {
}
/* ----------- END iPhone 6+, 7+ and 8+ ----------- */
/* ----------- iPad 3, 4 and Pro 9.7" ----------- min-height:490px;? */
/* Portrait and Landscape */
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (-webkit-min-device-pixel-ratio: 2) {
#content_top_title h1 { line-height:44px; }
/* #lifestyle_module_item img { width:80%; } ...maybe, maybe not... */
}
/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen
and (min-device-width: 768px)
and (max-device-width: 768px)
and (orientation: portrait)
and (-webkit-min-device-pixel-ratio: 2) {
#container { width:100%; max-width:1600px; overflow: hidden; }
#content_top_title h1 { margin-left:60px; }
}
/* Portrait */
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: portrait)
and (-webkit-min-device-pixel-ratio: 2) {
}
/* Landscape */
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: landscape)
and (-webkit-min-device-pixel-ratio: 2) {
#container { width:100%; max-width:1600px; overflow: hidden; }
}
/* ----------- END iPad 3, 4 and Pro 9.7" ----------- */
/* ----------- iPad Pro 10.5" ----------- */
/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen
and (min-device-width: 834px)
and (max-device-width: 834px)
and (orientation: portrait)
and (-webkit-min-device-pixel-ratio: 2) {
#container { width:100%; max-width:1600px; overflow: hidden; }
#content_top_title h1 { margin-left:60px; }
}
/* ----------- END iPad Pro 10.5" ----------- */
/* ----------- iPad Pro 12.9" ----------- */
/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen
and (min-device-width: 1024px)
and (max-device-width: 1024px)
and (orientation: portrait)
and (-webkit-min-device-pixel-ratio: 2) {
#container { width:100%; max-width:1600px; overflow: hidden; }
#content_top_title h1 { margin-left:60px; }
}
/* ----------- END iPad Pro 12.9" ----------- */
/* start - Retina 2x Media Query for Pixel 2 devices */
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and ( min--moz-device-pixel-ratio: 2),
only screen and ( -o-min-device-pixel-ratio: 2/1),
only screen and ( min-device-pixel-ratio: 2),
only screen and ( min-resolution: 192dpi),
only screen and ( min-resolution: 2dppx) {
/* Retina styles here KOWD
#container { width:100%; max-width:980px; overflow: hidden; }
#menu_burger { margin-right: 1500px; } */
}
/* END - Retina 2x Media Query for Pixel 2 devices */
/* ----------- Galaxy S4, S5 and Note 3 ----------- */
/* Portrait and Landscape */
@media screen
and (device-width: 320px)
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 3) {
/* #container { width:100%; max-width:1440px; overflow: hidden; }
#content_top_title h1 { font-size:22px; margin-left:20px; line-height:36px; color:#000358; }
not working! see Portrait just below, this one works
*/
}
/* Portrait */
@media only screen
and (min-device-width: 320px)
and (max-device-width: 640px)
and (-webkit-min-device-pixel-ratio: 3)
and (orientation: portrait) {
#container { width:100%; max-width:1440px; overflow: hidden; }
#content_top_title h1 { line-height:52px; font-size:36px; color:#000000; }
.black_button { font-size:26px; margin-left:180px; padding: 40px 50px;}
#content_home_about_right h2 { line-height:26px; font-size: 2.5em; padding-right:80px; color:#000; }
#content_home_about_bottom h2 { color:#000; margin-left:180px; margin-right:10px; text-align:left; line-height:1.75em; font-size:2.5em; padding-top:10px; margin-bottom:40px; }
#content_home_work_right { width:80%; padding-right:200px; }
#content_home_work_right h2 { color:#000; margin-left:180px; margin-right:10px; padding-right:200px; text-align:left; line-height:1.25em; font-size:2.5em; padding-top:10px; margin-bottom:40px; }
#content_home_about_right { padding-right:180px; }
}
/* ----------- END Galaxy S4, S5 and Note 3 ----------- */
/* ----------- Galaxy S6 S9 ----------- */
/* Portrait */
@media screen
and (min-device-width: 320px)
and (max-device-width: 640px)
and (-webkit-min-device-pixel-ratio: 4)
and (orientation: portrait) {
#container { width:100%; max-width:1440px; overflow: hidden; }
#content_top_title h1 { line-height:52px; font-size:36px; color:#000000; }
.black_button { font-size:26px; margin-left:180px; padding: 30px 50px;}
#content_home_about_right h2 { line-height:26px; font-size:0.8em; padding-right:80px; color:#032587; }
#content_home_about_bottom h2 { width:100%; color:#032587; margin-left:180px; margin-right:10px; text-align:left; line-height:1.75em; font-size:2.5em; padding-top:10px; margin-bottom:40px; }
#content_home_work_right { width:80%; padding-right:200px; }
#content_home_work_right h2 { width:100%; color:#032587; margin-left:180px; margin-right:10px; padding-right:200px; text-align:left; line-height:1.25em; font-size:2.5em; padding-top:10px; margin-bottom:40px; }
#content_home_about_right { padding-right:180px; }
}
/* ----------- END Galaxy S6 ----------- */
/* Galaxy Tab 10.1 portrait */
@media
(max-device-width: 800px)
and (orientation: portrait) {
#container { width:100%; max-width:1418px; overflow: hidden; }
}
/* end Galaxy Tab 10.1 portrait */
/* mobile: footer background disparait pour écrans en bas de 640px
#titles_right_craftman { width:100%; margin-left:55px; }
#titles_right_craftman img { margin-left:100px; margin-bottom:20px; }
*/