@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');

@import url(../fonts/font.css);


body {
    font-family: 'Roboto', sans-serif;
    height: 100%;
}
/* Background Color */
.workHover { background-color: rgba(0,0,0,.4); }
/*Colors*/
.colorBlack { color: #000!important; }
/* Font Weight */
.fontBold { font-weight: 700; }
.fontMedium { font-weight: 500; }
.fontRegular { font-weight: 400; }
/* OTHERS */
.bgTransparent { background-color: transparent; }
.promoTitle { font-size: 194px; color: #fff; opacity: .4; font-weight: 700; }
.langList { list-style-type: none; padding: 0; display: flex; justify-content: flex-end; }
.vidBg { height: 100vh; }
.vidBg video { position: fixed; right: 0; left: 0; min-width: 100vw; min-height: 100vh;  object-fit: cover; }
.sec { margin-top: 115px; background-color: #000; }
.sec p,
.vidBg p { font-size: 51px; font-family: "HelveticaNeueLTStd-BdOu"; color: #fff; line-height: 58px; text-transform: uppercase; }
.socialMediaWrapper { list-style-type: none; padding: 0; margin: 0; display: flex; }
.socialMediaWrapper li { margin-right: 15px; }
.imgResponsive { width: 100%; }
a.workLink { color: #fff; font-size: 35px; font-weight: 400; text-align: center; }
a.workLink > div > div { display: none; }
a.workLink:hover > div > div { display: block; }
a.workLink:hover > div > figure { position: relative;  }
a.workLink > div > figure::after { background-color: rgba(0,0,0,.0); transition: all .2s ease-in-out; content: ""; display: block; } 
a.workLink:hover > div > figure::after { background-color: rgba(0,0,0,.4); position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
a.workLink p { margin: 0; }
a.workLink .subTitle { font-weight: 500; font-size: 50px; }
.line { border-color: #000; border-width: 2px; max-width: 1580px; margin-left: auto; }
.brands:hover img { filter: grayscale(1); }
/* MAIN */
div#main { position: relative; }
/* HEADER */
header { padding: 30px 0; background-color: #fff; position: fixed; z-index: 99; top: 0; left: 0; right: 0; }
header a.menu { display: inline-block; background: url(../img/icons/menu-ico.png) no-repeat center; width: 80px; height: 50px; background-size: contain; }
div.menuWrapper { opacity: 0; position: absolute; right: 0; top: 0; padding-top: 0px; border-radius: 10px 26px 10px 10px; z-index: -1; width: 0; height: 0; text-align: right; padding-right: 0;  transition: all .2s ease-in-out; overflow: hidden;}
div.menuWrapper.opened { width: 220px; height: auto; padding-right: 15px; padding-top: 90px; opacity: 1; }
div.menuWrapper ul { padding: 0; list-style-type: none; }
div.menuWrapper ul li a { font-size: 20px; line-height: 28px; color: #fff; background: #000; font-weight: 700; text-transform: uppercase; text-decoration: none; display: inline-block; position: relative; padding: 0 5px; }
div.menuWrapper ul li a:hover { background-color: #fff; color: #000; }
/*:before { position: absolute; top: 50%; transform: translateY(-50%); width: 31px; height: 6px; left: -60px; content: ""; display: inline-block; background-color: #000; border-radius: 5px; }*/
a#lang { font-size: 25px; color: #000; font-weight: 700; text-decoration: none; background: url(../img/arrow-lang.png) no-repeat left; padding-left: 25px; }
/* SECTION */
section { height: 100vh; position: relative; }
section.otherPage { margin-top: 116px; margin-bottom: 101px; height: auto; }
section.otherPage figure { margin: 0; }
section.otherPage.contact { height: calc(100vh - 50%); margin-top: 30vh; }
section.otherPage.contact p { font-size: 22px; color: #000 }
section.otherPage.contact p a { color: #000; text-decoration: none; }
section.otherPage.contact textarea { resize: none; width: 100%; border: 1px solid #eabad8; }
section.otherPage.contact textarea:focus-visible { outline: none; }
section.otherPage.contact div.form { max-width: 500px; width: 100%; display: block; }
section.otherPage.contact div.form input[type="submit"] { background-color: #eabad8; color: #000; font-size: 15px; font-weight: 400; border: 0; padding: 10px 15px; cursor: pointer; transition: all .2s ease-in-out; }
section.otherPage.contact div.form input[type="submit"]:hover { background-color: #000; color: #eabad8; }
section.otherPage .table > div { border-right: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0; padding-top: 50px; padding-bottom: 50px;}
section.otherPage .table > div:nth-child(3n) { border-right: 0; }
section.otherPage .table > div.borderBottomNone { border-bottom: 0; }
section.workDetail {  height: auto; margin-top: 116px; margin-bottom: 110px; }
section.workDetail h2 { margin-top: 100px; font-weight: 700; color: #000; font-size: 40px; margin-bottom: 0; text-transform: uppercase; }
section.workDetail p { font-size: 30px; font-weight: 400; color: #000; margin-top: 5px; margin-bottom: 25px!important; position: relative; }
section.workDetail p.withLine::after { content: ""; position: absolute; right: 0; left: 0; width: 100%; background-color: #000; height: 2px; bottom: -20px; }
section.workDetail ul { list-style-type: none; padding: 0; display: flex; align-items: center; justify-content: space-around; }
section.workDetail ul li { margin-top: 100px; }
section.workDetail ul li figure { margin-bottom: 0; }
.services span.title { font-weight: 500; color: #000; }
/* FOOTER */
footer { padding: 30px 0; background-color: #fff; position: relative; }

#loading {
    background: url('../img/loading.gif') no-repeat center center;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 9999999;
    background-color: #fff;
}

a.workLink p { font-size: 24px; }
.bgWhiteColor { background-color: #fff!important; }

.uk-offcanvas-overlay { background-color: rgba(0,0,0,.4); }