انجمن کدستانMoisrex

.checkbox { display: none;} .label{ -webkit-transition:.3s; -moz-transition:.3s; -o-transition:.3s; transition:.3s; width: 64px; height:64px; font-size: 20px; display: inline-block; background-size:cover; margin:.5em; background:rgba(0,132,255,0.15); box-shadow: 1px 1px 5px rgba(0, 135, 255,0.5); border-radius:1px;}

.checkbox:checked + .label { -webkit-transition:.3s; -moz-transition:.3s; -o-transition:.3s; transition:.3s; box-shadow:inset 0px 0px 10px rgba(0, 135, 255,0.5); background:rgba(0,132,255,0.3)}

#mobiledropmenu:checked ~ .title { -webkit-transition:1s; width: 100%; height: 250px; opacity: 1;} .title { -webkit-transition:1s; width: 0%; height: 0px; opacity: 0;} .button { color:#fff; text-decoration:none; border-top:1px solid #fff; text-align:center; text-transform:uppercase; width:100%; padding:1.2em; } .button:hover { cursor:pointer; background:rgba(0,132,255,0.15); }

h1 { width:100%; color:rgba(188, 230, 255, 0.2); text-align:center; text-transform:uppercase; text-shadow: 1px 3px 6px #E5F2FF, 0 0 0 #47a0d3, 1px 4px 6px #E5F2FF; font-weight:tahoma; font-size:2.5em; position:absolute; margin-top:20%;}

</style><div id="header"> <div id="logo"> </div> <input type="checkbox" class="checkbox" name="menu" value="mobiledropmenu" id="mobiledropmenu"> <label for="mobiledropmenu" class="label"><img src="http://mhmk.vatan-host.ir/dropmenu.png"></label> <h1 style="color: rgb(238, 238, 238); margin: 0px; opacity: 0.1; font-size: 0px !important; height: 0px !important;"><a href="http://mhmk.ir">1code</a></h1> <div class="title"> <div class="button"><a href="http://mhmk.ir">خانه</a></div> <div class="button"><a href="#">انجمن</a></div> <div class="button"><a href="#">تماس با ما</a></div> <div class="button"><a href="#">فروشگاه</a></div> </div> </div>