/*--- İcon ve text style ---*/

@font-face {
font-family: formoid;
src:url('fonts/formoid.eot');
src:url('fonts/formoid.eot?#iefix') format('embedded-opentype'),
url('fonts/formoid.ttf') format('truetype'),
url('fonts/formoid.woff') format('woff'),
url('fonts/formoid.svg#formoid') format('svg');
font-weight: normal;
font-style: normal; }

@font-face {
font-family: 'icons';
src: url('fonts/icons.eot');
src: url('fonts/icons.eot#iefix') format('embedded-opentype'),
url('fonts/icons.woff') format('woff'),
url('fonts/icons.ttf') format('truetype'),
url('fonts/icons.svg#icons') format('svg');
font-weight: normal;
font-style: normal; }


/*--- TEXT SİTİL ---*/
.formoid input[type=text],
.formoid input[type=kadi],
.formoid input[type=password],
.formoid input[type=parola],
.formoid input[type=cahapca],

.formoid input[type=baslik],
.formoid input[type=ozet],
.formoid input[type=metin],
.formoid input[type=detay],
.formoid input[type=resim],
.formoid input[type=sira],

.formoid input[type=isim],
.formoid input[type=tel],
.formoid input[type=email],
.formoid input[type=web],
.formoid input[type=date],
.formoid input[type=tarih],
.formoid input[type=adres],
.formoid input[type=mesaj],
.formoid textarea{

outline:none; appearance:normal;
margin:auto;  padding:10px 10px 10px 30px;
font-family: Arial;	font-size:13px; color:#000; font-weight:normal; text-align:left;
border:1px solid #00ccff; border-radius:3px;
background:#FFFFFF url() no-repeat left center;

-webkit-transition:  all 0.5s ease-in-out;
-moz-transition:  all 0.5s ease-in-out;
-o-transition:  all 0.5s ease-in-out;
-ms-transition:  all 0.5s ease-in-out;
transition:  all 0.5s ease-in-out;}

.formoid input[type=kadi],
.formoid input[type=password]{
padding:12px 2% 12px 33px;
color:#000; border:1px solid #0CF; border-radius:2px;
background:#fff;  }

/*--- TEXT HOVER ---*/
.formoid input[type=text]:hover,
.formoid input[type=kadi]:hover,
.formoid input[type=password]:hover,
.formoid input[type=parola]:hover,
.formoid input[type=cahapca]:hover,

.formoid input[type=baslik]:hover,
.formoid input[type=metin]:hover,
.formoid input[type=detay]:hover,
.formoid input[type=resim]:hover,
.formoid input[type=sira]:hover,

.formoid input[type=isim]:hover,
.formoid input[type=tel]:hover,
.formoid input[type=email]:hover,
.formoid input[type=web]:hover,
.formoid input[type=date]:hover,
.formoid input[type=tarih]:hover,
.formoid input[type=adres]:hover,
.formoid input[type=mesaj]:hover,
.formoid textarea:hover {
	
color:#333; border-color:#CCC; border-radius:3px; background-color:#fff; 
-webkit-transition:  all 0.5s ease-in-out;
-moz-transition:  all 0.5s ease-in-out;
-o-transition:  all 0.5s ease-in-out;
-ms-transition:  all 0.5s ease-in-out;
transition:  all 0.5s ease-in-out;}

.formoid input[type=kadi]:hover,
.formoid input[type=password]:hover {
color:#000; border:1px solid #CCC; 
border-radius:50px; background-color:#fff;}

/*--- İCON SİTİL  ---*/
.formoid .icon-position { 
position: relative;}

.formoid .icon-sitil:before {
position: absolute;
font: 18px 'icons'; 
color:#00ccff;
vertical-align:top;
top:8px;  left:10px;
pointer-events: none;}

.formoid input[type=kadi] ~ .icon-sitil:before,
.formoid input[type=password] ~ .icon-sitil:before{  
 position: absolute;
font: 18px 'icons'; 
color:#00ccff;
vertical-align:top;
top:9px;  left:15px;
pointer-events: none;}

/*--- İCON HOVER  ---*/
.formoid input:hover ~ .icon-sitil:before,
.formoid text:hover ~ .icon-sitil:before,
.formoid textarea:hover ~ .icon-sitil:before,
.formoid select:hover ~ .icon-sitil:before,
.formoid input[type=file]:hover ~ .icon-sitil:before,
.formoid .button:hover ~ .icon-sitil:before,
.formoid .file_text:hover ~ .icon-sitil:before{  
color: #333;
-webkit-transition:  all 0.4s ease-in-out;
-moz-transition:  all 0.4s ease-in-out;
-o-transition:  all 0.4s ease-in-out;
-ms-transition:  all 0.4s ease-in-out;
transition:  all 0.4s ease-in-out; }

/*--- İCON HOVER  ---*/
.formoid input[type=kadi]:hover ~ .icon-sitil:before,
.formoid input[type=password]:hover ~ .icon-sitil:before{  
color:#333; }

/*--- İCONLAR  ---*/

.formoid .icon-sira .icon-position .icon-sitil:before  { content:'\E801';}
.formoid .icon-baslik .icon-position .icon-sitil:before{ content:'\e800';}
.formoid .icon-baslik2 .icon-position .icon-sitil:before { content:'\270D';}
.formoid .icon-ozet .icon-position .icon-sitil:before  { content:'\e800';}
.formoid .icon-metin .icon-position .icon-sitil:before { content:'\e800';}
.formoid .icon-detay .icon-position .icon-sitil:before { content:'\e800';}
.formoid .icon-resim .icon-position .icon-sitil:before { content:'\e804';}

.formoid .icon-isim .icon-position .icon-sitil:before { content:'\e80B';}
.formoid .icon-tel .icon-position .icon-sitil:before  { content:'\e808';}
.formoid .icon-email .icon-position .icon-sitil:before{ content:'\e805';}
.formoid .icon-web .icon-position .icon-sitil:before  { content:'\e806';}
.formoid .icon-adres .icon-position .icon-sitil:before{ content:'\e809';}
.formoid .icon-mesaj .icon-position .icon-sitil:before{ content:'\e800';}
.formoid .icon-harita .icon-position .icon-sitil:before{ content:'\e809';}
.formoid .icon-tarih .icon-position .icon-sitil:before{ content:'\e802';}

.formoid .icon-kadi .icon-position .icon-sitil:before   { content:'\e80B';}
.formoid .icon-parola .icon-position .icon-sitil:before { content:'\e807';}
.formoid .icon-cahapca .icon-position .icon-sitil:before{ content: '\270d';}

::placeholder { /* Firefox, Chrome, Opera */ color: #C0C0C0;} 
:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #C0C0C0;} 
::-ms-input-placeholder { /* Microsoft Edge */    color: #C0C0C0;}

/* icons *******************//*
\e800 - icon-text
\e801 - icon-select
\e802 - icon-date
\e803 - icon-numara
\e804 - icon-file
\e805 - icon-email
\e806 - icon-url
\e807 - icon-pass
\e808 - icon-phone
\e809 - icon-street
\e80A - icon-city
\e80B - icon-profile
\128257 - çiftok
\1f501 - çiftok
*/