.bg-darkblue {
    /*background-image: url(../../images/flag.jpg);
    background-position: center center;
    background-repeat: no-repeat;*/
    background-attachment:fixed;
    background-size: cover;
    background-color: #2173b5;
}

.bg-darkgreen {
    background-attachment:fixed;
    background-size: cover;
    background-color: #0D8800;
}

.text-darkblue {
    color: #2173b5;
}

.width-40 {
   max-width: 40%;
}

.outer {
   display: table;
   width: 100%;
  }

.inner {
   display: table-cell;
   vertical-align: middle;
   height: 100%;
   width: 32px;
   /*border: 1px solid blue;*/
  }

.bg_head {
    background-image: url(../../images/bot1.png) !important;
    background-position: top center;
    background-repeat: no-repeat;
	background-size: 100%;
}

/* monitors and laptops */
@media screen and (min-width: 1240px)  {
	body { font-size: 0.9vw; }
	.ui_sur{
		max-width:70%;
	}
	.area{
		font-size: 4.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 0.9vw;
   }
}

/* tablet */
@media screen and (min-width: 1024px) and (max-width: 1240px)  {
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:85%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
	body { font-size: 1.8vw; }
    .ui_sur{
		max-width:100%;
	}
    .area{
		font-size: 5.5vw;
	}
   .firstinfo .profileinfo h3 {	
        font-size: 1.8vw;
   }	
}

/* mobile */
@media screen and (max-width: 768px) {
	body { font-size: 2.2vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 2.2vw;
   }	
}

/* mobile */
@media screen and (max-width: 768px) and (orientation : landscape) {
	body { font-size: 3vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 3vw;
   }	
}

/* iPad in portrait & landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)  {
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

/* iPad in landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

/* iPad in portrait */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

/* Retina iPad in portrait & landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 2) {
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

/* Retina iPad in landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 2) {
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

/* Retina iPad in portrait */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio: 2) {
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

/* iPad 1 & 2 in portrait & landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 1){
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

/* iPad 1 & 2 in landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio: 1)  {
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

/* iPad 1 & 2 in portrait */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio: 1) {
	body { font-size: 3.2vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 3.2vw;
   }	
}

/* iPad mini in portrait & landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 1)  {
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

/* iPad mini in landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio: 1)  {
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

/* iPad mini in portrait */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio: 1)  {
	body { font-size: 2vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 2vw;
   }	
}

/* iPhone 5 in portrait & landscape */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) {
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

/* iPhone 5 in landscape */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape) {
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

/* iPhone 5 in portrait */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : portrait) {
	body { font-size: 3vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 3vw;
   }	
}

/* iPhone 2G-4S in portrait & landscape */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

/* iPhone 2G-4S in landscape */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) {
	body { font-size: 1.4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 1.4vw;
   }	
}

/* iPhone 2G-4S in portrait */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) {
	body { font-size: 4vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 4vw;
   }	
} 

/* iPhone 2G-4S in portrait */
@media only screen and (min-device-width : 240px) and (max-device-width : 320px) and (orientation : portrait) {
	body { font-size: 4.8vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 4.8vw;
   }	
} 
   
/* iPhone 2G-4S in portrait */
@media only screen and (min-device-width : 101px) and (max-device-width : 240px) and (orientation : portrait) {
	body { font-size: 4.8vw; }
	.ui_sur{
		max-width:100%;
	}
	.area{
		font-size: 5.5vw;
	}	
   .firstinfo .profileinfo h3 {	
        font-size: 4.8vw;
   }	
}