input:focus { 
border:solid 1px rgba(255,194,0,1);

-webkit-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

::-webkit-input-placeholder { color: rgba(128,128,128,1); }
::-moz-placeholder { color: rgba(128,128,128,1); }
:-ms-input-placeholder { color: rgba(128,128,128,1); }
:-moz-placeholder { color: rgba(128,128,128,1); }

iframe {
display:block;
position:relative;
width:100%;
height:500px;
z-index:1;
border:none;
outline:none;
margin:0px auto 0px auto;
}

.contact {
display:table;
position:relative;
width:500px;
height:auto;
min-height:300px;
margin:-150px auto 0px auto;
z-index:8;
border-radius:3px;
box-shadow:0px 0px 1px 2px rgba(0,0,0,0.05);
background:rgba(255,255,255,0.8);
}

.contact_title {
display:block;
position:relative;
width:35%;
height:50px;
font:normal 28px 'NeoSansArabic';
color:rgba(7,57,80,1);
text-align:center;
border-bottom:solid 3px rgba(0,0,0,0.1);
margin:20px auto 0px auto;
}

.contact_title span {
display:block;
position:absolute;
width:50%;
height:3px;
text-align:center;
top:0;
right:0;
bottom:-50px;
left:0;
margin:auto;
border-radius:5px;
background:rgba(255,194,0,1);
}

.contact_username {
display:block;
width:90%;
height:50px;
font:normal 16px 'NeoSansArabic';
color:rgba(7,57,80,1);
direction:rtl;
padding:0px 10px 0px 0px;
margin:20px auto 0px auto;
border-radius:3px;
outline:none;
border:solid 1px rgba(0,0,0,0.3);
background:rgba(255,255,255,1);
overflow:hidden;

-webkit-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

.contact_email {
display:block;
width:45%;
height:50px;
font:normal 16px 'NeoSansArabic';
color:rgba(7,57,80,1);
direction:rtl;
padding:0px 10px 0px 0px;
margin:20px 5% 0px 0px;
border-radius:3px;
outline:none;
border:solid 1px rgba(0,0,0,0.3);
background:rgba(255,255,255,1);
float:right;
overflow:hidden;

-webkit-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

.contact_mobile {
display:block;
width:40%;
height:50px;
font:normal 16px 'NeoSansArabic';
color:rgba(7,57,80,1);
direction:rtl;
padding:0px 10px 0px 0px;
margin:20px 5% 0px 0px;
border-radius:3px;
outline:none;
border:solid 1px rgba(0,0,0,0.3);
background:rgba(255,255,255,1);
float:right;
overflow:hidden;

-webkit-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

.contact_msg {
display:block;
width:90%;
height:120px;
font:normal 16px 'NeoSansArabic';
color:rgba(7,57,80,1);
direction:rtl;
padding:10px 10px 10px 0px;
margin:20px 5% 10px 0px;
border-radius:3px;
outline:none;
border:solid 1px rgba(0,0,0,0.3);
background:rgba(255,255,255,1);
float:right;
overflow:hidden;

-webkit-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

.contact_send {
display:block;
position:relative;
width:180px;
height:40px;
font:normal 16px 'NeoSansArabic';
color:rgba(255,255,255,1);
text-align:center;
text-decoration:none;
margin:0px auto 0px auto;
bottom:-20px;
border:none;
outline:none;
border-radius:20px;
background:rgba(255,194,0,1);
cursor:pointer;

-webkit-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

.contact_send:hover {
-webkit-transform: scale(0.9);
-ms-transform: scale(0.9);
transform: scale(0.9);

-webkit-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

.contact_send:focus {
border:none;
outline:none;
}

.contact_address {
display:block;
position:relative;
width:500px;
height:auto;
min-height:40px;
font:normal 22px 'NeoSansArabic';
color:rgba(7,57,80,1);
text-align:center;
margin:40px auto 0px auto;
}

.contact_address span:nth-child(1) {
width:50%;
font:normal 15px 'NeoSansArabic';
color:rgba(0,0,0,0.8);
float:right;
margin:-20px 0px 0px 0px;
direction:rtl;
}

.contact_address span:nth-child(2) {
width:45%;
font:normal 15px 'NeoSansArabic';
color:rgba(7,57,80,1);
float:left;
margin:-20px 5% 0px 0px;
direction:rtl;
}


/*media query*/
@media only screen and (max-width: 768px) {

iframe {
height:400px;
}

.contact {
display:table;
width:90%;
height:auto;
margin-top:-250px;

-webkit-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

.contact_title {
width:70%;
}

.contact_email {
width:90%;

-webkit-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

.contact_mobile {
width:90%;

-webkit-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

.contact_msg {
width:90%;

-webkit-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

.contact_address {
font:normal 20px 'NeoSansArabic';
width:90%;

-webkit-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

.contact_address span:nth-child(1) {
display:block;
width:90%;
text-align:center;
float:none;
margin:-20px auto 0px auto;

-webkit-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

.contact_address span:nth-child(2) {
display:block;
width:90%;
text-align:center;
float:none;
margin:20px auto 0px auto;

-webkit-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

#contacts {
margin:40px auto 60px auto;
}

}