:root { --alb: #fff; --negru: #000; --gri: #666; --gri_inchis: #333; --gri_deschis: #999; --gri_deschis1: #ccc; --albastru_deschis: #1e8feb; --albastru: #1474bf; --albastru_inchis1: #00569c; --albastru_inchis2: #0d4c80; --transparent:rgba(0,0,0,0); --small: 1rem; --p: 1.2rem; --h1: 4rem; --h2: 2.3rem; --h3: 2rem; --h4: 1.5rem; --h5: 1.2rem; --h6: 1rem; } ::selection { background: var(--albastru); color:var(--alb); } * { padding:0px; margin:0px; font-family: 'Titillium Web', sans-serif; } .paginatie { width:80%; padding:0px 10%; margin:0 auto; position: relative; max-width: 1300px; } .linie { width: 100%; float: left ;} .gri_deschis { color: var(--gri_deschis);} .albastru { color: var(--albastru);} .albastru_deschis { color: var(--albastru_deschis);} .albastru_inchis2 { color: var(--albastru_inchis2);} .transparet { color: var(--transparent);} .negru { color: var(--negru);} .alb { color: var(--alb);} .gri { color: var(--gri);} .mare { font-size: var(--h1);} .mediu { font-size: var(--h2);} .mic { font-size: var(--h3);} .mic_mic { font-size: var(--h4);} .centru { text-align: center;} a.btn { display: inline-block; padding:15px 30px; margin: 0px 5px; font-size: var(--p); color: var(--alb); background: linear-gradient(130deg, var(--albastru) 0%, var(--alb) 100%); background-size: 400% 400%; background-position: 0%; text-decoration: none; font-weight: 400; border: 1px solid var(--albastru); border-radius: 5px; transition: all 0.2s ease-in-out;} a.btn:hover { color: var(--alb); background: linear-gradient(130deg, var(--albastru) 0%, var(--albastru_inchis1) 100%); background-position: 100%; transition: all 0.2s ease-in-out;} #IFG_Top { width: 100%; float:left; background: url('../img/bg1.jpg'); background-size: cover; } #IFG_Top .container { width: 100%; float: left; padding: 80px 0px; background: linear-gradient(180deg, var(--transparent) 0%, var(--negru) 100%); } #IFG_Top_Bar { width: 100%; float: left; background-color: var(--alb); display: flex; box-shadow: 0px 0px 30px 0px var(--gri_deschis); border-radius: 5px; } #IFG_Logo { width: 22%; padding: 20px 6% 20px 2%; display: flex; float: left; background: linear-gradient(130deg, var(--albastru) 0%, var(--albastru_inchis1) 100%); clip-path: polygon(0 0, 100% 0%, 75% 100%, 0% 100%); border-top-left-radius: 5px; border-bottom-left-radius: 5px; } #IFG_Logo img { width: 100%; height: auto; max-width: 300px; flex-direction: column; justify-content: center; align-items: center; } #IFG_Menu { width: 70%; float: right; position: relative; display: flex; } #IFG_Menu li { display: inline; float: left; } #IFG_Menu li a { display: inline-block; padding:15px 30px; margin: 0px 5px; font-size: var(--p); color: var(--gri); text-decoration: none; font-weight: 400; border: 3px solid var(--transparent); transition: all 0.2s ease-in-out;} #IFG_Menu li a:hover { color: var(--albastru); border-bottom: 3px solid var(--albastru_inchis1); transition: all 0.2s ease-in-out;} #IFG_Menu li a.active { color: var(--albastru); border-bottom: 3px solid var(--albastru); transition: all 0.2s ease-in-out;} #IFG_Menu #navigation { width: 100%; float: left; display: flex; flex-direction: column; justify-content: center; align-items: center; } #IFG_Menu #mobile_btn { width: 70%; max-width: 64px; display: none; cursor: pointer; } #IFG_Menu #mobile_btn .fil0 { fill: var(--albastru); transition: all 0.2s ease-in-out;} #IFG_Menu #mobile_btn .fil1 { fill: var(--alb); transition: all 0.2s ease-in-out;} #IFG_Menu #mobile_btn:hover .fil0 { fill: var(--albastru_deschis); transition: all 0.2s ease-in-out;} #IFG_Menu #mobile_btn:hover .fil1 { fill: var(--alb); transition: all 0.2s ease-in-out;} #IFG_Continut1 { width: 100%; padding: 250px 0px; text-align: center; float: left; } #IFG_Continut1 h1 { font-size: var(--h1); color: var(--alb); } #IFG_Continut1 h2 { font-size: var(--h2); color: var(--alb); } #IFG_Continut1 h3 { font-size: var(--h3); color: var(--alb); } #IFG_Continut1 h4 { font-size: var(--h4); color: var(--alb); } #IFG_Continut1 p { font-size: var(--p); color: var(--alb); font-weight: 700; } #IFG_Continut1 a { text-decoration: none; font-size: var(--p); color: var(--alb); font-weight: 700; transition: all 0.2s ease-in-out; } #IFG_Continut1 a:hover { color: var(--albastru); transition: all 0.2s ease-in-out; } #IFG_Continut2 { width: 100%; float: left; } #IFG_Continut2 h1 { font-size: var(--h1); color: var(--albastru); } #IFG_Continut2 h2 { font-size: var(--h2); color: var(--albastru); } #IFG_Continut2 h3 { font-size: var(--h3); color: var(--albastru); } #IFG_Continut2 h4 { font-size: var(--h4); color: var(--albastru); } #IFG_Continut2 p { font-size: var(--p); color: var(--gri); } #IFG_Continut2 .contact { background-color: var(--alb); width: 100%; float: left; position: relative; top: -100px; border-radius: 5px; overflow: hidden; display: flex; margin-bottom: 50px; } #IFG_Continut2 .contact { background: linear-gradient(180deg, var(--albastru) 0%, var(--albastru_inchis1) 100%); } #IFG_Continut2 .contact .contact_tab1 { width: 37%; float: left; padding: 20px 3%; } #IFG_Continut2 .contact h2 { font-size: var(--h2); color: var(--alb); } #IFG_Continut2 .contact p { font-size: var(--p); color: var(--alb); } #IFG_Continut2 .contact .contact_tab2 { width: 30%; float: left; padding: 20px 1.5%; display: flex; flex-direction: column; justify-content: center; align-items: center; } #IFG_Continut2 .contact .contact_tab2 a { font-size: var(--h3); font-weight: bold; color: var(--alb); text-decoration: none; transition: all 0.2s ease-in-out;} #IFG_Continut2 .contact .contact_tab2 a:hover { color: var(--alb); filter: drop-shadow(0px 0px 10px var(--negru)); transition: all 0.2s ease-in-out; } #IFG_Continut2 .contact .contact_tab3 { width: 20%; float: left; padding: 20px 1.5%; display: flex; flex-direction: row; justify-content: center; align-items: center; } #IFG_Continut2 .contact .contact_tab3 a { font-size: var(--h1); font-weight: bold; color: var(--alb); text-decoration: none; display: inline; transition: all 0.2s ease-in-out;} #IFG_Continut2 .contact .contact_tab3 a:hover { color: var(--alb); filter: drop-shadow(0px 0px 10px var(--negru)); transition: all 0.2s ease-in-out; } #IFG_Continut3 { width: 100%; float: left; background: url('../img/bg5.jpg'); background-size: cover; } #IFG_Continut3 h1 { font-size: var(--h1); color: var(--albastru); } #IFG_Continut3 h2 { font-size: var(--h2); color: var(--albastru); } #IFG_Continut3 h3 { font-size: var(--h3); color: var(--albastru); } #IFG_Continut3 h4 { font-size: var(--h4); color: var(--albastru); } #IFG_Continut3 p { font-size: var(--p); color: var(--gri); } #IFG_Continut3 .servicii {width: 100%; float: left; text-align: center; padding-top: 50px; padding-bottom: 250px; } #IFG_Continut3 .servicii .icon { max-width: 100px; margin: auto; } #IFG_Continut3 .servicii .icon .fil0 { fill: var(--albastru_inchis2); } #IFG_Continut3 .servicii .div50 { width: 50%; margin: 0 auto;} #IFG_Continut3 .servicii .div100 { width: 100%; padding: 40px 0px; } #IFG_Continut3 .servicii .div100 .tab33 { width: 26%; margin: 0 1.5%; padding: 50px 2%; float: left; background: url('../img/bg3.png'); background-size: cover; text-align: left; box-shadow: 0px 0px 30px 0px var(--gri_deschis1); border-radius: 5px; } #IFG_Continut3 .servicii .div100 .tab33 a { display: block; font-size: var(--p); color: var(--albastru); text-decoration: none; transition: all 0.2s ease-in-out;} #IFG_Continut3 .servicii .div100 .tab33 a:hover { color: var(--albastru_deschis); transition: all 0.2s ease-in-out; } #IFG_Continut4 { width: 100%; padding: 250px 0px; float: left; background: url('../img/bg4.jpg'); background-size: cover; } #IFG_Continut4 h1 { font-size: var(--h1); color: var(--albastru); } #IFG_Continut4 h2 { font-size: var(--h2); color: var(--albastru); } #IFG_Continut4 h3 { font-size: var(--h3); color: var(--albastru); } #IFG_Continut4 h4 { font-size: var(--h4); color: var(--albastru); } #IFG_Continut4 p { font-size: var(--p); color: var(--albastru); font-weight: 400; } #IFG_Continut4 .tab50 { width: 40%; margin: 0px 5%; float: left; } #IFG_Continut4 .tab50 img {width: 100%; max-width: 500px; filter: drop-shadow(0px 0px 10px var(--gri)); } #IFG_Continut5 { width: 100%; padding: 250px 0px; float: left; background: url('../img/bg2.jpg'); background-size: cover; text-align: center; } #IFG_Continut5 h1 { font-size: var(--h1); color: var(--albastru); } #IFG_Continut5 h2 { font-size: var(--h2); color: var(--albastru); } #IFG_Continut5 h3 { font-size: var(--h3); color: var(--albastru); } #IFG_Continut5 h4 { font-size: var(--h4); color: var(--albastru); } #IFG_Continut5 p { font-size: var(--p); color: var(--gri); font-weight: 400; } #IFG_Continut5 .div50 { width: 50%; margin: 0 auto; } #IFG_Continut5 .div100 { width: 70%; margin: 0 auto; padding: 50px 0px; } #IFG_Continut5 .div33 { width: 33%; float: left; margin: 0 auto; } #IFG_Continut5 .foto { width: 100%; float:left; } #IFG_Continut5 .foto img { width: 90%; margin: 5%; border-radius: 5px; max-width: 400px; cursor: pointer; transition: all 0.2s ease-in-out; } #IFG_Continut5 .foto img:hover { filter:brightness(1.2); transition: all 0.2s ease-in-out; } #IFG_Continut5 .div100_float { width: 100%; float: left; padding-top: 30px; } #IFG_Continut6 { width: 100%; padding: 250px 0px; float: left; background: url('../img/bg7.jpg') repeat-y; background-size: contain; text-align: left; } #IFG_Continut6 h1 { font-size: var(--h1); color: var(--albastru); } #IFG_Continut6 h2 { font-size: var(--h2); color: var(--albastru); } #IFG_Continut6 h3 { font-size: var(--h3); color: var(--albastru); } #IFG_Continut6 p { font-size: var(--p); color: var(--gri); font-weight: 400; } #IFG_Continut6 .div100 { width: 100%; float: left; padding: 150px 0px; } #IFG_Continut6 .div50 { width: 50%; margin: 0 auto; float: right; } #IFG_Continut6 .div50 img { width: 100%; max-width: 450px; } #IFG_Continut6 .img_centru1 { display: none; } #IFG_Continut6 .ex_piese { width: 100%; padding: 25px 0px; float: left; } #IFG_Continut6 .ex_piese .h4 { width: 100%; float: left; color: var(--gri); margin: 50px 0px; } #IFG_Continut6 .ex_piese .ex_piese_item { width: 20%; max-width: 100px; height: 150px; float: left; text-align: center; } #IFG_Continut6 .ex_piese .ex_piese_item p {font-size: var(--small);} #IFG_Continut6 .ex_piese .ex_piese_item img.icon_piese {max-width: 100px;} #IFG_Continut7 { width: 100%; padding: 250px 0px; float: left; background: url('../img/bg7.jpg') repeat-y; background-size: contain; text-align: center; } #IFG_Continut7 .galerie_img { float: left; width: 15%; padding: 10px; } #IFG_Continut7 .galerie_img img { width: 100%; max-width: 100%; border-radius: 5px; border: 5px solid var(--transparent); transition: all 0.2s ease-in-out; } #IFG_Continut7 .galerie_img img:hover { border: 5px solid var(--albastru); filter:brightness(1.2); transition: all 0.2s ease-in-out; } #IFG_Continut7 p { font-size: var(--p); color: var(--gri); font-weight: 400; } #IFG_Google_Maps { width: 100%; float:left; } #IFG_Map_Placeholder { width: 100%; float:left; height: 800px; display: block; } #IFG_Fotter { width: 100%; padding: 250px 0px; float:left; background: url('../img/bg6.jpg'); background-size:cover; } #IFG_Fotter .info { width: 100%; float: left; } #IFG_Fotter .tab33:nth-of-type(odd) { width:29%; padding-right: 4%; float:left; } #IFG_Fotter .tab33:nth-of-type(even) { width:24%; float:left; padding: 0px 4%; } #IFG_Fotter .tab33 img { max-width: 100%; max-width: 200px; filter:grayscale(0); } #IFG_Fotter .tab33 h4 { font-size: var(--h4); color: var(--gri_deschis); border-bottom: 1px solid var(--albastru); } #IFG_Fotter .tab33 p { font-size: var(--p); color: var(--gri); } #IFG_Fotter .tab33 a { font-size: var(--p); text-decoration: none; color: var(--gri); padding: 5px 0px; margin: 0px; display: block; transition: all 0.2s ease-in-out; } #IFG_Fotter .tab33 a:hover { color: var(--albastru); transition: all 0.2s ease-in-out; } #IFG_Fotter .tab33 .icon a { display: inline;} #IFG_Fotter .copyright { width: 100%; float: left; margin-top:50px; padding-top: 50px; border-top: 1px solid var(--gri_deschis1); text-align: center; } #IFG_Fotter .copyright p { color: var(--gri_deschis1); font-size: var(--small); } #IFG_Fotter .copyright .infoghid { color: var(--gri_deschis1); font-size: var(--small); } #IFG_Fotter .copyright .infoghid a { color: var(--gri_deschis1); font-size: var(--small); text-decoration: none; transition: all 0.2s ease-in-out; } #IFG_Fotter .copyright .infoghid a:hover { color: var(--albastru); transition: all 0.2s ease-in-out; } @media all and (max-width: 1000px) { :root { --small: 0.9rem; --p: 1.2rem; --h1: 2.5rem; --h2: 2rem; --h3: 1.5rem; --h4: 1.5rem; --h5: 1.2rem; --h6: 1rem; } #IFG_Top .container { padding: 20px 0px;} #IFG_Logo { width: 60%; padding: 5%; clip-path: unset;} #IFG_Menu { width: 30%; } #IFG_Menu #navigation { display: none; padding: 20px 20%; width: 200px; position: absolute; z-index: 999; right: 0px; top: 100%; background-color: var(--alb); box-shadow: 0px 0px 30px 0px var(--gri_deschis); } #IFG_Menu li { width:100%; text-align: center;} #IFG_Menu li a { display: block; text-align: center; padding:15px 30px; margin: 0px; } #IFG_Menu li a:hover { color: var(--albastru); border-bottom: 3px solid var(--albastru_inchis1); transition: all 0.2s ease-in-out;} #IFG_Menu li a.active { color: var(--albastru); border-bottom: 3px solid var(--albastru); transition: all 0.2s ease-in-out;} #IFG_Menu #mobile_btn { display: flex; margin: auto; } #IFG_Continut1 { padding: 50px 0px 150px 0px; } #IFG_Continut2 .contact { display: block;} #IFG_Continut2 .contact .contact_tab1 { width: 80%; float: left; padding: 20px 10%; display: inline; text-align: center; } #IFG_Continut2 .contact .contact_tab2 { width: 80%; float: left; padding: 20px 10%; display: inline; text-align: center;} #IFG_Continut2 .contact .contact_tab3 { width: 80%; float: left; padding: 20px 10%; display: inline; text-align: center;} #IFG_Continut3 .servicii .div50 { width: 80%; margin: 0 auto;} #IFG_Continut3 .servicii .div100 .tab33 { width: 80%; margin: 5%; padding: 50px 5%; } #IFG_Continut4 { padding: 150px 0px; } #IFG_Continut4 .tab50 { width: 90%; margin: 0px 5%; float: left; } #IFG_Continut5 { padding: 150px 0px; } #IFG_Continut5 .div50 { width: 90%; margin: 0px 5%; } #IFG_Continut6 { padding: 150px 0px; } #IFG_Continut6 .div50 { width: 100%; margin: 0 auto;} #IFG_Continut6 .div100 { width: 100%; float: left; padding: 50px 0px; } #IFG_Continut6 .img_centru1 { display: inline; } #IFG_Continut6 .img_centru2 { display: none; } #IFG_Continut6 .ex_piese .ex_piese_item { width: 25%; } #IFG_Continut6 .ex_piese .ex_piese_item img.icon_piese {max-width: 50px;} #IFG_Continut7 { padding: 150px 0px; } #IFG_Continut7 .galerie_img { float: left; width: 29%; padding: 5px; } #IFG_Fotter { padding: 150px 0px; } #IFG_Fotter .tab33:nth-of-type(odd) { width:100%; float:left; margin: 50px 0px; } #IFG_Fotter .tab33:nth-of-type(even) { width:100%; float:left; padding:0; margin: 50px 0px; } }