/* Minification failed. Returning unminified contents. (7,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (8,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (21,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (48,21): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (49,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (69,32): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (77,36): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (90,21): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (91,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (111,32): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (121,36): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (265,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (442,43): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (624,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (875,43): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (923,28): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (944,31): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (1035,51): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1044,51): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1053,51): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1116,47): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1135,43): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1150,43): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1158,47): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1165,47): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1174,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1181,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1188,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1197,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1223,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (1348,31): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1364,32): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (1386,31): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (1488,55): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1497,55): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1506,55): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1602,51): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1620,47): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1635,47): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1642,51): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1649,51): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1658,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1665,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1672,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1681,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1713,31): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (1807,35): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (1857,39): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (1905,43): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (2140,31): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (2182,35): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (2223,35): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (2240,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (2251,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (2469,32): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (2478,28): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (2481,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (2490,31): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (2512,32): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (2518,31): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (2732,36): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (2738,35): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (2761,36): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (2767,35): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (2981,36): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (2987,35): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (3005,36): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (3011,35): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (3048,31): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (3077,35): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (3126,31): run-time error CSS1039: Token not allowed after unary operator: '-font-terciaria' (3188,27): run-time error CSS1039: Token not allowed after unary operator: '-font-terciaria' (3250,35): run-time error CSS1039: Token not allowed after unary operator: '-font-terciaria' (3293,9): run-time error CSS1036: Expected expression, found '}' (3480,31): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (3498,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (3547,31): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (3569,35): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (3628,31): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (3650,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (3766,31): run-time error CSS1039: Token not allowed after unary operator: '-font-quartenaria' (3796,35): run-time error CSS1039: Token not allowed after unary operator: '-font-quartenaria' (3827,35): run-time error CSS1039: Token not allowed after unary operator: '-font-quartenaria' (3887,43): run-time error CSS1039: Token not allowed after unary operator: '-font-terciaria' (3946,47): run-time error CSS1039: Token not allowed after unary operator: '-font-terciaria' (4006,47): run-time error CSS1039: Token not allowed after unary operator: '-font-terciaria' (4075,43): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (4090,31): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (4103,31): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (4126,39): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (4182,43): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (4205,43): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (4262,43): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (4279,39): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (4759,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (4822,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (4833,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (4852,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (4866,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (4920,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (4949,31): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (4959,35): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (4979,35): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5045,43): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5064,47): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (5084,43): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (5163,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5182,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (5202,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (5294,47): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5313,51): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (5333,47): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (5388,31): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5401,31): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5410,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5418,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5441,35): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5454,35): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5549,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (5565,31): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5573,31): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5607,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (5625,35): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5633,35): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5680,36): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (5692,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (5751,32): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (5763,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (5794,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (5825,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (5847,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5848,17): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (5853,28): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (5854,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5871,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5909,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (5947,35): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (6024,29): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6025,35): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (6070,33): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6071,39): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (6112,33): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6113,39): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (6149,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (6173,32): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6246,31): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (6249,25): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6253,31): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (6271,25): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6332,36): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6374,35): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (6377,29): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6381,35): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (6393,29): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6479,35): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (6482,29): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6486,35): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (6502,29): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6716,28): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6726,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (6799,18): run-time error CSS1062: Expected semicolon or closing curly-brace, found ':' (6800,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (6818,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (6819,18): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6830,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (6844,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (6850,17): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6919,22): run-time error CSS1062: Expected semicolon or closing curly-brace, found ':' (6920,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (6937,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (6938,22): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6949,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (6963,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (6969,21): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (6998,29): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (7020,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7021,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7022,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7097,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (7116,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (7195,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (7214,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (7292,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (7311,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (7386,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (7405,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (7444,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (7463,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (7513,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (7532,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (7623,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (7696,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (7773,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (7815,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (7878,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (7947,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8014,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8071,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8147,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8221,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8239,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (8264,28): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (8274,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8326,25): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8344,25): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (8372,32): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (8383,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8436,25): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8454,25): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (8482,32): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (8493,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8524,28): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (8534,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8599,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8637,30): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (8647,25): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8704,25): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8746,30): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (8756,25): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8806,25): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8844,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (8845,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (8846,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (8894,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (8927,28): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (8933,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (8997,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9051,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9094,32): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (9100,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (9169,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9226,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9264,32): run-time error CSS1039: Token not allowed after unary operator: '-color-principal' (9270,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (9338,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9364,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9365,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9366,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9416,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9425,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9434,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9467,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9520,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9529,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9538,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9573,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9625,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9634,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9669,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (9946,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9947,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9948,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10187,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10188,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10189,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10190,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10191,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10228,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (10285,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (10348,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (10378,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10379,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10380,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10381,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10382,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10422,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (10472,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (10523,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (10535,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10536,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10537,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10538,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10838,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (10913,25): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (10986,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (11033,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11034,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11035,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11036,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11037,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11101,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (11138,23): run-time error CSS1039: Token not allowed after unary operator: '-font-terciaria' (11155,23): run-time error CSS1039: Token not allowed after unary operator: '-font-quartenaria' (11172,23): run-time error CSS1039: Token not allowed after unary operator: '-font-terciaria' (11199,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (11217,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (11370,27): run-time error CSS1039: Token not allowed after unary operator: '-font-terciaria' (11387,27): run-time error CSS1039: Token not allowed after unary operator: '-font-quartenaria' (11404,27): run-time error CSS1039: Token not allowed after unary operator: '-font-terciaria' (11433,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (11451,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (11555,27): run-time error CSS1039: Token not allowed after unary operator: '-font-terciaria' (11572,27): run-time error CSS1039: Token not allowed after unary operator: '-font-quartenaria' (11589,27): run-time error CSS1039: Token not allowed after unary operator: '-font-terciaria' (11618,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (11636,27): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' (11771,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primaria' (11787,23): run-time error CSS1039: Token not allowed after unary operator: '-font-secundaria' */ * { padding: 0; margin: 0; } :root { --color-principal: #3FB0A2; --font-primaria: 'Cinzel', serif; --font-secundaria: 'proxima-nova', sans-serif; --font-terciaria: 'Merriweather', serif; --font-quartenaria: 'Miniver', cursive; } select, option, input, textarea { outline: none; -webkit-appearance: none; appearance: none; } input[type='text'], select { font-family: var(--font-secundaria); color: #22776C; } input[type='number'] { border-top: none; border-right: none; border-left: none; width: 100%; height: 100%; } .swiper-pagination-bullet-active { background: #3FB0A2 !important; } /* ::-webkit-scrollbar { display: none !important; width: 0px !important; background-color: transparent; } */ @media only screen and ( max-width: 800px) { .proximaEtapaLista > li { counter-increment: stepNum; text-align: center; display: table-cell; position: relative; color: var(--color-principal); font-family: var(--font-primaria); font-size: 60%; } .proximaEtapaLista > li:before { content: '\f00c'; content: '\2713;'; content: '\10003'; content: '\10004'; content: '\2713'; display: block; margin: 0 auto 4px; background-color: #fff; width: 36px; height: 36px; line-height: 32px; text-align: center; font-weight: bold; border-width: 2px; border-style: solid; border-color: var(--color-principal); border-radius: 50%; } .proximaEtapaLista > li:after { content: ''; height: 2px; width: 100%; background-color: var(--color-principal); position: absolute; top: 18px; left: 50%; z-index: -1; } } @media only screen and (min-width: 801px) { .proximaEtapaLista > li { counter-increment: stepNum; text-align: center; display: table-cell; position: relative; color: var(--color-principal); font-family: var(--font-primaria); font-size: 100%; } .proximaEtapaLista > li:before { content: '\f00c'; content: '\2713;'; content: '\10003'; content: '\10004'; content: '\2713'; display: block; margin: 0 auto 4px; background-color: #fff; width: 51px; height: 51px; line-height: 47px; text-align: center; font-weight: bold; border-width: 2px; border-style: solid; border-color: var(--color-principal); border-radius: 50%; } .proximaEtapaLista > li:after { content: ''; height: 2px; width: 100%; background-color: var(--color-principal); position: absolute; top: 28px; left: 50%; z-index: -1; } } .containerCabecalho { display: grid; grid-template-rows: auto; width: 100%; z-index: 999; position: fixed; transition: .3s; } .containerCabecalho .cabecalho { grid-area: 1/1/2/4; display: grid; grid-template-columns: 23px 314px 23px; } .containerCabecalho .cabecalho .menuCabecalho { grid-area: 1/1/2/5; display: grid; grid-template-rows: auto auto; } .containerCabecalho .cabecalho .menuCabecalho .listCabecalho { grid-area: 1/1/2/2; display: flex; justify-content: space-around; align-items: center; } .containerCabecalho .cabecalho .menuCabecalho .listCabecalho .logo { width: 150px; height: 91px; background: url(../Imgs/logo_pq.png) no-repeat center center; background-size: cover; transition: .5s; cursor: pointer; } .containerCabecalho .cabecalho .menuCabecalho .listCabecalho .expandeMenu { display: inline-block; cursor: pointer; z-index: 99; } .containerCabecalho .cabecalho .menuCabecalho .listCabecalho .expandeMenu .barra1, .barra2, .barra3 { width: 28px; height: 4px; background-color: #3FB0A2; margin: 4px 0; transition: 0.4s; z-index: 99; } .rotaciona .barra1 { -webkit-transform: rotate(-45deg) translate(-9px, 7px); transform: rotate(-45deg) translate(-9px, 7px); background-color: #ffffff !important; } .rotaciona .barra2 { opacity: 0; } .rotaciona .barra3 { -webkit-transform: rotate(45deg) translate(-4px, -3px); transform: rotate(45deg) translate(-4px, -3px); background-color: #ffffff !important; } .rotacionaV2 .barra1 { -webkit-transform: rotate(-45deg) translate(-9px, 7px); transform: rotate(-45deg) translate(-9px, 7px); } .rotacionaV2 .barra2 { opacity: 0; } .rotacionaV2 .barra3 { -webkit-transform: rotate(45deg) translate(-4px, -3px); transform: rotate(45deg) translate(-4px, -3px); } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho { grid-area: 2/1/3/2; height: 0; width: 100%; position: relative; z-index: 1; top: 0; left: 0; background-color: #3FB0A2; overflow-x: hidden; transition: 0.3s; display: grid; grid-template-rows: 37px auto 75px; grid-template-columns: auto auto auto; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul { grid-area: 2/2/3/3; -webkit-box-flex: 0; -ms-flex: 0 1 100%; flex: 0 1 100%; max-height: 0; opacity: 0; position: relative; top: .1875rem; overflow: hidden; list-style: none; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul > li { opacity: 0; -webkit-transform: translate(0, -10px) scale(1.07); transform: translate(0, -10px) scale(1.07); will-change: transform, opacity; -webkit-transition: opacity 0.25s,scale 0.2s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); transition: opacity 0.25s,scale 0.2s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); transition: opacity 0.25s,transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1),scale 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); transition: opacity 0.25s,transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1),scale 0.2s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); margin-bottom: -1px; position: relative; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho li a { display: block; width: calc(100% + 4rem); margin-left: -2rem; padding: 1rem 2rem; position: relative; background-color: transparent; color: #fff; font-size: 1rem; text-transform: none; font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 24px; line-height: 32px; color: #FFFFFF; text-decoration: none; cursor: pointer; } .expandeHeighMenu { height: 100vh !important; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight { overflow: visible; opacity: 1; -webkit-transition: opacity 0.05; transition: opacity 0.05; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(1) { -webkit-transition-delay: 0.04s; transition-delay: 0.04s; z-index: 8; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(2) { -webkit-transition-delay: 0.08s; transition-delay: 0.08s; z-index: 7; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(3) { -webkit-transition-delay: 0.12s; transition-delay: 0.12s; z-index: 6; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(4) { -webkit-transition-delay: 0.16s; transition-delay: 0.16s; z-index: 5; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(5) { -webkit-transition-delay: 0.2s; transition-delay: 0.2s; z-index: 4; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(6) { -webkit-transition-delay: 0.24s; transition-delay: 0.24s; z-index: 3; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(7) { -webkit-transition-delay: 0.36s; transition-delay: 0.36s; z-index: 6; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(8) { -webkit-transition-delay: 0.46s; transition-delay: 0.46s; z-index: 8; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li { opacity: 1; -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } .backgroundColorCabecalho { background-color: #3FB0A2 !important; transition: .3s; } @media screen and (min-width: 1440px) { .containerCabecalho { display: grid; grid-template-columns: auto 1440px auto; grid-template-rows: 200px; transition: 1s; width: 100%; min-width: 100vw; } .containerCabecalho .cabecalho { grid-area: 1/1/2/4; display: grid; grid-template-columns: 23px 314px 23px; } .containerCabecalho .cabecalho .menuCabecalho { grid-area: 1/1/2/5; display: grid; grid-template-rows: 147px 45px; grid-row-gap: 18px; transition: .3s; } .containerCabecalho .cabecalho .menuCabecalho .listCabecalho { grid-area: 1/1/2/2; display: flex; justify-content: space-around; align-items: center; } .containerCabecalho .cabecalho .menuCabecalho .listCabecalho .logo { width: 230px; height: 147px; background: url(../Imgs/logo_pq.png) no-repeat center center; background-size: cover; transition: .3s; } .containerCabecalho .cabecalho .menuCabecalho .listCabecalho .expandeMenu { display: none; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho { grid-area: 2/1/3/2; height: auto; width: auto; overflow-x: auto; position: relative; background-color: transparent; display: grid; align-items: center; grid-template-rows: none; grid-template-columns: none; transition: none; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul { grid-area: 1/1/2/2; display: flex; flex-direction: row; /* flex-wrap: wrap; */ justify-content: space-around; align-items: center; opacity: 1; overflow: visible; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul > li { opacity: 1; -webkit-transform: none; transform: none; will-change: none; -webkit-transition: none; transition: none; transition: none; transition: none; margin-bottom: none; position: none; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho li a { width: auto; margin-left: 0; padding: 0; position: relative; background-color: transparent; text-transform: none; font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 24px; line-height: 32px; color: #685D3B; text-decoration: none; cursor: pointer; } /* .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul{ grid-area: 1/1/2/2; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around; align-items: center; } .containerCabecalho .cabecalho .menuCabecalho .opcoesCabecalho ul li a{ font-style: normal; font-weight: normal; font-size: 18px; line-height: 24px; text-align: center; color: #685D3B; font-family: 'Cinzel', serif; text-decoration: none; text-align: center; } */ } /* ========================= CABECALHO V2 ========================== */ .containerCabecalhoV2 { display: grid; box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); grid-template-rows: 60px; transition: .3s; width: 100%; z-index: 999; position: fixed; } .containerCabecalhoV2 .cabecalho { grid-area: 1/1/2/4; display: grid; grid-template-columns: 4px 52px 4px; } .containerCabecalhoV2 .cabecalho .menuCabecalho { grid-area: 1/1/2/5; display: grid; grid-template-rows: auto auto; } .containerCabecalhoV2 .cabecalho .menuCabecalho .listCabecalho { grid-area: 1/1/2/2; display: flex; justify-content: space-around; align-items: center; } .containerCabecalhoV2 .cabecalho .menuCabecalho .listCabecalho .logo { width: 83px; height: 52px; background: url(../Imgs/logo_pq.png) no-repeat center center; background-size: cover; transition: .5s; cursor: pointer; } .containerCabecalhoV2 .cabecalho .menuCabecalho .listCabecalho .expandeMenu { display: inline-block; cursor: pointer; z-index: 99; } .containerCabecalhoV2 .cabecalho .menuCabecalho .listCabecalho .expandeMenu .barra1, .barra2, .barra3 { width: 28px; height: 4px; background-color: #3FB0A2; margin: 4px 0; transition: 0.4s; z-index: 99; } .rotaciona .barra1 { -webkit-transform: rotate(-45deg) translate(-9px, 7px); transform: rotate(-45deg) translate(-9px, 7px); background-color: #ffffff !important; } .rotaciona .barra2 { opacity: 0; } .rotaciona .barra3 { -webkit-transform: rotate(45deg) translate(-4px, -3px); transform: rotate(45deg) translate(-4px, -3px); background-color: #ffffff !important; } .rotacionaV2 .barra1 { -webkit-transform: rotate(-45deg) translate(-9px, 7px); transform: rotate(-45deg) translate(-9px, 7px); } .rotacionaV2 .barra2 { opacity: 0; } .rotacionaV2 .barra3 { -webkit-transform: rotate(45deg) translate(-4px, -3px); transform: rotate(45deg) translate(-4px, -3px); } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho { grid-area: 2/1/3/2; height: 0; width: 100%; position: relative; z-index: 1; top: 0; left: 0; background-color: #3FB0A2; overflow-x: hidden; transition: 0.5s; display: grid; grid-template-rows: 37px auto 75px; grid-template-columns: auto auto auto; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul { grid-area: 2/2/3/3; -webkit-box-flex: 0; -ms-flex: 0 1 100%; flex: 0 1 100%; max-height: 0; opacity: 0; position: relative; top: .1875rem; overflow: hidden; list-style: none; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul > li { opacity: 0; -webkit-transform: translate(0, -10px) scale(1.07); transform: translate(0, -10px) scale(1.07); will-change: transform, opacity; -webkit-transition: opacity 0.25s,scale 0.2s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); transition: opacity 0.25s,scale 0.2s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); transition: opacity 0.25s,transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1),scale 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); transition: opacity 0.25s,transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1),scale 0.2s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); margin-bottom: -1px; position: relative; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho li a { display: block; width: calc(100% + 4rem); margin-left: -2rem; padding: 1rem 2rem; position: relative; background-color: transparent; color: #fff; font-size: 1rem; text-transform: none; font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 24px; line-height: 32px; color: #FFFFFF; text-decoration: none; cursor: pointer; } .expandeHeighMenu { height: 100vh !important; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight { overflow: visible; opacity: 1; -webkit-transition: opacity 0.05; transition: opacity 0.05; } /* .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight>li:nth-child(1){ -webkit-transition-delay: 0.04s; transition-delay: 0.04s; z-index: 8; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight>li:nth-child(2){ -webkit-transition-delay: 0.08s; transition-delay: 0.08s; z-index: 7; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight>li:nth-child(3){ -webkit-transition-delay: 0.12s; transition-delay: 0.12s; z-index: 6; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight>li:nth-child(4){ -webkit-transition-delay: 0.16s; transition-delay: 0.16s; z-index: 5; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight>li:nth-child(5){ -webkit-transition-delay: 0.2s; transition-delay: 0.2s; z-index: 4; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight>li:nth-child(6){ -webkit-transition-delay: 0.24s; transition-delay: 0.24s; z-index: 3; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight>li:nth-child(7){ -webkit-transition-delay: 0.36s; transition-delay: 0.36s; z-index: 6; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight>li:nth-child(8){ -webkit-transition-delay: 0.42s; transition-delay: 0.42s; z-index: 6; } */ .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(1) { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; z-index: 8; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(2) { -webkit-transition-delay: 0.2s; transition-delay: 0.2s; z-index: 7; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(3) { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; z-index: 6; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(4) { -webkit-transition-delay: 0.4s; transition-delay: 0.4s; z-index: 5; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(5) { -webkit-transition-delay: 0.5s; transition-delay: 0.5s; z-index: 4; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(6) { -webkit-transition-delay: 0.6s; transition-delay: 0.6s; z-index: 3; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(7) { -webkit-transition-delay: 0.7s; transition-delay: 0.7s; z-index: 6; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li:nth-child(8) { -webkit-transition-delay: 0.8s; transition-delay: 0.8s; z-index: 6; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul.expandeMenuHeight > li { opacity: 1; -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } .backgroundColorCabecalho { background-color: #3FB0A2 !important; transition: .3s; } @media screen and (min-width: 1440px) { .containerCabecalhoV2 { display: grid; grid-template-columns: auto 1440px auto; grid-template-rows: 134px; transition: .3s; width: 100%; min-width: 100vw; z-index: 999; position: fixed; } .containerCabecalhoV2 .cabecalho { grid-area: 1/1/2/4; display: grid; grid-template-columns: 6px auto 10px; } .containerCabecalhoV2 .cabecalho .menuCabecalho { grid-area: 1/1/2/5; display: grid; grid-template-rows: 85px auto; grid-row-gap: 9px; transition: .3s; } .containerCabecalhoV2 .cabecalho .menuCabecalho .listCabecalho { grid-area: 1/1/2/2; display: flex; justify-content: space-around; align-items: center; } .containerCabecalhoV2 .cabecalho .menuCabecalho .listCabecalho .logo { width: 134px; height: 85px; background: url(../Imgs/logo_pq.png) no-repeat center center; background-size: cover; transition: .3s; } .containerCabecalhoV2 .cabecalho .menuCabecalho .listCabecalho .expandeMenu { display: none; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho { grid-area: 2/1/3/2; height: auto; width: auto; overflow-x: auto; position: relative; background-color: transparent; display: grid; grid-template-rows: none; grid-template-columns: none; transition: none; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho { grid-area: 2/1/3/2; height: auto; width: auto; overflow-x: auto; position: relative; background-color: transparent; display: grid; grid-template-rows: none; grid-template-columns: none; transition: none; align-items: center; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul { grid-area: 1/1/2/2; display: flex; flex-direction: row; justify-content: space-around; align-items: center; opacity: 1; overflow: visible; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho ul > li { opacity: 1; -webkit-transform: none; transform: none; will-change: none; -webkit-transition: none; transition: none; transition: none; transition: none; margin-bottom: none; position: none; list-style: none; } .containerCabecalhoV2 .cabecalho .menuCabecalho .opcoesCabecalho li a { width: auto; margin-left: 0; padding: 0; position: relative; background-color: transparent; text-transform: none; font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 24px; line-height: 32px; color: #685D3B; text-decoration: none; cursor: pointer; } } /* ========================== CABECALHO V2 ============================ */ /*========================= RODAPE =============================*/ /* ============================================================================ RODAPE ===================================================================*/ .totalRodape { display: grid; grid-template-columns: auto 320px auto; background-color: var(--color-principal); grid-template-rows: 83px auto; } /* ====================== TITULO =====================*/ .totalRodape .tituloRodape { grid-area: 1/2/2/3; display: flex; justify-content: flex-start; align-items: flex-start; width: 265px; height: 83px; margin: 0; padding: 0; } .totalRodape .tituloRodape p { font-family: var(--font-primaria); color: white; font-style: normal; font-weight: normal; font-size: 56px; line-height: 83px; text-align: left; width: 265px; height: 83px; } /* ====================== TITULO =====================*/ /* ====================== MAPA =====================*/ .totalRodape .containerMISI { grid-area: 2/2/3/3; display: grid; grid-row-gap: 15px; grid-template-rows: auto auto auto auto; margin: 0px; padding: 0px; height: auto; } .totalRodape .containerMISI .map { margin: 0px; padding: 0px; grid-area: 1/1/2/2; background: url(../Imgs/mapa.jpg) no-repeat center center; width: 100%; height: 160px; border-radius: 10px; background-size: cover; margin-bottom: 30px; box-shadow: 0px 4px 14px rgba(0, 0, 0, 0.25); cursor: pointer; } .totalRodape .containerMISI .containerISI { grid-area: 2/1/3/2; margin: 0px; padding: 0px; display: grid; height: auto; grid-row-gap: 33px; } /* ====================== MAPA =====================*/ /* ====================== INFO =====================*/ .totalRodape .containerMISI .containerISI .socialInfo { display: grid; grid-row-gap: 10px; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape { display: grid; grid-row-gap: 24px; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape { display: grid; grid-template-columns: 23px auto; grid-column-gap: 17px; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .iconInfo { } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .txtInfo { } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .txtInfo a { font-family: var(--font-secundaria); font-size: 18px; line-height: normal; color: #FFFFFF; width: 219px; text-decoration: none; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .txtInfo p { font-family: var(--font-secundaria); font-size: 18px; line-height: normal; color: #FFFFFF; width: 219px; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .txtInfo a { font-family: var(--font-secundaria); font-size: 18px; line-height: normal; color: #FFFFFF; width: 219px; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .emailRodape { background: url(../Imgs/geral/mobile/email.png) no-repeat center center; width: 23px; height: 16.49px; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .telefoneRodape { background: url(../Imgs/geral/mobile/Vector.png) no-repeat center center; width: 23px; height: 21.67px; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .wppRodape { background: url(../Imgs/geral/mobile/zap.png) no-repeat center center; width: 23px; height: 23px; background-size: cover; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .localizacaoRodape { background: url(../Imgs/geral/mobile/pin.png) no-repeat center center; width: 19px; height: 21.67px; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .trabalheConoscoRodape { background: url(../Imgs/hand-shake.png) no-repeat center center; width: 25px; height: 30px; cursor: pointer; } /* ====================== INFO =====================*/ /* ====================== INPUT =====================*/ .totalRodape .containerMISI .containerISI .input { display: grid; grid-row-gap: 21px; } .totalRodape .containerMISI .containerISI .input .inputInfo { display: grid; grid-template-rows: 18px auto; } .totalRodape .containerMISI .containerISI .input .inputInfo span { grid-area: 1/1/2/2; } .totalRodape .containerMISI .containerISI .input .inputInfo span p { color: white; font-family: var(--font-secundaria); font-style: normal; font-weight: bold; font-size: 14px; line-height: normal; } .totalRodape .containerMISI .containerISI .input .inputInfo input { grid-area: 2/1/3/2; height: 16px; border-top: none; border-left: none; border-right: none; border-bottom: solid 1px white; background-color: transparent; padding-bottom: 3px; padding-top: 3px; color: white; font-size: 14px; font-family: var(--font-secundaria); } .totalRodape .containerMISI .containerISI .input .inputInfo textarea { grid-area: 2/1/3/2; height: 102px; border-top: none; border-left: none; border-right: none; border-bottom: solid 1px white; background-color: transparent; padding-bottom: 3px; padding-top: 3px; color: white; font-size: 14px; font-family: var(--font-secundaria); resize: none; } .totalRodape .containerMISI .containerISI .input .inputInfo textarea::-webkit-input-placeholder { font-family: var(--font-secundaria); font-size: 16px; line-height: normal; color: rgba(255, 255, 255, 0.28); } .totalRodape .containerMISI .containerISI .input .inputInfo textarea::-moz-placeholder { font-family: var(--font-secundaria); font-size: 16px; line-height: normal; color: rgba(255, 255, 255, 0.28); } ​ .totalRodape .containerMISI .containerISI .input .inputInfo textarea::-webkit-input-placeholder { font-family: var(--font-secundaria); font-size: 16px; line-height: normal; color: rgba(255, 255, 255, 0.28); } .totalRodape .containerMISI .containerISI .input .inputInfo input::-webkit-input-placeholder { font-family: var(--font-secundaria); font-size: 16px; line-height: normal; color: rgba(255, 255, 255, 0.28); } .totalRodape .containerMISI .containerISI .input .inputInfo input::-moz-placeholder { font-family: var(--font-secundaria); font-size: 16px; line-height: normal; color: rgba(255, 255, 255, 0.28); } ​ .totalRodape .containerMISI .containerISI .input .inputInfo input::-webkit-input-placeholder { font-family: var(--font-secundaria); font-size: 16px; line-height: normal; color: rgba(255, 255, 255, 0.28); } .totalRodape .containerMISI .containerISI .input .btnInput { width: 100%; } .totalRodape .containerMISI .containerISI .input .btnInput div { display: flex; justify-content: center; align-items: center; border-radius: 8px; background-color: transparent; height: 63px; cursor: pointer; } .totalRodape .containerMISI .containerISI .input .btnInput p { font-family: var(--font-primaria); font-size: 24px; line-height: normal; text-align: center; text-transform: uppercase; color: #ffffff; } /* ====================== INPUT =====================*/ /* ====================== SOCIAL =====================*/ .totalRodape .containerMISI .containerISI .socialInfo #redesSociaisRodape { display: grid; grid-template-columns: 44px 44px 44px 44px; grid-column-gap: 51px; display: none; } .totalRodape .containerMISI .containerISI .socialInfo #redesSociaisRodape div{ cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #redesSociaisRodape .facebookRodape { grid-area: 1/1/2/2; background: url(../Imgs/geral/mobile/facebookline.png); background-size: cover; width: 44px; height: 44px; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #redesSociaisRodape .pRodape { grid-area: 1/2/2/3; background: url(../Imgs/geral/mobile/pinterestline.png); background-size: cover; width: 44px; height: 44px; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #redesSociaisRodape .instagramRodape { grid-area: 1/3/2/4; background: url(../Imgs/geral/mobile/instagramline.png); background-size: cover; width: 44px; height: 44px; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #redesSociaisRodape .youtubeRodape { grid-area: 1/4/2/5; background: url(../Imgs/geral/mobile/youtubeline.png); background-size: cover; width: 44px; height: 44px; cursor: pointer; } /* ====================== SOCIAL =====================*/ /* ====================== SOCIAL MOBILE =====================*/ .totalRodape .containerMISI .socialRodapeMobile { grid-area: 3/1/4/2; display: grid; grid-template-columns: 44px 44px 44px 44px; grid-column-gap: 51px; } .totalRodape .containerMISI .socialRodapeMobile div{ cursor: pointer; } .totalRodape .containerMISI .socialRodapeMobile .facebookRodape { grid-area: 1/1/2/2; background: url(../Imgs/geral/mobile/facebookline.png); background-size: cover; width: 44px; height: 45px; } .totalRodape .containerMISI .socialRodapeMobile .pRodape { grid-area: 1/2/2/3; background: url(../Imgs/geral/mobile/pinterestline.png); background-size: cover; width: 44px; height: 45px; } .totalRodape .containerMISI .socialRodapeMobile .instagramRodape { grid-area: 1/3/2/4; background: url(../Imgs/geral/mobile/instagramline.png); background-size: cover; width: 44px; height: 45px; } .totalRodape .containerMISI .socialRodapeMobile .youtubeRodape { grid-area: 1/4/2/5; background: url(../Imgs/geral/mobile/youtubeline.png); background-size: cover; width: 44px; height: 45px; } /* ====================== SOCIAL MOBILE =====================*/ /* ====================== COPIRIGHT =====================*/ .totalRodape .containerMISI .copiright { grid-area: 4/1/5/2; display: grid; grid-template-rows: auto 44px; } .totalRodape .containerMISI .copiright div { grid-area: 1/1/2/2; display: flex; justify-content: center; align-items: center; } .totalRodape .containerMISI .copiright div p { font-family: var(--font-secundaria); font-size: 18px; line-height: normal; text-transform: capitalize; color: #FFFFFF; } /* ====================== COPIRIGHT =====================*/ @media only screen and (min-width: 1440px) { .totalRodape { display: grid; grid-template-columns: auto 1200px auto; background-color: var(--color-principal); grid-template-rows: 50px 83px 408px 18px; grid-row-gap: 90px; } /* ====================== TITULO =====================*/ .totalRodape .tituloRodape { grid-area: 2/2/3/3; display: flex; justify-content: flex-start; align-items: flex-start; width: 265px; height: 83px; margin: 0; padding: 0; } .totalRodape .tituloRodape p { font-family: var(--font-primaria); color: white; font-style: normal; font-weight: normal; font-size: 100px; text-align: left; width: 265px; height: 83px; } /* ====================== TITULO =====================*/ /* ====================== MAPA =====================*/ .totalRodape .containerMISI { grid-area: 3/2/4/3; display: grid; grid-row-gap: 16px; grid-template-rows: auto 60px; grid-template-columns: 468px auto; grid-column-gap: 35px; margin: 0px; padding: 0px; height: auto; } .totalRodape .containerMISI .map { grid-area: 1/1/2/2; margin: 0px; padding: 0px; grid-area: 1/1/2/2; background: url(../Imgs/mapa.jpg) no-repeat center center; width: 100%; height: 408px; border-radius: 10px; background-size: cover; margin-bottom: 30px; box-shadow: 0px 4px 14px rgba(0, 0, 0, 0.25); } .totalRodape .containerMISI .containerISI { grid-area: 1/2/2/3; margin: 0px; padding: 0px; display: grid; height: auto; grid-row-gap: 0px; grid-column-gap: 92px; grid-template-columns: auto 270px; } /* ====================== MAPA =====================*/ /* ====================== INFO =====================*/ .totalRodape .containerMISI .containerISI .socialInfo { grid-area: 1/1/2/2; display: grid; grid-row-gap: 40px; grid-template-rows: auto auto; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape { grid-area: 1/1/2/2; display: grid; grid-row-gap: 22px; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape { display: grid; grid-template-columns: 23px auto; grid-column-gap: 17px; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .iconInfo { } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .txtInfo { display: flex; justify-content: flex-start; align-items: center; margin: 0; padding: 0; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .txtInfo a { font-family: var(--font-secundaria); font-size: 18px; line-height: normal; color: #FFFFFF; width: 219px; text-decoration: none; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .txtInfo p { font-family: var(--font-secundaria); font-size: 18px; line-height: normal; color: #FFFFFF; width: 219px; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .txtInfo a{ font-family: var(--font-secundaria); font-size: 18px; line-height: normal; color: #FFFFFF; width: 219px; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .txtInfoEmail { height: 18px; padding: 0; margin: 0; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .txtInfoTelefone { height: 18px; padding: 0; margin: 0; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .txtInfoWpp { height: 18px; padding: 0; margin: 0; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .txtInfoTrabalheConosco { height: 18px; padding: 0; margin: 0; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .txtInfoLocalizacao { height: 80px; padding: 0; margin-top: 0; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .emailRodape { background: url(../Imgs/geral/mobile/email.png) no-repeat center center; width: 23px; height: 16.49px; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .telefoneRodape { background: url(../Imgs/geral/mobile/Vector.png) no-repeat center center; width: 23px; height: 21.67px; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .wppRodape { background: url(../Imgs/geral/mobile/zap.png) no-repeat center center; width: 23px; height: 23px; background-size: cover; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .localizacaoRodape { background: url(../Imgs/geral/mobile/pin.png) no-repeat center center; width: 19px; height: 30px; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #infoContatoRodape .infoRodape .trabalheConoscoRodape { background: url(../Imgs/hand-shake.png) no-repeat center center; width: 25px; height: 30px; cursor: pointer; } /* ====================== INFO =====================*/ /* ====================== INPUT =====================*/ .totalRodape .containerMISI .containerISI .input { grid-area: 1/2/2/3; display: grid; grid-row-gap: 21px; } .totalRodape .containerMISI .containerISI .input .inputInfo { display: grid; grid-template-rows: 22px auto; } .totalRodape .containerMISI .containerISI .input .inputInfo span { grid-area: 1/1/2/2; } .totalRodape .containerMISI .containerISI .input .inputInfo span p { color: white; font-family: var(--font-secundaria); font-style: normal; font-weight: bold; font-size: 15px; line-height: normal; } .totalRodape .containerMISI .containerISI .input .inputInfo input { grid-area: 2/1/3/2; height: 16px; border-top: none; border-left: none; border-right: none; border-bottom: solid 1px white; background-color: transparent; padding-bottom: 3px; padding-top: 3px; color: white; font-family: var(--font-secundaria); font-size: 18px; } .totalRodape .containerMISI .containerISI .input .inputInfo textarea { grid-area: 2/1/3/2; height: 102px; border-top: none; border-left: none; border-right: none; border-bottom: solid 1px white; background-color: transparent; padding-bottom: 3px; padding-top: 3px; color: white; font-family: var(--font-secundaria); font-size: 18px; resize: none; } .totalRodape .containerMISI .containerISI .input .inputInfo textarea::-webkit-input-placeholder { font-family: var(--font-secundaria); font-size: 16px; line-height: normal; color: rgba(255, 255, 255, 0.28); } .totalRodape .containerMISI .containerISI .input .inputInfo textarea::-moz-placeholder { font-family: var(--font-secundaria); font-size: 16px; line-height: normal; color: rgba(255, 255, 255, 0.28); } ​ .totalRodape .containerMISI .containerISI .input .inputInfo textarea::-webkit-input-placeholder { font-family: var(--font-secundaria); font-size: 16px; line-height: normal; color: rgba(255, 255, 255, 0.28); } .totalRodape .containerMISI .containerISI .input .inputInfo input::-webkit-input-placeholder { font-family: var(--font-secundaria); font-size: 16px; line-height: normal; color: rgba(255, 255, 255, 0.28); } .totalRodape .containerMISI .containerISI .input .inputInfo input::-moz-placeholder { font-family: var(--font-secundaria); font-size: 16px; line-height: normal; color: rgba(255, 255, 255, 0.28); } ​ .totalRodape .containerMISI .containerISI .input .inputInfo input::-webkit-input-placeholder { font-family: var(--font-secundaria); font-size: 16px; line-height: normal; color: rgba(255, 255, 255, 0.28); } /* .totalRodape .containerMISI .containerISI .input .inputInfo textarea::-moz-placeholder { font-family: var(--font-secundaria); font-size: 16px; line-height: normal; color: rgba(255, 255, 255, 0.28); }​ */ .totalRodape .containerMISI .containerISI .input .btnInput { width: 100%; display: flex; align-items: center; justify-content: flex-end; } .totalRodape .containerMISI .containerISI .input .btnInput div { display: flex; justify-content: center; align-items: center; border-radius: 8px; background-color: transparent; height: 50px; cursor: pointer; width: 159px; } .totalRodape .containerMISI .containerISI .input .btnInput p { font-family: var(--font-primaria); font-size: 24px; line-height: normal; text-align: center; text-transform: uppercase; color: #ffffff; } /* ====================== INPUT =====================*/ /* ====================== SOCIAL =====================*/ .totalRodape .containerMISI .containerISI .socialInfo #redesSociaisRodape { grid-area: 2/1/3/2; display: grid; grid-template-columns: 44px 44px 44px 44px; grid-column-gap: 51px; } .totalRodape .containerMISI .containerISI .socialInfo #redesSociaisRodape div{ cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #redesSociaisRodape .facebookRodape { grid-area: 1/1/2/2; background: url(../Imgs/geral/mobile/facebookline.png); background-size: cover; width: 44px; height: 44px; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #redesSociaisRodape .pRodape { grid-area: 1/2/2/3; background: url(../Imgs/geral/mobile/pinterestline.png); background-size: cover; width: 44px; height: 44px; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #redesSociaisRodape .instagramRodape { grid-area: 1/3/2/4; background: url(../Imgs/geral/mobile/instagramline.png); background-size: cover; width: 44px; height: 44px; cursor: pointer; } .totalRodape .containerMISI .containerISI .socialInfo #redesSociaisRodape .youtubeRodape { grid-area: 1/4/2/5; background: url(../Imgs/geral/mobile/youtubeline.png); background-size: cover; width: 44px; height: 44px; cursor: pointer; } /* ====================== SOCIAL =====================*/ /* ====================== SOCIAL MOBILE =====================*/ .totalRodape .containerMISI .socialRodapeMobile { grid-area: 3/1/4/2; display: grid; grid-template-columns: 44px 44px 44px 44px; grid-column-gap: 51px; display: none; } .totalRodape .containerMISI .socialRodapeMobile div{ cursor: pointer; } /* ====================== SOCIAL MOBILE =====================*/ /* ====================== COPIRIGHT =====================*/ .totalRodape .containerMISI .copiright { grid-area: 2/1/3/4; display: grid; grid-template-rows: 18px 21px; height: 30px; } .totalRodape .containerMISI .copiright div { grid-area: 1/1/2/2; display: flex; justify-content: center; align-items: center; } .totalRodape .containerMISI .copiright div p { font-family: var(--font-secundaria); font-size: 18px; line-height: normal; text-transform: capitalize; color: #FFFFFF; } /* ====================== COPIRIGHT =====================*/ } /* ========================= EVENTOS ==================== */ .containerCardEventos { display: grid; grid-template-columns: 281px; } .containerCardEventos .cardEventos { grid-area: 1/1/2/2; display: grid; grid-row-gap: 13px; } .containerCardEventos .cardEventos .imgCardEventos { width: 100%; height: 212px; /* background: url(../Imgs/eventos.png) no-repeat center center; */ background-size: cover; transition: .5s; } .containerCardEventos .cardEventos .imgCardEventos:hover{ transition: .5s; box-shadow: 5px 10px 18px rgba(0,0,0,.5); } .containerCardEventos .cardEventos .txtCardEventos { height: 59px; } .containerCardEventos .cardEventos .txtCardEventos div { display: flex; justify-content: center; align-items: center; } .containerCardEventos .cardEventos .txtCardEventos div p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 24px; line-height: 32px; display: flex; align-items: center; text-align: center; /* Pressed */ color: #685D3B; } @media screen and (min-width: 1440px) { .containerCardEventos { display: grid; grid-template-columns: 380px; } .containerCardEventos .cardEventos { grid-area: 1/1/2/2; display: grid; grid-row-gap: 20px; } .containerCardEventos .cardEventos .imgCardEventos { width: 100%; height: 311px; /* background: url(../Imgs/eventos.png) no-repeat center center; */ background-size: cover; } .containerCardEventos .cardEventos .imgCardEventos:hover{ transition: .5s; box-shadow: 5px 10px 18px rgba(0,0,0,.5); } .containerCardEventos .cardEventos .txtCardEventos { height: 86px; } .containerCardEventos .cardEventos .txtCardEventos div { display: flex; justify-content: center; align-items: center; } .containerCardEventos .cardEventos .txtCardEventos div p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 32px; line-height: 43px; display: flex; align-items: center; text-align: center; /* Pressed */ color: #685D3B; } } /* ========================= EVENTOS ==================== */ .containerImgsConjunto { width: 330px; height: 343px; } .containerImgsConjunto .ImgsConjunto { display: grid; grid-template-columns: 34px 170px 126px; grid-template-rows: 64px 203px 76px; } .containerImgsConjunto .ImgsConjunto .imgConjunto1 { grid-area: 2/2/4/5; background: url(../Imgs/aVilla.png) no-repeat center center; background-size: cover; } .containerImgsConjunto .ImgsConjunto .imgConjunto2 { grid-area: 1/1/3/3; background: url(../Imgs/AVillaVertOpcao2.png) no-repeat center center; background-size: cover; z-index: 99; border-right-color: white; border-right-width: 5px; border-right-style: solid; border-bottom-color: white; border-bottom-width: 5px; border-bottom-style: solid; } @media screen and (min-width: 1024px) { .containerImgsConjunto { width: 460px; height: auto; } .containerImgsConjunto .ImgsConjunto { display: grid; grid-template-columns: 125px 145px 184px; grid-template-rows: 55px 325px 95px; } .containerImgsConjunto .ImgsConjunto .imgConjunto1 { grid-area: 2/2/4/5; background-color: black; background: url(../Imgs/aVilla.png) no-repeat center center; background-size: cover; } .containerImgsConjunto .ImgsConjunto .imgConjunto2 { grid-area: 1/1/3/3; background: url(../Imgs/AVillaVertOpcao2.png) no-repeat center center; background-size: cover; border-right-color: white; border-right-width: 8px; border-right-style: solid; border-bottom-color: white; border-bottom-width: 8px; border-bottom-style: solid; z-index: 99; } } @media screen and (min-width: 1440px) { .containerImgsConjunto { width: 624px; height: auto; } .containerImgsConjunto .ImgsConjunto { display: grid; grid-template-columns: 30px 235px 187px; grid-template-rows: 104px 344px 146px; } .containerImgsConjunto .ImgsConjunto .imgConjunto1 { grid-area: 2/2/4/5; background-color: black; background: url(../Imgs/aVilla.png) no-repeat center center; background-size: cover; } .containerImgsConjunto .ImgsConjunto .imgConjunto2 { grid-area: 1/1/3/3; background: url(../Imgs/AVillaVertOpcao2.png) no-repeat center center; background-size: cover; border-right-color: white; border-right-width: 8px; border-right-style: solid; border-bottom-color: white; border-bottom-width: 8px; border-bottom-style: solid; z-index: 99; } } .containerImgsConjuntoOParque { width: 330px; height: 343px; } .containerImgsConjuntoOParque .ImgsConjuntoOParque { display: grid; grid-template-columns: 34px 122px 187px; grid-template-rows: 64px 203px 76px; } .containerImgsConjuntoOParque .ImgsConjuntoOParque .imgConjunto1 { grid-area: 1/1/3/4; background: url(../Imgs/OParqueHoriz.jpg) no-repeat center center; background-size: cover; } .containerImgsConjuntoOParque .ImgsConjuntoOParque .imgConjunto2 { grid-area: 2/3/5/5; background: url(../Imgs/OParqueVert.jpg) no-repeat center center; background-size: cover; z-index: 99; border: solid 11px white; } @media screen and (min-width: 1024px) { .containerImgsConjuntoOParque { width: 460px; height: 595px; } .containerImgsConjuntoOParque .ImgsConjuntoOParque { display: grid; grid-template-columns: 110px 50px 190px; grid-template-rows: 70px 275px 120px; } .containerImgsConjuntoOParque .ImgsConjuntoOParque .imgConjunto1 { grid-area: 1/1/3/4; background-color: black; background: url(../Imgs/OParqueHoriz.jpg) no-repeat center center; background-size: cover; } .containerImgsConjunto .ImgsConjuntoOParque .imgConjunto2 { grid-area: 2/3/5/5; background: url(../Imgs/aVilla2.jpg) no-repeat center center; background-size: cover; border: solid 20px white; z-index: 99; } } @media screen and (min-width: 1440px) { .containerImgsConjuntoOParque { width: 624px; height: 595px; } .containerImgsConjuntoOParque .ImgsConjuntoOParque { display: grid; grid-template-columns: 135px 215px 187px; grid-template-rows: 104px 344px 146px; } .containerImgsConjuntoOParque .ImgsConjuntoOParque .imgConjunto1 { grid-area: 1/1/3/4; background-color: black; background: url(../Imgs/OParqueHoriz.jpg) no-repeat center center; background-size: cover; } .containerImgsConjunto .ImgsConjuntoOParque .imgConjunto2 { grid-area: 2/3/5/5; background: url(../Imgs/aVilla2.jpg) no-repeat center center; background-size: cover; border: solid 20px white; z-index: 99; } } /* ================== CARDS PROJETOS ================= */ .containerCardProjeto { width: 303px; height: 202px; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/cardsProjetos.jpg) no-repeat center center; */ background-size: cover; transition: .5s; } /* .containerCardProjeto:hover{ transition: .5s; box-shadow: 5px 10px 18px rgba(0,0,0,.5); } */ .containerCardProjeto .cardProjeto{ width: 219px; height: 99px; display: flex; justify-content: center; align-items: center; background: #FFFFFF; opacity: 0.6; transition: .5s; } .containerCardProjeto .cardProjeto:hover{ transition: .5s; opacity: 1; } .containerCardProjeto .cardProjeto p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 18px; line-height: 161.16%; /* or 29px */ display: flex; align-items: center; text-align: center; /* Pressed */ color: #685D3B; } @media screen and (min-width: 1024px) { .containerCardProjeto { width: 290px; height: 290px; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/cardsProjetos.jpg) no-repeat center center; */ background-size: cover; } .containerCardProjeto .cardProjeto { width: 250px; height: 180px; display: flex; justify-content: center; align-items: center; background: #FFFFFF; opacity: 0.6; transition: .5s; } .containerCardProjeto .cardProjeto:hover{ transition: .5s; opacity: 1; } .containerCardProjeto .cardProjeto p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 18px; line-height: 161.16%; /* or 29px */ display: flex; align-items: center; text-align: center; /* Pressed */ color: #685D3B; } } @media screen and (min-width: 1440px) { .containerCardProjeto { width: 350px; height: 350px; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/cardsProjetos.jpg) no-repeat center center; */ background-size: cover; } .containerCardProjeto .cardProjeto { width: 325px; height: 194px; display: flex; justify-content: center; align-items: center; background: #FFFFFF; opacity: 0.6; } .containerCardProjeto .cardProjeto:hover{ transition: .5s; opacity: 1; } .containerCardProjeto .cardProjeto p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 24px; line-height: 161.16%; /* or 29px */ display: flex; align-items: center; text-align: center; /* Pressed */ color: #685D3B; } } /*COMPONENTES LOCACAO FOTOGRAFICA*/ .titulosMobile { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 46px; line-height: 120%; /* or 55px */ color: #55471E; } @media screen and (min-width: 1440px) { .titulosMobile { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 56px; line-height: 120%; /* or 55px */ color: #55471E; } } .tituloPassosMobile { display: grid; grid-row-gap: 45px; /* background: url(../Imgs/FotoLocacao.png) no-repeat; background-size: contain; background-position: right; */ } .tituloPassosMobile .tituloMobileFotos { width: auto; display: flex; justify-content: flex-start; align-items: center; } .tituloPassosMobile .passo1 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo1 div { width: 330px; height: 51px; background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; } .tituloPassosMobile .passo1Cha { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo1Cha div { width: 330px; height: 51px; background: url(../Imgs/passo1MobileCha.png) no-repeat center center; /* background-size: cover; */ } .tituloPassosMobile .passo2 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo2 div { width: 330px; height: 51px; background: url(../Imgs/passo2Mobile.png) no-repeat center center; background-size: cover; } .tituloPassosMobile .passo2Cha { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo2Cha div { width: 330px; height: 51px; background: url(../Imgs/passo2MobileCha.png) no-repeat center center; /* background-size: cover; */ } .tituloPassosMobile .passo3 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo3 div { width: 330px; height: 51px; background: url(../Imgs/passo3Mobile.png) no-repeat center center; background-size: cover; } .tituloPassosMobile .passo3Cha { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo3Cha div { width: 330px; height: 51px; background: url(../Imgs/passo3MobileCha.png) no-repeat center center; /* background-size: cover; */ } .tituloPassosMobile .passo4 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo4 div { width: 330px; height: 51px; background: url(../Imgs/passo4Mobile.png) no-repeat center center; background-size: cover; } .tituloPassosMobile .passo4Cha { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo4Cha div { width: 330px; height: 51px; background: url(../Imgs/passo4MobileCha.png) no-repeat center center; /* background-size: cover; */ } .tituloPassosMobile .passo5 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo5 div { width: 330px; height: 51px; background: url(../Imgs/passo5Mobile.png) no-repeat center center; background-size: cover; } .btnsTermosLocacaoFotos { display: grid; grid-row-gap: 9px; grid-auto-rows: auto; justify-content: center; align-items: center; } .btnsTermosLocacaoFotos .btnProximo { display: flex; justify-content: center; align-items: center; cursor: pointer; /* background-image: url(../Imgs/FotoLocacao.png); background-size: cover; background-position: center; background-repeat: no-repeat; */ /* background-repeat: repeat-x; */ background-color: var(--color-principal); width: 200px; height: 50px; } .btnAdd { display: flex; justify-content: center; align-items: center; cursor: pointer; background-color: var(--color-principal); width: 200px; height: 50px; font-family: var(--font-primaria); font-size: 19px; color: white; position: absolute; bottom: 0; right: 0; } .btnsTermosLocacaoFotos .btnProximo p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 20px; line-height: 43px; /* identical to box height */ display: flex; align-items: center; text-align: center; text-transform: uppercase; color: #fff; } .btnsTermosLocacaoFotos .btnVoltar { display: flex; justify-content: center; align-items: center; cursor: pointer; /* background-image: url(../Imgs/fundoProjetos.png); background-size: cover; background-position: center; background-repeat: no-repeat; */ background-color: var(--color-principal); width: 200px; height: 50px; } .btnsTermosLocacaoFotos .btnVoltar p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 20px; line-height: 38px; /* identical to box height */ display: flex; align-items: center; text-align: center; text-transform: uppercase; color: white } @media screen and (min-width: 1024px) { .tituloPassosMobile { display: grid; grid-row-gap: 61px; } .tituloPassosMobile .tituloMobileFotos { width: 100%; display: flex; justify-content: flex-start; align-items: center; } .tituloPassosMobile .passo1 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo1 div { width: 650px; height: 93px; background: url(../Imgs/passo1Desktop.png) no-repeat center center; background-size: cover; } .tituloPassosMobile .passo1Cha { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo1Cha div { width: 650px; height: 115px; background: url(../Imgs/passo1DesktopCha.png) no-repeat center center; /* background-size: cover; */ } .tituloPassosMobile .passo2 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo2 div { width: 650px; height: 93px; background: url(../Imgs/passo2Desktop.png) no-repeat center center; background-size: cover; } .tituloPassosMobile .passo2Cha { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo2Cha div { width: 650px; height: 115px; background: url(../Imgs/passo2DesktopCha.png) no-repeat center center; /* background-size: cover; */ } .tituloPassosMobile .passo3 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo3 div { width: 650px; height: 93px; background: url(../Imgs/passo3Desktop.png) no-repeat center center; background-size: cover; } .tituloPassosMobile .passo3Cha { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo3Cha div { width: 650px; height: 115px; background: url(../Imgs/passo3DesktopCha.png) no-repeat center center; /* background-size: cover; */ } .tituloPassosMobile .passo4 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo4 div { width: 650px; height: 93px; background: url(../Imgs/passo4Desktop.png) no-repeat center center; background-size: cover; } .tituloPassosMobile .passo4Cha { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo4Cha div { width: 650px; height: 120px; background: url(../Imgs/passo4DesktopCha.png) no-repeat center center; /* background-size: cover; */ } .tituloPassosMobile .passo5 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo5 div { width: 650px; height: 93px; background: url(../Imgs/passo5Desktop.png) no-repeat center center; background-size: cover; } .btnsTermosLocacaoFotos { display: flex; justify-content: space-between; /* margin-bottom: 324px; */ flex-direction: row-reverse; } .btnsTermosLocacaoFotos .btnProximo { display: flex; justify-content: center; align-items: center; cursor: pointer; background-color: var(--color-principal); width: 200px; height: 50px; } .btnsTermosLocacaoFotos .btnProximo p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 20px; line-height: 54px; /* identical to box height */ display: flex; align-items: center; text-align: center; text-transform: uppercase; color: #fff; } .btnsTermosLocacaoFotos .btnVoltar { display: flex; justify-content: center; align-items: center; cursor: pointer; /* background-image: url(../Imgs/fundoProjetos.png); background-size: cover; background-position: center; background-repeat: no-repeat; width: 200px; */ background-color: var(--color-principal); width: 200px; height: 50px; } .btnsTermosLocacaoFotos .btnVoltar p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 20px; line-height: 54px; /* identical to box height */ display: flex; align-items: center; text-align: center; text-transform: uppercase; color: white } } @media screen and (min-width: 1440px) { .tituloPassosMobile { display: grid; grid-row-gap: 61px; } .tituloPassosMobile .tituloMobileFotos { width: 100%; display: flex; justify-content: flex-start; align-items: center; } .tituloPassosMobile .passo1 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo1 div { width: 770px; height: 111px; background: url(../Imgs/passo1Desktop.png) no-repeat center center; background-size: cover; } .tituloPassosMobile .passo1Cha { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo1Cha div { width: 770px; height: 111px; background: url(../Imgs/passo1DesktopCha.png) no-repeat center center; /* background-size: cover; */ } .tituloPassosMobile .passo2 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo2 div { width: 770px; height: 111px; background: url(../Imgs/passo2Desktop.png) no-repeat center center; background-size: cover; } .tituloPassosMobile .passo2Cha { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo2Cha div { width: 770px; height: 111px; background: url(../Imgs/passo2DesktopCha.png) no-repeat center center; /* background-size: cover; */ } .tituloPassosMobile .passo3 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo3 div { width: 770px; height: 111px; background: url(../Imgs/passo3Desktop.png) no-repeat center center; background-size: cover; } .tituloPassosMobile .passo3Cha { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo3Cha div { width: 770px; height: 111px; background: url(../Imgs/passo3DesktopCha.png) no-repeat center center; /* background-size: cover; */ } .tituloPassosMobile .passo4 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo4 div { width: 770px; height: 111px; background: url(../Imgs/passo4Desktop.png) no-repeat center center; background-size: cover; } .tituloPassosMobile .passo4Cha { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo4Cha div { width: 770px; height: 111px; background: url(../Imgs/passo4DesktopCha.png) no-repeat center center; /* background-size: cover; */ } .tituloPassosMobile .passo5 { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; /* background: url(../Imgs/passo1Mobile.png) no-repeat center center; background-size: cover; */ } .tituloPassosMobile .passo5 div { width: 770px; height: 111px; background: url(../Imgs/passo5Desktop.png) no-repeat center center; background-size: cover; } .btnsTermosLocacaoFotos { display: flex; justify-content: space-between; /* margin-bottom: 324px; */ flex-direction: row-reverse; } .btnsTermosLocacaoFotos .btnProximo { display: flex; justify-content: center; align-items: center; cursor: pointer; background-color: var(--color-principal); width: 200px; height: 50px; } .btnsTermosLocacaoFotos .btnProximo p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 20px; line-height: 54px; /* identical to box height */ display: flex; align-items: center; text-align: center; text-transform: uppercase; color: #fff; } .btnsTermosLocacaoFotos .btnVoltar { display: flex; justify-content: center; align-items: center; cursor: pointer; background-color: var(--color-principal); width: 200px; height: 50px; } .btnsTermosLocacaoFotos .btnVoltar p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 20px; line-height: 54px; /* identical to box height */ display: flex; align-items: center; text-align: center; text-transform: uppercase; color: white } } /*COMPONENTES LOCACAO FOTOGRAFICA*/ /* ============= TITULOS AREA FOTOS/VIDEOS/PROJETOS/MIDIAS ============= */ .containerTotalTituloMFVP { display: grid; grid-template-rows: 16px 83px 16px; /* background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: right; background-size: contain; */ } .containerTotalTituloMFVP .containerMFVP { grid-area: 2/1/3/2; height: 83px; display: flex; justify-content: flex-start; align-items: center; background: transparent; } .containerTotalTituloMFVP .containerMFVP p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 56px; line-height: 83px; display: flex; align-items: center; color: #55471E; opacity: .6; } @media screen and (min-width: 1440px) { .containerTotalTituloMFVP { display: grid; grid-template-rows: 60px 10px 80px; /* background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: right; background-size: contain; */ } .containerTotalTituloMFVP .containerMFVP { grid-area: 2/1/3/2; height: 81px; display: flex; justify-content: flex-start; align-items: center; } .containerTotalTituloMFVP .containerMFVP p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 60px; line-height: 81px; display: flex; align-items: center; color: #55471E; } } .containerCardFoto { width: 150px; height: 150px; position: relative; cursor: pointer; } .containerCardFoto .cardFoto { /* display: flex; justify-content: center; align-items: center; */ } .cardFotoIcon { width: 128px; height: 128px; border: solid 2px white; top: 10px; left: 10px; position: absolute; } .cardFotoIcon1 { z-index: 9; display: grid; grid-template-rows: 40px auto; } .cardFotoIcon1 div { grid-area: 2/1/3/2; display: flex; justify-content: center; align-items: center; } .cardFotoIcon1 div p { font-family: var(--font-terciaria); font-style: normal; font-weight: bold; font-size: 14px; line-height: 18px; display: flex; align-items: center; color: #FFFFFF; text-shadow: 0px 4px 10px black; text-align: center; } .cardFotoIcon2 { transform: rotate(83deg); } .cardFotoIcon3 { transform: rotate(99deg); } .cardFotoIcon4 { transform: rotate(94deg); } @media screen and (min-width: 1024px) { .containerCardFoto { width: 190px; height: 190px; position: relative; } .containerCardFoto .cardFoto { /* display: flex; justify-content: center; align-items: center; */ } .cardFotoIcon { width: 180px; height: 180px; border: solid 2px white; top: 10px; left: 10px; position: absolute; } .cardFotoIcon1 { z-index: 9; display: grid; grid-template-rows: 110px auto auto; } .cardFotoIcon1 div { grid-area: 2/1/3/2; display: flex; justify-content: center; align-items: center; } .cardFotoIcon1 div p { font-family: var(--font-terciaria); font-style: normal; font-weight: bold; font-size: 18px; line-height: 27px; display: flex; align-items: center; color: #FFFFFF; text-shadow: 0px 4px 10px black; } .cardFotoIcon2 { transform: rotate(83deg); } .cardFotoIcon3 { transform: rotate(99deg); } .cardFotoIcon4 { transform: rotate(94deg); } } @media screen and (min-width: 1440px) { .containerCardFoto { width: 269px; height: 269px; position: relative; } .containerCardFoto .cardFoto { /* display: flex; justify-content: center; align-items: center; */ } .cardFotoIcon { width: 230px; height: 230px; border: solid 2px white; top: 10px; left: 10px; position: absolute; } .cardFotoIcon1 { z-index: 9; display: grid; grid-template-rows: 180px 23px auto; } .cardFotoIcon1 div { grid-area: 2/1/3/2; display: flex; justify-content: center; align-items: center; } .cardFotoIcon1 div p { font-family: var(--font-terciaria); font-style: normal; font-weight: bold; font-size: 18px; line-height: 27px; display: flex; align-items: center; color: #FFFFFF; text-shadow: 0px 4px 10px black; } .cardFotoIcon2 { transform: rotate(83deg); } .cardFotoIcon3 { transform: rotate(99deg); } .cardFotoIcon4 { transform: rotate(94deg); } } /* .containerImgsProjetos1 { width: 430px; height: 430px; } */ .containerImgsProjetos1 .ImgsProjetos1 { display: grid; grid-template-columns: 55px 140px 130px; grid-template-rows: 23px 198px 23px; } .containerImgsProjetos1 .ImgsProjetos1 .imgConjuntoProjetos1-1 { grid-area: 1/2/4/4; /* background: url(../Imgs/fundoCardProjeto1-1.jpg) no-repeat center center; */ background-size: cover; background-image: } .containerImgsProjetos1 .ImgsProjetos1 .imgConjuntoProjetos1-2 { grid-area: 2/1/3/3; /* background: url(../Imgs/fundoCardProjeto1-2.jpg) no-repeat center center; */ background-size: cover; z-index: 99; border: solid 5px white; } @media screen and (min-width: 1024px) { /* .containerImgsProjetos1 { width: 430px; height: 430px; display: flex; align-items: flex-end; flex-direction: column; justify-content: flex-start; } */ .containerImgsProjetos1 .ImgsProjetos1 { display: grid; grid-template-columns: 55px 140px 130px; grid-template-rows: 23px 198px 23px; } .containerImgsProjetos1 .ImgsProjetos1 .imgConjuntoProjetos1-1 { grid-area: 1/2/4/4; /* background: url(../Imgs/fundoCardProjeto1-1.jpg) no-repeat center center; */ background-size: cover; } .containerImgsProjetos1 .ImgsProjetos1 .imgConjuntoProjetos1-2 { grid-area: 2/1/3/3; /* background: url(../Imgs/fundoCardProjeto1-2.jpg) no-repeat center center; */ background-size: cover; z-index: 99; border: solid 11px white; } } @media screen and (min-width: 1440px) { /* .containerImgsProjetos1 { width: 488px; height: 595px; } */ .containerImgsProjetos1 .ImgsProjetos1 { display: grid; grid-template-columns: 120px 190px 315px; grid-template-rows: 60px 315px 60px; } .containerImgsProjetos1 .ImgsProjetos1 .imgConjuntoProjetos1-1 { grid-area: 1/2/4/5; background-color: black; /* background: url(../Imgs/fundoCardProjeto1-1.jpg) no-repeat center center; */ background-repeat: no-repeat; background-size: cover; } .containerImgsProjetos1 .ImgsProjetos1 .imgConjuntoProjetos1-2 { grid-area: 2/1/3/3; /* background: url(../Imgs/fundoCardProjeto1-2.jpg) no-repeat center center; */ background-size: cover; border-right-color: white; border-right-width: 10px; border-right-style: solid; border-bottom-color: white; border-bottom-width: 10px; border-bottom-style: solid; z-index: 99; background-repeat: no-repeat; background-size: cover; } } .containerImgsProjetos2 { width: 430px; height: 430px; display: flex; justify-content: flex-start; align-items: flex-start; } .containerImgsProjetos2 .ImgsProjetos2 { display: grid; grid-template-columns: 153px 40px 135px; grid-template-rows: 34px 138px 64px; } .containerImgsProjetos2 .ImgsProjetos2 .imgConjuntoProjetos2-1 { grid-area: 1/1/3/3; /* background: url(../Imgs/fundoCardProjeto2-2.jpg) no-repeat center center; */ background-size: cover; background-repeat: no-repeat; background-position: center; } .containerImgsProjetos2 .ImgsProjetos2 .imgConjuntoProjetos2-2 { grid-area: 2/2/4/4; /* background: url(../Imgs/fundoCardProjeto2-1.jpg) no-repeat center center; */ background-size: cover; z-index: 99; border: solid 11px white; background-size: cover; background-repeat: no-repeat; background-position: center; } @media screen and (min-width: 1024px) { .containerImgsProjetos2 { width: auto; height: auto; display: flex; justify-content: flex-end; align-items: flex-end; } } @media screen and (min-width: 1440px) { .containerImgsProjetos2 { width: auto; height: auto; display: flex; justify-content: flex-end; align-items: flex-end; } .containerImgsProjetos2 .ImgsProjetos2 { display: grid; grid-template-columns: 257px 66px 281px; grid-template-rows: 58px 168px 98px; } .containerImgsProjetos2 .ImgsProjetos2 .imgConjuntoProjetos2-1 { grid-area: 1/1/3/3; background-color: black; /* background: url(../Imgs/fundoCardProjeto2-2.jpg) no-repeat center center; */ background-size: contain; background-size: cover; background-repeat: no-repeat; background-position: center; } .containerImgsProjetos2 .ImgsProjetos2 .imgConjuntoProjetos2-2 { grid-area: 2/2/4/4; /* background: url(../Imgs/fundoCardProjeto2-1.jpg) no-repeat center center; */ background-size: cover; border: solid 11px white; z-index: 99; background-size: cover; background-repeat: no-repeat; background-position: center; } } .informacoesProjetos { display: grid; grid-row-gap: 16px; grid-template-columns: 330px; } .informacoesProjetos .informacoesProjetosTexto { } .informacoesProjetos .informacoesProjetosImg { height: auto; } .tituloPrincipalH1Projetos { display: flex; justify-content: flex-start; align-items: center; } .tituloPrincipalH1Projetos div { display: flex; justify-content: flex-start; align-items: center; } .tituloPrincipalH1Projetos div p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 21px; line-height: 34px; /* identical to box height */ display: flex; align-items: center; color: #3FB0A2; } .informacoesProjetos .informacoesProjetosTexto div { display: flex; justify-content: flex-start; align-items: center; } .informacoesProjetos .informacoesProjetosTexto div p { font-family: var(--font-secundaria); font-size: 12px; line-height: 18px; color: #454545; } /* .informacoesProjetos .informacoesProjetosImg .containerInformacoesProjetosImg{ display: grid; grid-template-rows: auto 52px; } */ .informacoesProjetos .informacoesProjetosImg .posicaoBackgroundImgCardProjetos1 { background: url(../Imgs/casandoComNaturezaTinta.png) no-repeat !important; background-size: contain !important; background-position: bottom !important; background-position-y: 243px !important; background-position-x: 84px !important; } .informacoesProjetos .informacoesProjetosImg .posicaoBackgroundImgCardProjetos2 { background-image: url(../Imgs/DecoracaoTinta.png) !important; background-repeat: no-repeat !important; background-position-x: left; background-position-y: 170px; } @media screen and (min-width: 1024px) { .informacoesProjetos { display: grid; grid-template-columns: 550px 400px; grid-column-gap: 30px; /* grid-template-rows: 60px auto; */ /* background: url(../Imgs/projetosTintaDesktop.png) no-repeat, url(../Imgs/projetosTintaDesktop2.png) no-repeat; */ /* background: url(../Imgs/projetosTintaDesktop.png) no-repeat; */ /* background: url(../Imgs/projetosTintaDesktop2.png) no-repeat; */ } .tituloPrincipalH1Projetos div { display: flex; justify-content: flex-start; align-items: center; } .tituloPrincipalH1Projetos div p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 37px; line-height: 60px; /* identical to box height */ display: flex; align-items: center; color: #3FB0A2; } .informacoesProjetos .informacoesProjetosTexto { grid-area: 1/1/2/2; } .informacoesProjetos .informacoesProjetosTexto div { display: flex; justify-content: flex-start; align-items: flex-start; } .informacoesProjetos .informacoesProjetosTexto div p { font-family: var(--font-secundaria); font-size: 16px; line-height: 24px; color: #454545; } .informacoesProjetos .informacoesProjetosImg { grid-area: 1/2/3/3; display: flex; justify-content: flex-start; align-items: center; height: auto; } /* .informacoesProjetos .informacoesProjetosImg .containerInformacoesProjetosImg{ display: grid; grid-template-rows: auto 52px; } */ .informacoesProjetos .informacoesProjetosImg .posicaoBackgroundImgCardProjetos1 { background: none !important; background-size: none !important; background-position: none !important; background-position-y: none !important; background-position-x: none !important; } .informacoesProjetos .informacoesProjetosImg .posicaoBackgroundImgCardProjetos2 { background: none !important; background-size: none !important; background-position: none !important; background-position-x: none !important; } } @media screen and (min-width: 1440px) { .informacoesProjetos { display: grid; grid-row-gap: 32px; grid-template-columns: auto auto; grid-column-gap: 60px; /* grid-template-rows: 60px auto; */ /* background: url(../Imgs/projetosTintaDesktop.png) no-repeat, url(../Imgs/projetosTintaDesktop2.png) no-repeat; */ /* background: url(../Imgs/projetosTintaDesktop.png) no-repeat; */ /* background: url(../Imgs/projetosTintaDesktop2.png) no-repeat; */ } .tituloPrincipalH1Projetos div { display: flex; justify-content: flex-start; align-items: center; } .tituloPrincipalH1Projetos div p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 37px; line-height: 60px; /* identical to box height */ display: flex; align-items: center; color: #3FB0A2; } .informacoesProjetos .informacoesProjetosTexto { grid-area: 1/1/2/2; } .informacoesProjetos .informacoesProjetosTexto div { display: flex; justify-content: flex-start; align-items: flex-start; } .informacoesProjetos .informacoesProjetosTexto div p { font-family: var(--font-secundaria); font-size: 16px; line-height: 24px; color: #454545; } .informacoesProjetos .informacoesProjetosImg { grid-area: 1/2/3/3; display: flex; justify-content: flex-start; align-items: center; height: auto; } /* .informacoesProjetos .informacoesProjetosImg .containerInformacoesProjetosImg{ display: grid; grid-template-rows: auto 52px; } */ .informacoesProjetos .informacoesProjetosImg .posicaoBackgroundImgCardProjetos1 { background: none !important; background-size: none !important; background-position: none !important; background-position-y: none !important; background-position-x: none !important; } .informacoesProjetos .informacoesProjetosImg .posicaoBackgroundImgCardProjetos2 { background: none !important; background-size: none !important; background-position: none !important; background-position-x: none !important; } } @media screen and (min-width: 1024px) { .listaFotosProjetos { width: 222px; height: 224px; /* background: url(../Imgs/listaFotosProjetos.jpg) no-repeat center center; */ background-size: cover; cursor: pointer; } .listaFotosProjetos div { justify-content: center; align-items: center; background-color: rgba(63, 176, 162, 0.8); width: 100%; height: 100%; } .listaFotosProjetos div p { font-style: normal; font-weight: normal; font-size: 28px; line-height: 40px; display: flex; align-items: center; text-align: center; color: #FFFFFF; text-transform: uppercase; } } @media screen and (min-width: 1440px) { .listaFotosProjetos { width: 265px; height: 224px; /* background: url(../Imgs/listaFotosProjetos.jpg) no-repeat center center; */ background-size: cover; cursor: pointer; } .listaFotosProjetos div { justify-content: center; align-items: center; background-color: rgba(63, 176, 162, 0.8); width: 100%; height: 100%; } .listaFotosProjetos div p { font-style: normal; font-weight: normal; font-size: 40px; line-height: 54px; display: flex; align-items: center; text-align: center; color: #FFFFFF; text-transform: uppercase; } } .citacoesClientesCard { width: 330px; height: 421px; /* background:url(../Imgs/citacoesClientes.jpg) no-repeat center center; */ background-size: cover; display: flex; justify-content: center; align-items: center; } .citacoesClientesCard div { width: 221px; display: flex; justify-content: center; align-items: center; } .citacoesClientesCard div p { font-family: var(--font-quartenaria); font-style: normal; font-weight: normal; font-size: 14px; line-height: 170%; /* or 24px */ text-align: center; color: #FFFFFF; } @media screen and (min-width: 1024px) { .citacoesClientesCard { width: 900px; height: 538px; /* background:url(../Imgs/citacoesClientes.jpg) no-repeat center center; */ background-size: cover; display: flex; justify-content: center; align-items: center; } .citacoesClientesCard div { width: 958px; display: flex; justify-content: center; align-items: center; } .citacoesClientesCard div p { font-family: var(--font-quartenaria); font-style: normal; font-weight: normal; font-size: 20px; line-height: 170%; /* or 24px */ text-align: center; color: #FFFFFF; } } @media screen and (min-width: 1440px) { .citacoesClientesCard { width: 1100px; height: 538px; /* background:url(../Imgs/citacoesClientes.jpg) no-repeat center center; */ background-size: cover; display: flex; justify-content: center; align-items: center; } .citacoesClientesCard div { width: 958px; display: flex; justify-content: center; align-items: center; } .citacoesClientesCard div p { font-family: var(--font-quartenaria); font-style: normal; font-weight: normal; font-size: 28px; line-height: 170%; /* or 24px */ text-align: center; color: #FFFFFF; } } .containerTotalCardVideo { width: 330px; height: 220px; /* background: url(../Imgs/videosCard.jpg) no-repeat center center; */ background-size: cover; cursor: pointer; background-repeat: no-repeat; background-position: center; } .containerTotalCardVideo .containerCardVideo { background: linear-gradient(0deg, #000000 0%, rgba(0, 0, 0, 0) 100%); width: 100%; height: 100%; display: grid; grid-template-columns: auto 296px auto; } .containerTotalCardVideo .containerCardVideo .cardVideo { grid-area: 1/2/2/3; display: grid; grid-template-rows: 83px 55px 40px 19px 22px; } .containerTotalCardVideo .containerCardVideo .cardVideo .iconPlay { grid-area: 2/1/3/2; display: flex; justify-content: center; align-items: center; } .containerTotalCardVideo .containerCardVideo .cardVideo .iconPlay div { width: 55px; height: 55px; background: url(../Imgs/playVideo.png) no-repeat center center; background-size: cover; } .containerTotalCardVideo .containerCardVideo .cardVideo .txtVideoCard { grid-area: 4/1/5/2; } .containerTotalCardVideo .containerCardVideo .cardVideo .txtVideoCard div { display: flex; justify-content: flex-start; align-items: center; } .containerTotalCardVideo .containerCardVideo .cardVideo .txtVideoCard div p { font-family: var(--font-terciaria); font-style: normal; font-weight: bold; font-size: 18px; line-height: 27px; display: flex; align-items: center; color: #FFFFFF; } @media screen and (min-width: 1024px) { .containerTotalCardVideo { width: 300px; height: 250px; /* background: url(../Imgs/videosCard.jpg) no-repeat center center; */ background-size: cover; cursor: pointer; } .containerTotalCardVideo .containerCardVideo { background: linear-gradient(0deg, #000000 0%, rgba(0, 0, 0, 0) 100%); width: 100%; height: 100%; display: grid; grid-template-columns: auto 260px auto; } .containerTotalCardVideo .containerCardVideo .cardVideo { grid-area: 1/2/2/3; display: grid; grid-template-rows: 93px 62px 45px 22px 25px; } .containerTotalCardVideo .containerCardVideo .cardVideo .iconPlay { grid-area: 2/1/3/2; display: flex; justify-content: center; align-items: center; } .containerTotalCardVideo .containerCardVideo .cardVideo .iconPlay div { width: 62px; height: 62px; background: url(../Imgs/playVideo.png) no-repeat center center; background-size: cover; } .containerTotalCardVideo .containerCardVideo .cardVideo .txtVideoCard { grid-area: 4/1/5/2; } .containerTotalCardVideo .containerCardVideo .cardVideo .txtVideoCard div { display: flex; justify-content: flex-start; align-items: center; } .containerTotalCardVideo .containerCardVideo .cardVideo .txtVideoCard div p { font-family: var(--font-terciaria); font-style: normal; font-weight: bold; font-size: 18px; line-height: 27px; display: flex; align-items: center; color: #FFFFFF; } } @media screen and (min-width: 1440px) { .containerTotalCardVideo { width: 370px; height: 250px; /* background: url(../Imgs/videosCard.jpg) no-repeat center center; */ background-size: cover; cursor: pointer; } .containerTotalCardVideo .containerCardVideo { background: linear-gradient(0deg, #000000 0%, rgba(0, 0, 0, 0) 100%); width: 100%; height: 100%; display: grid; grid-template-columns: auto 296px auto; } .containerTotalCardVideo .containerCardVideo .cardVideo { grid-area: 1/2/2/3; display: grid; grid-template-rows: 93px 62px 45px 22px 25px; } .containerTotalCardVideo .containerCardVideo .cardVideo .iconPlay { grid-area: 2/1/3/2; display: flex; justify-content: center; align-items: center; } .containerTotalCardVideo .containerCardVideo .cardVideo .iconPlay div { width: 62px; height: 62px; background: url(../Imgs/playVideo.png) no-repeat center center; background-size: cover; } .containerTotalCardVideo .containerCardVideo .cardVideo .txtVideoCard { grid-area: 4/1/5/2; } .containerTotalCardVideo .containerCardVideo .cardVideo .txtVideoCard div { display: flex; justify-content: flex-start; align-items: center; } .containerTotalCardVideo .containerCardVideo .cardVideo .txtVideoCard div p { font-family: var(--font-terciaria); font-style: normal; font-weight: bold; font-size: 18px; line-height: 27px; display: flex; align-items: center; color: #FFFFFF; } } .containerCardMidiaV1 { width: 100%; height: auto; } .mediaContainerFotos1{ display: grid; row-gap: 40px; } .containerCardMidiaV1 .cardMidiaV1 { display: grid; grid-row-gap: 5px; } .containerCardMidiaV1 .cardMidiaV1 .containerImgCardEImagem { } .containerCardMidiaV1 .cardMidiaV1 .containerImgCardEImagem .imgCardMidiaV1 { width: 100%; height: 200px; /* background: url(../Imgs/midia.jpg) no-repeat center center; */ background-size: cover; } /* MOBILE */ .containerCardMidiaV1 .cardMidiaV1 .containerImgCardEImagem .subtituloImgCardMedia { display: flex; justify-content: flex-end; align-items: center; flex-direction: column; margin-top: -10px; } .containerCardMidiaV1 .cardMidiaV1 .containerImgCardEImagem .subtituloImgCardMedia div { display: grid; grid-template-columns: 10px auto 10px; grid-template-rows: 5px auto 5px; background-color: #964B00; } .containerCardMidiaV1 .cardMidiaV1 .containerImgCardEImagem .subtituloImgCardMedia div p { grid-area: 2/2/3/3; font-size: 10px; color: white; font-family: var(--font-primaria); } .containerCardMidiaV1 .cardMidiaV1 .dataMidiaV1 { width: 100%; height: 8px; } .containerCardMidiaV1 .cardMidiaV1 .dataMidiaV1 div { display: flex; justify-content: flex-end; align-items: center; } .containerCardMidiaV1 .cardMidiaV1 .dataMidiaV1_Ajuste div p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 14px; line-height: 100%; /* identical to box height, or 8px */ display: flex; align-items: center; text-align: center; color: #737373; /* a11y: contrast bumped from #939393 to #737373 */ } .containerCardMidiaV1 .cardMidiaV1 .dataMidiaV1 div p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 8px; line-height: 100%; /* identical to box height, or 8px */ display: flex; align-items: center; text-align: right; color: #3FB0A2; } .containerCardMidiaV1 .cardMidiaV1 .txtCardMidiaV1 { width: 100%; } .containerCardMidiaV1 .cardMidiaV1 .txtCardMidiaV1 div { display: flex; justify-content: flex-start; align-items: center; } .containerCardMidiaV1 .cardMidiaV1 .txtCardMidiaV1 div p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 11px; line-height: 150%; /* identical to box height, or 8px */ display: flex; align-items: center; text-align: center; color: grey; cursor: pointer; transition: .5s; } .containerCardMidiaV1:hover .cardMidiaV1 .txtCardMidiaV1 div p { color: #eeafa4; transition: .5s; } .containerCardMidiaV1:hover .cardMidiaV1 .dataMidiaV1_Ajuste div p { color: #eeafa4; transition: .5s; } @media screen and (min-width: 1440px) { .containerCardMidiaV1 { width: 500px; height: auto; } .containerCardMidiaV1 .cardMidiaV1 { display: grid; grid-row-gap: 5px; } .containerCardMidiaV1 .cardMidiaV1 .imgCardMidiaV1 div { } .containerCardMidiaV1 .cardMidiaV1 .imgCardMidiaV1 div p { } .containerCardMidiaV1 .cardMidiaV1 .dataMidiaV1 { width: 100%; height: auto; } .containerCardMidiaV1 .cardMidiaV1 .dataMidiaV1 div { display: flex; justify-content: flex-end; align-items: center; } .containerCardMidiaV1 .cardMidiaV1 .dataMidiaV1 div p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 20px; line-height: 100%; /* identical to box height, or 8px */ display: flex; align-items: center; text-align: right; color: #3FB0A2; } .containerCardMidiaV1 .cardMidiaV1 .txtCardMidiaV1 { width: 100%; } .containerCardMidiaV1 .cardMidiaV1 .txtCardMidiaV1 div { display: flex; justify-content: flex-start; align-items: center; } .containerCardMidiaV1 .cardMidiaV1 .txtCardMidiaV1 div p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 18px; line-height: 150%; /* identical to box height, or 8px */ display: flex; align-items: center; text-align: center; color: grey; transition: .5s; cursor: pointer; } .containerCardMidiaV1:hover .cardMidiaV1 .txtCardMidiaV1 div p { color: #eeafa4; transition: .5s; } .containerCardMidiaV1:hover .cardMidiaV1 .dataMidiaV1_Ajuste div p { color: #eeafa4; transition: .5s; } .containerCardMidiaV1 { width: 370px; } .containerCardMidiaV1 .cardMidiaV1 .containerImgCardEImagem { } .containerCardMidiaV1 .cardMidiaV1 .containerImgCardEImagem .imgCardMidiaV1 { width: 100%; height: 176px; /* background: url(../Imgs/midia.jpg) no-repeat center center; */ background-size: cover; } .containerCardMidiaV1 .cardMidiaV1 .containerImgCardEImagem .subtituloImgCardMedia { display: flex; justify-content: flex-end; align-items: center; flex-direction: column; margin-top: -20px; } .containerCardMidiaV1 .cardMidiaV1 .containerImgCardEImagem .subtituloImgCardMedia div { display: grid; grid-template-columns: 30px auto 30px; grid-template-rows: 10px auto 10px; background-color: #964B00; } .containerCardMidiaV1 .cardMidiaV1 .containerImgCardEImagem .subtituloImgCardMedia div p { grid-area: 2/2/3/3; font-family: var(--font-primaria); color: white; font-size: 15px; } .containerCardMidiaV1 .cardMidiaV1 .dataMidiaV1 { width: 100%; height: auto; } .containerCardMidiaV1 .cardMidiaV1 .dataMidiaV1 div { display: flex; justify-content: flex-end; align-items: center; } .containerCardMidiaV1 .cardMidiaV1 .dataMidiaV1 div p { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 16px; line-height: 100%; /* identical to box height, or 8px */ display: flex; align-items: center; text-align: right; color: #3FB0A2; } .containerCardMidiaV1 .cardMidiaV1 .txtCardMidiaV1 { width: 100%; } .containerCardMidiaV1 .cardMidiaV1 .txtCardMidiaV1 div { display: flex; justify-content: flex-start; align-items: center; } } #containerFrameFoto { width: 100%; min-width: 100vw; height: 100%; min-height: 100vh; position: fixed; z-index: 99999; background-color: rgba(0, 0, 0, .5); display: flex; justify-content: center; align-items: center; flex-direction: column; } /* #containerFrameFoto #renderizaFotoFrame { width: 336px; height: 224px; background-repeat: no-repeat; background-position: center; background-size: cover; } */ #containerFrameFoto #fecharFrameFoto { display: flex; justify-content: flex-end; align-items: center; width: 336px; /* margin-bottom: 20px; */ } #containerFrameFoto #fecharFrameFoto div { width: 20px; height: 20px; background: url(../Imgs/closeFrameFoto.png) no-repeat center center; cursor: pointer; background-size: contain; margin-bottom: 5px; } #containerFrameFoto #pinterestFoto { display: flex; justify-content: flex-start; align-items: center; width: 336px; } #containerFrameFoto #pinterestFoto div { background-image: url(../Imgs/pinterest.png); width: 50px; height: 50px; display: flex; background-size: cover; background-repeat: no-repeat; background-color: white; position: absolute; margin-top: 5px; z-index: 99; margin-left: 10px; opacity: 0; cursor: pointer; } #containerFrameFoto #pinterestFoto div:hover { opacity: 1; transition: .5s; } #swiperContainerFrameFoto { width: 336px; height: auto; } .swiperSlideFrameFoto{ min-height: 40px; } @media screen and (min-width: 1024px) { #containerFrameFoto { width: 100%; min-width: 100vw; height: 100%; min-height: 100vh; position: fixed; z-index: 99999; background-color: rgba(0, 0, 0, .5); display: flex; justify-content: center; align-items: center; flex-direction: column; } /* #containerFrameFoto #renderizaFotoFrame { width: 976px; height: 650px; background-repeat: no-repeat; background-position: center; background-size: cover; } */ #containerFrameFoto #fecharFrameFoto { display: flex; justify-content: flex-end; align-items: center; width: 976px; /* margin-bottom: 20px; */ } #containerFrameFoto #fecharFrameFoto div { width: 30px; height: 30px; background: url(../Imgs/closeFrameFoto.png) no-repeat center center; cursor: pointer; background-size: contain; } #containerFrameFoto #pinterestFoto { display: flex; justify-content: flex-start; align-items: center; width: 976px; } #containerFrameFoto #pinterestFoto div { background-image: url(../Imgs/pinterest.png); width: 50px; height: 50px; display: flex; background-size: cover; background-repeat: no-repeat; background-color: white; position: absolute; margin-top: 5px; z-index: 99; margin-left: 10px; opacity: 0; cursor: pointer; } #containerFrameFoto #pinterestFoto div:hover { display: flex; transition: .5s; opacity: 1 !important; } #swiperContainerFrameFoto { width: 976px; height: auto; } /* .swiperSlideFrameFoto div { width: 976px; height: 650px; background-repeat: no-repeat; background-size: contain; background-position: center; } */ } @media screen and (min-width: 1440px) { #containerFrameFoto { width: 100%; min-width: 100vw; height: 100%; min-height: 100vh; position: fixed; z-index: 99999; background-color: rgba(0, 0, 0, .5); display: flex; justify-content: center; align-items: center; flex-direction: column; } /* #containerFrameFoto #renderizaFotoFrame { width: 976px; height: 650px; background-repeat: no-repeat; background-position: center; background-size: cover; } */ #containerFrameFoto #fecharFrameFoto { display: flex; justify-content: flex-end; align-items: center; width: 976px; } #containerFrameFoto #fecharFrameFoto div { width: 30px; height: 30px; background: url(../Imgs/closeFrameFoto.png) no-repeat center center; background-size: contain; cursor: pointer; } #containerFrameFoto #pinterestFoto { display: flex; justify-content: flex-start; align-items: center; width: 976px; } #containerFrameFoto #pinterestFoto div { background-image: url(../Imgs/pinterest.png); width: 50px; height: 50px; display: flex; background-size: cover; background-repeat: no-repeat; background-color: white; position: absolute; margin-top: 5px; z-index: 99; margin-left: 10px; opacity: 0; cursor: pointer; } #containerFrameFoto #pinterestFoto div:hover { display: flex; transition: .5s; opacity: 1 !important; } #swiperContainerFrameFoto { width: 976px; height: auto; } /* .swiperSlideFrameFoto div { width: 976px; height: 650px; background-repeat: no-repeat; background-size: contain; background-position: center; } */ } #abaPopUpCardsAndFotos { display: none; } #containerFrameVideo { width: 100%; min-width: 100vw; height: 100%; min-height: 100vh; position: fixed; z-index: 99999; background-color: rgba(0, 0, 0, .5); display: flex; justify-content: center; align-items: center; flex-direction: column; } #containerFrameVideo .subcontainerFrameVideo { display: grid; grid-row-gap: 20px; } #containerFrameVideo .subcontainerFrameVideo #renderizaVideoFrame { width: auto; height: auto; background-repeat: no-repeat; background-position: center; background-size: cover; display: flex; justify-content: center; align-items: center; } #containerFrameVideo .subcontainerFrameVideo #renderizaVideoFrame video { width: 321px; } #containerFrameVideo .subcontainerFrameVideo #fecharFrameVideo div { width: 12px; height: 12px; background: url(../Imgs/closeFrameFoto.png) no-repeat center center; } #containerFrameVideo .subcontainerFrameVideo #fecharFrameVideo { display: flex; justify-content: flex-end; align-items: center; width: 100%; } #containerFrameVideo .subcontainerFrameVideo #fecharFrameVideo div { width: 20px; height: 20px; background: url(../Imgs/closeFrameFoto.png) no-repeat center center; cursor: pointer; } @media screen and (min-width: 1024px) { #containerFrameVideo .subcontainerFrameVideo { width: 100%; min-width: 100vw; height: 100%; min-height: 100vh; position: fixed; z-index: 99999; background-color: rgba(0, 0, 0, .5); display: flex; justify-content: center; align-items: center; flex-direction: column; } #containerFrameVideo .subcontainerFrameVideo #renderizaVideoFrame { width: 900px; height: auto; background-repeat: no-repeat; background-position: center; background-size: cover; display: flex; justify-content: center; align-items: center; } #containerFrameVideo .subcontainerFrameVideo #renderizaVideoFrame video { width: 900px; } #containerFrameVideo .subcontainerFrameVideo #fecharFrameVideo { display: flex; justify-content: flex-end; align-items: center; width: 90%; cursor: pointer; margin-bottom: 50px; } #containerFrameVideo .subcontainerFrameVideo #fecharFrameVideo div { width: 20px; height: 20px; background: url(../Imgs/closeFrameFoto.png) no-repeat center center; } } @media screen and (min-width: 1440px) { .campo2Linhas { width: 206%; } #containerFrameVideo .subcontainerFrameVideo { width: 100%; min-width: 100vw; height: 100%; min-height: 100vh; position: fixed; z-index: 99999; background-color: rgba(0, 0, 0, .5); display: flex; justify-content: center; align-items: center; flex-direction: column; } #containerFrameVideo .subcontainerFrameVideo #renderizaVideoFrame { width: 1035px; height: auto; background-repeat: no-repeat; background-position: center; background-size: cover; display: flex; justify-content: center; align-items: center; } #containerFrameVideo .subcontainerFrameVideo #renderizaVideoFrame video { width: 1035px; } #containerFrameVideo .subcontainerFrameVideo #fecharFrameVideo { display: flex; justify-content: flex-end; align-items: center; width: 75%; cursor: pointer; margin-bottom: 50px; } #containerFrameVideo .subcontainerFrameVideo #fecharFrameVideo div { width: 20px; height: 20px; background: url(../Imgs/closeFrameFoto.png) no-repeat center center; } } #abaPopUpCardsAndFotos { display: none; } .inputInfoReserva { display: grid; grid-row-gap: 9px; } .inputInfoReserva .inputInfoReservaTitulo { display: flex; justify-content: flex-start; align-items: center; } .labelReservaTitulo { font-family: var(--font-secundaria); font-size: 16px; line-height: 16px; /* identical to box height */ display: flex; align-items: center; color: #3FB0A2; font-weight: bold; } .containerInputInfoReserva { /* border-bottom: 1px solid #3FB0A2; */ width: 100%; height: 100%; } .containerInputInfoReserva input { font-size: 12px; } .corChaVilla { color: #DC82B7 !important; } .bordaCorChaVilla { border-bottom: 1px solid #DC82B7; width: 100%; height: 100%; } .bordaCorLocaoFotografica { border-bottom: 1px solid #3FB0A2; } .bordaCorChaVilla input { color: #DC82B7; } .btnSelectInputFormCha { background: url(../Imgs/selectCha.png) no-repeat; } .btnSelectInputFormCha { color: #DC82B7 !important; } .btnSelectInputForm { background: url(../Imgs/select.png) no-repeat; } .btnSelectInputForm { color: #22776C; } .containerInputInfoReserva select { width: 100%; -webkit-appearance: none; /* Remove estilo padrão do Chrome */ -moz-appearance: none; /* Remove estilo padrão do FireFox */ appearance: none; /* Remove estilo padrão do FireFox*/ /* background: url(../Imgs/select.png) no-repeat; */ background-size: 13px 7px; background-position: right; padding-bottom: 8px; font-family: var(--font-secundaria); font-size: 16px; line-height: 16px; padding-left: 2px; border-top: none; border-right: none; border-left: none; border-radius: 0px; } .containerInputInfoReserva select option { font-family: var(--font-secundaria); font-size: 16px; line-height: 16px; /* identical to box height */ display: flex; align-items: center; color: #767676; /* a11y: contrast bumped from #B2B2B2 to #767676 */ } .containerInputInfoReserva input[type="text"] { border-right: none; border-top: none; border-left: none; padding-left: 2px; width: 100%; height: 100%; } .containerInputInfoReserva input[type="text"]::placeholder { font-family: var(--font-secundaria); font-size: 16px; line-height: 16px; color: #767676; /* a11y: contrast bumped from #B2B2B2 to #767676 */ } .containerInputInfoReserva input[type="time"] { border-right: none; border-top: none; border-left: none; padding-left: 2px; width: 100%; height: 100%; background: transparent; font-family: var(--font-secundaria); } .containerInputInfoReserva input[type="time"]:read-only { color: #666; /* a11y: contrast bumped from #888 to #666 */ cursor: not-allowed; } #divHorarioFuncionamento { display: flex; flex-direction: row; gap: 16px; } #divHorarioFuncionamento > .inputInfoReserva { flex: 1; min-width: 0; } @media screen and (min-width: 1024px) { .inputInfoReserva { display: grid; grid-row-gap: 9px; height: 60px; grid-template-rows: min-content; } .containerInputInfoReserva input { font-size: 16px; } } @media screen and (min-width: 1440px) { .inputInfoReserva { display: grid; grid-row-gap: 9px; height: 60px; grid-template-rows: min-content; } .inputInfoReserva .inputInfoReservaTitulo { display: flex; justify-content: flex-start; align-items: center; } .labelReservaTitulo { font-family: var(--font-secundaria); font-size: 16px; line-height: 16px; /* identical to box height */ display: flex; align-items: center; color: #3FB0A2; font-weight: bold; } .containerInputInfoReserva { /* border-bottom: 1px solid #3FB0A2; */ width: 100%; height: 100%; } .containerInputInfoReserva input { font-size: 18px; } .containerInputInfoReserva select { width: 100%; -webkit-appearance: none; /* Remove estilo padrão do Chrome */ -moz-appearance: none; /* Remove estilo padrão do FireFox */ appearance: none; /* Remove estilo padrão do FireFox*/ /* background: url(../Imgs/select.png) no-repeat; */ background-size: 13px 7px; background-position: right; padding-bottom: 8px; font-family: var(--font-secundaria); font-size: 18px; line-height: 18px; padding-left: 2px; border-top: none; border-right: none; border-left: none; } .containerInputInfoReserva select option { font-family: var(--font-secundaria); font-size: 18px; line-height: 18px; /* identical to box height */ display: flex; align-items: center; color: #767676; /* a11y: contrast bumped from #B2B2B2 to #767676 */ } .containerInputInfoReserva input[type="text"] { border-right: none; border-top: none; border-left: none; padding-left: 2px; height: 90%; -moz-appearance: none; -webkit-appearance: none; } .containerInputInfoReserva input[type="text"]::placeholder { font-family: var(--font-secundaria); font-size: 18px; line-height: 18px; color: #767676; /* a11y: contrast bumped from #B2B2B2 to #767676 */ } } .locacaoAcessoriosCardContainer { width: 330px; height: 105px; border-radius: 4px; box-shadow: -1px 2px 4px 3px rgba(0, 0, 0, 0.25); } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard { display: grid; /*grid-template-columns: 85px 194px 51px;*/ grid-template-columns: 85px 164px 81px; grid-template-rows: 105px; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .imgCardLocacaoAcessorios { grid-area: 1/1/2/2; background-image: url(../Imgs/cardLocacaoAcessorio.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; border-top-left-radius: 4px; border-bottom-left-radius: 4px; transition: .5s; cursor: pointer; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .imgCardLocacaoAcessorios:hover { filter: blur(0px); opacity: 0.5; transition: .5s; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .imgCardLocacaoAcessorios:hover + .infoCardLocacaoAcessorios { filter: blur(0px); opacity: 0.5; transition: .5s; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios { grid-area: 1/2/2/3; display: grid; grid-template-rows: 8px auto 8px; grid-template-columns: 8px auto 8px; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer { grid-area: 2/2/3/3; display: grid; grid-row-gap: 5px; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .numeroReferenciaCard { display: flex; justify-content: flex-start; align-items: center; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .numeroReferenciaCard p { font-family: var(--font-secundaria); font-size: 10px; line-height: 100%; text-align: right; color: rgba(0, 0, 0, 0.5); } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .informacoesProdutoCardLocacaoFotografica { display: grid; grid-row-gap: 8px; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .informacoesProdutoCardLocacaoFotografica div { display: flex; align-items: center; justify-content: flex-start; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .informacoesProdutoCardLocacaoFotografica div p { font-family: var(--font-primaria); font-size: 14px; line-height: 100%; color: #000000; font-weight: bold; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .informacoesProdutoCardLocacaoFotografica div span { font-size: 10px; line-height: 100%; color: rgba(0, 0, 0, 0.5); } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .precoCardLocacaoFotografica { display: flex; justify-content: flex-end; align-items: center; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .precoCardLocacaoFotografica p { font-family: var(--font-primaria); font-size: 24px; line-height: 150%; /* font-weight: bold; */ color: #000000; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .checkCardLocacaoAcessorios { grid-area: 1/3/2/4; display: flex; justify-content: center; align-items: center; background-color: #3FB0A2; border-radius: 0px 4px 4px 0px } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .checkCardLocacaoAcessorios input { -webkit-appearance: none; background: url(../Imgs/checkboxCardLocacao.png) no-repeat center center; background-size: cover; width: 15px; height: 15px; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .checkCardLocacaoAcessorios input:checked { -webkit-appearance: none; background: url(../Imgs/checkboxCardLocacaoMarcado.png) no-repeat center center; background-size: cover; } @media screen and (min-width: 1024px) { .locacaoAcessoriosCardContainer { width: 270px; height: auto; border-radius: 4px; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard { display: grid; grid-template-rows: 154px 120px 58px; grid-template-columns: 270px; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .imgCardLocacaoAcessorios { grid-area: 1/1/2/2; background-image: url(../Imgs/cardLocacaoAcessorio.jpg); background-repeat: no-repeat; background-size: contain; background-position: center; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios { grid-area: 2/1/3/2; display: grid; grid-template-rows: 16px auto 16px; grid-template-columns: 16px auto 16px; justify-content: center; align-items: center; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer { grid-area: 2/2/3/3; display: grid; grid-row-gap: 10px; grid-auto-rows: min-content; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .numeroReferenciaCard { display: flex; justify-content: flex-end; align-items: center; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .numeroReferenciaCard p { font-family: var(--font-secundaria); font-size: 12px; line-height: 100%; text-align: right; color: rgba(0, 0, 0, 0.5); } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .informacoesProdutoCardLocacaoFotografica { display: grid; grid-row-gap: 12px; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .informacoesProdutoCardLocacaoFotografica div { display: flex; align-items: center; justify-content: center; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .informacoesProdutoCardLocacaoFotografica div p { font-family: var(--font-primaria); font-size: 20px; line-height: 100%; color: #000000; font-weight: bold; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .informacoesProdutoCardLocacaoFotografica div span { font-size: 16px; line-height: 100%; color: rgba(0, 0, 0, 0.5); } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .precoCardLocacaoFotografica { display: flex; justify-content: center; align-items: center; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .precoCardLocacaoFotografica p { font-family: var(--font-primaria); font-size: 24px; line-height: 150%; text-align: right; /* font-weight: bold; */ color: #000000; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .checkCardLocacaoAcessorios { grid-area: 3/1/4/2; display: flex; justify-content: center; align-items: center; background-color: #3FB0A2; border-radius: 0px 4px 4px 0px } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .checkCardLocacaoAcessorios input { -webkit-appearance: none; background: url(../Imgs/checkboxCardLocacao.png) no-repeat center center; background-size: cover; width: 32px; height: 32px; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .checkCardLocacaoAcessorios input:checked { -webkit-appearance: none; background: url(../Imgs/checkboxCardLocacaoMarcado.png) no-repeat center center; background-size: cover; } } @media screen and (min-width: 1440px) { .locacaoAcessoriosCardContainer { width: 270px; height: auto; border-radius: 4px; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard { display: grid; grid-template-rows: 154px 120px 58px; grid-template-columns: 270px; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .imgCardLocacaoAcessorios { grid-area: 1/1/2/2; background-image: url(../Imgs/cardLocacaoAcessorio.jpg); background-repeat: no-repeat; background-size: contain; background-position: center; transition: .5s; cursor: pointer; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .imgCardLocacaoAcessorios:hover { filter: blur(0px); opacity: 0.5; transition: .5s; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .imgCardLocacaoAcessorios:hover + .infoCardLocacaoAcessorios { filter: blur(0px); opacity: 0.5; transition: .5s; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios { grid-area: 2/1/3/2; display: grid; grid-template-rows: 16px auto 16px; grid-template-columns: 16px auto 16px; justify-content: center; align-items: center; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer { grid-area: 2/2/3/3; display: grid; grid-row-gap: 10px; grid-auto-rows: min-content; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .numeroReferenciaCard { display: flex; justify-content: flex-end; align-items: center; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .numeroReferenciaCard p { font-family: var(--font-secundaria); font-size: 12px; line-height: 100%; text-align: right; color: rgba(0, 0, 0, 0.5); } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .informacoesProdutoCardLocacaoFotografica { display: grid; grid-row-gap: 12px; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .informacoesProdutoCardLocacaoFotografica div { display: flex; align-items: center; justify-content: center; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .informacoesProdutoCardLocacaoFotografica div p { font-family: var(--font-primaria); font-size: 20px; line-height: 100%; color: #000000; font-weight: bold; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .informacoesProdutoCardLocacaoFotografica div span { font-size: 16px; line-height: 100%; color: rgba(0, 0, 0, 0.5); } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .precoCardLocacaoFotografica { display: flex; justify-content: center; align-items: center; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .infoCardLocacaoAcessorios .infoCardLocacaoAcessoriosContainer .precoCardLocacaoFotografica p { font-family: var(--font-primaria); font-size: 24px; line-height: 150%; text-align: right; /* font-weight: bold; */ color: #000000; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .checkCardLocacaoAcessorios { grid-area: 3/1/4/2; display: flex; justify-content: center; align-items: center; background-color: #3FB0A2; border-radius: 0px 4px 4px 0px } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .checkCardLocacaoAcessorios input { -webkit-appearance: none; background: url(../Imgs/checkboxCardLocacao.png) no-repeat center center; background-size: cover; width: 32px; height: 32px; } .locacaoAcessoriosCardContainer .locacaoAcessoriosCard .checkCardLocacaoAcessorios input:checked { -webkit-appearance: none; background: url(../Imgs/checkboxCardLocacaoMarcado.png) no-repeat center center; background-size: cover; } } .listaResumoCompra { display: flex; justify-content: space-between; align-items: center; } .listaResumoCompra .listaResumoCompraItem { display: flex; justify-content: flex-start; align-items: center; } .listaResumoCompra .listaResumoCompraItem p { font-size: 14px; line-height: 120%; color: #6B6B6B; font-family: var(--font-secundaria); } .listaResumoCompra .listaResumoCompraPreco { display: flex; justify-content: flex-end; align-items: center; } .listaResumoCompra .listaResumoCompraPreco p { font-size: 14px; line-height: 120%; color: #6B6B6B; font-family: var(--font-secundaria); font-weight: bold; } .totalItensCompraCard .totalItensCompraCardSubContainer .listaResumoCompra .listaResumoCompraItem p { font-size: 24px; line-height: 120%; color: #6B6B6B; font-family: var(--font-secundaria); font-weight: bold; } .totalItensCompraCard .totalItensCompraCardSubContainer .listaResumoCompra .listaResumoCompraPreco p { font-size: 24px; line-height: 120%; color: #6B6B6B; font-family: var(--font-secundaria); font-weight: bold; } @media screen and (min-width: 1440px) { .listaResumoCompra { display: flex; justify-content: space-between; align-items: center; } .listaResumoCompra .listaResumoCompraItem { display: flex; justify-content: flex-start; align-items: center; } .listaResumoCompra .listaResumoCompraItem p { font-size: 24px; line-height: 120%; color: #6B6B6B; font-family: var(--font-secundaria); } .listaResumoCompra .listaResumoCompraPreco { display: flex; justify-content: flex-end; align-items: center; } .listaResumoCompra .listaResumoCompraPreco p { font-size: 24px; line-height: 120%; color: #6B6B6B; font-family: var(--font-secundaria); font-weight: bold; } } .linhaSepara { width: 100%; height: 1px; background-color: #3FB0A2; } .containerCardResumoCompra { display: grid; grid-template-columns: 330px; grid-row-gap: 16px; } .itensCompraCard, .subtotalDescontoItensCompraCard, .totalItensCompraCard { display: grid; grid-row-gap: 10px; } .totalItensCompraCard { display: grid; grid-template-rows: 14px auto; } .totalItensCompraCard .totalItensCompraCardSubContainer { grid-area: 2/1/3/2; display: grid; grid-row-gap: 10px; } @media screen and (min-width: 1440px) { .linhaSepara { width: 100%; height: 3px; background-color: #3FB0A2; } .containerCardResumoCompra { display: grid; grid-template-columns: 570px; grid-row-gap: 40px; } .itensCompraCard, .subtotalDescontoItensCompraCard, .totalItensCompraCard { display: grid; grid-row-gap: 20px; } .totalItensCompraCard { display: grid; grid-template-rows: 20px auto; } .totalItensCompraCard .totalItensCompraCardSubContainer { grid-area: 2/1/3/2; display: grid; grid-row-gap: 10px; } } .containerCardInfoNota { display: grid; grid-row-gap: 20px; } .containerCardInfoNota .infoNotaDiaHora { display: grid; grid-template-rows: min-content; grid-row-gap: 5px; } .containerCardInfoNota .infoNotaDiaHora div { display: flex; justify-content: flex-start; align-items: center; } .infoNotaDiaHora div p { font-size: 20px; line-height: 120%; color: #3A3A3A; font-weight: bold; font-family: var(--font-primaria); } .containerCardInfoNota .infoPessoaisNota { display: grid; grid-template-rows: min-content; grid-row-gap: 8px; } .containerCardInfoNota .infoPessoaisNota div { display: flex; justify-content: flex-start; align-items: center; } .containerCardInfoNota .infoPessoaisNota div p { font-family: var(--font-secundaria); font-size: 18px; line-height: 200%; color: #3A3A3A; font-weight: bold; } .containerCardInfoNota .infoPessoaisNota div span { font-family: var(--font-secundaria); font-size: 18px; line-height: 200%; color: #3A3A3A; font-weight: normal; } @media screen and (min-width: 1440px) { .containerCardInfoNota { display: grid; grid-row-gap: 60px; height: auto; } .containerCardInfoNota .infoNotaDiaHora { display: grid; grid-template-rows: min-content; grid-row-gap: 8px; } .containerCardInfoNota .infoNotaDiaHora div { display: flex; justify-content: center; align-items: center; } .infoNotaDiaHora div p { font-size: 40px; line-height: 120%; color: #3A3A3A; font-weight: bold; font-family: var(--font-primaria); justify-content: center; display: grid; } .containerCardInfoNota .infoPessoaisNota { display: grid; grid-template-rows: min-content; grid-row-gap: 16px; } .containerCardInfoNota .infoPessoaisNota div { display: flex; justify-content: flex-start; align-items: center; } .containerCardInfoNota .infoPessoaisNota div p { font-family: var(--font-secundaria); font-size: 24px; line-height: 250%; color: #3A3A3A; font-weight: bold; } .containerCardInfoNota .infoPessoaisNota div span { font-family: var(--font-secundaria); font-size: 24px; line-height: 250%; color: #3A3A3A; font-weight: normal; } } #containerLoad { height: 100%; min-height: 100vh; width: 100%; position: fixed; min-width: 100vw; /* background: rgba(0, 0, 0, 0.7); */ justify-content: flex-end; align-items: flex-start; z-index: 9999999999999999999; display: none; background: white; background-size: cover; } #containerLoad .subcontainerLoad { display: flex; justify-content: center; align-items: flex-start; height: 81px; min-width: 16vh; margin-right: 20px; } #containerLoad .subcontainerLoad .load { width: 100px; height: 70px; position: fixed; } #containerLoad .subcontainerLoad .load::after { content: ""; position: absolute; top: 50%; left: 50%; width: 48px; height: 48px; margin: -24px 0 0 -24px; border: 4px solid rgba(63, 176, 162, 0.2); border-top-color: var(--color-principal, #3FB0A2); border-radius: 50%; animation: spinner-villa-rotate 0.8s linear infinite; } .tituloPrincipalH2Projetos { display: flex; justify-content: flex-start; align-items: center; } .tituloPrincipalH2Projetos { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 21px; line-height: 34px; /* identical to box height */ display: flex; align-items: center; color: #3FB0A2; } .marginEspacamento { margin-bottom: 65px; } .marginEspacamentoAlbuns { margin-bottom: 0px; } @media screen and (min-width: 1024px){ #containerLoad { height: 100%; min-height: 100vh; width: 100%; position: fixed; min-width: 100vw; /* background: rgba(0, 0, 0, 0.7); */ justify-content: flex-end; align-items: flex-end; z-index: 9999999999999999999; display: none; background: white; background-size: cover; } #containerLoad .subcontainerLoad { display: flex; justify-content: center; align-items: flex-start; height: 81px; min-width: 16vh; margin-right: 20px; } #containerLoad .subcontainerLoad .load { width: 100px; height: 70px; position: fixed; } #containerLoad .subcontainerLoad .load::after { content: ""; position: absolute; top: 50%; left: 50%; width: 48px; height: 48px; margin: -24px 0 0 -24px; border: 4px solid rgba(63, 176, 162, 0.2); border-top-color: var(--color-principal, #3FB0A2); border-radius: 50%; animation: spinner-villa-rotate 0.8s linear infinite; } .tituloPrincipalH2Projetos { display: flex; justify-content: flex-start; align-items: center; } .tituloPrincipalH2Projetos { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 21px; line-height: 34px; /* identical to box height */ display: flex; align-items: center; color: #3FB0A2; } .marginEspacamento { margin-bottom: 65px; } .marginEspacamentoAlbuns { margin-bottom: 0px; } } @media screen and (min-width: 1024px) { .tituloPrincipalH2Projetos { display: flex; justify-content: flex-start; align-items: center; } .tituloPrincipalH2Projetos { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 28px; line-height: 45px; /* identical to box height */ display: flex; align-items: center; color: #3FB0A2; } .marginEspacamento { margin-bottom: 84px; display: flex; } .marginEspacamentoAlbuns { margin-bottom: 84px; } } @media screen and (min-width: 1440px) { .tituloPrincipalH2Projetos { display: flex; justify-content: flex-start; align-items: center; } .tituloPrincipalH2Projetos { font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 28px; line-height: 45px; /* identical to box height */ display: flex; align-items: center; color: #3FB0A2; } .marginEspacamento { margin-bottom: 84px; } .marginEspacamentoAlbuns { margin-bottom: 84px; } } #swal2-content, #swal2-title { font-family: var(--font-secundaria); color: var(--color-principal); z-index: 100000; } .swal2-styled.swal2-confirm { background-color: var(--color-principal) !important; font-family: var(--font-secundaria); border: none !important; z-index: 100000; } .containerCheckBox { width: 100%; } .containerCheckBox div { display: flex; justify-content: space-between; align-items: center; } .containerCheckBox div p { font-family: var(--font-secundaria); font-size: 12px; line-height: 24px; display: flex; align-items: center; color: #3FB0A2; font-weight: bold; font-style: italic; } .checkBoxComponente { width: 20px; height: 20px; -webkit-appearance: none; border-radius: 2px; background: url(../Imgs/checkbox-no.png) no-repeat center center; background-size: cover; } .checkBoxComponente:checked { background: url(../Imgs/checkedLoacao.png) no-repeat center center; background-size: cover; } @media screen and (min-width: 1024px) { .containerCheckBox { width: 75%; } .containerCheckBox div { display: flex; justify-content: space-between; align-items: center; } .containerCheckBox div p { font-family: var(--font-secundaria); font-size: 12px; line-height: 24px; display: flex; align-items: center; color: #3FB0A2; font-weight: bold; font-style: italic; } .checkBoxComponente { width: 20px; height: 20px; -webkit-appearance: none; border-radius: 2px; background: url(../Imgs/checkbox-no.png) no-repeat center center; background-size: cover; } .checkBoxComponente:checked { background: url(../Imgs/checkedLoacao.png) no-repeat center center; background-size: cover; } } @media screen and (min-width: 1440px) { .containerCheckBox { width: 53%; } .containerCheckBox div { display: flex; justify-content: space-between; align-items: center; } .containerCheckBox div p { font-family: var(--font-secundaria); font-size: 12px; line-height: 24px; display: flex; align-items: center; color: #3FB0A2; font-weight: bold; font-style: italic; } .checkBoxComponente { width: 20px; height: 20px; -webkit-appearance: none; border-radius: 2px; background: url(../Imgs/checkbox-no.png) no-repeat center center; background-size: cover; } .checkBoxComponente:checked { background: url(../Imgs/checkedLoacao.png) no-repeat center center; background-size: cover; } } .popUpConfirmacaoContainer { display: grid; grid-template-columns: auto 360px auto; grid-row-gap: 250px; } .popUpConfirmacaoContainer .confirmacaoPopUp { grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 330px auto; grid-template-rows: 330px; } .popUpConfirmacaoContainer .confirmacaoPopUp .containerInfoPopUp { grid-area: 1/2/2/3; display: flex; justify-content: center; align-items: center; flex-direction: column; /* border: solid 2px var(--color-principal); */ border-radius: 30px; } .popUpConfirmacaoContainer .confirmacaoPopUp .containerTxtPopUpCompra { grid-area: 1/2/2/3; display: flex; justify-content: center; align-items: center; } .popUpConfirmacaoContainer .confirmacaoPopUp .containerTxtPopUpCompra .txtPopUpCompra { color: var(--color-principal); font-family: var(--font-secundaria); font-size: 18px; text-align: center; font-style: italic; line-height: 25px; } @media screen and (min-width: 1024px) { .campo2Linhas { width: 206% !important; } .popUpConfirmacaoContainer { display: grid; grid-template-columns: auto 1024px auto; grid-row-gap: 250px; } .popUpConfirmacaoContainer .confirmacaoPopUp { grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1000px auto; grid-template-rows: 400px; } .popUpConfirmacaoContainer .confirmacaoPopUp .containerInfoPopUp { grid-area: 1/2/2/3; display: flex; justify-content: center; align-items: center; flex-direction: column; /* border: solid 2px var(--color-principal); */ border-radius: 30px; } .popUpConfirmacaoContainer .confirmacaoPopUp .containerTxtPopUpCompra { grid-area: 1/2/2/3; display: flex; justify-content: center; align-items: center; } .popUpConfirmacaoContainer .confirmacaoPopUp .containerTxtPopUpCompra .txtPopUpCompra { color: var(--color-principal); font-family: var(--font-secundaria); font-size: 25px; text-align: center; font-style: italic; } } @media screen and (min-width: 1440px) { .popUpConfirmacaoContainer { display: grid; grid-template-columns: auto 1440px auto; grid-row-gap: 250px; } .popUpConfirmacaoContainer .confirmacaoPopUp { grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1170px auto; grid-template-rows: 400px; } .popUpConfirmacaoContainer .confirmacaoPopUp .containerInfoPopUp { grid-area: 1/2/2/3; display: flex; justify-content: center; align-items: center; flex-direction: column; /* border: solid 2px var(--color-principal); */ border-radius: 30px; } .popUpConfirmacaoContainer .confirmacaoPopUp .containerTxtPopUpCompra { grid-area: 1/2/2/3; display: flex; justify-content: center; align-items: center; } .popUpConfirmacaoContainer .confirmacaoPopUp .containerTxtPopUpCompra .txtPopUpCompra { color: var(--color-principal); font-family: var(--font-secundaria); font-size: 35px; text-align: center; font-style: italic; } } .passoApassoSiteEtapas { display: flex; justify-content: center; align-items: center; /* background-image: url(../Imgs/fundoProjetos.png); background-repeat: round; background-size: cover; background-position: bottom; */ } .passoApassoSiteEtapas div { } .proximaEtapaLista > li.etapaAtiva:before, .proximaEtapaLista > li.etapaAtiva ~ li:before { content: counter(stepNum); font-family: var(--font-secundaria); font-weight: 700; } .proximaEtapaLista > li.etapaAtiva:after, .proximaEtapaLista > li.etapaAtiva ~ li:after { background-color: #ededed; } .proximaEtapaLista { display: table; table-layout: fixed; width: 100%; } .proximaEtapaLista > li:last-child:after { display: none; } .proximaEtapaLista > li.etapaAtiva:before { background-color: #fff; border-color: var(--color-principal); } .proximaEtapaLista > li.etapaAtiva ~ li { color: #696969; /* a11y: contrast bumped from #808080 to #696969 */ } .proximaEtapaLista > li.etapaAtiva ~ li:before { background-color: #ededed; border-color: #ededed; } .containerWpp { width: 60px; height: 60px; position: fixed; bottom: 0; right: 0; } .containerWpp .subcontainerWpp { /* background-color: black; */ height: 100%; width: 100%; } .containerWpp .subcontainerWpp .whatsApp { background-image: url(../Imgs/iconWpp.png); background-repeat: no-repeat; background-position: center; background-size: contain; height: 60px; width: 60px; cursor: pointer; } /* ============================== POPUP CARDAPIO =========================== */ .containerInformacoesAcessorios{ width: 320px; height: auto; box-shadow: 15px 10px 25px rgba(0, 0, 0, .6); display: grid; grid-template-rows: 20px auto 20px; grid-template-columns: 10px auto 10px; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios{ grid-area: 2/2/3/3; display: flex; justify-content: center; align-items: center; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios{ } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .informacoesDescritivas{ display: grid; grid-template-rows: min-content auto auto; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .informacoesDescritivas h1{ font-family: var(--font-primaria); font-size: 20px; text-align: center; color: var(--color-principal); } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .informacoesDescritivas > p{ font-family: var(--font-secundaria); } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .precoProdutoLocaocao{ min-height: 60px; display: flex; justify-content: flex-end; align-items: flex-end; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .precoProdutoLocaocao div{ } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .precoProdutoLocaocao div p{ font-size: 20px; text-align: center; color: var(--color-principal); font-weight: bold; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .fotosProdutoLocacao{ display: none; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .fotosProdutoLocacao .fotoPrincipalProdutoLocacao{ } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .fotosProdutoLocacao .fotoPrincipalProdutoLocacao img{ } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .fotosProdutoLocacao .fotosSecundariasProdutoLocacao{ } /* ================= SLIDER ================ */ .containerSliderImagensLocacaoFotografica{ margin-top: 20px; } .containerSliderImagensLocacaoFotografica .sliderImagensLocacaoFotografica{ } .containerSliderImagensLocacaoFotografica .sliderImagensLocacaoFotografica .containerSlidesAluguelAcessorios{ width: 280px; height: auto; display: grid; grid-row-gap: 40px; grid-template-rows: auto auto; } .containerSliderImagensLocacaoFotografica .sliderImagensLocacaoFotografica .containerSlidesAluguelAcessorios .subcontainerSliderAluguelAcessorios{ display: flex; justify-content: center; align-items: center; } .containerSliderImagensLocacaoFotografica .sliderImagensLocacaoFotografica .containerSlidesAluguelAcessorios .subcontainerSliderAluguelAcessorios .sliderAluguelAcessorio{ width: 280px; height: auto; /* max-height: 300px; */ min-height: 50px; position: relative; } .containerSliderImagensLocacaoFotografica .sliderImagensLocacaoFotografica .containerSlidesAluguelAcessorios .subcontainerSliderAluguelAcessorios .sliderAluguelAcessorio::after { content: ""; position: absolute; top: 50%; left: 50%; width: 48px; height: 48px; margin: -24px 0 0 -24px; border: 4px solid rgba(63, 176, 162, 0.2); border-top-color: var(--color-principal, #3FB0A2); border-radius: 50%; animation: spinner-villa-rotate 0.8s linear infinite; } .containerSliderImagensLocacaoFotografica .sliderImagensLocacaoFotografica .containerSlidesAluguelAcessorios .paginacaoAluguelAcessorio{ } @media screen and (min-width: 1024px){ .containerInformacoesAcessorios{ width: 800px; height: auto; box-shadow: 15px 10px 25px rgba(0, 0, 0, .6); display: grid; grid-template-rows: 40px auto 40px; grid-template-columns: 40px auto 40px; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios{ grid-area: 2/2/3/3; display: flex; justify-content: center; align-items: center; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios{ display: grid; grid-template-columns: auto auto; column-gap: 30px; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .informacoesDescritivas{ } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .informacoesDescritivas h1{ font-family: var(--font-primaria); font-size: 32px; text-align: center; color: var(--color-principal); } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .informacoesDescritivas > p{ font-family: var(--font-secundaria); } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .precoProdutoLocaocao{ } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .precoProdutoLocaocao div{ } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .precoProdutoLocaocao div p{ color: var(--color-principal); font-weight: bold; font-size: 34px; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .fotosProdutoLocacao{ display: grid; row-gap: 20px; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .fotosProdutoLocacao .fotoPrincipalProdutoLocacao{ height: 500px; width: auto; display: flex; justify-content: center; align-items: center; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .fotosProdutoLocacao .fotoPrincipalProdutoLocacao img{ max-height: 500px; min-height: 100px; height: auto; width: 370px; background-size: cover; background-repeat: no-repeat; background-position: center; /* TODO: was background loading GIF, replace with CSS spinner — applied to element so ::after pseudo-element won't work; needs JS or wrapper div approach */ background-size: 80px; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .fotosProdutoLocacao .fotosSecundariasProdutoLocacao { /*display: grid; grid-template-columns: auto auto; column-gap: 10px; justify-content: center; align-items: center;*/ } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .fotosProdutoLocacao .fotosSecundariasProdutoLocacao img{ /*width: 80px; height: 80px; background-position: center; background-size: cover; background-repeat: no-repeat; cursor: pointer; background-image: url(../Imgs/loadImgsLocacao.gif); background-size: 40px;*/ width: 60px; height: 60px; background-position: center; background-size: cover; background-repeat: no-repeat; cursor: pointer; margin: 5px; /* TODO: was background loading GIF, replace with CSS spinner — applied to element so ::after pseudo-element won't work; needs JS or wrapper div approach */ } } @media screen and (min-width: 1440px){ .containerInformacoesAcessorios{ width: 800px; height: auto; box-shadow: 15px 10px 25px rgba(0, 0, 0, .6); display: grid; grid-template-rows: 40px auto 40px; grid-template-columns: 40px auto 40px; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios{ grid-area: 2/2/3/3; display: flex; justify-content: center; align-items: center; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios{ } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .informacoesDescritivas{ } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .informacoesDescritivas h1{ font-family: var(--font-primaria); font-size: 20px; text-align: center; color: var(--color-principal); } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .informacoesDescritivas > p{ font-family: var(--font-secundaria); } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .precoProdutoLocaocao{ min-height: 60px; display: flex; justify-content: flex-end; align-items: flex-end; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .precoProdutoLocaocao div{ } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .precoProdutoLocaocao div p{ color: var(--color-principal); font-weight: bold; font-size: 34px; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .fotosProdutoLocacao{ } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .fotosProdutoLocacao .fotoPrincipalProdutoLocacao{ height: 500px; width: auto; display: flex; justify-content: center; align-items: center; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .fotosProdutoLocacao .fotoPrincipalProdutoLocacao img{ height: auto; min-height: 100px; max-height: 500px; width: 370px; background-size: cover; background-repeat: no-repeat; background-position: center; /* TODO: was background loading GIF, replace with CSS spinner — applied to element so ::after pseudo-element won't work; needs JS or wrapper div approach */ background-size: 80px; display: flex; justify-content: center; align-items: center; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .fotosProdutoLocacao .fotosSecundariasProdutoLocacao { display: inline-table; grid-template-columns: auto auto; column-gap: 10px; justify-content: center; align-items: center; } .containerInformacoesAcessorios .subcontainerInformacoesAcessorios .informacoesAcessorios .fotosProdutoLocacao .fotosSecundariasProdutoLocacao img{ width: 80px; height: 80px; background-position: center; background-size: cover; background-repeat: no-repeat; cursor: pointer; margin: 5px; /* TODO: was background loading GIF, replace with CSS spinner — applied to element so ::after pseudo-element won't work; needs JS or wrapper div approach */ } } /* =================== CSS SPINNER =================== */ @keyframes spinner-villa-rotate { to { transform: rotate(360deg); } } /* =================== CSS SPINNER FIM =================== */ #containerPOPUP { width: 100%; min-width: 100vw; height: 100%; min-height: 100vh; position: fixed; z-index: 99999; background-color: rgba(0, 0, 0, .5); display: none; justify-content: center; align-items: center; flex-direction: column; } #containerPOPUP #renderizaPopUp { width: auto; height: auto; background-repeat: no-repeat; background-position: center; background-size: cover; display: flex; justify-content: center; align-items: center; background-color: white; } #containerPOPUP #fecharPopUp { display: flex; justify-content: flex-end; align-items: center; width: 336px; /* margin-bottom: 20px; */ } #containerPOPUP #fecharPopUp div { width: 20px; height: 20px; background: url(../Imgs/closeFrameFoto.png) no-repeat center center; cursor: pointer; background-size: contain; margin-bottom: 5px; } @media screen and (min-width: 1024px) { #containerPOPUP { width: 100%; min-width: 100vw; height: 100%; min-height: 100vh; position: fixed; z-index: 99999; background-color: rgba(0, 0, 0, .5); display: none; justify-content: center; align-items: center; flex-direction: column; } #containerPOPUP #renderizaPopUp { width: auto; height: auto; display: flex; justify-content: center; align-items: center; background-color: white; } #containerPOPUP #fecharPopUp { display: flex; justify-content: flex-end; align-items: center; width: 600px; /* margin-bottom: 20px; */ } #containerPOPUP #fecharPopUp div { width: 30px; height: 30px; background: url(../Imgs/closeFrameFoto.png) no-repeat center center; cursor: pointer; background-size: contain; } } @media screen and (min-width: 1440px) { #containerPOPUP { width: 100%; min-width: 100vw; height: 100%; min-height: 100vh; position: fixed; z-index: 99999; background-color: rgba(0, 0, 0, .5); display: none; justify-content: center; align-items: center; flex-direction: column; } #containerPOPUP #renderizaPopUp { width: auto; height: auto; display: flex; justify-content: center; align-items: center; background-color: white; } #containerPOPUP #fecharPopUp { display: flex; justify-content: flex-end; align-items: center; width: 600px; } #containerPOPUP #fecharPopUp div { width: 30px; height: 30px; background: url(../Imgs/closeFrameFoto.png) no-repeat center center; background-size: contain; cursor: pointer; } } .btnPadraoVilla{ background-color: var(--color-principal); width: 200px; height: 50px; display: flex; justify-content: center; align-items: center; cursor: pointer; } .btnPadraoVilla p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 25px; line-height: 150%; text-align: center; text-transform: uppercase; color: white; } #popUpInformativo{ width: 100vw; height: 100vh; display: none; justify-content: center; align-items: center; position: fixed; background-color: rgba(0, 0, 0, 0.5); z-index: 1000; } .containerPopUpCovid{ width: auto; height: auto; display: grid; grid-template-columns: 20px 260px 20px; grid-template-rows: 20px auto 20px; background-image: url(../Imgs/fundoProjetos.png); background-repeat: no-repeat; background-size: 800px; background-position: bottom; background-color: white; border-radius: 20px; } .containerPopUpCovid .subcontainerPopUpCovid{ grid-area: 2/2/3/3; display: grid; } .containerPopUpCovid .subcontainerPopUpCovid .fechPopUpCodiv{ grid-area: 1/1/2/2; display: flex; justify-content: flex-end; align-items: center; } .containerPopUpCovid .subcontainerPopUpCovid .fechPopUpCodiv div{ } .containerPopUpCovid .subcontainerPopUpCovid .fechPopUpCodiv div p{ color: color: #55471E; font-family: var(--font-primaria); cursor: pointer; } .containerPopUpCovid .subcontainerPopUpCovid .covid19{ grid-area: 2/1/3/2; display: grid; row-gap: 20px; } .containerPopUpCovid .subcontainerPopUpCovid .covid19 .tituloCovid{ display: flex; justify-content: center; align-items: center; } .containerPopUpCovid .subcontainerPopUpCovid .covid19 .tituloCovid p{ font-family: var(--font-primaria); color: var(--color-principal); font-size: 25px; font-weight: bold; } .containerPopUpCovid .subcontainerPopUpCovid .covid19 .txtCovid{ } .containerPopUpCovid .subcontainerPopUpCovid .covid19 .txtCovid p{ font-family: var(--font-primaria); text-align: left; color: #55471E; font-size: 15px; } .containerPopUpCovid .subcontainerPopUpCovid .covid19 .recomendacaoVilla{ display: grid; justify-content: center; align-items: center; row-gap: 40px; } .containerPopUpCovid .subcontainerPopUpCovid .covid19 .recomendacaoVilla p, span{ font-family: var(--font-primaria); color: #55471E; font-size: 15px; } .containerPopUpCovid .subcontainerPopUpCovid .covid19 .recomendacaoVilla span{ color: var(--color-principal); font-weight: bold; } /* ========================================================== CSS THOMINHAS: full-stack(overflow) ashiudkasjajsa */ .controls label { display: inline-block; height: 20px; text-align: center; vertical-align: top; /* padding-top: 40px;*/ } .controls input { display: block; margin: 0 auto -40px; } input[type="radio"] { -webkit-appearance: radio; float: left; display: inline; /* margin-left: 3em;*/ margin-right: 2em; margin-top: 5px; } /* ========================================================== */ @media screen and (min-width: 1024px){ .containerPopUpCovid{ width: auto; height: auto; display: grid; grid-template-columns: 40px 500px 40px; grid-template-rows: 40px auto 40px; background-image: url(../Imgs/fundoProjetos.png); background-repeat: no-repeat; background-size: 800px; background-position: bottom; background-color: white; border-radius: 20px; } .containerPopUpCovid .subcontainerPopUpCovid{ grid-area: 2/2/3/3; display: grid; } .containerPopUpCovid .subcontainerPopUpCovid .fechPopUpCodiv{ grid-area: 1/1/2/2; display: flex; justify-content: flex-end; align-items: center; } .containerPopUpCovid .subcontainerPopUpCovid .fechPopUpCodiv div{ } .containerPopUpCovid .subcontainerPopUpCovid .fechPopUpCodiv div p{ color: color: #55471E; font-family: var(--font-primaria); } .containerPopUpCovid .subcontainerPopUpCovid .covid19{ grid-area: 2/1/3/2; display: grid; row-gap: 20px; } .containerPopUpCovid .subcontainerPopUpCovid .covid19 .tituloCovid{ display: flex; justify-content: center; align-items: center; } .containerPopUpCovid .subcontainerPopUpCovid .covid19 .tituloCovid p{ font-family: var(--font-primaria); color: var(--color-principal); font-size: 25px; font-weight: bold; } .containerPopUpCovid .subcontainerPopUpCovid .covid19 .txtCovid{ } .containerPopUpCovid .subcontainerPopUpCovid .covid19 .txtCovid p{ font-family: var(--font-primaria); text-align: left; font-size: 20px; color: #55471E; } .containerPopUpCovid .subcontainerPopUpCovid .covid19 .recomendacaoVilla{ display: grid; justify-content: center; align-items: center; row-gap: 40px; } .containerPopUpCovid .subcontainerPopUpCovid .covid19 .recomendacaoVilla p, span{ font-family: var(--font-primaria); font-size: 20px; color: #55471E; } .containerPopUpCovid .subcontainerPopUpCovid .covid19 .recomendacaoVilla span{ color: var(--color-principal); font-weight: bold; } } /* Accessibility: skip-link visible only when keyboard-focused */ .skip-link { position: absolute; top: -100px; left: 0; background: #000; color: #fff; padding: 12px 20px; z-index: 10000; text-decoration: none; font-weight: 700; transition: top 0.2s; } .skip-link:focus { top: 0; outline: 3px solid #fff; outline-offset: -2px; } /* Accessibility: visible focus ring for keyboard users only */ :focus-visible { outline: 2px solid var(--color-principal, #3FB0A2); outline-offset: 2px; } /* Don't show focus ring for mouse clicks (modern browsers respect :focus-visible) */ :focus:not(:focus-visible) { outline: none; } /* Visually hidden but available to screen readers */ .visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } :root{ --color-principal: #3FB0A2; --font-primaria: 'Cinzel', serif; --font-secundaria: 'proxima-nova', sans-serif; } .containerTotalHome{ display: grid; grid-template-columns: auto 360px auto; scroll-behavior: smooth; } .swiper-slider-projetos{ width: 303px; } .containerTotalHome .imgPrincipalVilla{ grid-area: 1/1/2/4; background: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 13.41%), url(../Imgs/FotoHomeMobile.jpg) no-repeat center center; background-size: cover; height: 100%; min-height: 100vh; display: grid; grid-template-rows: auto 360px auto; } .containerTotalHome .home{ grid-area: 2/1/3/4; display: grid; } .containerTotalHome .home .aVillaOParque{ display: grid; grid-row-gap: 40px; } .containerTotalHome .home .aVillaOParque .containerAVilla{ display: grid; grid-template-columns: auto 330px auto; /* background: url(../Imgs/AvillaTinta[.png) no-repeat; background-size: cover; */ } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla{ grid-area: 1/1/2/4; display: grid; grid-row-gap: 47px; background-image: url(../Imgs/backgroundAvilla.png), url(../Imgs/backgroundAvilla2.png); background-position-y: top, 500px; background-position-x: right, right; background-repeat: no-repeat; /* background-position-x: right; background-position-y: 440px; */ grid-template-columns: auto 330px auto; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla{ grid-area: 1/2/2/3; display: grid; grid-template-rows: 100px auto; grid-row-gap: 30px; /* background: url(../Imgs/backgroundAvilla.png) no-repeat center center; background-position: top; */ grid-template-columns: auto 330px auto; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla .tituloAVilla{ grid-area: 1/2/2/3; display: flex; justify-content: flex-start; align-items: center; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla .tituloAVilla p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 56px; line-height: 75px; /* identical to box height */ display: flex; align-items: center; color: #55471E; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla .txtAVilla{ grid-area: 2/2/3/3; display: flex; justify-content: flex-start; align-items: center; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla .txtAVilla p{ font-family: var(--font-secundaria); font-size: 12px; line-height: 150%; /* or 18px */ color: #454545; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .imgAVilla{ display: grid; grid-area: 2/2/3/3; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .imgAVilla .containerImgAvilla { } @media screen and (min-width: 1024px){ .containerTotalHome{ display: grid; grid-template-columns: auto 1024px auto; } .containerTotalHome .imgPrincipalVilla { grid-area: 1/1/2/4; background: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 13.41%), url(../Imgs/FotoHomeDesktop.jpg) no-repeat center center; background-size: cover; height: 100vh; /* min-height: 100vh; */ display: grid; grid-template-rows: auto 1024px auto; } .containerTotalHome .home{ grid-area: 2/1/3/4; display: grid; } .containerTotalHome .home .aVillaOParque{ display: grid; } .containerTotalHome .home .aVillaOParque .containerAVilla{ display: grid; grid-template-columns: auto 1000px auto; grid-template-rows: 81px auto; background: url(../Imgs/backgroundAvillaDesktop.png) left no-repeat, url(../Imgs/backgroundAvillaDesktop2.png) right top no-repeat; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla{ grid-area: 2/2/3/3; display: grid; grid-column-gap: 111px; grid-template-columns: auto auto; background: none; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla{ display: grid; grid-template-rows: 135px auto; grid-row-gap: 30px; background: none; grid-template-columns: auto; grid-area: auto; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla .tituloAVilla{ grid-area: 1/1/2/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla .tituloAVilla p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 80px; line-height: 134px; /* identical to box height */ display: flex; align-items: center; color: #55471E; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla .txtAVilla{ grid-area: 2/1/3/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla .txtAVilla p{ font-family: var(--font-secundaria); font-size: 14px; line-height: 150%; /* or 18px */ color: #454545; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .imgAVilla{ display: flex; justify-content: flex-end; align-items: center; flex-direction: column; grid-area: auto; } } @media screen and (min-width: 1440px){ .containerTotalHome{ display: grid; grid-template-columns: auto 1440px auto; } .containerTotalHome .imgPrincipalVilla { grid-area: 1/1/2/4; background: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 13.41%), url(../Imgs/FotoHomeDesktop.jpg) no-repeat center center; background-size: cover; height: 100vh; /* min-height: 100vh; */ display: grid; grid-template-rows: auto 1440px auto; } .containerTotalHome .home{ grid-area: 2/1/3/4; display: grid; } .containerTotalHome .home .aVillaOParque{ display: grid; } .containerTotalHome .home .aVillaOParque .containerAVilla{ display: grid; grid-template-columns: auto 1172px auto; grid-template-rows: 81px auto; background: url(../Imgs/backgroundAvillaDesktop.png) left no-repeat, url(../Imgs/backgroundAvillaDesktop2.png) right top no-repeat; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla{ grid-area: 2/2/3/3; display: grid; grid-column-gap: 111px; grid-template-columns: auto auto; background: none; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla{ display: grid; grid-template-rows: 135px auto; grid-row-gap: 30px; background: none; grid-template-columns: auto; grid-area: auto; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla .tituloAVilla{ grid-area: 1/1/2/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla .tituloAVilla p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 89px; line-height: 134px; /* identical to box height */ display: flex; align-items: center; color: #55471E; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla .txtAVilla{ grid-area: 2/1/3/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .infosAVilla .txtAVilla p{ font-family: var(--font-secundaria); font-size: 16px; line-height: 150%; /* or 18px */ color: #454545; } .containerTotalHome .home .aVillaOParque .containerAVilla .subcontainerAVilla .imgAVilla{ display: flex; justify-content: flex-end; align-items: center; flex-direction: column; grid-area: auto; } } .containerTotalHome .home .aVillaOParque .containerOParque{ display: grid; grid-template-columns: auto 330px auto; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 47px; /* background: url(../Imgs/backgroundAvilla2.png) no-repeat center center; */ background-position-x: right; background-position-y: 440px; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque{ display: grid; grid-template-rows: 100px auto; grid-row-gap: 30px; /* background: url(../Imgs/backgroundAvilla.png) no-repeat center center; */ background-position: top; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque .tituloAVilla{ grid-area: 1/1/2/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque .tituloAVilla p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 56px; line-height: 75px; /* identical to box height */ display: flex; align-items: center; color: #55471E; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque .txtAVilla{ grid-area: 2/1/3/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque .txtAVilla p{ font-family: var(--font-secundaria); font-size: 12px; line-height: 18px; color: #454545; } @media screen and (min-width: 1024px){ .containerTotalHome .home .aVillaOParque .containerOParque{ display: grid; grid-template-columns: auto 1000px auto; grid-template-rows: 81px auto; background: url(../Imgs/backgroundAvillaDesktop3.png) right no-repeat; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque{ grid-area: 2/2/3/3; display: grid; grid-column-gap: 111px; grid-template-columns: auto auto; background: none; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque{ grid-area: 1/2/2/3; display: grid; grid-template-rows: 135px auto; grid-row-gap: 30px; background: none; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque .tituloAVilla{ grid-area: 1/1/2/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque .tituloAVilla p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 80px; line-height: 134px; /* identical to box height */ display: flex; align-items: center; color: #55471E; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque .txtAVilla{ grid-area: 2/1/3/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque .txtAVilla p{ font-family: var(--font-secundaria); font-size: 14px; line-height: 150%; /* or 18px */ color: #454545; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .imgAVilla{ grid-area: 1/1/2/2; display: flex; justify-content: flex-end; align-items: center; flex-direction: column; } } @media screen and (min-width: 1440px){ .containerTotalHome .home .aVillaOParque .containerOParque{ display: grid; grid-template-columns: auto 1172px auto; grid-template-rows: 81px auto; background: url(../Imgs/backgroundAvillaDesktop3.png) right no-repeat; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque{ grid-area: 2/2/3/3; display: grid; grid-column-gap: 111px; grid-template-columns: auto auto; background: none; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque{ grid-area: 1/2/2/3; display: grid; grid-template-rows: 135px auto; grid-row-gap: 30px; background: none; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque .tituloAVilla{ grid-area: 1/1/2/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque .tituloAVilla p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 89px; line-height: 134px; /* identical to box height */ display: flex; align-items: center; color: #55471E; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque .txtAVilla{ grid-area: 2/1/3/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .infosOParque .txtAVilla p{ font-family: var(--font-secundaria); font-size: 16px; line-height: 150%; /* or 18px */ color: #454545; } .containerTotalHome .home .aVillaOParque .containerOParque .subcontainerOParque .imgAVilla{ grid-area: 1/1/2/2; display: flex; justify-content: flex-end; align-items: center; flex-direction: column; } } /* FOTOS E VIDEOS */ /* sintaxe background background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit; */ .containerTotalHome .home .fotosVideosHome{ display: grid; grid-template-columns: auto 330px auto; grid-template-rows: 109px auto 91px; background-image: url(../Imgs/tintaFotosVideosMobile.png); background-position-x: center; background-position-y: -10px; background-repeat: no-repeat; /* background-size: cover; */ } .containerTotalHome .home .fotosVideosHome .fotoVideos{ display: grid; grid-area: 2/1/3/4; grid-template-rows: 595px; background: url(../Imgs/fotosVideosMobile.jpg) center no-repeat; background-size: cover; grid-template-columns: auto 330px auto; } .containerTotalHome .home .fotosVideosHome .fotoVideos .fundoFotoVideo1{ grid-area: 1/1/2/2; } .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo{ grid-area: 1/2/2/3; display: grid; grid-template-columns: 20px 290px 20px; grid-template-rows: 31px auto 30px; /* background: url(../Imgs/fotosVideosMobile.jpg) no-repeat center center; */ background-size: cover; } .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo .iconFotoVideo{ grid-area: 2/2/3/3; display: grid; grid-row-gap: 45px; justify-content: center; align-items: center; } .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo .iconFotoVideo div{ width: 290px; height: 208px; background: #F2F2F2; opacity: 0.7; box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); display: flex; justify-content: center; align-items: center; cursor: pointer; transition: .5s; } .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo .iconFotoVideo div:hover{ transform:scale(1); filter:blur(0px); opacity:1; box-shadow:0 8px 20px 0px rgba(0,0,0,0.125); transition: .5s; } .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo .iconFotoVideo div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 50px; line-height: 74px; display: flex; align-items: center; text-align: center; /* Pressed */ color: #685D3B; } .containerTotalHome .home .fotosVideosHome .fotoVideos .fundoFotoVideo2{ grid-area: 3/1/4/2; } @media screen and (min-width: 1024px){ .containerTotalHome .home .fotosVideosHome{ display: grid; grid-template-columns: auto 1024px auto; background: url(../Imgs/tintaFotosVideosMobile.png) no-repeat center center; background-position-y: 50px; background-size: cover; grid-template-rows: 98px 610px 163px; } .containerTotalHome .home .fotosVideosHome .fotoVideos{ display: grid; grid-area: 2/1/3/4; grid-template-rows: 120px auto 120px; background: url(../Imgs/fotoVideoDesktop.jpg) no-repeat center center; background-size: cover; grid-template-columns: auto 1000px auto; } .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo{ grid-area: 2/2/3/3; display: flex; justify-content: space-around; align-items: center; } .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo .iconFotoVideo{ grid-area: 2/2/3/3; display: grid; grid-column-gap: 230px; grid-template-columns: auto auto; } .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo .iconFotoVideo div{ width: 370px; height: 370px; background: #F2F2F2; opacity: 0.7; box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); display: flex; justify-content: center; align-items: center; cursor: pointer; transition: .5s; } .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo .iconFotoVideo div:hover{ transform:scale(1); filter:blur(0px); opacity:1; box-shadow:0 8px 20px 0px rgba(0,0,0,0.125); transition: .5s; } .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo .iconFotoVideo div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 50px; line-height: 74px; display: flex; align-items: center; text-align: center; /* Pressed */ color: #685D3B; } } @media screen and (min-width: 1440px){ .containerTotalHome .home .fotosVideosHome{ display: grid; grid-template-columns: auto 1440px auto; background: url(../Imgs/tintaFotosVideosMobile.png) no-repeat center center; background-position-y: 50px; background-size: cover; grid-template-rows: 98px 610px 163px; } .containerTotalHome .home .fotosVideosHome .fotoVideos{ display: grid; grid-area: 2/1/3/4; grid-template-rows: 120px auto 120px; background: url(../Imgs/fotoVideoDesktop.jpg) no-repeat center center; background-size: cover; grid-template-columns: auto 1172px auto; } .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo{ grid-area: 2/2/3/3; display: flex; justify-content: space-around; align-items: center; } .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo .iconFotoVideo{ grid-area: 2/2/3/3; display: grid; grid-column-gap: 230px; grid-template-columns: auto auto; } .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo .iconFotoVideo div{ width: 370px; height: 370px; background: #F2F2F2; opacity: 0.7; box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); display: flex; justify-content: center; align-items: center; cursor: pointer; transition: .5s; } /* .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo .iconFotoVideo:hover{ filter:blur(3px); opacity:.5; transform: scale(.98); box-shadow:none; } */ .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo .iconFotoVideo div:hover{ transform:scale(1); filter:blur(0px); opacity:1; box-shadow:0 8px 20px 0px rgba(0,0,0,0.125); transition: .5s; } .containerTotalHome .home .fotosVideosHome .fotoVideos .containerFotoVideo .iconFotoVideo div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 50px; line-height: 74px; display: flex; align-items: center; text-align: center; /* Pressed */ color: #685D3B; } } /* FOTOS E VIDEOS FIM */ /* EVENTOS */ .containerTotalEventos{ display: grid; grid-template-columns: auto 330px auto; background-image: url(../Imgs/eventosTinta.png); background-position-y: 184px; background-position-x: center; background-repeat: no-repeat; background-size: cover; } .containerTotalEventos .containerEventos{ grid-area: 1/2/2/3; display: grid; grid-template-rows: 76px auto; grid-row-gap: 50px; } .containerTotalEventos .containerEventos .tituloEventos{ grid-area: 1/1/2/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalEventos .containerEventos .tituloEventos p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 56px; line-height: 75px; /* identical to box height */ display: flex; align-items: center; /* Pressed */ color: #685D3B; } .containerTotalEventos .containerEventos .containerCards{ grid-area: 2/1/3/2; display: grid; grid-template-rows: auto; } .containerTotalEventos .containerEventos .containerCards .swiper-container{ grid-area: 1/1/2/2; width: 281px; height: auto; display: grid; grid-row-gap: 40px; grid-template-rows: auto auto; } /* .containerTotalEventos .containerEventos .containerCards .swiper-container .swiper-wrapper{ grid-area: 1/1/2/2; } .containerTotalEventos .containerEventos .containerCards .swiper-container .swiper-pagination{ grid-area: 2/1/3/2; } */ @media only screen and (min-width: 1024px){ .containerTotalEventos{ display: grid; grid-template-columns: auto 1024px auto; background-image: url(../Imgs/eventosTinta.png); background-position-x: bottom; background-position-y: 150px; background-repeat: no-repeat; background-size: cover; } .containerTotalEventos .containerEventos{ grid-area: 1/2/2/3; display: grid; grid-template-rows: 76px auto; grid-template-columns: auto 1000px auto; grid-row-gap: 70px; } .containerTotalEventos .containerEventos .tituloEventos{ grid-area: 1/2/2/3; display: flex; justify-content: flex-start; align-items: center; } .containerTotalEventos .containerEventos .tituloEventos p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 80px; line-height: 134px; /* identical to box height */ display: flex; align-items: center; /* Pressed */ color: #685D3B; } .containerTotalEventos .containerEventos .containerCards{ grid-area: 2/2/3/3; display: flex; justify-content: center; align-items: center; } .containerTotalEventos .containerEventos .containerCards .swiper-container{ grid-area: 1/1/2/2; width: 1000px; height: auto; display: grid; grid-row-gap: 40px; grid-template-rows: auto auto; } .containerTotalEventos .containerEventos .containerCards .swiper-container .swiper-wrapper{ display: flex; justify-content: center; align-items: center; } .containerTotalEventos .containerEventos .containerCards .swiper-container .swiper-wrapper .swiper-slide{ display: flex; justify-content: center; align-items: center; } } @media only screen and (min-width: 1440px){ .containerTotalEventos{ display: grid; grid-template-columns: auto 1440px auto; background-image: url(../Imgs/eventosTinta.png); background-position-x: bottom; background-position-y: 150px; background-repeat: no-repeat; background-size: cover; } .containerTotalEventos .containerEventos{ grid-area: 1/2/2/3; display: grid; grid-template-rows: 76px auto; grid-template-columns: auto 1212px auto; grid-row-gap: 70px; } .containerTotalEventos .containerEventos .tituloEventos{ grid-area: 1/2/2/3; display: flex; justify-content: flex-start; align-items: center; } .containerTotalEventos .containerEventos .tituloEventos p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 100px; line-height: 134px; /* identical to box height */ display: flex; align-items: center; /* Pressed */ color: #685D3B; } .containerTotalEventos .containerEventos .containerCards{ grid-area: 2/2/3/3; display: flex; justify-content: center; align-items: center; } .containerTotalEventos .containerEventos .containerCards .swiper-container{ grid-area: 1/1/2/2; width: 1212px; height: auto; display: grid; grid-row-gap: 40px; grid-template-rows: auto auto; } .containerTotalEventos .containerEventos .containerCards .swiper-container .swiper-wrapper{ display: flex; justify-content: center; align-items: center; } } /* ========================== PROJETOS ========================== */ .containerTotalProjetosHome{ display: grid; grid-template-columns: auto 330px auto; background: url(../Imgs/TintaProjetos.png) no-repeat center center; background-repeat: no-repeat; background-position-x: center; background-position-y: center; background-size: 645px 300px; } .containerTotalProjetosHome .containerProjetos{ grid-area: 1/2/2/3; display: grid; grid-template-rows: auto auto 20px; grid-row-gap: 50px; } .containerTotalProjetosHome .containerProjetos .tituloProjetos{ grid-area: 1/1/2/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalProjetosHome .containerProjetos .tituloProjetos p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 56px; line-height: 75px; /* identical to box height */ display: flex; align-items: center; /* Pressed */ color: #685D3B; } .containerTotalProjetosHome .containerProjetos .containerCardsProjetos{ grid-area: 2/1/3/2; display: grid; grid-template-rows: auto; } .containerTotalProjetosHome .containerProjetos .containerCardsProjetos .swiper-container{ grid-area: 1/1/2/2; width: 303px; height: auto; display: grid; grid-row-gap: 40px; grid-template-rows: auto auto; } @media only screen and (min-width: 1024px){ .containerTotalProjetosHome{ display: grid; grid-template-columns: auto 1024px auto; background-image: url(../Imgs/TintaProjetos.png); background-repeat: no-repeat; background-position-x: center; background-position-y: center; background-size: 680px 600px; } .containerTotalProjetosHome .containerProjetos{ grid-area: 1/2/2/3; display: grid; grid-template-rows: auto auto 50px; grid-template-columns: auto 1000px auto; grid-row-gap: 70px; } .containerTotalProjetosHome .containerProjetos .tituloProjetos{ grid-area: 1/2/2/3; display: flex; justify-content: flex-start; align-items: center; } .containerTotalProjetosHome .containerProjetos .tituloProjetos p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 80px; line-height: 134px; /* identical to box height */ display: flex; align-items: center; /* Pressed */ color: #685D3B; } .containerTotalProjetosHome .containerProjetos .containerCardsProjetos{ grid-area: 2/2/3/3; display: flex; justify-content: center; align-items: center; } .containerTotalProjetosHome .containerProjetos .containerCardsProjetos .swiper-container{ grid-area: 1/1/2/2; width: 1000px; height: auto; display: grid; grid-row-gap: 40px; grid-template-rows: auto auto; } .containerTotalProjetosHome .containerProjetos .containerCardsProjetos .swiper-container .swiper-wrapper{ display: flex; justify-content: center; align-items: center; box-shadow: none; } .containerTotalProjetosHome .containerProjetos .containerCardsProjetos .swiper-container .swiper-wrapper .swiper-slide{ display: flex; justify-content: center; align-items: center; } } @media only screen and (min-width: 1440px){ .containerTotalProjetosHome{ display: grid; grid-template-columns: auto 1440px auto; background: url(../Imgs/TintaProjetos.png) no-repeat center center; background-position: bottom; background-size: cover; background-position-y: 7px; } .containerTotalProjetosHome .containerProjetos{ grid-area: 1/2/2/3; display: grid; grid-template-rows: auto auto 50px; grid-template-columns: auto 1212px auto; grid-row-gap: 70px; } .containerTotalProjetosHome .containerProjetos .tituloProjetos{ grid-area: 1/2/2/3; display: flex; justify-content: flex-start; align-items: center; } .containerTotalProjetosHome .containerProjetos .tituloProjetos p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 100px; line-height: 134px; /* identical to box height */ display: flex; align-items: center; /* Pressed */ color: #685D3B; } .containerTotalProjetosHome .containerProjetos .containerCardsProjetos{ grid-area: 2/2/3/3; display: flex; justify-content: center; align-items: center; } .containerTotalProjetosHome .containerProjetos .containerCardsProjetos .swiper-container{ grid-area: 1/1/2/2; width: 1212px; height: auto; display: grid; grid-row-gap: 40px; grid-template-rows: auto auto; } .containerTotalProjetosHome .containerProjetos .containerCardsProjetos .swiper-container .swiper-wrapper{ display: flex; justify-content: center; align-items: center; } } .chaVillaHome{ display: grid; grid-template-columns: auto 330px auto; grid-template-rows: auto; background-color: #DED7C5; } .chaVillaHome .containerChaVillaHome{ grid-area: 1/2/2/3; display: grid; grid-template-rows: 24px auto; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome{ grid-area: 2/1/3/2; display: grid; grid-row-gap: 24px; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome{ display: grid; grid-template-rows: 65px auto; grid-row-gap: 50px; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome .tituloChaVilla{ grid-area: 1/1/2/2; display: flex; justify-content: flex-start; align-items: center; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome .tituloChaVilla p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 48px; line-height: 64px; display: flex; align-items: center; color: #685D3B; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome .txtChaVilla{ grid-area: 2/1/3/2; display: flex; justify-content: flex-start; align-items: center; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome .txtChaVilla p{ font-family: var(--font-secundaria); font-size: 12px; line-height: 24px; color: #454545; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .imgChaVillaHome{ width: 330px; height: 475px; background: url(../Imgs/chaVilla.jpg) no-repeat center center; background-size: cover; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .btnChaVillaHome{ height: 96px; width: 100%; background-color: transparent; display: flex; justify-content: center; align-items: center; cursor: pointer; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .btnChaVillaHome div{ background-color: var(--color-principal); width: 200px; height: 50px; display: flex; justify-content: center; align-items: center; cursor: pointer; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .btnChaVillaHome div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 25px; line-height: 150%; text-align: center; text-transform: uppercase; /* color: #22776C; */ color: white; } @media only screen and (min-width: 1024px){ .chaVillaHome{ display: grid; grid-template-columns: auto 1024px auto; grid-template-rows: auto; background-color: #DED7C5; } .chaVillaHome .containerChaVillaHome{ grid-area: 1/2/2/3; display: grid; grid-template-rows: auto; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome{ grid-area: 1/1/2/2; display: grid; grid-row-gap: 0px; grid-template-columns: 450px 570px; grid-template-rows: 60px auto 54px 57px; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome{ grid-area: 2/2/3/3; display: grid; grid-template-rows: 135px auto; grid-template-columns: 30px 540px auto; grid-row-gap: 24px; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome .tituloChaVilla{ grid-area: 1/2/2/3; display: flex; justify-content: flex-start; align-items: center; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome .tituloChaVilla p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 78px; line-height: 134px; display: flex; align-items: center; color: #685D3B; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome .txtChaVilla{ grid-area: 2/2/3/3; display: flex; justify-content: flex-start; align-items: center; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome .txtChaVilla p{ font-family: var(--font-secundaria); font-size: 14px; line-height: 24px; color: #454545; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .imgChaVillaHome{ grid-area: 1/1/5/2; width: 100%; height: 100%; background: url(../Imgs/chaVilla.jpg) no-repeat center center; background-size: cover; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .btnChaVillaHome{ grid-area: 3/2/4/3; height: 100%; width: 100%; background-color: transparent; display: grid; grid-template-columns: 30px auto; grid-template-rows: 44px auto; cursor: pointer; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .btnChaVillaHome div{ grid-area: 2/2/3/3; background-color: var(--color-principal); width: 200px; height: 50px; display: flex; justify-content: center; align-items: center; cursor: pointer; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .btnChaVillaHome div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 25px; line-height: 150%; text-align: center; text-transform: uppercase; /* color: #22776C; */ color: white; } } @media only screen and (min-width: 1440px){ .chaVillaHome{ display: grid; grid-template-columns: auto 1440px auto; grid-template-rows: auto; background-color: #DED7C5; } .chaVillaHome .containerChaVillaHome{ grid-area: 1/2/2/3; display: grid; grid-template-rows: auto; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome{ grid-area: 1/1/2/2; display: grid; grid-row-gap: 0px; grid-template-columns: 605px 835px; grid-template-rows: 60px auto 54px 57px; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome{ grid-area: 2/2/3/3; display: grid; grid-template-rows: 135px auto; grid-template-columns: 30px 684px auto; grid-row-gap: 24px; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome .tituloChaVilla{ grid-area: 1/2/2/3; display: flex; justify-content: flex-start; align-items: center; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome .tituloChaVilla p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 100px; line-height: 134px; display: flex; align-items: center; color: #685D3B; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome .txtChaVilla{ grid-area: 2/2/3/3; display: flex; justify-content: flex-start; align-items: center; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .infoChaVillaHome .txtChaVilla p{ font-family: var(--font-secundaria); font-size: 16px; line-height: 24px; color: #454545; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .imgChaVillaHome{ grid-area: 1/1/5/2; width: 100%; height: 100%; background: url(../Imgs/chaVilla.jpg) no-repeat center center; background-size: cover; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .btnChaVillaHome{ grid-area: 3/1/4/3; height: 100%; width: 100%; background-color: transparent; display: grid; grid-template-columns: 30px auto; grid-template-rows: 44px auto; cursor: pointer; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .btnChaVillaHome div{ grid-area: 2/2/3/3; background-color: var(--color-principal); width: 200px; height: 50px; display: flex; justify-content: center; align-items: center; cursor: pointer; } .chaVillaHome .containerChaVillaHome .conteudoChaVillaHome .btnChaVillaHome div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 25px; line-height: 150%; text-align: center; text-transform: uppercase; /* color: #22776C; */ color: white; } } .locacaoFotograficaHome{ display: grid; grid-template-columns: auto 360px auto; grid-template-rows: 53px auto auto 53px; background: url(../Imgs/locacaoFotograticaTinta.png) no-repeat center center; background-size: cover; } .locacaoFotograficaHome .btnAgendaLocacao{ grid-area: 3/2/4/3; display: grid; grid-template-rows: 40px auto; justify-content: center; align-items: center; } .locacaoFotograficaHome .btnAgendaLocacao div{ grid-area: 2/1/3/2; background-color: var(--color-principal); width: 200px; height: 50px; display: flex; justify-content: center; align-items: center; cursor: pointer; } .locacaoFotograficaHome .btnAgendaLocacao div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 25px; line-height: 150%; text-align: center; text-transform: uppercase; /* color: #22776C; */ color: white; } .locacaoFotograficaHome .containerLocacaoFotoHome { grid-area: 2/2/3/3; display: flex; justify-content: center; align-items: center; height: 260px; } .locacaoFotograficaHome .containerLocacaoFotoHome .locacaoFotoHome{ display: grid; grid-template-columns: auto auto auto auto auto; grid-column-gap: 8px; grid-row-gap: 8px; } .locacaoFotograficaHome .containerLocacaoFotoHome .locacaoFotoHome .cardsLocacaoFotoHome{ width: 68px; height: 70px; background-repeat: no-repeat; background-size: cover; } .locacaoFotograficaHome .containerLocacaoFotoHome .txtLocaoFotohome { background: rgb(255, 255, 255); width: 280px; height: 90px; display: flex; justify-content: center; align-items: center; /* margin-top: 45px; */ position: absolute; /* margin-left: 88px; */ display: grid; justify-content: center; align-items: center; opacity: 0.85; transition: .5s; cursor: pointer; } .locacaoFotograficaHome .containerLocacaoFotoHome .txtLocaoFotohome:hover { opacity: 0.97; transition: .5s; filter: blur(0px); box-shadow: 0 8px 20px 0px rgba(0,0,0,0.125); } .locacaoFotograficaHome .containerLocacaoFotoHome .txtLocaoFotohome div{ display: flex; justify-content: center; align-items: center; } .locacaoFotograficaHome .containerLocacaoFotoHome .txtLocaoFotohome div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 22px; line-height: 100%; /* or 20px */ display: flex; align-items: center; text-align: center; color: #55471E; } .ocultarLocacaoHomeMobile{ display: none; } @media only screen and (min-width: 1024px){ .locacaoFotograficaHome{ display: grid; grid-template-columns: auto 1024px auto; grid-template-rows: 100px auto auto 100px; background: url(../Imgs/locacaoFotograticaTinta.png) no-repeat center center; background-size: cover; } .locacaoFotograficaHome .btnAgendaLocacao{ grid-area: 3/2/4/3; display: grid; grid-template-rows: 40px auto; justify-content: center; align-items: center; } .locacaoFotograficaHome .btnAgendaLocacao div{ grid-area: 2/1/3/2; background-color: var(--color-principal); width: 200px; height: 50px; display: flex; justify-content: center; align-items: center; cursor: pointer; } .locacaoFotograficaHome .btnAgendaLocacao div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 25px; line-height: 150%; text-align: center; text-transform: uppercase; /* color: #22776C; */ color: white; } .locacaoFotograficaHome .containerLocacaoFotoHome { grid-area: 2/2/3/3; display: flex; justify-content: center; align-items: center; height: 660px; } .locacaoFotograficaHome .containerLocacaoFotoHome .locacaoFotoHome{ display: grid; grid-template-columns: auto auto auto auto; grid-column-gap: 8px; grid-row-gap: 8px; } .locacaoFotograficaHome .containerLocacaoFotoHome .locacaoFotoHome .cardsLocacaoFotoHome{ width: 249px; height: 258px; background-repeat: no-repeat; background-size: cover; } .locacaoFotograficaHome .containerLocacaoFotoHome .txtLocaoFotohome { background: rgb(255, 255, 255); width: 900px; height: 389px; display: flex; justify-content: center; align-items: center; position: absolute; cursor: pointer; } .locacaoFotograficaHome .containerLocacaoFotoHome .txtLocaoFotohome:hover { opacity: 0.97; transition: .5s; filter: blur(0px); box-shadow: 0 8px 20px 0px rgba(0,0,0,0.125); } .locacaoFotograficaHome .containerLocacaoFotoHome .txtLocaoFotohome div{ } .locacaoFotograficaHome .containerLocacaoFotoHome .txtLocaoFotohome div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 70px; line-height: 161.16%; /* or 20px */ display: flex; align-items: center; text-align: center; color: #55471E; } .ocultarLocacaoHome{ display: none; } .ocultarLocacaoHomeMobile{ display: flex; } } @media only screen and (min-width: 1440px){ .locacaoFotograficaHome{ display: grid; grid-template-columns: auto 1440px auto; grid-template-rows: 100px auto auto 100px; background: url(../Imgs/locacaoFotograticaTinta.png) no-repeat center center; background-size: cover; } .locacaoFotograficaHome .btnAgendaLocacao{ grid-area: 3/2/4/3; display: grid; grid-template-rows: 40px auto; justify-content: center; align-items: center; } .locacaoFotograficaHome .btnAgendaLocacao div{ grid-area: 2/1/3/2; background-color: var(--color-principal); width: 200px; height: 50px; display: flex; justify-content: center; align-items: center; cursor: pointer; } .locacaoFotograficaHome .btnAgendaLocacao div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 25px; line-height: 150%; text-align: center; text-transform: uppercase; /* color: #22776C; */ color: white; } .locacaoFotograficaHome .containerLocacaoFotoHome { grid-area: 2/2/3/3; display: flex; justify-content: center; align-items: center; height: 760px; } .locacaoFotograficaHome .containerLocacaoFotoHome .locacaoFotoHome{ display: grid; grid-template-columns: auto auto auto auto; grid-column-gap: 8px; grid-row-gap: 8px; } .locacaoFotograficaHome .containerLocacaoFotoHome .locacaoFotoHome .cardsLocacaoFotoHome{ width: 351px; height: 258px; background-repeat: no-repeat; background-size: cover; } .locacaoFotograficaHome .containerLocacaoFotoHome .txtLocaoFotohome{ background: rgb(255, 255, 255 ); width: 1170px; height: 389px; display: flex; justify-content: center; align-items: center; /* margin-top: 45px; */ position: absolute; /* margin-left: 130px; */ } .locacaoFotograficaHome .containerLocacaoFotoHome .txtLocaoFotohome div{ } .locacaoFotograficaHome .containerLocacaoFotoHome .txtLocaoFotohome div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 80px; line-height: 161.16%; /* or 20px */ display: flex; align-items: center; text-align: center; color: #55471E; } .ocultarLocacaoHome{ display: none; } .ocultarLocacaoHomeMobile{ display: flex; } } .rodapeHome{ display: grid; grid-template-columns: auto 360px auto; } @media only screen and (min-width: 1440px){ .rodapeHome{ display: grid; grid-template-columns: auto 1440px auto; /* grid-template-rows: 765px; */ } } :root{ --color-principal: #3FB0A2; --font-primaria: 'Cinzel', serif; --font-secundaria: 'proxima-nova', sans-serif; } .containerLocacaoFoto{ display: grid; grid-template-columns: auto 360px auto; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; grid-row-gap: 50px; } .containerLocacaoFoto .locacaoFoto{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 330px auto; grid-template-rows: 24px auto; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica{ grid-area: 2/2/3/3; display: grid; grid-row-gap: 40px; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .tituloLocacaoFotografica{ height: 111px; display: flex; justify-content: center; align-items: flex-end; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica{ display: flex; justify-content: flex-start; align-items: flex-start; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica .textoCorridoLocacaoFotografica{ display: flex; justify-content: flex-start; align-items: center; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica .textoCorridoLocacaoFotografica p{ font-family: var(--font-secundaria); font-size: 12px; line-height: 18px; color: #000000; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica .imgLocacaoFotografica{ display: none; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica .imgMesaCha { display: none; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .btnLocacaoFotografica{ display: grid; grid-template-rows: 4px auto 4px; /* background-image: url(../Imgs/FotoLocacao.png); background-size: contain; background-position: center; background-repeat: repeat-x; */ justify-content: center; align-items: center; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .btnLocacaoFotografica div{ grid-area: 2/1/3/2; display: flex; justify-content: center; align-items: center; cursor: pointer; background-color: var(--color-principal); width: 200px; height: 50px; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .btnLocacaoFotografica div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 20px; line-height: 32px; /* identical to box height */ display: flex; align-items: center; text-align: center; text-transform: uppercase; color: #fff; } .rodapeLocacaoFoto{ grid-area: 3/1/4/4; display: grid; grid-template-columns: auto 360px auto; } .containerAlbumFotosLocacaoFotografica{ display: grid; grid-template-rows: auto; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica{ display: grid; grid-template-rows: 1px auto; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider{ grid-area: 2/1/3/2; width: 150px; height: auto; display: grid; grid-row-gap: 40px; grid-template-rows: auto auto; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .setaproximoLocacaoFotos{ background-image: url(../Imgs/next-slider-projetos.png) !important; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .setaAnteriorLocacaoFotos{ background-image: url(../Imgs/back-slider-projetos.png) !important; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .paginacaoAlbumLocacaoFotografica{ } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .subcontainerAlbunsLocacaoFotograficaSlider{ } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .subcontainerAlbunsLocacaoFotograficaSlider .slidersAlbumLocacao{ width: auto; height: auto; /* background-color: blueviolet; */ } .txtDescricaoMenu { font-family: var(--font-secundaria); font-size: 12px; line-height: 150%; /* or 18px */ color: #7d7d7d; } @media screen and (min-width: 1024px){ .containerLocacaoFoto{ display: grid; grid-template-columns: auto 1024px auto; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; grid-row-gap: 150px; } .containerLocacaoFoto .locacaoFoto{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1000px auto; grid-template-rows: 60px auto; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica{ grid-area: 2/2/3/3; display: grid; grid-row-gap: 10px; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .tituloLocacaoFotografica{ height: 68px; display: flex; justify-content: flex-start; align-items: center; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica{ display: grid; grid-template-columns: auto 483px 27px auto; grid-template-rows: auto; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica .textoCorridoLocacaoFotografica{ grid-area: 1/2/2/3; display: flex; justify-content: flex-start; align-items: center; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica .textoCorridoLocacaoFotografica p{ font-family: var(--font-secundaria); font-size: 16px; line-height: 24px; color: #000000; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica .imgLocacaoFotografica{ display: flex; grid-area: 1/4/2/5; width: 450px; height: 80%; background: url(../Imgs/fotoLocacaoFotografica.jpg) no-repeat center center; background-size: cover; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica .imgMesaCha { display: flex; grid-area: 1/4/2/5; width: 350px; margin-left: 50px; height: 100%; background: url(../Imgs/MesaDeCha.jpg) no-repeat center center; background-size: cover; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .btnLocacaoFotografica{ display: grid; grid-template-rows: 25px auto 25px; /* background-image: url(../Imgs/FotoLocacao.png); background-size: contain; background-position: left; background-repeat: no-repeat; */ justify-content: flex-start; align-items: center; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .btnLocacaoFotografica div{ grid-area: 2/1/3/2; display: flex; justify-content: center; align-items: center; cursor: pointer; background-color: var(--color-principal); width: 200px; height: 50px; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .btnLocacaoFotografica div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 20px; line-height: 32px; /* identical to box height */ display: flex; align-items: center; text-align: center; text-transform: uppercase; color: #fff; } .rodapeLocacaoFoto{ grid-area: 3/1/4/4; display: grid; grid-template-columns: auto 360px auto; } .containerAlbumFotosLocacaoFotografica{ display: grid; grid-template-rows: auto; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica{ display: grid; grid-template-rows: 40px auto; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider{ grid-area: 2/1/3/2; width: 1000px; height: auto; display: grid; grid-row-gap: 80px; grid-template-rows: auto auto; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .paginacaoAlbumLocacaoFotografica{ } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .subcontainerAlbunsLocacaoFotograficaSlider{ margin-left: 23px; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .subcontainerAlbunsLocacaoFotograficaSlider .slidersAlbumLocacao{ width: auto; height: auto; /* background-color: blueviolet; */ } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .setaproximoLocacaoFotos{ background-image: url(../Imgs/next-slider-projetos.png) !important; margin-top: -50px; right: 2px; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .setaAnteriorLocacaoFotos{ background-image: url(../Imgs/back-slider-projetos.png) !important; margin-top: -50px; left: 2px; } .txtDescricaoMenu { font-family: var(--font-secundaria); font-size: 14px; line-height: 150%; /* or 18px */ color: #7d7d7d; } } @media screen and (min-width: 1440px){ .containerLocacaoFoto{ display: grid; grid-template-columns: auto 1440px auto; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto 330px; grid-row-gap: 150px; } .containerLocacaoFoto .locacaoFoto{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1200px auto; grid-template-rows: 60px auto; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica{ grid-area: 2/2/3/3; display: grid; grid-row-gap: 10px; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .tituloLocacaoFotografica{ height: 68px; display: flex; justify-content: flex-start; align-items: center; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica{ display: grid; grid-template-columns: auto 573px 27px 705px auto; grid-template-rows: auto; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica .textoCorridoLocacaoFotografica{ grid-area: 1/2/2/3; display: flex; justify-content: flex-start; align-items: center; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica .textoCorridoLocacaoFotografica p{ font-family: var(--font-secundaria); font-size: 16px; line-height: 24px; color: #000000; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica .imgLocacaoFotografica{ display: flex; grid-area: 1/4/2/5; width: 605px; height: 80%; background: url(../Imgs/fotoLocacaoFotografica.jpg) no-repeat center center; background-size: cover; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .txtLocacaoFotografica .imgMesaCha { display: flex; grid-area: 1/4/2/5; width:350px; height: 100%; background: url(../Imgs/MesaDeCha.jpg) no-repeat center center; background-size: cover; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .btnLocacaoFotografica{ display: grid; grid-template-rows: 25px auto 25px; justify-content: flex-start; align-items: center; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .btnLocacaoFotografica div{ grid-area: 2/1/3/2; display: flex; justify-content: center; align-items: center; cursor: pointer; background-color: var(--color-principal); width: 200px; height: 50px; } .containerLocacaoFoto .locacaoFoto .infosLocacaoFotografica .btnLocacaoFotografica div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 20px; line-height: 32px; /* identical to box height */ display: flex; align-items: center; text-align: center; text-transform: uppercase; color: #fff; } .rodapeLocacaoFoto{ grid-area: 3/1/4/4; display: grid; grid-template-columns: auto 360px auto; } .containerAlbumFotosLocacaoFotografica{ display: grid; grid-template-rows: auto; grid-template-columns: 1200px; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica{ display: grid; grid-template-rows: 40px auto; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider{ grid-area: 2/1/3/2; width: 1200px; height: auto; display: grid; grid-row-gap: 80px; grid-template-rows: auto auto; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .paginacaoAlbumLocacaoFotografica{ } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .subcontainerAlbunsLocacaoFotograficaSlider{ margin-left: 23px; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .subcontainerAlbunsLocacaoFotograficaSlider .slidersAlbumLocacao{ width: auto; height: auto; /* background-color: blueviolet; */ } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .setaproximoLocacaoFotos{ background-image: url(../Imgs/next-slider-projetos.png) !important; margin-top: -65px; } .containerAlbumFotosLocacaoFotografica .albumFotosLocacaoFotografica .containerAlbunsLocacaoFotograficaSlider .setaAnteriorLocacaoFotos{ background-image: url(../Imgs/back-slider-projetos.png) !important; margin-top: -65px; } .txtDescricaoMenu { font-family: var(--font-secundaria); font-size: 16px; line-height: 150%; /* or 18px */ color: #7d7d7d; } } /*--------------------- css modal pessoas-------------------*/ /*.modal-container { position: fixed; background-color: #fff; width: 70%; max-width: 400px; left: 50%; padding: 20px; border-radius: 5px; }*/ :root{ --color-principal: #3FB0A2; --font-primaria: 'Cinzel', serif; --font-secundaria: 'proxima-nova', sans-serif; } .containerTotalTermos{ display: grid; grid-template-columns: auto 360px auto; grid-row-gap: 50px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; } .containerTotalTermos .containerTermos{ grid-area: 2/1/3/4; display: grid; grid-template-columns: auto 330px auto; grid-template-rows: 24px auto; } .containerTotalTermos .containerTermos .termos{ grid-area: 2/2/3/3; display: grid; } .containerTotalTermos .containerTermos .termos .termoContrato{ display: grid; grid-row-gap: 26px; grid-template-rows: min-content; grid-template-rows: 76px auto auto 30px; background-image: url(../Imgs/fundoProjetos.png); background-repeat: no-repeat; background-position-y: bottom; } .containerTotalTermos .containerTermos .termos .termoContrato .termosDoContrato{ display: grid; grid-row-gap: 10px; grid-area: 2/1/3/2; } .containerTotalTermos .containerTermos .termos .termoContrato .termosDoContrato div{ display: grid; grid-template-columns: auto auto; grid-column-gap: 8px; } .numeracaoTermoContrato{ font-family: var(--font-secundaria); font-size: 14px; line-height: 120%; /* identical to box height, or 17px */ color: #000000; font-weight: bold; } .containerTotalTermos .containerTermos .termos .termoContrato .termosDoContrato div p{ font-family: var(--font-secundaria); font-size: 12px; line-height: 150%; /* or 18px */ color: #000000; } .containerTotalTermos .containerTermos .termos .termoContrato ul li { font-family: var(--font-secundaria); font-size: 11px; line-height: 150%; /* or 18px */ color: #000000; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato{ grid-area: 3/1/4/2; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato div{ display: flex; justify-content: flex-start; align-items: center; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato div input{ width: 13px; height: 13px; -webkit-appearance: none; border-radius: 2px; background: url(../Imgs/checkbox-no.png) no-repeat center center; background-size: cover; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato div input:checked{ background: url(../Imgs/checkedLoacao.png) no-repeat center center; background-size: cover; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato p{ font-size: 14px; line-height: 100%; font-family: var(--font-secundaria); color: #000000; margin-left: 8px; font-style: italic; } @media screen and (min-width: 1024px){ .containerTotalTermos{ display: grid; grid-template-columns: auto 1024px auto; grid-row-gap: 150px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; } .containerTotalTermos .containerTermos{ grid-area: 2/1/3/4; display: grid; grid-template-columns: auto 1000px auto; grid-template-rows: 60px auto; } .containerTotalTermos .containerTermos .termos{ grid-area: 2/2/3/3; display: grid; } .containerTotalTermos .containerTermos .termos .termoContrato{ display: grid; grid-row-gap: 40px; grid-template-rows: min-content; grid-template-rows: 80px auto auto 10px; background-image: url(../Imgs/fundoProjetos.png); background-position-y: -375px; } .containerTotalTermos .containerTermos .termos .termoContrato .termosDoContrato{ display: grid; grid-row-gap: 24px; grid-area: 2/1/3/2; } .containerTotalTermos .containerTermos .termos .termoContrato .termosDoContrato div{ display: flex; justify-content: flex-start; } .numeracaoTermoContrato{ font-family: var(--font-secundaria); font-size: 20px; line-height: 120%; /* identical to box height, or 17px */ color: #000000; font-weight: bold; } .containerTotalTermos .containerTermos .termos .termoContrato ul li { font-family: var(--font-secundaria); font-size: 18px; line-height: 150%; /* or 18px */ color: #000000; margin-left: 39px; } .containerTotalTermos .containerTermos .termos .termoContrato .termosDoContrato ul li { font-family: var(--font-secundaria); font-size: 17px; line-height: 150%; /* or 18px */ color: #000000; margin-left: 39px; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato{ grid-area: 3/1/4/2; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato div{ display: flex; justify-content: flex-start; align-items: center; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato div input{ width: 20px; height: 20px; -webkit-appearance: none; border-radius: 2px; background: url(../Imgs/checkbox-no.png) no-repeat center center; background-size: cover; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato div input:checked{ background: url(../Imgs/checkedLoacao.png) no-repeat center center; background-size: cover; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato p{ font-size: 20px; line-height: 100%; font-family: var(--font-secundaria); color: #000000; margin-left: 8px; } } @media screen and (min-width: 1440px){ .containerTotalTermos{ display: grid; grid-template-columns: auto 1440px auto; grid-row-gap: 150px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto 330px; } .containerTotalTermos .containerTermos{ grid-area: 2/1/3/4; display: grid; grid-template-columns: auto 1170px auto; grid-template-rows: 60px auto; } .containerTotalTermos .containerTermos .termos{ grid-area: 2/2/3/3; display: grid; } .containerTotalTermos .containerTermos .termos .termoContrato{ display: grid; grid-row-gap: 40px; grid-template-rows: min-content; grid-template-rows: 80px auto auto 10px; background-image: url(../Imgs/fundoProjetos.png); background-position-y: -375px; } .containerTotalTermos .containerTermos .termos .termoContrato .termosDoContrato{ display: grid; grid-row-gap: 24px; grid-area: 2/1/3/2; } .containerTotalTermos .containerTermos .termos .termoContrato .termosDoContrato div{ display: flex; justify-content: flex-start; } .numeracaoTermoContrato{ font-family: var(--font-secundaria); font-size: 20px; line-height: 120%; /* identical to box height, or 17px */ color: #000000; font-weight: bold; } .containerTotalTermos .containerTermos .termos .termoContrato .termosDoContrato div p{ font-family: var(--font-secundaria); font-size: 18px; line-height: 150%; /* or 18px */ color: #000000; margin-left: 39px; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato{ grid-area: 3/1/4/2; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato div{ display: flex; justify-content: flex-start; align-items: center; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato div input{ width: 20px; height: 20px; -webkit-appearance: none; border-radius: 2px; background: url(../Imgs/checkbox-no.png) no-repeat center center; background-size: cover; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato div input:checked{ background: url(../Imgs/checkedLoacao.png) no-repeat center center; background-size: cover; } .containerTotalTermos .containerTermos .termos .termoContrato .aceitarContrato p{ font-size: 20px; line-height: 100%; font-family: var(--font-secundaria); color: #000000; margin-left: 8px; } } .containerCalendario{ display: grid; grid-template-columns: auto 330px auto; } .containerCalendario .calendario{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 25px; } .containerCalendario .calendario .mes{ display: flex; align-items: center; justify-content: space-between; } .containerCalendario .calendario .mes #mes-ano-titulo{ font-size: 24px; line-height: normal; text-align: center; letter-spacing: 1px; text-transform: uppercase; color: #55471E; } .containerCalendario .calendario .diaSemana{ } .containerCalendario .calendario .diaSemana table{ } .containerCalendario .calendario .diaSemana table tr{ display: grid; grid-template-columns: 47.38px 47.38px 47.38px 47.38px 47.38px 47.38px 47.38px; } .containerCalendario .calendario .diaSemana table th{ font-family: Proxima Nova; font-size: 26px; line-height: normal; text-align: center; color: #55471E; mix-blend-mode: normal; opacity: 0.6; } .containerCalendario .calendario .diaSemana table .fds{ font-family: Proxima Nova; font-size: 26px; line-height: normal; text-align: center; color: #D9D9D9 !important; mix-blend-mode: normal !important; opacity: 0.6 !important; } .containerCalendario .calendario .diaMes{ } .containerCalendario .calendario .diaMes table tr{ display: grid; grid-template-columns: 47.38px 47.38px 47.38px 47.38px 47.38px 47.38px 47.38px; grid-row-gap: 28.85px; } .containerCalendario .calendario .diaMes table tr th { font-family: Proxima Nova; font-size: 23px; line-height: normal; text-align: center; /*color: #d9d9d9;*/ color: #3FB0A2; cursor: pointer; height: 46px; width: auto; display: flex; justify-content: center; align-items: center; border-radius: 92px; opacity: .5; } .containerCalendario .calendario .diaMes table tr .corDiasCha{ color: #DC82B7; } .diaSelecionado{ background-color: #3FB0A2 !important; border-radius: 50px; color: white !important; } .diaSelecionadoCha{ background-color: #DC82B7 !important; border-radius: 50px !important; color: white !important; } .diaAgendamentoCalendario{ background-color: transparent; border-radius: 50px; color: #3FB0A2; opacity: 1 !important; } /* @media only screen and (min-width: 767px){ .containerCalendario{ display: grid; grid-template-columns: auto 720px auto; } .containerCalendario .calendario{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 35px; } .containerCalendario .calendario .mes{ display: flex; align-items: center; justify-content: space-between; } .containerCalendario .calendario .mes #mes-ano-titulo{ font-size: 34px; line-height: normal; text-align: center; letter-spacing: 1px; text-transform: uppercase; color: #55471E; } .containerCalendario .calendario .diaSemana{ display: flex; justify-content: center; align-items: center; } .containerCalendario .calendario .diaMes{ display: flex; align-items: center; justify-content: center; } .containerCalendario .calendario .diaSemana table{ } .containerCalendario .calendario .diaSemana table tr{ display: grid; grid-template-columns: 85.43px 85.43px 85.43px 85.43px 85.43px 85.43px 85.43px; } .containerCalendario .calendario .diaSemana table th{ font-family: Proxima Nova; font-size: 48px; line-height: normal; text-align: center; color: #55471E; mix-blend-mode: normal; opacity: 0.6; } .containerCalendario .calendario .diaSemana table .fds{ font-family: Proxima Nova; font-size: 48px; line-height: normal; text-align: center; color: #D9D9D9 !important; mix-blend-mode: normal !important; opacity: 0.6 !important; } .containerCalendario .calendario .diaMes{ } .containerCalendario .calendario .diaMes table tr{ display: grid; grid-template-columns: 85.43px 85.43px 85.43px 85.43px 85.43px 85.43px 85.43px; grid-row-gap: 28.85px; } .containerCalendario .calendario .diaMes table tr th{ font-family: Proxima Nova; font-size: 40px; line-height: normal; text-align: center; color: #3FB0A2; cursor: pointer; } .diaSelecionado{ background-color: #3FB0A2; border-radius: 50px; color: white !important; } } */ ._container { display: flex; /* establish flex container */ flex-direction: row; /* default value; can be omitted */ flex-wrap: nowrap; /* default value; can be omitted */ justify-content: space-between; /* switched from default (flex-start, see below) */ background-color: lightyellow; background-color: #DC82B7 !important; } .botaoAddMinus { width: 35px; height: 30px; margin-top: 5px; text-align: center; padding-top: 10px; font-weight: bolder; color: gray; cursor: pointer; /*border-radius: 5px 5px;*/ } /* #container > div { width: 100px; height: 100px; border: 2px dashed red; }*/ .campoAddMinus { height: 35px; padding-top: 4px; padding-bottom: 4px; margin-top: 5px; text-align: center; font-weight: bolder; color: gray; font-size: 26px; font-weight: normal; } .campoAddMinus::-webkit-inner-spin-button, .campoAddMinus::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0; } .unselectable { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } :root { --color-principal: #3FB0A2; --font-primaria: 'Cinzel', serif; --font-secundaria: 'proxima-nova', sans-serif; } .containerTotalReservaFotografica { display: grid; grid-template-columns: auto 360px auto; grid-row-gap: 70px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; } .containerTotalReservaFotografica .containerReservaFotografica { grid-area: 2/2/3/3; grid-template-rows: 24px auto; grid-template-columns: auto 330px auto; } .containerTotalReservaFotografica .containerReservaFotografica .reservaFotografica { grid-area: 2/2/3/3; display: grid; grid-row-gap: 55px; } .containerTotalReservaFotografica .containerReservaFotografica .reservaFotografica .calendarioReservaFotografica { display: grid; grid-row-gap: 53px; } .containerTotalReservaFotografica .containerReservaFotografica .reservaFotografica .calendarioReservaFotografica .infoReservaFotografica { display: grid; grid-row-gap: 40px; /* grid-template-rows: min-content; */ } @media screen and (min-width: 1024px) { .containerTotalReservaFotografica { display: grid; grid-template-columns: auto 1024px auto; grid-row-gap: 220px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; } .containerTotalReservaFotografica .containerReservaFotografica { grid-area: 2/2/3/3; grid-template-rows: 60px auto; grid-template-columns: auto 1000px auto; } .containerTotalReservaFotografica .containerReservaFotografica .reservaFotografica { grid-area: 2/2/3/3; display: grid; grid-row-gap: 80px; } .containerTotalReservaFotografica .containerReservaFotografica .reservaFotografica .calendarioReservaFotografica { display: grid; grid-template-rows: auto auto; grid-column-gap: 32px; grid-template-columns: auto auto; grid-row-gap: 53px; } .containerTotalReservaFotografica .containerReservaFotografica .reservaFotografica .calendarioReservaFotografica .infoReservaFotografica { grid-area: 1/2/2/3; display: grid; /* grid-template-rows: min-content; */ } } @media screen and (min-width: 1440px) { .containerTotalReservaFotografica { display: grid; grid-template-columns: auto 1440px auto; grid-row-gap: 220px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto 330px; } .containerTotalReservaFotografica .containerReservaFotografica { grid-area: 2/2/3/3; grid-template-rows: 60px auto; grid-template-columns: auto 1170px auto; } .containerTotalReservaFotografica .containerReservaFotografica .reservaFotografica { grid-area: 2/2/3/3; display: grid; grid-row-gap: 80px; } .containerTotalReservaFotografica .containerReservaFotografica .reservaFotografica .calendarioReservaFotografica { display: grid; grid-template-rows: auto auto; grid-column-gap: 32px; grid-template-columns: auto auto; grid-row-gap: 53px; } .containerTotalReservaFotografica .containerReservaFotografica .reservaFotografica .calendarioReservaFotografica .infoReservaFotografica { grid-area: 1/2/2/3; display: grid; grid-row-gap: 20px; /* grid-template-rows: min-content; */ } } .containerTotalFormularioLocacaoFoto{ display: grid; grid-template-columns: auto 360px auto; grid-row-gap: 100px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 330px auto; } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica .locacaoFotografica{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 50px; } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica .locacaoFotografica .inputFormularioFotografia{ display: grid; grid-row-gap: 16px; } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica .locacaoFotografica .inputFormularioFotografia .informacoesPessoaisFotografia{ display: grid; grid-row-gap: 16px; } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica .locacaoFotografica .inputFormularioFotografia .informacoesLocalFotografia{ display: grid; grid-row-gap: 16px; } @media screen and (min-width: 1024px){ .containerTotalFormularioLocacaoFoto{ display: grid; grid-template-columns: auto 1024px auto; grid-row-gap: 140px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1000px auto; } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica .locacaoFotografica{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 50px; } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica .locacaoFotografica .inputFormularioFotografia{ display: grid; grid-template-columns: auto auto; grid-row-gap: 0px; grid-column-gap: 30px } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica .locacaoFotografica .inputFormularioFotografia .informacoesPessoaisFotografia{ display: grid; grid-row-gap: 32px; height: auto; } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica .locacaoFotografica .inputFormularioFotografia .informacoesLocalFotografia{ display: grid; grid-row-gap: 32px; height: 304px; } } @media screen and (min-width: 1440px){ .containerTotalFormularioLocacaoFoto{ display: grid; grid-template-columns: auto 1440px auto; grid-row-gap: 200px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto 330px; } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1170px auto; } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica .locacaoFotografica{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 50px; } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica .locacaoFotografica .inputFormularioFotografia{ display: grid; grid-template-columns: auto auto; grid-row-gap: 0px; grid-column-gap: 30px } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica .locacaoFotografica .inputFormularioFotografia .informacoesPessoaisFotografia{ display: grid; grid-row-gap: 32px; height: auto; } .containerTotalFormularioLocacaoFoto .containerFormularioLocacaoFotografica .locacaoFotografica .inputFormularioFotografia .informacoesLocalFotografia{ display: grid; grid-row-gap: 32px; height: 304px; } } :root{ --color-principal: #3FB0A2; --font-primaria: 'Cinzel', serif; --font-secundaria: 'proxima-nova', sans-serif; --font-terciaria: 'Merriweather', serif; --font-quartenaria: 'Miniver', cursive; } .containerTotalLocacaoAcessorios{ display: grid; grid-template-columns: auto 360px auto; grid-row-gap: 100px; background-image: url(../Imgs/FotoLocacao.png); background-repeat: no-repeat; background-position-y: -155px; background-position-x: right; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 330px auto; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 30px; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .txtImgLocacaoAcessorios{ display: grid; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .txtImgLocacaoAcessorios .txtLocacaoAcessorios{ display: flex; justify-content: flex-start; align-items: center } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .txtImgLocacaoAcessorios .txtLocacaoAcessorios p{ font-family: var(--font-secundaria); font-size: 12px; line-height: 18px; color: #000000; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .txtImgLocacaoAcessorios .imgLocacaoAcessorios{ display: none; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .filtrosLocacaoAcessorios{ display: grid; grid-row-gap: 5px; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .divCardsAcessoriosLocacao{ display: grid; grid-row-gap: 16px; } @media screen and (min-width: 1024px){ .containerTotalLocacaoAcessorios{ display: grid; grid-template-columns: auto 1024px auto; grid-row-gap: 200px; background-position-y: 20px; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1000px auto; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 80px; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .txtImgLocacaoAcessorios{ display: grid; grid-template-columns: auto auto; grid-column-gap: 30px; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .txtImgLocacaoAcessorios .txtLocacaoAcessorios{ display: flex; justify-content: flex-start; align-items: flex-start } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .txtImgLocacaoAcessorios .txtLocacaoAcessorios p{ font-family: var(--font-secundaria); font-size: 16px; line-height: 35px; color: #000000; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .txtImgLocacaoAcessorios .imgLocacaoAcessorios{ display: flex; justify-content: center; align-items: center; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .filtrosLocacaoAcessorios{ display: grid; grid-row-gap: 5px; grid-template-columns: 570px; grid-template-rows: 69px; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .divCardsAcessoriosLocacao{ display: grid; grid-template-columns: auto auto auto; grid-column-gap: 92px; grid-row-gap: 36px; } } @media screen and (min-width: 1440px){ .containerTotalLocacaoAcessorios{ display: grid; grid-template-columns: auto 1440px auto; grid-row-gap: 200px; background-position-y: 20px; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1170px auto; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 80px; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .txtImgLocacaoAcessorios{ display: grid; grid-template-columns: 515px 610px; grid-column-gap: 42px; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .txtImgLocacaoAcessorios .txtLocacaoAcessorios{ display: flex; justify-content: flex-start; align-items: flex-start } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .txtImgLocacaoAcessorios .txtLocacaoAcessorios p{ font-family: var(--font-secundaria); font-size: 16px; line-height: 42px; color: #000000; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .txtImgLocacaoAcessorios .imgLocacaoAcessorios{ display: flex; justify-content: center; align-items: center; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .filtrosLocacaoAcessorios{ display: grid; grid-row-gap: 5px; grid-template-columns: 570px; grid-template-rows: 69px; } .containerTotalLocacaoAcessorios .containerLocacaoAcessorios .LocacaoAcessorios .divCardsAcessoriosLocacao{ display: grid; grid-template-columns: auto auto auto auto; grid-column-gap: 30px; grid-row-gap: 36px; } } :root{ --color-principal: #3FB0A2; --font-primaria: 'Cinzel', serif; --font-secundaria: 'proxima-nova', sans-serif; --font-terciaria: 'Merriweather', serif; --font-quartenaria: 'Miniver', cursive; } .containerTotalResumoCompra{ display: grid; grid-template-columns: auto 360px auto; grid-row-gap: 100px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; } .containerTotalResumoCompra .containerResumoCompra{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 330px auto; } .containerTotalResumoCompra .containerResumoCompra .resumoCompra{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 40px; } .containerTotalResumoCompra .containerResumoCompra .resumoCompra .resumoNotaFiscalItensCompra{ display: grid; grid-row-gap: 32px; } .btnSeguirParaPagamento{ display: flex !important; align-items: center !important; text-align: center !important; width: 100% !important; background: #3FB0A2 !important; /*border-radius: 4px !important;*/ } .btnSeguirParaPagamento p{ font-family: var(--font-primaria); font-style: normal !important; font-weight: normal !important; font-size: 22px !important; line-height: 100% !important; text-transform: uppercase !important; color: #FFFFFF !important; } @media screen and (min-width: 1024px){ .containerTotalResumoCompra{ display: grid; grid-template-columns: auto 1024px auto; grid-row-gap: 130px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; } .containerTotalResumoCompra .containerResumoCompra{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1000px auto; } .containerTotalResumoCompra .containerResumoCompra .resumoCompra{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 80px; } .containerTotalResumoCompra .containerResumoCompra .resumoCompra .resumoNotaFiscalItensCompra{ display: flex; justify-content: space-around; align-items: flex-start; } .btnSeguirParaPagamento{ display: flex !important; align-items: center !important; text-align: center !important; width: 350px !important; background: #3FB0A2 !important; /*border-radius: 4px !important;*/ } .btnSeguirParaPagamento p{ font-family: var(--font-primaria); font-style: normal !important; font-weight: normal !important; font-size: 25px !important; line-height: 100% !important; text-transform: uppercase !important; color: #FFFFFF !important; } } @media screen and (min-width: 1440px){ .containerTotalResumoCompra{ display: grid; grid-template-columns: auto 1440px auto; grid-row-gap: 200px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto 330px; } .containerTotalResumoCompra .containerResumoCompra{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1170px auto; } .containerTotalResumoCompra .containerResumoCompra .resumoCompra{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 80px; } .containerTotalResumoCompra .containerResumoCompra .resumoCompra .resumoNotaFiscalItensCompra{ display: flex; justify-content: space-around; align-items: flex-start; } .btnSeguirParaPagamento{ display: flex !important; align-items: center !important; text-align: center !important; width: 570px !important; background: #3FB0A2 !important; /*border-radius: 4px !important;*/ } .btnSeguirParaPagamento p{ font-family: var(--font-primaria); font-style: normal !important; font-weight: normal !important; font-size: 32px !important; line-height: 100% !important; text-transform: uppercase !important; color: #FFFFFF !important; } } :root{ --color-principal: #3FB0A2; --font-primaria: 'Cinzel', serif; --font-secundaria: 'proxima-nova', sans-serif; --font-terciaria: 'Merriweather', serif; } /* ALBUM DE FOTOS INICIO */ @media screen and (max-width: 400px){ .gallery .content{ justify-content: center; align-items: center; display: flex; } } .hello { opacity: 1 !important; } .full { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; } .full .content { background-color: rgba(0,0,0,0.75) !important; height: 100%; width: 100%; display: grid; } .full .content img { left: 50%; transform: translate3d(0, 0, 0); animation: zoomin 1s ease; max-width: 100%; max-height: 100%; margin: auto; } .byebye { opacity: 0; } .byebye:hover { transform: scale(0.2) !important; } .gallery { display: grid; grid-column-gap: 8px; grid-row-gap: 8px; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); grid-auto-rows: auto; } .gallery img { max-width: 100%; border-radius: 8px; box-shadow: 0 0 10px rgba(0,0,0,.5); transition: all .5s ease; } .gallery img:hover { box-shadow: 0 0 20px rgba(0,0,0,.5); transition: all .5s ease; } .gallery .content { padding: 4px; } .gallery .gallery-item { transition: grid-row-start 300ms linear; transition: transform 300ms ease; transition: all 0.5s ease; cursor: pointer; } .gallery .gallery-item:hover { transform: scale(1.025); } @media (max-width: 600px) { .gallery { grid-template-columns: repeat(auto-fill, minmax(30%, 1fr)); } } @media (max-width: 400px) { .gallery { grid-template-columns: repeat(auto-fill, minmax(50%, 1fr)); } } @-moz-keyframes zoomin { 0% { max-width: 50%; transform: rotate(-30deg); filter: blur(4px); } 30% { filter: blur(4px); transform: rotate(-80deg); } 70% { max-width: 50%; transform: rotate(45deg); } 100% { max-width: 100%; transform: rotate(0deg); } } @-webkit-keyframes zoomin { 0% { max-width: 50%; transform: rotate(-30deg); filter: blur(4px); } 30% { filter: blur(4px); transform: rotate(-80deg); } 70% { max-width: 50%; transform: rotate(45deg); } 100% { max-width: 100%; transform: rotate(0deg); } } @-o-keyframes zoomin { 0% { max-width: 50%; transform: rotate(-30deg); filter: blur(4px); } 30% { filter: blur(4px); transform: rotate(-80deg); } 70% { max-width: 50%; transform: rotate(45deg); } 100% { max-width: 100%; transform: rotate(0deg); } } @keyframes zoomin { 0% { max-width: 50%; transform: rotate(-30deg); filter: blur(4px); } 30% { filter: blur(4px); transform: rotate(-80deg); } 70% { max-width: 50%; transform: rotate(45deg); } 100% { max-width: 100%; transform: rotate(0deg); } } .containerTotalAlbumFotos{ display: grid; grid-template-columns: auto 360px auto; grid-row-gap: 50px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; } .containerTotalAlbumFotos .containerAlbumFotos{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 330px auto; } .containerTotalAlbumFotos .containerAlbumFotos .albumFotos{ grid-area: 1/2/2/3; display: grid; grid-template-rows: auto auto 75px; grid-row-gap: 50px; } .containerTotalAlbumFotos .containerAlbumFotos .albumFotos .cardAlbumFotosContainer{ display: grid; grid-template-columns: auto auto; grid-column-gap: 20px; grid-row-gap: 35px; } @media screen and (min-width: 1024px){ .containerTotalAlbumFotos{ display: grid; grid-template-columns: auto 1024px auto; grid-row-gap: 135px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; } .containerTotalAlbumFotos .containerAlbumFotos{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1000px auto; } .containerTotalAlbumFotos .containerAlbumFotos .albumFotos{ grid-area: 1/2/2/3; display: grid; grid-template-rows: auto auto 100px; } .containerTotalAlbumFotos .containerAlbumFotos .albumFotos .cardAlbumFotosContainer{ display: grid; grid-template-columns: auto auto auto; grid-column-gap: 50px; grid-row-gap: 50px; } } @media screen and (min-width: 1440px){ .containerTotalAlbumFotos{ display: grid; grid-template-columns: auto 1440px auto; grid-row-gap: 135px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto 330px; } .containerTotalAlbumFotos .containerAlbumFotos{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1170px auto; } .containerTotalAlbumFotos .containerAlbumFotos .albumFotos{ grid-area: 1/2/2/3; display: grid; grid-template-rows: auto auto; } .containerTotalAlbumFotos .containerAlbumFotos .albumFotos .cardAlbumFotosContainer{ display: grid; grid-template-columns: auto auto auto auto; grid-column-gap: 50px; grid-row-gap: 50px; } } /* ALBUM DE FOTOS INICIO */ /* FOTOS INICIO */ .containerTotalFotos{ display: grid; grid-template-columns: auto 360px auto; grid-row-gap: 50px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; } .containerTotalFotos .containerFotos{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 330px auto; } .containerTotalFotos .containerFotos .fotos{ grid-area: 1/2/2/3; display: grid; grid-template-rows: auto auto auto 1px; } .containerTotalFotos .containerFotos .fotos .titulAlbumSelecionado{ display: grid; grid-template-rows: 34px 16px; } .containerTotalFotos .containerFotos .fotos .titulAlbumSelecionado div{ grid-area: 1/1/2/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalFotos .containerFotos .fotos .titulAlbumSelecionado div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 21px; line-height: 34px; display: flex; align-items: center; color: #3FB0A2; } .containerTotalFotos .containerFotos .fotos .cardFotosContainer{ /* display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); grid-auto-rows: auto; grid-gap: 5px; grid-auto-flow: dense; row-gap: 10px; */ } .containerTotalFotos .containerFotos .fotos .cardFotosContainer div{ /* width: 100%; height: auto; background-size: cover; cursor: pointer; background-repeat: no-repeat; background-position: center; */ } .containerTotalFotos .containerFotos .fotos .cardFotosContainer img{ /* width: 100%; height: auto; */ /* background-size: cover; cursor: pointer; background-repeat: no-repeat; background-position: center; */ } @media screen and (min-width: 1024px){ .containerTotalFotos{ display: grid; grid-template-columns: auto 1024px auto; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; } .containerTotalFotos .containerFotos{ grid-area: 1/2/2/3; display: grid; grid-template-columns: auto 1000px auto; grid-template-rows: auto auto; grid-row-gap: 146px; } .containerTotalFotos .containerFotos .fotos{ grid-area: 2/2/3/3; display: grid; grid-template-rows: auto auto auto 1px; } .containerTotalFotos .containerFotos .fotos .titulAlbumSelecionado{ display: grid; grid-template-rows: 60px 32px; } .containerTotalFotos .containerFotos .fotos .titulAlbumSelecionado div{ grid-area: 1/1/2/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalFotos .containerFotos .fotos .titulAlbumSelecionado div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 37px; line-height: 60px; display: flex; align-items: center; color: #3FB0A2; } .containerTotalFotos .containerFotos .fotos .cardFotosContainer{ /* display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 300px)); grid-auto-rows: auto; grid-gap: 5px; grid-auto-flow: dense; */ } .containerTotalFotos .containerFotos .fotos .cardFotosContainer div{ /* width: 270px; height: 400px; background-size: cover; cursor: pointer; background-repeat: no-repeat; background-position: center; */ } .containerTotalFotos .containerFotos .fotos .cardFotosContainer img{ /* width: 100%; height: auto; */ /* background-size: cover; cursor: pointer; background-repeat: no-repeat; background-position: center; */ } } @media screen and (min-width: 1440px){ .containerTotalFotos{ display: grid; grid-template-columns: auto 1440px auto; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto 330px; } .containerTotalFotos .containerFotos{ grid-area: 1/2/2/3; display: grid; grid-template-columns: auto 1170px auto; } .containerTotalFotos .containerFotos .fotos{ grid-area: 1/2/2/3; display: grid; grid-template-rows: auto auto auto 1px; } .containerTotalFotos .containerFotos .fotos .titulAlbumSelecionado{ display: grid; grid-template-rows: 60px 32px; } .containerTotalFotos .containerFotos .fotos .titulAlbumSelecionado div{ grid-area: 1/1/2/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalFotos .containerFotos .fotos .titulAlbumSelecionado div p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 37px; line-height: 60px; display: flex; align-items: center; color: #3FB0A2; } .containerTotalFotos .containerFotos .fotos .cardFotosContainer{ /* display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); grid-auto-rows: 200px; grid-gap: 5px; grid-auto-flow: dense; */ } .containerTotalFotos .containerFotos .fotos .cardFotosContainer div{ /* width: 270px; height: 400px; background-size: cover; cursor: pointer; background-repeat: no-repeat; background-position: center; */ } .containerTotalFotos .containerFotos .fotos .cardFotosContainer img{ /* width: 100%; height: auto; */ /* background-size: cover; cursor: pointer; background-repeat: no-repeat; background-position: center; */ } } /* FOTOS INICIO */ :root{ --color-principal: #3FB0A2; --font-primaria: 'Cinzel', serif; --font-secundaria: 'proxima-nova', sans-serif; --font-terciaria: 'Merriweather', serif; --font-quartenaria: 'Miniver', cursive; } .seta-anterior-projetos{ background-image: url(../Imgs/back-slider-projetos.png) !important; left: 1px !important; } .seta-proximo-projetos{ background-image: url(../Imgs/next-slider-projetos.png) !important; right: 1px !important; } .containerTotalProjetos{ display: grid; grid-template-columns: auto 360px auto; grid-row-gap: 46px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat, url(../Imgs/fundoProjetos.png) no-repeat top, no-repeat top/90% url(../Imgs/fundoProjetos.png);; background-position: top right; background-size: auto auto; } .containerTotalProjetos .containerProjetos{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 330px auto; background: no-repeat top/90% url(../Imgs/fundoProjetos.png), no-repeat bottom/130% url(../Imgs/fundoProjetos.png);; } .containerTotalProjetos .containerProjetos .projetos{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 15px; } .containerTotalProjetos .containerProjetos .projetos .sobreProjeto{ display: grid; grid-row-gap: 52px; } .containerTotalProjetos .containerProjetos .projetos .albumFotosProjetos{ display: flex; } .containerTotalProjetos .containerProjetos .projetos .albumFotosProjetos .colecaoAlbumProjetos{ display: grid; grid-row-gap: 24px; } .containerTotalProjetos .containerProjetos .projetos .albumFotosProjetos .colecaoAlbumProjetos div{ display: flex; justify-content: center; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .albumFotosProjetos .colecaoAlbumProjetos .subtituloColecaoAlbumProjetos{ display: flex; justify-content: center; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .albumFotosProjetos .colecaoAlbumProjetos .subtituloColecaoAlbumProjetos p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 32px; line-height: 43px; /* identical to box height */ display: flex; align-items: center; text-align: center; color: #3FB0A2; } .containerTotalProjetos .containerProjetos .projetos .albumFotosProjetos .colecaoFotosProjetos{ display: none; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos{ display: grid; grid-template-columns: 10px auto 10px; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos{ grid-area: 1/2/2/3; display: grid; grid-template-rows: 1px auto 31px; grid-row-gap: 9px; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .aspas{ grid-area: 1/1/3/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .aspas p{ font-family: var(--font-terciaria); font-style: normal; font-weight: normal; font-size: 200px; line-height: 277px; /* identical to box height */ color: rgba(63, 176, 162, 0.4); } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .txtCitacao1Projetos{ grid-area: 2/1/3/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .txtCitacao1Projetos p{ font-family: var(--font-quartenaria); font-style: normal; font-weight: normal; font-size: 16px; line-height: 188.55%; /* or 30px */ color: #454545; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .autorCitacao1Projetos{ grid-area: 3/1/4/2; display: flex; justify-content: flex-end; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .autorCitacao1Projetos p{ font-family: var(--font-terciaria); font-style: italic; font-weight: bold; font-size: 16px; line-height: 30px; /* identical to box height */ color: #000000; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos{ display: grid; grid-row-gap: 21px; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos{ display: grid; grid-row-gap: 21px; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos .tituloPapelariaProjetos{ display: flex; justify-content: flex-start; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos .tituloPapelariaProjetos p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 21px; line-height: 34px; /* identical to box height */ display: flex; align-items: center; color: #3FB0A2; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos .txtPapelariaProjetos{ display: flex; justify-content: flex-start; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos .txtPapelariaProjetos p{ font-family: var(--font-secundaria); font-size: 12px; line-height: 18px; color: #454545; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .imgPapelariaProjetos{ width: 100%; height: 235px; /* background: url(../Imgs/papelaria.jpg) no-repeat center center; */ background-size: cover; background-repeat: no-repeat; } .containerTotalProjetos .containerProjetos .projetos .containerCitacoesClientesProjetos{ height: 420px; background-image: url(../Imgs/backgroundCitacaoProjetos.png); background-repeat: no-repeat; background-position-x: left; background-position-y: -16px; display: flex; justify-content: center; align-content: center; } .containerTotalProjetos .containerProjetos .projetos .containerCitacoesClientesProjetos .citacoesClientesProjetos{ width: 330px; height: auto; align-self: center; } .containerTotalProjetos .containerProjetos .projetos .containerCitacoesClientesProjetos .citacoesClientesProjetos .swiper-container-paginaProjetos{ /* display: grid; grid-row-gap: 30px; grid-template-rows: auto auto; */ } .btn-slider-pagina-projetos{ background-color: white; color: white; } /* .swiper-button-next, .swiper-container-rtl .swiper-button-prev{ background-image: url(../Imgs/nextIcon.png) !important; } .swiper-button-prev, .swiper-container-rtl .swiper-button-next{ background-image: url(../Imgs/previousIcon.png) !important; } */ .swiperBtnFrameNext{ background-image: url(../Imgs/nextIcon.png) !important; } .swiperBtnFramePrev{ background-image: url(../Imgs/previousIcon.png) !important; } .containerCitacoesClientesProjetos .citacoesClientesProjetos .swiper-container-paginaProjetos .btn-backSlider-Cliente{ background-image: url(../Imgs/back-slider-projetos.png) !important } .containerCitacoesClientesProjetos .citacoesClientesProjetos .swiper-container-paginaProjetos .btn-nextSlider-Cliente{ background-image: url(../Imgs/next-slider-projetos.png) !important } @media screen and (min-width: 1024px){ .seta-anterior-projetos{ background-image: url(../Imgs/back-slider-projetos.png) !important; left: -5px !important; } .seta-proximo-projetos{ background-image: url(../Imgs/next-slider-projetos.png) !important; right: -5px !important; } .containerTotalProjetos{ display: grid; grid-template-columns: auto 1024px auto; /* background:url(../Imgs/cabecalhoMFVP.png) top right no-repeat ,url(../Imgs/projetosTintaDesktop.png) right no-repeat, url(../Imgs/projetosTintaDesktop2.png) left center no-repeat; */ grid-row-gap: 146px; background-image: url(../Imgs/cabecalhoMFVP.png), url(../Imgs/projetosTintaDesktop.png); background-position: top right, right, left center; background-repeat: no-repeat; } .containerTotalProjetos .containerProjetos{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1000px auto; background: url(../Imgs/fundoProjetos.png) center bottom no-repeat, no-repeat top/90% url(../Imgs/fundoProjetos.png); } .containerTotalProjetos .containerProjetos .projetos{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 15px; } .containerTotalProjetos .containerProjetos .sobreProjeto{ display: grid; } .containerTotalProjetos .containerProjetos .projetos .albumFotosProjetos{ display: flex; } .containerTotalProjetos .containerProjetos .projetos .albumFotosProjetos .colecaoAlbumProjetos{ display: none; grid-row-gap: 0px; } .containerTotalProjetos .containerProjetos .projetos .albumFotosProjetos .colecaoFotosProjetos{ display: grid; grid-template-columns: auto auto auto auto; grid-column-gap: 35px; grid-row-gap: 30px; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos{ display: grid; grid-template-columns: 20px auto 20px; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos{ grid-area: 1/2/2/3; display: grid; grid-template-rows: 1px auto 40px; grid-row-gap: 9px; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .aspas{ grid-area: 1/1/3/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .aspas p{ font-family: var(--font-terciaria); font-style: normal; font-weight: normal; font-size: 200px; line-height: 277px; /* identical to box height */ color: rgba(63, 176, 162, 0.4); } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .txtCitacao1Projetos{ grid-area: 2/1/3/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .txtCitacao1Projetos p{ font-family: var(--font-quartenaria); font-style: normal; font-weight: normal; font-size: 18px; line-height: 150%; /* or 30px */ color: #454545; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .autorCitacao1Projetos{ grid-area: 3/1/4/2; display: flex; justify-content: flex-end; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .autorCitacao1Projetos p{ font-family: var(--font-terciaria); font-style: italic; font-weight: bold; font-size: 21px; line-height: 40px; /* identical to box height */ color: #000000; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos{ display: grid; grid-template-columns: 650px 300px; grid-column-gap: 25px; grid-row-gap: 0px; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos{ /* grid-area: 1/1/2/2; */ grid-row-gap: 15px } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos .tituloPapelariaProjetos{ display: flex; justify-content: flex-start; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos .tituloPapelariaProjetos p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 28px; line-height: 45px; /* identical to box height */ display: flex; align-items: center; color: #3FB0A2; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos .txtPapelariaProjetos{ display: flex; justify-content: flex-start; align-items: flex-start; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos .txtPapelariaProjetos p{ font-family: var(--font-secundaria); font-size: 16px; line-height: 24px; color: #454545; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .imgPapelariaProjetos { /* grid-area: 1/2/2/3; */ width: 100%; height: auto; /* background: url(../Imgs/papelaria.jpg) no-repeat center center; */ background-size: cover; background-repeat: no-repeat; } } @media screen and (min-width: 1440px){ .seta-anterior-projetos{ background-image: url(../Imgs/back-slider-projetos.png) !important; left: 1px !important; } .seta-proximo-projetos{ background-image: url(../Imgs/next-slider-projetos.png) !important; right: 1px !important; } .containerTotalProjetos{ display: grid; grid-template-columns: auto 1440px auto; /* background: url(../Imgs/projetosTintaDesktop.png) right no-repeat, url(../Imgs/projetosTintaDesktop2.png) left center no-repeat; */ grid-row-gap: 146px; background-image: url(../Imgs/cabecalhoMFVP.png), url(../Imgs/projetosTintaDesktop.png), url(../Imgs/projetosTintaDesktop2.png); background-position: top right, right, left center; background-repeat: no-repeat; background-size: auto 330px, auto auto; } .containerTotalProjetos .containerProjetos{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1170px auto; background: url(../Imgs/fundoProjetos.png) center bottom no-repeat, no-repeat top/90% url(../Imgs/fundoProjetos.png); } .containerTotalProjetos .containerProjetos .projetos{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 15px; } .containerTotalProjetos .containerProjetos .sobreProjeto{ display: grid; } .containerTotalProjetos .containerProjetos .projetos .albumFotosProjetos{ display: flex; } .containerTotalProjetos .containerProjetos .projetos .albumFotosProjetos .colecaoAlbumProjetos{ display: none; grid-row-gap: 0px; } .containerTotalProjetos .containerProjetos .projetos .albumFotosProjetos .colecaoFotosProjetos{ display: grid; grid-template-columns: auto auto auto auto auto; grid-column-gap: 36px; grid-row-gap: 30px; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos{ display: grid; grid-template-columns: 30px auto 30px; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos{ grid-area: 1/2/2/3; display: grid; grid-template-rows: 1px auto 40px; grid-row-gap: 9px; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .aspas{ grid-area: 1/1/3/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .aspas p{ font-family: var(--font-terciaria); font-style: normal; font-weight: normal; font-size: 200px; line-height: 277px; /* identical to box height */ color: rgba(63, 176, 162, 0.4); } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .txtCitacao1Projetos{ grid-area: 2/1/3/2; display: flex; justify-content: flex-start; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .txtCitacao1Projetos p{ font-family: var(--font-quartenaria); font-style: normal; font-weight: normal; font-size: 32px; line-height: 150%; /* or 30px */ color: #454545; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .autorCitacao1Projetos{ grid-area: 3/1/4/2; display: flex; justify-content: flex-end; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .citacao1Projetos .containeritacao1Projetos .autorCitacao1Projetos p{ font-family: var(--font-terciaria); font-style: italic; font-weight: bold; font-size: 21px; line-height: 40px; /* identical to box height */ color: #000000; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos{ display: grid; grid-template-columns: 690px 440px; grid-column-gap: 25px; grid-row-gap: 0px; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos{ /* grid-area: 1/1/2/2; */ grid-row-gap: 15px } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos .tituloPapelariaProjetos{ display: flex; justify-content: flex-start; align-items: center; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos .tituloPapelariaProjetos p{ font-family: var(--font-primaria); font-style: normal; font-weight: normal; font-size: 28px; line-height: 45px; /* identical to box height */ display: flex; align-items: center; color: #3FB0A2; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos .txtPapelariaProjetos{ display: flex; justify-content: flex-start; align-items: flex-start; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .textoPapelariaProjetos .txtPapelariaProjetos p{ font-family: var(--font-secundaria); font-size: 16px; line-height: 24px; color: #454545; } .containerTotalProjetos .containerProjetos .projetos .papelariaProjetos .imgPapelariaProjetos { /* grid-area: 1/2/2/3; */ width: 100%; height: auto; /* background: url(../Imgs/papelaria.jpg) no-repeat center center; */ background-size: cover; background-repeat: no-repeat; } } @media screen and (min-width: 1024px){ .containerTotalProjetos .containerProjetos .projetos .containerCitacoesClientesProjetos{ height: auto; } .containerTotalProjetos .containerProjetos .projetos .containerCitacoesClientesProjetos .citacoesClientesProjetos{ width: 996px; height: auto; } .containerTotalProjetos .containerProjetos .projetos .containerCitacoesClientesProjetos .citacoesClientesProjetos .swiper-container-paginaProjetos{ /* display: grid; grid-row-gap: 30px; grid-template-rows: auto auto; */ } .containerTotalProjetos .containerProjetos .projetos .containerCitacoesClientesProjetos .citacoesClientesProjetos .swiper-container-paginaProjetos #citacaoClienteProjeto .swiper-slider-pagina-projetos{ display: flex; justify-content: center; align-items: center; } .btn-slider-pagina-projetos{ background-color: white; color: white; } /* .swiper-button-next, .swiper-container-rtl .swiper-button-prev{ background-image: url(../Imgs/nextIcon.png) !important; } .swiper-button-prev, .swiper-container-rtl .swiper-button-next{ background-image: url(../Imgs/previousIcon.png) !important; } */ .swiperBtnFrameNext{ background-image: url(../Imgs/nextIcon.png) !important; } .swiperBtnFramePrev{ background-image: url(../Imgs/previousIcon.png) !important; } } @media screen and (min-width: 1440px){ .containerTotalProjetos .containerProjetos .projetos .containerCitacoesClientesProjetos{ height: auto; } .containerTotalProjetos .containerProjetos .projetos .containerCitacoesClientesProjetos .citacoesClientesProjetos{ width: 1170px; height: auto; } .containerTotalProjetos .containerProjetos .projetos .containerCitacoesClientesProjetos .citacoesClientesProjetos .swiper-container-paginaProjetos{ /* display: grid; grid-row-gap: 30px; grid-template-rows: auto auto; */ } .containerTotalProjetos .containerProjetos .projetos .containerCitacoesClientesProjetos .citacoesClientesProjetos .swiper-container-paginaProjetos #citacaoClienteProjeto .swiper-slider-pagina-projetos{ display: flex; justify-content: center; align-items: center; } .btn-slider-pagina-projetos{ background-color: white; color: white; } /* .swiper-button-next, .swiper-container-rtl .swiper-button-prev{ background-image: url(../Imgs/nextIcon.png) !important; } .swiper-button-prev, .swiper-container-rtl .swiper-button-next{ background-image: url(../Imgs/previousIcon.png) !important; } */ .swiperBtnFrameNext{ background-image: url(../Imgs/nextIcon.png) !important; } .swiperBtnFramePrev{ background-image: url(../Imgs/previousIcon.png) !important; } } /* ===== Chamada para WhatsApp (CTA-WA) em conteudo de projetos ===== */ .ctaWhatsappProjetos { display: block; box-sizing: border-box; width: 100%; max-width: 760px; margin: 40px auto; padding: 32px 28px; text-align: center; background: #faf6f1; border: 1px solid #e7ddd0; border-radius: 10px; } .ctaWhatsappProjetos .ctaWhatsappTexto { display: block; font-family: var(--font-primaria); font-size: 24px; line-height: 1.35; color: #3d3a36; margin: 0 0 22px 0; letter-spacing: .5px; } .ctaWhatsappProjetos .ctaWhatsappBotao { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 13px 26px; background-color: #25D366; color: #ffffff; font-family: var(--font-secundaria); font-size: 16px; font-weight: 600; text-decoration: none; border-radius: 50px; transition: background-color .2s ease, transform .2s ease; box-shadow: 0 4px 14px rgba(37, 211, 102, .35); } .ctaWhatsappProjetos .ctaWhatsappBotao:hover { background-color: #1ebe5b; transform: translateY(-1px); } .ctaWhatsappProjetos .ctaWhatsappIcone { width: 22px; height: 22px; fill: currentColor; flex-shrink: 0; } @media (max-width: 768px) { .ctaWhatsappProjetos { margin: 28px auto; padding: 26px 18px; } .ctaWhatsappProjetos .ctaWhatsappTexto { font-size: 20px; } } .containerTotalVideos{ display: grid; grid-template-columns: auto 360px auto; grid-row-gap: 54px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; } .containerTotalVideos .containerVideos{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 330px auto; } .containerTotalVideos .containerVideos .videos{ grid-area: 1/2/2/3; grid-row-gap: 16px; } .containerTotalVideos .containerVideos .videos .renderizaCardVideos{ display: grid; grid-row-gap: 20px; } @media screen and (min-width: 1024px){ .containerTotalVideos{ display: grid; grid-template-columns: auto 1024px auto; grid-row-gap: 54px; grid-row-gap: 135px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto auto; } .containerTotalVideos .containerVideos{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1000px auto; } .containerTotalVideos .containerVideos .videos{ grid-area: 1/2/2/3; grid-row-gap: 80px; } .containerTotalVideos .containerVideos .videos .renderizaCardVideos{ display: grid; grid-template-columns: auto auto auto; grid-column-gap: 48px; grid-row-gap: 24px; } } @media screen and (min-width: 1440px){ .containerTotalVideos{ display: grid; grid-template-columns: auto 1440px auto; grid-row-gap: 54px; grid-row-gap: 135px; background: url(../Imgs/cabecalhoMFVP.png) no-repeat; background-position: top right; background-size: auto 330px; } .containerTotalVideos .containerVideos{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1170px auto; } .containerTotalVideos .containerVideos .videos{ grid-area: 1/2/2/3; grid-row-gap: 80px; } .containerTotalVideos .containerVideos .videos .renderizaCardVideos{ display: grid; grid-template-columns: auto auto auto; grid-column-gap: 30px; grid-row-gap: 24px; } } .containerTotalMedia{ display: grid; grid-template-columns: auto 360px auto; grid-row-gap: 50px; } .containerTotalMedia .containerMedia{ grid-area: 2/2/3/3; grid-template-columns: auto 330px auto; } .containerTotalMedia .containerMedia .media{ grid-area: 1/2/2/3; display: grid; grid-row-gap: 18px; } @media screen and (min-width: 1440px){ .containerTotalMedia{ display: grid; grid-template-columns: auto 1440px auto; grid-row-gap: 130px; } .containerTotalMedia .containerMedia{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto 1200px auto; } .containerTotalMedia .containerMedia .media{ grid-area: 2/2/3/3; display: grid; grid-template-columns: auto; grid-row-gap: 18px; } .containerTotalMedia .containerMedia .media .mediaContainerFotos1{ display: grid; grid-template-columns: auto auto; grid-column-gap: 130px; grid-row-gap: 130px; justify-content: center; align-items: center; } }