veerjeevagan.github.io/minimalistic_property.css at main · veerjeevagan/veerjeevagan.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
* {
    margin:0 ;
    padding: 0;
}

body {
    font-family: 'Roboto Condensed', Courier, monospace;
    background-color: #cd62b5;
    width: 100%;
    }
/*
.nav-wrapper {
    display: flex;
    justify-content: space-between;

}

.left , .right{
    font-weight: 20;
    font-size: 20px;
    padding-left: 12px;
    padding-right: 12px;
} */
.intro-text {
    font-size: 1.2em;
    font-weight: 900;
    color:#000000;
    /* letter-spacing: 1px; */
}

.block-wrapper {
    height: 60vh;
    max-width: 100%;
    /* border: 2px solid black; */
    position: relative;

}
.main-block {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-box-shadow: 5px -5px   #c444a6 ,4px -4px   #c444a6 , 3px -3px  #c444a6 , 2px -2px #c444a6 ;
    -moz-box-shadow: 5px -5px   #c444a6 ,4px -4px   #c444a6 , 3px -3px  #c444a6 , 2px -2px #c444a6;
    box-shadow: 5px -5px   #c444a6 ,4px -4px   #c444a6 , 3px -3px  #c444a6 , 2px -2px #c444a6;
    height: 44vh;
    width: 55vw;
    background-color:#c852ad;
    transition: all .5s ease-in-out;
    cursor: pointer;

}

.main-block-press {
    box-shadow: none;
    top: 49%;
    left: 51%;
    transform: translate(-50% , -50%);
    background-color:  #cd62b5;
    cursor: pointer;

}

.small-block-wrapper {
    width: 100%;
    height: 10vh;
    position: relative;
    /* border: 2px solid green ; */
}

.small-block{
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    height: 5vh;
    width: 130px;
    top: 15%;
    left: 50%;
     /* border:2px dashed red;   */
    transform: translate(-50% , -50%);
    transition: all .5s ease-in-out;
    pointer-events: none;
}

.info {
    color: transparent;
    font-size: 1em;
    transition: all .5s ease-in-out;
    font-weight: 800;
    letter-spacing: 0.6px;

}

.small-block-out {

    top: 16%;
    left: 49%;
    background-color: #59CA73;
    -webkit-box-shadow: 5px -5px  #4fb367 ,4px -4px   #4fb367 , 3px -3px  #4fb367 , 2px -2px  #4fb367  , 1px -1px  #4fb367;
    -moz-box-shadow: 5px -5px  #4fb367 ,4px -4px  #4fb367 , 3px -3px  #4fb367 , 2px -2px   #4fb367 , 1px -1px  #4fb367;
    box-shadow: 5px -5px  #4fb367 ,4px -4px  #4fb367 , 3px -3px  #4fb367 , 2px -2px  #4fb367 , 1px -1px  #4fb367;
    position: relative;
    pointer-events: all;
    cursor: pointer;
    /* border: violet solid 2px; */
}

.small-block-out>.info {
    color: black;
}

/* .small-block-out>.info {
    color:rgb(0, 0, 0);

} */
.info-out {
    color:rgb(255, 255, 255);

}