


/* ##### DGMAN CSS STYLESHEET ##### */

html 
{ 
}

.LabelCaptcha
{
margin-right: 120px;
}

#forecastUpdate
{
position: absolute;
top: 0px;
left: 30px;
}

.overlaySymbolsRight img, .overlaySymbolsLeft img
{
background: rgba(51, 102, 153, 0.5);
border-radius: 10px;
padding: 2px;
}

.overlayTemperaturRight, .overlayTemperaturLeft
{
color: white;
text-shadow: 1px 1px #000;
}

#stationSelect
{
width: 298px;
border: 0px;
}

body
{
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 85%;
	margin: 0px;
	background-color: rgb(200,200,200);
	background-image: url(/opencms/export/system/modules/om.gov.met.website/resources/images/bg.png); 
}

#DGMAN-SETTINGS img
{
	height: 25px;
}

#DGMAN-WRAPPER		
{
	margin: 0px auto;
	width: 935px;
	background: none repeat scroll 0 0 #FFFFFF;
	box-shadow: 0px 0px 5px black;
	position:relative;
}

#DGMAN-HEADER {display: block; width:935px; height: 312px;}

#DGMAN-BANNER	
{
	margin: 0px auto;
	width:935px;
	height: 270px;
	background-image: url(/opencms/export/system/modules/om.gov.met.website/resources/images/header_ar.jpg);
	border-top: 3px solid #373737;
	border-bottom: 2px solid #373737;
}

#DGMAN-MENU	
{
	background: #336699 ;
	display: block;
	width:935px;
	height: 35px;
	position: absolute;
	border-bottom: 2px solid #373737;
}

#DGMAN-LINKS	
{
	position: relative;
	float: right;
	color: #FFF;
	height: 35px;
	width: 725px;
}

.DGMAN-SETTINGS	
{
	display: block;
	float: right;
	width:200px;
	height: 35px;
	overflow: visible;
	position: absolute;
	right: 735px;
	z-index: 105;
}

#DGMAN-SETTINGS
{
	width: 30px;
	position: relative;
	float: right;
	margin-left: 6px;
	line-height: 50px
}

.SETTINGS-CONTENT
{
	width: 175px;
	background-color: #336699;
	float:left;
	overflow: visible;
	position: relative;
	z-index: 100;
	display: none;
	top: -15px;
	padding-bottom: 15px;
	border-right: 2px solid #373737;
	border-bottom: 2px solid #373737;
	text-align: right;
}

#selectwidget
{
	border: 0px;
	color: rgb(13,82,128);
	margin-right: 10px;
	width: 150px;
}

.selectbutton
{
	margin-right: 10px;
	margin-top: 10px;
	color: rgb(13,82,128);
	padding: 2px;
	background-color: #FFF;
}

.SETTINGS-CONTENT p {	color: #FFF;	margin-right: 10px; margin-top: 10px;}

.LOGINFIELD {	color: rgb(13,82,128);	border: 0px; width: 150px;}


#DGMAN-LANGUAGE 
{
	display: block;
	float: right;
	position: relative;
	z-index: 105;
	margin-right: 20px;
	width: 140px;
	text-align: left;
}

#DGMAN-LANGUAGE img {
	margin-top: 11px;
	padding-left: 20px;
}


#DGMAN-CONTENT	{display: inline-block;}

.datenews 
{
	padding: 5px;
}

.datenews p {line-height: 0px; text-align: left;}

#DGMAN-WIDGETAREA
{
	clear: both;
	min-height: 400px;
}


h1 {margin-top: 0px;}
h3 {color: white; padding: 10px;}

.widgetContent {display: block; color: black;}

.widgetContent p {padding: 10px;}
.widgetContent table {padding: 10px;}

.PageContent, #PageContent
{
	width: 935px;
	z-index: 3;
	padding: 0px;
	color: black;
	margin-right: 7px;
	display: inline-block;
	float: right;
	position: relative;
	margin-right: 0px;
}

#DynamicWidgetColumnSingleSize
{
	width: 300px;
	float: right;
	position: relative;
	margin-top:10px;
	margin-right:10px;
}

#DynamicWidgetColumnDoubleSize
{
	width: 600px;
	float: right;
	position: relative;
	margin-top:10px;
	margin-right:8px;
}

#localForecast
{
	width: 280px;
	height: 500px;
	z-index: 3;
}

#localForecast li
{
	color: white;
	margin-top: 0;
	padding: 10px;
}

#News ul
{
	color: white;
	margin-top: 0;
	padding: 10px;
}

#AboutUs
{
	width: 870px;
	min-height: 150px;
	padding: -5px;
	margin-top: 10px;
}

#ContentFormat
{
	color: #FFF;
	padding: 20px;
	font-size: 15px;
	line-height: 20px;
}


#Youtube
{
	padding: 3px;
	z-index: 3;
	vertical-align: center;
	width: 280px;
	height: 120px;
}

#DGMAN-FOOTER	
{
	background: #336699 ;
	width:935px;
	display: inline-block;
	margin-bottom: -4px;
}

#DGMAN-COPYRIGHT
{
	color: #FFF;
	margin-right: 20px;
	line-height: 32px;
	text-align: center;
	//width: 400px;
	//float: right;
}

#DGMAN-FOOTERMENU 
{
	width: 500px;
	float: right;
}	

#DGMAN-FOOTERMENU li
{
	overflow: hidden;
	color: #FFF;
	float: right;
	list-style: none;
	line-height: 32px;
	margin-right: 30px;
}	


/**
 * Map Examples Specific
 */
.map {                                                                                                                                                                                                                                           
        width: 563px;                                                                                                                                                                                                                                
        height: 353px;                                                                                                                                                                                                                               
        border: 1px solid #ccc;                                                                                                                                                                                                                      
        padding: 3px;
} 
#receiver
{
margin-left: 490px;
}

.LabelCaptcha
{
padding-left: 480px;
}

form,input,select,textarea{margin:0; padding:0; color:#000;}

div.box {
width:850px;
position:relative;
margin-top: 20px;
}

div.box label {
width:100%;
display: block;
padding:10px 0 10px 0;
}

div.box label span {
display: block;
float:right;
width:100px;
text-align:left;
padding:5px 20px 0 0;
}

div.box .input_text {
padding:10px 10px;
width:200px;
background-color: #E9E9E9;
border: 1px; solid;
margin-left: 475px;
}

div.box .message{
padding:7px 7px;
width:680px;
max-width:680px;
background-color: #E9E9E9;
overflow:hidden;
height:150px;
border: 1px;
}

div.box .button
{
margin:0 0 30px 0;
padding:4px 7px;
background-color: #E9E9E9;
border:0px;
position: relative;
right: 715px;
width:100px;
color: black;
}

/* OUR SERVICES */

section{
		float: right;
		padding-top: 10px;
		padding-bottom: 10px;
		width: 100%;
		padding-right:0;
		padding-left:0;
}

#icon-wrapper{
	width:100%;
	float:right;
	height:70px;
}

.icons {
	width:7%;
	float:right;
	position:relative;
}
.icons2 {
	width:7%;
	float:right;
	position:relative;
	margin-right:7%;
}
.icons3 {
	width:7%;
	float:right;
	position:relative;
	margin-right:14%;
}
.icons4 {
	width:7%;
	float:right;
	position:relative;
	margin-right:21%;
}

.icons5 {
	width:7%;
	float:right;
	position:relative;
	margin-right:28%;
}

.icons6 {
	width:7%;
	float:right;
	position:relative;
	margin-right:35%;
}
.icons7 {
	width:7%;
	float:right;
	position:relative;
	margin-right:42%;
}
.icons8 {
	width:7%;
	float:right;
	position:relative;
	margin-right:49%;
}
.icons9 {
	width:7%;
	float:right;
	position:relative;
	margin-right:56%;
}

.icons10 {
	width:7%;
	float:right;
	position:relative;
	margin-right:63%;
}

.icons11 {
	width:7%;
	float:right;
	position:relative;
	margin-right:70%;
}

.icons12 {
	width:7%;
	float:right;
	position:relative;
	margin-right:77%;
}

.icons13 {
	width:7%;
	float:right;
	position:relative;
	margin-right:84%;
}

.icons14 {
	width:7%;
	float:right;
	position:relative;
	margin-right:91%;
}

.icon-slide-container{
	height:50px;
	overflow:hidden;
	/*text-align: right;*/
	position: absolute;
	float: right;
	width: 50px;
}

.slide-icon{
  width:50px;
  height:auto;
  position:absolute;
  margin-top:-50px;
  -webkit-transition:.4s ease;
  -moz-transition:.4s ease;
  -ms-transition:.4s ease;
  -o-transition:.4s ease;
  transition:.4 ease;
}
	
.slide-icon:hover{
  position:absolute;
  margin-top:0;
}

/* SOCIAL MEDIA FOOTER */

#buttons {
    padding: 14px 7px;
    overflow: hidden;
}


.button {
    background: #DCE0E0;
    position: relative;
    display: block;
    float: right;
    height: 40px;
    margin: 0 7px;
    overflow: hidden;
    width: 150px;
    border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

.icon {
    display: block;
    float: right;
    position: relative;
    z-index: 3;
    height: 100%;
    vertical-align: top;
    width: 38px;
    -moz-border-radius-topright: 3px;
    -moz-border-radius-topleft: 0px;
    -moz-border-radius-bottomleft: 0px;
    -moz-border-radius-bottomright: 3px;
    -webkit-border-radius: 3px 0px 0px 3px;
    border-radius: 3px 0px 0px 3px;
    text-align: center;
}

.icon i {
    color: #fff;
    line-height: 42px;
}

.slide {
    z-index: 2;
    display: block;
    margin: 0;
    height: 100%;
    right: 38px;
    position: absolute;
    width: 112px;
    -moz-border-radius-topright: 0px;
    -moz-border-radius-topleft: 3px;
    -moz-border-radius-bottomleft: 3px;
    -moz-border-radius-bottomright: 0px;
    -webkit-border-radius: 0px 3px 3px 0px;
    border-radius: 0px 3px 3px 0px;
}

.slide p {
    font-family: Open Sans;
    font-weight: 400;
    border-right: 1px solid #fff;
    border-right: 1px solid rgba(255,255,255,0.35);
    color: #fff;
    font-size: 16px;
    right: 0;
    margin: 0;
    position: absolute;
    text-align: center;
    top: 10px;
    width: 100%;
}

.button .slide {
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.facebook iframe {
    display: block;
    position: absolute;
    left: 16px;
    top: 10px;
    z-index: 1;
}

.twitter iframe {
    width: 90px !important;
    left: 5px;
    top: 10px;
    z-index: 1;
    display: block;
    position: absolute;
}

.google #___plusone_0 {
    width: 70px !important;
    top: 10px;
    left: 15px;
    position: absolute;
    display: block;
    z-index: 1;
}

.linkedin .IN-widget {
    top: 10px;
    left: 22px;
    position: absolute;
    display: block;
    z-index: 1;
}

.facebook:hover .slide {
    right: 150px;
}

.twitter:hover .slide {
    top: -40px;
}

.google:hover .slide {
    bottom: -40px;
}

.linkedin:hover .slide {
    right: -150px;
}

.facebook .icon, .facebook .slide {
    background: #305c99;
}

.twitter .icon, .twitter .slide {
    background: #00cdff;
}

.google .icon, .google .slide {
    background: #d24228;
}

.linkedin .icon, .linkedin .slide {
    background: #007bb6;
}

.DGMAN-FOOTER-GREY
{
	float: right;
	position: relative;
	background: #DCE0E0;
	border-top: 1px dashed grey;
	width: 100%;
}

.DGMAN-FOOTER-SOCIAL img
{
	width: 50px;
	position: relative;
	float: right;
	margin: 0px 5px 10px 0px;
	 -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    /* ...and now for the proper property */
    transition:.5s;
	opacity: .5;
}

.DGMAN-FOOTER-SOCIAL img:hover
{
	opacity: 1;
}

.DGMAN-FOOTER-SOCIAL
{
	width: 50%;
	float: right;
	margin-right: 10px;
	margin-top: 10px;
}

.DGMAN-FOOTER-LINKS
{
	width: 50%;
	float: right;
}

.wms-topic
{
font-size: 120%;
background: #336699;
color: white;
width: 904px;
padding: 5px;
float: right;
position: relative;
direction: rtl;
}

.wms-topic-toggle
{
 float: left;
}

.wmsLabelAvailable
{
	color:black;
}

.wmsLabelNotAvailable
{
	color:#A0A0A0;
}

.wmsLayer
{
float: right;
width: 180px;
font-size: 12px;
}

#dataLayers, #overlayLayers, #avail, #amount
{
float: right;
width: 914px;
background: white;
line-height: 30px;
position: relative;
}

#map
{
float: right;
position: relative;
}

.OmanMap
{
	margin-right: 55px;
	padding-bottom: 20px;
	float: right;
	margin-top: 10px;
}

#temp_chart_div, #rain_bar_div
{
	margin-left: 10px
}

