@font-face {
  font-family: 'cairo';
  src: url('cairo.ttf');
}

h1,h2,h3{font-family:cairo;}

a:link {
	text-decoration: none;
	font-family: cairo;
	color: #333333;
}
a:visited {
	text-decoration: none;
	font-family: cairo;
}
a:hover {
	text-decoration: none;
	font-family: cairo;
	color: #333333;
}
a:active {
	text-decoration: none;
	font-family: cairo;
}

body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}


li {
    float: right;
}

li a {
    display: block;
    color: #666666;
    text-align: center;
    padding: 13px 13px;
    text-decoration: none;
}

li a:hover {
    color: #232D36;

}


.col-group > div {
  padding: 1em;
}


.divserv {
	height:250px;
	text-align:center;
	font-family: cairo; font-size: 15px; color:#000000; text-decoration:none; 
}

.divserv:hover {

}

.img-circle{border-radius:50%}

.img-gemy-1 {
	border:8px solid #D1D1D1;
	padding:10px;
}

.img-gemy-1:hover {
	border:8px solid #00AEEF;
}

.img-gemy-2 {
	border:8px solid #D1D1D1;
	padding:10px;
}

.img-gemy-2:hover {
	border:8px solid #F6EFA4;
}

.img-gemy-3 {
	border:8px solid #D1D1D1;
	padding:10px;
}

.img-gemy-3:hover {
	border:8px solid #98BFCB;
}

.img-gemy-4 {
	border:8px solid #D1D1D1;
	padding:10px;
}

.img-gemy-4:hover {
	border:8px solid #DD2C24;
}


.divpro { 
	height:350px;
	text-align:center;
	font-family: cairo; font-size: 13px; color:#000000; text-decoration:none; 

}

.divhost {
	background-color: #FFFFFF;
	margin-bottom:30px;
	margin-top:30px;
	margin-left:6px;
	height:450px;
	text-align:center;
	font-family: cairo; font-size: 15px; color:#000000; text-decoration:none;
	border:1px solid #F5F5F5;
	border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;  
}

.divhost:hover {
	border:1px solid #002840;
}


.buttonln {
	background-color: #002840;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	color: #FFFFFF;
	padding:3px;
	border:2px solid #002840;
	padding-left:20px;
	padding-right:20px;
}

.bgimg-1 {
  position: relative;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height:400px;
}

.bgimg-1 {
  background-image: url("img_serv.jpg");
  position:relative;
}


.rotation-animation {
}

.rotation-animation:hover {
    animation:my-rotation 3s infinite;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
}

@keyframes my-rotation {
	0% { transform:perspective(1000px)  rotateY(0deg); }
	35% { transform:perspective(1000px)  rotateY(360deg); }
	100% { transform:perspective(1000px)  rotateY(360deg); }
}

.centerpage {
    margin: auto;
    width: 85%;
}

#col1 {
	width: 350px;
	float: right;
	margin-left:50px;
}

#col2 {
	width: 350px;
	float: right;
}

.divleft{
	text-align:right;
	float:left;
	width:400px;
	margin-left:15px;
}

.divcenter{
	text-align:right;
	float:left;
	width:50%;
	height:350px;
}


.HiddenText {
    display: none;
	
}

.divcenter:hover .HiddenText {
    display:block;
	background-color: #FFFFFF;
	opacity: 0.6;
	width:100%;
	height:100%;

}


.titel {
	color:#2F3B47;
	font-family: cairo;
	font-size:40px;
	padding:2px;
}

.fotter {
	background-color:#0D0D0F;
	height:350px;
}


.txttitle {
	color: #000000;
	font-weight: bold;
	font-family: cairo;
	font-size: 18px; 

}

.txttitle2 {
	color: #FFFFFF;
	font-weight: bold;
	font-family: cairo;
	font-size: 14px;
	padding-bottom:5px;
	
}

.txttitle3 {
	color: #666666;
	font-weight: bold;
	font-family: cairo;
	font-size: 14px;
	padding-bottom:5px;
}



.style2 {font-family: cairo; font-size: 10px;}
.style3 {font-family: cairo; font-size: 13px; color:#FFFFFF;}
.style4 {font-family: cairo; font-size: 13px; color:#000000;}
.style5 {color: #000000; font-weight: bold; font-family: cairo; font-size: 12px; }

@media screen and (min-width: 44em) {
  .col-group {
    overflow: hidden;
  }
  .col-group > div {
    float: left;
    width: 50%;
  }
  .col-group > div:nth-child(odd) {
    clear: left;
  }
 
}

@media screen and (min-width: 64em) {
  .col-group > div {
    width: 21%;
  }
  .col-group > div:nth-child(odd) {
    clear: none;
  }
}

@media only screen and (max-width : 1000px) {
  .bgimg-1 {
	height:650px;
  } 
  
.divcenter{
	width:100%;
	}
.fotter {
	height:500px;
}


}