splitted up stylesheet and added lots of scaffolding to it. Style needs working.
[theme-danix.xyz.git] / assets / sass / layout / _contact.scss
CommitLineData
748286b5 1///\r
2/// Forty by HTML5 UP\r
3/// html5up.net | @ajlkn\r
4/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)\r
5///\r
6\r
7/* Contact */\r
8\r
9 #contact {\r
10 border-bottom: solid 1px _palette(border);\r
11 overflow-x: hidden;\r
12\r
13 > .inner {\r
14 @include vendor('display', 'flex');\r
15 padding: 0 !important;\r
16\r
17 > :nth-child(2n - 1) {\r
18 @include padding(4em, 0, (0, 3em, 0, 0));\r
19 border-right: solid 1px _palette(border);\r
20 width: 60%;\r
21 }\r
22\r
23 > :nth-child(2n) {\r
24 padding-left: 3em;\r
25 width: 40%;\r
26 }\r
27\r
28 > .split {\r
29 padding: 0;\r
30\r
31 > * {\r
32 @include padding(3em, 0, (0, 0, 0, 3em));\r
33 position: relative;\r
34\r
35 &:before {\r
36 border-top: solid 1px _palette(border);\r
37 content: '';\r
38 display: block;\r
39 margin-left: -3em;\r
40 position: absolute;\r
41 top: 0;\r
42 width: calc(100vw + 3em);\r
43 }\r
44 }\r
45\r
46 > :first-child {\r
47 &:before {\r
48 display: none;\r
49 }\r
50 }\r
51 }\r
52 }\r
53\r
54 @include breakpoint('<=medium') {\r
55 > .inner {\r
56 display: block;\r
57\r
58 > :nth-child(2n - 1) {\r
59 @include padding(4em, 0, (0, 0, 0, 0));\r
60 border-right: 0;\r
61 width: 100%;\r
62 }\r
63\r
64 > :nth-child(2n) {\r
65 padding-left: 0;\r
66 width: 100%;\r
67 }\r
68\r
69 > .split {\r
70 > * {\r
71 @include padding(3em, 0, (0, 0, 0, 0));\r
72\r
73 &:before {\r
74 }\r
75 }\r
76\r
77 > :first-child {\r
78 &:before {\r
79 display: block;\r
80 }\r
81 }\r
82 }\r
83 }\r
84 }\r
85\r
86 @include breakpoint('<=small') {\r
87 > .inner {\r
88 > :nth-child(2n - 1) {\r
89 @include padding(3em, 0, (0, 0, 0, 0));\r
90 }\r
91 }\r
92 }\r
93 }