/*
html{
 box-sizing:border-box;
}
*, *:before, *:after{

box-sizing:inherit;
}

body{
font-family:Courier New;
margin:0px;
padding:0px;
 
} */


/* Addition 1 on Saturday 03/09/2016 Ends Here   */
.wrapper{
 max-width:1000px; /* max-width:1500px; */
 margin:0 auto;
 background:rgba(0,0,0,0.1);
 
 /* padding:50px; /* Old */
 
}

/* Addition 2 on Saturday 03/09/2016 Starts Here */


/*
input{
   padding:10px;
   border:0;
}
#form{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  
  
} */
section, footer{
  text-align:center;
  /* background:rgba(0,0,0,0.1); */
  padding:20px;
  margin:0px;
  color:white;
  font-weight:100;
}


@media all and (max-width:1000px){ /* ############## (1). First Media Item Starts Here ###########  */

 
/* ------- My own coade starts here ---------- */
  .sec_main_body{
    flex-wrap:wrap; 
  }

  .sections_main_city_fc{
	 flex-wrap:wrap; 
  }
  

  
  .tbl tr td {flex-wrap:wrap;}
  
  
  
  
/* -------- My own code ends here --------------- */ 
   
/* Addition 4 on Saturday 03/09/2016 Ends Here   */
}/*  ############################## (1). First Media Item Ends Here ###############################  */



@media all and (max-width:500px){/* %%%%%%%%%%%%%%% (2). Second Media Item Starts Here %%%%%%%%%%%%  */


   /* Flex Container */
   .wrapper{
      display:flex;
	  flex-direction:column;
   }
   /* Flex Item */
   .wrapper > *{
     order:9999;  
   }
   
   .scopic_tbl_1{
     order:4;
   }
   .scopic_tbl_3{
      order:6;
   }
   .scopic_tbl_4{
      order:7;
   }
   
/* --------- My own code Starts Here ----------  */
.scopic_tbl_2{order:5;}

.sec_main_body{order:3;}
/*.main_content{
  display:flex;
  flex-direction:column;
  

}*/.content{flex:1; width:100%;}

.sections_main_city_fc{
	display:flex;
    flex-direction:column;

}.city_fc{flex:1; width:100%;}

.tbl tr td {display:flex; flex-direction:column;}






/* --------- My own code Ends Here ----------  */   

}/*  %%%%%%%%%%%%%%%%%%%%%%%%%% (2). Second Media Item Ends Here %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%  */

/* ++++++++++++++ Flex Container Ends Here +++++++++++++ */


/* $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ Styling for the Main Content starts Here $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ */
.main_content{
display:flex;
border:0px solid red;
padding:0px;
margin:0px;
justify-content:center;

}

/* -------------Side Menu Starts Here ---------------------*/
.side_menu{
flex:1;
border:0px solid white;
}
.side_menu ul{
 border:0px solid #663399;
 list-style:none;
 margin-bottom:1px;
 padding:0px;
 display:flex;
 flex-direction:column;
 background-image: linear-gradient(260deg, #2376ae 0%, #c16ecf 100%);
} .side_menu ul li{
                   margin-bottom:1px;
               }
			 
.climate_content{
  background-image: linear-gradient(260deg, #00FFFF 0%, #008000 100%);
  display:none;
  
 
}
/* .climate_content > a{} */			 
			 

/* -------------Side Menu Ends Here -------------------------------------*/
/* ======================================================= */
/* ------------- Class "satellite_n_fc" starts Here ---------------------*/
.satellite_n_fc{
display:flex;
flex:3;
border:0px solid black;
padding:0px;
margin:0px;
}

.latest_sat_pic{
flex:1;
border:0px solid green;
min-width:0px;
padding:0px;
display:flex;


}

						
.main_city_fc{
display:flex;
flex-direction:column;
justify-content:center;

}
.header_main_city_fc>header{font:18px bold sans-serif; font-weight:900; margin-bottom:5px;}
.sections_main_city_fc{
display:flex;
justify-content:center;
}
.city_fc{flex:1;}
.fc2{
margin-left:1px;
margin-right:1px;
}
.fc_headers{
padding:5px;
border:0px solid red;
border-bottom:1px solid #00FFFF;
}
/*
.fc3{border:1px solid red;}
.fc1{border:1px solid white;}
.fc2{border:1px solid blue;} */

.tbl{
display:flex;
flex-direction:column;
margin-top:4px;
border:0px solid red;

}


/* ------------- Class "satellite_n_fc" ends Here ---------------------*/
/* ======================================================= */