12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394 |
- .section1{
- width: 100%;
- height: auto;
-
- margin-top: 100px;
- }
- .section1 img{
- width: 100%;
- height: 100%;
- }
- .casewrapper{
- width: 70%;
- height: auto;
- margin: 20px 15%;
- }
- .casebox{
- width: 100%;
- height: auto;
- margin: 10px 0 0 0;
- float: left;
- position: relative;
- }
- .casebox:hover .hoverbox{
- display: block;
- }
- .casebox div:first-child{
- width: 100%;
- height: auto;
- }
- .casebox div:first-child img{
- width: 100%;
- height: 100%;
-
- }
- .casebox p{
- text-align: center;
- margin-top: 15px;
- }
- .hoverbox{
- width: 100%;
- height: 70%;
- position: absolute;
- background: rgba(14,27,26,0.5);
- top: 0;
- left: 0;
- display: none;
- }
- .hoverbox img{
- width: 80%;
- height: 70%;
- margin: 15% 10% 0 10%;
- }
- h3,h4{
- text-align: center;
- margin-top: 10px;
- }
- .section2{
- margin-top: 30px;
- }
- .section2 h4{
- margin-bottom: 30px;
- }
- .connect{
- width: 60%;
- font-size: 20px;
- margin-left:20% ;
- text-align: center;
- }
- .connect span{
- margin-right: 10%;
- }
- @media (max-width:700px ) {
- .madebtn {
- width: 30%;
- height: 30px;
- font-size: 16px;
- margin: 20px 35%;
- border: 1px solid #7DBE00;
- color: #7DBE00;
- background: transparent;
- }
- }
- @media (min-width:996px ) {
- .madebtn{
- width: 10%;
- height: 30px;
- font-size: 16px;
- margin: 20px 45%;
- border: 1px solid #7DBE00;
- color: #7DBE00;
- background: transparent;
- }
- }
|