@font-face {
	font-family: amologofont;
	src: url('../fonts/ISOCTEUR.ttf');
}

ul,h2{padding:0;}
body{
	font-family: 'Open Sans', sans-serif;
}

a{
	text-decoration: none;
	color:black;
}
a:hover{
	text-decoration: none;
	color:black;
}
a:active{
	text-decoration: none;
	color:black;
}

.textcenter{
	text-align: center;
}


.amologo{
	font-family: amologofont;	
}


.amosystitle{
	font-size: 2.0em;
}

.itsolutiontitle{
	color:grey;
}
blockquote{
	margin: 0px;
	padding: 0px 0px 0px 15px;

}
.large_text{
	margin-top: 30px;
	margin-bottom: 0px;
	text-align: justify;
}
#sub_text{
	margin: 0px;
	text-align: right;
}
#amo_logo{
	margin-bottom: 5px;
}
#amo_fb{
	margin-top: 5px;
}


#mainmenu li,
#servicesdiv li,
#portfoliodiv li{
	display:inline;
}

#mainmenu li{
	font-weight: 300;
	margin: 0 3.0em;
}

.divtitle{
	position:relative;
	font-weight: 300;
	font-size: 1.5em;
	margin-top: 2.0em;
}

#servicesmenu,#portfoliomenu{margin-bottom: 3.0em;}

#servicesmenu a.selected{
	color:green;
}
#servicesdiv ul,
#portfoliodiv ul,
.amologo ul,#contactdiv ul{	
	list-style: none;
}

#servicesinner td{
	text-align: center;
	padding: 1.0em 0;
}

#servicesmenu li,#portfoliomenu li{
	font-weight: 600;
	margin:0 1.5em;
}

#contactdiv table{
	margin:0 auto;
}

#contactdiv table td{
	padding:0.2em 0;
	text-align: center;
}
#domain:hover{
	content: url('../images/domain_h.png');
	}
#shared_hosting:hover{
	content: url('../images/shared_hosting_h.png');
}
#managed_vps:hover{
	content: url('../images/managed_vps_h.png');
}
#dedicated_server:hover{
	content: url('../images/dedicated_server_h.png');
}
#onegb:hover{
	content: url('../images/onegb_h.png');
}
#cPanel:hover{
	content: url('../images/cPanel_h.png');
}
#daily_backup:hover{
	content: url('../images/daily_backup_h.png');
}
#ssd_hosting:hover{
	content: url('../images/ssd_hosting_h.png');
}
#lightspeed:hover{
	content: url('../images/lightspeed_h.png');
}
#free_seo:hover{
	content: url('../images/free_seo_h.png');
}
#free_migration:hover{
	content: url('../images/free_migration_h.png');
}
#softaculous:hover{
	content: url('../images/softaculous_h.png');
}
#uptime_gurantee:hover{
	content: url('../images/uptime_gurantee_h.png');
}
#management:hover{
	content: url('../images/management_h.png');
}
#promotion:hover{
	content: url('../images/promotion_h.png');
}
#content_generaton:hover{
	content: url('../images/content_generaton_h.png');
}
#mobile_application_development:hover{
	content: url('../images/mobile_application_development_h.png');
}
#native_platforms:hover{
	content: url('../images/native_platforms_h.png');
}
#cross_platform_apps:hover{
	content: url('../images/cross_platform_apps_h.png');
}
#game_development:hover{
	content: url('../images/game_development_h.png');
}
#language:hover{
	content: url('../images/language_h.png');
}
#ecommerce:hover{
	content: url('../images/ecommerce_h.png');
}
#backend:hover{
	content: url('../images/backend_h.png');
}
#html:hover{
	content: url('../images/html_h.png');
}
#wordpress:hover{
	content: url('../images/wordpress_h.png');
}
#cms:hover{
	content: url('../images/cms_h.png');
}
#free_seo:hover{
	content: url('../images/free_seo_h.png');
}
#web:hover{
	content: url('../images/web_h.png');
}
#web_design:hover{
	content: url('../images/web_design_h.png');
}
#consultancy:hover{
	content: url('../images/consultancy_h.png');
}
#supply:hover{
	content: url('../images/supply_h.png');
}
#net:hover{
	content: url('../images/net_h.png');
}
#logo_design:hover{
	content: url('../images/logo_design_h.png');
}
#web_design:hover{
	content: url('../images/web_design_h.png');
}
#cam:hover{
	content: url('../images/cam_h.png');
}
.portfolio_image{
	margin-top: 20px;
	text-align: center;
}
.portfolio_image img{
	text-align: center;
}




#footer{
	width: 100%;
	min-height: 80px;
}
#footer p{
	margin-top: 40px;
}


.svg-wrapper {
  height: 20px;
  position: relative;
  transform: translateY(-50%);
  width: 100px;
}

.shape {
  fill: transparent;
  stroke-dasharray: 140 540;
  stroke-dashoffset: -474;
  stroke-width: 12px;
  stroke: #FF0000;
}
.serv{
	position: absolute;
	top: -2px;
	left: -23px;
}
.shape1 {
  fill: transparent;
  stroke-dasharray: 140 540;
  stroke-dashoffset: -474;
  stroke-width: 12px;
  stroke: #00FF00;  
}
.shape2 {
  fill: transparent;
  stroke-dasharray: 140 540;
  stroke-dashoffset: -474;
  stroke-width: 12px;
  stroke: #00aad4;
}
.port{
	position: absolute;
	top: -2px;
	left: -17px;
}
.cont{
	position: absolute;
	top: -2px;
	left: -25px;
}
@keyframes draw {
  0% {
    stroke-dasharray: 140 540;
    stroke-dashoffset: -474;
    stroke-width: 12px;
  }
  100% {
    stroke-dasharray: 760;
    stroke-dashoffset: 0;
    stroke-width: 4px;
  }
}

.svg-wrapper:hover .shape {
  -webkit-animation: 0.5s draw linear forwards;
  animation: 0.5s draw linear forwards;
}
.svg-wrapper:hover .shape1 {
  -webkit-animation: 0.5s draw linear forwards;
  animation: 0.5s draw linear forwards;
}
.svg-wrapper:hover .shape2 {
  -webkit-animation: 0.5s draw linear forwards;
  animation: 0.5s draw linear forwards;
}
.loader-wrap {
  margin: 0 auto;
  background-color:#fff;
}

.loader-svg {
  width: 250px; 
  margin: 0 auto;
  display: block;
  margin-top: 5%;
}

// ANIMATIONS

// Icon animation
@-webkit-keyframes loader {
  33%  { -webkit-transform: translate3d(0,-95px,0); }
  66%  { -webkit-transform: translate3d(-95px,-95px,0); }
  100% { -webkit-transform: translate3d(-194px,-95px,0); }
}

@keyframes loader {
  33%  { transform: translate3d(0,-95px,0); }
  66%  { transform: translate3d(-95px,-95px,0); }
  100% { transform: translate3d(-194px,-95px,0); }
}

@-moz-keyframes loader {
  33% { transform: translate3d(0,-95px,0); }
  66% { transform: translate3d(-95px,-95px,0); }
  100% { transform: translate3d(-194px,-95px,0); }
}

@-ms-keyframes loader {
  33%  { transform: translate3d(0,-95px,0); }
  66%  { transform: translate3d(-95px,-95px,0); }
  100% { transform: translate3d(-194px,-95px,0); }
}

// Rotate Circle
@-webkit-keyframes loader-rotate {
  from { -webkit-transform: rotate(0); }
  to   { -webkit-transform: rotate(360deg); }
}

@keyframes loader-rotate {
  from { transform: rotate(0); }
  to   { transform: rotate(360deg); }
}

@-moz-keyframes loader-rotate {
  from { transform: rotate(0); }
  to   { transform: rotate(360deg); }
}

@-ms-keyframes loader-rotate {
  from { transform: rotate(0); }
  to   { transform: rotate(360deg); }
}

#test-svg {
  max-width: 100%;
  width: 100%;
  margin: auto;
}
path {
  stroke-width: 3;
  animation-fill-mode: forwards;
  animation-iteration-count: 1;
  animation-name: drawbox;
  animation-timing-function: linear;
}
#case {
  stroke: #666;
  stroke-dasharray: 2810;
  stroke-dashoffset: 2810;
  animation-duration: 3s;
}
#cooler {
  stroke: #ddd;
  stroke-dasharray: 300;
  stroke-dashoffset: 300;
  animation-duration: 2s;
  animation-delay: 4s;
}
#structure {
  stroke: #999;
  stroke-dasharray: 680;
  stroke-dashoffset: 680;
  animation-duration: 3s;
  animation-delay: 2s;
}

@keyframes drawbox {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes showbox {
  to {
    opacity: 1;
  }
}

@media screen and (max-width: 460px) {
#mainmenu li{
	font-weight: 300;
	margin: 0 2.0em;
}

}

@media screen and (max-width: 360px) {
#mainmenu li{
	font-weight: 300;
	margin: 0 1.5em;
}
.large_text{
	font-size: 10pt;
}
#footer p{
	font-size: 9pt;
}
}

@media screen and (max-width: 320px) {
	#mainmenu li{
	font-weight: 300;
	margin: 0 1.0em;
}

.shape {
 width: 80px !important;
}
.serv{
	position: absolute;
	top: -2px;
	left: -10px !important;
}
.shape1 {
 	width: 95px !important;
}
.shape2 {
	width: 80px !important;
}
.port{
	position: absolute;
	top: -2px;
	left: -10px !important;
}
.cont{
	position: absolute;
	top: -2px;
	left: -10px !important;
}

}

@media screen and (max-width: 280px) {
	#mainmenu li{
	font-weight: 200 !important;
	margin: 0 0.3em;
}
.loader-svg {
  width: 200px !important; 
  margin: 0 auto;
  display: block;
  margin-top: 10%;
}
.svg-wrapper {
  height: 20px;
  position: relative;
  transform: translateY(-50%);
  width: 60px;
}
.shape {
 width: 70px !important;
}
.serv{
	position: absolute;
	top: -2px;
	left: -5px !important;
}
.shape1 {
 	width: 85px !important;
}
.shape2 {
	width: 70px !important;
}
.port{
	position: absolute;
	top: -2px;
	left: -5px !important;
}
.cont{
	position: absolute;
	top: -2px;
	left: -5px !important;
}
}