1 line
20 KiB
Plaintext
1 line
20 KiB
Plaintext
{"version":3,"sources":["..\\style-scss\\_variables.scss","..\\style-scss\\accesories.scss","..\\style-scss\\_mixins.scss"],"names":[],"mappings":"AAmBA,WACC,sBAAA,CACA,+HAAA,CAEA,eAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,sBAAA,CACA,yIAAA,CAEA,eAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,sBAAA,CACA,qHAAA,CAEA,eAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,sBAAA,CACA,iIAAA,CAEA,eAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,2BAAA,CACA,iHAAA,CAEA,kBAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,sBAAA,CACA,qHAAA,CAEA,kBAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,sBAAA,CACA,mHAAA,CAEA,eAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,sBAAA,CACA,6HAAA,CAEA,eAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,sBAAA,CACA,iHAAA,CAEA,gBAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,sBAAA,CACA,6HAAA,CAEA,gBAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,sBAAA,CACA,iHAAA,CAEA,eAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,sBAAA,CACA,uHAAA,CAEA,kBAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,4BAAA,CACA,uIAAA,CAEA,gBAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,4BAAA,CACA,2HAAA,CAEA,gBAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,uBAAA,CACA,yDAAA,CACA,eAAA,CACA,iBAAA,CACA,iBAAA,CAED,WACC,uBAAA,CACA,2DAAA,CACA,eAAA,CACA,iBAAA,CACA,iBAAA,CAED,WACC,uBAAA,CACA,0DAAA,CACA,eAAA,CACA,iBAAA,CACA,iBAAA,CAGD,WACC,uBAAA,CACA,4DAAA,CACA,eAAA,CACA,iBAAA,CACA,iBAAA,CAED,WACC,uBAAA,CACA,wDAAA,CACA,eAAA,CACA,iBAAA,CACA,iBAAA,CChLD,QACC,eAAA,CACA,eAAA,CAEA,WACC,iBAAA,CACA,eAAA,CACA,SAAA,CACA,QAAA,CACA,YAAA,CACA,kBAAA,CACA,sBAAA,CACA,oBAAA,CAAA,eAAA,CCNE,yBDSD,mBACC,UAAA,CACA,iBAAA,CACA,QAAA,CACA,UAAA,CACA,QAAA,CACA,WAAA,CACA,+BAAA,CACA,kBDnBK,CAAA,CCuBP,cACC,iBAAA,CACA,YAAA,CACA,qBAAA,CACA,YAAA,CACA,SAAA,CACA,eDnCM,CCqCN,kBACC,WAAA,CACA,eAAA,CACA,YAAA,CACA,kBAAA,CACA,wBAAA,CACA,kBAAA,CAAA,eAAA,CACA,0BAAA,CACA,wBD3CS,CC6CV,gBACC,aDpCQ,CCqCR,cAAA,CACA,eAAA,CACA,iBAAA,CCjCA,yBDZH,WAiDE,cAAA,CACA,YAAA,CAAA,CAKH,QACC,kBAAA,CAIE,gCACC,WAAA,CACA,kBDlES,CEgBT,yBDuDC,iCACC,0BAAA,CAAA,CAOH,gCACC,YAAA,CACA,kBAAA,CACA,kBAAA,CACA,sBAAA,CACA,oBAAA,CAAA,eAAA,CACA,YAAA,CACA,kBDtFS,CC2FV,sBACC,eAAA,CACA,SAAA,CACA,QAAA,CAGC,2BACC,iBAAA,CACA,aAAA,CACA,sBAAA,CAAA,iBAAA,CACA,kBAAA,CACA,kBAAA,CAEA,+BAAA,CACA,kCACC,eAAA,CAGF,4BACC,cAAA,CACA,eAAA,CACA,kBAAA,CAED,iCACC,cAAA,CACA,eAAA,CACA,2BAAA,CAEA,yCACC,UAAA,CACA,UAAA,CAED,wCACC,UAAA,CASH,uCACC,eAAA,CACA,gBAAA,CACA,gBAAA,CACA,iBAAA,CACA,cAAA,CAGD,+BACC,aDpIO,CCqIP,cAAA,CACA,eAAA,CACA,eAAA,CACA,aAAA,CClID,yBDsIA,6BACC,OAAA,CACA,uCACC,eAAA,CACA,cAAA,CACA,iBAAA,CAID,kCACC,0BAAA,CAAA,CAQN,QACC,kBAAA,CAEA,WACC,cAAA,CACA,eAAA,CACA,eAAA,CAGD,kBACC,8BAAA,CAEA,4BACC,gBAAA,CACA,iBAAA,CACA,mBAAA,CAEA,+BACC,kBAAA,CAED,8BACC,cAAA,CACA,eAAA,CACA,eAAA,CACA,aAAA,CAED,gCACC,eAAA,CCnLA,yBDiKH,kBAuBE,iBAAA,CACA,4BACC,YAAA,CACA,qBAAA,CACA,kBAAA,CACA,iBAAA,CACA,iBAAA,CAAA,CAMF,6BACC,YAAA,CACA,qBAAA,CACA,oBAAA,CAAA,eAAA,CACA,gBAAA,CAEA,iCACC,YAAA,CACA,kBAAA,CACA,oBAAA,CAAA,eAAA,CACA,kBAAA,CAEA,oCACC,SAAA,CACA,QAAA,CACA,eAAA,CAEA,uCACC,YAAA,CACA,kBAAA,CACA,kBAAA,CACA,oBAAA,CAAA,eAAA,CACA,wDACC,iBAAA,CAGD,yCACC,cAAA,CACA,eAAA,CChOH,yBDuOD,6BACC,gBAAA,CACA,qBAAA,CACA,kBAAA,CACA,YAAA,CAAA,CAMJ,QACC,mBAAA,CClPG,yBDiPJ,QAGE,mBAAA,CAAA,CAGA,mBACC,kBAAA,CAGA,6BACC,iBAAA,CACA,aAAA,CACA,UAAA,CACA,eAAA,CACA,wBAAA,CAEA,YAAA,CACA,6BAAA,CACA,qBAAA,CAAA,gBAAA,CACA,yHACC,CAKD,qCACC,UAAA,CACA,iBAAA,CACA,MAAA,CACA,KAAA,CACA,QAAA,CACA,SAAA,CACA,kBD9RI,CCgSL,oCACC,UAAA,CACA,iBAAA,CACA,OAAA,CACA,KAAA,CACA,QAAA,CACA,SAAA,CACA,kBDvSI,CC0SL,gCACC,cAAA,CACA,eAAA,CACA,kBAAA,CAED,gCACC,cAAA,CACA,eAAA,CACA,kBAAA,CAED,+BACC,cAAA,CACA,eAAA,CACA,aAAA,CACA,eAAA,CAED,iCACC,WAAA,CACA,UAAA,CACA,qBAAA,CAAA,kBAAA,CACA,yBAAA,CAAA,sBAAA,CACA,0BAAA,CAAA,qBAAA,CACA,aAAA,CAGD,6CACC,wBAAA,CACA,gBAAA,CAED,6CACC,wBAAA,CAGD,0CACC,qBAAA,CACA,gBAAA,CAED,0CACC,qBAAA,CAGD,wCACC,mBAAA,CACA,gBAAA,CAED,wCACC,mBAAA,CAGD,wCACC,mBAAA,CChVD,yBD+UA,wCAIE,mBAAA,CAAA,CAGF,wCACC,mBAAA,CCvVD,yBD2PD,6BAgGE,yBAAA,CACA,iIACC,CAQD,wBAAA,CACA,+BACC,4BAAA,CAAA","file":"accesories.css","sourcesContent":["//* Colors\n$cWhite: #ffffff;\n$cGray: #bababa;\n$cLightGray: #f6f6f6;\n$cCloud: #f0f0f0;\n$cSand: #e3e1de;\n$cSandDarker: #d9d9d9;\n$cBlack: #010101;\n\n$cTxtWhite: #ffffff;\n$cTxtCloud: #f0f0f0;\n$cTxtGray: #bababa;\n$cTxtGrayDarker: #a1a0a0;\n$cTxtBlack: #010101;\n\n$fontNewOrder: \"New Order\", sans-serif;\n$fontURWForm: \"URW Form\", sans-serif;\n\n//* Fonts\n@font-face {\n\tfont-family: \"URW Form\";\n\tsrc: url(\"/layout/fonts/URWForm-LightItalic.woff2\") format(\"woff2\"),\n\t\turl(\"/layout/fonts/URWForm-LightItalic.woff\") format(\"woff\");\n\tfont-weight: 300;\n\tfont-style: italic;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"URW Form\";\n\tsrc: url(\"/layout/fonts/URWForm-ExtraLightItalic.woff2\") format(\"woff2\"),\n\t\turl(\"/layout/fonts/URWForm-ExtraLightItalic.woff\") format(\"woff\");\n\tfont-weight: 200;\n\tfont-style: italic;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"URW Form\";\n\tsrc: url(\"/layout/fonts/URWForm-Medium.woff2\") format(\"woff2\"),\n\t\turl(\"/layout/fonts/URWForm-Medium.woff\") format(\"woff\");\n\tfont-weight: 500;\n\tfont-style: normal;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"URW Form\";\n\tsrc: url(\"/layout/fonts/URWForm-MediumItalic.woff2\") format(\"woff2\"),\n\t\turl(\"/layout/fonts/URWForm-MediumItalic.woff\") format(\"woff\");\n\tfont-weight: 500;\n\tfont-style: italic;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"URW Form Demi\";\n\tsrc: url(\"/layout/fonts/URWForm-Demi.woff2\") format(\"woff2\"),\n\t\turl(\"/layout/fonts/URWForm-Demi.woff\") format(\"woff\");\n\tfont-weight: normal;\n\tfont-style: normal;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"URW Form\";\n\tsrc: url(\"/layout/fonts/URWForm-Italic.woff2\") format(\"woff2\"),\n\t\turl(\"/layout/fonts/URWForm-Italic.woff\") format(\"woff\");\n\tfont-weight: normal;\n\tfont-style: italic;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"URW Form\";\n\tsrc: url(\"/layout/fonts/URWForm-Light.woff2\") format(\"woff2\"),\n\t\turl(\"/layout/fonts/URWForm-Light.woff\") format(\"woff\");\n\tfont-weight: 300;\n\tfont-style: normal;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"URW Form\";\n\tsrc: url(\"/layout/fonts/URWForm-ThinItalic.woff2\") format(\"woff2\"),\n\t\turl(\"/layout/fonts/URWForm-ThinItalic.woff\") format(\"woff\");\n\tfont-weight: 100;\n\tfont-style: italic;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"URW Form\";\n\tsrc: url(\"/layout/fonts/URWForm-Bold.woff2\") format(\"woff2\"),\n\t\turl(\"/layout/fonts/URWForm-Bold.woff\") format(\"woff\");\n\tfont-weight: bold;\n\tfont-style: normal;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"URW Form\";\n\tsrc: url(\"/layout/fonts/URWForm-BoldItalic.woff2\") format(\"woff2\"),\n\t\turl(\"/layout/fonts/URWForm-BoldItalic.woff\") format(\"woff\");\n\tfont-weight: bold;\n\tfont-style: italic;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"URW Form\";\n\tsrc: url(\"/layout/fonts/URWForm-Thin.woff2\") format(\"woff2\"),\n\t\turl(\"/layout/fonts/URWForm-Thin.woff\") format(\"woff\");\n\tfont-weight: 100;\n\tfont-style: normal;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"URW Form\";\n\tsrc: url(\"/layout/fonts/URWForm-Regular.woff2\") format(\"woff2\"),\n\t\turl(\"/layout/fonts/URWForm-Regular.woff\") format(\"woff\");\n\tfont-weight: normal;\n\tfont-style: normal;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"URW Form Extra\";\n\tsrc: url(\"/layout/fonts/URWForm-ExtraBoldItalic.woff2\") format(\"woff2\"),\n\t\turl(\"/layout/fonts/URWForm-ExtraBoldItalic.woff\") format(\"woff\");\n\tfont-weight: bold;\n\tfont-style: italic;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"URW Form Extra\";\n\tsrc: url(\"/layout/fonts/URWForm-ExtraBold.woff2\") format(\"woff2\"),\n\t\turl(\"/layout/fonts/URWForm-ExtraBold.woff\") format(\"woff\");\n\tfont-weight: bold;\n\tfont-style: normal;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"New Order\";\n\tsrc: url(\"/layout/fonts/NewOrder-Light.otf\") format(\"otf\");\n\tfont-weight: 300;\n\tfont-style: normal;\n\tfont-display: swap;\n}\n@font-face {\n\tfont-family: \"New Order\";\n\tsrc: url(\"/layout/fonts/NewOrder-Regular.otf\") format(\"otf\");\n\tfont-weight: 400;\n\tfont-style: normal;\n\tfont-display: swap;\n}\n@font-face {\n\tfont-family: \"New Order\";\n\tsrc: url(\"/layout/fonts/NewOrder-Medium.otf\") format(\"otf\");\n\tfont-weight: 500;\n\tfont-style: normal;\n\tfont-display: swap;\n}\n\n@font-face {\n\tfont-family: \"New Order\";\n\tsrc: url(\"/layout/fonts/NewOrder-SemiBold.otf\") format(\"otf\");\n\tfont-weight: 600;\n\tfont-style: normal;\n\tfont-display: swap;\n}\n@font-face {\n\tfont-family: \"New Order\";\n\tsrc: url(\"/layout/fonts/NewOrder-Bold.otf\") format(\"otf\");\n\tfont-weight: 700;\n\tfont-style: normal;\n\tfont-display: swap;\n}\n","@import \"_mixins\";\n@import \"_variables\";\n\n.box-01 {\n\tpadding: 100px 0;\n\toverflow: hidden;\n\n\tul {\n\t\tposition: relative;\n\t\tlist-style: none;\n\t\tpadding: 0;\n\t\tmargin: 0;\n\t\tdisplay: flex;\n\t\tflex-direction: row;\n\t\tjustify-content: center;\n\t\tcolumn-gap: 50px;\n\n\t\t@include respond-above(md) {\n\t\t\t&::before {\n\t\t\t\tcontent: \"\";\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: calc(144px / 2);\n\t\t\t\theight: 1px;\n\t\t\t\tleft: 50%;\n\t\t\t\twidth: 100vw;\n\t\t\t\ttransform: translate(-50%, -50%);\n\t\t\t\tbackground: $cBlack;\n\t\t\t}\n\t\t}\n\n\t\tli {\n\t\t\tposition: relative;\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\trow-gap: 25px;\n\t\t\tz-index: 1;\n\t\t\tbackground: $cWhite;\n\n\t\t\timg {\n\t\t\t\twidth: 144px;\n\t\t\t\tmin-width: 144px;\n\t\t\t\theight: 144px;\n\t\t\t\tborder-radius: 100%;\n\t\t\t\tborder: 1px solid $cBlack;\n\t\t\t\tobject-fit: none;\n\t\t\t\tmax-width: unset !important;\n\t\t\t\tbackground-color: $cLightGray;\n\t\t\t}\n\t\t\tp {\n\t\t\t\tcolor: $cTxtBlack;\n\t\t\t\tfont-size: 16px;\n\t\t\t\tmargin-bottom: 0;\n\t\t\t\ttext-align: center;\n\t\t\t}\n\t\t}\n\t\t@include respond-below(md) {\n\t\t\tflex-wrap: wrap;\n\t\t\trow-gap: 40px;\n\t\t}\n\t}\n}\n\n.box-02 {\n\tmargin-bottom: 70px;\n\n\t.row {\n\t\t&.row_1 {\n\t\t\t.col-wrapper {\n\t\t\t\theight: 100%;\n\t\t\t\tbackground: $cLightGray;\n\t\t\t}\n\n\t\t\t.col-left {\n\t\t\t\t@include respond-below(md) {\n\t\t\t\t\timg {\n\t\t\t\t\t\tmax-width: unset !important;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&.row_2 {\n\t\t\t.col-wrapper {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-direction: row;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t\tcolumn-gap: 40px;\n\t\t\t\tpadding: 30px;\n\t\t\t\tbackground: $cLightGray;\n\t\t\t}\n\n\t\t\timg {\n\t\t\t}\n\t\t\tul {\n\t\t\t\tlist-style: none;\n\t\t\t\tpadding: 0;\n\t\t\t\tmargin: 0;\n\n\t\t\t\tli {\n\t\t\t\t\tp {\n\t\t\t\t\t\tposition: relative;\n\t\t\t\t\t\tfont-size: 9px;\n\t\t\t\t\t\twidth: fit-content;\n\t\t\t\t\t\tpadding-right: 20px;\n\t\t\t\t\t\tmargin-bottom: 12px;\n\n\t\t\t\t\t\tborder-bottom: 1px solid $cSandDarker;\n\t\t\t\t\t\tstrong {\n\t\t\t\t\t\t\tfont-weight: 700;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\th3 {\n\t\t\t\t\t\tfont-size: 19px;\n\t\t\t\t\t\tfont-weight: 300;\n\t\t\t\t\t\tmargin-bottom: 25px;\n\t\t\t\t\t}\n\t\t\t\t\ta.btn-1 {\n\t\t\t\t\t\tfont-size: 19px;\n\t\t\t\t\t\tfont-weight: 300;\n\t\t\t\t\t\tpadding: 17px 70px 13px 30px;\n\n\t\t\t\t\t\t&::before {\n\t\t\t\t\t\t\twidth: 30px;\n\t\t\t\t\t\t\tright: 25px;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t&::after {\n\t\t\t\t\t\t\tright: 25px;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&.row_3 {\n\t\t\t.col-left {\n\t\t\t\t.col-data {\n\t\t\t\t\tmax-width: 300px;\n\t\t\t\t\ttext-align: right;\n\t\t\t\t\tmargin-left: auto;\n\t\t\t\t\tmargin-right: 60px;\n\t\t\t\t\tpadding: 30px 0;\n\t\t\t\t}\n\n\t\t\t\tp {\n\t\t\t\t\tcolor: $cTxtBlack;\n\t\t\t\t\tfont-size: 14px;\n\t\t\t\t\tfont-weight: 300;\n\t\t\t\t\tmargin-bottom: 0;\n\t\t\t\t\tline-height: 2;\n\t\t\t\t}\n\t\t\t}\n\t\t\t@include respond-below(md) {\n\t\t\t\t.col-left {\n\t\t\t\t\torder: 1;\n\t\t\t\t\t.col-data {\n\t\t\t\t\t\tmax-width: unset;\n\t\t\t\t\t\tmargin-right: 0;\n\t\t\t\t\t\ttext-align: center;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t.col-right {\n\t\t\t\t\timg {\n\t\t\t\t\t\tmax-width: unset !important;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n\n.box-03 {\n\tmargin-bottom: 60px;\n\n\th2 {\n\t\tfont-size: 30px;\n\t\tfont-weight: 300;\n\t\tmargin-bottom: 0;\n\t}\n\n\t.col-left {\n\t\tborder-right: 2px solid $cBlack;\n\n\t\t.col-data {\n\t\t\ttext-align: right;\n\t\t\tmargin-right: 70px;\n\t\t\tpadding-bottom: 50px;\n\n\t\t\th2 {\n\t\t\t\tmargin-bottom: 25px;\n\t\t\t}\n\t\t\tp {\n\t\t\t\tfont-size: 14px;\n\t\t\t\tfont-weight: 300;\n\t\t\t\tmargin-bottom: 0;\n\t\t\t\tline-height: 2;\n\t\t\t}\n\t\t\timg {\n\t\t\t\tmargin-top: 50px;\n\t\t\t}\n\t\t}\n\n\t\t@include respond-below(md) {\n\t\t\tborder-right: none;\n\t\t\t.col-data {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-direction: column;\n\t\t\t\talign-items: center;\n\t\t\t\tmargin-right: auto;\n\t\t\t\ttext-align: center;\n\t\t\t}\n\t\t}\n\t}\n\n\t.col-right {\n\t\t.col-data {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\tcolumn-gap: 20px;\n\t\t\tmargin-left: 60px;\n\n\t\t\t> div {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-direction: row;\n\t\t\t\tcolumn-gap: 45px;\n\t\t\t\talign-items: center;\n\n\t\t\t\tul {\n\t\t\t\t\tpadding: 0;\n\t\t\t\t\tmargin: 0;\n\t\t\t\t\tlist-style: none;\n\n\t\t\t\t\tli {\n\t\t\t\t\t\tdisplay: flex;\n\t\t\t\t\t\tflex-direction: row;\n\t\t\t\t\t\talign-items: center;\n\t\t\t\t\t\tcolumn-gap: 11px;\n\t\t\t\t\t\t&:not(:last-child) {\n\t\t\t\t\t\t\tmargin-bottom: 3px;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tp {\n\t\t\t\t\t\t\tfont-size: 12px;\n\t\t\t\t\t\t\tmargin-bottom: 0;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t@include respond-below(md) {\n\t\t\t.col-data {\n\t\t\t\tmargin-left: auto;\n\t\t\t\tflex-direction: column;\n\t\t\t\talign-items: center;\n\t\t\t\trow-gap: 30px;\n\t\t\t}\n\t\t}\n\t}\n}\n\n.box-04 {\n\tmargin-bottom: 190px;\n\t@include respond-below(md) {\n\t\tmargin-bottom: 100px;\n\t}\n\t.row {\n\t\t&.row_1 {\n\t\t\tmargin-bottom: 60px;\n\t\t}\n\t\t&.row_2 {\n\t\t\t.col-data {\n\t\t\t\tposition: relative;\n\t\t\t\tmargin: 0 auto;\n\t\t\t\twidth: 100%;\n\t\t\t\tmax-width: 820px;\n\t\t\t\tpadding: 0 60px 30px 60px;\n\n\t\t\t\tdisplay: grid;\n\t\t\t\tgrid-template-columns: 1fr 1fr;\n\t\t\t\tcolumn-gap: 100px;\n\t\t\t\tgrid-template-areas:\n\t\t\t\t\t\"col_1_subtitle col_2_subtitle\"\n\t\t\t\t\t\"col_1_title col_2_title\"\n\t\t\t\t\t\"col_1_txt col_2_txt\"\n\t\t\t\t\t\"col_1_img col_2_img\";\n\n\t\t\t\t&::before {\n\t\t\t\t\tcontent: \"\";\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tleft: 0;\n\t\t\t\t\ttop: 0;\n\t\t\t\t\tbottom: 0;\n\t\t\t\t\twidth: 2px;\n\t\t\t\t\tbackground: $cBlack;\n\t\t\t\t}\n\t\t\t\t&::after {\n\t\t\t\t\tcontent: \"\";\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tright: 0;\n\t\t\t\t\ttop: 0;\n\t\t\t\t\tbottom: 0;\n\t\t\t\t\twidth: 2px;\n\t\t\t\t\tbackground: $cBlack;\n\t\t\t\t}\n\n\t\t\t\th3 {\n\t\t\t\t\tfont-size: 13px;\n\t\t\t\t\tfont-weight: 700;\n\t\t\t\t\tmargin-bottom: 30px;\n\t\t\t\t}\n\t\t\t\th2 {\n\t\t\t\t\tfont-size: 25px;\n\t\t\t\t\tfont-weight: 300;\n\t\t\t\t\tmargin-bottom: 15px;\n\t\t\t\t}\n\t\t\t\tp {\n\t\t\t\t\tfont-size: 13px;\n\t\t\t\t\tfont-weight: 300;\n\t\t\t\t\tline-height: 2;\n\t\t\t\t\tmargin-bottom: 0;\n\t\t\t\t}\n\t\t\t\timg {\n\t\t\t\t\theight: 100%;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\tobject-fit: contain;\n\t\t\t\t\tobject-position: bottom;\n\t\t\t\t\tmax-width: fit-content;\n\t\t\t\t\tmargin: 0 auto;\n\t\t\t\t}\n\n\t\t\t\t.col-1-subtitle {\n\t\t\t\t\tgrid-area: col_1_subtitle;\n\t\t\t\t\ttext-align: right;\n\t\t\t\t}\n\t\t\t\t.col-2-subtitle {\n\t\t\t\t\tgrid-area: col_2_subtitle;\n\t\t\t\t}\n\n\t\t\t\t.col-1-title {\n\t\t\t\t\tgrid-area: col_1_title;\n\t\t\t\t\ttext-align: right;\n\t\t\t\t}\n\t\t\t\t.col-2-title {\n\t\t\t\t\tgrid-area: col_2_title;\n\t\t\t\t}\n\n\t\t\t\t.col-1-txt {\n\t\t\t\t\tgrid-area: col_1_txt;\n\t\t\t\t\ttext-align: right;\n\t\t\t\t}\n\t\t\t\t.col-2-txt {\n\t\t\t\t\tgrid-area: col_2_txt;\n\t\t\t\t}\n\n\t\t\t\t.col-1-img {\n\t\t\t\t\tgrid-area: col_1_img;\n\n\t\t\t\t\t@include respond-below(md) {\n\t\t\t\t\t\tpadding-bottom: 80px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t.col-2-img {\n\t\t\t\t\tgrid-area: col_2_img;\n\t\t\t\t}\n\n\t\t\t\t@include respond-below(md) {\n\t\t\t\t\tgrid-template-columns: 1fr;\n\t\t\t\t\tgrid-template-areas:\n\t\t\t\t\t\t\"col_1_subtitle\"\n\t\t\t\t\t\t\"col_1_title\"\n\t\t\t\t\t\t\"col_1_txt\"\n\t\t\t\t\t\t\"col_1_img\"\n\t\t\t\t\t\t\"col_2_subtitle\"\n\t\t\t\t\t\t\"col_2_title\"\n\t\t\t\t\t\t\"col_2_txt\"\n\t\t\t\t\t\t\"col_2_img\";\n\t\t\t\t\tpadding: 0 30px 30px 30px;\n\t\t\t\t\t> * {\n\t\t\t\t\t\ttext-align: center !important;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n","$breakpoints: (\n xs: 576px,\n sm: 768px,\n md: 992px,\n lg: 1200px\n);\n@mixin respond-above($breakpoint) {\n @if map-has-key($breakpoints, $breakpoint) {\n $breakpoint-value: map-get($breakpoints, $breakpoint);\n @media (min-width: $breakpoint-value) {\n @content;\n }\n } @else {\n @warn 'Invalid breakpoint: #{$breakpoint}.';\n }\n}\n@mixin respond-below($breakpoint) {\n @if map-has-key($breakpoints, $breakpoint) {\n $breakpoint-value: map-get($breakpoints, $breakpoint);\n @media (max-width: ($breakpoint-value - 1)) {\n @content;\n }\n } @else {\n @warn 'Invalid breakpoint: #{$breakpoint}.';\n }\n}\n@mixin respond-between($lower, $upper) {\n @if map-has-key($breakpoints, $lower) and map-has-key($breakpoints, $upper) {\n $lower-breakpoint: map-get($breakpoints, $lower);\n $upper-breakpoint: map-get($breakpoints, $upper);\n @media (min-width: $lower-breakpoint) and (max-width: ($upper-breakpoint - 1)) {\n @content;\n }\n } @else {\n @if (map-has-key($breakpoints, $lower) == false) {\n @warn 'Your lower breakpoint was invalid: #{$lower}.';\n }\n @if (map-has-key($breakpoints, $upper) == false) {\n @warn 'Your upper breakpoint was invalid: #{$upper}.';\n }\n }\n}\n@mixin border-radius($px: 0) {\n -webkit-border-radius: $px;\n -moz-border-radius: $px;\n border-radius: $px;\n}\n@mixin box-shadow($value) {\n -webkit-box-shadow: $value;\n -moz-box-shadow: $value;\n box-shadow: $value;\n}\n@mixin transition($element: all, $time: .5s, $option: ease) {\n -webkit-transition: $element $time $option;\n transition: $element $time $option;\n}\n@mixin opacity($value) {\n $IEValue: $value*100;\n opacity: $value;\n -ms-filter: \"progid:DXImageTransform.Microsoft.Alpha(Opacity=\"+$IEValue+\")\";\n filter: alpha(opacity=$IEValue);\n}\n@mixin flexbox() {\n display: -webkit-box;\n display: -moz-box;\n display: -ms-flexbox;\n display: -webkit-flex;\n display: flex;\n}\n@mixin flex($values) {\n -webkit-box-flex: $values;\n -moz-box-flex: $values;\n -webkit-flex: $values;\n \t -ms-flex: $values;\n \t flex: $values;\n}\n@mixin flex-direction($direction) {\n -webkit-flex-direction: $direction;\n -moz-flex-direction: $direction;\n -ms-flex-direction: $direction;\n flex-direction: $direction;\n}\n@mixin flex-wrap($wrap) {\n -webkit-flex-wrap: $wrap;\n -moz-flex-wrap: $wrap;\n -ms-flex-wrap: $wrap;\n flex-wrap: $wrap;\n}\n@mixin flex-flow($flow) {\n -webkit-flex-flow: $flow;\n -moz-flex-flow: $flow;\n -ms-flex-flow: $flow;\n flex-flow: $flow;\n}\n@mixin order($val) {\n -webkit-box-ordinal-group: $val; \n -moz-box-ordinal-group: $val; \n \t -ms-flex-order: $val; \n \t -webkit-order: $val; \n \t\t order: $val;\n}\n@mixin flex-grow($grow) {\n -webkit-flex-grow: $grow;\n -moz-flex-grow: $grow;\n -ms-flex-grow: $grow;\n flex-grow: $grow;\n}\n@mixin flex-shrink($shrink) {\n -webkit-flex-shrink: $shrink;\n -moz-flex-shrink: $shrink;\n -ms-flex-shrink: $shrink;\n flex-shrink: $shrink;\n}\n@mixin flex-basis($width) {\n -webkit-flex-basis: $width;\n -moz-flex-basis: $width;\n -ms-flex-basis: $width;\n flex-basis: $width;\n}\n@mixin justify-content($justify) {\n -webkit-justify-content: $justify;\n -moz-justify-content: $justify;\n -ms-justify-content: $justify;\n justify-content: $justify;\n -ms-flex-pack: $justify;\n}\n@mixin align-content($align) {\n -webkit-align-content: $align;\n -moz-align-content: $align;\n -ms-align-content: $align;\n align-content: $align;\n}\n@mixin align-items($align) {\n -webkit-align-items: $align;\n -moz-align-items: $align;\n -ms-align-items: $align;\n align-items: $align;\n}\n@mixin align-self($align) {\n -webkit-align-self: $align;\n -moz-align-self: $align;\n -ms-align-self: $align;\n align-self: $align;\n}"]} |