
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
    font-family: iransans;
    color:var(--color-black)
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 23px;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a {text-decoration: none; color: var(--color-black); transition: all 0.2s;}


:root {
    --color-black: #444;
    --color-bg1: #F8F8F8;
    --color-border: #00000012;
    --colorlead: #676767;
    --colorAccent: #005d98;
    --color-border-red: #ffdfe5;;
    --colorAccentBG: rgba(249,25,66, 0.06);
    --radius: 7px;
	--lineHeight: 23px;
    --font11px: 11px;
    --font12px: 12px;
    --font13px: 13px;
    --font14px: 14px;
    --font15px: 15px;
    --font16px: 16px;
    --font17px: 17px;
    --font18px: 18px;
    --font19px: 19px;
	--font20px: 20px;
    --font21px: 21px;
    --font22px: 22px;
    --font23px: 23px;

}

* {
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    transition: all 0.2s;

}

.three-line {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.two-line {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.one-line {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@font-face {
	font-family: iransans;
	font-style: normal;
	font-weight: 500;
	font-display: swap;

	src: url('fonts/IRANYekanXFaNum-Regular.woff2') format('woff2');
}


a {transition: all 0.2s;}
a:hover {color:var(--color-accentHover)}

.tabs-wrapper ul {display: flex; flex-direction: row; flex-wrap: wrap; gap: 0.5rem;}
.tabs-wrapper ul li { margin-left:15px; margin-bottom: 20px;  }
.tabs-wrapper ul li a {background-color:#f6f6f8;padding:10px 20px;display: block; font-size:14px;border: 1px solid #eee;border-radius: var(--radius);}
.tabs-wrapper ul li a:hover {background-color:#eeeeee;}
.tabs-wrapper ul li:first-child a {border-right:  2px solid #4CAF50;}
.tabs-wrapper ul li:nth-child(2) a {border-right:  2px solid #FFC107;}
.tabs-wrapper ul li:nth-child(3) a {border-right:  2px solid #F44336;}
.tabs-wrapper ul li:nth-child(4) a {border-right:  2px solid #6c6c6c;}
.tabs-wrapper ul li:nth-child(5) a {border-right:  2px solid #03A9F4;}
.layout-container {margin: 0;}

/* Header */
.site-header__initial {display: none;}

.main-content__container {width: 100%;}
.block__content ,
.site-header__inner .container {max-width:1300px;margin: auto;}
.site-header__inner .container {display: flex; align-items: center; justify-content: space-between; }

body:not(.path-frontpage) {border-top:6px solid var(--color-accent);}
body.node-12 #main-wrapper {margin-top: 119px !important;}
body:not(.path-frontpage) #main-wrapper  {
    margin-top: 90px;
}
.path-frontpage #header { margin-bottom: 35px; }
body:not(.path-frontpage) #main-wrapper {
    margin-top: 140px;
}

.top-header {width:100%;border-bottom: 1px solid var(--color-border);}
.top-header .content {display:flex;justify-content: space-between;padding: 12px 0;}
.top-header .content .menu ul {display:flex; gap:1rem;  }
.top-header .content a , .top-header .content span {font-size:var(--font12px);}
.top-header .content .info { display: flex; gap: 0.5rem;  }
.top-header .content .info span:first-child {font-weight: bold;}


.robben {display: none;}
.robben svg {width: 40px; height: 40px; display: block;}
.robben .call-btn a { color: var(--color-accent); border: 1px solid var(--color-accent); border-radius: var(--radius); padding: 1px 15px; display: block; font-size: 13px; display: none;}
body.path-frontpage #header:not(.out-of-view) .robben svg * { stroke: #fff; }

/* #header {margin-bottom: 20px;} */

#header { display: flex ; align-content: center; box-shadow: 0 0 12px 0 rgba(0, 0, 0, .12); min-height: 61px; justify-content: center; flex-direction: column; flex-wrap: wrap; border-bottom: 1px solid var(--color-border); position: fixed; top: 0; background: #ffffff2b; backdrop-filter: blur(12px); z-index: 3; width: 100%;}
#header > div { width: 100%;}
#header .inner_container {display: flex; align-items: center; flex-wrap: nowrap;flex-basis: 40%;justify-content: flex-end; gap: 1rem;}
#header .inner_container .region {display:flex;align-items: center; gap:1rem}
#header .login-logo a {display:block;width: 100%;}
#header .login-logo a svg { width: 20px; height: 20px; display: block;}
#header .search-icon {display: none;}
#header .search-icon { width: 18px; height: 18px; display: block; cursor: pointer; box-sizing: unset; padding-right: 10px; }


#header .site-header__inner {border-bottom: 1px solid var(--color-border);padding: 15px 0; }
#header .site-branding {margin-left: 20px;}
#header .site-branding__logo {max-width: 50px;display: block;}
#header .site-branding__logo img {width: 100%; height: auto; display: block;}


#main-wrapper { position: relative; }
body:not(.path-frontpage) #page #main .main-content {max-width:1300px; margin: auto; display: flex; flex-wrap: wrap;width: 100%;justify-content: center;}

#main-wrapper::before {content: '';pointer-events: none; z-index: -1;position: absolute;top: 0;right: 0;bottom: 0;left: 0;background-image: url(https://zftpart.com/themes/custom/lucille/images/main-bg.png);--background-overlay: '';background-position: center center;background-repeat: no-repeat;background-size: cover;background-attachment: fixed;opacity: 0.16;}


.main-menu { flex-basis: 80%;}
.main-menu .menu { gap: 2rem; display: flex; align-items: center;}
#header .main-menu > ul li a ,
#header .top-header .content a,
#header .top-header .content span { color: #f1f1f1; }
#header .search-icon svg * {fill: #fff;}

#header.out-of-view, body:not(.path-frontpage) #header {
    background-color: #fff;
}

body:not(.path-frontpage) #header .main-menu > ul li a, 
body:not(.path-frontpage) #header .top-header .content a ,
body:not(.path-frontpage) #header .top-header .content span {color: var(--color-black);}
body:not(.path-frontpage) #header .search-icon svg * {fill: var(--color-black);}

#header.out-of-view .main-menu > ul li a ,
#header.out-of-view .top-header .content a ,
#header.out-of-view .top-header .content span {color: var(--color-black);}
#header.out-of-view .search-icon svg * {fill: var(--color-black);}



/* Mobile Menu */
.mobile-container { position: fixed; overflow: overlay; right: 0; top: 0; width: 90%; z-index: 200; padding: 0 20px; background: #fafafa; height: 100%;  padding-top: 20px; -webkit-transform: translateX(100%); transform: translateX(100%); transition: all 330ms ease-out;}
.mobile-container .robben {display: none;}
.mobile-container.active { -webkit-transform: none; transform: none;box-shadow: 2px 2px 33px #555;}
.mobile-container .close-btn-wrapper { width: 100%; display: flex; justify-content: flex-end;margin-bottom: 25px;}
.mobile-container .close-btn-wrapper svg {max-width: 30px; height: 30px;}
.mobile-menu .content > .menu { display: flex; flex-direction: column;}
.mobile-menu ul li { position: relative; padding: 0; list-style: none;}
.mobile-menu ul li a, .mobile-menu ul li span { font-size: 14px; width: 100%; display: block; padding: 15px 0; border-bottom: 1px solid #b5b5b561;}
.mobile-menu ul li.menu-item--expanded > ul { position: fixed; top: 0; right: 0; height: 100%; width: 90%; background: #fafafa; overflow: auto; -webkit-overflow-scrolling: touch; z-index: 3; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-transform: translateX(100%); transform: translateX(100%); -webkit-transition: all .3s; transition: all .3s; padding: 20px 15px;}
.mobile-menu ul li.menu-item--expanded > ul li.first:before { content: ''; position: absolute; right: 0; top: 13px; font-weight: 100; color: #676767; background: url(../../images/chevron-right.svg); width: 20px; height: 20px; background-repeat: no-repeat; background-position: 100% 100%;}
.mobile-menu ul li.menu-item--expanded:after { content: ''; position: absolute; left: 0; top: 14px; font-weight: 100; color: #676767; background: url(../../images/chevron-left.svg); width: 17px; height: 17px; background-repeat: no-repeat; background-position: 100% 100%;}
.mobile-menu ul li.menu-item--expanded ul li>span { display: none; text-align: left;}
.mobile-menu ul li.menu-item--expanded>ul.active { -webkit-transform: translateX(0); transform: translateX(0);}
#close-menu { color: #444; font-size: 33px; float: left; -webkit-transform: rotate(0deg); margin-bottom: 30px; -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; margin: 0;}





footer {background-color: #020407;display: flex;justify-content: center;padding: 80px 0 20px 0;}
footer > div {max-width: 1300px;width: 100%;}
footer .footer-links {gap: 2rem;border-bottom: 1px solid #3a3a3a;padding-bottom: 40px; display: grid; grid-template-columns: repeat(4, 1fr);}
footer .footer-links > div.region--footer-fourth {padding:0}
footer .footer-links {width:100%;}
footer .footer-links h2 {color:#fff;font-weight:bold;margin-bottom: 25px;font-size: 20px;border-bottom: 1px solid #3a3a3a;padding-bottom: 19px;}
footer .footer-links .menu {display:flex;flex-direction:column;gap: 0.7rem;}
footer .footer-links .menu li a , footer  span {color:#B9B9B9;font-size: 15px;}
footer .footer-links .row {margin-bottom:20px}


footer .copyright {padding: 20px;}
footer .copyright .block__content { display: flex; flex-direction: row; justify-content: space-between; align-items: center;}
footer .copyright .iconWrapper { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center;}
footer .copyright .iconWrapper div {width: 35px;height: 35px;margin-right: 10px;border-radius: 10px;border: 1px solid #b9b9b942;}
footer .copyright .iconWrapper div a {width: 100%;display: block;padding: 4px;}
footer .copyright .iconWrapper div a svg {display: block;width: 100%;height: 100%;fill: #B9B9B9;}

.g-1 {width: 100%;border-radius: var(--radius);margin-bottom: 20px;background-color: #fff;}
.g-1 h1 {font-size: 30px; margin-bottom: 15px; line-height: 42px; color: var(--colorAccent);}
.g-1 .grid {display:grid; grid-template-columns: repeat(2,1fr); gap: 1rem;}
.g-1 .card {padding: 10px;display:flex;flex-direction:column;border: 1px solid var(--color-border);border-radius: var(--radius);}
.g-1 .card label {margin-bottom:10px;font-size: var(--font14px);}
.g-1 .card select {width:100%;border: 1px solid var(--color-border); cursor: pointer; border-radius: 12px;background: #0072ca08;font-family: 'iransans';padding: 10px;}
.g-1 .btns {display: flex; justify-content: center; margin: 20px 0;}
.g-1 .btns button {color:#fff;background-color:var(--colorAccent);border:0;font-family:iransans;padding: 10px 43px;border-radius: var(--radius);font-size: 14px;cursor: pointer;}
.g-1 .btns button:hover {background-color:#004f82;}
.g-1 .row {display:flex; flex-direction:column; gap:1rem}
.g-1 table {width:100%;text-align:center;margin: 15px 0px;border-radius: var(--radius);overflow: hidden;}
.g-1 table thead {border-bottom:2px solid var(--colorAccent);background-color: #0072ca24;}
.g-1 table td , .g-1 table th {padding:10px;border-left: 1px solid var(--color-border);}
.g-1 table td:last-child, .g-1 table th:last-child {border:0}
.g-1 .note {margin-bottom: 8px;display: block;font-size: var(--font15px);line-height: 28px;}




.node-11 .node--view-mode-full {display:none;}
.node-11 .main-content__container {z-index: 1;}
.node-11 #main {display: flex; flex-direction: column; align-items: center;}
.node-11 main {flex-direction: row; display: flex; flex-wrap: wrap; width: 100%; justify-content: space-between; max-width: 1300px;}
.node-11 #content {display:flex; flex-direction: column; width: 100%; align-items: center;gap: 1rem; border-radius: var(--radius); background-color: #fff;}
.node-11 #content > div {width:100%;}
.j-2 {display:block;padding: 40px;border-radius: 7px;border: 1px solid var(--color-border);}
.j-2 h2 {font-size: var(--font23px);margin-bottom: 30px;}
.j-2 form { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem;}
.j-2 form > div {    position: relative; border: 1px solid var(--color-border); border-radius: var(--radius); padding: 10px;}
.j-2 form > div.js-form-item-description {flex: 0 0 100%;}
.j-2 form > div.js-form-item-description textarea {width:100%;}
.j-2 form > div label {margin-bottom: 10px; font-size: var(--font14px); display: block;}
.j-2 form > div input , .j-2 form > div select , .j-2 form > div textarea {width:100%;border: 1px solid var(--color-border); padding: 10px;     background: #0072ca08; border-radius: var(--radius); font-family: iransans;}
.j-2 form .form-actions {flex: 0 0 100%;}
.j-2 form .form-actions input {color: #fff;background-color: var(--colorAccent);border: 0;font-family: iransans;padding: 10px 43px;border-radius: var(--radius);font-size: 14px;cursor: pointer;}
.j-2 form .form-actions input:hover { background-color: #004f82;}
.j-2 form .captcha .captcha__description {display: none;}


.j-1 h1 {font-size: 30px;margin-bottom: 25px; color: var(--colorAccent);}
.j-1 .description * {font-size: var(--font13px);color: var(--colorlead);margin-bottom: 20px;}
.j-1 .card {padding: 50px;border-radius: 7px;border: 1px solid var(--color-border);}
.j-1 .card .content {display:flex;justify-content: space-between;font-size: var(--font23px);font-weight: bold;}
.j-1 .card * {color: #005d98;}


/* About Us Block Styles */
.f-10 .centeralOffice { min-height: 500px;}
.f-10 .showMap {position: absolute; top: 0; right: 0; max-height: 500px; width: 100%; height: 100%; overflow: hidden;}
.f-10 .showMap img {width: 100%; height: 100%; object-fit: cover;}
.f-10 .showMap:before {position: absolute;left: 0;top: 0;width: 100%;height: 100%; background: #171717; content: "";z-index: 1;mix-blend-mode: multiply;opacity: 0.5;}
.f-10 .office-info {z-index:1;position: relative;width: 50%;padding: 20px;background-color: #020407;display: flex;flex-direction: column;height: 100%;min-height: 500px;}
.f-10 .office-info .itemPropmap {margin-bottom: 15px;position: relative;padding-right: 25px;}
.f-10 .office-info .itemPropmap svg {width: 17px;position:absolute;right:0;top: 2px;}
.f-10 .office-info strong {color:#fff;font-size: var(--font19px);margin-bottom: 10px;display: block;}
.f-10 .office-info span , .f-10 .office-info a {color:#bbb; font-size: var(--font13px); }

.f-11 {padding-top: 70px;}
.f-11 *  {line-height: 28px;}
.f-11 p {margin-bottom: 8px;display: block;font-size: var(--font15px);}
.f-11 a { background-color: var(--colorAccentBG); color: var(--colorAccent); padding: 3px 10px; display: inline-block; border-radius: var(--radius);}
.f-11 h2, .f-11 h2 a, .f-11 h2 span, .f-11 h2 strong { line-height: 30px; font-size: 22px; margin: 5px 0 15px 0; text-align: right; width: 100%; display: inline-block;}
