*{-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
font-family: "Roboto", sans-serif;}
body{margin:0; padding:0;}
.dis{opacity: 1;float: left;width: 100%;background: #faf3f3;height: 100%;margin: 0 auto;padding: 0;min-height: 100vh;position: relative;}  
.ic{/* float:left; */width: 100%;max-width: 800px;background: #fff;border-radius: 20px;padding: 40px;display: inline-block;position: relative;top: 50%;left: 50%;transform: translate(-50%, -50%);}
.ic .baslik{opacity:1;float: left;width: 100%;display: flex;align-items: center;justify-content: space-between;padding-bottom: 20px;margin-bottom: 20px;border-bottom: 1px solid #eee;}
.ic .baslik .logo{opacity:1;float: left;}
.ic .baslik .logo img{opacity:1;}
.ic .baslik .metin{opacity:1;float: left;font-size: 14px;color: #eb212e;text-align: right;}
.ic .aciklama{opacity:1;display: block;font-size: 20px;color: #111;font-weight: bold;}

.projeler{opacity: 1;float: left;width: 100%;margin: 20px 0 0 0;}
.projeler .item{opacity: 1;float: left;width: calc(33.33% - 20px);padding: 10px;}
.projeler .item .itemic{opacity: 1;border: 1px solid #f5ebeb;border-radius: 6px;text-align: center;text-decoration: none;float: left;width: 100%;text-align: center;background: #fff;transition: .3s;}
.projeler .item .itemic a{text-decoration:none;padding: 30px 20px;float: left;width: 100%;text-transform: uppercase;font-size: 16px;text-align: center;transition: .3s;}
.projeler .item .itemic a .icon{content: "asd";display: inline-block;width: 40px;font-size: 20px;height: 40px;background: #faf3f3;border-radius: 100px;color: #eb212e;text-align: center;line-height: 40px;transition: .3s;}
.projeler .item .itemic a .isim{float:left; width:100%;margin-top: 15px;font-size: 18px;font-weight: bold;color: #111;}
.projeler .item .itemic:hover{opacity:1;box-shadow: 0 30px 25px #2f000014;}
.projeler .item .itemic:hover .icon{background: #eb212e; color:#fff;}