Contact form with google map part5

Style google map & CSS

اليوم هو الدرس الخامس و الاخير هحنول بقيت الموقع ال سي اس اس وهنعرف نعمل تعديل خفيف علي الكود الي واخدينوا من جوجول لي اتش تي ام ال و سي اس اس وهنعرف حجات اكتر يا مسهل يا كريم يا رب

Contact Form

Excellent
Verygood
Good
Bad

 

Contact Information

8901 Marmora Road, Glasgow, D04 89GR. +1 800 559 6580Freephone: +1 959 603 6035Telephone: +1 504 889 9898FAX: E-mail: mail@demolink.org
&nbsp
 
 
 

*{
margin:0;
padding:0;
}

body{
background:url(images/bg.gif);
font-family:verdana;
font-size:14px;
line-height:21px;
color:#e1e1e1;
}

#container{
width:1015px;
margin:50px auto;
position:relative;
}

#arrwo-up{
width:1015px;
height:170px;
background:url(images/arrow-up.png) no-repeat;
position:absolute;
top:20px;
}

#wrapper{
width:960px;
background:#383838;
margin-left:25px;
padding-top:150px;
}

#contact{
width:400px;
float:left;
margin-bottom:70px;
}

#contact h1{
color:#fff;
font-size:45px;
padding:35px 0 35px 0;
font-weight:normal;
letter-spacing:1.5px;
}

#contact form{
margin:40px 20px 0px 20px;
font-size:12px;
width:350px;
float:left;
}

#contact form label{
font-size:12px;
color:#999;
margin-top:10px;
margin-bottom:10px;
display:block;
width:150px;
}

#contact form input{
width:300px;
height:25px;
border:none;
display:block;
margin:2px 0 10px 0px;
color:#5f2942;
}

#contact form input[type="checkbox"]{
display:block;
width:20px;
}

#contact form textarea{
width:300px;
border:none;
color:#5f2942;
margin-bottom:20px;
height:220px;
}

#contact form .send{
width:130px;
height:35px;
text-decoration:none;
color:#333;
padding:8px 15px 8px 20px;
background:#e1e1e1;
font-family:sans-serif;
font-weight:normal;
text-align:center;
}

#contact form .send:hover{
color:#e1e1e1;
background:#333;
}

.clear{
clear:both;
}

.info{
float:right;
width:350px;
}

.info h2{
color:#fff;
font-size:30px;
padding:35px 0;
font-weight:normal;
letter-spacing:1px;
}

.info p{
color:#999;
font-size:12px;
line-height:18px;
}

.info span{
color:#fff;
font-size:13px;
}

.name{
width:569px;
height:150px;
float:right;
background:url(images/name.png) no-repeat;
margin-top:-750px;
}

.map{
float:right;
width:500px;
margin-right:30px;
margin-top:-570px;
}

.map h2{
color:#fff;
font-size:30px;
padding:35px 0;
font-weight:normal;
letter-spacing:1px;
}

.map iframe{
border:5px solid #6e6e6e;
}

#arrwo-down{
width:1015px;
height:170px;
background:url(iamges/arrow-down.png) no-repeat;
position:absolute;
bottom:0px;
}

  • PSD TO HTML&CSS
  • html-css تصميم موقع كامل
  • عماد المصرى

    شكرا  جدا  على المجهود الرائع  
    ارجوا منك ادراج  كود 
    php
    حتى يكون  التدريب   شامل   

    • Anonymous

      اولا شكرا جدا يا عماد
      و حلوة الملحوظة دي و على العموم اول درس هنكودة هدخل فية
       php
      بس اصبر شويه صغيرين 

      • عماد المصرى

        شكرا  جدا