html,body {
    height:100%;
    width:100%;
    margin:0;
    padding:0;
}
body {
    background-color:#FFF;
    font-size:100%;
    font-family:"Trebuchet MS";
    overflow:hidden;
}
a img { border:0; }
      
#map {
    background-color:#FFF;
    border:solid 2px #6495ED;
    height:26px;
    margin:5px; 
    padding:0;
    z-index:0;  
}
      
#header {
    background-color:#396C9B;
    border:solid 2px #396C9B;
    color:#ffffff;
    font-size:1.02em;
    font-weight:700;
    text-align:center;
}
#footer {
      background-color:#396C9B;
      color:#ffffff;
      font-size:0.8em;
      font-weight:400;
      height:30px; padding:0;
      text-align:center;
}
#footer span {text-align:center;}

.claro .dijitSliderDecrementIconH, .claro .dijitSliderIncrementIconH, .claro .dijitSliderDecrementIconV, .claro .dijitSliderIncrementIconV {
    
    border: 1px solid #B5BCC7;
    border-radius: 10px;
    font-size: 1px;
}

.claro .dijitSliderDecrementIconV 
{
    background: url("icon-zoomout.png") no-repeat top left;
    background-position: 0 0;
    width:32px;
    height:32px;
    border: none;
}    

  .claro .dijitSliderIncrementIconV {
    background: url("icon-zoomin.png") no-repeat top left;
    background-position: 0 0;
    width:32px;
    height:32px;
    border:none;
}


.roundedCorners {-o-border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px;}
.myCircle{-o-border-radius:0.8em; -moz-border-radius:0.8em; -webkit-border-radius:0.8em; border-radius:0.8em;} 

.shadow {
    -o-border-radius:10px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    box-shadow:4px 4px 8px #adadad;
    -webkit-box-shadow:4px 4px 8px #adadad;
    -moz-box-shadow:4px 4px 8px #adadad;
    -o-box-shadow:4px 4px 8px #adadad;
}

.layout {display: table; width:100%; }
.hgroupheader {display: table-row; margin:auto;}
.hgroup {display: table-row;}

#header .cellGeo{display: table-cell; width:28px;}
#header .cellTitle{display: table-cell;}
#header .cellSearch{display: table-cell; width:22px;}
#header .button_geo {
    background-color: transparent; /* make the button transparent */
    background-repeat: no-repeat;  /* make the background image appear only once */
    background-position: 0px 0px;  /* equivalent to 'top left' */
    border: none;           /* assuming we don't want any borders */
    cursor: pointer;        /* make the cursor like hovering over an <a> element */
    height: 22px;           /* make this the size of your image */
    border-radius: 24px; width:22px;
    padding: 2px;     /* make text start to the right of the image */
    vertical-align: middle; /* align the text vertically centered */
}
#header .button_geo:hover {background-color:#4082CD;}
#header .button_search {
    background-color: transparent; /* make the button transparent */
    background-repeat: no-repeat;  /* make the background image appear only once */
    background-position: 0px 0px;  /* equivalent to 'top left' */
    border: none;           /* assuming we don't want any borders */
    cursor: pointer;        /* make the cursor like hovering over an <a> element */
    height: 22px;           /* make this the size of your image */
    border-radius: 24px; width:22px;
    padding: 2px;     /* make text start to the right of the image */
    vertical-align: middle; /* align the text vertically centered */
}
#header .button_search:hover {background-color:#4082CD;}


#footer .layout {height:30px; }
#footer .cellleft {display: table-cell; border-right:solid 1px #11345B; padding-top:5px; padding-bottom:0px;}
#footer .cellleft:hover {background-color:#4082CD; cursor:pointer;}
#footer .cellright {display: table-cell; padding-top:5px; padding-bottom:0px;}
#footer .cellright:hover {background-color:#4082CD; cursor:pointer;}

.myCustomPanel{position: fixed; display:none; z-index:111; color:#fff; font-weight:bold; font-size:0.8em; font-family:Arial; background:#333333;}
.myCustomPanel .mcpHeader{border-bottom:1px solid #333333; height:37px; font-size:1.2em; color:#fff; font-weight:bold;}
.myCustomPanel .title{float:left; cursor:pointer; margin:5px; padding:10px;}
.myCustomPanel .close{float:right; vertical-align:middle; cursor:pointer; margin:2px 2px 2px 2px;}

#myTemplatePanel{width:230px; margin: 0 auto;}
#myFakeMenu{left:10px; bottom:50px;}
#myQuickMenu{left:10px; bottom:50px;}
#mapLayers{ right:10px; bottom:50px;}	      
#mySearchPanel{right:14px; top:62px; max-width:210px;}
.myPanelContent{background:#396C9B; text-align:justify; border:1px solid #333333; padding:5px 5px 5px 5px; margin:0 auto;}
.myPanelContent select{height:2.6em; padding:2px; font-size:0.8em; margin:4px; overflow:hidden; vertical-align:bottom; }
.myPanelContent select option {height:2.6em; font-size:1.2em; width:210px; }
.myPanelContent input{height:2em; margin:4px; font-size:1.2em; background:#D8D8D8; }
.myPanelContent fieldset{ float:left;}

.restt {overflow-x:hidden !important; overflow-y:scroll;}

/* all */
::-webkit-input-placeholder { letter-spacing:3px; color:#999; background:#D8D8D8; }
::-moz-placeholder { letter-spacing:3px; color:#999; background:#D8D8D8; } /* firefox 19+ */
:-ms-input-placeholder { letter-spacing:3px; color:#999; background:#D8D8D8; } /* ie */
input:-moz-placeholder { letter-spacing:3px; color:#999; background:#D8D8D8; }

#myQuickMenu .layout {height:26px; text-align:center; vertical-align:top;}
#myQuickMenu .cell {display: table-cell;  padding-top:5px; padding-bottom:0px; width:40px;}
.mid{border-right:solid 1px #11345B;}
.mid:hover {background-color:#5F5F5F; cursor:pointer;}

.midRow{display: table-row; margin:auto; height:18px;}
.emptyCell{display: table-cell; width:10px;}

div.spPanel{display: table; width:100%; text-align: center; }
div.spHeader {display: table-row; margin:auto; }
div.spGroup {display: table-row;}
div.spCellLeft {display: table-cell; background:#54A0E6; padding:10px; width:36px;}
div.spCellLeft:hover {background-color:#4082CD; cursor:pointer;}  
div.spCellMid{display: table-cell; width:18px; }    
div.spCellRight {display: table-cell; background:#54A0E6; padding:10px; width:36px;}
div.spCellRight:hover {background-color:#4082CD; cursor:pointer;}
div.spLabell{display: table-cell; padding:1px; margin:0 auto; float:left; font-size:0.8em;}
div.spLabelr{display: table-cell; padding:1px; margin:0 auto; float:right; font-size:0.8em;}


div.tbPanel{display: table; width:100%; text-align: center;}
div.tbHeader{display: table-row; margin:auto;}
div.tbCellLeft {display: table-cell; background:#ffffff; padding:1px;}
div.tbCellLeft:hover {background-color:#B6B4B4; cursor:pointer;} 
div.tbCellLeft a:active {background-color:#A4A4A4;}  
div.tbCellMid{display: table-cell; width:18px; }    
div.tbCellRight {display: table-cell; background:#ffffff; padding:1px;}
div.tbCellRight:hover {background-color:#B6B4B4; cursor:pointer;}
div.tbCellRight a:active {background-color:#A4A4A4; }
.btn{ width:84px;}

.listPanel{display:table; text-align:justify; font-size:0.7em;}
.listHeader{display: table-row; margin:auto;}
.listHeadCell{display: table-cell; margin:auto; text-align:center; width:65px;}
.listCell {display: table-cell; margin:0 auto;}
.listCell ul{list-style-type: none; margin: 0.1em; padding: 0; color:#fff; text-align: left;}
.listCell li{display:inline-block; width: 28px; vertical-align: top; margin:0.6em; background: #316DA5; overflow: hidden; font-size:0.8em;}
.listCell li:hover{cursor:pointer; background: #3B82C4;}	
.listCell li img {display: inline-block; float:left;}
.listCell li .clock{display: inline-block; float:right; color:#000; border-radius: 24px; background:#ffffff; padding:2px 4px; font: 400 10px/1.5 Georgia, Times New Roman, serif;}
.listCell img {display:inline-block;}
.listCellDiv{display: table-cell; width:0.1em; }
.listCellMid{display: table-cell; width:3px;}
.mes {width:70px;}

#kucult{max-height:230px;}
.divli{width:200px;}
.divsaatli{width:180px; max-height:230px;}
.eyed
{
    margin-bottom:2px;
    margin-top:1px;
    width:186px; 
    padding: 3px 6px 3px 6px;
    /* Style */
    text-decoration: none;
    text-shadow: none;
    text-align: center;
    font-weight: bold;
    font-size:0.9em;
    background: #81BEF7;
    color: #fff;
    border: 3px solid #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
 .gidis
{
    display:inline-block;
    padding: 3px 6px 3px 6px;
    /* Style */
    text-decoration: none;
    text-shadow: none;
    text-align: center;
    font-weight: bold;
    background: #81BEF7;
    color: #fff;
    border: 3px solid #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
.donus
{
    display:inline-block;
    padding: 3px 6px 3px 6px;
    /* Style */
    text-decoration: none;
    text-shadow: none;
    text-align: center;
    font-weight: bold;
    background: #F07575;
    color: #fff;
    border: 3px solid #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
#item-list {margin: 0.5em; padding: 0; list-style-type: none; text-align: left; color:#fff; }	
#item-list li { display: inline-block; float:left; width:90%; vertical-align: top; margin-left: 0; padding: 3px 15px; background: #316DA5; border-radius: 5px; box-shadow: inset 0px 0px 20px #143758; overflow: hidden;}
#item-list li:hover {cursor:pointer; background: #3B82C4;}			
#item-list li img {display: inline-block; float:left;}
#item-list .clock{display: inline-block; float:right; color:#000; border-radius: 24px; background:#ffffff; padding:2px 4px; font: 400 10px/1.5 Georgia, Times New Roman, serif;}
#item-list a{text-decoration:none;}

.milist {margin: 0.5em; padding: 0; list-style-type: none; text-align: center; background-color:#FFF; }	
.milist li { color:#fff; display: inline-block; width:80%; vertical-align: top; margin-left: 0; padding: 3px 15px; background: #316DA5; border-radius: 5px; box-shadow: inset 0px 0px 20px #143758; overflow: hidden;}
.milist li:hover {cursor:pointer; background: #3B82C4;}			
.milist li img {display: inline-block; vertical-align:bottom; border-radius: 24px; padding:1px 1px;  margin:1px;}
.milist .clock{display: inline-block; color:#fff; border-radius: 24px; padding:2px 4px;}
.sagid{background:#81BEF7; }
.sadon{background:#F07575; }
.milist a{text-decoration:none;}
.milist span{text-align:center;}


#modalDurakContent { max-height:220px; overflow-x:hidden !important; overflow-y:scroll;}
#modalDurakContent img {
    max-width: 100%;
    height: auto;
    width: auto\9; /* ie8 */
}

.anlikspan{font-size:0.6em; display: inline-block;}

/*#modalDurakContent { max-height:220px; overflow-x:scroll; overflow-y:scroll;}*/
#myModalContent .uyar{margin-right:20px; max-width:210px;}
#myModalContent p{text-align:center; overflow:hidden !important;}

table td {background:#ffffff; padding:1px;}
table a:hover {background-color:#B6B4B4; cursor:pointer;} 

.meTable{display: table; width:170px; margin:auto; text-align: center;}
.meRow{display: table-row;}
.meCell{display: table-cell; width:100px; height:25px;}
.meCell img{background:#ffffff; display:inline-block;}
.meCell :hover{cursor:pointer;}

.modal .nodata:after {
    content: 'Kay\131 t Bulunamad\131';
    display: block;
    /* Position */
    position: absolute;
    left: 2px;
    top: 1px;    
    padding: 3px 6px 3px 6px;

    /* Style */
    text-decoration: none;
    text-shadow: none;
    text-align: center;
    font-weight: bold;
    background: #FACC2E;
    color: #fff;
    border: 3px solid #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
.modal .ne:after {
    content: 'N\F6 bet\E7 i Eczane Listesi';
    display: block;
    /* Position */
    position: absolute;
    left: -3px;
    top: -3px;    
    padding: 3px 6px 3px 6px;

    /* Style */
    text-decoration: none;
    text-shadow: none;
    text-align: center;
    font-weight: bold;
    background: #81BEF7;
    color: #fff;
    border: 3px solid #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
.modal .oy:after {
    content: '\D6 nemli Yerler Listesi';
    display: block;
    /* Position */
    position: absolute;
    left: -3px;
    top: -3px;    
    padding: 3px 6px 3px 6px;

    /* Style */
    text-decoration: none;
    text-shadow: none;
    text-align: center;
    font-weight: bold;
    background: #81BEF7;
    color: #fff;
    border: 3px solid #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
.modal .enyd:after {
    content: '\D6 nemli Yerler Listesi';
    display: block;
    /* Position */
    position: absolute;
    left: 2px;
    top: 1px;    
    padding: 3px 6px 3px 6px;

    /* Style */
    text-decoration: none;
    text-shadow: none;
    text-align: center;
    font-weight: bold;
    background: #81BEF7;
    color: #fff;
    border: 3px solid #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}

/* Modal Popup */
/* Container */
.modal {

    /* Overlay page content */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    z-index: 10000;

    /* Transition opacity on open */
    -webkit-transition: opacity 500ms ease-in;
    -moz-transition: opacity 500ms ease-in;
    transition: opacity 500ms ease-in;

    /* Hide for now */
    opacity: 0;
    pointer-events: none;
}

/* Show modal */
.modal:target {
    opacity: 1;
    pointer-events: auto;
    /* at time of writing (Feb 2012), pointer-events not supported by Opera or IE */
}

/* Content */
.modal .divCont {
    width:220px;
    background: #fff;
    position: relative;
    margin: 10% auto;    

    /* Default minimise animation */
    -webkit-animation: minimise 500ms linear;
    -moz-animation: minimise 500ms linear;

    /* Prettify */
    padding: 2px;
    border-radius: 7px;
    box-shadow: 0 3px 20px rgba(0,0,0,0.9);
    background: #fff;
    background: -moz-linear-gradient(#fff, #ccc);
    background: -webkit-linear-gradient(#fff, #ccc);
    background: -o-linear-gradient(#fff, #ccc);
    text-shadow: 0 1px 0 #fff;
}

/* Override animation on modal open */
.modal:target divCont {
    -webkit-animation-name: bounce;
    -moz-animation-name: bounce;
}



@-webkit-keyframes bounce {
  0% {
    -webkit-transform: scale3d(0.1,0.1,1);
    box-shadow: 0 3px 20px rgba(0,0,0,0.9);
  }
  55% {
    -webkit-transform: scale3d(1.08,1.08,1);
    box-shadow: 0 10px 20px rgba(0,0,0,0);
  }
  75% {
    -webkit-transform: scale3d(0.95,0.95,1);
    box-shadow: 0 0 20px rgba(0,0,0,0.9);
  }
  100% {
    -webkit-transform: scale3d(1,1,1);
    box-shadow: 0 3px 20px rgba(0,0,0,0.9);
  }
}

@-webkit-keyframes minimise {
  0% {
    -webkit-transform: scale3d(1,1,1);
  }
  100% {
    -webkit-transform: scale3d(0.1,0.1,1);
  }
}

@-moz-keyframes bounce {
  0% {
    -moz-transform: scale3d(0.1,0.1,1);
    box-shadow: 0 3px 20px rgba(0,0,0,0.9);
  }
  55% {
    -moz-transform: scale3d(1.08,1.08,1);
    box-shadow: 0 10px 20px rgba(0,0,0,0);
  }
  75% {
    -moz-transform: scale3d(0.95,0.95,1);
    box-shadow: 0 0 20px rgba(0,0,0,0.9);
  }
  100% {
    -moz-transform: scale3d(1,1,1);
    box-shadow: 0 3px 20px rgba(0,0,0,0.9);
  }
}

@-moz-keyframes minimise {
  0% {
    -moz-transform: scale3d(1,1,1);
  }
  100% {
    -moz-transform: scale3d(0.1,0.1,1);
  }
}

/* Modal close link */
.modal a[href="#close"] {
    position: absolute;
    right: 0;
    top: 0;
    color: transparent;
}

/* Reset native styles */
.modal a[href="#close"]:focus {
    outline: none;
}

/* Create close button */
.modal a[href="#close"]:after {
    content: 'X';
    display: block;

    /* Position */
    position: absolute;
    right: -3px;
    top: -3px;
    width: 1.5em;
    padding: 3px 6px 3px 6px;

    /* Style */
    text-decoration: none;
    text-shadow: none;
    text-align: center;
    font-weight: bold;
    background: #000;
    color: #fff;
    border: 3px solid #fff;
    border-radius: 20px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    }

    .modal a[href="#close"]:focus:after,
    .modal a[href="#close"]:hover:after {
    -webkit-transform: scale(1.1,1.1);
    -moz-transform: scale(1.1,1.1);
}

.modal a[href="#close"]:focus:after {
    outline: 1px solid #000;
}

/* Open modal */
a.openModal {
    margin: 0.2em auto;
    display: block;
    width: auto;
    background: #ccc;
    text-align: center;
    padding: 10px;
    border-radius: 7px;
    color: #306E9F;
    background: -moz-linear-gradient(#fff, #ddd);
    background: -webkit-linear-gradient(#fff, #ddd);
    background: -o-linear-gradient(#fff, #ddd);
    text-shadow: 0 1px 0 #fff;
    border: 1px solid rgba(0,0,0,0.1);
    box-shadow: 0 1px 1px rgba(0,0,0,0.3);
    text-decoration:none;
    font-size:1.8em;
}

a.openModal:hover,
a.openModal:focus {
    background: -moz-linear-gradient(#fff, #ccc);
    background: -webkit-linear-gradient(#fff, #ccc);
    background: -o-linear-gradient(#fff, #ccc);
}

/*custom modal for hareket saatleri*/
/* Modal Popup */
/* Container */
.modalSaat {

    /* Overlay page content */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    z-index: 10000;

    /* Transition opacity on open */
    -webkit-transition: opacity 500ms ease-in;
    -moz-transition: opacity 500ms ease-in;
    transition: opacity 500ms ease-in;

    /* Hide for now */
    opacity: 0;
    pointer-events: none;
}

/* Show modal */
.modalSaat:target {
    opacity: 1;
    pointer-events: auto;
    /* at time of writing (Feb 2012), pointer-events not supported by Opera or IE */
}

/* Content */
.modalSaat .divCont {
    width:220px;
    background: #fff;
    position: relative;
    margin: 10% auto;    

    /* Default minimise animation */
    -webkit-animation: minimise 500ms linear;
    -moz-animation: minimise 500ms linear;

    /* Prettify */
    padding: 2px;
    border-radius: 7px;
    box-shadow: 0 3px 20px rgba(0,0,0,0.9);
    background: #fff;
    background: -moz-linear-gradient(#fff, #ccc);
    background: -webkit-linear-gradient(#fff, #ccc);
    background: -o-linear-gradient(#fff, #ccc);
    text-shadow: 0 1px 0 #fff;
}

/* Override animation on modal open */
.modalSaat:target divCont {
    -webkit-animation-name: bounce;
    -moz-animation-name: bounce;
}


/* Modal close link */
.modalSaat a[href="#close"] {
    position: absolute;
    right: 0;
    top: 0;
    color: transparent;
}

/* Reset native styles */
.modalSaat a[href="#close"]:focus {
    outline: none;
}

/* Create close button */
.modalSaat a[href="#close"]:after {
    content: 'X';
    display: block;

    /* Position */
    position: absolute;
    right: -3px;
    top: -3px;
    width: 1.5em;
    padding: 3px 6px 3px 6px;

    /* Style */
    text-decoration: none;
    text-shadow: none;
    text-align: center;
    font-weight: bold;
    background: #000;
    color: #fff;
    border: 3px solid #fff;
    border-radius: 20px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    }

    .modalSaat a[href="#close"]:focus:after,
    .modalSaat a[href="#close"]:hover:after {
    -webkit-transform: scale(1.1,1.1);
    -moz-transform: scale(1.1,1.1);
}

.modalSaat a[href="#close"]:focus:after {
    outline: 1px solid #000;
}

/* Open modal */
a.openModalSaat {
    margin: 0.2em auto;
    display: block;
    width: auto;
    background: #ccc;
    text-align: center;
    padding: 10px;
    border-radius: 7px;
    color: #306E9F;
    background: -moz-linear-gradient(#fff, #ddd);
    background: -webkit-linear-gradient(#fff, #ddd);
    background: -o-linear-gradient(#fff, #ddd);
    text-shadow: 0 1px 0 #fff;
    border: 1px solid rgba(0,0,0,0.1);
    box-shadow: 0 1px 1px rgba(0,0,0,0.3);
    text-decoration:none;
    font-size:1.8em;
}

a.openModalSaat:hover,
a.openModalSaat:focus {
    background: -moz-linear-gradient(#fff, #ccc);
    background: -webkit-linear-gradient(#fff, #ccc);
    background: -o-linear-gradient(#fff, #ccc);
}


/*custom modal for anlık otobüs bilgisi*/
/* Modal Popup */
/* Container */
.modalDurak {

    /* Overlay page content */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    z-index: 10000;

    /* Transition opacity on open */
    -webkit-transition: opacity 500ms ease-in;
    -moz-transition: opacity 500ms ease-in;
    transition: opacity 500ms ease-in;

    /* Hide for now */
    opacity: 0;
    pointer-events: none;
}

/* Show modal */
.modalDurak:target {
    opacity: 1;
    pointer-events: auto;
    /* at time of writing (Feb 2012), pointer-events not supported by Opera or IE */
}

/* Content */
.modalDurak .divCont {
    max-width:500px;
    background: #fff;
    position: relative;
    margin: 10% auto;    

    /* Default minimise animation */
    -webkit-animation: minimise 500ms linear;
    -moz-animation: minimise 500ms linear;

    /* Prettify */
    padding: 2px;
    border-radius: 7px;
    box-shadow: 0 3px 20px rgba(0,0,0,0.9);
    background: #fff;
    background: -moz-linear-gradient(#fff, #ccc);
    background: -webkit-linear-gradient(#fff, #ccc);
    background: -o-linear-gradient(#fff, #ccc);
    text-shadow: 0 1px 0 #fff;
}

/* Override animation on modal open */
.modalDurak:target divCont {
    -webkit-animation-name: bounce;
    -moz-animation-name: bounce;
}

/* Modal close link */
.modalDurak a[href="#close"] {
    position: absolute;
    right: 0;
    top: 0;
    color: transparent;
}

/* Reset native styles */
.modalDurak a[href="#close"]:focus {
    outline: none;
}

/* Create close button */
.modalDurak a[href="#close"]:after {
    content: 'X';
    display: block;

    /* Position */
    position: absolute;
    right: -3px;
    top: -3px;
    width: 1.5em;
    padding: 3px 6px 3px 6px;

    /* Style */
    text-decoration: none;
    text-shadow: none;
    text-align: center;
    font-weight: bold;
    background: #000;
    color: #fff;
    border: 3px solid #fff;
    border-radius: 20px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    }

    .modalDurak a[href="#close"]:focus:after,
    .modalDurak a[href="#close"]:hover:after {
    -webkit-transform: scale(1.1,1.1);
    -moz-transform: scale(1.1,1.1);
}

.modalDurak a[href="#close"]:focus:after {
    outline: 1px solid #000;
}


/* Open modal */
a.openModalDurak 
{
    margin-left:5px;
    display: inline-block;
    width: 50px;
    background: #ccc;
    text-align: center;
    font-weight:200;
    padding: 1px;
    border-radius: 7px;
    color: #306E9F;
    background: -moz-linear-gradient(#fff, #ddd);
    background: -webkit-linear-gradient(#fff, #ddd);
    background: -o-linear-gradient(#fff, #ddd);
    text-shadow: 0 1px 0 #fff;
    border: 1px solid rgba(0,0,0,0.1);
    box-shadow: 0 1px 1px rgba(0,0,0,0.3);
    text-decoration:none;
    font-size:0.6em;
}

a.openModalDurak:hover,
a.openModalDurak:focus {
    background: -moz-linear-gradient(#fff, #ccc);
    background: -webkit-linear-gradient(#fff, #ccc);
    background: -o-linear-gradient(#fff, #ccc);
}

a.openDurakNP{
    margin-left:5px;
    display: inline-block;
    width: 50px;
    background: #ccc;
    text-align: center;
    font-weight:500;
    padding: 1px;
    border-radius: 7px;
    color: #306E9F;
    background: -moz-linear-gradient(#fff, #ddd);
    background: -webkit-linear-gradient(#fff, #ddd);
    background: -o-linear-gradient(#fff, #ddd);
    text-shadow: 0 1px 0 #fff;
    border: 1px solid rgba(0,0,0,0.1);
    box-shadow: 0 1px 1px rgba(0,0,0,0.3);
    text-decoration:none;
    font-size:0.6em;
}
a.openDurakNP:hover,
a.openDurakNP:focus {
    background: -moz-linear-gradient(#fff, #ccc);
    background: -webkit-linear-gradient(#fff, #ccc);
    background: -o-linear-gradient(#fff, #ccc);
}


/*custom indicator*/
.modalIndicator {

    /* Overlay page content */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: transparent;
    z-index: 10000;

    /* Transition opacity on open */
    -webkit-transition: opacity 500ms ease-in;
    -moz-transition: opacity 500ms ease-in;
    transition: opacity 500ms ease-in;

    /* Hide for now */
    opacity: 0;
    pointer-events: none;
}

/* Show modal */
.modalIndicator:target {
    opacity: 1;
    pointer-events: auto;
    /* at time of writing (Feb 2012), pointer-events not supported by Opera or IE */
}

/* Content */
.modalIndicator > div {
    width: 110px;
    background: transparent;
    position: relative;
    margin: 10% auto;

    /* Default minimise animation */
    -webkit-animation: minimise 500ms linear;
    -moz-animation: minimise 500ms linear;

    /* Prettify */
    padding: 7px;
    
    box-shadow: 0 3px 20px rgba(0,0,0,0.9);
    background: transparent;
    background: -moz-linear-gradient(transparent, #ccc);
    background: -webkit-linear-gradient(transparent, transparent);
    background: -o-linear-gradient(transparent, #ccc);
    text-shadow: 0 1px 0 #fff;
}

/* Override animation on modal open */
.modalIndicator:target > div {
    -webkit-animation-name: bounce;
    -moz-animation-name: bounce;
}

.modalIndicator h2 {
    font-size: 16px;
    padding: 0 0 10px;
}



/* Modal close link */
.modalIndicator a[href="#close"] {
    position: absolute;
    right: 0;
    top: 0;
    color: transparent;
}

/* Reset native styles */
.modalIndicator a[href="#close"]:focus {
    outline: none;
}

/* Create close button */
.modalIndicator a[href="#close"]:after {
    content: 'X';
    display: block;

    /* Position */
    position: absolute;
    right: -10px;
    top: -10px;
    width: 1.5em;
    padding: 1px 1px 1px 2px;

    /* Style */
    text-decoration: none;
    text-shadow: none;
    text-align: center;
    font-weight: bold;
    background: #000;
    color: #fff;
    border: 3px solid #fff;
    border-radius: 20px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    }

    .modalIndicator a[href="#close"]:focus:after,
    .modalIndicator a[href="#close"]:hover:after {
    -webkit-transform: scale(1.1,1.1);
    -moz-transform: scale(1.1,1.1);
}

.modalIndicator a[href="#close"]:focus:after {
    outline: 1px solid #000;
}

/* Open modal */
a.openModalIndicator {
    margin: 1em auto;
    display: block;
    width: 200px;
    background: #ccc;
    text-align: center;
    padding: 10px;
    border-radius: 7px;
    background: #fff;
    background: -moz-linear-gradient(#fff, #ddd);
    background: -webkit-linear-gradient(#fff, #ddd);
    background: -o-linear-gradient(#fff, #ddd);
    text-shadow: 0 1px 0 #fff;
    border: 1px solid rgba(0,0,0,0.1);
    box-shadow: 0 1px 1px rgba(0,0,0,0.3);
}

a.openModalIndicator:hover,
a.openModalIndicator:focus {
    background: -moz-linear-gradient(#fff, #ccc);
    background: -webkit-linear-gradient(#fff, #ccc);
    background: -o-linear-gradient(#fff, #ccc);
}




/*custom modal for iletişim formu*/
/* Modal Popup */
/* Container */
.modalIletisim {

    /* Overlay page content */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    z-index: 10000;

    /* Transition opacity on open */
    -webkit-transition: opacity 500ms ease-in;
    -moz-transition: opacity 500ms ease-in;
    transition: opacity 500ms ease-in;

    /* Hide for now */
    opacity: 0;
    pointer-events: none;
}

/* Show modal */
.modalIletisim:target {
    opacity: 1;
    pointer-events: auto;
    /* at time of writing (Feb 2012), pointer-events not supported by Opera or IE */
}

/* Content */
.modalIletisim .divCont {
    max-width:500px;
    background: #fff;
    position: relative;
    margin: 10% auto;    

    /* Default minimise animation */
    -webkit-animation: minimise 500ms linear;
    -moz-animation: minimise 500ms linear;

    /* Prettify */
    padding: 2px;
    border-radius: 7px;
    box-shadow: 0 3px 20px rgba(0,0,0,0.9);
    background: #fff;
    background: -moz-linear-gradient(#fff, #ccc);
    background: -webkit-linear-gradient(#fff, #ccc);
    background: -o-linear-gradient(#fff, #ccc);
    text-shadow: 0 1px 0 #fff;
}

/* Override animation on modal open */
.modalIletisim:target divCont {
    -webkit-animation-name: bounce;
    -moz-animation-name: bounce;
}

/* Modal close link */
.modalIletisim a[href="#close"] {
    position: absolute;
    right: 0;
    top: 0;
    color: transparent;
}

/* Reset native styles */
.modalIletisim a[href="#close"]:focus {
    outline: none;
}

/* Create close button */
.modalIletisim a[href="#close"]:after {
    content: 'X';
    display: block;

    /* Position */
    position: absolute;
    right: -3px;
    top: -3px;
    width: 1.5em;
    padding: 3px 6px 3px 6px;

    /* Style */
    text-decoration: none;
    text-shadow: none;
    text-align: center;
    font-weight: bold;
    background: #991D57;
    color: #fff;
    border: 3px solid #fff;
    border-radius: 20px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    }

.modalIletisim a[href="#close"]:focus:after,
.modalIletisim a[href="#close"]:hover:after {
    -webkit-transform: scale(1.1,1.1);
    -moz-transform: scale(1.1,1.1);
}

.modalIletisim a[href="#close"]:focus:after {
    outline: 1px solid #000;
}


/* Open modal */
a.openModalIletisim 
{
    margin: 0.2em auto;
    display: block;
    width: auto;
    background: #ccc;
    text-align: center;
    padding: 10px;
    border-radius: 7px;
    color: #306E9F;
    background: -moz-linear-gradient(#fff, #ddd);
    background: -webkit-linear-gradient(#fff, #ddd);
    background: -o-linear-gradient(#fff, #ddd);
    text-shadow: 0 1px 0 #fff;
    border: 1px solid rgba(0,0,0,0.1);
    box-shadow: 0 1px 1px rgba(0,0,0,0.3);
    text-decoration:none;
    font-size:1.6em;
}

a.openModalIletisim:hover,
a.openModalIletisim:focus {
    background: -moz-linear-gradient(#fff, #ccc);
    background: -webkit-linear-gradient(#fff, #ccc);
    background: -o-linear-gradient(#fff, #ccc);
}

.modalIletisim .if:after {
    content: '\130 leti\15f im Formu';
    display: block;
    /* Position */
    position: absolute;
    left: -3px;
    top: -3px;    
    padding: 1px 3px 2px 3px;
    font-size:0.9em;
    /* Style */
    text-decoration: none;
    text-shadow: none;
    text-align: center;
    font-weight: bold;
    background: #EA3A8C; /*81BEF7;*/
    color: #fff;
    border: 3px solid #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
#contact-form *{
	margin:0;
	padding:0;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	-moz-font-smoothing:antialiased;
	-o-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}
#contact-form input[type="text"],
#contact-form input[type="email"],
#contact-form input[type="tel"],
#contact-form input[type="url"],
#contact-form textarea,
#contact-form button[type="submit"] {
	font:400 10px/10px "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#contact-form {
	text-shadow:0 1px 0 #FFF;
	border-radius:4px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	background:#F9F9F9;
	padding:2px;
}
#contact-form h3 {
	color:#991D57;
	display:block;
	font-size:28px;
}
#contact-form h4 {
	margin:1px 0 1px;
	display:block;
	font-size:0.9em;
	text-align:center;
	color:#338BD3;
}
.successful{color:#248E13;}
.failed{color:#F52C47;}
#contact-form label span {
	cursor:pointer;
	color:#991D57;
	display:block;
	font-size:0.8em;
	margin:3px 0 1px 0;
	font-weight:900;
}
#contact-form input[type="text"],
#contact-form input[type="email"],
#contact-form input[type="tel"],
#contact-form input[type="url"],
#contact-form textarea {
	width:100%;
	box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	-webkit-box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	-moz-box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	border:1px solid #CCC;
	background:#FFF;
	margin:0 0 1px;
	padding:3px;
	border-radius:5px;
}
#contact-form input[type="text"]:hover,
#contact-form input[type="email"]:hover,
#contact-form input[type="tel"]:hover,
#contact-form input[type="url"]:hover,
#contact-form textarea:hover {
	-webkit-transition:border-color 0.3s ease-in-out;
	-moz-transition:border-color 0.3s ease-in-out;
	transition:border-color 0.3s ease-in-out;
	border:1px solid #AAA;
}
#contact-form textarea {
	height:60px;
	max-width:100%;
}
#contact-form input[type="submit"] {
	cursor:pointer;
	width:100%;
	border:none;
	background:#991D57;
	background-image:linear-gradient(bottom, #8C1C50 0%, #991D57 52%);
	background-image:-moz-linear-gradient(bottom, #8C1C50 0%, #991D57 52%);
	background-image:-webkit-linear-gradient(bottom, #8C1C50 0%, #991D57 52%);
	color:#FFF;
	margin:0 0 5px;
	padding:3px;
	border-radius:5px;
}
#contact-form input[type="submit"]:hover {
	background-image:linear-gradient(bottom, #9C215A 0%, #A82767 52%);
	background-image:-moz-linear-gradient(bottom, #9C215A 0%, #A82767 52%);
	background-image:-webkit-linear-gradient(bottom, #9C215A 0%, #A82767 52%);
	-webkit-transition:background 0.3s ease-in-out;
	-moz-transition:background 0.3s ease-in-out;
	transition:background-color 0.3s ease-in-out;
}
#contact-form input[type="submit"]:active {
	box-shadow:inset 0 1px 3px rgba(0,0,0,0.5);
}
#contact-form input:focus,
#contact-form textarea:focus {
	outline:0;
	border:1px solid #999;
}
::-webkit-input-placeholder {
    color:#888;
}
:-moz-placeholder {
    color:#888;
}
::-moz-placeholder {
    color:#888;
}
:-ms-input-placeholder {
    color:#888;
}