fieldset {
    font-family: Segoe UI;
    
    
}

fieldset legend {
    background: #20A3D9;
    color: #fff;
    padding: 5px 10px ;
    font-size: 18px;
    
}

label {
  float:left;
  width:25%;
  margin-right:0.5em;
  padding-top:0.2em;
  text-align:right;
  font-weight:bold;
  }
.atisoft-yazi-kirmizi2014 {
     color: #DBE1D0; background: #CC2C00; padding:50px;
    -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
 
        }


.atisoft-yazi-acikkahve2014 {
     
    color: #DBE1D0; background: #D8A303;   padding:50px;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }

.atisoft-yazi-yesil2014 {
            
    color: #DBE1D0; background: #5C9E0A; padding:50px;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }


.atisoft-yazi-acikmavi2014 {
            
     color: #DBE1D0; background: #2586DA; padding:50px;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }


.atisoft-yazi-red {
            
    color: #DBE1D0; background: #e51c23; padding:50px;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }

.atisoft-yazi-pink {
            
    color: #DBE1D0; background: #e91e63; padding:50px;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }

.atisoft-yazi-purple {
            
     color: #DBE1D0; background: #9c27b0; padding:50px;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }



 .atisoft-yazi-deeppurple {
            
     color: #DBE1D0; background: #673ab7; padding:50px;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }


.atisoft-yazi-indigo {
            
    color: #DBE1D0; background: #3f51b5; padding:50px;
      -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }



.atisoft-yazi-blue {
            
    color: #DBE1D0; background: #3f51b5; padding:50px;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }

.atisoft-yazi-lightblue {
            
    color: #DBE1D0; background: #03a9f4; padding:50px;
    -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }

.atisoft-yazi-cyan {
            
     color: #DBE1D0; background: #00bcd4; padding:50px;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
     -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }

.atisoft-yazi-teal {
    color: #DBE1D0; background: #009688; padding:50px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }

.atisoft-yazi-green {
    color: #DBE1D0; background: #259b24; padding:50px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }

.atisoft-yazi-lightgreen {
    color: #DBE1D0; background: #8bc34a; padding:50px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }

.atisoft-yazi-lime {
    color: #DBE1D0; background: #cddc39; padding:50px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
     border-radius: 5px;
     box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
        }
    
 
.atisoft-yazi-yellow {
    color: #DBE1D0; background: #ffeb3b; padding:50px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    }

.atisoft-yazi-amber {
    color: #DBE1D0; background: #ffc107; padding:50px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    }


.atisoft-yazi-orange {
    color: #DBE1D0; background: #ff9800; padding:50px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    }


.atisoft-yazi-deeporange {
    color: #DBE1D0; background: #ff5722; padding:50px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    }

.atisoft-yazi-brown {
    color: #DBE1D0; background: #795548; padding:50px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    }

.atisoft-yazi-grey {
    color: #DBE1D0; background: #9e9e9e; padding:50px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    }


.atisoft-yazi-bluegrey {
    color: #DBE1D0; background: #607d8b; padding:50px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -moz-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    -webkit-box-shadow: 0px 3px 29px rgba(0, 0, 0, 0.99);
    }

.box-2014-yesil-mobilya:hover {
	background: #FA5705;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}
.box-2014-yesil {
	padding-left: 20px;
	width: 220px;
	height: 30px;
	position: relative;
	background: #73880a;
	margin: 1em 0 0.5em 0;
	font-weight: 600;
	 
	font-size: 14px;
	line-height: 20px;
	border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px;-webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
}

.box-2014-yesil:hover {
	background: #FA5705;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}


.box-2014-turuncu {
	padding-left: 20px;
	width: 220px;
	height: 30px;
	position: relative;
	background: #FA5705;
	margin: 1em 0 0.5em 0;
	font-weight: 600;
	 
	font-size: 14px;
	line-height: 20px;
	border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px;-webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
}

.box-2014-turuncu:hover {
	background: #29D3D6;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}


.atisoft-h1{
	margin: 1em 0 0.5em 0;
	font-weight: 600;
	position: relative;
	font-size: 36px;
	line-height: 20px;
	color: white;
	 
}

.atisoft-h2 {
	margin: 1em 0 0.5em 0;
	font-weight: 600;
	position: relative;
	font-size: 28px;
	line-height: 20px;
	color: white;
}

.atisoft-h3 {
	margin: 1em 0 0.5em 0;
	font-weight: 600;
	position: relative;
	font-size: 22px;
	line-height: 20px;
	color: white;
}

.atisoft-h4 {
	margin: 1em 0 0.5em 0;
	font-weight: 600;
	position: relative;
	font-size: 18px;
	line-height: 20px;
	color: white;
	 
	 
}


.atisoft-box-2014 {
  position: relative;
  width: 80%;
  background: #ddd;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 1em 1.5em;
  color: rgba(0,0,0, .8);
  text-shadow: 0 1px 0 #fff;
  line-height: 1.5;
   
}


.atisoft-box-2014-beyaz {
  position: relative;
  width: 80%;
  background: #FDFCFC;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 1em 1.5em;
  color: rgba(0,0,0, .8);
  text-shadow: 0 1px 0 #fff;
  line-height: 1.5;
   
}

.atisoft
        {
            width: 100%;
        }
          
.kontrol-atisoft {
	background: white;
	border: 1px solid #DDD;
	border-radius: 5px;
	box-shadow: 0 0 5px #DDD inset;
	color: #666;
	float: left;
	padding: 5px 10px;
	width: 165px;
	outline: none;
}
          td { 
    
    
    padding: 4px; 
      
}


.kontrol-atisoft1 {

	position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	 
}

.kontrol-atisoft2014 {
 border: 0;
 border-radius: 7px;
 box-shadow: 1px 3px 7px #666;
	 
}

.kontrol-atisoft2014-1 {
 margin: 0px; border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px;-webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
	 
}


.kontrol-atisoft2 {

	 
	position: relative;
	-moz-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
	box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
	 
}
.kontrol-atisoft3 {
	position: relative;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	 
}

.kontrol-atisoft4 {
	webkit-border-radius:17px; /*atisoft  yuvarlak*/
   -moz-border-radius:17px; /*atisoft  yuvarlak*/
    border-radius:17px; /*atisoft  yuvarlak*/
	 
}



.atisoft-b1 {
background: #606c88;
padding:4px;
}

.atisoft-b2 {
background: #73880a;
padding:4px;
}

.atisoft-b3 {
background: #ffa84c;
padding:4px;  
}

.atisoft-b4 {
background: #eab92d;
padding:4px;   
}
.atisoft-b5 {
background: #24C5E5;
padding:4px;    
}

.atisoft-b6 {
background: #4C4E52;
padding:4px;  
}

.atisoft-b7 {
background: #E2341D;
padding:4px;  
}

.atisoft-b8 {
background: #5C8FA3;
padding:4px; 
}





.atisoft-sb1 {
background: #606c88;
padding:4px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
}

.atisoft-sb2 {
background: #73880a;
padding:4px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
}

.atisoft-sb3 {
background: #ffa84c;
padding:4px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);  
}

.atisoft-sb4 {
background: #eab92d;
padding:4px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7); 
}
.atisoft-sb5 {
background: #24C5E5;
padding:4px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);    
}

.atisoft-sb6 {
background: #4C4E52;
padding:4px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7); 
}

.atisoft-sb7 {
background: #E2341D;
padding:4px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);  
}

.atisoft-sb8 {
background: #5C8FA3;
padding:4px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7); 
}






/*
<div class="atisoft-b4">
<p>Atisoft Mobil Teknolojileri</p>
veya
<p><span style="font-weight: bold; color: rgb(255, 255, 255); font-size: 16px;">Ahmet Toraman Atisoft</span></p>

</div>
*/
/*
3 lü örnek
<div class="kontrol-atisoft1">
<div class="art-content-layout">
<div class="art-content-layout-row">
<div class="art-layout-cell" style="width: 33%;">
<p><img class="kontrol-atisoft1" alt="" src="/Data/Sites/1/efe2.png" height="100" width="200" /></p>
</div>
<div class="art-layout-cell" style="width: 34%;">
<p>Windows XP ve Office 2003’ün 10 yıldır süren teknik desteği 8 Nisan 2014 tarihinde sonlanıyor. Bu; hem Windows XP için onarım ve güncellemelerin bundan böyle çıkmayacağı, hem de zararlı ve casus yazılımlara karşı Microsoft’un koruma sağlamayacağı anlamına geliyor. Size özel fırsatımızı kaçırmayın, bir an önce Windows 8’e geçin.</p>
</div>
<div class="art-layout-cell" style="width: 33%;">
<p>Windows XP ve Office 2003’ün 10 yıldır süren teknik desteği 8 Nisan 2014 tarihinde sonlanıyor. Bu; hem Windows XP için onarım ve güncellemelerin bundan böyle çıkmayacağı, hem de zararlı ve casus yazılımlara karşı Microsoft’un koruma sağlamayacağı anlamına geliyor. Size özel fırsatımızı kaçırmayın, bir an önce Windows 8’e geçin.</p>
</div>
</div>
</div>
<div class="art-content-layout">
<div class="art-content-layout-row">
<div class="art-layout-cell" style="width: 100%;">
<p> </p>
</div>
</div>
</div>
</div>
*/


.imagepluscontainer{ /* main image container */
position: relative;
z-index: 1;
-webkit-border-radius:17px; /*atisoft  yuvarlak*/ 
-moz-border-radius:17px; /*atisoft  yuvarlak */
border-radius:17px; /*atisoft  yuvarlak */
}

.imagepluscontainer img{ /* CSS for image within container */
position: relative;
z-index: 2;
-moz-transition: all 0.5s ease; /* Enable CSS3 transition on all props */
-webkit-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;
-webkit-border-radius:17px; /*atisoft  yuvarlak*/ 
-moz-border-radius:17px; /*atisoft  yuvarlak */
border-radius:17px; /*atisoft  yuvarlak */
}

.imagepluscontainer:hover img{ /* CSS for image when mouse hovers over main container */
-moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
-moz-transform: scale(1.05, 1.05);
-webkit-transform: scale(1.05, 1.05);
-ms-transform: scale(1.05, 1.05);
-o-transform: scale(1.05, 1.05);
transform: scale(1.05, 1.05);
-webkit-border-radius:17px; /*atisoft  yuvarlak*/ 
-moz-border-radius:17px; /*atisoft  yuvarlak */
border-radius:17px; /*atisoft  yuvarlak */
}

.imagepluscontainer div.desc{ /* CSS for desc div of each image. */
position: absolute;
width: 90%;
z-index: 1; /* Set z-index to that less than image's, so it's hidden beneath it */
bottom: 0; /* Default position of desc div is bottom of container, setting it up to slide down */
left: 5px;
padding: 8px;
background: rgba(0, 0, 0, 0.8); /* black bg with 80% opacity */
color: white;
-moz-border-radius: 0 0 8px 8px; /* CSS3 rounded borders */
-webkit-border-radius: 0 0 8px 8px;
border-radius: 0 0 8px 8px;
opacity: 0; /* Set initial opacity to 0 */
-moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8); /* CSS3 shadows */
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
-moz-transition: all 0.5s ease 0.5s; /* Enable CSS3 transition on desc div. Final 0.5s value is the delay before animation starts */
-webkit-transition: all 0.5s ease 0.5s;
-o-transition: all 0.5s ease 0.5s;
-ms-transition: all 0.5s ease 0.5s;
transition: all 0.5s ease 0.5s;
}

.imagepluscontainer div.desc-kirmizi{ /* CSS for desc div of each image. */
position: absolute;
width: 90%;
z-index: 1; /* Set z-index to that less than image's, so it's hidden beneath it */
bottom: 0; /* Default position of desc div is bottom of container, setting it up to slide down */
left: 5px;
padding: 8px;
background: rgba(255,0,0,0.9); /* black bg with 80% opacity */
color: white;
-moz-border-radius: 0 0 8px 8px; /* CSS3 rounded borders */
-webkit-border-radius: 0 0 8px 8px;
border-radius: 0 0 8px 8px;
opacity: 0; /* Set initial opacity to 0 */
-moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8); /* CSS3 shadows */
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
-moz-transition: all 0.5s ease 0.5s; /* Enable CSS3 transition on desc div. Final 0.5s value is the delay before animation starts */
-webkit-transition: all 0.5s ease 0.5s;
-o-transition: all 0.5s ease 0.5s;
-ms-transition: all 0.5s ease 0.5s;
transition: all 0.5s ease 0.5s;
}


.imagepluscontainer div.desc-yesil{ /* CSS for desc div of each image. */
position: absolute;
width: 90%;
z-index: 1; /* Set z-index to that less than image's, so it's hidden beneath it */
bottom: 0; /* Default position of desc div is bottom of container, setting it up to slide down */
left: 5px;
padding: 8px;
background: rgba(0,255,0,0.9); /* black bg with 90% opacity */
color: white;
-moz-border-radius: 0 0 8px 8px; /* CSS3 rounded borders */
-webkit-border-radius: 0 0 8px 8px;
border-radius: 0 0 8px 8px;
opacity: 0; /* Set initial opacity to 0 */
-moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8); /* CSS3 shadows */
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
-moz-transition: all 0.5s ease 0.5s; /* Enable CSS3 transition on desc div. Final 0.5s value is the delay before animation starts */
-webkit-transition: all 0.5s ease 0.5s;
-o-transition: all 0.5s ease 0.5s;
-ms-transition: all 0.5s ease 0.5s;
transition: all 0.5s ease 0.5s;
}

.imagepluscontainer div.desc-mavi{ /* CSS for desc div of each image. */
position: absolute;
width: 90%;
z-index: 1; /* Set z-index to that less than image's, so it's hidden beneath it */
bottom: 0; /* Default position of desc div is bottom of container, setting it up to slide down */
left: 5px;
padding: 8px;
background: rgba(0,0,255,0.9); /* black bg with 90% opacity */
color: white;
-moz-border-radius: 0 0 8px 8px; /* CSS3 rounded borders */
-webkit-border-radius: 0 0 8px 8px;
border-radius: 0 0 8px 8px;
opacity: 0; /* Set initial opacity to 0 */
-moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8); /* CSS3 shadows */
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
-moz-transition: all 0.5s ease 0.5s; /* Enable CSS3 transition on desc div. Final 0.5s value is the delay before animation starts */
-webkit-transition: all 0.5s ease 0.5s;
-o-transition: all 0.5s ease 0.5s;
-ms-transition: all 0.5s ease 0.5s;
transition: all 0.5s ease 0.5s;
}


.imagepluscontainer div.desc-gri{ /* CSS for desc div of each image. */
position: absolute;
width: 90%;
z-index: 1; /* Set z-index to that less than image's, so it's hidden beneath it */
bottom: 0; /* Default position of desc div is bottom of container, setting it up to slide down */
left: 5px;
padding: 8px;
background: rgba(192,192,192,0.8); /* black bg with 90% opacity */
color: white;
-moz-border-radius: 0 0 8px 9px; /* CSS3 rounded borders */
-webkit-border-radius: 0 0 8px 8px;
border-radius: 0 0 8px 8px;
opacity: 0; /* Set initial opacity to 0 */
-moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8); /* CSS3 shadows */
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
-moz-transition: all 0.5s ease 0.5s; /* Enable CSS3 transition on desc div. Final 0.5s value is the delay before animation starts */
-webkit-transition: all 0.5s ease 0.5s;
-o-transition: all 0.5s ease 0.5s;
-ms-transition: all 0.5s ease 0.5s;
transition: all 0.5s ease 0.5s;
}

.imagepluscontainer div.desc-sari{ /* CSS for desc div of each image. */
position: absolute;
width: 90%;
z-index: 1; /* Set z-index to that less than image's, so it's hidden beneath it */
bottom: 0; /* Default position of desc div is bottom of container, setting it up to slide down */
left: 5px;
padding: 8px;
background: rgba(255,255,0,0.9); /* black bg with 90% opacity */
color: white;
-moz-border-radius: 0 0 8px 8px; /* CSS3 rounded borders */
-webkit-border-radius: 0 0 8px 8px;
border-radius: 0 0 8px 8px;
opacity: 0; /* Set initial opacity to 0 */
-moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8); /* CSS3 shadows */
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
-moz-transition: all 0.5s ease 0.5s; /* Enable CSS3 transition on desc div. Final 0.5s value is the delay before animation starts */
-webkit-transition: all 0.5s ease 0.5s;
-o-transition: all 0.5s ease 0.5s;
-ms-transition: all 0.5s ease 0.5s;
transition: all 0.5s ease 0.5s;
}


.imagepluscontainer div.desc-turuncu{ /* CSS for desc div of each image. */
position: absolute;
width: 90%;
z-index: 1; /* Set z-index to that less than image's, so it's hidden beneath it */
bottom: 0; /* Default position of desc div is bottom of container, setting it up to slide down */
left: 5px;
padding: 8px;
background: rgba(254, 111, 1, 0.9); /* black bg with 90% opacity */
color: white;
-moz-border-radius: 0 0 8px 8px; /* CSS3 rounded borders */
-webkit-border-radius: 0 0 8px 8px;
border-radius: 0 0 8px 8px;
opacity: 0; /* Set initial opacity to 0 */
-moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8); /* CSS3 shadows */
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
-moz-transition: all 0.5s ease 0.5s; /* Enable CSS3 transition on desc div. Final 0.5s value is the delay before animation starts */
-webkit-transition: all 0.5s ease 0.5s;
-o-transition: all 0.5s ease 0.5s;
-ms-transition: all 0.5s ease 0.5s;
transition: all 0.5s ease 0.5s;
}


.imagepluscontainer div.desc-bej{ /* CSS for desc div of each image. */
position: absolute;
width: 90%;
z-index: 1; /* Set z-index to that less than image's, so it's hidden beneath it */
bottom: 0; /* Default position of desc div is bottom of container, setting it up to slide down */
left: 5px;
padding: 8px;
background: rgba(149, 121, 101, 0.9); /* black bg with 90% opacity */
color: white;
-moz-border-radius: 0 0 8px 8px; /* CSS3 rounded borders */
-webkit-border-radius: 0 0 8px 8px;
border-radius: 0 0 8px 8px;
opacity: 0; /* Set initial opacity to 0 */
-moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8); /* CSS3 shadows */
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
-moz-transition: all 0.5s ease 0.5s; /* Enable CSS3 transition on desc div. Final 0.5s value is the delay before animation starts */
-webkit-transition: all 0.5s ease 0.5s;
-o-transition: all 0.5s ease 0.5s;
-ms-transition: all 0.5s ease 0.5s;
transition: all 0.5s ease 0.5s;
}

.imagepluscontainer div.desc a{
color: white;
}



.imagepluscontainer div.desc-kirmizi a{
color: white;
}

.imagepluscontainer div.desc-yesil a{
color: white;
}

.imagepluscontainer div.desc-mavi a{
color: white;
}

.imagepluscontainer div.desc-gri a{
color: white;
}

.imagepluscontainer div.desc-sari a{
color: white;
}

.imagepluscontainer div.desc-turuncu a{
color: white;
}

.imagepluscontainer div.desc-bej a{
color: white;
}

.imagepluscontainer:hover div.desc{ /* CSS for desc div when mouse hovers over main container */
-moz-transform: translate(0, 100%);
-webkit-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
-o-transform: translate(0, 100%);
transform: translate(0, 100%);
opacity:1; /* Reveal desc DIV fully */
}


.imagepluscontainer:hover div.desc-kirmizi{ /* CSS for desc div when mouse hovers over main container */
-moz-transform: translate(0, 100%);
-webkit-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
-o-transform: translate(0, 100%);
transform: translate(0, 100%);
opacity:1; /* Reveal desc DIV fully */
}

.imagepluscontainer:hover div.desc-yesil{ /* CSS for desc div when mouse hovers over main container */
-moz-transform: translate(0, 100%);
-webkit-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
-o-transform: translate(0, 100%);
transform: translate(0, 100%);
opacity:1; /* Reveal desc DIV fully */
}


.imagepluscontainer:hover div.desc-mavi{ /* CSS for desc div when mouse hovers over main container */
-moz-transform: translate(0, 100%);
-webkit-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
-o-transform: translate(0, 100%);
transform: translate(0, 100%);
opacity:1; /* Reveal desc DIV fully */
}

.imagepluscontainer:hover div.desc-gri{ /* CSS for desc div when mouse hovers over main container */
-moz-transform: translate(0, 100%);
-webkit-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
-o-transform: translate(0, 100%);
transform: translate(0, 100%);
opacity:1; /* Reveal desc DIV fully */
}

.imagepluscontainer:hover div.desc-sari{ /* CSS for desc div when mouse hovers over main container */
-moz-transform: translate(0, 100%);
-webkit-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
-o-transform: translate(0, 100%);
transform: translate(0, 100%);
opacity:1; /* Reveal desc DIV fully */
}


.imagepluscontainer:hover div.desc-turuncu{ /* CSS for desc div when mouse hovers over main container */
-moz-transform: translate(0, 100%);
-webkit-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
-o-transform: translate(0, 100%);
transform: translate(0, 100%);
opacity:1; /* Reveal desc DIV fully */
}

.imagepluscontainer:hover div.desc-bej{ /* CSS for desc div when mouse hovers over main container */
-moz-transform: translate(0, 100%);
-webkit-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
-o-transform: translate(0, 100%);
transform: translate(0, 100%);
opacity:1; /* Reveal desc DIV fully */
}

/*### Below CSS when applied to desc DIV slides the desc div from the right edge of the image ###*/

.imagepluscontainer div.rightslide{
width: 150px; /* reset from default */
top:15px;
right:0;
left:auto;  /* reset from default */
bottom:auto;  /* reset from default */
padding-left:15px;
-moz-border-radius: 0 8px 8px 0;
-webkit-border-radius: 0 8px 8px 0;
border-radius: 0 8px 8px 0;
}

.imagepluscontainer:hover div.rightslide{
-moz-transform: translate(100%, 0);
-webkit-transform: translate(100%, 0);
-ms-transform: translate(100%, 0);
-o-transform: translate(100%, 0);
transform: translate(100%, 0);
}

/*### Below CSS when applied to desc DIV slides the desc div from the left edge of the image ###*/

.imagepluscontainer div.leftslide{
width: 150px;  /* reset from default */
top:15px;
left:0;
bottom:auto;  /* reset from default */
padding-left:15px;
-moz-border-radius: 8px 0 0 8px;
-webkit-border-radius: 8px 0 0 8px;
border-radius: 8px 0 0 8px;
}

.imagepluscontainer:hover div.leftslide{
-moz-transform: translate(-100%, 0);
-webkit-transform: translate(-100%, 0);
-ms-transform: translate(-100%, 0);
-o-transform: translate(-100%, 0);
transform:translate(-100%, 0);
}

/*### Below CSS when applied to desc DIV slides the desc div from the top edge of the image ###*/

.imagepluscontainer div.upslide{
top:0;
bottom:auto;  /* reset from default */
padding-bottom:10px;
-moz-border-radius: 8px 8px 0 0;
-webkit-border-radius: 8px 8px 0 0;
border-radius: 8px 8px 0 0;
}

.imagepluscontainer:hover div.upslide{
-moz-transform: translate(0, -100%);
-webkit-transform: translate(0, -100%);
-ms-transform: translate(0, -100%);
-o-transform: translate(0, -100%);
transform:translate(0, -100%);
}
/*
<div class="imagepluscontainer" style="width:263px; height:199px; z-index:2">
<img src="http://img580.imageshack.us/img580/4546/stadiumij.jpg" />
<div class="desc">
Capable of seating 50,000 spectators, the <a href="http://en.wikipedia.org/wiki/Colosseum">Colosseum</a> was used for gladiatorial contests and public spectacles such as executions.
</div>
</div>

<br />

<div class="imagepluscontainer" style="width:263px; height:199px; left:350px">
<img src="http://img580.imageshack.us/img580/4546/stadiumij.jpg" />
<div class="desc rightslide">
Capable of seating 50,000 spectators, the <a href="http://en.wikipedia.org/wiki/Colosseum">Colosseum</a> was used for gladiatorial contests and public spectacles such as executions.
</div>
</div>

<br />

<div class="imagepluscontainer" style="width:263px; height:199px">
<img src="http://img580.imageshack.us/img580/4546/stadiumij.jpg" />
<div class="desc upslide">
Capable of seating 50,000 spectators, the <a href="http://en.wikipedia.org/wiki/Colosseum">Colosseum</a> was used for gladiatorial contests and public spectacles such as executions.
</div>
</div>

<br />

<div class="imagepluscontainer" style="width:263px; height:199px; left:350px">
<img src="http://img580.imageshack.us/img580/4546/stadiumij.jpg" />
<div class="desc leftslide">
Capable of seating 50,000 spectators, the <a href="http://en.wikipedia.org/wiki/Colosseum">Colosseum</a> was used for gladiatorial contests and public spectacles such as executions.
</div>
</div>






*/

.atisof-t2 {
             
			background: #168EB6;
padding-bottom:10px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);  
        }


		
.atisof-t3 {
            
			background: #28B867;
padding-bottom:10px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);  
        }

.atisof-t3-mira {
            
			background: #809027;
padding-bottom:10px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);  
        }
		
		
.atisof-t1 {
            
			background: #D34C31;
padding-bottom:10px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);  
        }
		
.atisof-t4 {
            
			background: #684945;
padding-bottom:10px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);  
        }
		
.atisof-t5 {
            
			background: #8D635E;
padding-bottom:10px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);  
        }

.art-nav-mira-resim
{
 min-width: 1920px; 
 margin-left:-485px;
 
      
    
        }		
		
		
.art-nav-atisoft-sayfa-orta-resim
{
 
min-width: 1920px; 
 margin-left:-175px;
 
} 

.art-nav-atisoft-altmenu
{
background: #E1DBD7;
min-width: 1920px; 
margin-left:-660px;
padding:40px 1px 1px 1px;
}
		
.art-nav-atisoft
{
background: #D0C8C2;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}
.art-nav-atisoft-yazi
{
margin-left:460px;
margin-right:460px;
min-width: 1000px; 
padding:1px 1px 40px 1px;
}

.art-nav-atisoft-1
{
background: #E1DBD7;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}

.art-nav-atisoft-2
{
background: #E0E0E0;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}

.art-nav-atisoft-3
{
background: #38A8A6;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}

.art-nav-atisoft-4
{
background: #D76514;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}

.art-nav-atisoft-5
{
background: #72613C;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}
.art-nav-atisoft-6
{
background: #ADAB1F;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}

.art-nav-atisoft-7
{
background: #9E2E57;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}
.art-nav-atisoft-8
{
background: #32C3B9;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}

.art-nav-atisoft-9
{
background: #1B232D;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}

.art-nav-atisoft-10
{
background: #3AB6DF;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}

.art-nav-atisoft-11
{
background: #FA681E;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}
.art-nav-atisoft-12
{
background: #935B95;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}
.art-nav-atisoft-13
{
background: #B081B1;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}
.art-nav-atisoft-14
{
background: #BB93BD;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}
.art-nav-atisoft-15
{
background: #78AB7C;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}  
.art-nav-atisoft-yok
{

min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}


/*
 border: 0;
 border-radius: 7px;
 box-shadow: 1px 3px 7px #666;
 */

.hovergallery img{

-webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
-moz-transform:scale(0.8); /*Mozilla scale version*/
-o-transform:scale(0.8); /*Opera scale version*/
-webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla duration version*/
-o-transition-duration: 0.5s; /*Opera duration version*/
opacity: 0.7; /*initial opacity of images*/
margin: 0 10px 5px 0; /*margin between images*/
}

.hovergallery img:hover{
-webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
-moz-transform:scale(1.1); /*Mozilla scale version*/
-o-transform:scale(1.1); /*Opera scale version*/
box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
-webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
-moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
opacity: 1;
}

/*
<div class="hovergallery">
<img src="coconut.jpg" />
<img src="sunbreakthrough.jpg" />
<img src="desert.jpg" />
<img src="sunflower.jpg" />
<img src="forest.jpg" />
<img src="duck.jpg" />
</div>

*/






ul.animatedbgul{
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.animatedbgul li{
	width: 100%;
	clear:left; /* clear contents of inner span, which will be floated left */
	overflow: hidden; /* clear contents of inner span, which will be floated left */
}

ul.animatedbgul li span{
	display: block;
	float: left; /* cause width of each span to take up only as much space as needed */
	min-width: 0px; /* animated property. Explicit min-width defined so animation works. */
	margin-bottom: 5px;
	padding: 8px;
	color: #5d5d5d;
}

ul.animatedbgul li:hover span{
	color: #fff;
	background: #ce3e3e;
	border-left: 8px solid darkred;
	min-width: 450px; /* animated property. Set to desired final length of background */
	-webkit-box-shadow: 0 0 5px gray;
	-moz-box-shadow: 0 0 5px gray;
	box-shadow: 0 0 5px gray;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

/*

<ul class="animatedbgul">
	<li><span>Food and Drinks</span></li>
	<li><span>Events and Activities</span></li>
	<li><span>Vacations</span></li>
	<li><span>Education and Self Improvement</span></li>
</ul>


*/

/*
http://hex2rgba.devoth.com/ - dönüştürme link
<style>
.css3Cont {
	 border: 0;
     border-radius: 7px;
     box-shadow: 1px 3px 7px #666;
}
</style>



<telerik:RadButton ID="RadButton6" runat="server" ButtonType="LinkButton" Class="css3Cont"  width="307px"
                         Height="65">
                         <ContentTemplate>
                               
                              Hidroforce Hidrolik Makina İmalat Ankara Detaylı Bilgi İçin Lütfen Bizimle İletişime Geçiniz : 0312 394 4850
                         </ContentTemplate>
                    </telerik:RadButton>
					
					
					 <div class="view view-first">
<img  class=" " width="1000" height="291"    alt="Ankara Yücel Nakliyat, Evden Eve Nakliyat" src="atisoft-kontrol/ankarayucelnakliyat/2.jpg"> 
<div class="mask">
                        <h3>Evden Eve Nakliyat</h3>
                        <p>Evinizi taşıtmaya kara verdiniz Ankara Yücel Nakliyat olarak siz değerli müşterimize hizmet vermek etmek isteriz. Tel : 0312 335 6692</p>
                        
                    </div>
					
                </div>  
				
				1
				  <div class="view view-first">
<img class="kontrol-atisoft2014-1" width="1000" height="300"    alt="Ankara Yücel Nakliyat, Evden Eve Taşımacılık" src="atisoft-kontrol/ankarayucelnakliyat/3.jpg"> 
<div class="mask">
                        <h3>Hover Style #4</h3>
                        <p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
                        <a href="#" class="info">Read More</a>
                    </div>
                </div>

				
				2
				
				<div class="view view-ninth">
                    
                    
<img class="kontrol-atisoft2014-1" width="1000" height="300"    alt="Ankara Yücel Nakliyat, Evden Eve Taşımacılık" src="atisoft-kontrol/ankarayucelnakliyat/3.jpg"> 
 
					<div class="content">
                        <h3>Evden Eve Taşımacılık</h3>
                        <p>Ankara Yücel Nakliyat Evden eve taşımacılık hizmetlerini Ankara merkezli olarak vermektedir. Soru ve önerileriniz için lütfen çekinmeyin. Tel:0312 335 6692</p>
                        
                    </div>
                </div>
				
				
				
				3
				
				  <div class="view view-sixth">
<img  class=" " width="1000" height="291" alt="Ankara Yücel Nakliyat, Evden Eve Nakliyat" src="atisoft-kontrol/ankarayucelnakliyat/2.jpg"> 
<div class="mask">
                        <h3>Evden Eve Nakliyat</h3>
                        <p>Evinizi taşıtmaya kara verdiniz Ankara Yücel Nakliyat olarak siz değerli müşterimize hizmet vermek etmek isteriz. Tel : 0312 335 6692</p>
                        
                    </div>
					
                </div>  
				
				

*/

.view {
   width: 100%;
   height: 100%;
   margin: 0px; border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px;-webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
   float: left;
   
   overflow: hidden;
   position: relative;
   text-align: center;
    
   cursor: default;
    
}
.view .mask,.view .content {
   width: 100%;
   height: 100%;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.view img {
   display: block;
   position: relative;
}
.view h3 {
    
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 17px;
   padding: 10px;
   background: rgba(0, 0, 0, 0.8);
   margin: 20px 0 0 0;
}
.view p {
   font-family: Georgia, serif;
   font-style: italic;
   font-size: 12px;
   position: relative;
   color: #fff;
   padding: 10px 20px 20px;
   text-align: center;
}
.view a.info {
   display: inline-block;
   text-decoration: none;
   padding: 7px 14px;
   background: #000;
   color: #fff;
    
   -webkit-box-shadow: 0 0 1px #000;
   -moz-box-shadow: 0 0 1px #000;
   box-shadow: 0 0 1px #000;
}
.view a.info: hover {
   -webkit-box-shadow: 0 0 5px #000;
   -moz-box-shadow: 0 0 5px #000;
   box-shadow: 0 0 5px #000;
}
.view-first img {
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-first .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   background-color: rgba(219,127,8, 0.7);
   -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;
}
.view-first h3 {
   -webkit-transform: translateY(-100px);
   -moz-transform: translateY(-100px);
   -o-transform: translateY(-100px);
   -ms-transform: translateY(-100px);
   transform: translateY(-100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-first p {
   -webkit-transform: translateY(100px);
   -moz-transform: translateY(100px);
   -o-transform: translateY(100px);
   -ms-transform: translateY(100px);
   transform: translateY(100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-first:hover img {
   -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1);
}
.view-first a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-first:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.view-first:hover h3,
.view-first:hover p,
.view-first:hover a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
}
.view-first:hover p {
   -webkit-transition-delay: 0.1s;
   -moz-transition-delay: 0.1s;
   -o-transition-delay: 0.1s;
   -ms-transition-delay: 0.1s;
   transition-delay: 0.1s;
}
.view-first:hover a.info {
   -webkit-transition-delay: 0.2s;
   -moz-transition-delay: 0.2s;
   -o-transition-delay: 0.2s;
   -ms-transition-delay: 0.2s;
   transition-delay: 0.2s;
}

/* NINTH EXAMPLE*/
 
.view-ninth .content {
    background: rgba(0, 0, 0, 0.9);
    height: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    opacity: 0.5;
    width: 100%;
    overflow: hidden;
    -webkit-transform: rotate(-33.5deg) translate(-112px, 166px);
    -moz-transform: rotate(-33.5deg) translate(-112px, 166px);
    -o-transform: rotate(-33.5deg) translate(-112px, 166px);
    -ms-transform: rotate(-33.5deg) translate(-112px, 166px);
    transform: rotate(-33.5deg) translate(-112px, 166px);
    -webkit-transform-origin: 0% 100%;
    -moz-transform-origin: 0% 100%;
    -o-transform-origin: 0% 100%;
    -ms-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-transition: all 0.4s ease-in-out 0.3s;
    -moz-transition: all 0.4s ease-in-out 0.3s;
    -o-transition: all 0.4s ease-in-out 0.3s;
    transition: all 0.4s ease-in-out 0.3s;
}
.view-ninth h3{
    background: transparent;
    margin-top: 5px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.view-ninth a.info {
    display: none;
}
.view-ninth:hover .content {
    height: 100%;
    width: 100%;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    filter: alpha(opacity=90);
    opacity: 0.9;
    top: 40px;
    -webkit-transform: rotate(0deg) translate(0, 0);
    -moz-transform: rotate(0deg) translate(0, 0);
    -o-transform: rotate(0deg) translate(0, 0);
    -ms-transform: rotate(0deg) translate(0, 0);
    transform: rotate(0deg) translate(0, 0);
}
 
/* altı */

.view-sixth img {
   -webkit-transition: all 0.4s ease-in-out 0.5s;
   -moz-transition: all 0.4s ease-in-out 0.5s;
   -o-transition: all 0.4s ease-in-out 0.5s;
   -ms-transition: all 0.4s ease-in-out 0.5s;
   transition: all 0.4s ease-in-out 0.5s;
}
.view-sixth .mask {
   background-color: rgba(146,96,91,0.5);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.3s ease-in 0.4s;
   -moz-transition: all 0.3s ease-in 0.4s;
   -o-transition: all 0.3s ease-in 0.4s;
   -ms-transition: all 0.3s ease-in 0.4s;
   transition: all 0.3s ease-in 0.4s;
}
.view-sixth h3 {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   border-bottom: 1px solid rgba(0, 0, 0, 0.3);
   background: transparent;
   margin: 20px 40px 0px 40px;
   -webkit-transform: scale(10);
   -moz-transform: scale(10);
   -o-transform: scale(10);
   -ms-transform: scale(10);
   transform: scale(10);
   -webkit-transition: all 0.3s ease-in-out 0.1s;
   -moz-transition: all 0.3s ease-in-out 0.1s;
   -o-transition: all 0.3s ease-in-out 0.1s;
   -ms-transition: all 0.3s ease-in-out 0.1s;
   transition: all 0.3s ease-in-out 0.1s;
}
.view-sixth p {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: scale(10);
   -moz-transform: scale(10);
   -o-transform: scale(10);
   -ms-transform: scale(10);
   transform: scale(10);
   -webkit-transition: all 0.3s ease-in-out 0.2s;
   -moz-transition: all 0.3s ease-in-out 0.2s;
   -o-transition: all 0.3s ease-in-out 0.2s;
   -ms-transition: all 0.3s ease-in-out 0.2s;
   transition: all 0.3s ease-in-out 0.2s;
}
.view-sixth a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: translateY(100px);
   -moz-transform: translateY(100px);
   -o-transform: translateY(100px);
   -ms-transform: translateY(100px);
   transform: translateY(100px);
   -webkit-transition: all 0.3s ease-in-out 0.1s;
   -moz-transition: all 0.3s ease-in-out 0.1s;
   -o-transition: all 0.3s ease-in-out 0.1s;
   -ms-transition: all 0.3s ease-in-out 0.1s;
   transition: all 0.3s ease-in-out 0.1s;
}
.view-sixth:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
}
.view-sixth:hover img {
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
}
.view-sixth:hover h3 {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   -webkit-transition-delay: 0.1s;
   -moz-transition-delay: 0.1s;
   -o-transition-delay: 0.1s;
   -ms-transition-delay: 0.1s;
   transition-delay: 0.1s;
}
.view-sixth:hover p {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   -webkit-transition-delay: 0.2s;
   -moz-transition-delay: 0.2s;
   -o-transition-delay: 0.2s;
   -ms-transition-delay: 0.2s;
   transition-delay: 0.2s;
}
.view-sixth:hover a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.3s;
   -moz-transition-delay: 0.3s;
   -o-transition-delay: 0.3s;
   -ms-transition-delay: 0.3s;
   transition-delay: 0.3s;
}


.scene {
	width: 300px;
	height: 200px;
	 
	float: left;
	-webkit-perspective: 1000px;
	-moz-perspective: 1000px;
	perspective: 1000px;
}

.resim2014 {
	width: 300px;
	height: 200px;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateZ(-130px);
	-moz-transform: translateZ(-130px);
	transform: translateZ(-130px);
	-webkit-transition: -webkit-transform 350ms;
	-moz-transition: -moz-transform 350ms;
	transition: transform 350ms;
}

.resim2014:hover {
	-webkit-transform: rotateY(-78deg) translateZ(20px);
	-moz-transform: rotateY(-78deg) translateZ(20px);
	transform: rotateY(-78deg) translateZ(20px);
}

 
.resim2014 .poster, 
.resim2014 .info {
	position: absolute;
	width: 300px;
	height: 200px;
	background-color: #fff;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
}

.resim2014 .poster  {
	-webkit-transform: translateZ(130px);
	-moz-transform: translateZ(130px);
	transform: translateZ(130px);
	background-size: cover;
	background-repeat: no-repeat;
}

.resim2014 .info {
	-webkit-transform: rotateY(90deg) translateZ(130px);
	-moz-transform: rotateY(90deg) translateZ(130px);
	transform: rotateY(90deg) translateZ(130px);
	border: 1px solid #B8B5B5;
	font-size: 0.75em;
}

 
.csstransforms3d .resim2014::after {
	content: '';
	width: 300px;
	height: 260px;
	position: absolute;
	bottom: 0;
	box-shadow: 0 30px 50px rgba(0,0,0,0.3);
	-webkit-transform-origin: 100% 100%;
	-moz-transform-origin: 100% 100%;
	transform-origin: 100% 100%;
	-webkit-transform: rotateX(90deg) translateY(130px);
	-moz-transform: rotateX(90deg) translateY(130px);
	transform: rotateX(90deg) translateY(130px);
	-webkit-transition: box-shadow 350ms;
	-moz-transition: box-shadow 350ms;
	transition: box-shadow 350ms;
	
}

.csstransforms3d .resim2014:hover::after {
	box-shadow: 20px -5px 50px rgba(0,0,0,0.3);
	
}

 

.info aciklama-2014 {
	color: #FA5705;
	padding: 7px 10px;
	font-weight: bold;
	height: 195px;
	background-size: contain;
	background-repeat: no-repeat;
	text-shadow: 0px 1px 1px rgba(0,0,0,1);
	
}

.info aciklama-2014 h3 {
	padding: 0.9em;
	margin: 0 0 2px;
	font-size: 1.4em;
	 
}

.info aciklama-2014 .rating {
	border: 1px solid #FFF;
	padding: 0px 3px;
}

.info p {
	padding: 1.2em 1.4em;
	margin: 2px 0 0;
	font-weight: 700;
	color: #666;
	line-height: 1.4em;
	border-top: 10px solid #FA5705;
}

 

.resim2014 .poster,
.resim2014 .info,
.resim2014 .info aciklama-2014 {
	-webkit-transition: box-shadow 350ms;
	-moz-transition: box-shadow 350ms;
	transition: box-shadow 350ms;
}

.csstransforms3d .resim2014 .poster {
	box-shadow: inset 0px 0px 40px rgba(255,255,255,0);
	
}

.csstransforms3d .resim2014:hover .poster {
	box-shadow: inset 300px 0px 40px rgba(255,255,255,0.8);
	
}

.csstransforms3d .resim2014 .info, 
.csstransforms3d .resim2014 .info aciklama-2014 {
	box-shadow: inset -300px 0px 40px rgba(0,0,0,0.5);
	
}

.csstransforms3d .resim2014:hover .info, 
.csstransforms3d .resim2014:hover .info aciklama-2014 {
	box-shadow: inset 0px 0px 40px rgba(0,0,0,0);
}



.scene:nth-child(1) .resim2014 .poster {
    
    border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px;-webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
   
}

.scene:nth-child(2) .poster {
 
  border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px;-webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
}

.scene:nth-child(3) .poster {
 
  border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px;-webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
}

.scene:nth-child(1) .info aciklama-2014 {
	 
	
}

.scene:nth-child(2) .info aciklama-2014 {
	 
}

.scene:nth-child(3) .info aciklama-2014 {
	 
}


.no-csstransforms3d .resim2014 .poster, 
.no-csstransforms3d .resim2014 .info {
	position: relative;
}

/* 

 3d
 <div class="art-nav-atisoft-4">
<div class="art-nav-atisoft-yazi">

<h3 class="atisoft-h3"><strong>Evden Eve Taşımacılık</strong> Ankara Yücel Nakliyat</h3>
<p style="font: 14px 'Segoe UI'; color: #FFFFFF">
Ankara Yücel Nakliyat olarak sigortalı taşımcaılık yaptığmızdan eşyanıza taşınma sırasında bir zarar gelirse sigortamız eşyanızın zararını ödemektedir. Her zaman müşteri memnuniyeti ile çalışmaktayız. Ankara Yücel Nakliyat olarak hedefimiz Ankara'da saygın bir konuma yerleşmektir.
</p>
<br><br>



<div class="art-content-layout">
    <div class="art-content-layout-row">
    <div class="art-layout-cell" style="width: 33%" >
        <ul class="stage clearfix">

					<li class="scene">
						<div class="resim2014">
							<div class="poster">
							<img width="300" height="200"  class="kontrol-atisoft2014-1" alt="Ankara Evden Eve Taşıma" src="atisoft-kontrol/ankarayucelnakliyat/300-8.jpg">
							
							</div>
							<div class="info">
								 
								  
									<h3>Ankara Yücel Nakliyat Evden Eve</h3>
									 
									 
								 
								<p>
								Sektörümüzde çok fazla nakliyat firması var ama onların bizden bir eksik yönü var biz işimizi severek yapıyoruz ve müşteri ilişkilerine çok önem veriyoruz bu yüzden personelimize özel ders bile veriyoruz. Bizimle görüşmek ve fiyat ögrenmek için 0312 335 6692 arayıp bizimle irtibata geçebilirsiniz
								</p>
							</div>
						</div>
						   <div class="box-2014-yesil">  <p style="font: 18px 'Segoe UI'; color: #FFFFFF">Nakliyat Şirketi</p></div>
					</li></ul>
    </div><div class="art-layout-cell" style="width: 34%" >
        <ul class="stage clearfix">

					<li class="scene">
						<div class="resim2014">
							<div class="poster">
							<img width="300" height="200"  class="kontrol-atisoft2014-1" alt="Ankara Evden Eve Taşıma" src="atisoft-kontrol/ankarayucelnakliyat/300-8.jpg">
							
							</div>
							<div class="info">
								 
								  
									<h3>Ankara Yücel Nakliyat Evden Eve</h3>
									 
									 
								 
								<p>
								Sektörümüzde çok fazla nakliyat firması var ama onların bizden bir eksik yönü var biz işimizi severek yapıyoruz ve müşteri ilişkilerine çok önem veriyoruz bu yüzden personelimize özel ders bile veriyoruz. Bizimle görüşmek ve fiyat ögrenmek için 0312 335 6692 arayıp bizimle irtibata geçebilirsiniz
								</p>
							</div>
						</div>
						   <div class="box-2014-yesil">  <p style="font: 18px 'Segoe UI'; color: #FFFFFF">Nakliyat Şirketi</p></div>
					</li>
					</ul>
    </div><div class="art-layout-cell" style="width: 33%" >
        <ul class="stage clearfix">

					<li class="scene">
						<div class="resim2014">
							<div class="poster">
							<img width="300" height="200"  class="kontrol-atisoft2014-1" alt="Ankara Evden Eve Taşıma" src="atisoft-kontrol/ankarayucelnakliyat/300-8.jpg">
							
							</div>
							<div class="info">
								 
								  
									<h3>Ankara Yücel Nakliyat Evden Eve</h3>
									 
									 
								 
								<p>
								Sektörümüzde çok fazla nakliyat firması var ama onların bizden bir eksik yönü var biz işimizi severek yapıyoruz ve müşteri ilişkilerine çok önem veriyoruz bu yüzden personelimize özel ders bile veriyoruz. Bizimle görüşmek ve fiyat ögrenmek için 0312 335 6692 arayıp bizimle irtibata geçebilirsiniz
								</p>
							</div>
						</div>
						   <div class="box-2014-yesil">  <p style="font: 18px 'Segoe UI'; color: #FFFFFF">Nakliyat Şirketi</p></div>
					</li>
					</ul>
    </div>
    </div>
</div>












 
		 <br><br>
		<br><br>
<p style="font: 14px 'Segoe UI'; color: #FFFFFF">
Sektörümüzde çok fazla nakliyat firması var ama onların bizden bir eksik yönü var biz işimizi severek yapıyoruz ve müşteri ilişkilerine çok önem veriyoruz bu yüzden personelimize özel ders bile veriyoruz. Bizimle görüşmek ve fiyat ögrenmek için 0312 335 6692 arayıp bizimle irtibata geçebilirsiniz.
</p>
	</div>
						</div>

*/


.ch-grid {
	 
	 
	list-style: none;
	display: block;
	text-align: center;
	width: 100%;
}

.ch-grid:after,
.ch-item:before {
	content: '';
    display: table;
}

.ch-grid:after {
	clear: both;
}

.ch-grid li {
	width: 300px;
	height: 200px;
	display: inline-block;
	margin: 15px;
}

.ch-item {
	width: 100%;
	height: 100%;
	border-radius: 10%;
	position: relative;
	cursor: default;
	box-shadow: 
		inset 0 0 0 5px rgba(255,255,255,0.6),
		0 1px 2px rgba(0,0,0,0.1);
		
	-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;
	
}

.ch-img-1 { 
	background-image: url(atisoft-kontrol/back-img/1.jpg);
}
 

.ch-img-2 { 
	background-image: url(atisoft-kontrol/back-img/2.jpg);
}

.ch-img-3 { 
	background-image: url(atisoft-kontrol/back-img/3.jpg);
}


.ch-img-4 { 
	background-image: url(atisoft-kontrol/back-img/4.jpg);
}

.ch-img-5 { 
	background-image: url(atisoft-kontrol/back-img/5.jpg);
}

.ch-img-6 { 
	background-image: url(atisoft-kontrol/back-img/6.jpg);
}

.ch-img-7 { 
	background-image: url(atisoft-kontrol/back-img/7.jpg);
}

.ch-img-8 { 
	background-image: url(atisoft-kontrol/back-img/8.jpg);
}

.ch-img-9 { 
	background-image: url(atisoft-kontrol/back-img/9.jpg);
}

.ch-img-10 { 
	background-image: url(atisoft-kontrol/back-img/10.jpg);
}

.ch-img-11 { 
	background-image: url(atisoft-kontrol/back-img/11.jpg);
}

.ch-img-12 { 
	background-image: url(atisoft-kontrol/back-img/12.jpg);
}

.ch-img-13 { 
	background-image: url(atisoft-kontrol/back-img/13.jpg);
}

.ch-img-14 { 
	background-image: url(atisoft-kontrol/back-img/14.jpg);
}

.ch-img-15 { 
	background-image: url(atisoft-kontrol/back-img/15.jpg);
}

.ch-info {
	position: absolute;
	background: rgba(63,147,147, 0.8);
	width: inherit;
	height: inherit;
	border-radius: 1%;
	opacity: 0;
	border-radius: 10%;
	 
		
	-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;
	
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
	
	-webkit-backface-visibility: hidden;

}

.ch-info h3 {
	color: #fff;
	 
	letter-spacing: 2px;
	font-size: 22px;
	margin: 0 30px;
	padding: 10px 0 0 0;
	height:  60px;
	font-family: 'Open Sans', Arial, sans-serif;
	text-shadow: 
		0 0 1px #fff, 
		0 1px 2px rgba(0,0,0,0.3);
}

.ch-info p {
	color: #fff;
	padding: 1px 5px;
	font-style: italic;
	margin: 0 30px;
	font-size: 12px;
	border-top: 1px solid rgba(255,255,255,0.5);
	opacity: 0;
	-webkit-transition: all 1s ease-in-out 0.4s;
	-moz-transition: all 1s ease-in-out 0.4s;
	-o-transition: all 1s ease-in-out 0.4s;
	-ms-transition: all 1s ease-in-out 0.4s;
	transition: all 1s ease-in-out 0.4s;
}

.ch-info p a {
	display: block;
	color: #fff;
	color: rgba(255,255,255,0.7);
	font-style: normal;
	font-weight: 700;
	 
	font-size: 9px;
	letter-spacing: 1px;
	padding-top: 4px;
	font-family: 'Open Sans', Arial, sans-serif;
}

.ch-info p a:hover {
	color: #fff222;
	color: rgba(255,242,34, 0.8);
	
}

.ch-item:hover {
	box-shadow: 
		inset 0 0 0 1px rgba(255,255,255,0.1),
		0 1px 2px rgba(0,0,0,0.1);
		 
}
.ch-item:hover .ch-info {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

.ch-item:hover .ch-info p {
	opacity: 1;
}	

/* 
<ul class="ch-grid">
					<li>
						<div class="ch-item ch-img-1">
						 
							<div class="ch-info">
								<h3>Evden Eve Nakliyat Ankara</h3>
								<p>Taşınmanın zor olduğunu zanneder herkes ama Ankara Uzmankar Nakliyat olarak hiçte zor değil kaçıncı katta oturuyor olursanız olun ister bir rezidans ‘da oturun ister bir apartmanda
								 </p>
							</div>
						</div>
					</li>
					<li>
						<div class="ch-item ch-img-2">
							<div class="ch-info">
								<h3>Evden Eve Taşımacılık Ankara</h3>
							<p>Taşınmanın zor olduğunu zanneder herkes ama Ankara Uzmankar Nakliyat olarak hiçte zor değil kaçıncı katta oturuyor olursanız olun ister bir rezidans ‘da oturun ister bir apartmanda
							</p>
							</div>
						</div>
					</li>
					<li>
						<div class="ch-item ch-img-3">
							<div class="ch-info">
								<h3>Ankara Yılmaz Nakliyat Evden Ev</h3>
								<p>Taşınmanın zor olduğunu zanneder herkes ama Ankara Uzmankar Nakliyat olarak hiçte zor değil kaçıncı katta oturuyor olursanız olun ister bir rezidans ‘da oturun ister bir apartmanda
								</p>
							</div>
						</div>
					</li>
				</ul>
 <p style="font: 14px 'Segoe UI'; color: #FFFFFF">
Taşınmanın zor olduğunu zanneder herkes ama Ankara Uzmankar Nakliyat olarak hiçte zor değil kaçıncı katta oturuyor olursanız olun ister bir rezidans ‘da oturun ister bir apartmanda 
hiç fark etmez asansörlü taşımacılık ve ürünleriniz ne olursa olsun hepsini paketleyip ve en önemlisi sigortalayıp ister şehir içi ister şehir dışına götürüyoruz.

</p>
*/

.goster {
   width: 300px;
   height: 200px;
  margin: 0px; border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px;-webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
    
   
   overflow: hidden;
   position: relative;
   text-align: center;
   cursor: default;
   background: #fff;
}
.goster .maske,.goster .icerik {
   width: 300px;
   height: 200px;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.goster img {
   display: block;
   position: relative;
}
.goster h3 {
    
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 17px;
   padding: 10px;
   background: rgba(0, 0, 0, 0.8);
   margin: 20px 0 0 0;
}
.goster p {
   font-family: Georgia, serif;
   font-style: italic;
   font-size: 12px;
   position: relative;
   color: #fff;
   padding: 10px 20px 20px;
   text-align: center;
}
.goster a.info {
   display: inline-block;
   text-decoration: none;
   padding: 7px 14px;
   background: #000;
   color: #fff;
    
   -webkit-box-shadow: 0 0 1px #000;
   -moz-box-shadow: 0 0 1px #000;
   box-shadow: 0 0 1px #000;
}
.goster a.info: hover {
   -webkit-box-shadow: 0 0 5px #000;
   -moz-box-shadow: 0 0 5px #000;
   box-shadow: 0 0 5px #000;
}

.goster-10 img {
   -webkit-transform: scaleY(1);
   -moz-transform: scaleY(1);
   -o-transform: scaleY(1);
   -ms-transform: scaleY(1);
   transform: scaleY(1);
   -webkit-transition: all 0.7s ease-in-out;
   -moz-transition: all 0.7s ease-in-out;
   -o-transition: all 0.7s ease-in-out;
   -ms-transition: all 0.7s ease-in-out;
   transition: all 0.7s ease-in-out;
}
.goster-10 .maske {
   background-color: rgba(255, 231, 179, 0.3);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.goster-10 h3 {
   border-bottom: 1px solid rgba(0, 0, 0, 0.3);
   background: transparent;
   margin: 20px 40px 0px 40px;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   color: #333;
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.goster-10 p {
   color: #333;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
}
.goster-10 a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
}
.goster-10:hover img {
   -webkit-transform: scale(10);
   -moz-transform: scale(10);
   -o-transform: scale(10);
   -ms-transform: scale(10);
   transform: scale(10);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.goster-10:hover .maske {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.goster-10:hover h3,.goster-10:hover p,.goster-10:hover a.info {
   -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}

.goster-7 img {
   -webkit-transition: all 0.5s ease-out;
   -moz-transition: all 0.5s ease-out;
   -o-transition: all 0.5s ease-out;
   -ms-transition: all 0.5s ease-out;
   transition: all 0.5s ease-out;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.goster-7 .maske {
   background-color: rgba(77,44,35,0.5);
   -webkit-transform: rotate(0deg) scale(1);
   -moz-transform: rotate(0deg) scale(1);
   -o-transform: rotate(0deg) scale(1);
   -ms-transform: rotate(0deg) scale(1);
   transform: rotate(0deg) scale(1);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.3s ease-out;
   -moz-transition: all 0.3s ease-out;
   -o-transition: all 0.3s ease-out;
   -ms-transition: all 0.3s ease-out;
   transition: all 0.3s ease-out;
}
.goster-7 h3 {
   -webkit-transform: translateY(-200px);
   -moz-transform: translateY(-200px);
   -o-transform: translateY(-200px);
   -ms-transform: translateY(-200px);
   transform: translateY(-200px);
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.goster-7 p {
   -webkit-transform: translateY(-200px);
   -moz-transform: translateY(-200px);
   -o-transform: translateY(-200px);
   -ms-transform: translateY(-200px);
   transform: translateY(-200px);
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.goster-7 a.info {
   -webkit-transform: translateY(-200px);
   -moz-transform: translateY(-200px);
   -o-transform: translateY(-200px);
   -ms-transform: translateY(-200px);
   transform: translateY(-200px);
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.goster-7:hover img {
   -webkit-transform: rotate(720deg) scale(0);
   -moz-transform: rotate(720deg) scale(0);
   -o-transform: rotate(720deg) scale(0);
   -ms-transform: rotate(720deg) scale(0);
   transform: rotate(720deg) scale(0);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.goster-7:hover .maske {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px) rotate(0deg);
   -moz-transform: translateY(0px) rotate(0deg);
   -o-transform: translateY(0px) rotate(0deg);
   -ms-transform: translateY(0px) rotate(0deg);
   transform: translateY(0px) rotate(0deg);
   -webkit-transition-delay: 0.4s;
   -moz-transition-delay: 0.4s;
   -o-transition-delay: 0.4s;
   -ms-transition-delay: 0.4s;
   transition-delay: 0.4s;
}
.goster-7:hover h3 {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.7s;
   -moz-transition-delay: 0.7s;
   -o-transition-delay: 0.7s;
   -ms-transition-delay: 0.7s;
   transition-delay: 0.7s;
}
.goster-7:hover p {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.6s;
   -moz-transition-delay: 0.6s;
   -o-transition-delay: 0.6s;
   -ms-transition-delay: 0.6s;
   transition-delay: 0.6s;
}
.goster-7:hover a.info {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.5s;
   -moz-transition-delay: 0.5s;
   -o-transition-delay: 0.5s;
   -ms-transition-delay: 0.5s;
   transition-delay: 0.5s;
}

.goster-5 img {
   -webkit-transition: all 0.3s ease-in-out;
   -moz-transition: all 0.3s ease-in-out;
   -o-transition: all 0.3s ease-in-out;
   -ms-transition: all 0.3s ease-in-out;
   transition: all 0.3s ease-in-out;
}
.goster-5 .maske {
   background-color: rgba(146,96,91,0.3);
   -webkit-transform: translateX(-300px);
   -moz-transform: translateX(-300px);
   -o-transform: translateX(-300px);
   -ms-transform: translateX(-300px);
   transform: translateX(-300px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition: all 0.3s ease-in-out;
   -moz-transition: all 0.3s ease-in-out;
   -o-transition: all 0.3s ease-in-out;
   -ms-transition: all 0.3s ease-in-out;
   transition: all 0.3s ease-in-out;
}
.goster-5 h3 {
   background: rgba(255, 255, 255, 0.5);
   color: #000;
   -webkit-box-shadow: 0px 1px 3px rgba(159, 141, 140, 0.5);
   -moz-box-shadow: 0px 1px 3px rgba(159, 141, 140, 0.5);
   box-shadow: 0px 1px 3px rgba(159, 141, 140, 0.5);
}
.goster-5 p {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   color: #333;
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.goster-5:hover .maske {
   -webkit-transform: translateX(0px);
   -moz-transform: translateX(0px);
   -o-transform: translateX(0px);
   -ms-transform: translateX(0px);
   transform: translateX(0px);
}
.goster-5:hover img {
   -webkit-transform: translateX(300px);
   -moz-transform: translateX(300px);
   -o-transform: translateX(300px);
   -ms-transform: translateX(300px);
   transform: translateX(300px);
}
.goster-5:hover p {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.goster-4 img {
   -webkit-transition: all 0.4s ease-in-out 0.2s;
   -moz-transition: all 0.4s ease-in-out 0.2s;
   -o-transition: all 0.4s ease-in-out 0.2s;
   -ms-transition: all 0.4s ease-in-out 0.2s;
   transition: all 0.4s ease-in-out 0.2s;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.goster-4 .maske {
   background-color: rgba(0,0,0,0.8);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: scale(0) rotate(-180deg);
   -moz-transform: scale(0) rotate(-180deg);
   -o-transform: scale(0) rotate(-180deg);
   -ms-transform: scale(0) rotate(-180deg);
   transform: scale(0) rotate(-180deg);
   -webkit-transition: all 0.4s ease-in;
   -moz-transition: all 0.4s ease-in;
   -o-transition: all 0.4s ease-in;
   -ms-transition: all 0.4s ease-in;
   transition: all 0.4s ease-in;
   -webkit-border-radius: 0px;
   -moz-border-radius: 0px;
   border-radius: 0px;
}
.goster-4 h3 {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   border-bottom: 1px solid rgba(0, 0, 0, 0.3);
   background: transparent;
   margin: 20px 40px 0px 40px;
   -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;
}
.goster-4 p {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -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;
}
.goster-4 a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -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;
}
.goster-4:hover .maske {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: scale(1) rotate(0deg);
   -moz-transform: scale(1) rotate(0deg);
   -o-transform: scale(1) rotate(0deg);
   -ms-transform: scale(1) rotate(0deg);
   transform: scale(1) rotate(0deg);
   -webkit-transition-delay: 0.2s;
   -moz-transition-delay: 0.2s;
   -o-transition-delay: 0.2s;
   -ms-transition-delay: 0.2s;
   transition-delay: 0.2s;
}
.goster-4:hover img {
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
}
.goster-4:hover h3,
.goster-4:hover p,
.goster-4:hover a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition-delay: 0.5s;
   -moz-transition-delay: 0.5s;
   -o-transition-delay: 0.5s;
   -ms-transition-delay: 0.5s;
   transition-delay: 0.5s;
}


/* 
view=goster
mask=maske
content=icerik
tenth=10
*/

/* Back to top button */
.backtotop {
    bottom: 65px;
    position: fixed;
    right: 25px;
}
.backtotop a {
    background: #3d3d3d;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#545353), color-stop(100%,#3d3d3d));
    background: -webkit-linear-gradient(top,  #545353 0%,#3d3d3d 100%);
    background: -moz-linear-gradient(top,  #545353 0%, #3d3d3d 100%);
    background: -ms-linear-gradient(top,  #545353 0%,#3d3d3d 100%);
    background: -o-linear-gradient(top,  #545353 0%,#3d3d3d 100%);
    background: linear-gradient(to bottom,  #545353 0%,#3d3d3d 100%);
    border-radius: 20px 20px 20px 20px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.77);
    color: #FFFFFF;
    font-size: 20px;
    padding: 15px;
    text-decoration: none;
}
.backtotop a:hover {
    background: #666464; /* Old browsers */
    background: -moz-linear-gradient(top,  #666464 0%, #505050 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#666464), color-stop(100%,#505050)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #666464 0%,#505050 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #666464 0%,#505050 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #666464 0%,#505050 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #666464 0%,#505050 100%); /* W3C */
    color: #fff;
    text-decoration: none;
}

@media (max-width:760px){
	.atisoft-mobil-table{width: 100%;max-width: 400px;}
	.atisoft-mobil-table thead{display: none}
	.atisoft-mobil-table td{width: 100%;display: block}
	.atisoft-mobil-table td span{float: left;font-weight: bold;display: block}
	.atisoft-mobil-table td span:after{content:' : '}
	.atisoft-mobil-table td{border:0px;border-bottom:4px solid #20A3D9}	
	.atisoft-mobil-table tr:last-child td:last-child{border: 0px}}
/*
.atisoft-mobil-table{margin: 50px auto}
.atisoft-mobil-table, .atisoft-mobil-table td{border:1px solid #ff0000}	
.atisoft-mobil-table thead{font-weight: bold}	
.atisoft-mobil-table td{ -moz-box-sizing: border-box; -webkit-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;padding: 20px;}
.atisoft-mobil-table td span{display: none}		
.atisoft-mobil-table, .atisoft-mobil-table td{border:1px solid #ff0000}

@media all and (max-width:767px){
	.atisoft-mobil-table{width: 100%;max-width: 400px;}
	.atisoft-mobil-table thead{display: none}
	.atisoft-mobil-table td{width: 100%;display: block}
	.atisoft-mobil-table td span{float: left;font-weight: bold;display: block}
	.atisoft-mobil-table td span:after{content:' : '}
	.atisoft-mobil-table td{border:0px;border-bottom:1px solid #ff0000}	
	.atisoft-mobil-table tr:last-child td:last-child{border: 0px}		
}
*/

.t-rwd-try-now-buttons {
	text-align: right;
}


.t-rwd-white-row {
	padding: 2em 0;
	background-color: #fff;
}

.main-container div.t-rwd-rem-pad .t-col.t-rwd-right-fix {
	padding-left: 25px;
}

.content-wrapper .t-rwd-row-pad {
	margin: 0 0 1.33em;
}

.content-wrapper .t-rwd-right{
	text-align:right;
}

.t-rwd-qr {
	padding: 0 0 0 1em;
}
.t-rwd-grey-row {
	background-color: #eef1f3;
	padding: 2em 0;
}

       .radMapWrapper {
     padding: 0 21px 21px 21px;
     background-color: #EBEDEE;
     border-radius: 10px;
     display: inline-block;
     *display: inline;
     zoom: 1;
}
 
.mapTitle {
     color: #444444;
     font-weight: normal;
     text-align: center;
}
 
.leftCol {
     float: left;
}
 
.rightCol {
     padding-left: 55px;
     font-size: 14px;
     font-family: "Segoe UI",Segoe,"Roboto","Droid Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
     text-align: left;
     line-height: 19px;
}

.rightCol1 {
     padding-left: 20px;
     font-size: 14px;
     font-family: "Segoe UI",Segoe,"Roboto","Droid Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
     text-align: left;
     line-height: 19px;
}
 
.rightCol .country {
     font-size: 24px;
     font-weight: normal;
     line-height: 18px;
     margin-bottom: 20px;
}
 
 
.rightCol .city {
     font-weight: bold;
}
 
.rightCol .email {
     color: #0394ae;
}
 
.rightCol .email a {
     color: #0394ae;
     text-decoration: none;
}
 
.rightCol .email a:hover {
     text-decoration: underline;
}
 
.rightCol .location {
     border-top: 1px solid #c9c9c9;
     margin-top: 10px;
     padding-top: 10px;
}
 
.rightCol .address {
     width: 235px;
}
 
.flag {
     background-image: url("images/flags.png");
     height: 40px;
     width: 40px;
     box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
     border: 1px solid white;
}
 
.flag-unitedstates {
     background-position: 0 -240px;
}
 
.flag-denmark {
     background-position: 0 -120px;
}
 
.flag-australia {
     background-position: 0 0;
}
 
.flag-bulgaria {
     background-position: 0 -40px;
}
 
.flag-india {
     background-position: 0 -160px;
}
 
.flag-unitedkingdom {
     background-position: 0 -200px;
}
 
.flag-germany {
     background-position: 0 -80px;
}
 
.RadMap .k-tooltip-content {
     font-family: "Segoe UI",Segoe,"Roboto","Droid Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
     font-size: 14px;
}
 
.MyMap, .RadMap .km-scroll-wrapper {
     border-radius: 10px 10px 0 0;
}
 
.MyMap {
     border: 1px solid #FFF;
}




/*
Baslangic Responsive Full Width Grid
Mary Lou
http://tympanus.net/codrops/author/crnacura/
Responsive Full Width Grid
http://tympanus.net/codrops/2013/04/17/responsive-full-width-grid/
*/


.cbp-rfgrid {
	margin: 35px 0 0 0;
	padding: 0;
	list-style: none;
	position: relative;
	width: 100%;
}

.cbp-rfgrid li {
	position: relative;
	float: left;
	overflow: hidden;
	width: 16.6666667%; /* Fallback */
	width: -webkit-calc(100% / 6);
	width: calc(100% / 6);
}

.cbp-rfgrid li a,
.cbp-rfgrid li a img {
	display: block;
	width: 100%;
	cursor: pointer;
}

.cbp-rfgrid li a img {
	max-width: 100%;
}

/* Flexbox is used for centering the heading */
.cbp-rfgrid li a div {
	position: absolute;
	left: 20px;
	top: 20px;
	right: 20px;
	bottom: 20px;
	background: rgba(71,163,218,0.2);
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	-webkit-align-items: center;
	-moz-align-items: center;
	-ms-align-items: center;
    align-items: center;
    text-align: center;
    opacity: 0;
}

.cbp-rfgrid li a:hover div {
	opacity: 1;
}

.cbp-rfgrid li a div h3 {
	width: 100%;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.4em;
	letter-spacing: 2px;
	padding: 0 10px;
}

/* Example for media query: change number of items per row */

@media screen and (max-width: 1190px) {
	.cbp-rfgrid li {
		width: 20%; /* Fallback */
		width: -webkit-calc(100% / 5);
		width: calc(100% / 5);
	}
}

@media screen and (max-width: 945px) {
	.cbp-rfgrid li {
		width: 25%; /* Fallback */
		width: -webkit-calc(100% / 4);
		width: calc(100% / 4);
	}
}

@media screen and (max-width: 660px) {
	.cbp-rfgrid li {
		width: 33.3333333%; /* Fallback */
		width: -webkit-calc(100% / 3);
		width: calc(100% / 3);
	}
}

@media screen and (max-width: 660px) {
	.cbp-rfgrid li {
		width: 33.3333333%; /* Fallback */
		width: -webkit-calc(100% / 3);
		width: calc(100% / 3);
	}
}

@media screen and (max-width: 400px) {
	.cbp-rfgrid li {
		width: 50%; /* Fallback */
		width: -webkit-calc(100% / 2);
		width: calc(100% / 2);
	}
}

@media screen and (max-width: 300px) {
	.cbp-rfgrid li {
		width: 100%;
	}
}


/*
Bitis Responsive Full Width Grid
Mary Lou
http://tympanus.net/codrops/author/crnacura/
Responsive Full Width Grid
http://tympanus.net/codrops/2013/04/17/responsive-full-width-grid/
<ul class="cbp-rfgrid">
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
				<li><a href="#"><img src="images/cat.jpg" /><div><h3>Felis catus</h3></div></a></li>
			</ul>
*/
.art-nav-atisoft-sayfa-orta-resim-mobil {

margin-left:-175px;
}

.box-2015-lila {
	padding-left: 20px;
	width: 220px;
	height: 30px;
	position: relative;
	background: #935B95;
	margin: 1em 0 0.5em 0;
	font-weight: 600;
	 
	font-size: 14px;
	line-height: 20px;
	border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px;-webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
}

.box-2015-lila:hover {
	background: #2F9879;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}

.goster-2015-1 img {
   -webkit-transition: all 0.5s ease-out;
   -moz-transition: all 0.5s ease-out;
   -o-transition: all 0.5s ease-out;
   -ms-transition: all 0.5s ease-out;
   transition: all 0.5s ease-out;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.goster-2015-1 .maske {
   background-color: rgba(147, 91, 149, 1);
   -webkit-transform: rotate(0deg) scale(1);
   -moz-transform: rotate(0deg) scale(1);
   -o-transform: rotate(0deg) scale(1);
   -ms-transform: rotate(0deg) scale(1);
   transform: rotate(0deg) scale(1);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.3s ease-out;
   -moz-transition: all 0.3s ease-out;
   -o-transition: all 0.3s ease-out;
   -ms-transition: all 0.3s ease-out;
   transition: all 0.3s ease-out;
}
.goster-2015-1 h3 {
   -webkit-transform: translateY(-200px);
   -moz-transform: translateY(-200px);
   -o-transform: translateY(-200px);
   -ms-transform: translateY(-200px);
   transform: translateY(-200px);
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.goster-2015-1 p {
   -webkit-transform: translateY(-200px);
   -moz-transform: translateY(-200px);
   -o-transform: translateY(-200px);
   -ms-transform: translateY(-200px);
   transform: translateY(-200px);
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.goster-2015-1 a.info {
   -webkit-transform: translateY(-200px);
   -moz-transform: translateY(-200px);
   -o-transform: translateY(-200px);
   -ms-transform: translateY(-200px);
   transform: translateY(-200px);
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.goster-2015-1:hover img {
   -webkit-transform: rotate(720deg) scale(0);
   -moz-transform: rotate(720deg) scale(0);
   -o-transform: rotate(720deg) scale(0);
   -ms-transform: rotate(720deg) scale(0);
   transform: rotate(720deg) scale(0);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.goster-2015-1:hover .maske {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px) rotate(0deg);
   -moz-transform: translateY(0px) rotate(0deg);
   -o-transform: translateY(0px) rotate(0deg);
   -ms-transform: translateY(0px) rotate(0deg);
   transform: translateY(0px) rotate(0deg);
   -webkit-transition-delay: 0.4s;
   -moz-transition-delay: 0.4s;
   -o-transition-delay: 0.4s;
   -ms-transition-delay: 0.4s;
   transition-delay: 0.4s;
}
.goster-2015-1:hover h3 {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.7s;
   -moz-transition-delay: 0.7s;
   -o-transition-delay: 0.7s;
   -ms-transition-delay: 0.7s;
   transition-delay: 0.7s;
   background-color: #2F9879;
}
.goster-2015-1:hover p {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.6s;
   -moz-transition-delay: 0.6s;
   -o-transition-delay: 0.6s;
   -ms-transition-delay: 0.6s;
   transition-delay: 0.6s;
}
.goster-2015-1:hover a.info {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.5s;
   -moz-transition-delay: 0.5s;
   -o-transition-delay: 0.5s;
   -ms-transition-delay: 0.5s;
   transition-delay: 0.5s;
}
.art-nav-atisoft-x
{
background: #E6D7E7;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}

.art-nav-atisoft-x1
{
background: #DBC6DC;
min-width: 1920px; 
margin-left:-460px;
padding:40px 1px 1px 1px;
}

.atisof-t6 {
            
			background: #935B95;
padding-bottom:10px;
position: relative;
	-moz-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);
	box-shadow: 0 14px 10px -12px rgba(0,0,0,0.7);  
        }