/* Minification failed. Returning unminified contents. (44,25): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (94,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (152,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (184,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (190,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (209,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (285,24): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (307,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (313,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (378,24): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (484,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (539,22): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (658,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (659,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (660,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (661,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (662,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (663,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (664,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (665,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (666,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (667,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (702,28): run-time error CSS1039: Token not allowed after unary operator: '-main-bg-color' (722,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (784,22): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (814,41): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (818,45): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (827,29): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (838,29): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (842,29): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (911,21): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (1063,28): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (1096,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (1100,25): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1148,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (1198,26): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1246,29): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (1268,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (1274,25): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (1279,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1281,39): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1286,25): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1312,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1313,26): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (1345,36): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1349,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (1356,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1377,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1432,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (1458,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (1463,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1472,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1489,22): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (1490,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1499,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1520,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (1521,32): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (1535,32): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (1554,32): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (1558,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (1562,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (1625,29): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (1631,29): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1728,28): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (1770,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (1777,22): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1815,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1839,22): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (1921,22): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (1941,22): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (1946,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (1963,22): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (1981,28): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (2093,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (2100,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (2147,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2160,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (2168,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (2245,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (2274,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2303,22): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2321,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2409,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2426,37): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2460,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2510,22): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (2524,26): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (2545,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (2571,22): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (2583,26): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (2604,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (2646,43): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2647,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2652,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2659,43): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2664,26): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2684,26): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2685,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (2720,29): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (2766,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (2781,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2892,26): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (2933,40): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (2982,36): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3002,36): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3034,37): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (3069,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3078,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3134,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3179,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (3187,28): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (3224,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3237,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3242,25): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3262,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3372,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (3383,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (3440,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (3563,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3606,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3611,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (3658,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3720,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3729,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (3757,29): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3784,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (3891,22): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (3892,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (3910,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (3920,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (3968,32): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (3981,28): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (3987,28): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (3993,28): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4031,36): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4032,25): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (4062,32): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (4091,32): run-time error CSS1039: Token not allowed after unary operator: '-main-bg-color' (4095,26): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4109,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4124,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4128,17): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (4153,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4174,32): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4208,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4222,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4246,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4251,29): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4256,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4286,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4318,36): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4319,25): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (4338,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4339,28): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (4350,21): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (4351,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4379,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4388,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4402,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4407,43): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4416,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4421,43): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4444,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (4460,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4464,26): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4520,29): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (4535,29): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4547,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (4600,29): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (4615,29): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4627,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (4633,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4640,26): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4641,21): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (4645,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4650,21): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (4718,29): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (4733,29): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4745,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (4799,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (4814,25): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (4826,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (4920,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4932,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4948,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (4952,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (4974,28): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (4995,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (5014,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (5018,25): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5022,25): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5042,21): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5057,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (5175,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5190,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (5196,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (5200,17): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5206,17): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5217,28): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5259,28): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5274,32): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (5285,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5290,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5294,21): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5451,25): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (5459,25): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (5469,36): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (5474,36): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (5479,25): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5484,29): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5505,36): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (5510,36): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (5588,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (5597,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (5605,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (5670,25): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5675,36): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (5680,36): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (5686,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (5697,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (5703,22): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5727,22): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5739,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5755,22): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5785,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (5802,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5825,22): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (5844,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5852,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5861,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5869,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (5894,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5942,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5947,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5952,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5956,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5978,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5986,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (5994,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6003,25): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (6014,36): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6036,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6049,32): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (6050,21): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (6051,26): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (6060,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6061,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6071,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6072,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6079,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6106,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6107,24): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6111,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6112,24): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6113,28): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (6123,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (6133,25): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6134,43): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6154,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6166,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6170,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6179,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6180,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6185,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6186,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6217,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (6249,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (6398,25): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (6407,29): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (6411,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (6418,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (6420,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (6426,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (6469,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (6491,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (6501,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (6515,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (6533,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (6563,28): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (6679,21): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (6691,25): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (6872,29): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (6882,29): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (6889,25): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (6918,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (6922,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (7102,17): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (7106,21): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (7114,22): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (7115,17): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (7253,30): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (7312,29): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (7461,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (7484,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (7493,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (7503,17): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (7527,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (7531,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (7547,21): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (7582,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (7590,25): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (7603,28): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (7657,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (7668,25): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (7692,33): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (7705,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (7706,17): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (7768,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (7774,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (7786,28): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (7788,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (7842,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (7843,26): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (7853,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (7860,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (7861,26): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (7874,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (7878,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (7885,26): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (7908,30): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (7912,29): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (7916,33): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (7924,17): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (7928,22): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (7955,25): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (8012,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (8024,25): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (8045,29): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (8061,29): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (8083,36): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (8084,25): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (8088,29): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (8112,29): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (8116,17): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (8120,21): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (8130,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (8135,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (8159,25): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (8223,29): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (8234,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (8242,29): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (8246,25): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (8250,29): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (8264,43): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (8298,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (8299,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (8300,30): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (8310,29): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (8351,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (8364,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (8391,25): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (8397,25): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (8421,28): run-time error CSS1039: Token not allowed after unary operator: '-main-bg-color' (8438,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (8536,25): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (8541,25): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (9045,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (9050,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (9055,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (9076,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (9080,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (9163,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (9177,25): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (9191,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (9235,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (9241,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (9249,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (9281,25): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (9311,28): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (9383,40): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (9409,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (9475,28): run-time error CSS1039: Token not allowed after unary operator: '-main-appareance-background-image' (9489,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (9494,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (9504,17): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (9509,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (9514,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (9542,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (9560,36): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (9574,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (9603,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (9629,28): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (9658,21): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (9662,25): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (9667,25): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (9671,25): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (9720,37): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (9725,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (9729,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (9830,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (9839,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-color' (9873,17): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (10071,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (10142,25): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (10380,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (10381,32): run-time error CSS1039: Token not allowed after unary operator: '-main-white-color' (10385,21): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (10576,32): run-time error CSS1039: Token not allowed after unary operator: '-main-black-color' (10618,33): run-time error CSS1039: Token not allowed after unary operator: '-main-gray-light-color' (10671,32): run-time error CSS1039: Token not allowed after unary operator: '-main-color' (10672,21): run-time error CSS1039: Token not allowed after unary operator: '-main-color' */ .productDescription ul { font-size: 14px !important; margin-left: 10px; } .productDescription ul li { margin-left: 10px; list-style-type: circle; } .shop-item .inline-group { max-width: 9rem; padding: .5rem; } .shop-item .inline-group .form-control { text-align: right; } .shop-item .form-control[type="number"]::-webkit-inner-spin-button, .shop-item .form-control[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .shop-item { background: none !important; padding: 14px !important; position: relative; padding-bottom: 120px !important; } .shop-item .section { background: #fff; border-radius: 10px; padding: 20px; margin-bottom: 15px; } .shop-item .section a i, .shop-item .section a i:before { color: var(--main-color); } .shop-item .section i, .shop-item .section strong i:before { font-weight: 900; } .shop-item .btnAddCartCont { bottom: 14px; display: block; margin-left: auto; } .shop-item .btnAddCartCont button { height: 50px !important; margin-right: auto; display: block; } /* .shop-item .productVersion { display:flex; align-items:flex-start; }*/ .shop-item .Shipping.section, .shop-item .Payments.section { min-height: 130px; } .donativeInput { max-width: 150px; } .productVersion .picturesContainer { display: block; } .productVersion .picturesContainer img { width: 290px; margin:auto; display:block; } .Details.section .dataContainer .name, .Details.section .dataContainer .priceCont { font-weight: 600 !important; font-size: 20px; } .Details.section .dataContainer .priceCont { color: var(--main-color); } .shop-item .productVersion .versions { width: 100%; display: flex; justify-content: center; align-items: center; margin: 15px 0; height: 25px; } .shop-item .productVersion .versions .color { width: 25px; height: 25px; border-radius: 50%; cursor: pointer; transition: transform .2s; } .shop-item .productVersion .versions .color:hover { transform: scale(1.2); } .shop-item .dropdown.size { height: 54px; } .shop-item .addToCart, .shop-item .customize { margin-right: auto; display: block; min-height: 50px; min-width: 250px; } .shop-item .Product .versions { width: 100%; display: flex; justify-content: center; align-items: center; margin: 15px 0; height: 25px; } .shop-item .Product .versions .color { width: 25px; height: 25px; border-radius: 50%; cursor: pointer; transition: transform .2s; } .shop-item .Product .versions .color:hover { transform: scale(1.2); } .shop-item .form-group input.active { opacity: 1; border: 2px solid var(--main-color); outline: none; color: #11142D; background-color: #fff; box-shadow: none; } #btnAddCartCont { display: none; width: 100%; } .shop-item .section { background: #fff; border-radius: 10px; padding: 20px; margin-bottom: 15px; } .shop-item .productItem img { width: 100%; max-width: 160px; display: none; margin: auto; } .shop-item .productItem a:first-of-type img { display: block; } .shop-item .productItem .data a { color: var(--main-black-color); cursor: pointer !important; } .shop-item .productItem .price a, .shop-item .productItem .price a:hover { cursor: pointer !important; color: var(--main-color) !important; } .shop-item .productItem .price span { font-size: 25px !important; } .shop-item .productItem .price span i.icon-donation { font-weight: 600; } .shop-item .productItem .price label { margin: 0 !important; } .shop-item .productItem .price h2, .shop-item .productItem .price h3 { display: flex; align-items: center; font-weight: 700 !important; color: var(--main-color); } .shop-item .productItem .versions { width: 100%; display: flex; justify-content: center; align-items: center; margin: 15px 0; height: 25px; } .shop-item .productItem .versions .color { width: 25px; height: 25px; border-radius: 50%; cursor: pointer; transition: transform .2s; } .shop-item .productItem .versions .color:hover { transform: scale(1.2); } .shop-item .productItem .name_product { height: 60px; display: block; } .cartItem img { width: 50px; } .cartItem .quantity, .cartItem .data { padding: 0 10px; } .cartItem .data { overflow: hidden; } .cartItem .quantity { margin-left: auto; } .cartItem .quantity .input-group { margin-top: 24px; width: 90px; } .cartItem.inline-group { max-width: 9rem; padding: .5rem; } .cartItem .inline-group .form-control { text-align: right; } .cartItem .form-control[type="number"]::-webkit-inner-spin-button, .cartItem .form-control[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .cartItem .quantity .btn-outline-secondary, .cartItem .quantity .form-control { padding: 5px; height: 30px; } .cartItem .quantity .form-control { text-align: center; } #CodeModal #code { border-color: var(--main-color) !important; } #Cart .section, #CheckOutSummary .section { width: 100%; background: #fff; border-radius: 10px; padding: 20px; margin-bottom: 15px; } #Cart .section .header, #CheckOutSummary .section .header { display: flex; align-items: center; } #Cart .newItemBtn { margin: 0; margin-left: auto; display: flex; align-items: center; background: none; color: var(--main-black-color); border: none; font-weight: 500; } #Cart .newItemBtn i, #Cart .newItemBtn i:before { color: var(--main-black-color); margin-right: 3px; font-weight: 500; } #Cart .cardContainer { width: 100%; position: relative; margin-top: 15px; } #Cart .cardContainer .loader { min-height: 200px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(255,255,255,0.7); } #Cart .payment .cardContainer .loader { min-height: 120px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(255,255,255,0.7); } #Cart .cardContainer .card-carrousel { display: flex; justify-content: flex-start; align-items: center; padding: 10px 0; overflow-x: scroll; } #Cart .cardContainer .card { padding: 10px; border-radius: 10px; margin-right: 10px; width: 200px; min-width: 200px; height: 200px; border-width: 2px; } #Cart .shipping .cardContainer .card { height: 150px; } #Cart .payment .cardContainer .card { height: 145px; cursor: pointer; } #Cart .product .cardContainer .card { height: 120px; cursor: pointer; } #Cart .cardContainer .card.active { border-color: var(--main-color); } #Cart .cardContainer .card p, #Cart .cardContainer .card h4 { text-align: center; text-transform: capitalize; overflow: hidden; cursor: pointer; } #Cart .payment .cardContainer .card { font-size: 12px !important; } #Cart .cardContainer .card p { font-size: 12px !important; } #Cart .payment .cardContainer .card p, #Cart .payment .cardContainer .card h4 { text-align: left; } #Cart .payment .cardContainer .card i, #Cart .payment .cardContainer .card i:before { font-size: 40px; } #Cart .payment .cardContainer .card h4 { font-size: 13px !important; overflow: hidden; } #Cart .cardContainer #list_products.card-carrousel { display: block; } #Cart .cardContainer #list_products.card-carrousel .card { width: 100%; margin-bottom: 10px; display: flex; align-items: flex-start; flex-direction: row; padding: 10px; border: none !important; } #Cart .cardContainer #list_products.card-carrousel .card .picture { width: 60px; } #Cart .cardContainer #list_products .card p, #Cart .cardContainer #list_products .card h4 { text-align: start; } #Cart .cardContainer #list_products.card-carrousel .card .picture img { width: 100%; max-width: 55px; display: block; margin: auto; border-radius: 3px; } #Cart .cardContainer #list_products.card-carrousel .card .data { align-items: flex-start; padding-left: 15px; } #Cart .cardContainer #list_products.card-carrousel .card .data h3 { text-align: start; font-size: 16px !important; } #Cart .cardContainer #list_products.card-carrousel .card .data h4 { text-align: start; font-size: 15px !important; } #Cart .cardContainer #list_products.card-carrousel .card .quantity { display: flex; align-items: center; padding: 16px; margin-left: auto; height: 90px; width: 150px; justify-content: flex-end; } #Cart .cardContainer #list_products.card-carrousel .card .quantity h3 { margin: 0; font-weight: 500 !important; } #Cart .cardContainer #list_products.card-carrousel .card .quantity p { font-size: 14px !important; font-weight: 600 !important; } #OrderConfirm .picture { width: 100%; display: flex; justify-content: center; align-items: center; height: 140px; } #OrderConfirm .picture i, #OrderConfirm .picture i:before { font-size: 70px; color: var(--main-color); } .section p.summaryReport { display: flex; align-items: center; width: 100%; } .section p.summaryReport span, .section p.summaryReport span:before { font-size: 20px; } .CartSummMobile { display: block; } #OrderForm .btn-primary:disabled { opacity: 0.5 !important; } #cartSummaryCheck-count { background-color: #FF754C; color: #fff; border-radius: 50%; width: 20px; height: 20px; font-weight: 500; font-size: 11px; line-height: 16px; text-align: center; padding: 2px; display: flex; justify-content: center; align-items: center; margin-right: 8px; } .loadData { position: absolute; width: 100%; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(255,255,255,0.9); } .PreloadQuest { margin:90px auto auto auto; display:none; } #toggleSummary { display:none; } .card .action_btn { font-size:13px !important; } .card:hover .action_btn { background: var(--main-color); color: #fff; border-radius: 5px; } @media (max-width: 1380px) { #toggleSummary { display: flex; } .CartSummMobile { display: none; } #shimpmentPaymentDetails { padding-bottom: 160px !important; } #CheckOutSummary.partial-preview { position: fixed !important; bottom: 0 !important; height: auto !important; left: 90px !important; right: 0 !important; top: inherit !important; width: calc(100% - 90px) !important; } } @media (max-width: 1024px) { #Cart .cardContainer .card { height: 175px; } .productDescription ul { font-size: 15px !important; } #CheckOutSummary.partial-preview { left: 0 !important; width: 100% !important; } .shop-item .btnAddCartCont { position: fixed; bottom: 14px; width: calc(100% - 29px); } .shop-item .btnAddCartCont button { width: 100%; } .Details.section .dataContainer { margin-top: 30px; } } @media (max-width: 550px) { #Cart .section .header { margin-bottom: 10px; } #Cart .section .header h4 { font-size: 13px; } #Cart .section .header button.newItemBtn { font-size: 13px; } .productDescription ul { font-size: 12px !important; } } user_boxbody, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; } ::-webkit-scrollbar { width: 8px; height: 12px; display: none; } ::-webkit-scrollbar:window-inactive { display: none; } ::-webkit-scrollbar:corner-present { } ::-webkit-scrollbar-track-piece { border-radius: 2px; background-color: rgba(27,29,33,0.3); background-clip: content-box; border-radius: 6px; border: solid 4px transparent; } ::-webkit-scrollbar-track-piece:decrement { background: rgba(108,93,211,0.5); background-clip: content-box; border: solid 4px transparent; } .invisible-scrollbar::-webkit-scrollbar { display: none; } ::-webkit-scrollbar-thumb { height: 10px; width: 4px; background-color: rgba(108,93,211,0.8); border-radius: 6px; box-shadow: 0 3px 6px -2px rgba(51,0,51,0.5); } ::-webkit-scrollbar-corner { background: transparent; } :root { --main-color: #6C5DD3; --main-black-color: #1B1D21; --main-white-color: #fff; --main-gray-color: #76777A; --main-gray-light-color: #B2B3BD; --main-bg-color: #F3F1F8; --main-green-color: #7FBA7A; --main-orange-color: #FF754C; --main-pink-color: #FFA2C0; --main-blue-color: #A0D7E7; } a, a:hover { text-decoration: none !important; } /*body { min-height: 100vh !important; font-family: 'Poppins', sans-serif !important; background-color: #fcfbff !important; width: 100%; height: 100%; position: fixed; overflow-y: scroll; -webkit-overflow-scrolling: touch; }*/ html, body { margin: 0; padding: 0; } html { position: fixed; width: 100%; height: 100vh; overflow: hidden; } body { position: fixed; font-family: 'Poppins', sans-serif !important; background-color: var(--main-bg-color) !important; width: 100%; height: 100vh; overflow: hidden; } table { border-collapse: collapse; border-spacing: 0; } fieldset, img { border: 0; } input { border: 1px solid #b0b0b0; padding: 3px 5px 4px; color: #979797; width: 190px; color: var(--main-color) } address, caption, cite, code, dfn, th, var { font-style: normal; font-weight: normal; } ol, ul { list-style: none; } caption, th { text-align: left; } h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; } h1 { font-weight: 700 !important; font-size: 48px !important; } h2 { font-weight: 500 !important; font-size: 30px !important; } h3 { font-weight: 500 !important; font-size: 24px !important; } h4, h5, h6 { font-weight: 500 !important; font-size: 17px !important; } p { font-weight: 400 !important; font-size: 0.83rem !important; } q:before, q:after { content: ''; } abbr, acronym { border: 0; } #side-bar { position: fixed; width: 256px; height: 100%; left: 0px; top: 0px; background: var(--main-black-color); overflow: scroll; z-index: 10; transition: width 0.8s; } #side-bar .logo-cont { width: 256px; height: 160px; display: flex; justify-content: center; align-items: center; } #side-bar .logo-cont img { width: 88px; } #side-bar .menu { width: 100%; } #side-bar .menu .item { cursor: pointer; position: relative; min-height: 55px; padding: 0px 40px; } #side-bar .menu .item { border-left: 5px solid var(--main-black-color); } #side-bar .menu .item.active { border-left: 5px solid var(--main-color); } #side-bar .menu .item a { font-family: Poppins; font-style: normal; font-weight: 500; font-size: 14px; line-height: 18px; color: var(--main-gray-color); padding: 15px 0px; text-decoration: none; display: flex; justify-content: flex-start; align-items: center; } #side-bar .menu .item i, #side-bar .menu .item i:before, #side-bar .logout-cont a i, #side-bar .logout-cont a i:before { margin-right: 18px; font-size: 20px; color: var(--main-gray-color); } #side-bar .menu .item.active, #side-bar .menu .item.active i, #side-bar .menu .item.active i:before, #side-bar .menu .item.active .sub-btn, #side-bar .menu .item.active a { color: var(--main-white-color) !important; } #side-bar .menu .sub-menu { display: none; } #side-bar .menu .sub-btn { position: relative; } #side-bar .menu .item a .dropdown { position: absolute; right: 0; margin: 3px 0px; transition: 0.3s ease; } #side-bar .menu .item .sub-menu a { padding-left: 76px; } .dropdown { font-size: 12px !important; } #side-bar .card-cont { width: 256px; margin-top: 60px; padding: 0px 40px; margin-bottom: 100px; } #side-bar .card-cont .card { background: none !important; mix-blend-mode: normal; border-radius: 16px; } #side-bar .card-cont a { width: 100% !important; margin-top: 15px; display: flex; justify-content: center; align-items: center; text-align: center; } #side-bar .card-cont .card img { /*width: 100% !important; border-radius: 14px;*/ width: 105% !important; border-radius: 14px; margin-bottom: -6px; margin-left: -4px; margin-top: -5px; } #side-bar .logout-cont { width: 100%; padding: 0px 40px; } #side-bar .logout-cont a { font-family: Poppins; font-style: normal; font-weight: 500; font-size: 14px; line-height: 20px; color: var(--main-white-color); padding: 15px 0px; display: flex; } #side-bar.tiny { width: 90px; } #side-bar.tiny.active { width: 256px; } #side-bar.tiny.active .logo-cont { display: flex; height: 80px; } #side-bar.tiny .card-cont { display: none; } #side-bar.tiny.active .card-cont { display: block; } #side-bar.tiny .logout-cont label { display: none; } #side-bar.tiny.active .logout-cont label { display: flex; } #side-bar.tiny .menu .item { padding: 0px; left: 36px; } #side-bar.tiny.active .menu .item { padding: 0px 40px; left: inherit; } #side-bar.tiny #burger-menu { display: block; width: 100%; height: 30px; display: flex; justify-content: center; align-items: center; cursor: pointer; } #side-bar.tiny #burger-menu img { width: 40px; } #side-bar.tiny .menu .item.active { left: 0; } #side-bar.tiny .menu .item.active i { padding-left: 35px; } #side-bar.tiny .logo-cont { display: none; } #burger-menu-top { display: none; } .rotate { transform: rotate(90deg) } #body-content { position: absolute; width: calc(100% - 256px); height: auto; min-height: calc(100vh - 90px); left: 256px; top: 90px; } #body-content.tiny { left: 90px; width: calc(100% - 90px); } .partial-body { width: calc(100% - 426px); padding: 20px; border-right: 1px solid #E4E4E4; height: calc(100vh - 90px); min-height: calc(100vh - 90px); overflow-x: hidden; overflow-y: scroll; padding-bottom: 150px; } /*#body-content.withFullTopBar .partial-body { width: calc(100% - 426px); padding: 45px; padding-top: 10px; border-right: 1px solid #E4E4E4; }*/ /*.partial-body h2 { font-size: 48px !important; }*/ /*.partial-body h5 { font-size: 24px !important; }*/ #notifications-tab { padding: 10px; width: 425px; display: flex; justify-content: center; align-items: center; position: fixed; right: 0px; /*z-index: 99;*/ } #notifications-tab.active { position: relative !important; float: right; height: 100%; } #search_box { width: calc(100% - 425px); height: 100%; float: left; } #full-top-bar { position: fixed; width: calc(100% - 256px); height: 90px; left: 256px; top: 0px; -webkit-box-shadow: -1px 7px 9px -2px rgba(0,0,0,0.12); box-shadow: -1px 7px 9px -2px rgba(0,0,0,0.12); background-color: var(--main-white-color); z-index: 3; } #full-top-bar.tiny { width: calc(100% - 90px); left: 90px; } .route-tab { width: calc(100% - 681px); display: flex; justify-content: center; align-items: center; } .route-tab nav { width: 100%; } .route-tab .breadcrumb { background: none; margin: 0; padding: 0; } .route-tab .breadcrumb-item a { font-size: 22px; font-weight: 500; line-height: 1.2; color: var(--main-black-color); } .route-tab .breadcrumb-item a:hover { color: var(--main-color); } .partial-preview { width: 425px; height: 100%; position: fixed; right: 0px; top: 90px; transition: width 0.8s; } #cart-preview { width: 0; top: 90px; height: calc(100 - 70px); max-width: 425px; background-color: #fcfbff !important; overflow: scroll; z-index: 2; } #cart-preview.partial-preview.active { width: 425px; } .profile-data.media a { width: 40px; border-radius: 50%; margin: auto; } .profile-data.media a img { width: 40px; border-radius: 50%; margin: auto; } .profile-data.media .media-body { margin: auto; } .profile-data.media h5 { /*font-family: Poppins; font-style: normal; font-weight: 500; font-size: 14px;*/ line-height: 20px; color: var(--main-black-color); margin: 0; margin-bottom: 5px; padding-left: 16px; max-width: 200px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .profile-data.media p { /*font-family: Poppins; font-style: normal; font-weight: normal; font-size: 12px; line-height: 20px;*/ color: rgba(27, 29, 33, 0.8); padding-left: 16px; margin: 0 } .cart-container-partial { overflow: scroll; height: 100vh; width: 425PX; } .cart-container-partial .form-group { margin: 0; } .notification-cont button, .cart-cont button { width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; background: #fff; -webkit-box-shadow: 7px 11px 15px -7px #d0d3d8; box-shadow: 7px 11px 15px -7px #d0d3d8; border-radius: 50%; margin: 0; margin-left: 30px; position: relative; background: none; padding: 0; border: none; } .notification-cont button.active { background: var(--main-color); } .notification-cont button.active i, .notification-cont button.active i:before { color: #fff; } .notification-cont button i, .cart-cont button i { font-size: 25px; position: relative; font-style: normal !important; } .notification-cont button span, .cart-cont button span { position: absolute; top: 0; right: 0; background-color: #FF754C; color: #fff; border-radius: 50%; min-width: 16px; min-height: 16px; height: 100%; width: 100%; max-height: 20px; max-width: 20px; font-weight: 500; font-size: 11px; line-height: 16px; text-align: center; padding: 2px; display: flex; justify-content: center; align-items: center; } #profile-preview-cont { width: 100%; display: flex; justify-content: center; overflow: scroll; } #profile-preview { margin: auto; width: 283px; height: 566px; background: #F6F5FF; border: 10px solid var(--main-black-color); box-sizing: border-box; border-radius: 40px; flex: none; order: 0; flex-grow: 0; margin: 25px 0px; overflow: scroll; } .gray-font { color: rgba(27, 29, 33, 0.7); } #nav-content { width: 100%; } #nav-content .nav-link h4 { line-height: 20px; color: var(--main-gray-color); background: none; border: none; } #nav-content .nav-link h4 i, #nav-content .nav-link h4 i:before { color: var(--main-gray-color) !important; font-size: 18px; } #nav-content .nav-link.active h4 { color: var(--main-color); font-weight: 600 !important; border-bottom: 2px solid var(--main-color); padding-bottom: 5px; } #nav-content .nav-link.active h4 i, #nav-content .nav-link.active h4 i:before { color: var(--main-color) !important; font-size: 18px; } .chat #nav-content .nav-link h4, .chat #nav-content .nav-link h4 { font-size: 14px !important; margin: 0 !important; } /*#contenido h5, #seo h5 { font-size: 20px !important; margin: 0; }*/ .content-info { width: 100%; background: none; padding: 0; margin: 0; border: none; } .content-info .media { width: 100%; border-radius: 15px; padding: 15px; border: 1px solid var(--main-color); background: var(--main-white-color); display: flex; justify-content: center; align-items: center; } .content-info .media img { width: 63px; margin: 15px 30px 15px 30px; } .content-info .media p { margin: 0; text-align: left; } .content-info .media h6 { text-align: left; } .content-info .completed { border-radius: 8px; width: 37px; height: 37px; background-color: #fff; display: flex; justify-content: center; align-items: center; color: #fff; } .content-info .completed.active { background-color: var(--main-color); } .content-info .icon-Angle-right, .content-info .icon-Angle-right:before { color: var(--main-black-color); } .custom-link-info { width: 40%; border-radius: 15px; padding: 15px; border: 1px solid var(--main-color); background: none; } .custom-link-info p { margin: 0; color: rgba(27, 29, 33, 0.5); text-align: start; } .custom-link-info .bold { font-family: Poppins; font-style: normal; font-weight: normal; font-size: 18px; line-height: 20px; color: rgba(27, 29, 33, 0.6); } .custom-link-info i, .custom-link-info i:before { font-size: 45px; color: var(--main-color); } #ListSocialLinks { padding: 0px 16px; } #ListSocialLinks p { line-height: 18px; color: rgba(27, 29, 33, 0.5); } #ListSocialLinks .item-link { display: inline-block; } #ListSocialLinks .item-link button { background: none; border: none; padding: 0; } #ListSocialLinks .item-link img { width: 35px; height: 35px } .qr-preview { background-color: #fff; border-radius: 26px; padding: 16px; margin: 15px 0px; } .link-preview, .form-preview { background-color: #fff; border-radius: 26px; padding: 16px; margin: 15px 0px; } .form-group { width: 100%; margin: 10px 0px; } .form-group label { font-family: Poppins; font-style: normal; font-weight: 500; font-size: 0.8rem; line-height: 16px; color: var(--main-gray-light-color); } .form-group input:not(input[type="radio"]), .form-group textarea, .form-group select { width: 100%; font-family: Poppins; font-style: normal; font-weight: 500; font-size: 0.83rem; line-height: 20px; color: #11142D; background: rgba(228, 228, 228,0.4); border-radius: 8px; min-height: 40px; padding: 10px; border: 2px solid transparent; } #form-schedule-link .form-group input, #form-schedule-link .form-group textarea, #form-schedule-link .form-group select { background: rgba(228, 228, 228,0.3) !important; } .form-group input::placeholder, .form-group textarea::placeholder { color: var(--main-gray-light-color); } .form-group input:focus, .form .form-group input:active { opacity: 1; border: 2px solid var(--main-color) !important; outline: none; color: #11142D !important; background-color: #fff !important; box-shadow: none; } .form-group textarea:focus, .form .form-group textarea:active { opacity: 1; border: 2px solid var(--main-color); outline: none; color: #11142D; background-color: #fff; } .form-group .media { display: flex; justify-content: center; align-items: center; } .form-group .media img { width: 50px; } #content-frame .form-group textarea { background: var(--main-white-color); border: 1px solid var(--main-color); } #seo-form p { letter-spacing: 0px; text-align: left; } #seo-form p a, #seo-form p a:hover { color: var(--main-color); } #btn-save-link, #btn-update-link, #btn-save-social-link, #btn-update-social-link { width: 100%; height: 50px; } /*Links*/ #LinkList .linkItem { display: flex; justify-content: start; align-items: center; } #LinkList .linkItem .handlebtn { cursor: pointer; border-radius: 5px; cursor: pointer; padding: 5px; color: var(--main-gray-color); border: 1px solid var(--main-gray-light-color); border-top-right-radius: 0; border-bottom-right-radius: 0; background-color: #fff; border-right: 0; width: 30px; height: 100%; } #LinkList .linkItem .handlebtn i { letter-spacing: -7px; } #LinkList .linkItem .info { border: 1px solid var(--main-gray-light-color); border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #fff; width: calc(100% - 30px); height: 100%; display: flex; align-items: flex-start; justify-content: flex-start; } #LinkList .linkItem .header .icon img { width: 55px; height: 55px; border-radius: 50%; margin-top: auto; margin-bottom: auto; border: 1px solid var(--main-gray-light-color); } #LinkList .linkItem .btn-option a:hover { color: var(--main-gray-color); } #LinkList .linkItem .btn-option a i, #LinkList .linkItem .btn-option a i:before { color: var(--main-gray-color); } #LinkList .linkItem .header { display: flex; align-items: center; justify-content: start; } #LinkList .linkItem .header { display: flex; align-items: center; justify-content: start; width: calc(100% - 25px); } #LinkList .linkItem .btn-option { width: 25px; display: flex; justify-content: flex-end; flex-flow: column; } #LinkList .linkItem .btn-option .switch-cont { margin-top: auto; } #LinkList .linkItem .header .name { width: 100%; overflow: hidden; } #LinkList .linkItem .header span { font-size: 0.83rem !important; } #LinkList .linkItem .listFunctions { display: flex; justify-content: flex-start; width: 100%; margin-top: 10px; } #LinkList .linkItem .listFunctions .switch { width: 37px; height: 21px; } #LinkList .linkItem .listFunctions .switch .slider:before { position: absolute; content: ""; height: 16px; width: 16px; left: 4px; bottom: 2px; } #LinkList .linkItem .listFunctions a { text-decoration: none; cursor: pointer; } #LinkList .linkItem .listFunctions a i, #LinkList .linkItem .listFunctions a i:before { color: var(--main-gray-light-color); margin-right: 6px; font-size: 1.3rem; } #LinkList .linkItem .listFunctions a.active i, #LinkList .linkItem .listFunctions a.active i:before { color: var(--main-color); } #LinkList .linkItem .header p { width: 100%; height: 1.4em; font-size: 0.83rem !important; display: inline-block; overflow: hidden !important; text-overflow: ellipsis; } #LinkList .linkItem .header h4 { width: 100%; height: 1.4em; display: inline-block; overflow: hidden !important; text-overflow: ellipsis; white-space: nowrap; margin: 0 !important; font-size: 0.9rem !important; } /*End Links*/ /*Phone Preview*/ #container { padding: 10px; } #container #data-title { font-size: 14px !important; } #container #data-bio { font-size: 11px !important; } #data-vcard a { font-size: 10px !important; } /*.link-text p, .form-q p { font-size: 10px !important; }*/ #container #data-social-links a { width: 35px !important; height: 35px !important; } .link-text img, .form-q img { width: 25px !important; height: 25px !important; } #container #data-links .link-container, #container .form-q { min-height: 45px !important; } #container #data-photo img { width: 110px !important; } #container .share i, #container .share i:before { font-size: 12px !important; } #container #data-name { font-size: 21px !important; } .share-btn { font-size: 15px !important; } .icon-social { font-size: 25px !important; } a.link-ico img { width: 30px !important; } /*End Phone Preview*/ /*Bootstrap*/ .tooltip-inner { border-radius: 10px !important; } .modal-content { border-radius: 15px !important; background-color: var(--main-white-color) !important; } .close-modal { width: 35px; height: 35px; display: flex; justify-content: center; align-items: center; background: #fff; -webkit-box-shadow: 1px 5px 24px 1px #d0d3d8; box-shadow: 1px 5px 24px 1px #d0d3d8; border-radius: 50%; position: absolute; top: -15px; right: 0; } .close-modal button { width: 35px; height: 35px; display: flex; justify-content: center; align-items: center; background: none; } .close-modal button span { display: flex; justify-content: center; align-items: center; } .btn-clean { border: none !important; outline: none; font-weight: 500 !important; font-size: 0.83rem !important; box-shadow: none; padding: 10px 13px; cursor: pointer; opacity: 0.9; color: var(--main-black-color); background: none; border: none; outline: none; } .btn-primary { background: var(--main-color) !important; border-radius: 12px !important; color: #fff !important; border: none !important; outline: none; font-weight: 500 !important; font-size: 0.83rem !important; box-shadow: none; padding: 10px 13px; cursor: pointer; opacity: 0.9; } .btn-primary:hover { opacity: 1; } .btn-primary:active, .btn-primary:focus { outline: none !important; opacity: 1; box-shadow: none !important; } .btn-primary:disabled, .btn-secondary:disabled, .btn-third:disabled { opacity: 0.8 !important; } .btn-secondary { font-weight: 500 !important; font-size: 0.83rem !important; text-align: center; background: none !important; border: none; outline: none; box-shadow: none; padding: 10px 13px; cursor: pointer; opacity: 0.9; color: var(--main-color) !important; } .btn-secondary:hover { opacity: 1; } .btn-secondary:active, .btn-secondary:focus { outline: none !important; box-shadow: none !important; } .btn-third { font-weight: 500 !important; font-size: 0.83rem !important; text-align: center; color: #fff !important; border: none; outline: none; box-shadow: none; padding: 10px 13px; cursor: pointer; opacity: 0.9; background: var(--main-black-color); border-radius: 12px !important; } .btn-third:hover { opacity: 1; } .btn_options-requests .btn-third { font-weight: 500 !important; line-height: 20px !important; text-align: center !important; padding: 10px 15px !important; height: 40px; } .btn_options-requests .btn-third { font-family: Poppins !important; font-style: normal !important; font-size: 12px !important; font-weight: 500 !important; line-height: 20px !important; text-align: center !important; padding: 10px 15px !important; height: 40px; } .btn-third:active, .btn-third:focus { outline: none !important; box-shadow: none !important; } .btn-delete { background: #FFA4C0 !important; border-radius: 12px !important; font-family: Poppins; font-style: normal; font-weight: 500; font-size: 0.83rem !important; line-height: 20px; text-align: center; color: #29000D !important; outline: none; box-shadow: none; border: none; padding: 8px; cursor: pointer; } .btn-delete-outline { background: none !important; border-radius: 12px !important; font-family: Poppins; font-style: normal; font-weight: bold; font-size: 0.83rem !important; line-height: 20px; text-align: center; color: #D9557D !important; outline: none; box-shadow: none; border: none; padding: 8px; text-align: center; height: 50px; cursor: pointer; } .btn-white { font-family: Poppins; font-style: normal; font-weight: bold; font-size: 0.83rem !important; line-height: 20px; text-align: center; color: #11142D !important; outline: none; border: none; padding: 5px 15px; height: 56px; background: var(--main-white-color); box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.250929); border-radius: 12px; cursor: pointer; } .btn-file { cursor: pointer; margin-bottom: 0 !important; } .center { display: flex; justify-content: center; align-items: center; } .popover { max-width: 300px !important; padding: 16px !important; background: var(--main-white-color) !important; border-radius: 6px !important; } .popover-header { color: var(--main-black-color) !important; border-bottom: 0 !important; background-color: transparent !important; border-top-left-radius: 6px !important; border-top-right-radius: 6px !important; padding: 0px !important; padding-bottom: 12px !important; } .popover-body { padding: 0 !important; } /*End bootstrap*/ .banner-info-purple { width: 100%; max-width: 900px; background: var(--main-color); border-radius: 24px !important; padding: 38px; margin: 30px 0px; } .banner-info-purple h3 { line-height: 60px; color: #fff; } .banner-info-purple p { line-height: 24px; color: #fff; } .analytics-cont { width: 100%; background-color: var(--main-white-color); border-radius: 24px; border: 1px solid rgba(0,0,0,0.1); padding: 30px; margin: 15px 0px; -webkit-box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.25); box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.25); } .analytics-cont h6 { line-height: 24px; color: #20212C; } .dashboard-data { width: 100%; border: 1px solid rgba(89, 85, 216,0.12); padding: 20px 18px; border-radius: 26px; display: flex; justify-content: center; align-items: center; } .dashboard-data .divider { width: 1px; height: auto; border: 1px solid rgba(89, 85, 216, 0.12); } .dashboard-data .item .info { font-style: normal; font-weight: 500; font-size: 12px; line-height: 16px; color: #808191; display: flex; justify-content: center; align-items: center; } .dashboard-data .item .info img { width: 16px; margin-right: 5px; } .dashboard-data .item .data { font-style: normal; font-weight: 600; font-size: 40px; line-height: 60px; letter-spacing: -1px; color: #11142D; text-align: center; } .dashboard-data .item .border .col-6:first-of-type { border-bottom: 2px solid; } .dashboard-data .item .border .col-6:last-of-type { border-bottom: 2px solid; opacity: 0.3; } .table-me { width: 100%; border-collapse: collapse !important; } .table-me tbody { padding-right: 10px; } .table-me td { border: 1px solid #EBEBFA; word-wrap: break-word; max-width: 300px; text-transform: capitalize; } .table-me tr:first-child td { border-top: 0 !important; text-transform: capitalize; } .table-me tr td { border-left: 0 !important; text-transform: capitalize; } .table-me tr:last-child td { border-bottom: 0 !important; } .table-me tr td { border-right: 0 !important; text-transform: capitalize; } .table-me tr > td { padding: 16px 0 !important; } .table-me th { background: none; font-family: Poppins; font-style: normal; font-weight: 500; font-size: 13px; line-height: 18px; color: var(--main-gray-light-color); padding: 20px 0px; text-transform: capitalize; } .table-me td h6 { line-height: 24px; color: var(--main-black-color); margin: 0; } .table-me td p { /*font-family: Poppins; font-style: normal; font-weight: normal; font-size: 14px; line-height: 17px;*/ color: rgba(27, 29, 33, 0.7); margin: 0; } .table-me td img { width: 30px; margin: auto; } .table-me td.info { text-align: center; } .notification-item { width: 100%; margin: 10px 0; display: block; position: relative } .notification-item.inactive { height: 1px; overflow: hidden; } .notification-item .ico { width: 43px; height: 50px; display: flex; justify-content: flex-start; align-items: center; } .notification-item i, .notification-item i:before { font-size: 25px; color: var(--main-color); display: block; margin-right: auto; font-style: normal !important; } .notification-item p { width: 100%; /*font-family: Poppins; font-style: normal; font-weight: normal; font-size: 14px;*/ line-height: 14px; color: var(--main-black-color); margin: 0; } .notification-item small { font-family: Poppins; font-style: normal; font-size: 11px; color: var(--main-gray-color); margin-left: auto; display: block; width: fit-content; } .theme-item { cursor: pointer; border-radius: 15px; padding: 10px !important; } .theme-item div { height: 180px; border-radius: 8px; background-position: center center; background-size: cover; background-repeat: no-repeat; -webkit-transition: width 1s; -moz-transition: width 1s; -o-transition: width 1s; transition: width 1s; } .theme-item p { /*font-family: Poppins; font-style: normal; font-weight: normal; font-size: 16px; line-height: 20px;*/ color: #1D1F26; text-align: center; } .bio-align, .btn-align { cursor: pointer; } .bio-align .cont, .btn-align .cont { display: flex; justify-content: center; align-items: center; border-radius: 8px; opacity: 0.5; margin-left: auto; margin-right: auto; } .bio-align span, .btn-align span { font-size: 55px; } .bio-align.active .cont, .btn-align.active .cont { opacity: 1; } .bio-align p, .btn-align p { margin: 0; /*font-family: Poppins; font-style: normal; font-weight: normal; font-size: 16px;*/ line-height: 20px; color: #1D1F26; text-align: center; margin-top: 10px; } .colorpicker { cursor: pointer; padding: 0px !important; margin: 10px 10px 10px 0; border-radius: 8px; width: 55px; height: 55px; border: 1px solid var(--main-gray-light-color); border-radius: 50% } /*.colorpicker:read-only { display:none; }*/ .btn-color-item { /*margin: 10px 40px 10px 0;*/ width: 70px; } .btn-color-item label { width: 100%; text-align: center; } .btn-form-cont { margin-right: 40px; cursor: pointer; position: relative; } .btn-form-item { padding: 4px; border: 2px solid transparent; } .btn-form-item.active { padding: 4px; border: 2px solid var(--main-color); } .btn-form-item i { display: none; } .btn-form-item i, .btn-form-item i:before { position: absolute; top: 15px; left: calc(50% - 4px); color: #fff; } .btn-form-item.active i { display: block } .btn-form-cont p { text-align: center; } .btn-form { width: 150px; height: 50px; background: #EAE8F6; } .btn-form-item .btn-form.active { background: var(--main-color) !important; } .btn-type-cont { margin-right: 40px; cursor: pointer; position: relative; } .btn-type-item i { display: none; } .btn-type-item i, .btn-type-item i:before { position: absolute; top: 15px; left: calc(50% - 4px); color: var(--main-color); } .btn-type-item.active i { display: block } .btn-type-cont p { text-align: center; } .btn-type { width: 150px; height: 50px; background: #EAE8F6 !important; } .btn-border.btn-type { border-color: #EAE8F6 !important; } .btn-sombra.btn-type { box-shadow: 0px 7px 16px #EAE8F6 !important; } .btn-type-item { border: 1px solid #EAE8F7; border-radius: 8px; } .color-item { min-width: 55px; min-height: 55px; max-width: 55px; max-height: 55px; border-radius: 8px; cursor: pointer; display: flex; } .gallery-item { background-position: center center; background-size: cover; border-radius: 15px; width: 110px; display: block; margin: auto; } .font-item { width: 69px; cursor: pointer; } .font-item .cont { width: 69px; height: 69px; border: 1px solid #DFDEFF; border-radius: 8px; display: flex; justify-content: center; align-items: center; margin-bottom: 10px; margin-left: auto; margin-right: auto; } .font-item .cont span, .font-item .cont span:before { font-size: 30px; color: #1D1F26; } .font-item.active .cont span, .font-item.active .cont span:before { color: #fff; } .font-item p { /*font-family: Poppins; font-style: normal; font-weight: normal; font-size: 16px;*/ line-height: 20px; color: #1D1F26; text-align: center; } .font-item.active .cont { background-color: var(--main-color); } .layout-item { width: 100px; height: auto; box-sizing: border-box; border-radius: 15.8304px; display: flex; justify-content: center; align-items: center; margin: auto; cursor: pointer; border: 3.9576px solid transparent; } .layout-item.active { border: 3.9576px solid var(--main-color); width: 105px; } .layout-item .cont { width: 100%; height: auto; border-radius: 15.8304px; display: flex; justify-content: center; align-items: center; } .layout-item img { width: 100px; height: 200px; border-radius: 15.8304px; } .tab-container { margin-bottom: 40px; box-shadow: 2px 3px 6px 0px #616161; padding: 20px 20px; border-radius: 15px; background: #fff; } .config .tab-container { overflow-y: scroll; height: 440px; } .tab-container.diseno { border: 1px solid var(--main-color); padding: 15px; border-radius: 15px; } .tab-container p { /*font-family: Poppins; font-style: normal; font-weight: normal; font-size: 16px;*/ line-height: 18px; color: rgba(27, 29, 33, 0.7); } .tab-container .btn-color-item p { text-align: center; } .tab-container h6 { margin-bottom: 20px; } .tab-container .row { margin: 1rem 0 !important; } .custom-bakcground-color { width: 70px; height: 70px; border-radius: 8px; background-position: center center; border: none; background-size: cover; background-repeat: no-repeat; -webkit-transition: width 1s; -moz-transition: width 1s; -o-transition: width 1s; transition: width 1s; opacity: 0.4; } .custom-bakcground-color.active { opacity: 1; } .link-preview, .form-preview { display: flex; justify-content: center; align-items: center; padding: 10px; background: var(--main-white-color); width: 100%; height: 250px; } .form-preview { height: 180px; } .link-preview .media, .form-preview .media { width: 100%; padding: 15px 20px; box-shadow: 0px 7px 32px rgba(56, 56, 63, 0.1); border-radius: 8px; background: var(--main-white-color); } .link-preview .media .media-body, .form-preview .media .media-body { width: calc(100% - 57px); min-height: 60px; } .link-preview .media img, .form-preview .media img { width: 37px; margin: auto; margin-right: 20px; } .link-preview .media .media-body h5, .form-preview .media .media-body h5 { width: 100%; /*font-family: Poppins; font-style: normal; font-weight: 600; font-size: 16px !important;*/ line-height: 24px; color: var(--main-black-color); margin-bottom: 5px; white-space: nowrap; overflow: hidden; } .link-preview .media .media-body p, .form-preview .media .media-body p { /*font-family: Poppins; font-style: normal; font-weight: normal; font-size: 14px !important;*/ line-height: 17px; color: rgba(27, 29, 33, 0.7); overflow: hidden; margin: 0; white-space: nowrap; overflow: hidden; } .social-link-preview { display: flex; justify-content: center; align-items: center; padding: 10px; background: var(--main-white-color); width: 100%; height: 150px; border-radius: 26px; margin: 15px 0; } .social-link-preview .media { width: 100%; padding: 15px 20px; box-shadow: 0px 7px 32px rgba(56, 56, 63, 0.1); border-radius: 8px; background: var(--main-white-color); } .social-link-preview .media .media-body { width: calc(100% - 57px); min-height: 60px; } .social-link-preview .media img { width: 37px; margin: auto; margin-right: 20px; } .social-link-preview .media .media-body h5 { width: 100%; /*font-family: Poppins; font-style: normal; font-weight: 600; font-size: 16px !important;*/ line-height: 24px; color: var(--main-black-color); margin-bottom: 5px; white-space: nowrap; overflow: hidden; } .social-link-preview .media .media-body p { /*font-family: Poppins; font-style: normal; font-weight: normal; font-size: 14px !important;*/ line-height: 17px; color: rgba(27, 29, 33, 0.7); overflow: hidden; margin: 0; white-space: nowrap; overflow: hidden; } .cr-slider { margin: auto; -webkit-appearance: none; position: relative; overflow: hidden; height: 10px !important; cursor: pointer; border-radius: 15px; } .cr-slider::-webkit-slider-runnable-track { background: #ddd; } /* * 1. Set to 0 width and remove border for a slider without a thumb */ .cr-slider::-webkit-slider-thumb { -webkit-appearance: none !important; appearance: none !important; width: 20px !important; /* 1 */ height: 40px !important; box-shadow: -100vw 0 0 100vw var(--main-color) !important; background-color: var(--main-color) !important; } .cr-slider::-moz-range-track { height: 40px !important; background-color: var(--main-color) !important; } .cr-slider::-moz-range-thumb { background: #fff; height: 40px; width: 20px; box-shadow: -100vw 0 0 100vw var(--main-color) !important; box-sizing: border-box; } .cr-slider::-ms-fill-lower { background: var(--main-color); } .cr-slider::-ms-thumb { background: #fff; border: 2px solid #999; height: 40px; width: 20px; box-sizing: border-box; } .cr-slider::-ms-ticks-after { display: none; } .cr-slider::-ms-ticks-before { display: none; } .cr-slider::-ms-track { background: var(--main-color); color: var(--main-gray-light-color); height: 40px; border: none; } .cr-slider::-ms-tooltip { display: none; } #prev-icon-show i, #prev-icon-show i:before { color: #007bff; font-size: 50px; } #settings { width: 100%; } #settings .media { width: 100%; margin: 20px 0; } /*#settings .media img { width: 60px; margin-right: 20px; border-radius: 50%; }*/ #settings .media .media-body { width: calc(100% - 80px); } #settings .media .media-body h5 { line-height: 18px; color: var(--main-black-color); text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } #settings .change-pass p { color: rgba(27, 29, 33, 0.7); } #settings .change-pass .form-in { width: 100%; display: flex; justify-content: center; align-items: center; } #settings .change-pass .form-in label { border: 1px solid #E4E4E4; box-sizing: border-box; border-top-left-radius: 12px; border-bottom-left-radius: 12px; height: 46px; border-right: none; background-color: #E5E5E5; padding: 12px 12px; background-color: #FCFBFF; padding-right: 0; margin: 0; font-size: 14px; } #settings .change-pass .form-in input { border: 1px solid #E4E4E4; box-sizing: border-box; border-top-right-radius: 12px; border-bottom-right-radius: 12px; height: 46px; border-left: none; padding: 12px 12px; background-color: #FCFBFF; padding-left: 0; outline: none; font-family: Poppins; font-style: normal; font-weight: 500; color: var(--main-black-color); font-size: 14px; } #settings .change-pass button { font-size: 14px; height: 46px; min-width: 100px; } .spinner-content { display: none; color: var(--main-color); justify-content: center; align-items: center; background-color: #FFf; width: 100%; height: auto; z-index: 1042; margin: 15px 0px; } .spinner-content.active { display: flex; } .donut-chart-data { display: flex; justify-content: center; align-items: center; } .donut-chart-data .color { width: 20px; height: 20px; border-radius: 8px; margin-right: 10PX; } .donut-chart-data label { font-style: normal; font-weight: normal; font-size: 14px; line-height: 24px; color: #808191; margin: 0; } /*.quantity { width: 60px; } .quantity .dropdown-toggle { width: 100%;*/ /*color: #808191;*/ /*font-family: Poppins; font-style: normal; font-weight: 500; font-size: 14px; line-height: 20px; padding: 10px; text-align: left; outline: none; background: var(--main-white-color); border: 1px solid #E4E4E4; box-sizing: border-box; border-radius: 5px; } .quantity .dropdown-toggle:focus { box-shadow: none; } .quantity .dropdown-toggle:after { position: absolute !important; top: 50% !important; right: 16px !important; } .quantity .spinner-border { position: absolute !important; top: 38% !important; right: 12px !important; width: 1rem; height: 1rem; } .quantity button label { color: #11142D; } .quantity .dropdown-menu { width: 60px; border-radius: 12px; min-width: 60px; } .quantity .dropdown-menu .dropdown-item { width: 58px; min-width: 58px; cursor: pointer; } .quantity .dropdown-menu .dropdown-item:hover { background-color: var(--main-color); color: #fff; }*/ .size { width: 180px; } .size .dropdown-toggle { width: 100%; font-family: Poppins; font-style: normal; font-weight: 500; font-size: 14px; line-height: 20px; padding: 10px; text-align: left; outline: none; background: var(--main-white-color); border: 1px solid #E4E4E4; box-sizing: border-box; border-radius: 5px; } .size .dropdown-toggle:focus { box-shadow: none; } .size .dropdown-toggle:after { position: absolute !important; top: 50% !important; right: 16px !important; } .size .spinner-border { position: absolute !important; top: 38% !important; right: 12px !important; width: 1rem; height: 1rem; } .size button label { color: #11142D; } .size .dropdown-menu { border-radius: 12px; width: 180px; max-height: 280px; overflow: scroll; } .size .dropdown-menu .dropdown-item { cursor: pointer; width: 180px; } .size .dropdown-menu .dropdown-item:hover { background-color: var(--main-color); color: #fff; } .me-dropdown .dropdown-toggle { width: 100%; background: rgba(228, 228, 228,0.3); border-radius: 16px; /*color: #808191;*/ font-family: Poppins; font-style: normal; font-weight: 500; font-size: 14px; line-height: 20px; padding: 10px; text-align: left; outline: none; border: none; } .me-dropdown .dropdown-toggle:after { position: absolute !important; top: 50% !important; right: 16px !important; } .me-dropdown .spinner-border { position: absolute !important; top: 38% !important; right: 12px !important; width: 1rem; height: 1rem; } .me-dropdown button label { color: #11142D; } .me-dropdown .dropdown-menu { width: 100%; border-radius: 12px; } .me-dropdown .dropdown-menu .dropdown-item { cursor: pointer; } .me-dropdown .dropdown-menu .dropdown-item:hover, .me-dropdown .dropdown-menu .dropdown-item:active { background-color: var(--main-color); color: #fff; } .me-dropdown.rounded-left-dropdown { width: 120px !important; } .me-dropdown.rounded-left-dropdown .dropdown-toggle { border-top-right-radius: 0px !important; border-bottom-right-radius: 0px !important; max-width: 120px !important; outline: none; color: #11142D; padding: 12px; box-shadow: none; } .me-dropdown.rounded-left-dropdown .dropdown-toggle:focus { opacity: 0.8; border: 2px solid var(--main-color); background-color: #fff; } .isWhatsapp { width: calc(100% - 122px) !important; border-top-left-radius: 0px !important; border-bottom-left-radius: 0px !important; opacity: 0.8 !important; border-left: 0px !important; } .me-error, .field-validation-error { background: #FF4C63 !important; border-radius: 8px !important; color: #fff !important; padding: 7px !important; font-size: 12px; margin: 5px 0; } .alert-danger-me { color: #FF4C63 !important; border-color: #FF4C63 !important; } #background-img-cont { width: 100%; } #background-img-cont .phone { background: #F6F5FF; border: 5.9576px solid var(--main-black-color); box-sizing: border-box; border-radius: 15.8304px; width: 150px; height: 300px; background-repeat: no-repeat; background-size: cover; background-position: center center; } #background-img-cont button { margin-left: 20px; } #background-color-cont { width: 100%; } #background-color-cont .colors { max-width: 350px; } .social-btn-type-item { width: 60px; height: 60px; cursor: pointer; display: flex; justify-content: center; align-items: center; border-radius: 8px; padding: 5px; } .social-btn-type-item.active { border: 2px solid var(--main-color); } .social-btn-type-item img { width: 100%; } .social-btn-type-item span, .social-btn-type-item span:before { font-size: 65px; color: var(--main-color); } /*Switch Botton*/ .switch-cont { width: 100%; display: flex; justify-content: flex-end; align-items: center; } #_question-form .switch-cont { height: 40px; } .switch { position: relative; display: inline-block; width: 42px; height: 26px; margin: 0 !important; } /* Hide default HTML checkbox */ .switch input { opacity: 0; width: 0; height: 0; } .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s; } .slider:before { position: absolute; content: ""; height: 19px; width: 19px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .4s; transition: .4s; } input:checked + .slider { background-color: var(--main-color) !important; } input:focus + .slider { box-shadow: 0 0 1px #2196F3 !important; } input:checked + .slider:before { -webkit-transform: translateX(15px); -ms-transform: translateX(15px); transform: translateX(15px); } .slider.round { border-radius: 34px; } .slider.round:before { border-radius: 50%; } /*end switch */ #prev_profile { background-color: #fff; border-radius: 26px; padding: 16px; margin: 15px 0px; } #prev_profile .w-100 img { margin: auto; width: 118px; height: 118px; display: block; } #prev_profile .w-100 h6 { line-height: 20px; text-align: center; color: #11142D; } #prev_profile .w-100 p { line-height: 20px; text-align: center; color: var(--main-gray-light-color); background: rgba(228, 228, 228,0.3); border-radius: 8px; } #partial-cart-summary { position: relative; background-color: var(--main-white-color); } #partial-cart-summary .loader { height: 100%; min-height: 100vh; } .loader.mdl { width: calc(100% + 40px); height: calc(100% + 40px); position: absolute; top: -20px; left: -20px; background: rgb(255, 255, 255); opacity: 0.8; } .loader.active { width: calc(100% + 40px); height: calc(100% + 40px); position: absolute; top: -20px; left: -20px; background: rgb(255, 255, 255); opacity: 0.8; display: flex; } .loader { display: none; justify-content: center; align-items: center; padding: 10px; } .spinner-border { color: var(--main-color); } .datepicker { border-radius: 10px !important; font-family: 'Poppins', sans-serif !important; } .datepicker td, .datepicker th { padding: 5px !important; } .datepicker th { color: var(--main-color) !important; font-weight: 600 !important; } .datepicker th.dow { color: var(--main-color) !important; font-weight: 600 !important; } .datepicker th.day { font-size: 11px !important; color: #48BFE3; } .datepicker th.day:hover { color: #DFE4E6 !important; } .datepicker td, .datepicker th { font-size: 0.94rem !important; } .datepicker table tr td.active:active, .datepicker table tr td.active:hover:active, .datepicker table tr td.active.disabled:active, .datepicker table tr td.active.disabled:hover:active, .datepicker table tr td.active.active, .datepicker table tr td.active:hover.active, .datepicker table tr td.active.disabled.active, .datepicker table tr td.active.disabled:hover.active { background: none !important; font-size: 0.94rem !important; background-color: var(--main-color) !important; } #burger-menu { display: none; } #top-bar { display: none; } .custom-link-cont { display: flex; justify-content: center; width: 100%; } .modal .btn-primary { max-width: 50% !important; width: 100%; min-width: 200px; } .modal .btn-delete-outline { max-width: 50% !important; width: 100%; } .modal h5 { max-width: calc(100% - 60px); } .col-12.vcard { display: flex; justify-content: flex-start; align-items: center; } .col-12.vcard p { width: calc(100% - 55px) !important; margin: 0; } .tab-content { width: 100% !important; } #settings .media p { width: 100%; } .change-pass .input { width: 100%; max-width: 100%; } .dashboard-data .item { margin: auto; padding: 10px 5px; } #analitycs-data-2 { max-width: 900px; height: calc(100vh - 100px); overflow-y: scroll; } #analitycs-data-2 { padding: 10px 45px; max-width: 900px; } .toast-cont { width: 180px; box-sizing: border-box; border-radius: 10px; margin: 10px 5px; } .toast-cont .toast-body { display: flex; justify-content: flex-start; align-items: center; padding: 5px !important; } .toast-cont .toast-body label { margin: 0; margin-left: 10px; font-size: 20px; } .toast-cont .toast-body i, .toast-cont .toast-body i:before { font-size: 24px; } .toast-cont.success { background: #EAF7EE; color: #3AB359; border: 1px solid #C3E2CA; } .toast-cont.danger { background: #FCEDE9; color: #EA4E2C; border: 1px solid #EDCEC5; } #logoutForm label { cursor: pointer; color: var(--main-gray-color); } .croppie-container .cr-boundary { background-image: url(../Content/Images-C/transparent.png); background-position: center center; background-size: cover; } .show-more-not, .show-more-not:hover { color: var(--main-black-color) !important; font-weight: 500; } .notify-item { width: 100%; margin: 10px 0; padding: 5px; display: flex; } .notify-item .ico { width: 60px; height: 100%; padding-right: 10px; } .notify-item .ico i, .notify-item .ico i:before { font-style: normal !important; } .notify-item .time { width: 65px; height: 100%; float: left; font-size: 12px; text-align: right; padding: 5px; color: rgba(27, 29, 33, 0.5); } .notify-item .ico img { width: 40px; } .notify-item .body { width: calc(100% - 135px); float: left; height: 100%; } .cart .product, #checkout .product { width: 100%; margin: 10px 0; padding: 5px; display: flex; justify-content: flex-start; align-items: flex-start; } #checkout .product p { width: 100%; margin: 0; } #checkout .product span { color: var(--main-gray-color); } .cart .product .image, #checkout .product .image { height: 100%; width: 110px; display: flex; justify-content: flex-start; align-items: center } .cart .product .body, #checkout .product .body { width: calc(100% - 260px); height: 100%; padding: 0 15px; } .cart .product .btns, #checkout .product .btns { width: 150px; height: 100%; } .cart .product .btns p, #checkout .product .btns p { /*font-family: Poppins; font-style: normal; font-weight: normal; font-size: 18px;*/ line-height: 18px; color: #11112D; text-align: right; } .cart .product .btns a, #checkout .product .btns a { font-family: Poppins; font-style: normal; font-weight: bold; font-size: 12px; line-height: 18px; color: #2196F3; text-align: right; display: block; } .summary { max-width: 320px; margin-left: auto; display: block; } .summary .item { display: flex; align-items: center; justify-content: flex-end; padding: 3px 0px; } .summary .item .label { font-family: Poppins; font-style: normal; font-weight: normal; font-size: 14px; line-height: 16px; text-align: right; color: #11112D; } .summary .item .value { font-family: Poppins; font-style: normal; font-weight: bold; font-size: 14px; line-height: 16px; color: #11112D; text-align: right; width: 90px; } .summary.partial { max-width: 100%; margin-left: inherit; } .summary .item { width: 100%; } .summary.partial .item .label { text-align: left; } .summary.partial .item .value { text-align: right; width: inherit; } .summary.partial .btn-primary { height: 50px; display: flex; justify-content: center; align-items: center; margin-left: 0; margin-top: 20px; } .effect-item { width: 100%; display: flex; justify-content: flex-start; align-items: center; padding: 10px; cursor: pointer; border-radius: 12px; margin: 2px 0px; } .effect-item:hover { background-color: #E4E4E4; } .effect-item.active { background-color: var(--main-color); color: #fff; } .effect-item span { font-size: 27px; } .effect-item.active, .effect-item.active span:before { color: #fff; } #checkout h5, #Cart h5 { /*font-size: 16px !important; font-family: Poppins; font-style: normal; font-weight: bold;*/ line-height: 18px; color: #11112D; } .shipping-card, .payment-card, .shipping-method-card { width: 100%; border-radius: 15px; padding: 15px; margin: 7px 0; opacity: 0.5; cursor: pointer; } .payment-card i, .payment-card i:before { font-size: 32px; } .shipping-card, .payment-card, .shipping-method-card { opacity: 1; } .shipping-card p, .payment-card p, .shipping-method-card p { margin: 0; } .shipping-card.active, .payment-card.active, .shipping-method-card.active { border: 1px solid var(--main-color); opacity: 1; } #ShopModal .sub { color: var(--main-gray-light-color); } /*.product-slide { position: relative; height:295px; } .product-slide > div { position: absolute; top: 10px; left: 10px; right: 10px; bottom: 10px; }*/ .checkout-btn-container { width: 100%; display: flex; justify-content: flex-end; align-items: center; margin-top: 20px; } .checkout-btn { height: 50px; display: flex; justify-content: center; align-items: center; margin: 10px; max-width: 300px; width: calc(100% - 20px); } .cart-empty { width: 100%; display: flex; justify-content: center; align-items: center; } .quantity-cont-summary { display: flex; justify-content: flex-start; align-items: center; } .block-card { width: 100%; padding: 15px 15px; border: 1px solid var(--main-color); box-sizing: border-box; border-radius: 16px; margin: 15px 0px; height: 100px; background-color: #fcfbff; } .block-card .position { width: 16px; height: 100%; display: flex; align-items: center; float: left; cursor: pointer; } .block-card .position img { width: 16px; } .block-card .media { width: calc(100% - 16px); height: 100%; float: left } .block-card .media .btns { width: 45px; height: 100%; float: left } .block-card .media .btns .list { width: 100%; height: 50%; float: left; display: flex; justify-content: flex-end; align-items: center; margin-top: 10px; } .block-card .media-body { margin: auto; padding-left: 7px; width: calc(100% - 121px); } .block-card .media img { width: 46px; margin: auto 7px auto 7px; } .block-card .media .btns .list i, .block-card .media .btns .list i:before { font-size: 25px; margin: auto; margin-left: 10px; color: rgba(27, 29, 33, 0.3); } .block-card .media .btns .list a:hover i, .block-card .media .btns .list a:hover i:before { color: var(--main-color); } .block-card .media h5 { /*font-family: Poppins; font-style: normal; font-weight: normal; font-size: 18px; line-height: 20px;*/ color: var(--main-black-color); margin-bottom: 5px !important; white-space: nowrap; overflow: hidden; } .block-card .media p { width: 100%; /*font-family: Poppins; font-style: normal; font-weight: normal; font-size: 14px;*/ line-height: 18px; color: rgba(27, 29, 33, 0.9); margin: 0; white-space: nowrap; overflow: hidden; } .block-card .media a { cursor: pointer; } .block-card .media a i { margin: 0 10px; } .block-card .media a i, .block-card .media a i:before { color: var(--main-color); } .car-btn { height: 50px; display: flex; justify-content: center; align-items: center; margin-left: 0; max-width: 300px; width: 100% } .btn-next-carrousel { padding: 1px; width: 52px; display: flex; justify-content: center; align-items: center; border-radius: 5px; padding: 4px; } .btn-next-carrousel.active { width: 52px; border: 3px solid var(--main-color); padding: 1px; } .btn-next-carrousel img { width: 100%; border-radius: 5px; } .card-preview { width: 300px; height: 481px; background-position: center center; background-repeat: no-repeat; background-size: contain; position: relative; font-family: 'Poppins',sans-serif !important; margin: auto; } .input-preview { border: none; outline: none; background: none; font-style: normal; font-weight: normal; line-height: 30px; position: absolute; color: #fff; margin: 5px; } .qr-card-preview { width: 190px; height: 190px; position: absolute; top: 240px; left: 100px; filter: grayscale(100%); margin: 5px; } .qr-card-preview.color { width: 180px; height: 180px; top: 275px; left: 60px; filter: unset !important; } .logo-card-preview { width: 50px; height: 50px; position: absolute; top: 130px; left: 60px; filter: grayscale(100%); margin: 5px; cursor: pointer; } .logo-card-preview.color { width: 100px; height: 100px; top: 60px; left: 100px; filter: unset !important; } #logo.active { display: block; } #logo { display: none; } .name-input { top: 130px; left: 120px; white-space: nowrap; font-weight: bold; font-size: 21px; } .title-input { top: 155px; left: 120px; white-space: nowrap; font-size: 18px; } .name-input.color { top: 200px; left: 70px; } .title-input.color { top: 230px; left: 85px; } .footer { padding: 20px; width: 100%; background: var(--main-black-color); color: var(--main-gray-color); } .container-footer { width: 100%; padding: 20px; } .footer .container-footer-all { width: 100%; } .footer .container-body { display: flex; } .footer .copyright a { text-decoration: none; color: var(--main-gray-color); font-weight: bold; margin: 0 5px; } .footer .information { } .footer .information a { text-decoration: none; color: var(--main-gray-color); } .legal_frame { width: 100%; border: none; min-height: calc(100vh - 150px); height: 100%; overflow: hidden; } .draggable { cursor: pointer; } .draggable-source--is-dragging, .draggable-mirror { display: none !important; } .table_form thead tr th { text-align: center; font-weight: 500; } .table_form tbody { width: 100%; } .table_form tbody tr td { padding: 10px 5px; } .table_form tbody tr td .switch-cont, .table_form tbody tr td .btn-delete-outline, .table_form tbody tr td label { display: flex; justify-content: center; align-items: flex-start; } .me-table { width: 100%; border-collapse: separate; } .me-table thead th { color: #fff; font-weight: 300; padding: 10px; background-color: var(--main-black-color); text-align: center; } .me-table thead th:first-child { border-radius: 15px 0px 0px 0px; } .me-table thead th:last-child { border-radius: 0px 15px 0px 0px; } .me-table tbody td:first-child { border-color: var(--main-black-color); transition: 0.1s; border-left: 1px solid; } .me-table tbody td:last-child { border-color: var(--main-black-color); transition: 0.1s; border-right: 1px solid; } .me-table tbody tr:last-child td { border-color: var(--main-black-color); transition: 0.1s; border-bottom: 1px solid; } .me-table tbody tr:last-child td:first-child { border-radius: 0px 0px 0px 15px; } .me-table tbody tr:last-child td:last-child { border-radius: 0px 0px 15px 0px; } .me-table tbody tr:hover { background-color: rgba(89, 85, 216,0.2); border-radius: 10px; transition: 0.1s; } .me-table tbody td { padding: 5px 10px; } .me-table .media { display: flex; justify-content: center; align-items: center; padding: 5px; } .me-table .media .char { display: flex; justify-content: center; align-items: center; height: 30px; width: 30px; border-radius: 50%; background-color: var(--main-color); color: var(--main-white-color); font-weight: 500; font-size: 16px; padding: 5px; margin-right: 10px; } .me-table .media .media-body h5 { font-size: 15px !important; } .me-table td { font-size: 14px !important; } table.responsive { border: 1px solid #ccc; border-collapse: collapse; margin: 0; padding: 0; width: 100%; table-layout: fixed; } table.responsive tr { background-color: var(--main-white-color); border: 1px solid #ddd; padding: .35em; border-radius: 8px; } table.responsive th, table.responsive td { padding: .625em; text-align: center; } table.responsive th { font-size: .85em; letter-spacing: .1em; text-transform: uppercase; } .table-container { overflow-x: scroll; } .table-container::-webkit-scrollbar { display: unset !important; } .table-container::-webkit-scrollbar { width: 5px; height: 8px; background-color: var(--main-bg-color); } .table-container::-webkit-scrollbar-thumb { background: var(--main-color); border-radius: 5px; } .me-table-outline thead th:first-of-type { width: 250px; } .me-table-outline thead th { width: 180px; } table.me-table-outline tr a { color: var(--main-black-color); font-weight: bolder; } table.me-table-outline tr { -webkit-transition: background-color 0.2s ease-in; -moz-transition: background-color 0.2s ease-in; -o-transition: background-color 0.2s ease-in; transition: background-color 0.2s ease-in; } table.me-table-outline tbody tr.active { color: #fff; background-color: var(--main-color); } table.me-table-outline tr.active a { color: var(--main-white-color); font-weight: bolder; } .me-table-outline tbody td, .me-table-outline tbody td h5 { font-size: 14px !important; } .me-table-outline tbody td p { font-size: 13px !important; } .me-pagination { width: 100%; display: flex; justify-content: center; align-items: center; padding: 10px; } .me-pagination .page-item a { border: none; background: none; color: var(--main-color) !important; cursor: pointer; margin: 0px !important; font-size: 20px; height: 25px; width: 25px; padding: 5px !important; display: flex; justify-content: center; align-items: center; border-radius: 50%; } .me-pagination .page-item a span { height: 100%; display: flex; justify-content: center; align-items: center; } .me-pagination .page-link.active { background-color: var(--main-black-color); color: #fff !important; } .note-modal .modal-dialog { outline: none !important; border-radius: unset !important; box-shadow: none !important; } .note-modal .modal-header .close { padding: 1rem 1rem; margin: -1rem -1rem -1rem auto; position: absolute; right: 19px; } .note-modal .modal-title { width: 100%; } .note-modal .checkbox label { display: flex; justify-content: flex-start; align-items: center; } .note-modal .checkbox label input { margin-right: 10px; } .note-editor .note-dropdown-menu li a { color: var(--main-black-color) !important; } .note-editor .btn-group > .btn:focus, .btn-group > .btn:active, .btn-group > .btn.active, .btn-group-vertical > .btn:focus, .btn-group-vertical > .btn:active, .btn-group-vertical > .btn.active { box-shadow: none; } .note-editor input[type="checkbox"] { width: 20px !important; padding: 0px !important; } .form-options-cont { height: 100% !important; border: 1px solid var(--main-color) !important; border-radius: 15px !important; background: none !important; } .form-options-cont .media img { width: 50px; } .form-options-cont .card-title { font-size: 17px !important; } .form-options-cont .buttons { display: flex; justify-content: flex-end; align-items: center; } .form-options-cont .buttons a, .form-options-cont .buttons button { padding: 0 !important; } .form-options-cont .buttons span, .form-options-cont .buttons span:before { color: var(--main-black-color); font-size: 21px; } .form-options-cont .buttons span, .form-options-cont .buttons span:before { color: var(--main-black-color); font-size: 21px; } .form-options-cont .media-body a span, .form-options-cont .media-body a span:before { color: var(--main-black-color); font-size: 24px; } .note-editor.note-airframe, .note-editor.note-frame { border-radius: 8px !important; } #giveaway_options { width: 100%; } #giveaway_options .form-group { margin: 5px 0; } #giveaway_options .form-group input[type=number] { float: right; } #giveaway_options .form-group label { } .giveaway_item p { margin: 0; } .giveaway_item .btn-clean span, .giveaway_item .btn-clean span:before { font-size: 30px; color: var(--main-color); } #report-view .tab-container { overflow-x: scroll !important; } #report-view .tab-container::-webkit-scrollbar { display: block !important; } #report-view .tab-container ::-webkit-scrollbar { display: block !important; } .participants { } .participants .media { display: flex; justify-content: center; align-items: center; padding: 5px; } .participants .media .char { display: flex; justify-content: center; align-items: center; height: 25px; width: 25px; border-radius: 50%; background-color: var(--main-color); color: var(--main-white-color); font-weight: 500; font-size: 18px; padding: 5px; margin-right: 10px; } .participants .media .media-body h5 { /*font-size: 17px !important;*/ word-wrap: break-word; } .participants .media .media-body p { /*font-size: 16px !important;*/ word-wrap: break-word; } .lang { border-radius: 14px !important; color: var(--main-black-color); background-color: var(--main-white-color); cursor: pointer; margin-right: 10px; padding: 5px !important; } .lang .card-body { padding: 5px !important; } .lang.active { color: var(--main-white-color); background-color: var(--main-color); } .question-item-tab { margin-bottom: 30px !important; padding: 10px !important } .question-item-tab .example { display: flex; } .question-item-tab .example input:disabled:focus { width: 100%; font-family: Poppins; font-style: normal; font-weight: 500; font-size: 14px; line-height: 20px; color: #11142D; background: rgba(228, 228, 228,0.4); border-radius: 8px; min-height: 45px; padding: 10px; border: 2px solid transparent; } .question-item-tab .example .form-group label { color: var(--main-black-color); font-size: 16px; } .question-item-tab .form-group input.label, .question-item-tab .form-group input.label-option { font-family: Poppins; font-style: normal; font-weight: 500; font-size: 16px; color: var(--main-black-color); border: none; padding: 0; background: none !important; width: auto !important; min-height: unset !important; padding-bottom: 3px; margin-bottom: 10px; width: 100% !important; transition: all; } .question-item-tab .form-group input.label:focus { line-height: 0; color: var(--main-black-color); border: none; margin-bottom: 0.5rem; border-radius: 0; background: none !important; border-bottom: 1px solid var(--main-color); } .question-item-tab .form-group input.label-option { font-weight: 400; } .question-item-tab .form-group input.label-option:focus { line-height: 0; color: var(--main-black-color); border: none; margin-bottom: 0.5rem; border-radius: 0; background: none !important; border-bottom: 1px solid var(--main-color); } .question-item-tab .form-group .content-input { padding: 20px 0px 5px 36px; } .question-item-tab .form-group .content-input:hover input[type=radio]:not(:checked) + i { background: #f0f0f0 !important; } .question-item-tab .btn-delete-outline { padding: 0 !important; margin: 0 !important; } .question-item-tab .phone-code { width: 100%; font-family: Poppins; font-style: normal; font-weight: 500; font-size: 14px; line-height: 20px; color: var(--main-gray-light-color); background: rgba(228, 228, 228,0.4) !important; border-radius: 8px; min-height: 45px; padding: 10px; border: 2px solid transparent; border-bottom-right-radius: 0 !important; border-top-right-radius: 0 !important; } .search_user { display: flex; align-items: center !important; } .search_user p { color: var(--main-black-color); } .search_user:hover { background: var(--main-color); border-radius: 10px; } .search_user:hover p, .search_user:hover small.match { color: #fff !important; } .input_search_cont { display: flex; justify-content: flex-start; align-items: center; height: 100%; position: relative; margin-left: 40px; outline: none; z-index: 3; } .input_search { /*border: 1px solid var(--main-color);*/ border-radius: 15px; background: #fff; position: absolute; top: 20px; -webkit-box-shadow: 7px 11px 15px -7px #d0d3d8; box-shadow: 7px 11px 15px -7px #d0d3d8; transition: all .3s ease-in-out; outline: none; } .input_search .controls { display: flex; justify-content: center; align-items: center; border-radius: 50%; outline: none; } .input_search .controls input[type=text] { height: 50px; background: #fff; border: 0; width: 0px; width: 350px; border-radius: 50%; outline: none; padding: 0; text-indent: 15px; transition: width 0.8s; z-index: 2; } .input_search .controls input[type=text]::placeholder { color: var(--main-gray-light-color); } .input_search .controls div { height: 50px; width: 50px; border-left: 0; display: flex; justify-content: center; align-items: center; cursor: pointer; border-radius: 50%; } .input_search .controls div i, .input_search .controls div i:before { color: var(--main-color); border-radius: 15px; } .input_search .search_cont { background: #fff; border-radius: 15px; width: 100%; position: relative; } .input_search small.match { color: var(--main-gray-color) !important; } .input_search_cont_cat { width: 230px; height: 50px; display: flex; justify-content: flex-start; align-items: center; /*height: 100%;*/ position: relative; margin-left: auto; outline: none; z-index: 2; } .input_search_cat { /*border: 1px solid var(--main-color);*/ border-radius: 15px; background: #fff; position: absolute; top: 0px; -webkit-box-shadow: 7px 11px 15px -7px #d0d3d8; box-shadow: 7px 11px 15px -7px #d0d3d8; transition: all .3s ease-in-out; outline: none; } .input_search_cat .controls { display: flex; justify-content: center; align-items: center; border-radius: 50%; outline: none; } .input_search_cat .controls input[type=text] { height: 40px; background: #fff; border: 0; width: 0px; width: 180px; border-radius: 50%; outline: none; padding: 0; text-indent: 15px; transition: width 0.8s; z-index: 2; } .input_search_cat .controls input[type=text]::placeholder { color: var(--main-gray-light-color); } .input_search_cat .controls div { height: 40px; width: 50px; border-left: 0; display: flex; justify-content: center; align-items: center; cursor: pointer; border-radius: 50%; } .input_search_cat .controls div i, .input_search_cat .controls div i:before { color: var(--main-color); border-radius: 15px; } .input_search_cat .search_cont_cat { background: #fff; border-radius: 15px; width: 100%; position: relative; } .input_search_cat small.match { color: var(--main-gray-color) !important; } .category_option { display: flex; align-items: center !important; color: var(--main-black-color); padding: 2px; cursor: pointer; border-radius: 5px; } .category_option:hover { background: var(--main-color); color: var(--main-white-color); } .category_option span, .category_option span:before { color: var(--main-black-color); margin-left: auto; } .category_option:hover span, .category_option:hover span:before { color: var(--main-white-color); } .has_category { cursor: default; width: auto !important; float: left; margin: 5px; margin-left: 0; padding: 5px; display: flex } .has_category .icon-close, .has_category .icon-close:before { font-size: 20px; cursor: pointer; } .input_search_cont_group { width: 230px; height: 50px; display: flex; justify-content: flex-end; align-items: center; /*height: 100%;*/ position: relative; margin-left: auto; outline: none; z-index: 2; } .input_search_group { /*border: 1px solid var(--main-color);*/ border-radius: 15px; background: #fff; position: absolute; top: 0px; -webkit-box-shadow: 7px 11px 15px -7px #d0d3d8; box-shadow: 7px 11px 15px -7px #d0d3d8; transition: all .3s ease-in-out; outline: none; } .input_search_group .controls { display: flex; justify-content: center; align-items: center; border-radius: 50%; outline: none; } .input_search_group .controls input[type=text] { height: 40px; background: #fff; border: 0; width: 0px; width: 180px; border-radius: 50%; outline: none; padding: 0; text-indent: 15px; transition: width 0.8s; z-index: 2; } .input_search_group .controls input[type=text]::placeholder { color: var(--main-gray-light-color); } .input_search_group .controls div { height: 40px; width: 50px; border-left: 0; display: flex; justify-content: center; align-items: center; cursor: pointer; border-radius: 50%; } .input_search_group .controls div i, .input_search_group .controls div i:before { color: var(--main-color); border-radius: 15px; } .input_search_group .search_cont_group { background: #fff; border-radius: 15px; width: 100%; position: relative; } .input_search_group small.match { color: var(--main-gray-color) !important; } .input_search_cont_chat { width: 230px; height: 50px; display: flex; justify-content: flex-end; align-items: center; /*height: 100%;*/ position: relative; margin-left: auto; outline: none; } .input_search_chat { border-radius: 15px; background: #fff; position: absolute; top: 15px; left: 0px; right: 0px; -webkit-box-shadow: 7px 11px 15px -7px #d0d3d8; box-shadow: 7px 11px 15px -7px #d0d3d8; transition: all 1s ease-in; outline: none; z-index: 2; } .input_search_chat .controls { display: flex; justify-content: center; align-items: center; border-radius: 50%; outline: none; } .input_search_chat .controls input[type=text] { height: 40px; background: #fff; border: 0; width: 100%; border-radius: 50%; outline: none; padding: 0; text-indent: 15px; } .input_search_chat.active .controls input[type=text] { width: 100%; } .input_search_chat .controls input[type=text]::placeholder { color: var(--main-gray-light-color); } .input_search_chat .controls div { height: 40px; width: 50px; border-left: 0; display: flex; justify-content: center; align-items: center; cursor: pointer; border-radius: 50%; } .input_search_chat .controls div i, .input_search_chat .controls div i:before { color: var(--main-color); border-radius: 15px; } .input_search_chat .search_cont_chat { background: #fff; border-radius: 15px; width: 100%; position: relative; } .input_search_chat small.match { color: var(--main-gray-color) !important; } /*.member_group { height: 100% !important; border: 1px solid var(--main-color) !important; border-radius: 15px !important; background: none !important; position: relative; } .member_group .media img { border-radius: 50%; height: 75px; width: 75px; margin: auto; display: block; } .member_group .media { width: calc(100% - 90px); } .member_group .media p { color: var(--main-black-color); } .member_group .media strong { font-size: 1.2rem; color: var(--main-black-color); } .member_group .message { width: 90px; display: flex; justify-content: flex-end; align-items: center; } .member_group .data { width: 100%; display: flex; align-items: center; } .member_group .data small { color: var(--main-gray-light-color); } .member_group .message { padding-top: 15px; } .member_group .message .ml-auto { margin-top: 50px; margin-bottom: 10px; } .member_group .message a { display: flex; justify-content: center; align-items: center; } .member_group .message span, .member_group .message span:before { color: var(--main-color); } .member_group .options { position: absolute; right: 5px; top: 0; display: flex; justify-content: flex-end; align-items: center; padding-top: 15px; } .member_group .options button { background: none; border: none; outline: none; color: var(--main-black-color); display: flex; justify-content: center; align-items: center; font-size: 30px; cursor: pointer; line-height: 10px; padding: 0px 10px; }*/ .options-group-btns a, .options-group-btns a:hover, .options-group-btns a span, .options-group-btns a span:before { color: var(--main-black-color); cursor: pointer; padding: 25px 0 !important; } .options-group-btns a.remove_item_grp, .options-group-btns a.remove_item_grp:hover { color: #FF4C63; cursor: pointer; padding: 25px 0 !important; } .detail-h4 span, .detail-h4 span:before { color: var(--main-black-color); font-size: 15px; } #Group_preview { width: 100%; max-width: 750px; background-color: #fff; display: block; min-height: calc(100vh - 90px); position: relative; } #Group_preview .form-group label span, #Group_preview .form-group label span:before { color: var(--main-gray-light-color); } #Group_preview .detail-h4, #Group_preview .detail-h4 span, #Group_preview .detail-h4 span:before { color: var(--main-black-color); font-size: 15px; } #join-group-cont { position: fixed; bottom: 5px; left: 0; right: 0; } #join-group-cont .btn-primary { max-width: unset !important; margin: auto; display: block; font-size: 23px !important; padding: 15px 35px; } .room-item { width: 100%; padding: 10px; background-color: var(--main-white-color); cursor: pointer; border-radius: 10px; margin-top: 10px; } .room-item .media img { width: 40px; height: 40px; display: block; margin: auto; } .room-item .media-body .name { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .room-item .media .media-body .name { color: var(--main-color) !important; text-transform: capitalize; font-size: 14px !important; font-weight: 600 !important; } .room-item:hover { background-color: rgba(89, 85, 216,0.7); } .room-item:hover .media .media-body h5, .room-item:hover .media .media-body p { color: #fff !important; } .room-item.active { width: 100%; padding: 10px; background-color: var(--main-color); } .room-item.active .media .media-body h5 { color: var(--main-white-color) !important; } .room-item.active .media .media-body p { color: var(--main-white-color) !important; } .room-item .picture-cont { position: relative; } .room-item .picture-cont span { position: absolute; right: 15px; bottom: 0px; height: 10px !important; width: 10px !important; } .room-item .media-body small { font-size: 11px; } .room-item:hover .media-body small, .room-item.active .media-body small { color: var(--main-white-color); } .room-item .media-body .text { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-size: 12px !important; width: 200px; margin: 0 !important; } .room-item .media-body .message_uncked { height: 20px; width: 20px; background-color: var(--main-color); border-radius: 50%; color: #fff !important; display: flex !important; justify-content: center; align-items: center; } .dot-online { height: 8px; width: 8px; background-color: #86c541; border-radius: 50%; display: inline-block; } .dot-offline { height: 8px; width: 8px; background-color: #e47297; border-radius: 50%; display: inline-block; } /*Chat*/ .chat { display: flex; } #list-rooms { padding: 0 10px; width: 100%; max-width: 320px; min-height: calc(100vh - 130px); max-height: calc(100vh - 130px); position: relative; display: -webkit-flex; display: flex; -webkit-flex-flow: column nowrap; flex-flow: column nowrap; } #current_room { width: 100%; max-width: calc(100% - 320px); display: flex; align-items: flex-start; } #current_info_room { width: 100%; max-width: 350px; min-height: calc(100vh - 130px); max-height: calc(100vh - 130px); position: relative; display: -webkit-flex; display: flex; -webkit-flex-flow: column nowrap; flex-flow: column nowrap; } #room_chat { display: block; width: calc(100% - 350px); padding: 0 10px; } #current_info_room .room_data { overflow-y: scroll; flex: 1 auto; } /*#current_room .room_data .info { flex: 0 0 auto; }*/ #current_info_room .room_data p { width: 100%; font-size: 13px !important; } #current_info_room .room_data .chat-picture { width: 100%; border-radius: 50%; margin: 0 auto; max-width: 100px; display: block; } #current_info_room .room_data .name { text-align: center; width: 100%; margin: 10px auto; } #current_info_room .member-container .media { margin-bottom: 6px; display: flex; justify-content: flex-start; align-items: center; } #current_info_room .member-container .media img { width: 30px; height: 30px; border-radius: 50%; } #current_info_room .member-container a { cursor: pointer } #current_info_room .member-container .media h5 { font-size: 12px !important; text-overflow: ellipsis; width: 100%; white-space: nowrap; color: var(--main-black-color); } #current_info_room .media_files .file-cont { width: 100%; background-color: rgba(108, 93, 211,0.99); border-radius: 8px; display: block; padding: 10px; cursor: pointer; } #current_info_room .media_files a { display: block; cursor: pointer; color: var(--main-color); font-weight: 700; font-size: 12px !important; } #current_info_room .media_files span, #current_info_room .members span { color: var(--main-color); } #current_info_room .media_files .file-cont i, #current_info_room .media_files .file-cont i:before { color: var(--main-white-color); font-size: 20px; width: fit-content; } #current_info_room .media_files .file-cont p { color: var(--main-white-color); margin: 0; } #chat_picture_container, #chat_files_container { display: none; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background-color: var(--main-white-color); z-index: 3; flex: 0 0 auto; } #chat_picture_container.active, #chat_files_container.active { display: block; } #current_info_room .picture_item { padding: 5px !important; } #current_info_room .picture_item img { max-width: 100%; max-height: 100px; border-radius: 4px; cursor: pointer; } #_media .picture_cont { width: 100%; padding: 5px !important; } #_media .picture_item { cursor: pointer; height: 150px; background-repeat: no-repeat; background-size: cover; background-position: center center; border-radius: 5px; display: block; } #_files .file_item { display: flex; justify-content: flex-start; align-items: center; cursor: pointer; border-radius: 7px; background-color: var(--main-white-color); padding: 5px; } #current_info_room .file_item { display: flex; justify-content: flex-start; align-items: center; cursor: pointer; } #current_info_room .file_item .picture { min-width: 40px; height: 40px; border-radius: 8px; background-color: var(--main-gray-light-color); display: flex; justify-content: center; align-items: center; } #current_info_room .file_item .info p { font-size: 13px !important; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; color: var(--main-black-color) } #current_info_room .file_item .info small { font-size: 11px; color: var(--main-black-color) } #current_info_room .file_item .picture i, #chat_files_container .file_item .picture i:before { color: var(--main-white-color); font-size: 25px; } #current_info_room .file_item .info { padding-left: 10px; width: calc(100% - 40px); } #chat_search { height: 75px; position: relative; flex: 0 0 auto; } #list-rooms #nav-content { width: 100%; flex: 0 auto; } #list-rooms #pills-tabContent { width: 100%; overflow-y: scroll; flex: 1 auto; height: 100%; position: relative; } .chat .message .image_type { max-width: 180px !important; max-height: 180px !important; cursor: pointer !important; display: block !important; border-radius: 5px !important; margin-bottom: 5px !important; } /*.chat .message .media.document img { width: 25px; display: block; margin: auto; }*/ .chat .message .media.document .media-body p { color: #fff } .chat .message .media.document .media-body small { color: #fff } .chat .chat-message .fa-file-o, .chat .chat-message .fa-file-image-o { font-size: 16px; color: gray; cursor: pointer; } .chat-box { width: 100%; min-height: calc(100vh - 130px); max-height: calc(100vh - 130px); position: relative; display: -webkit-flex; display: flex; -webkit-flex-flow: column nowrap; flex-flow: column nowrap; } .chat-box .header { width: 100%; flex: 0 0 auto; } .chat-box .header img { width: 50px; height: 50px; } .chat-box .header h3 { text-transform: capitalize; } .chat-box .header .actions { margin-left: auto; display: flex; } .chat-box .message-box .btn-clean { color: #6c5dd3; text-align: center; margin: auto; display: block; } .message-box { width: 100%; overflow-y: scroll; flex: 1 auto; height: 100%; position: relative; } .message-box .message { align-items: flex-start; width: 100%; padding-top: 8px; } .message-box .message .profile-pic { width: 35px; height: 35px; border-radius: 50%; } .message-box .message p { width: fit-content; } .message-box .message .body { max-width: 70%; width: 100%; } .message-box .message.left { justify-content: flex-start } .message-box .message.right .body { display: flex; align-items: flex-start; justify-content: flex-end } .message-box .message.right { justify-content: flex-end; } .message-box .message .body .text { color: #fff; padding: 10px 12px; border-radius: 6px; cursor: pointer; margin-bottom: 3px; font-size: 13px !important; } .message-box .message.deleted .text { font-style: italic !important; opacity: 0.7 !important; } .message-box .message .body .info { display: none; color: var(--main-gray-light-color); margin-bottom: 3px; font-size: 11px !important; } .message-box .message.right .body .info { text-align: end; display: none; color: var(--main-gray-light-color); margin-bottom: 3px; font-size: 11px !important; } .message-box .message .body .info.active { display: block; } .message-box .message.left .body .text { background-color: var(--main-gray-light-color); margin-right: auto; } .message-box .message.right .body .text { background-color: var(--main-color); margin-left: auto; } .message-box .message .body .text a { color: var(--main-white-color); text-decoration: underline !important; } .message-box .message .body .text a:hover { color: var(--main-white-color); text-decoration: underline !important; } .message-box .message a { width: fit-content; display: block; } .message-box .message .document { width: fit-content; display: block; padding: 10px; border-radius: 8px; } .message-box .message .document i, .message-box .message .document i:before { color: #fff; } .message-box .message.right .document { background-color: var(--main-color); margin-left: auto; } .message-box .message.left .document { background-color: var(--main-gray-light-color); margin-right: auto; } .message-box .message .document .text { color: #fff; border-radius: 0 !important; margin-bottom: 0px !important; text-align: start !important; text-overflow: ellipsis; overflow: hidden; width: 160px; white-space: nowrap; } .message-box .message .document a.text { text-align: start !important; } .message.right .msg-opt { opacity: 0.6; transform-origin: 0 0; transform: rotate(90deg); padding-bottom: 0; padding-top: 0; padding-right: 0; margin-right: -25px !important; } .message.right .msg-opt:hover { opacity: 1; } .chat-box .controls { flex: 0 0 auto; } .chat-box .controls .control-box { display: flex; justify-content: flex-end; align-items: center; position: relative; margin-bottom: 0 !important; } .chat-box .controls .control-box .btn-clean { color: #11142D; background: rgba(228, 228, 228,0.4); border: 2px solid transparent; border-radius: 8px; border-bottom-left-radius: 0; border-top-left-radius: 0; border-left: 0; min-height: 45px; margin: 0; display: flex; justify-content: center; align-items: center; } .chat-box .controls .control-box #send_message { margin-left: 8px; } .mess-hr { margin: 10px 0 !important; } .msg-opt i, .msg-opt i:before, .btn-chat-menu i, .btn-chat-menu i:before { color: #6c5dd3; font-weight: 800; font-size: 19px; } #no_more_message, #show_more_message { display: block; margin: auto; color: var(--main-color); } .online, .offline, .me { margin-right: 3px; font-size: 10px; } .online { color: var(--main-gray-color); } .offline { color: #e38968; } .me { color: var(--main-color); } .align-left { text-align: left; } .align-right { text-align: right; } .float-right { float: right; } .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } /*end chat*/ #current_room .list-files { display: none; } #current_room .list-files.active { width: 100%; margin-right: auto; background-color: rgba(228, 228, 228,0.4); display: block; padding: 10px; border-radius: 8px; } #current_room .file-item { display: flex; width: fit-content; min-width: 280px; justify-content: flex-start; align-items: center; padding: 10px; background-color: rgb(218, 216, 237); border-radius: 8px; margin-bottom: 5px; margin-left: auto; } #current_room .file-item .icon { display: flex; justify-content: center; align-items: center; height: 18px !important; min-height: 18px !important; min-width: 18px !important; max-height: 18px !important; width: 18px !important; max-width: 18px !important; border-radius: 50%; } #current_room .file-item .icon i, .file-item .icon i:before { color: var(--main-white-color); font-size: 11px; } #current_room .file-item .icon.cancel { background-color: var(--main-gray-color); cursor: pointer; } #current_room .file-item .icon.ok { background-color: var(--main-color); font-size: 10px !important; } #current_room .file-item .name { width: 100%; color: var(--main-color); font-size: 13px; padding: 3px 5px; } #txt_message.file-grp { border-top-left-radius: 0px; border-top-right-radius: 0px; } #txt_message:focus + label[for="file-btn"] { border: 2px solid var(--main-color) !important; border-radius: 8px; border-top-left-radius: 0px; border-bottom-left-radius: 0px; border-left: none !important; opacity: 1; background: var(--main-white-color); } #current_user_picture { width: 50px; height: 50px; display: block; margin: auto } .ctrl.hide { display: none; } #btn_see_all_chat { display: none; } .partial-body.chat { padding: 20px; padding-bottom: 0; } .card-manage-group { background: var(--main-white-color); box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); border-radius: 10px; height: auto; padding: 5px; } .card-manage-head { padding: 10px; } .card-manage-title { color: var(--main-black-color); font-family: 'Poppins'; font-style: normal; font-weight: 400; font-size: 18px; line-height: 20px; margin: 0; } .card-manage-body hr { margin-top: 2px; margin-bottom: 2px; border: 1px solid rgba(118, 119, 122, 0.15); } .card-group { background: var(--main-white-color); box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); border-radius: 10px; height: 100%; padding: 10px; } .card-group .media img { height: 50px; width: 50px; display: block; margin: auto; border-radius: 50%; } .card-group .media .media-body h5 { /*font-family: 'Poppins'; font-style: normal; font-weight: 400; font-size: 18px;*/ line-height: 20px; } .card-group .media .media-body p { /*font-family: 'Poppins'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 12px;*/ color: var(--main-gray-color); } .card-group .media { width: calc(100% - 40px); } .card-group .card-icon { width: 40px; display: flex; justify-content: center; align-content: center; } .card-group .card-icon span, .card-group .card-icon span:before { color: var(--main-black-color); font-size: 18px; } .card-group hr { padding: 0; border: 1px solid rgba(118, 119, 122, 0.15); margin-top: 0px; margin-bottom: 10px; margin-left: 0; margin-right: 0; } .card-description-group { line-height: 15px; } /*.group_text { font-family: 'Poppins' !important; font-style: normal !important; }*/ .card-members-request { background: var(--main-white-color); position: relative; /*box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);*/ /*border-radius: 10px; height: 100%;*/ } .card-members-request-img { height: 80px; width: 80px; display: block; margin: 2px,2px,2px,2px; border-radius: 50%; } .members-request-title { font-size: 15px; text-align: left; font-weight: 700; color: var(--main-black-color); margin-bottom: 2px; text-align: left; } .members-request-subtitle { font-size: 10px; text-align: left; color: var(--main-black-color); margin-bottom: 0px; } .members-request-biography { font-weight: 400; font-size: 13px; line-height: 14px; text-align: justify; color: var(--main-black-color); } .members-request-title-joined { font-weight: 400; font-size: 12px; line-height: 11px; text-align: justify; color: var(--main-gray-color); } .media-right { width: 150px; justify-content: center; align-content: center; } .card-members-request .options { position: absolute; right: -25px; top: 0; display: flex; justify-content: flex-end; align-items: center; padding-top: 0px; } .card-members-request .options button { background: none; border: none; outline: none; color: var(--main-black-color); display: flex; justify-content: center; align-items: center; font-size: 30px; cursor: pointer; line-height: 10px; padding: 0px 10px; } .container-common-followers { position: relative; margin: 0 auto; line-height: 50px; } .container-common-followers .circle img { height: 30px; width: 30px; background-color: blue; border-radius: 50%; text-align: center; display: block; float: left; margin-right: -10px; } .btn-save-setting { width: 45%; max-width: inherit !important } #back_options { position: absolute; top: 0px; background: rgb(18,18,22); background: linear-gradient(180deg, rgba(18,18,22,1) 0%, rgba(5,6,6,0.7091211484593838) 19%, rgba(0,212,255,0) 100%); padding: 10px; } #back_options span, #back_options span:before { color: #fff; font-size: 30px; } .card-group .data span, .card-group .data span:before { color: var(--main-black-color); font-size: 17px; } .info-group span, .info-group span::before { color: var(--main-black-color); font-size: 17px; } #details-options a.btn-primary { color: var(--main-black-color); } #details-options a.btn-secondary span, #details-options a.btn-secondary span:before { color: var(--main-black-color); } #current_user_name { text-transform: capitalize; } .config h5 { /*font-weight: 500; font-size: 24px;*/ line-height: 26px; color: #11142D; } .config .form-group { width: 100%; margin: 10px 0px; } .config .form-group label { font-weight: 300; line-height: 20px; color: var(--main-black-color); /*font-size: 18px;*/ } .config .form-group label span { /*font-weight: 300; font-size: 18px;*/ line-height: 20px; color: var(--main-black-color); } .config .form-group input, .config .form-group textarea, .config .form-group select { width: 100%; border-radius: 8px; min-height: 45px; padding: 10px; border: 2px solid var(--main-color); color: #11142D; background-color: #fff; font-weight: 300; } .config .form-group input::placeholder, .config .form-group textarea::placeholder { color: var(--main-gray-light-color); } .config .form-group input:focus { opacity: 1; outline: none; box-shadow: none; } .config .form-group textarea:focus { opacity: 1; border: 2px solid var(--main-color); outline: none; color: #11142D; background-color: #fff; } .config #v-pills-tab .nav-link { width: 60px; height: 60px; display: flex !important; justify-content: center; align-items: center; border-radius: 50% !important; background-color: #fff !important; padding: 5px !important; position: relative; margin-bottom: 30px; } .config #v-pills-tab .nav-link.active { background-color: var(--main-color) !important; -webkit-transition: background-color 500ms linear; -ms-transition: background-color 500ms linear; transition: background-color 500ms linear; } .config #v-pills-tab .nav-link .item { width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; border-radius: 50%; background-color: var(--main-black-color); color: var(--main-white-color); border: 3px var(--main-white-color) solid; z-index: 1; } .config #v-pills-tab .nav-link::after { content: ""; width: 5px; height: 86px; display: block; background-color: var(--main-color); color: var(--main-color); position: absolute; bottom: 5px; } .config #v-pills-tab .nav-link:first-child::after { content: counter(step); counter-increment: step; width: 5px; height: 86px; background-color: var(--main-color); color: var(--main-color); position: absolute; bottom: 5px; display: none; } .config #v-pills-tab .nav-link.active .item { background-color: var(--main-color); -webkit-transition: background-color 500ms linear; -ms-transition: background-color 500ms linear; transition: background-color 500ms linear; } .config .partial-preview { width: 300px; position: absolute; top: 0; } .config .partial-body { border: none; width: 100%; min-height: 100vh; } #theme_cont_config { overflow: scroll; height: 380px; padding-bottom: 20px !important; margin-bottom: 40px !important; } .btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, .show > .btn-outline-primary.dropdown-toggle { color: #fff !important; background-color: var(--main-color) !important; border-color: var(--main-color) !important; } .btn-outline-primary { color: var(--main-color) !important; border-color: var(--main-color) !important; background-color: var(--main-white-color) !important; } #BackgroundTab { display: flex; justify-content: start; align-items: center; } #BackgroundTab .nav-link { color: var(--main-gray-color); background: none; border: none; } #BackgroundTab .nav-link h4 { margin: 0; } #BackgroundTab .nav-link.active { color: var(--main-color); border-bottom: 2px solid var(--main-color); } #show-preview img { width: 23px; } .gallery-item { cursor: pointer; } .input-copy { display: flex; justify-content: center; align-items: center; width: 100%; } .input-copy input[type=text] { width: calc(100% - 120px); border: 1px solid var(--main-color); border-right: 0; border-radius: 10px; height: 45px; background: #fff; color: black; border-top-right-radius: 0px; border-bottom-right-radius: 0px; } .input-copy button { width: 120px; border: 1px solid var(--main-color); border-radius: 10px; height: 45px; background: #FCFBFF; color: var(--main-color); border-top-left-radius: 0px; border-bottom-left-radius: 0px; outline: none; } .input-copy button { outline: none !important; background: #FCFBFF !important; color: var(--main-color) !important; border-color: var(--main-color) !important; } .input-copy input:active, .input-copy input:focus { outline: none !important; color: var(--main-color) !important; border-color: var(--main-color) !important; } #share-btn, #share-btn i:before { color: #fff; font-size: 18px; } .icon-messages-chat:before { color: #fff !important; } #_live_form .color-item { width: 30px; height: 30px; border-radius: 50%; margin: 0; } #_live_form .color-item-cont { width: 36px; height: 36px; border-radius: 50%; display: flex; justify-content: center; align-items: center; margin: 5px 10px 5px 5px; float: left; } #_live_form .color-item-cont.active { border: 2px solid var(--main-color); } #form_live_cont { min-height: 100vh; width: 100vw; display: flex; justify-content: center; align-items: flex-start; background-position: center center; background-repeat: no-repeat; background-size: cover; } #form_live_box { background-color: #fff; border-radius: 15px; margin: 50px 0; width: 90%; max-width: 900px; min-height: 75vh; } #form_live_box_cont { max-width: 750px; margin: auto; display: block } #current_quest { min-height: 185px; width: 100%; border: 1px solid var(--main-gray-light-color); border-radius: 6px; } #current_quest .quest { padding: 20px 10px; } #current_quest .reactions { width: 100%; display: flex; justify-content: center; align-items: center; } #current_quest .reactions_cont { width: 100%; display: flex; justify-content: flex-start; align-items: center; margin-top: 25px; } #current_quest .reactions_cont button img { width: 23px; margin-right: 7px; } #current_quest .reactions_cont button { display: flex; justify-content: flex-start; align-items: center; border: none; background: none; padding-left: 15px; position: relative; z-index: 1; padding: 10px; margin-left: 10px; color: #fff; } #current_quest .reactions_cont button:before { content: " "; position: absolute; top: 0; left: 0; width: 100%; padding: 10px; height: 40px; border-radius: 45px; opacity: .7; z-index: -1; } #current_quest .reactions_cont button span { min-width: 25px; } #current_quest + .controls { width: 100%; display: flex; justify-content: center; align-items: center; padding: 10px 0; } #current_quest + .controls button { display: flex; align-items: center; color: #fff; border: none; padding: 10px; width: 100px; height: 45px; justify-content: center; } #current_quest + .controls button i { font-size: 20px; } #current_quest + .controls #prev_quest { border-top-left-radius: 20px; border-bottom-left-radius: 20px; justify-content: flex-start; } #current_quest + .controls #next_quest { border-top-right-radius: 20px; border-bottom-right-radius: 20px; justify-content: flex-end; } .quest_approve_item { width: 100%; display: flex; justify-content: flex-start; align-items: center; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 10px; background-color: #fff; margin: 15px 0; min-height: 135px; } .quest_approve_item .data { width: 100%; border-left: 1px solid rgba(0, 0, 0, 0.1); padding: 10px; } .quest_approve_item .position { padding: 10px; width: 15px; display: flex; justify-content: center; align-items: center; cursor: move; height: 133px; } .quest_approve_item .position span { writing-mode: vertical-lr; font-size: 25px; font-weight: 500; padding-left: 15px; color: rgba(0, 0, 0, 0.2); } .quest_approve_item .data p { margin: 0; display: block; } .quest_approve_item .btn-show { display: flex; justify-content: flex-end; align-items: center; margin-left: auto; margin-top: 20px; } .quest_approve_item .btn-show button { border-radius: 10px; border: none; outline: none; color: var(--main-white-color); padding: 10px; height: 45px; font-size: 13px; font-weight: 500; } .quest_approve_item .btn-show button i:before { font-size: 24px; color: var(--main-white-color); } .quest_approve_item small { color: var(--main-gray-color); } #form_live_add_quest input[type=text], #form_live_add_quest textarea { font-size: 14px !important; line-height: 18px !important; color: var(--main-black-color) !important; border-radius: 6px !important; border: 1px solid var(--main-gray-light-color) !important; min-height: 45px !important; font-weight: 500 !important; } #form_live_add_quest input[type=text]::placeholder, #form_live_add_quest textarea::placeholder { color: var(--main-gray-light-color) !important; font-weight: 500 !important; } #form_live_add_quest button { border-radius: 6px; height: 45px; padding: 10px 25px; outline: 0; color: #fff; font-weight: 700; border: none; } #form_live_add_quest button:disabled { opacity: 0.5 } .quest_wait_item { width: 100%; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 10px; padding: 10px; margin: 15px 0; } .quest_wait_item .reactions { display: flex; align-items: center; justify-content: flex-end; margin-top: 20px; } .quest_wait_item p { margin: 0; margin-left: auto; display: block; } .quest_wait_item small { color: var(--main-gray-color); } .quest_wait_item .reactions button { display: flex; justify-content: flex-start; align-items: center; border: none; background: none; height: 45px; font-size: 13px; font-weight: 500; } .quest_wait_item .reactions button.approve { border-radius: 10px; color: #fff; margin-left: 15px; } .quest_wait_item .reactions button.deny { color: var(--main-black-color); } .question_actual { margin-top: 20px; min-width: 80%; } .home_form_live .question_actual h4 { text-align: center; color: var(--main-gray-color); margin: 0; } .home_form_live .question_actual h2 { text-align: center; font-weight: 700 !important; } .question_actual p { font-weight: 600; font-size: 16px; line-height: 24px; text-align: center; color: var(--main-gray-color); margin: 0; } .question_actual h4 { /*font-weight: 600; font-size: 32px;*/ line-height: 48px; text-align: center; } .moderator h4, .audience h4 { /*font-style: normal; font-weight: 700; font-size: 23px;*/ line-height: 34px; text-align: center; color: var(--main-black-color); } .moderator h6, .audience h6 { line-height: 24px; text-align: justify; color: #808080; } .reaction-play button { border: none; background: none; padding: 5px; margin-right: 15px } .reaction-play img { width: 45px; transition: transform .2s; } .reaction-play img:hover { transform: scale(1.5); } #question_sended, #comment_sended { display: block; visibility: hidden; opacity: 0; transition: visibility 0s linear 0.33s, opacity 0.33s linear; background-color: var(--main-white-color); position: absolute; top: 0; bottom: 0; left: 0; right: 0; } #question_sended.active, #comment_sended.active { visibility: visible; opacity: 1; transition-delay: 0s; } #question_sended p, #comment_sended p { width: auto; padding: 15px; font-weight: 700; } .dot-stretching { position: relative; width: 10px; height: 10px; border-radius: 5px; transform: scale(1.25, 1.25); animation: dotStretching 2s infinite ease-in; } .dot-stretching::before, .dot-stretching::after { content: ''; display: inline-block; position: absolute; top: 0; } .dot-stretching::before { width: 10px; height: 10px; border-radius: 5px; animation: dotStretchingBefore 2s infinite ease-in; } .dot-stretching::after { width: 10px; height: 10px; border-radius: 5px; animation: dotStretchingAfter 2s infinite ease-in; } @keyframes dotStretching { 0% { transform: scale(1.25, 1.25); } 50%, 60% { transform: scale(0.8, 0.8); } 100% { transform: scale(1.25, 1.25); } } @keyframes dotStretchingBefore { 0% { transform: translate(0) scale(0.7, 0.7); } 50%, 60% { transform: translate(-20px) scale(1, 1); } 100% { transform: translate(0) scale(0.7, 0.7); } } @keyframes dotStretchingAfter { 0% { transform: translate(0) scale(0.7, 0.7); } 50%, 60% { transform: translate(20px) scale(1, 1); } 100% { transform: translate(0) scale(0.7, 0.7); } } #live_data, #live_controls { background-color: rgba(27, 29, 33,0.7); border-radius: 20px; padding: 10px 15px; position: absolute; display: flex; justify-content: center; align-items: center; bottom: 20px; } #live_data { right: 20px; } #live_controls { left: 20px; } #live_data button, #live_controls button { border: none; background: none; color: var(--main-white-color); margin-right: 20px; display: flex; justify-content: center; align-items: center; } #live_data button span { padding-left: 5px; } #live_data button i, #live_data button i:before, #live_controls button i, #live_controls button i:before { color: var(--main-white-color); font-size: 18px; } #rezize { display: none !important; } #rezize.active { display: block !important; } #fullscreen { display: none !important; } #fullscreen.active { display: block !important; } @-webkit-keyframes newComment { 0% { margin-top: 100vh; } 100% { margin-top: 10px; } } @-webkit-keyframes glide1 { 0% { right: 30px; bottom: 0; opacity: 0; } 20% { opacity: 0.4; right: 45px; } 40% { opacity: 1; right: 55px; } 60% { opacity: 1; right: 66px; } 80% { opacity: 1; right: 55px; } 100% { bottom: 100vh; opacity: 0; right: 15px; } } @-webkit-keyframes glide2 { 0% { right: 0px; bottom: 0; opacity: 0; } 20% { opacity: 0.4; right: 50px; } 40% { opacity: 1; right: 30px; } 60% { opacity: 1; right: 90px; } 80% { opacity: 1; right: 100px; } 100% { bottom: 100vh; opacity: 0; right: 45px; } } @-webkit-keyframes glide3 { 0% { right: 0px; bottom: 0; opacity: 0; } 20% { opacity: 0.4; right: 75px; } 40% { opacity: 1; right: 133px; } 60% { opacity: 1; right: 23px; } 80% { opacity: 1; right: 3px; } 100% { bottom: 100vh; opacity: 0; right: 15px; } } #comments_container { display: flex; flex-direction: column; position: absolute; left: 15px; top: 0; } #comments_container .comment { opacity: 1; -webkit-animation: newComment 1.5s ease-in-out; background-color: rgba(27, 29, 33,0.7); border-radius: 6px; padding: 10px 15px; color: #fff; margin-top: 10px; width: 370px; position: relative; padding-top: 30px; } #comments_container .comment .close { position: absolute; right: 15px; top: 5px; font-weight: 300; color: #fff; } #comments_container .comment .media-body { width: calc(100% - 50px); padding-left: 18px; padding-bottom: 10px; } #comments_container .comment img { width: 50px; height: 50px; border-radius: 50%; } #comments_container .comment .header { display: flex; align-items: center; } #comments_container .comment .header h5 { /*font-size: 1rem; font-weight: 600;*/ color: var(--main-white-color); margin-bottom: 0px !important; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } #comments_container .comment .header small { margin-left: auto; display: block; color: var(--main-white-color); padding-left: 15px; } #comments_container .comment .text { font-size: 0.95rem; font-weight: 400; color: var(--main-white-color); margin: 0; word-wrap: break-word; width: 100%; margin-top: 3px; } #reaction_container .reaction { width: 100px; position: absolute; opacity: 0; } #reaction_container .reaction.p3 { -webkit-animation: glide3 3s ease-in-out; } #reaction_container .reaction.p2 { -webkit-animation: glide2 2.5s ease-in-out; } #reaction_container .reaction.p1 { -webkit-animation: glide1 3s ease-in-out; } .alert-audi { position: relative; z-index: 0; color: var(--main-black-color); } .alert-audi a { color: var(--main-black-color); font-weight: 700 } .alert-audi:before { position: absolute; top: 0; left: 0; width: 100%; padding: 10px; height: 100%; display: block; border-radius: 10px; opacity: .7; z-index: -1; content: " "; } .container-radius { padding: 10px; background-color: #fff; border-radius: 6px; -webkit-box-shadow: 1px 4px 8px rgba(0,0,0,0.25); box-shadow: 1px 4px 8px rgba(0,0,0,0.25); } #form_live_details .dashboard .data { height: 100%; } #form_live_details .dashboard .data p { width: 100%; font-size: 15px; font-weight: 300; text-align: center; } #form_live_details .dashboard .data p span { width: 100%; font-size: 32px; font-weight: 700; text-align: center; } #form_live_details .dashboard .data .border .col-6 { border: 2px solid; } #form_live_details .dashboard .data .border .col-6:last-child { border: 2px solid; opacity: 0.5; } .quest-data { display: flex; justify-content: flex-start; align-items: center; margin: 15px 0; } .quest-data .body strong { font-weight: 500; } .quest-data .body p { margin: 0; } .quest-data .counter { display: flex; justify-content: center; align-items: center; font-size: 25px; font-weight: 700; text-align: center; margin-left: auto; } .quest-header { color: #808080; } .sub_comment img { width: 30px; height: 30px; border-radius: 50%; } .sub_comment p, .sub_comment small { margin: 0; word-wrap: break-word; } .quest-item { width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; } .quest-item .body { width: 100%; } .quest-item .body p { width: 100%; margin: 0; } .quest-item .ico { width: 45px; height: 45px; background-color: #6C5DD3; border-radius: 50%; display: flex; justify-content: center; align-items: center; opacity: 0.7 } .quest-item .ico i { color: #fff; font-size: 24px; } .quest-item .comm { width: 100%; display: none; } .card.integration a { width: auto; padding: 10px 12px; cursor: pointer; border-radius: 8px; color: #fff; text-align: center; } .card.integration a.connect { background-color: #7FBA7A; } .card.integration a.disconnected { background-color: #FF754C; } .popover.transparency { background-color: rgba(0,0,0,0.7) !important; color: #fff; } .popover.transparency > .arrow::after, .popover.transparency[x-placement^="left"] > .arrow::after { border-left-color: rgba(0,0,0,0.7) !important; } .btn-transparency { border: none; background-color: rgba(0,0,0,0.7); cursor: pointer; color: #fff; margin: 0; border-radius: 50%; padding: 15px; position: absolute; right: 10px; bottom: 10px; display: flex; justify-content: center; align-items: center; } .popover.transparency .arrow:after { border-right-color: rgba(0,0,0,0.7) !important; } .cover .btn-transparency { top: 10px; bottom: inherit; color: var(--main-white-color) } .cover .btn-transparency span { color: var(--main-white-color) } .btn-clean-out:hover { color: #fff !important; } .icon_options.btn-transparency { background: var(--main-black-color); color: var(--main-white-color); position: absolute; width: 100%; height: 100%; } .form-icon .icon_options.btn-transparency { font-size: 12px !important; left: auto; right: auto; top: auto; bottom: auto; opacity: 0; } .form-icon .icon_options.btn-transparency:hover { opacity: 1; } .group #settings .media { display: flex; align-items: center; justify-content: flex-start; } .group #settings .media img.group_icon { width: 85px; border-radius: 50%; margin: 0 !important } #image-back { max-width: 345px; width: 100%; height: 195px; margin: 0 auto; display: block; border-radius: 5px; opacity: 0; } #image-back.active { opacity: 1; } .form_live_option { width: 100%; display: block; } .form_live_option button, .form_live_option a { width: 100%; display: block; padding: 3px; color: #000000; background: none; border: none; margin: 5px 0 !important; text-align: start; } .form_live_option button i, .form_live_option a i, .form_live_option button i:before, .form_live_option a i:before { color: #000000 !important; padding-right: 5px; } .card-opt { font-size: 35px; line-height: 1px; } /*.me-table-outline thead th { text-align: start !important; }*/ #all_live_forms .icon-users, #all_live_forms .icon-users:before { color: #000; } .btn-clean-out { cursor: pointer; color: #fff; } #ChatModal-body .member-item { display: flex; justify-content: flex-start; align-items: center; padding: 5px; margin-bottom: 5px; } #ChatModal-body .member-item.selector { display: flex; justify-content: flex-start; align-items: center; padding: 0 5px; margin: 10px 0; } #ChatModal-body .member-item.selector { cursor: pointer; } #ChatModal-body .member-item .profile_picture { padding-right: 10px; } #ChatModal-body .member-item .profile_picture img { height: 35px; width: 35px; display: block; margin: auto; border-radius: 50%; } #ChatModal-body .member-item .info { width: calc(100% - 45px); } #ChatModal-body .member-item.selector .info { width: calc(100% - 90px); } #ChatModal-body .member-item .info p { text-transform: capitalize; } #ChatModal-body .member-item.selector .buttons { height: 45px; width: 35px; display: flex; justify-content: center; align-items: center; padding-left: 10px; } #ChatModal-body .member-item.selector .buttons .content-input input[type=radio] + i:before { background: var(--main-color) !important; } #ChatModal-body .member-item.selector .buttons .content-input input[type=radio] + i { height: 18px; width: 18px; } #ChatModal-body h4 { font-size: 14px !important; text-align: center; } .modal.full .modal-header { border-bottom: none !important; } .search_box { -webkit-box-shadow: 5px 2px 10px 0px #d0d3d8; box-shadow: 5px 2px 10px 0px #d0d3d8; transition: all 1s ease-in; border-radius: 5px; position: relative; width: 100%; z-index: 2; } .search_box .controls { display: flex; justify-content: flex-start; align-items: center; border-radius: 5px; } .search_box .controls input { height: 40px; background: #fff; border: 0; width: 100%; border-radius: 50%; outline: none; padding: 0; text-indent: 15px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; } .search_box .controls div { height: 40px; width: 50px; border-left: 0; display: flex; justify-content: center; align-items: center; border-top-right-radius: 5px; border-bottom-right-radius: 5px; } .search_box .controls div i { color: var(--main-color); border-radius: 15px; } .search_box .result { position: absolute; background: #fff; left: 0; right: 0; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; -webkit-box-shadow: 5px 2px 10px 0px #d0d3d8; box-shadow: 5px 2px 10px 0px #d0d3d8; } #users_to_add, #new_chat_users_to_add { display: flex; justify-content: flex-start; overflow-x: scroll; } #users_to_add .item_user, #new_chat_users_to_add .item_user { width: 50px; margin-right: 17px; position: relative; margin-bottom: 10px; } #users_to_add .item_user img, #new_chat_users_to_add .item_user img { width: 45px; height: 45px; border-radius: 50%; } #users_to_add .item_user p, #new_chat_users_to_add .item_user p { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-size: 11px !important; margin: 0; } #users_to_add .item_user span.close, #new_chat_users_to_add .item_user span.close { position: absolute; right: -10px; top: -5px; background-color: #fff; height: 20px; width: 20px; border-radius: 50%; cursor: pointer; } .chat_menu { } .msg-options .btn-clean, .chat_menu .btn-clean { font-size: 13px !important; padding: 10px 10px !important; width: 100%; } .popover.msg-options, .popover.chat_menu { padding: 5px !important; } #ImageModal { display: none; position: fixed; z-index: 9; padding-top: 100px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.7); } #ImageModal .content { margin: auto; display: block; max-width: 700px; max-height: 70vh; } #ImageModal .content img { margin: auto; display: block; max-width: 700px; max-height: 70vh; } #ImageModal #caption { margin: auto; display: block; max-width: 700px; max-height: 70vh; text-align: center; color: #ccc; padding: 10px 0; height: 150px; } #ImageModal .content, #caption { animation-name: zoom; animation-duration: 0.6s; } @keyframes zoom { from { transform: scale(0) } to { transform: scale(1) } } /* The Close Button */ #ImageModal .close { position: absolute; top: 15px; right: 35px; color: #fff; font-size: 40px; font-weight: 500; transition: 0.3s; } #ImageModal .close:hover, #ImageModal .close:focus { color: #fff; text-decoration: none; cursor: pointer; } .chat_back_ico { display: none; } #chat_picture_container .btn_show_photos i, #chat_picture_container .btn_show_photos i:before { font-size: 22px; } #show_more_request, #show_more_friends { color: var(--main-color) } #BtnNewChat { width: 35px; height: 35px; padding: 6px; } #BtnNewChat i, #BtnNewChat i:before { color: #fff; font-size: 18px; } #info_chat, .side_bar_chat { display: none; } .room_data .close { display: none; } .chat_link { background-color: var(--main-color); padding: 10px 12px; border-radius: 6px; cursor: pointer; margin-bottom: 3px; max-width: 449px; } .left .chat_link { background-color: var(--main-gray-light-color); padding: 10px 12px; border-radius: 6px; cursor: pointer; margin-bottom: 3px; } .chat_link a { display: flex !important; align-items: center; color: var(--main-white-color) !important; } .chat_link img { width: 100px; max-height: 150px; border-radius: 8px; display: block; margin: auto; } .chat_link h5 { font-size: 14px !important; } .chat_link p { font-size: 13px !important; margin: 0 !important; } #NewChatGroup_Btn { padding: 10px 0 !important; display: flex; align-items: center; color: var(--main-black-color); } #NewChatGroup_Btn i, #NewChatGroup_Btn i:before { color: var(--main-black-color); } .chat_menu button { text-align: start !important; } #send_message { display: flex; justify-content: center; align-items: center; } #send_message .spinner-border { width: 1rem; height: 1rem; color: var(--main-white-color); } .groups .btn-clean { font-size: 14px !important; } .card_group { cursor: pointer; text-decoration: none; display: flex; justify-content: flex-start; align-items: center; margin-bottom: 15px; } .card_group .picture { width: 45px; display: flex; justify-content: center; align-items: center; } .card_group .picture img { width: 100%; border-radius: 50%; } .card_group .info { width: calc(100% - 45px); padding-left: 10px; } .card_group .info p.name { margin: 0 !important; color: var(--main-black-color); text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-weight: 600 !important; } .card_group .info p.description { color: var(--main-gray-light-color); overflow: hidden; line-height: 2.5ex; max-height: 7.5ex; font-weight: initial !important; margin: 0 !important; } .post { width: 100%; padding: 20px; border-radius: 6px; margin-bottom: 10px; background-color: var(--main-white-color); position: relative; } .post .post_load { display: none; background-color: rgba(255,255,255,0.5); position: absolute; top: 0; bottom: 0; left: 0; right: 0; justify-content: center; align-items: center; } .post .header { display: flex; justify-content: flex-start; align-items: flex-start; } .post .header .user_data { width: calc(100% - 30px); display: flex; justify-content: flex-start; align-items: flex-start; } .post .header .picture { width: 45px; display: flex; justify-content: center; align-items: center; } .post .header .picture img { width: 100%; border-radius: 50%; } .post .header .name { width: calc(100% - 45px); padding-left: 10px; } .post .header a { width: fit-content; display: block; margin-right: auto; } .post .header .name .username { margin: 0 !important; color: var(--main-black-color); text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-weight: 600 !important; display: flex; align-items: center; text-transform: capitalize; } .post .header .name p { color: var(--main-gray-light-color); overflow: hidden; line-height: 2.5ex; max-height: 7.5ex; font-weight: initial !important; margin: 0 !important; display: flex; align-items: center; } .post .header .options { width: 30px; display: flex; justify-content: flex-end; align-items: center; } .post .header .options button { padding-right: 0 !important; margin-right: -5px; } .post .header .options button i, .post .header .options button i:before { font-size: 25px; color: var(--main-gray-color) } .post .body { width: 100%; } .post .verify-profile { margin-left: 5px !important; margin-right: 5px !important; } .badge.badge-primary { background-color: var(--main-color) !important; color: var(--main-white-color) !important; padding: 4px; font-weight: 400 !important; } .post .body .text { width: 100%; font-size: 16px !important; white-space: pre-line; } .post .body .image-col { padding-left: 4px !important; padding-right: 4px !important; margin-bottom: 8px; } .post .body .image-col .image { width: 100%; border-radius: 6px; background-size: cover; background-repeat: no-repeat; background-position: center top; display: block; margin: auto; height: 0; padding-top: 66.64%; position: relative; } /* .post .body .image-col.hp-1 .image { height: 450px; } .post .body .image-col.hp-2 .image { height: 300px; } .post .body .image-col.hp-3 .image { height: 200px; }*/ .post .body .analitycs_post { width: 100%; display: flex; align-items: center; } .post .body .analitycs_post .reactions_analitycs { display: flex; align-items: center; justify-content: flex-start; margin-right: auto; } .post .body .analitycs_post .reactions_analitycs img { width: 30px; height: 30px; margin-bottom: 3px; } .post .body .buttons button { color: var(--main-gray-color); margin: auto; display: block; } .post .body .buttons button i, .post .body .buttons button i:before { color: var(--main-gray-color); } .post .body .buttons button img { width: 22px; } #_commentReport .post { width: 100%; padding: 10px; border-radius: 6px; margin-bottom: 0px; background-color: var(--main-white-color); position: relative; border: 1px solid var(--main-gray-light-color); margin: 10px 0; } .post .comment_box { width: 100%; display: none; } .post .comment_box .new_comment_box { width: 100%; padding: 15px 0; } .post .comment_box hr { margin-top: 0.5rem !important; margin-bottom: 0.5rem !important; } .post .comment_box .new_comment_box .inputs { display: flex; justify-content: flex-start; align-items: center; width: 100%; } .post .comment_box .new_comment_box .file_preview { display: flex; justify-content: flex-start; align-items: center; width: 100%; padding-left: 45px; padding-right: 55px; } .post .comment_box .new_comment_box .file_preview img { max-height: 200px; max-width: 100%; min-width: 100px; margin: 15px 5px 15px; border-radius: 5px; } .post .comment_box .new_comment_box .inputs img { width: 34px; height: 34px; border-radius: 50%; margin-right: 10px; } .post .comment_box .new_comment_box input[type=text] { border-bottom-left-radius: 14px; border-top-left-radius: 14px; border: 1px solid; border-color: var(--main-gray-light-color); background: var(--main-white-color); height: 45px; border-right: 0; width: calc(100% - 79px); outline: none; padding: 10px 15px; } .post .comment_box .new_comment_box input[type=text]:focus { outline: none; border-color: var(--main-color); } .post .comment_box .new_comment_box label { border-bottom-right-radius: 14px; border-top-right-radius: 14px; border: 1px solid; border-color: var(--main-gray-light-color); background: var(--main-white-color); height: 45px; width: 35px; border-left: 0; margin: 0; display: flex; justify-content: center; align-items: center; cursor: pointer; } .post .comment_box .new_comment_box input[type=text]:focus + label { outline: none; border-color: var(--main-color); } .post .comment_box .new_comment_box label i, .post .comment_box .new_comment_box label i:before { color: var(--main-color); } .post .comment_box .new_comment_box .send { border-radius: 50%; height: 45px; width: 45px; background: var(--main-gray-light-color); margin: 0; margin-left: 10px; border: none; justify-content: center; align-items: center; cursor: pointer; display: none; } .post .body .comment_btn { cursor: pointer; } .post .comment_box.active { display: flex; } .post .comment_box.active .new_comment_box .send { display: flex; } .post .comment_box.active .new_comment_box .send.active { background: var(--main-color); } .post .comment_box.active .new_comment_box .send.active span { color: var(--main-color) !important; } .post .comment_box.active .new_comment_box .send.active span:before { color: var(--main-color) !important; } .post .comment_box.active .new_comment_box input[type=text] { width: calc(100% - 124px); } .post .comment_box .new_comment_box .send i, .post .comment_box .new_comment_box .send i:before { color: var(--main-white-color); } .post .comment_box .new_comment_box.active .send, .post .comment_box .new_comment_box.active .send { background: var(--main-color); } .post .comment_box .comment { margin-top: 15px; display: flex; justify-content: flex-start; position: relative; align-items: flex-start; } .post .comment_box .comment .picture { width: 35px; display: flex; justify-content: center; align-items: center; height: 100%; position: relative; } .post .comment_box .comment .comm_options { position: absolute; right: 0; } .post .comment_box .comment .comm_options button { font-size: 19px !important; color: var(--main-gray-color); } /*.post .comment_box .comment .picture.HasComments:before { content: ''; width: 2px; height: 120px; background: var(--main-color); position: absolute; left: 18px; top: 34px; opacity:0.3; }*/ .post .comment_box .comment .picture img { width: 100%; border-radius: 50%; padding-top: 3px; } .post .comment_box .comment.new_comment_container { padding-left: 10px; padding-right: 10px; width: 100%; margin-left: 10px; } .post .comment_box .comment.list_replys { padding-left: 10px; padding-right: 10px; width: 100%; margin-left: 10px; } /*.new_comment_container:before { content: ''; height: 2px; width: 15px; background: var(--main-color); position: absolute; left: -15px; opacity: 0.3; top: 37px; }*/ .post .comment_box .comment .info { width: calc(100% - 45px); } .post .comment_box .comment .data { padding-left: 10px; padding-right: 10px; width: 100%; margin-left: 10px; border-radius: 8px; } .post .comment_box .comment .data p.username { margin: 0 !important; color: var(--main-black-color); text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-weight: 600 !important; display: flex; align-items: center; text-transform: capitalize; margin-bottom: 5px !important; } .post .comment_box .comment .data p.date { color: var(--main-gray-light-color); overflow: hidden; font-weight: initial !important; margin: 0 !important; display: flex; align-items: center; font-size: 12px !important; margin-bottom: 5px !important; } .post .comment_box .comment .data p.username span { font-weight: 300 !important; font-size: 12px; margin-left: 5px !important; } .post .comment_box .comment .data p.text span { font-size: 15px !important; } .post .comment_box .comment .data p.text span.body-text { color: var(--main-black-color); overflow: hidden; line-height: 2.5ex; max-height: 7.5ex; font-weight: initial !important; margin: 0 !important; display: block; } .post .comment_box .comment .data p.text span.body-text.full { max-height: inherit !important; } .post .comment_box .comment .data p.text span.see_alltext_comment { padding: 0 !important; padding-left: 3px !important; color: var(--main-color) !important; cursor: pointer; } .post .comment_box .comment .image_comm { max-width: 100%; max-height: 150px; margin: 10px 0; border-radius: 5px; } .post .comment_box .comment .top_comment_reaction_cont { display: flex; align-items: center; justify-content: flex-end; } .post .comment_box .comment .top_comment_reaction_cont .react { display: flex; align-items: center; border-radius: 15px; padding: 5px; background-color: var(--main-gray-light-color); color: var(--main-white-color); } .post .comment_box .comment .top_comment_reaction_cont .react span { color: var(--main-white-color) !important; } .post .comment_box .comment .top_comment_reaction_cont .react img { width: 17px; height: 17px; } .post .comment_box .comment .buttons { display: flex; align-items: flex-end; justify-content: flex-start; } .post .comment_box .comment .buttons button { margin: 0 !important; margin-right: 10px !important; font-size: 12px !important; padding: 5px !important; padding-left: 5px !important; padding-bottom: 0px !important; } .post .comment_box .comment .buttons button i, .post .comment_box .comment .buttons button i:before { color: var(--main-black-color); } .post #btn_send_post { color: var(--main-white-color) !important; } .post #btn_send_post span, .post #btn_send_post span:before { color: var(--main-white-color) !important; } .post .file_item { cursor: default; margin: 5px 0; } .post .file_item .info small a { font-size: 13px; color: var(--main-color); } .post .file_item .picture i, .post .file_item .picture i:before { font-size: 50px !important; color: var(--main-gray-color); } .popover_options { padding: 10px !important } .popover_options hr { margin-top: 0.3rem !important; margin-bottom: 0.3rem !important; } .popover_options button, .popover_options a { width: 100%; display: flex; align-items: center; justify-content: flex-start; padding: 5px !important; font-weight: 400 !important; font-size: 14px !important; opacity: 1 !important; } .popover_options a i, .popover_options button i, .popover_options a i:before, .popover_options button i:before { color: var(--main-gray-color); } .list_reactions { /*width:100%;*/ display: flex; align-items: center; } .list_reactions .reaction.post_circle { padding: 2px; } .list_reactions .reaction.post_circle img { border-radius: 50%; width: 45px; transition: transform .2s; } .list_reactions .reaction.post_circle img:hover { transform: scale(1.4); } .group { width: 100%; max-width: 900px; display: block; margin: auto } .group .cover { height: 300px; width: 100%; background-position: top center; background-repeat: no-repeat; background-size: cover; border-top-left-radius: 8px; border-top-right-radius: 8px; } .group .header_info { width: 100%; padding: 20px; padding-bottom: 0 !important; background-color: #fff; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; } .group .header_info .picture { width: 100%; display: flex; align-items: flex-end; margin-top: -75px; } .group .header_info .picture img { width: 120px; border-radius: 50%; border: 6px solid #fff; position: relative; } .group .header_info .picture i, .group .header_info .picture i:before { color: var(--main-gray-color); font-size: 30px; margin-top: -26px; } .group .header_info .picture i.icon-Search, .group .header_info .picture i.icon-Search:before { font-size: 23px !important; } .group .header_info .name { color: var(--main-black-color); text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-weight: 600 !important; } .group .header_info .name a, .group .header_info .name a:hover { color: var(--main-black-color) !important; } .group .header_info .description { color: var(--main-gray-color); } .group .header_info .description i, .group .header_info .description i:before { color: var(--main-gray-color); } .group .nav-link, .group .nav-link.active { padding-bottom: 0 !important; padding-left: 0 !important; padding-right: 25px !important; } .group .nav-link h4, .group .nav-link.active h4 { margin-bottom: 0 !important; } .group .nav-link.active h4 { border-bottom: 4px solid var(--main-color) !important; padding-bottom: 10px; } .group .feed { border-radius: 8px; margin: 20px 0; } .group .new_group_box { margin-bottom: 30px; width: 100%; background-color: #fff; border-radius: 8px; } .group .new_group_box .input { display: flex; justify-content: flex-start; align-items: center; width: 100%; padding: 20px; padding-bottom: 5px; } .group .new_group_box .input img { width: 45px; height: 45px; border-radius: 50%; margin-right: 10px; } .group .new_group_box input[type=text] { border: 1px solid; border-color: var(--main-color); color: var(--main-black-color); background: var(--main-white-color); height: 45px; width: calc(100% - 55px); outline: none; padding: 10px 15px; border-radius: 14px; cursor: pointer; } .group .new_group_box input[type=text]::placeholder { color: var(--main-color); } .group .new_group_box input[type=text]:focus { outline: none; } .group .new_group_box .btns { display: flex; justify-content: flex-start; align-items: center; width: 100%; padding: 0 20px; padding-left: 65px; } .group .new_group_box .btns button { display: flex; justify-content: center; align-items: center; } .group .new_group_box .col-6 button i, .group .new_group_box .col-6 button i:before { color: #000; } #ModalGroups .post { padding: 0 !important; } #ModalGroups .modal-body { padding-top: 0 !important; } .new_post .input_file { border-radius: 8px; } .new_post .file_container { border-radius: 8px; border: 1px solid var(--main-gray-light-color); padding: 10px; display: none; } .new_post .file_container.active { display: flex; } #ModalGroups .add_to_post { width: 100%; font-size: 11px; border-radius: 8px; border: 1px solid var(--main-gray-light-color); padding: 10px; margin: 15px 0; display: none; align-items: center; justify-content: flex-start; } #ModalGroups .add_to_post.active { display: flex; } #ModalGroups .add_to_post p { font-size: 11px !important; margin: 0 !important; } #ModalGroups .add_to_post button { font-size: 12px !important; display: flex; align-items: center; justify-content: flex-start; opacity: 1 !important; } #ModalGroups .add_to_post button p { font-size: 12px !important; color: var(--main-gray-color); } #ModalGroups .add_to_post button i, #ModalGroups .add_to_post button i:before { margin-left: auto; display: block; color: var(--main-gray-color); font-size: 17px; } #form_new_post .header .user_data { align-items: center; } #form_new_post .me-error p { font-size: 12px !important; font-weight: inherit !important; } .new_post .file-cont .input_file { display: none; } .new_post .file_container .input_file.active { border: none !important; display: block; } .new_post .file-cont .input_file:hover { border: none !important; background-color: var(--main-bg-color); } .new_post .file-cont small { font-size: 11px !important; } .new_post textarea { border: none; width: 100%; margin: 10px 0; padding: 5px; outline: none; font-size: 14px; } .new_post textarea::placeholder { color: var(--main-gray-light-color) } .new_post textarea:focus, .new_post textarea:active { outline: none; } .new_post .file-cont .picture i, .new_post .file-cont .picture i:before { font-size: 48px; cursor: pointer; } .new_post .image_item .image { width: 100%; border-radius: 6px; background-size: cover; background-repeat: no-repeat; background-position: center top; height: 0; padding-top: 66.64%; } /*.new_post .image_item.hp-1 .image { height: 200px; } .new_post .image_item.hp-2 .image { height: 150px; } .new_post .image_item.hp-3 .image { height: 100px; }*/ .new_post .image_item { padding-left: 4px !important; padding-right: 4px !important; margin-bottom: 8px; } .more_images_div { background: rgba(0,0,0,0.5); color: #fff; font-size: 35px; display: flex; justify-content: center; align-items: center; height: 100%; width: 100%; position: absolute; top: 0; } .new_post .close_cont { padding-left: 4px !important; padding-right: 4px !important; } .new_post .close_cont button { display: block; padding: 0 !important; } .new_post .close_cont button span { font-size: 25px; } .modal.carrousel { max-height: 85vh; } .modal.carrousel .modal-dialog { max-width: 1100px !important; } .modal.carrousel .modal-content { background-color: transparent !important; height: 80%; border: none !important; } .modal.carrousel button.close { position: absolute; top: 20px; right: 8%; z-index: 9; opacity: 1 !important; border-radius: 50%; border: 1px solid #fff; width: 30px; height: 30px; } .modal.carrousel button.close span { color: var(--main-white-color) !important; opacity: 0.8 !important; } .modal.carrousel button.close:hover span { color: var(--main-white-color) !important; opacity: 1 !important; } .modal.carrousel img.img-size { max-width: 100%; max-height: 100%; margin: auto; display: block; border-radius: 5px; } .modal.carrousel .carousel-item { height: 600px; padding: 60px 101px; } .modal.carrousel .carousel-item.active, .modal.carrousel .carousel-item-next, .modal.carrousel .carousel-item-prev { display: flex; } .modal.carrousel .carousel-control-prev, .modal.carrousel .carousel-control-next { top: 70px !important; } .partial-referral .table-me th { color: black !important; text-align: center; font-size: 16px !important; } .partial-referral .scrolling-wrapper { overflow-x: scroll; overflow-y: hidden; white-space: nowrap; } .partial-referral .table-me td { border: none; } .partial-referral .field { margin: 15px 0px 0px 0px; height: 45px; border: 1px solid #7400e2; border-radius: 5px; padding: 0 5px; padding-right: 0; } .partial-referral .field.active { border-color: #7d2ae8; } .partial-referral .field input { border: none; outline: none; font-size: 0.89rem; width: 75%; height: 100%; } .partial-referral .field button { width: 25%; padding: 0; color: #fff; background: #7d2ae8; border: 2px solid transparent; font-weight: 500; } .profile { margin-top: 20px; } .profile .profile-img-list:after, .profile .profile-img-list:before { content: ""; display: table; clear: both; } .profile .profile-img-list .profile-img-list-item { float: left; width: 50%; padding-left: 1rem; padding-right: 1rem; } .profile .profile-img-list .profile-img-list-item.main { width: 50%; } .profile .profile-img-list .profile-img-list-item.mainOne { width: 100%; } .profile .profile-img-list .profile-img-list-item .profile-img-list-link { display: block; padding-top: 37%; overflow: hidden; position: relative; margin-bottom: 1%; } .profile .profile-img-list .profile-img-list-item.main .profile-img-list-link { padding-top: 75%; } .profile .profile-img-list .profile-img-list-item .profile-img-list-link .profile-img-content, .profile .profile-img-list .profile-img-list-item .profile-img-list-link img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; max-width: 99%; background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 10px; } .profile .profile-img-list .profile-img-list-item .profile-img-list-link .profile-img-content:before, .profile .profile-img-list .profile-img-list-item .profile-img-list-link img:before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .profile .profile-img-list .profile-img-list-item.with-number .profile-img-number { position: absolute; top: 50%; left: 0; right: 0; color: #fff; font-size: 1.625rem; font-weight: 500; line-height: 1.625rem; margin-top: -0.8125rem; text-align: center; } ::selection { color: #fff; background: #6990F2; } .wrapper { width: 100%; } .wrapper header, .post_header header { color: #6C5DD3; font-size: 27px; font-weight: 600; text-align: center; } .wrapper form { height: 167px; display: flex; cursor: pointer; margin: 30px 0; align-items: center; justify-content: center; flex-direction: column; border-radius: 5px; border: 2px dashed #6C5DD3; } .wrapper form :where(i, p) { color: #6C5DD3; } .wrapper form i { font-size: 50px; } .wrapper form p { margin-top: 15px; font-size: 16px; } section .row { margin-bottom: 10px; margin-left: 0; margin-right: 0; background: #E9F0FF; list-style: none; padding: 15px 20px; border-radius: 5px; display: flex; align-items: center; justify-content: space-between; } section .row i { color: #6C5DD3; font-size: 30px; } section .details span { font-size: 14px; } .progress-area .row .content { width: 100%; margin-left: 15px; } .progress-area .details { display: flex; align-items: center; margin-bottom: 7px; justify-content: space-between; } .progress-area .content .progress-bar { height: 6px; width: 100%; margin-bottom: 4px; background: #fff; border-radius: 30px; } .content .progress-bar .progress { height: 100%; width: 0%; background: #6C5DD3; border-radius: inherit; } .uploaded-area { max-height: 232px; overflow-y: scroll; } .uploaded-area.onprogress { max-height: 150px; } .uploaded-area::-webkit-scrollbar { width: 0px; } .uploaded-area .row .content { display: flex; align-items: center; } .uploaded-area .row .details { display: flex; margin-left: 15px; flex-direction: column; } .uploaded-area .row .details .size { color: #404040; font-size: 11px; } .uploaded-area i.fa-check { font-size: 16px; } .popup-image { position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, .9); height: 100%; width: 100%; z-index: 100; display: none; } .popup-image span { position: absolute; top: 0; right: 10px; font-size: 40px; font-weight: bolder; color: #fff; cursor: pointer; z-index: 100; } .popup-image img.main_image { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 5px; width: 500px; object-fit: cover; } .image-slider { width: 100%; height: 100px; position: absolute; bottom: 0; left: 0; display: flex; flex-flow: row nowrap; transition: .7s; } .slide-div { flex: 0 0 100px; margin: 0 10px 0 10px; height: 100%; width: 100px; border: 2px solid #fff; border-radius: 5px; } .popup-image .left { position: absolute; top: 45%; left: 3%; padding-left: 10px; z-index: 100; background-image: url(''); } .popup-image .right { position: absolute; top: 45%; right: 3%; padding-right: 10px; z-index: 100; background-image: url('') } .wrap { display: none; background: #fff; width: 280px; height: 50px; border-radius: 60px; position: absolute; left: 50%; top: 90%; transform: translate(-50%,-90%); box-shadow: 0 5px 40px -20px; } .wrap .circle { float: left; border-radius: 50%; margin-top: -2px; width: 55px; transition: 0.2s ease; animation: slide 0.2s ease-in-out forwards; } .wrap .circle:hover { transform: scale(1.3); } .wrap .circle:first-child { } .wrap .circle img { width: 100%; } .wrap.show { display: block; transition: 0.3s linear; } @keyframes slide { 0% { opacity: 0; transform: translateY(15px); } } .wrap .circle:nth-child(1) { animation-duration: calc(0.2s); } .wrap .circle:nth-child(2) { animation-duration: calc(0.4s); } .wrap .circle:nth-child(3) { animation-duration: calc(0.6s); } .wrap .circle:nth-child(4) { animation-duration: calc(0.8s); } .wrap .circle:nth-child(5) { animation-duration: calc(1s); } .wrap .circle:nth-child(6) { animation-duration: calc(1.2s); } .like { position: absolute; left: 50%; bottom: calc(50% - 150px); transform: translate(-50%,-50%); width: auto; height: 40px; background: #fff; clear: both; line-height: 40px; padding: 0 10px; border-radius: 5px; box-shadow: 0px 0px 60px rgba(0, 0, 0, 0.2); cursor: pointer; } .grp-settings-btn { position: absolute; top: 0; right: 0; height: 30px; width: 30px; border: 2px solid #76777A; padding: 0 10px; border-radius: 10px; color: #76777A; cursor: pointer; } .posting-section img { width: 80px; height: 80px; } .post .post-info .media img.user_post_image { width: 63px; border-radius: 50%; } .post .profile-cimg-content { width: 100px !important; height: 100px; border-radius: 0 !important; } .post span { color: #76777A !important; } .reaction_btn span.active, .reaction_btn i.reaction_icon.active { color: #5955D8; font-weight: bold; } .comment_reaction_btn i.comment_reaction_icon.active { color: #5955D8; font-weight: bold; } #admin-edit-group-form .admin-btn { width: 35%; height: 45px; } .accept_btn, .deny_btn { width: 30px; height: 30px; border-radius: 8px !important; background: #5955D8 !important; padding: 0; } .accept_btn::after { content: "\2714\0020"; font-size: 18px; } .deny_btn::after { content: "\2716\0020"; font-size: 18px; color: white; } .member .buttons { width: 150px; display: flex; align-items: center; justify-content: flex-end; } .member a { font-size: 14px !important; color: var(--main-gray-color); text-transform: capitalize; } .member .buttons .btn-clean i, .member .buttons .btn-clean i:before { color: var(--main-gray-color); font-size: 14px; } .member .buttons .btn-clean i.icon-more-horizontal, .member .buttons .btn-clean i.icon-more-horizontal:before { color: var(--main-gray-color); font-size: 25px; } .member .media-body { width: calc(100% - 210px); } .member img { width: 50px; height: 50px; border-radius: 50%; margin-right: 10px; } .member_button_options a, .member_button_options button { width: 100%; margin-right: auto; display: flex; align-items: center; justify-content: flex-start; color: var(--main-gray-color); } .member_button_options a i, .member_button_options button i, .member_button_options a i:before, .member_button_options button i:before { color: var(--main-gray-color); } .member_button_options button, .member_button_options a { padding: 5px !important; } .formOffense { display: flex; align-items: center; width: 100%; overflow: hidden; position: relative; min-height: 350px; } .formOffense .offense { background: none; color: #000; padding: 5px; border-radius: 3px; width: 100%; display: flex; align-items: center; } .formOffense .offense i, .formOffense .offense i:before { color: #000; } .formOffense .offense:hover, .formOffense .offense.active { background: #5955D8; color: #fff; } .formOffense .offense:hover i:before, .formOffense .offense.active i:before { color: #fff; } .formOffense .list_offense { width: 100%; padding: 15px 0; background: #fff; position: absolute; z-index: 2; top: 0; overflow-x: hidden; } .formOffense .Offense-container { max-height: 350px; overflow-y: scroll; overflow-x: hidden; } .formOffense #report_info { background: #fff; min-width: 100%; } .formOffense #report_info .description { min-width: 100%; overflow: hidden; white-space: pre-line; text-align: justify; } .group_about { max-width: 700px; display: block; margin-left: auto; margin-right: auto; } .group_about .media { margin-bottom: 10px; } .group_about .media i, .group_about .media i:before { margin-top: 15px; color: var(--main-black-color) } .group_about .share { width: 100%; } .group_about .share img { max-width: 350px; display: block; margin: 0 auto; } .group_about .share .btn-clean { color: var(--main-color); } #Actual_Post .post { box-shadow: 0px 0px 6px rgba(108,93,211,0.75); -webkit-box-shadow: 0px 0px 6px rgba(108,93,211,0.75); -moz-box-shadow: 0px 0px 6px rgba(108,93,211,0.75); margin-bottom: 35px !important; } #Admin_content button .quantity { border-radius: 50%; padding: 5px; color: #fff; background-color: var(--main-color); display: flex; justify-content: center; align-items: center; width: 25px; height: 25px; margin-left: auto; } #Admin_content button .type { width: 100%; } #_add-group img.group_icon { width: 85px; border-radius: 50%; margin: 0 !important; } #_add-group .icon_container { position: relative; height: 85px; width: 85px; } #_add-group .icon_options.btn-transparency { font-size: 12px !important; left: 0; right: 0; top: 0; bottom: 0; opacity: 0; z-index: 2; } #_add-group .icon_options.btn-transparency:hover { opacity: 1; } #help_btn i, #help_btn i:before { color: black; } #_add-group #help_btn i, #_add-group #help_btn i:before { color: var(--main-gray-light-color); } .dropdown-item.active, .dropdown-item:active { color: #fff; border-radius: 3px; background-color: var(--main-color) !important; } .nav-tabs .dropdown-menu { border-radius: 8px !important; } .SearchContainer { border: 1px solid var(--main-color); border-radius: 15px; background: #fff; -webkit-box-shadow: 7px 11px 15px -7px #d0d3d8; box-shadow: 7px 11px 15px -7px #d0d3d8; transition: all .3s ease-in-out; outline: none; } .SearchContainer .controls { display: flex; justify-content: center; align-items: center; border-radius: 50%; outline: none; overflow: hidden; } .SearchContainer .controls input[type=text] { height: 50px; background: #fff; border: 0; width: 0px; width: 100%; outline: none; padding: 0; text-indent: 15px; transition: width 0.8s; z-index: 2; } .SearchContainer .controls div i, .SearchContainer .controls div i:before { color: var(--main-color); } #toastStackContainer { position: relative; height: 100vh; } #toastStackContainer #toastStack { position: absolute; bottom: 35px; right: 8px; z-index: 9; } #toastStackContainer #toastStack .notify_toast .toast-header img { width: 30px; height: 30px; } input[type="number"].form-control:focus { border-color: #6c757d !important; box-shadow: none !important; } /* The search field */ .dropdown input[type=text] { box-sizing: border-box; font-size: 16px; padding: 5px; margin-bottom: 5px; border: 1px solid var(--main-color); background: #fff; min-height: inherit !important; height: 40px; } /* The search field when it gets focus/clicked on */ .dropdown input[type=text]:focus { outline: 3px solid #ddd; } /* The container
- needed to position the dropdown content */ .dropdown { position: relative; display: inline-block; width: 100%; font-family: Poppins; font-style: normal; font-weight: 500; font-size: 16px !important; line-height: 20px; color: #11142D; background: rgba(228, 228, 228,0.4); border-radius: 8px; height: 45px; border: 2px solid transparent; } .dropdown button { width: 100%; text-align: start; } .dropdown button i, .dropdown button i:before { font-size: 12px; } .dropdown button .spinner-border { margin-left: auto; color: #000 !important; font-size: 10px; width: 1rem !important; height: 1rem !important; } /* Dropdown Content (Hidden by Default) */ .dropdown .dropdown-content { display: none; width: 100%; position: absolute; background-color: #f6f6f6; min-width: 217px; border: 1px solid #ddd; z-index: 1; padding: 15px 15px !important; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; } /* Links inside the dropdown */ .dropdown .dropdown-content a { color: black; padding: 12px 16px; text-decoration: none; display: block; padding: 7px 0 !important; overflow: hidden; text-indent: 5px; cursor: pointer; } /* Change color of dropdown links on hover */ .dropdown .dropdown-content a:hover { background-color: var(--main-color); color: #fff; border-radius: 5px; } /* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */ .dropdown .dropdown-content.show { display: block; } .dropdown .btn-container { display: flex; align-items: center; width: 100%; } .dropdown .items_contain { max-height: 400px; overflow-y: scroll; } .modal .close { font-weight: 500 !important; } .socialLinkCard { border: 1px solid var(--main-gray-light-color); border-radius: 5px; background-color: #fff; height: 100%; display: flex; align-items: flex-start; justify-content: flex-start; margin-bottom: 10px; } .socialLinkCard .media { width: calc(100% - 20px) } .socialLinkCard a { cursor: pointer; width: 20px; } .socialLinkCard .media-body { width: calc(100% - 50px); padding: 0 10px; } .socialLinkCard .media-body h5 { width: 100%; height: 1rem; font-size: 0.9rem !important; display: inline-block; overflow: hidden !important; text-overflow: ellipsis; margin: 0; } .socialLinkCard .media-body p { width: 100%; height: 1rem; font-size: 0.83rem !important; display: inline-block; overflow: hidden !important; text-overflow: ellipsis; } .socialLinkCard img { width: 40px; height: 40px; min-width: 40px; min-height: 40px; max-width: 40px; max-height: 40px; margin-bottom: auto; margin-top: auto; } #_diseno .container-radius h2 { font-size: 1rem !important; font-weight: 600 !important; display: flex; align-items: center; } #_diseno #BackgroundImagePreview { width: 100%; max-width: 200px; height: 310px; border-radius: 8px; background-image: var(--main-appareance-background-image); width: 200px; background-position: center; background-size: cover; } #list_forms button { font-size: 0.9rem !important; } #list_forms #view_forms .Form .container-radius:first-of-type { border: 1px solid var(--main-gray-light-color); box-shadow: none; } #list_forms #view_forms .Form .container-radius:first-of-type { border: 1px solid var(--main-gray-light-color); box-shadow: none; } #list_forms #view_forms .Form h4 { font-size: 0.9rem !important; font-weight: 600 !important; display: flex; justify-content: flex-start; align-items: center; color: var(--main-black-color); } #list_forms #view_forms .Form p { font-size: 0.83rem !important; color: var(--main-gray-color); } #list_forms #view_forms .Form p i, #list_forms #view_forms .Form p i:before { font-size: 0.9rem !important; color: var(--main-gray-color); } #list_forms #view_forms .Form h4 span { border-radius: 50%; width: 8px; height: 8px; min-width: 8px; min-height: 8px; max-width: 8px; max-height: 8px; display: inline-flex; margin: 0; margin-left: 8px; background-color: indianred; } #list_forms #view_forms .Form h4 span.active { background-color: seagreen; } #list_forms #view_forms .Form .icon { width: 60px; height: 60px; border-radius: 50%; margin-bottom: auto; margin-top: auto; display: block; border: 1px solid var(--main-gray-light-color); } .popooverForm { padding: 10px !important; } .popooverForm .btn-clean { font-size: 0.83rem !important; min-width: 100px; font-weight: 400; display: flex; justify-content: flex-start; align-items: center; } .popooverForm hr { margin: 4px 0 4px 0 !important; border-top: 1px solid var(--main-gray-light-color); } .popooverForm .btn-clean { color: #000 !important; } .popooverForm .btn-clean i, .popooverForm .btn-clean i:before { color: #000 !important; } .QRCardItem .container-radius { display: flex; align-items: flex-start; border: 1px solid var(--main-gray-light-color) !important; box-shadow: none !important } .QRCardItem .btn-option { width: 32px; display: flex; justify-content: flex-end; } .QRCardItem .btn-option a { padding: 8px; } .QRCardItem .media { width: calc(100% - 32px); } .QRCardItem .media h5 { font-size: 0.9rem !important; width: 100%; height: 1.4em; display: inline-block; overflow: hidden !important; text-overflow: ellipsis; } .QRCardItem .media p { font-size: 0.83rem !important; color: var(--main-gray-color); width: 100%; height: 1.4em; display: inline-block; overflow: hidden !important; text-overflow: ellipsis; } .QRCardItem .media a { width: 100px; } .QRCardItem .media .media-body { width: calc(100% - 100px); padding-left: 10px; } .QRCardItem .media a img { width: 100%; max-width: 100px; min-width: 100px; } .presentation .container-radius { display: flex; align-items: flex-start; border: 1px solid var(--main-gray-light-color) !important; box-shadow: none !important } .presentation .btn-option { width: 32px; display: flex; justify-content: flex-end; } .presentation .btn-option a { padding: 8px; } .presentation .media { width: calc(100% - 32px); } .presentation .media h5 { font-size: 0.9rem !important; width: 100%; height: 1.4em; display: inline-block; overflow: hidden !important; text-overflow: ellipsis; } .presentation .media p, .presentation .media a { font-size: 0.83rem !important; color: var(--main-gray-color); } .presentation .media a:hover { color: var(--main-color) !important; font-weight: 600 !important; } .presentation .media p i, .presentation .media p i:before { color: var(--main-gray-color) !important; } .presentation .media a i, .presentation .media a i:before { color: var(--main-color) !important; } .presentation .media a { width: 100px; } .presentation .media .media-body { width: calc(100% - 100px); padding-left: 10px; } .presentation .media a img { width: 100%; max-width: 100px; min-width: 100px; } .popooverQR a i, .popooverQR button i, .popooverQR a i:before, .popooverQR button i:before { color: black; } #ordersContainer { display: flex; align-items: start; } #listOrders { width: 320px; min-width: 320px; display: flex; flex-direction: column; } #OrderDetails { width: calc(100% - 470px); min-width: 350px; max-width: 800px; padding-left: 20px !important; } #listOrders .card { margin-bottom: 10px; padding: 10px; border-radius: 5px; cursor: pointer; } #listOrders .card.active { border-left: 3px solid var(--main-color); } #listOrders .card h4 { font-weight: 700 !important; color: var(--main-color); } #listOrders .card.active h4 { color: var(--main-color); } #listOrders .card .data { display: flex; align-items: center; } #listOrders .card .data .price { font-weight: 600 !important; } #OrderDetails .card { width: 100%; margin-bottom: 10px; display: flex; align-items: flex-start; flex-direction: row; padding: 10px; border: none !important; } #OrderDetails .card .picture { width: 60px; } #OrderDetails .card .picture img { width: 100%; max-width: 55px; display: block; margin: auto; border-radius: 3px; } #OrderDetails .card .data { align-items: flex-start; padding-left: 15px; } #OrderDetails .card .data h3 { text-align: start; font-size: 16px !important; } #OrderDetails .card .data h4 { text-align: start; font-size: 15px !important; } #OrderDetails .card .quantity { display: flex; align-items: center; padding: 16px; margin-left: auto; height: 90px; width: 150px; justify-content: flex-end; } #OrderDetails .card .quantity h3 { margin: 0; font-weight: 500 !important; } #OrderDetails .card .quantity p { font-size: 14px !important; font-weight: 600 !important; } #OrderDetails .summary.partial .item { display: flex; align-items: center; } .cardIntegration img { width: 50px; height: 50px; border-radius: 50%; display: block; margin: auto; } .cardIntegration h4 { width: 100%; display: flex; align-items: center; } .cardIntegration .description { height: 100px; } .cardIntegration .description p { text-align: justify; font-size: 0.83rem !important; } .cardIntegration a:hover { color: var(--main-color); } .cardIntegration span.icon-ok, .cardIntegration span.icon-ok:before { font-size: 20px; color: seagreen; } .cardIntegration a.btn-clean i, .cardIntegration a.btn-clean i:before { color: var(--main-gray-color); } .post .verify-profile { width: 12px; height: 12px; } .colorPickerContainer { display: flex; justify-content: flex-start; align-items: center; } .colorPickerContainer input[type="text"] { max-width: 90px; } .colorpicker { min-width: 55px; min-height: 55px; max-width: 55px; max-height: 55px; } #_diseno .icon_lock { display: none; } #_diseno .locked .icon_lock { display: block; } #_diseno .locked i.icon_lock, #_diseno .locked i.icon_lock:before { color: var(--main-gray-light-color); } .error-background { color: #fff; } .error-background h2 { color: #fff; } .error-background p { color: #fff; } @media (max-width: 1480px) { #current_info_room { max-width: 300px; } #room_chat { width: calc(100% - 300px); } #ImageModal .content img { max-width: 95%; max-height: inherit; } .groups { display: flex; } #list-groups, #list-all-posts, #list-suggested-groups { display: inline !important; } } @media (max-width: 1380px) { #body-content { left: 90px; width: calc(100% - 90px); } .cart-active { display: none; } .partial-preview, #notifications-tab { width: 250px; } .partial-preview, #cart-preview, .config .partial-preview { width: 0; background-color: #fcfbff !important; top: 91px; height: calc(100% - 91px); } .partial-preview.active { width: 40% !important; } .partial-preview.analitycs { display: none; } .partial-body, .partial-body.analitycs { width: 100%; padding: 20px; padding-bottom: 150px; } #profile-preview { width: 272px; height: 516px; } #analitycs-data-2 { padding: 0px; max-width: 100% !important; } .profile-data .media-body { display: none; } #burger-menu { display: block; width: 100%; height: 30px; display: flex; justify-content: center; align-items: center; cursor: pointer; } #burger-menu img { width: 40px; } #side-bar .logo-cont { display: none; } #side-bar { width: 90px; } #side-bar.active { width: 256px; } #side-bar.active .logo-cont { display: flex; height: 80px; } #side-bar .card-cont { display: none; } #side-bar.active .card-cont { display: block; } #side-bar .logout-cont label { display: none; } #side-bar.active .logout-cont label { display: flex; } #side-bar .menu .item { padding: 0px; left: 36px; } #side-bar.active .menu .item { padding: 0px 40px; left: inherit; } /*#body-content, #body-content.withFullTopBar { width: calc(100% - 90px); left: 90px; }*/ .partial-body h2 { font-size: 37px !important; } /*.partial-body h5 { font-size: 18px !important; }*/ #side-bar .menu .item.active i { padding-left: 35px; } #side-bar .menu .item.active { left: 0; } #side-bar.active .menu .item.active i { padding-left: 0px; } #full-top-bar { width: calc(100% - 90px); left: 90px; } .route-tab { width: calc(100% - 515px); left: 90px; } .input_search_cont { margin-left: 20px; } btn-save-setting { width: 45%; } #show-preview { display: block !important; position: absolute; top: calc(50% - 25px); /*right: 0;*/ background-color: var(--main-color); outline: none; border: none; margin-left: -35px; padding: 10px 10px; border-bottom-left-radius: 50%; border-top-left-radius: 50%; } .config #show-preview { margin-left: -23px; } #list-rooms { min-height: calc(100vh - 90px); max-height: calc(100vh - 90px); } } @media (max-width: 1200px) { .container-body { flex-wrap: wrap; } .information { width: 100%; } .btn-save-setting { width: 50%; } #current_info_room { width: 0px; position: absolute; right: 20px; top: 20px; transition: width 1s; padding: 0px !important; } #current_info_room.active { width: 350px; } #room_chat { width: 100%; } #current_info_room .room_data .chat-picture { width: 100px; } #info_chat { display: block; } .btn-chat-menu { display: none; } .side_bar_chat { display: block; } .side_bar_chat .btn-clean { margin: 5px 0 !important; font-size: 13px !important; font-weight: bolder !important; padding: 0 !important; color: var(--main-black-color); opacity: 1 !important; } .room_data .close { display: block; } } @media (max-width: 1024px) { #body-content, #body-content.tiny { left: 0px; width: 100%; } #analitycs-data-2 { padding: 0px; } .modal .right { order: 1; } .modal .left { order: 2; } .cart-container-partial { min-width: 320px; } .modal .btn-primary { max-width: 100% !important; width: 100%; } .modal .btn-delete-outline { max-width: 100% !important; width: 100%; } #_qr-form .form-group.left, #_qr-form .form-group.right { float: left; width: 50%; display: block; } #_add-qr-form .form-group.left, #_add-qr-form .form-group.right { float: left; width: 50%; display: block; } #_add-qr-form .col-lg-6.right { display: block; } /*_updateqr-form*/ #_updateqr-form .form-group.left, #_updateqr-form .form-group.right { float: left; width: 50%; display: block; } #_updateqr-form .col-lg-6.right { display: block; } #_deleteqr-form .col-lg-6.right { display: block; } .partial-preview, #cart-preview, .config .partial-preview { width: 0; background-color: #fcfbff !important; top: 91px; height: calc(100% - 91px); } .partial-preview.active { width: 50% !important; } .partial-preview.analitycs { display: none; } .partial-body, .partial-body.analitycs { width: 100%; padding: 20px; padding-bottom: 150px; margin-left: 0px; } /*#body-content.withFullTopBar .partial-body { padding: 20px; }*/ #full-top-bar, #full-top-bar.tiny { width: 100%; left: 0px; } /*#top-bar { display: block; width: 100%; height: 68px; padding: 10px; position: fixed; top: 0px; left: 0px; background: #fcfbff !important; box-shadow: inset 0px -1px 0px #E4E4E4; z-index: 8; }*/ #side-bar, #side-bar.tiny { width: 0px; } #burger-menu-top { width: 40px; height: 100%; float: left; display: flex; justify-content: flex-start; align-items: center; cursor: pointer; padding: 20px; } .content-top { width: calc(100% - 40px); height: 100%; float: left; display: flex; justify-content: flex-end; align-items: center; } #notify-container-bar { display: none; } .route-tab { width: 100%; position: relative; padding: 10px 0; left: 0; height: auto; } .btn-save-setting { width: 70%; } .chat_actual_room_cont { width: calc(100% - 280px); max-width: 100%; } .chat_rooms_cont { min-width: 260px !important; max-width: 260px; } h1 { font-size: 42px !important; } h2 { font-size: 27px !important; } h3 { font-size: 22px !important; } h4, h5, h6 { font-size: 16px !important; } .btn-primary, .btn-secondary, .btn-third, .btn-clean { font-size: 15px !important; } p { font-size: 15px !important; } table.responsive { border: 0; } table.responsive thead { border: none; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } table.responsive tr { border-bottom: 3px solid #ddd; display: block; margin-bottom: .625em; } table.responsive td { border-bottom: 1px solid #ddd; display: block; font-size: .8em; text-align: right; font-size: 13px !important; } table.responsive td::before { content: attr(data-label); float: left; font-weight: bold; text-transform: uppercase; width: 100%; text-align: start; margin-bottom: 5px; } table.responsive td:last-child { border-bottom: 0; } table.me-table-outline tbody tr.active { color: var(--main-black-color); background-color: var(--main-white-color); } table.me-table-outline tr.active a { color: var(--main-black-color); } #list_forms #view_forms .Form .icon { width: 50px; height: 50px; } #ordersContainer { flex-direction: column; } #OrderDetails { width: 100%; padding-left: 0 !important; margin-top: 20px !important; } #OrderDetails .order { } #listOrderContainer { width: 100%; } #listOrders { width: 100%; min-width: 100%; flex-direction: row; height: 150px; position: relative; overflow-x: scroll; } #listOrders .card { margin-right: 5px; min-width: 240px; width: 240px; } #listOrders .loader { top: 0; bottom: 0; left: 0; right: 0; position: absolute; width: 100%; } } @media (max-width: 900px) { #analitycs-data-2 { max-width: 900px; height: auto; overflow-y: scroll; } .grp-settings-btn { height: 25px; width: 20px; border-radius: 7px; } .posting-section img { width: 50px; height: 50px; } .uploading-section span { font-size: 13px !important; } #_diseno #BackgroundImagePreview { width: 100%; max-width: 150px; height: 250px; width: 150px; } } @media (max-width: 850px) { .input_search .controls input[type=text] { width: 120px; } .custom-link-info, #ListSocialLinks { width: 100%; /*float: left;*/ } .custom-link-cont { display: block; height: auto } .custom-link-cont button { margin-bottom: 20px !important; } .tab-container p { margin-top: 20px; } .input_search .controls input[type=text].active { outline: none; border-radius: 15px; width: 250px; } .chat_actual_room_cont { width: 100%; max-width: 100%; display: none; } .chat_rooms_cont { min-width: 100% !important; max-width: 100%; } .chat_actual_room_cont.active { display: block; margin: 0; position: fixed; top: 0; z-index: 3; } .chat_rooms_cont.unactive { display: none; } .chat_actual_room_cont.active #btn_see_all_chat { display: block; } #btn_see_all_chat button { display: flex; justify-content: center; align-items: center; margin-right: auto; margin-top: 10px; margin-bottom: 10px; color: #fff; background: none; outline: none; border: none; } #btn_see_all_chat button i, #btn_see_all_chat button i:before { font-size: 20px; color: #fff; } #current_user_picture { margin-left: 25px; } .partial-body.chat { padding: 0; } #MessageBox-current-cont { border-radius: 0px; height: 103px; } .chat .chat-history .message { color: white; padding: 9px 9px; line-height: 26px; font-size: 16px; border-radius: 7px; margin-bottom: 5px; max-width: 70%; min-width: 64%; position: relative; word-wrap: break-word; } #MessageBox { position: absolute; } .file-item { border-radius: 10px; background-color: #fff; padding: 10px; border: 1px solid var(--main-black-color); width: 100%; max-width: 400px; display: block; margin-left: auto; margin-right: 30px; width: 100%; } #Message-controls { bottom: 33px; } /*#Message-controls, #Message-bloked, #Message-isbloker { position: relative; }*/ .partial-preview.active { width: 90% !important; } #current_room { width: 100%; max-width: 100%; display: none; position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 4; } #current_room.active { display: flex; } #current_room.active .chat_back_ico { display: block; padding-right: 15px; cursor: pointer; } #current_room.active .chat_back_ico i, #current_room.active .chat_back_ico i:before { color: var(--main-gray-light-color); font-size: 25px; } #list-rooms { width: 100%; max-width: 100%; padding: 15px 10px; } #list-rooms.active { display: none; } #room_chat { padding: 0; } .chat-box { width: 100%; min-height: 100vh; max-height: 100vh; padding: 0 !important; } #current_info_room { position: absolute; right: 0px; top: 0px; min-height: 100vh; max-height: 100vh; } #current_room.active .controls { margin-bottom: 10px; } #current_room.active .controls.keyboard { margin-bottom: 280px; } } @media (max-width: 768px) { #v-pills-tab.flex-column { -ms-flex-direction: unset !important; flex-direction: unset !important; } .config #v-pills-tab .nav-link::after, .config #v-pills-tab .nav-link:first-child::after { content: ""; width: 90px; height: 5px; display: block; background-color: var(--main-color); color: var(--main-color); position: absolute; bottom: 50%; left: 7px; } .config #v-pills-tab .nav-link:last-child::after { display: none; } #form_live_box { padding: 15px !important; } .partial-referral .referral-share { width: 100% !important; } .popup-image img.main_image { width: 95%; } #LinkList .linkItem .header .icon img { width: 40px; height: 40px; } #LinkList .linkItem .listFunctions { margin-top: 0; } } @media (max-width: 720px) { .color-item { margin: 10px; } #background-color-cont { width: 100% !important; } .btn-form-item, .btn-form, .btn-type-item, .btn-type { width: 100%; } .btn-form-cont { margin-right: 5px; width: calc(33.33333% - 10px); } .btn-type-cont { margin-right: 5px; width: calc(50% - 10px); } #body-content .withroute .breadcrumb-item a { font-size: 15px; } #container .data-rows .row img { width: 25px !important; } .verify-profile { width: 13px !important; height: 13px !important; } .config .nav-link { margin-left: 10px; } .post { padding: 14px; } .post .body .image-col.hp-1 .image { height: 250px; } .post .body .image-col.hp-2 .image { height: 150px; } .post .body .image-col.hp-3 .image { height: 120px; } .post .body .buttons button { padding: 5px !important; font-size: 14px !important; } .post .body .text { font-size: 14px !important; } .badge.badge-primary { font-size: 11px !important; } .post .comments_analitycs { color: #76777A !important; font-size: 14px !important; } .post .header .name p { font-size: 12px !important; } .post .header .name .username { font-size: 14px !important; } .partial-body.w-100.group_partial { padding: 8px; } .post .body .buttons button img { width: 20px; } .post .body .buttons button { display: flex; justify-content: center; align-items: center; } .post .body .analitycs_post .reactions_analitycs img { width: 20px; height: 20px; } .post .comment_box .comment .top_comment_reaction_cont .react { padding: 3px; } .modal.carrousel .carousel-item { padding: 35px 70px !important; } .post .comment_box .comment .data p.text span.body-text { max-height: 15.5ex; } #list_forms #view_forms .Form .icon { width: 40px; height: 40px; } } @media (max-width: 576px) { #_diseno #BackgroundImagePreview { max-width: 100px; height: 200px; width: 200px; } .group-chat-btn, .admin-group-btn { width: 100%; } .post .body .text { font-size: 13px !important; } .group .cover { height: 240px; } .group .header_info .picture { margin-top: -55px; } .group .header_info .picture img { width: 100px; } .layout-item img { width: 80px; height: 160px; } .cardIntegration .description { height: auto; } } @media (max-width: 550px) { .partial-body h6 { font-size: 14px !important; } .content-info .media img { width: 63px; margin: 15px 30px 15px 30px; margin: 0; margin-right: 15px; } .nav-link { font-size: 14px !important; padding: 0.5rem 12px !important; } .content-info .media p { font-size: 14px !important; } .partial-body h2 { font-size: 28px !important; } .content-info .completed { display: none; } #settings .btn-secondary { font-size: 10px !important; } #settings .change-pass .form-in label { font-size: 12px; } #settings .change-pass .form-in input { font-size: 12px; } .table-me td { border: 1px solid #EBEBFA; word-wrap: break-word; max-width: 180px; } .notify-item .time { width: 100%; } .notify-item .body { width: calc(100% - 60px); } .cart-container-partial { width: 100%; } .shipping-card .btn-clean, .payment-card .btn-clean { margin-left: auto !important; float: inherit !important; } #Cart.analytics-cont, #checkout.analytics-cont { margin: 0; padding: 0; border: none; box-shadow: none; } .cart .product .image, #checkout .product .image { width: auto; } .cart .product .btns, #checkout .product .btns { width: auto; margin-left: auto; } .cart .product .body, #checkout .product .body { width: auto; } .checkout-btn-container { display: block; } .cart .product .btns p, #checkout .product .btns p { font-size: 14px !important; } .theme-item div { height: 100px; } .color-item, .custom-bakcground-color { width: 50px; height: 50px; } .btn-form-cont { width: calc(50% - 10px); } .tab-container { padding: 20px 10px; } .car-btn { max-width: 100%; } .input_search { max-height: 450px; overflow: scroll; border-radius: 50%; } .input_search.active { border-radius: 15px; } .input_search .controls input[type=text] { width: 0; } .input_search_group .controls input[type=text] { width: 0; } .input_search_group .controls input[type=text].active { width: 230px; } /*.config h5 { font-size: 18px; }*/ #current_quest .reactions_cont button img { width: 18px; } #current_quest .reactions_cont button:before { padding: 0px; height: 30px; } #current_quest .reactions_cont button { padding: 5px; margin-left: 7px; } #current_quest .reactions_cont { width: 100%; margin-top: 25px; } #form_live_box { margin: 20px 0; width: 93%; } h1 { font-size: 37px !important; } h2 { font-size: 24px !important; } h3 { font-size: 20px !important; } h4, h5, h6 { font-size: 14px !important; } .btn-primary, .btn-secondary, .btn-third, .btn-clean { font-size: 12px !important; } p { font-size: 12px !important; } .carousel-control-prev, .carousel-control-next { width: inherit !important; } .modal.carrousel .carousel-item { padding: 20px 20px !important; } } @media (max-width: 450px) { #background #buttons a, #background #buttons button { padding: 5px 5px !important; } .customs { height: 124px; } .customs .media { width: calc(100% - 16px) !important; float: left; display: block !important; } .customs .media-body { width: calc(100% - 69px) !important; float: left; } .customs .media .btns { width: 100% !important; height: 100%; float: left; display: inline-flex !important; justify-content: flex-start; align-items: center; height: auto; } .switch-cont { width: auto !important; display: flex; justify-content: flex-end; align-items: center; order: 2; } .customs .media .btns .list { width: 100% !important; height: 50%; float: left; display: flex; justify-content: flex-end; align-items: center; margin-top: 10px; order: 1; } .customs .media img { float: left; } #list_qrs .btn-secondary { margin: 5px 0 !important; } .input_search .controls input[type=text].active { width: 230px; } .input_search_group .controls input[type=text].active { width: 148px; } .input_search_cont_group { width: 148px; } .btn-save-setting { width: 100%; } .config .nav-link::after, .config .nav-link:first-child::after { width: 82px; } .config .nav-link .item { width: 35px; height: 35px; } .config .nav-link { width: 45px; height: 45px; } #current_quest .reactions_cont { width: 100%; display: block; min-height: 50px; margin-top: 25px; margin-bottom: 25px; } #current_quest .reactions_cont button { float: left; } .post .body .buttons button { font-size: 11px !important; } } @media (max-width: 380px) { .cart-container-partial { min-width: 290px; } .input_search .controls input[type=text].active { width: 200px; } .notification-cont button, .cart-cont button { margin-left: 6px; } .input_search_group .controls input[type=text].active { width: 148px; } .input_search_cont_group { width: 148px; } .btn-save-setting { width: 100%; } .post .body .buttons button { font-size: 9.5px !important; } }