arunkb2000.github.io/style1.css at master · arunkb2000/arunkb2000.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
@import url('http://fonts.googleapis.com/css?family=Poppins:100,200,300,400,500,600,700,800,900');

 .recepi img{

     margin-left:-8px;
      width:106%;
     padding-top:80px;
     height:60%;
     opacity:0.8;
}
.a{
  position:relative;
  display:grid;
  grid-template-rows:auto;
  grid-gap:0;
  grid-template-columns: repeat(auto-fill, minmax(260px,270px));
  margin:90px;
}
.a .b{position:relative;
 height:400px;
background-color:rgba(126,121,81,0.5);
display: flex;
justify-content: center;
align-items: center;
border:1px solid silver;
border-radius:10px;
transform:translate(15%,0%);
margin:8px;
}
.c{position:relative;
padding:20px;

}
.b .c h2{position:absolute;
top:-20%;
right:80px;
font-size:5em;
color:rgba(216,216,216,.05);
transition:0.4s;
}
.b:hover .c h2{
top:-160px;
color:silver;

}
.b .c h3{margin:0 0 10px;
padding:0;
font-size:20px;
font-weight:500;
color:gold;
}
.b .c p{margin:0;
padding:0;
font-size:14px;

color:white;
}
          .container1{
            transform:translate(5%,-153%);
         }
           .container2{
            transform:translate(0%,20%);
         }

.logo h1{
          transform:translate(-9%,-53%);
          text-align:center;
          font-size:70px;
          color:rgba(200,50,30,20);
          text-shadow:2px 2px 2px yellow;
          font-family: 'Ewert', cursive;
          letter-spacing:1px;
          background-color:rgba(214,214,214,0.4);
          width:107.3%;
         padding:20px;

        }

.img img{
        margin:10px 20px;
        width:150px;
        height:150px;
        top:130%;
        left:100px;
        border-radius:300px;
}

.b .c a{
        position:relative;
        margin:8px;
        padding:10px 10px;
        text-decoration:none;
        display:inline-block;
        color:white;
        transition"0.5s;
        transform: translateY(-110px);
        opacity:0;
        visibility:hidden;
}
.b:hover .c a{transform: translateX(-10px);
opacity:1;
visibility:visible;
border:1px solid white;
border-radius:10px;
background-color:silver;
color:black;
height:10px;
width:80px;
}
.a .b:before{
content:'';
position:absolute;
top:-1px;
left:-1px;
right:-1px;
bottom:-1px;
border-radius:10px;
height:340px;
transform:skew(2deg,2deg);
}